/* 定制剧场 · 剧内简讯（严格限定在 #custom-theater-app） */ #custom-theater-app .ctm-floating-bubble { position: absolute; z-index: 24; width: 52px; height: 52px; padding: 4px; display: grid; place-items: center; align-content: center; gap: 1px; border: 1px solid rgba(255,255,255,.78); border-radius: 50%; color: #fff; background: linear-gradient(145deg, #697585, #404b59); box-shadow: 0 8px 22px rgba(32,37,45,.28), inset 1px 1px 0 rgba(255,255,255,.32); cursor: pointer; touch-action: none; -webkit-user-select: none; user-select: none; } #custom-theater-app .ctm-floating-bubble > span { font-size: 17px; line-height: 1; } #custom-theater-app .ctm-floating-bubble > small { font: 700 7px/1 "Microsoft YaHei", sans-serif; } #custom-theater-app .ctm-floating-bubble.is-dragging { transform: scale(1.08); opacity: .9; } #custom-theater-app .ctm-floating-bubble.ctm-style-wechat { background: linear-gradient(145deg, #4dcf72, #21934a); } #custom-theater-app .ctm-floating-bubble.ctm-style-qq { background: linear-gradient(145deg, #57aef3, #2675c6); } #custom-theater-app .ctm-floating-bubble.ctm-style-ins { background: linear-gradient(145deg, #b04cc9, #d76275 55%, #e8a340); } #custom-theater-app .ctm-floating-bubble.ctm-style-custom { background: linear-gradient(145deg, #9a6b68, #4d5867); } #custom-theater-app .ctm-app { position: absolute; z-index: 32; inset: 0; box-sizing: border-box; padding: 8px max(8px, var(--ct-safe-right)) calc(8px + var(--ct-safe-bottom)) max(8px, var(--ct-safe-left)); background: rgba(37,40,45,.34); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } /* 所有区域仍可触控/滚轮滚动，但不显示浏览器与 WebView 滚动条。 */ #custom-theater-app .ctm-app, #custom-theater-app .ctm-app * { scrollbar-width: none; -ms-overflow-style: none; } #custom-theater-app .ctm-app::-webkit-scrollbar, #custom-theater-app .ctm-app *::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none; background: transparent; } #custom-theater-app .ctm-phone { position: relative; width: min(100%, 620px); height: 100%; margin: 0 auto; overflow: hidden; display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,.58); border-radius: 24px; color: #1f2429; background: #f2f2f2; box-shadow: 0 18px 48px rgba(23,27,33,.3), inset 1px 1px 0 rgba(255,255,255,.62); } #custom-theater-app .ctm-app-bar { flex: 0 0 auto; min-height: 44px; padding: 0 12px 0 max(17px, calc(var(--ct-safe-left) + 9px)); display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #656b71; background: rgba(245,245,245,.96); border-bottom: 1px solid #dedede; font-size: 9px; letter-spacing: .04em; } #custom-theater-app .ctm-app-bar span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-app-bar button { width: 32px; height: 32px; border: 0; border-radius: 50%; color: #4d535a; background: rgba(0,0,0,.055); font-size: 18px; cursor: pointer; } #custom-theater-app .ctm-phone > main { position: relative; flex: 1 1 0; min-height: 0; overflow: hidden; } #custom-theater-app .ctm-page { box-sizing: border-box; height: 100%; overflow-y: auto; padding: 0 max(17px, calc(var(--ct-safe-right) + 9px)) 25px max(17px, calc(var(--ct-safe-left) + 9px)); -webkit-overflow-scrolling: touch; overscroll-behavior: contain; } #custom-theater-app .ctm-page-title { min-height: 66px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; padding: 0 3px 12px; } #custom-theater-app .ctm-page-title strong { font-size: 21px; } #custom-theater-app .ctm-page-title small { max-width: 50%; overflow: hidden; color: #8a8f94; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-list { overflow: hidden; border-radius: 13px; background: #fff; } #custom-theater-app .ctm-list-row { box-sizing: border-box; width: 100%; min-height: 65px; padding: 9px 11px; display: grid; grid-template-columns: 45px minmax(0,1fr) auto; align-items: center; gap: 10px; border: 0; border-bottom: 1px solid #ededed; color: inherit; background: #fff; text-align: left; cursor: pointer; } #custom-theater-app .ctm-list-row:last-child { border-bottom: 0; } #custom-theater-app .ctm-avatar, #custom-theater-app .ctm-user-avatar { display: grid; place-items: center; overflow: hidden; border-radius: 9px; color: #fff; background: linear-gradient(145deg,#798491,#47525f); font-weight: 800; } #custom-theater-app .ctm-avatar { width: 45px; height: 45px; font-size: 14px; } #custom-theater-app .ctm-user-avatar { width: 64px; height: 64px; border-radius: 12px; font-size: 18px; } #custom-theater-app .ctm-avatar img, #custom-theater-app .ctm-user-avatar img { width: 100%; height: 100%; object-fit: cover; } #custom-theater-app .ctm-laomi-avatar { background: linear-gradient(145deg,#f0b6b1,#a96e6b); } #custom-theater-app .ctm-list-copy { min-width: 0; } #custom-theater-app .ctm-list-copy strong, #custom-theater-app .ctm-list-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-list-copy strong { font-size: 12px; font-weight: 600; } #custom-theater-app .ctm-list-copy strong em { margin-left: 6px; padding: 2px 4px; border-radius: 4px; color: #fff; background: #ef8d88; font-size: 6px; font-style: normal; } #custom-theater-app .ctm-list-copy small { margin-top: 6px; color: #92979c; font-size: 8px; } #custom-theater-app .ctm-list-row time { align-self: start; margin-top: 3px; color: #b2b5b8; font-size: 7px; } #custom-theater-app .ctm-section-label { padding: 13px 4px 6px; color: #8e9398; font-size: 8px; } #custom-theater-app .ctm-tabbar { flex: 0 0 auto; box-sizing: border-box; min-height: 56px; padding: 4px max(17px, calc(var(--ct-safe-right) + 9px)) 5px max(17px, calc(var(--ct-safe-left) + 9px)); display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid #d9d9d9; background: rgba(247,247,247,.97); } #custom-theater-app .ctm-tabbar button { display: grid; justify-items: center; align-content: center; gap: 2px; border: 0; color: #7d8287; background: transparent; font: 8px/1.2 inherit; cursor: pointer; } #custom-theater-app .ctm-tabbar i { font-size: 16px; font-style: normal; } #custom-theater-app .ctm-tabbar button.is-active { color: #19a84b; } #custom-theater-app .ctm-discover-entry { box-sizing: border-box; width: 100%; min-height: 61px; padding: 9px 12px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 10px; border: 0; border-radius: 13px; color: inherit; background: #fff; text-align: left; cursor: pointer; } #custom-theater-app .ctm-discover-entry > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: #ef6d6d; font-size: 20px; } #custom-theater-app .ctm-discover-entry strong, #custom-theater-app .ctm-discover-entry small { display: block; } #custom-theater-app .ctm-discover-entry strong { font-size: 12px; } #custom-theater-app .ctm-discover-entry small { margin-top: 4px; color: #92979c; font-size: 8px; } #custom-theater-app .ctm-discover-entry i { color: #aaa; font-size: 18px; font-style: normal; } #custom-theater-app .ctm-moments-head { margin: 17px 2px 8px; display: flex; align-items: center; justify-content: space-between; gap: 8px; } #custom-theater-app .ctm-moments-head strong { font-size: 11px; } #custom-theater-app .ctm-moments-head button { min-height: 30px; padding: 0 9px; border: 0; border-radius: 9px; color: #fff; background: #4f9568; font: 700 8px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-moments { display: grid; gap: 8px; } #custom-theater-app .ctm-moment { padding: 12px; display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 10px; border-radius: 13px; background: #fff; } #custom-theater-app .ctm-moment .ctm-avatar { width: 42px; height: 42px; } #custom-theater-app .ctm-moment > div { min-width: 0; } #custom-theater-app .ctm-moment > div > strong { color: #576b95; font-size: 10px; } #custom-theater-app .ctm-moment > div > p { margin: 6px 0; overflow-wrap: anywhere; font-size: 10px; line-height: 1.6; } #custom-theater-app .ctm-moment time { color: #a0a4a8; font-size: 7px; } #custom-theater-app .ctm-comments { margin-top: 8px; padding: 6px 8px; border-radius: 7px; background: #f3f4f5; } #custom-theater-app .ctm-comments p { margin: 2px 0; font-size: 8px; line-height: 1.45; } #custom-theater-app .ctm-comments strong { color: #576b95; } #custom-theater-app .ctm-empty { padding: 24px 15px; border-radius: 12px; color: #90959a; background: rgba(255,255,255,.7); font-size: 9px; line-height: 1.65; text-align: center; } #custom-theater-app .ctm-me-card { padding: 14px; display: grid; grid-template-columns: 64px minmax(0,1fr); align-items: center; gap: 13px; border-radius: 15px; background: #fff; } #custom-theater-app .ctm-me-card > div > strong, #custom-theater-app .ctm-me-card > div > small { display: block; } #custom-theater-app .ctm-me-card > div > strong { font-size: 14px; } #custom-theater-app .ctm-me-card > div > small { margin-top: 4px; color: #92979c; font-size: 8px; } #custom-theater-app .ctm-file-button { position: relative; margin-top: 7px; display: inline-grid; place-items: center; min-height: 29px; padding: 0 9px; overflow: hidden; border: 1px solid #d8dadd; border-radius: 8px; color: #59616a; background: #fafafa; font-size: 8px; cursor: pointer; } #custom-theater-app .ctm-file-button input { position: absolute; inset: 0; opacity: 0; cursor: pointer; } #custom-theater-app .ctm-mask-form { margin-top: 11px; padding: 14px; display: grid; gap: 12px; border-radius: 15px; background: #fff; } #custom-theater-app .ctm-mask-form > header { display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 9px; } #custom-theater-app .ctm-mask-form > header > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #596371; font-size: 19px; } #custom-theater-app .ctm-mask-form > header strong, #custom-theater-app .ctm-mask-form > header small { display: block; } #custom-theater-app .ctm-mask-form > header strong { font-size: 12px; } #custom-theater-app .ctm-mask-form > header small { margin-top: 3px; color: #969a9e; font-size: 8px; } #custom-theater-app .ctm-mask-form > label > span { display: block; margin-bottom: 5px; color: #70757a; font-size: 8px; } #custom-theater-app .ctm-mask-form textarea { box-sizing: border-box; width: 100%; min-height: 92px; padding: 10px; resize: vertical; border: 1px solid #dddfe1; border-radius: 10px; outline: 0; color: inherit; background: #fafafa; font: 10px/1.65 inherit; } #custom-theater-app .ctm-mask-form .ctm-polish-option { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: 9px; padding: 10px; border: 1px solid #e0e3e5; border-radius: 10px; background: #fafbfb; cursor: pointer; } #custom-theater-app .ctm-mask-form .ctm-polish-option input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: #4a965f; } #custom-theater-app .ctm-mask-form .ctm-polish-option > span { margin: 0; } #custom-theater-app .ctm-mask-form .ctm-polish-option strong, #custom-theater-app .ctm-mask-form .ctm-polish-option small { display: block; } #custom-theater-app .ctm-mask-form .ctm-polish-option strong { color: #3f464c; font-size: 9px; } #custom-theater-app .ctm-mask-form .ctm-polish-option small, #custom-theater-app .ctm-reference-block > small { margin-top: 4px; color: #858b90; font-size: 7px; line-height: 1.55; } #custom-theater-app .ctm-reference-block { padding-top: 10px; border-top: 1px solid #ededed; } #custom-theater-app .ctm-reference-block > strong { display: block; font-size: 9px; } #custom-theater-app .ctm-reference-block > small { display: block; } #custom-theater-app .ctm-image-strip { margin-top: 7px; display: flex; gap: 7px; overflow-x: auto; } #custom-theater-app .ctm-image-strip figure { position: relative; flex: 0 0 68px; height: 68px; margin: 0; overflow: hidden; border-radius: 9px; background: #eee; } #custom-theater-app .ctm-image-strip img { width: 100%; height: 100%; object-fit: cover; } #custom-theater-app .ctm-image-strip button { position: absolute; right: 3px; top: 3px; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 50%; color: #fff; background: rgba(30,32,35,.68); font-size: 13px; cursor: pointer; } #custom-theater-app .ctm-primary { min-height: 40px; border: 0; border-radius: 10px; color: #fff; background: #4a965f; font: 800 10px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-hide-bubble { box-sizing: border-box; width: 100%; min-height: 39px; margin-top: 11px; border: 1px solid #d6d8da; border-radius: 11px; color: #8d5c59; background: rgba(255,255,255,.7); font: 700 9px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-thread { height: 100%; min-height: 0; display: flex; flex-direction: column; background: #ededed; } #custom-theater-app .ctm-thread > header { flex: 0 0 auto; min-height: 57px; padding: 6px max(17px, calc(var(--ct-safe-right) + 9px)) 6px max(17px, calc(var(--ct-safe-left) + 9px)); display: grid; grid-template-columns: 30px 38px minmax(0,1fr); align-items: center; gap: 8px; border-bottom: 1px solid #d7d7d7; background: #f5f5f5; } #custom-theater-app .ctm-thread > header > button { width: 30px; height: 34px; padding: 0; border: 0; color: #31363b; background: transparent; font-size: 27px; cursor: pointer; } #custom-theater-app .ctm-thread > header .ctm-avatar { width: 38px; height: 38px; } #custom-theater-app .ctm-thread > header strong, #custom-theater-app .ctm-thread > header small { display: block; } #custom-theater-app .ctm-thread > header strong { font-size: 12px; } #custom-theater-app .ctm-thread > header small { margin-top: 3px; color: #8c9196; font-size: 7px; } #custom-theater-app .ctm-thread-messages { flex: 1 1 auto; min-height: 0; padding: 14px max(25px, calc(var(--ct-safe-right) + 17px)) 16px max(25px, calc(var(--ct-safe-left) + 17px)); overflow-y: auto; display: flex; flex-direction: column; gap: 11px; overscroll-behavior: contain; } #custom-theater-app .ctm-message { max-width: 82%; } #custom-theater-app .ctm-message > p { margin: 0; padding: 9px 11px; border-radius: 5px 11px 11px 11px; overflow-wrap: anywhere; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.05); font-size: 10px; line-height: 1.6; white-space: pre-wrap; } #custom-theater-app .ctm-message > time { display: block; margin-top: 3px; color: #999; font-size: 6px; } #custom-theater-app .ctm-motion-description { margin: 0 7px 5px; color: #7b7280; font-family: "STKaiti", "KaiTi", serif; font-size: 8px; line-height: 1.55; text-align: left; overflow-wrap: anywhere; } #custom-theater-app .ctm-message-translation { margin: 4px 6px 0; color: #747b82; font-size: 7px; line-height: 1.55; text-align: left; } #custom-theater-app .ctm-message-translation summary { width: max-content; padding: 2px 0; color: #5e7692; cursor: pointer; list-style: none; font-weight: 700; } #custom-theater-app .ctm-message-translation summary::-webkit-details-marker { display: none; } #custom-theater-app .ctm-message-translation summary::after { content: "⌄"; margin-left: 3px; } #custom-theater-app .ctm-message-translation[open] summary::after { content: "⌃"; } #custom-theater-app .ctm-message-translation > p { margin: 2px 0 0; padding: 7px 8px; border-left: 2px solid currentColor; border-radius: 4px; background: rgba(255,255,255,.5); white-space: pre-wrap; overflow-wrap: anywhere; } #custom-theater-app .ctm-message-translation.is-visible > span { display: block; color: #5e7692; font-weight: 700; } #custom-theater-app .ctm-message.is-sent { align-self: flex-end; } #custom-theater-app .ctm-message.is-sent > p { border-radius: 11px 5px 11px 11px; background: #95ec69; } #custom-theater-app .ctm-message.is-sent > time { text-align: right; } #custom-theater-app .ctm-thread-error { align-self: center; max-width: 88%; padding: 7px 9px; border-radius: 8px; color: #8b5d59; background: rgba(255,245,242,.9); font-size: 8px; line-height: 1.5; text-align: center; } #custom-theater-app .ctm-patch-card { margin-top: 6px; padding: 9px; border: 1px solid #e2c9c5; border-radius: 10px; background: #fff8f5; } #custom-theater-app .ctm-patch-card strong, #custom-theater-app .ctm-patch-card small { display: block; } #custom-theater-app .ctm-patch-card strong { color: #8a5c58; font-size: 9px; } #custom-theater-app .ctm-patch-card p { margin: 5px 0; font-size: 8px; line-height: 1.5; } #custom-theater-app .ctm-patch-card small { color: #999; font-size: 7px; } #custom-theater-app .ctm-patch-card button { min-height: 29px; margin-top: 7px; padding: 0 9px; border: 0; border-radius: 8px; color: #fff; background: #9a6b68; font: 700 8px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-thread-composer { position: relative; flex: 0 0 auto; padding: 8px max(17px, calc(var(--ct-safe-right) + 9px)) calc(8px + var(--ct-safe-bottom)) max(17px, calc(var(--ct-safe-left) + 9px)); display: grid; grid-template-columns: 40px minmax(0,1fr) 38px 40px; align-items: end; gap: 7px; border-top: 1px solid #d6d6d6; background: #f7f7f7; } #custom-theater-app .ctm-thread-composer textarea { box-sizing: border-box; width: 100%; min-height: 39px; max-height: 90px; padding: 9px; resize: none; border: 1px solid #ddd; border-radius: 9px; outline: 0; color: inherit; background: #fff; font: 10px/1.55 inherit; } #custom-theater-app .ctm-thread-composer button { min-height: 39px; padding: 0 11px; border: 0; border-radius: 9px; color: #fff; background: #18a74b; font: 800 9px/1 inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; } #custom-theater-app .ctm-thread-composer button:disabled { opacity: .48; cursor: wait; } #custom-theater-app .ctm-thread-composer .ctm-composer-receive, #custom-theater-app .ctm-thread-composer .ctm-composer-send { position: relative; box-sizing: border-box; width: 40px; min-width: 40px; padding: 0; display: grid; place-items: center; overflow: hidden; } #custom-theater-app .ctm-control-icon { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/wechat-send.png?v=1.0.0"); width: 25px; height: 25px; display: block; background: currentColor; -webkit-mask: var(--ctm-control-mask) center / contain no-repeat; mask: var(--ctm-control-mask) center / contain no-repeat; pointer-events: none; } #custom-theater-app .ctm-control-icon--receive { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/wechat-receive.png?v=1.0.0"); } #custom-theater-app .ctm-control-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } #custom-theater-app .ctm-thread-composer .ctm-composer-receive:active:not(:disabled), #custom-theater-app .ctm-thread-composer .ctm-composer-send:active:not(:disabled) { transform: scale(.92); } #custom-theater-app .ctm-thread-composer .ctm-composer-receive:focus-visible, #custom-theater-app .ctm-thread-composer .ctm-composer-send:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; } #custom-theater-app .ctm-composer-receive.is-busy .ctm-control-icon { animation: ctm-control-breathe .9s ease-in-out infinite alternate; } #custom-theater-app .ctm-thread-composer .ctm-composer-tool { width: 38px; padding: 0; display: grid; place-items: center; color: #4d5963; border: 1px solid rgba(78,88,96,.15); background: #fff; } #custom-theater-app .ctm-thread-composer .ctm-composer-tool svg { width: 22px; height: 22px; } #custom-theater-app .ctm-emoji-panel { position: absolute; z-index: 3; right: max(17px, calc(var(--ct-safe-right) + 9px)); bottom: calc(100% + 7px); width: min(250px, calc(100% - 34px)); padding: 8px; display: grid; grid-template-columns: repeat(5,1fr); gap: 4px; border: 1px solid rgba(60,66,72,.14); border-radius: 14px; background: rgba(255,255,255,.98); box-shadow: 0 12px 28px rgba(27,32,37,.2); } #custom-theater-app .ctm-emoji-panel[hidden] { display: none; } #custom-theater-app .ctm-emoji-panel button { min-height: 34px; padding: 0; color: inherit; background: transparent !important; font-size: 19px; } #custom-theater-app .ctm-style-qq .ctm-tabbar button.is-active { color: #278bd8; } #custom-theater-app .ctm-style-qq .ctm-thread-composer button, #custom-theater-app .ctm-style-qq .ctm-primary { background: #278bd8; } #custom-theater-app .ctm-style-ins .ctm-phone { background: #fafafa; } #custom-theater-app .ctm-style-ins .ctm-tabbar button.is-active { color: #cf477d; } #custom-theater-app .ctm-style-ins .ctm-thread-composer button, #custom-theater-app .ctm-style-ins .ctm-primary { background: linear-gradient(135deg,#bd3d9c,#e06768); } #custom-theater-app .ctm-style-custom .ctm-phone { background: #eee8df; } #custom-theater-app .ctm-style-custom .ctm-tabbar button.is-active { color: #9a6b68; } #custom-theater-app .ctm-style-custom .ctm-thread-composer button, #custom-theater-app .ctm-style-custom .ctm-primary { background: #6b5960; } /* 三套原生构造共用的语义骨架 */ #custom-theater-app .ctm-app svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } #custom-theater-app .ctm-app-bar span { display: flex; min-width: 0; align-items: baseline; gap: 6px; } #custom-theater-app .ctm-app-bar span b { flex: 0 0 auto; color: #444b52; font-size: 9px; } #custom-theater-app .ctm-app-bar span i { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #8c9297; font-size: 8px; font-style: normal; } #custom-theater-app .ctm-title-actions, #custom-theater-app .ctm-thread-actions { display: flex; align-items: center; justify-content: flex-end; gap: 3px; } #custom-theater-app .ctm-chat-settings-button { width: 36px; height: 36px; padding: 7px; display: grid; place-items: center; border: 0; border-radius: 50%; color: inherit; background: transparent; cursor: pointer; } #custom-theater-app .ctm-chat-settings-button:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; } #custom-theater-app .ctm-ornament { width: 34px; height: 34px; padding: 6px; display: grid; place-items: center; border: 0; border-radius: 50%; color: inherit; background: transparent; pointer-events: none; } #custom-theater-app .ctm-inbox-title { min-height: 58px; padding: 8px 2px; align-items: center; } #custom-theater-app .ctm-inbox-title > i { width: 68px; } #custom-theater-app .ctm-inbox-title > div { min-width: 0; } #custom-theater-app .ctm-inbox-title > div strong, #custom-theater-app .ctm-inbox-title > div small { display: block; } #custom-theater-app .ctm-inbox-title > div small { margin-top: 2px; color: #858c93; font-size: 7px; } #custom-theater-app .ctm-search { box-sizing: border-box; width: 100%; min-height: 36px; margin: 0 0 10px; padding: 0 11px; display: flex; align-items: center; gap: 7px; border-radius: 8px; color: #92979b; background: #fff; } #custom-theater-app .ctm-search svg { flex: 0 0 auto; width: 16px; height: 16px; } #custom-theater-app .ctm-search input { min-width: 0; width: 100%; height: 34px; padding: 0; border: 0; outline: 0; color: #24282c; background: transparent; font: 10px/1 inherit; } #custom-theater-app .ctm-search input::-webkit-search-cancel-button { opacity: .45; } #custom-theater-app .ctm-search-empty { margin-top: 10px; padding: 18px 12px; color: #959a9f; font-size: 9px; text-align: center; } #custom-theater-app .ctm-list-row[hidden] { display: none !important; } #custom-theater-app .ctm-title-profile { width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; } #custom-theater-app .ctm-title-avatar { width: 42px; height: 42px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; color: #fff; background: linear-gradient(145deg,#79a9d4,#6b75c8); font-size: 12px; font-weight: 800; } #custom-theater-app .ctm-title-avatar img { width: 100%; height: 100%; object-fit: cover; } #custom-theater-app .ctm-notes { margin: 1px -2px 12px; padding: 4px 2px 8px; display: flex; gap: 12px; overflow-x: auto; scrollbar-width: none; } #custom-theater-app .ctm-notes::-webkit-scrollbar { display: none; } #custom-theater-app .ctm-note { position: relative; flex: 0 0 58px; min-width: 0; padding: 0; display: grid; justify-items: center; gap: 5px; border: 0; color: inherit; background: transparent; cursor: pointer; } #custom-theater-app .ctm-note-avatar { width: 52px; height: 52px; padding: 2px; display: grid; place-items: center; overflow: hidden; border: 2px solid #fff; border-radius: 50%; outline: 2px solid #d84188; color: #fff; background: #777; font-size: 13px; font-weight: 800; } #custom-theater-app .ctm-note-avatar img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; } #custom-theater-app .ctm-note small { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 7px; } #custom-theater-app .ctm-note-bubble { position: absolute; z-index: 1; left: 2px; top: -2px; max-width: 55px; padding: 3px 5px; overflow: hidden; border: 1px solid #e7e7e7; border-radius: 7px; color: #555; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.08); font-size: 6px; text-overflow: ellipsis; white-space: nowrap; transform: translateY(-28%); } #custom-theater-app .ctm-thread > header { grid-template-columns: 30px 38px minmax(0,1fr) auto; } #custom-theater-app .ctm-thread-actions svg { width: 19px; height: 19px; } #custom-theater-app .ctm-message-row { width: 100%; display: flex; align-items: flex-start; gap: 7px; } #custom-theater-app .ctm-message-row.is-sent { justify-content: flex-end; } #custom-theater-app .ctm-message-row.is-received { justify-content: flex-start; } #custom-theater-app .ctm-message-avatar { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; overflow: hidden; border-radius: 7px; color: #fff; background: linear-gradient(145deg,#798491,#47525f); font-size: 10px; font-weight: 800; } #custom-theater-app .ctm-message-avatar img { width: 100%; height: 100%; object-fit: cover; } #custom-theater-app .ctm-message { min-width: 0; max-width: min(76%, 460px); } #custom-theater-app .ctm-message-row.is-sent .ctm-message { text-align: right; } #custom-theater-app .ctm-message-row.is-sent .ctm-message > p { border-radius: 11px 5px 11px 11px; background: #95ec69; text-align: left; } #custom-theater-app .ctm-message-row.is-sent .ctm-message > time { text-align: right; } #custom-theater-app .ctm-thread-composer { grid-template-columns: 40px minmax(0,1fr) 38px 40px; align-items: center; } #custom-theater-app .ctm-composer-send { display: block; } /* 微信：克制灰底、方头像、列表分隔、绿色发送气泡 */ #custom-theater-app .ctm-style-wechat .ctm-phone { color: #191919; background: #ededed; } #custom-theater-app .ctm-style-wechat .ctm-app-bar { color: #626262; background: #e9e9e9; border-color: #d5d5d5; } #custom-theater-app .ctm-style-wechat .ctm-page { padding-left: max(12px, calc(var(--ct-safe-left) + 8px)); padding-right: max(12px, calc(var(--ct-safe-right) + 8px)); } #custom-theater-app .ctm-style-wechat .ctm-inbox-title { display: grid; grid-template-columns: 68px minmax(0,1fr) 68px; text-align: center; } #custom-theater-app .ctm-style-wechat .ctm-inbox-title > strong { font-size: 15px; font-weight: 600; } #custom-theater-app .ctm-style-wechat .ctm-list { border-radius: 4px; } #custom-theater-app .ctm-style-wechat .ctm-list-row { min-height: 66px; padding-left: 10px; padding-right: 8px; } #custom-theater-app .ctm-style-wechat .ctm-avatar { border-radius: 5px; } #custom-theater-app .ctm-style-wechat .ctm-list-copy strong { font-size: 11px; } #custom-theater-app .ctm-style-wechat .ctm-search { border-radius: 5px; color: #8f8f8f; } #custom-theater-app .ctm-style-wechat .ctm-tabbar { background: #f7f7f7; } #custom-theater-app .ctm-style-wechat .ctm-tabbar button.is-active { color: #07c160; } #custom-theater-app .ctm-style-wechat .ctm-thread { background: #ededed; } #custom-theater-app .ctm-style-wechat .ctm-thread > header { grid-template-columns: 30px minmax(0,1fr) auto; background: #ededed; } #custom-theater-app .ctm-style-wechat .ctm-thread > header > .ctm-avatar { display: none; } #custom-theater-app .ctm-style-wechat .ctm-thread > header > div { text-align: center; } #custom-theater-app .ctm-style-wechat .ctm-thread > header > div small { display: none; } #custom-theater-app .ctm-style-wechat .ctm-thread-composer { background: #f7f7f7; } #custom-theater-app .ctm-style-wechat .ctm-thread-composer textarea { border: 0; border-radius: 5px; } #custom-theater-app .ctm-style-wechat .ctm-composer-send { color: #079b4d; border: 1px solid rgba(7,193,96,.18); border-radius: 7px; background: rgba(7,193,96,.09); } #custom-theater-app .ctm-style-wechat .ctm-composer-receive { color: #576b95; border: 1px solid rgba(87,107,149,.17); border-radius: 7px; background: rgba(87,107,149,.08); } #custom-theater-app .ctm-style-wechat .ctm-control-icon--receive { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/wechat-receive.png?v=1.0.0"); } #custom-theater-app .ctm-style-wechat .ctm-control-icon--send { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/wechat-send.png?v=1.0.0"); } /* QQ：浅蓝渐变、圆头像、悬浮卡片列表、蓝色圆润气泡 */ #custom-theater-app .ctm-style-qq .ctm-phone { color: #1b2b3c; background: linear-gradient(180deg,#dff2ff 0,#f5f9ff 34%,#f7f9fc 100%); } #custom-theater-app .ctm-style-qq .ctm-app-bar { color: #44647e; background: rgba(223,242,255,.94); border-color: rgba(65,132,181,.13); } #custom-theater-app .ctm-style-qq .ctm-page { padding-top: 5px; } #custom-theater-app .ctm-style-qq .ctm-inbox-title { display: grid; grid-template-columns: 46px minmax(0,1fr) auto; gap: 9px; } #custom-theater-app .ctm-style-qq .ctm-inbox-title > div strong { font-size: 19px; font-weight: 800; } #custom-theater-app .ctm-style-qq .ctm-search { border: 1px solid rgba(62,141,199,.08); border-radius: 18px; background: rgba(255,255,255,.78); box-shadow: 0 5px 16px rgba(70,128,168,.07); } #custom-theater-app .ctm-style-qq .ctm-list { display: grid; gap: 7px; overflow: visible; border-radius: 0; background: transparent; } #custom-theater-app .ctm-style-qq .ctm-list-row { min-height: 67px; border: 1px solid rgba(76,141,191,.08); border-radius: 15px; background: rgba(255,255,255,.83); box-shadow: 0 6px 17px rgba(65,109,144,.07); } #custom-theater-app .ctm-style-qq .ctm-avatar { border-radius: 50%; } #custom-theater-app .ctm-style-qq .ctm-list-copy strong { color: #182d40; font-size: 11px; } #custom-theater-app .ctm-style-qq .ctm-list-copy strong em { border-radius: 8px; background: #61aee8; } #custom-theater-app .ctm-style-qq .ctm-tabbar { border-color: rgba(61,126,177,.12); background: rgba(251,253,255,.96); } #custom-theater-app .ctm-style-qq .ctm-tabbar button.is-active i { width: 34px; height: 22px; display: grid; place-items: center; border-radius: 12px; background: #dff1ff; } #custom-theater-app .ctm-style-qq .ctm-thread { background: linear-gradient(180deg,#e6f5ff,#f2f7fb 45%,#edf4fa); } #custom-theater-app .ctm-style-qq .ctm-thread > header { color: #fff; border: 0; background: linear-gradient(135deg,#54b6ec,#4a83de); box-shadow: 0 6px 18px rgba(48,117,177,.18); } #custom-theater-app .ctm-style-qq .ctm-thread > header small { color: rgba(255,255,255,.78); } #custom-theater-app .ctm-style-qq .ctm-thread > header .ctm-avatar { border-radius: 50%; outline: 2px solid rgba(255,255,255,.45); } #custom-theater-app .ctm-style-qq .ctm-message-avatar { border-radius: 50%; } #custom-theater-app .ctm-style-qq .ctm-message > p { border-radius: 15px 15px 15px 5px; background: #fff; box-shadow: 0 4px 13px rgba(67,112,148,.08); } #custom-theater-app .ctm-style-qq .ctm-message-row.is-sent .ctm-message > p { border-radius: 15px 15px 5px 15px; color: #fff; background: linear-gradient(135deg,#45baff,#3989e8); } #custom-theater-app .ctm-style-qq .ctm-thread-composer { border-color: rgba(63,128,176,.1); background: rgba(246,251,255,.96); } #custom-theater-app .ctm-style-qq .ctm-thread-composer textarea { border: 0; border-radius: 18px; box-shadow: inset 0 0 0 1px rgba(53,128,184,.08); } #custom-theater-app .ctm-style-qq .ctm-composer-send { color: #248bda; border: 1px solid rgba(46,157,234,.22); border-radius: 50%; background: rgba(46,157,234,.11); } #custom-theater-app .ctm-style-qq .ctm-composer-receive { color: #467eae; border: 1px solid rgba(79,134,189,.2); border-radius: 50%; background: rgba(79,134,189,.1); } #custom-theater-app .ctm-style-qq .ctm-control-icon--receive { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/qq-receive.png?v=1.0.0"); } #custom-theater-app .ctm-style-qq .ctm-control-icon--send { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/qq-send.png?v=1.0.0"); } #custom-theater-app .ctm-style-qq .ctm-composer-tool { color: #3f6f96; background: #fff; } /* Instagram：纯白高对比、Stories 圆环、无卡片列表、胶囊私信气泡 */ #custom-theater-app .ctm-style-ins .ctm-phone { color: #0f0f0f; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-app-bar { color: #676767; background: #fff; border-color: #efefef; } #custom-theater-app .ctm-style-ins .ctm-page { padding-left: max(13px, calc(var(--ct-safe-left) + 8px)); padding-right: max(13px, calc(var(--ct-safe-right) + 8px)); } #custom-theater-app .ctm-style-ins .ctm-inbox-title { display: flex; justify-content: space-between; } #custom-theater-app .ctm-style-ins .ctm-ins-wordmark { font: 700 19px/1.1 Georgia, "Times New Roman", serif; letter-spacing: -.055em; } #custom-theater-app .ctm-style-ins .ctm-title-actions { margin-left: auto; } #custom-theater-app .ctm-style-ins .ctm-search { border-radius: 11px; background: #efefef; } #custom-theater-app .ctm-style-ins .ctm-list { border-radius: 0; background: transparent; } #custom-theater-app .ctm-style-ins .ctm-list-row { min-height: 70px; padding-left: 2px; padding-right: 2px; border: 0; background: transparent; } #custom-theater-app .ctm-style-ins .ctm-avatar { width: 50px; height: 50px; border: 2px solid #fff; border-radius: 50%; outline: 1.5px solid #d7d7d7; } #custom-theater-app .ctm-style-ins .ctm-laomi-avatar { outline-color: #d84188; } #custom-theater-app .ctm-style-ins .ctm-list-copy strong { font-size: 11px; font-weight: 650; } #custom-theater-app .ctm-style-ins .ctm-list-copy strong em { color: #d23978; background: #fce3ed; } #custom-theater-app .ctm-style-ins .ctm-tabbar { border-color: #ededed; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-tabbar button { color: #111; } #custom-theater-app .ctm-style-ins .ctm-tabbar button.is-active { color: #111; } #custom-theater-app .ctm-style-ins .ctm-tabbar button.is-active svg { stroke-width: 2.7; } #custom-theater-app .ctm-style-ins .ctm-tabbar span { display: none; } #custom-theater-app .ctm-style-ins .ctm-thread { background: #fff; } #custom-theater-app .ctm-style-ins .ctm-thread > header { border-color: #eee; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-thread > header .ctm-avatar { border-radius: 50%; } #custom-theater-app .ctm-style-ins .ctm-thread > header small { color: #737373; } #custom-theater-app .ctm-style-ins .ctm-thread-messages { gap: 7px; } #custom-theater-app .ctm-style-ins .ctm-message-avatar { width: 27px; height: 27px; flex-basis: 27px; border-radius: 50%; align-self: flex-end; } #custom-theater-app .ctm-style-ins .ctm-user-message-avatar { display: none; } #custom-theater-app .ctm-style-ins .ctm-message { max-width: min(79%, 470px); } #custom-theater-app .ctm-style-ins .ctm-message > p { padding: 9px 12px; border: 1px solid #ededed; border-radius: 18px; background: #efefef; box-shadow: none; } #custom-theater-app .ctm-style-ins .ctm-message-row.is-sent .ctm-message > p { border: 0; border-radius: 18px; color: #fff; background: #3797f0; } #custom-theater-app .ctm-style-ins .ctm-message > time { margin-left: 9px; } #custom-theater-app .ctm-style-ins .ctm-thread-composer { grid-template-columns: 38px minmax(0,1fr) 34px auto; padding-top: 7px; border-color: #eee; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-thread-composer textarea { border: 1px solid #dbdbdb; border-radius: 21px; } #custom-theater-app .ctm-style-ins .ctm-composer-receive { color: #c43f79; border: 1px solid #dbdbdb; border-radius: 50%; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-composer-tool { color: #c43f79; border-radius: 50%; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-composer-send { padding: 0; color: #0095f6; border: 1px solid rgba(0,149,246,.16); border-radius: 50%; background: rgba(0,149,246,.05); } #custom-theater-app .ctm-style-ins .ctm-control-icon--receive { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/ins-receive.png?v=1.0.0"); } #custom-theater-app .ctm-style-ins .ctm-control-icon--send { --ctm-control-mask: url("assets/custom-theater/messenger-controls/v1/ins-send.png?v=1.0.0"); } /* 自定义：所有外观只消费经过白名单解析的当前剧目变量 */ #custom-theater-app .ctm-style-custom .ctm-phone { color: var(--ctm-custom-text, #302a2b); background: var(--ctm-custom-app-bg, #eee8df); font-family: var(--ctm-custom-font-family, inherit); } #custom-theater-app .ctm-style-custom .ctm-app-bar { color: var(--ctm-custom-muted, #8d7f7d); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-header-bg, #f7f0e9); } #custom-theater-app .ctm-style-custom .ctm-page-title { color: var(--ctm-custom-text, #302a2b); } #custom-theater-app .ctm-style-custom .ctm-search, #custom-theater-app .ctm-style-custom .ctm-list, #custom-theater-app .ctm-style-custom .ctm-list-row, #custom-theater-app .ctm-style-custom .ctm-me-card, #custom-theater-app .ctm-style-custom .ctm-mask-form, #custom-theater-app .ctm-style-custom .ctm-moment { color: var(--ctm-custom-text, #302a2b); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); border-radius: var(--ctm-custom-radius, 18px); background: var(--ctm-custom-surface, #fffaf6); box-shadow: var(--ctm-custom-shadow, 0 10px 28px rgba(74,54,57,.1)); } #custom-theater-app .ctm-style-custom .ctm-list-copy small, #custom-theater-app .ctm-style-custom .ctm-list-row time, #custom-theater-app .ctm-style-custom .ctm-page-title small { color: var(--ctm-custom-muted, #8d7f7d); } #custom-theater-app .ctm-style-custom .ctm-avatar, #custom-theater-app .ctm-style-custom .ctm-user-avatar, #custom-theater-app .ctm-style-custom .ctm-message-avatar { border-radius: var(--ctm-custom-avatar-radius, 50%); } #custom-theater-app .ctm-style-custom .ctm-tabbar { border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-tab-bg, #faf5ef); } #custom-theater-app .ctm-style-custom .ctm-tabbar button.is-active { color: var(--ctm-custom-accent, #8d5f68); } #custom-theater-app .ctm-style-custom .ctm-thread { color: var(--ctm-custom-text, #302a2b); background: var(--ctm-custom-app-bg, #eee8df); } #custom-theater-app .ctm-style-custom .ctm-thread > header { border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-header-bg, #f7f0e9); } #custom-theater-app .ctm-style-custom .ctm-message > p { color: var(--ctm-custom-received-text, #302a2b); border-radius: var(--ctm-custom-bubble-radius, 18px); background: var(--ctm-custom-received-bubble, #fffaf6); } #custom-theater-app .ctm-style-custom .ctm-message-row.is-sent .ctm-message > p { color: var(--ctm-custom-sent-text, #fff); border-radius: var(--ctm-custom-bubble-radius, 18px); background: var(--ctm-custom-sent-bubble, #8d5f68); } #custom-theater-app .ctm-style-custom .ctm-thread-composer { border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-composer-bg, #f4eee8); } #custom-theater-app .ctm-style-custom .ctm-thread-composer textarea { color: var(--ctm-custom-text, #302a2b); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); border-radius: var(--ctm-custom-bubble-radius, 18px); background: var(--ctm-custom-surface, #fffaf6); } #custom-theater-app .ctm-style-custom .ctm-composer-receive { color: var(--ctm-custom-accent-contrast, #fff); background: var(--ctm-custom-accent, #8d5f68); } #custom-theater-app .ctm-style-custom .ctm-composer-tool { color: var(--ctm-custom-text, #302a2b); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-surface, #fffaf6); } /* 聊天设置：语言/记忆/动描按线程保存，剧目时间按当前剧目共享 */ #custom-theater-app .ctm-chat-settings { box-sizing: border-box; width: 100%; height: 100%; min-width: 0; min-height: 0; overflow: hidden; display: flex; flex-direction: column; color: #22282e; background: #f2f3f4; } #custom-theater-app .ctm-chat-settings > header { flex: 0 0 auto; min-height: 61px; padding: 7px max(17px, calc(var(--ct-safe-right) + 9px)) 7px max(17px, calc(var(--ct-safe-left) + 9px)); display: grid; grid-template-columns: 32px minmax(0,1fr) 32px; align-items: center; gap: 8px; border-bottom: 1px solid rgba(69,76,82,.12); background: rgba(250,250,250,.97); text-align: center; } #custom-theater-app .ctm-chat-settings > header button { width: 32px; height: 36px; padding: 0; border: 0; color: inherit; background: transparent; font-size: 27px; cursor: pointer; } #custom-theater-app .ctm-chat-settings > header small, #custom-theater-app .ctm-chat-settings > header strong, #custom-theater-app .ctm-chat-settings > header span { display: block; } #custom-theater-app .ctm-chat-settings > header small { color: #8a9095; font-size: 6px; letter-spacing: .13em; } #custom-theater-app .ctm-chat-settings > header strong { margin-top: 2px; font-size: 13px; } #custom-theater-app .ctm-chat-settings > header span { margin-top: 2px; overflow: hidden; color: #858b90; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-chat-settings > form { box-sizing: border-box; flex: 1 1 0; width: 100%; height: 0; min-width: 0; min-height: 0; padding: 12px max(17px, calc(var(--ct-safe-right) + 9px)) calc(28px + var(--ct-safe-bottom)) max(17px, calc(var(--ct-safe-left) + 9px)); overflow-x: hidden; overflow-y: scroll; display: flex; flex-direction: column; gap: 10px; overscroll-behavior-x: none; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; touch-action: pan-y; scroll-padding-block: 12px calc(28px + var(--ct-safe-bottom)); scrollbar-width: none; -ms-overflow-style: none; } #custom-theater-app .ctm-chat-settings > form > * { flex: 0 0 auto; } #custom-theater-app .ctm-chat-settings > form::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none; background: transparent; } #custom-theater-app .ctm-chat-settings > form:focus-visible { outline: 2px solid rgba(82,125,164,.5); outline-offset: -3px; } #custom-theater-app .ctm-settings-card { overflow: hidden; border: 1px solid rgba(67,74,80,.09); border-radius: 14px; background: #fff; box-shadow: 0 3px 12px rgba(31,37,42,.035); } #custom-theater-app .ctm-settings-card > label { min-height: 54px; padding: 10px 12px; display: grid; grid-template-columns: minmax(0,1fr) minmax(100px,42%); align-items: center; gap: 10px; border-bottom: 1px solid #eef0f1; } #custom-theater-app .ctm-settings-card > label:last-child { border-bottom: 0; } #custom-theater-app .ctm-settings-card label span strong, #custom-theater-app .ctm-settings-card label span small { display: block; } #custom-theater-app .ctm-settings-card label span strong, #custom-theater-app .ctm-settings-card-head strong { font-size: 10px; } #custom-theater-app .ctm-settings-card label span small, #custom-theater-app .ctm-settings-card-head small { margin-top: 3px; color: #858c92; font-size: 7px; line-height: 1.45; } #custom-theater-app .ctm-settings-card select, #custom-theater-app .ctm-settings-card input[type="text"], #custom-theater-app .ctm-settings-card input[type="datetime-local"] { box-sizing: border-box; width: 100%; min-height: 36px; padding: 0 8px; border: 1px solid #dce0e3; border-radius: 9px; outline: 0; color: inherit; background: #f8f9fa; font: 8px/1.2 inherit; } #custom-theater-app .ctm-settings-card input:focus, #custom-theater-app .ctm-settings-card select:focus { border-color: #6d91b4; box-shadow: 0 0 0 2px rgba(70,123,171,.12); } #custom-theater-app .ctm-settings-switch { grid-template-columns: minmax(0,1fr) 40px !important; cursor: pointer; } #custom-theater-app .ctm-settings-switch input { position: absolute; opacity: 0; pointer-events: none; } #custom-theater-app .ctm-settings-switch > i { position: relative; width: 38px; height: 22px; border-radius: 12px; background: #c8cdd1; transition: background .16s ease; } #custom-theater-app .ctm-settings-switch > i::after { content: ""; position: absolute; left: 2px; top: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .16s ease; } #custom-theater-app .ctm-settings-switch input:checked + i { background: #3e9e62; } #custom-theater-app .ctm-settings-switch input:checked + i::after { transform: translateX(16px); } #custom-theater-app .ctm-settings-switch input:focus-visible + i { outline: 2px solid #527da4; outline-offset: 2px; } #custom-theater-app .ctm-settings-card-head { padding: 11px 12px 7px; } #custom-theater-app .ctm-settings-card-head strong, #custom-theater-app .ctm-settings-card-head small { display: block; } #custom-theater-app .ctm-settings-counts { padding: 2px 12px 9px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; } #custom-theater-app .ctm-settings-counts label { min-width: 0; padding: 8px; display: grid; grid-template-columns: minmax(0,1fr) 50px auto; align-items: center; gap: 5px; border: 1px solid #e0e3e5; border-radius: 10px; background: #fafbfb; font-size: 8px; } #custom-theater-app .ctm-settings-counts input { box-sizing: border-box; width: 50px; min-height: 32px; padding: 0 4px; border: 1px solid #d7dbde; border-radius: 7px; text-align: center; font: 9px/1 inherit; } #custom-theater-app .ctm-settings-counts b { font-size: 7px; } #custom-theater-app .ctm-settings-card > p { margin: 0; padding: 0 12px 11px; color: #858b90; font-size: 7px; line-height: 1.55; } #custom-theater-app .ctm-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; } #custom-theater-app .ctm-voice-id-module { padding: 10px 12px 11px; display: grid; gap: 8px; border-top: 1px solid #eef0f1; background: linear-gradient(180deg,rgba(243,248,252,.58),rgba(255,255,255,.92)); } #custom-theater-app .ctm-voice-id-head { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 9px; } #custom-theater-app .ctm-voice-id-head span { min-width: 0; } #custom-theater-app .ctm-voice-id-head strong, #custom-theater-app .ctm-voice-id-head small { display: block; } #custom-theater-app .ctm-voice-id-head strong { font-size: 10px; } #custom-theater-app .ctm-voice-id-head small { margin-top: 3px; color: #858c92; font-size: 7px; line-height: 1.45; } #custom-theater-app .ctm-voice-id-head > b { flex: 0 0 auto; padding: 5px 7px; border-radius: 999px; color: #376487; background: #e6f0f7; font: 800 7px/1 inherit; } #custom-theater-app .ctm-voice-id-module > label { display: block; } #custom-theater-app .ctm-voice-id-actions { min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 7px; } #custom-theater-app .ctm-voice-id-actions button { min-height: 36px; padding: 0 10px; border: 1px solid #bfd0dd; border-radius: 9px; color: #315d7e; background: #f4f9fc; font: 800 8px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-voice-id-actions button:disabled { opacity: .56; cursor: wait; } #custom-theater-app .ctm-voice-id-actions select { min-width: 0; } #custom-theater-app .ctm-voice-id-module > p { margin: 0; color: #758089; font-size: 7px; line-height: 1.55; overflow-wrap: anywhere; } #custom-theater-app .ctm-typography-card { padding-bottom: 1px; } #custom-theater-app .ctm-typography-group { margin: 0 12px 10px; padding: 10px; display: grid; gap: 8px; border: 1px solid #e3e6e8; border-radius: 11px; background: #fafbfb; } #custom-theater-app .ctm-typography-title strong, #custom-theater-app .ctm-typography-title small { display: block; } #custom-theater-app .ctm-typography-title strong { font-size: 10px; } #custom-theater-app .ctm-typography-title small { margin-top: 3px; color: #858c92; font-size: 7px; line-height: 1.45; } #custom-theater-app .ctm-typography-group > label { min-width: 0; display: grid; grid-template-columns: 62px minmax(0,1fr); align-items: center; gap: 8px; color: #616970; font-size: 8px; } #custom-theater-app .ctm-font-size-control { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) 38px; align-items: center; gap: 7px; } #custom-theater-app .ctm-font-size-control input[type="range"] { width: 100%; min-width: 0; accent-color: #397f59; } #custom-theater-app .ctm-font-size-control output { color: #4f5961; font: 8px/1 "Courier New", monospace; text-align: right; } #custom-theater-app .ctm-color-control { min-width: 0; display: grid; grid-template-columns: 38px minmax(68px,1fr) auto; align-items: center; gap: 6px; } #custom-theater-app .ctm-color-control input[type="color"] { box-sizing: border-box; width: 38px; height: 34px; padding: 3px; border: 1px solid #d7dcdf; border-radius: 8px; background: #fff; cursor: pointer; } #custom-theater-app .ctm-color-control output { overflow: hidden; color: #4f5961; font: 7px/1.2 "Courier New", monospace; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-color-control button { min-height: 32px; padding: 0 7px; border: 1px solid #d8dcdf; border-radius: 8px; color: #667078; background: #fff; font: 700 7px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-typography-preview { min-height: 38px; padding: 8px 10px; display: flex; align-items: center; overflow-wrap: anywhere; border: 1px dashed #d8dddf; border-radius: 9px; background: #fff; line-height: 1.55; } #custom-theater-app .ctm-typography-preview.is-motion { color: #7b7280; } #custom-theater-app .ctm-font-missing { margin: 0; color: #9a615c; font-size: 7px; line-height: 1.5; } #custom-theater-app .ctm-settings-card > .ctm-font-library-note { padding-top: 0; } #custom-theater-app .ctm-performance-time { grid-template-columns: minmax(0,1fr) minmax(155px,48%) !important; } #custom-theater-app .ctm-settings-save { min-height: 42px; border: 0; border-radius: 12px; color: #fff; background: #397f59; font: 800 10px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-settings-save:disabled { opacity: .55; cursor: wait; } #custom-theater-app .ctm-settings-boundary, #custom-theater-app .ctm-settings-support-note { margin: 0; padding: 2px 5px; color: #858b90; font-size: 7px; line-height: 1.55; text-align: center; } /* 消息气泡互动菜单：长按/右键唤出的回溯、编辑、多选 */ #custom-theater-app .ctm-message { position: relative; } #custom-theater-app [data-ctm-message-bubble] { cursor: pointer; -webkit-touch-callout: none; touch-action: pan-y; } #custom-theater-app [data-ctm-message-bubble] > p { -webkit-user-select: none; user-select: none; } #custom-theater-app [data-ctm-message-bubble]:focus-visible { outline: 2px solid rgba(87,107,149,.72); outline-offset: 2px; } #custom-theater-app .ctm-message-edited { margin-left: 5px; color: #a8adb2; font-size: 6px; font-style: normal; } #custom-theater-app .ctm-message-select { flex: 0 0 22px; position: relative; align-self: center; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; cursor: pointer; } #custom-theater-app .ctm-message-select input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; } #custom-theater-app .ctm-message-select i { width: 16px; height: 16px; border: 2px solid rgba(104,112,120,.5); border-radius: 50%; background: rgba(255,255,255,.9); transition: background .15s ease, border-color .15s ease; } #custom-theater-app .ctm-message-select input:checked + i { border-color: #3e9e62; background: radial-gradient(circle at center, #3e9e62 0 5px, rgba(255,255,255,.94) 6px); } #custom-theater-app .ctm-message-select input:focus-visible + i { outline: 2px solid rgba(62,158,98,.7); outline-offset: 2px; } #custom-theater-app .ctm-message-row.is-sent .ctm-message-select { margin-right: auto; } #custom-theater-app .ctm-message-row.is-selectable { cursor: pointer; } #custom-theater-app .ctm-message-row.is-selectable .ctm-message { pointer-events: none; } #custom-theater-app .ctm-message-row.is-selected .ctm-message > p { box-shadow: 0 0 0 2px rgba(62,158,98,.55); } #custom-theater-app .ctm-select-bar { box-sizing: border-box; flex: 0 0 auto; padding: 8px max(17px, calc(var(--ct-safe-right) + 9px)) calc(8px + var(--ct-safe-bottom)) max(17px, calc(var(--ct-safe-left) + 9px)); display: flex; flex-wrap: wrap; align-items: center; gap: 6px; border-top: 1px solid #d6d6d6; background: #f7f7f7; } #custom-theater-app .ctm-select-bar span { flex: 1 0 62px; color: #6b7076; font: 700 9px/1.3 inherit; } #custom-theater-app .ctm-select-bar button { min-height: 34px; padding: 0 10px; border: 1px solid rgba(78,88,96,.18); border-radius: 9px; color: #3f464c; background: #fff; font: 800 9px/1 inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; } #custom-theater-app .ctm-select-bar button:disabled { opacity: .48; cursor: default; } #custom-theater-app .ctm-select-bar button.is-danger { color: #8a4b46; border-color: rgba(138,75,70,.38); background: rgba(233,190,186,.26); } #custom-theater-app .ctm-select-bar button.is-primary { color: #fff; border: 0; background: #397f59; } #custom-theater-app .ctm-bubble-menu { position: absolute; z-index: 41; inset: 0; } #custom-theater-app .ctm-bubble-backdrop { position: absolute; inset: 0; background: rgba(34,38,43,.36); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); } #custom-theater-app .ctm-bubble-card { position: absolute; left: 50%; bottom: calc(20px + var(--ct-safe-bottom)); transform: translateX(-50%); box-sizing: border-box; width: min(310px, calc(100% - 30px)); padding: 12px; display: grid; gap: 7px; border: 1px solid rgba(60,66,72,.14); border-radius: 18px; background: rgba(252,252,252,.98); box-shadow: 0 16px 36px rgba(28,32,37,.28); } #custom-theater-app .ctm-bubble-card > header { display: grid; gap: 2px; padding: 0 2px 3px; } #custom-theater-app .ctm-bubble-card > header span { color: #6f7a86; font-size: 6px; font-weight: 800; letter-spacing: .3em; } #custom-theater-app .ctm-bubble-card > header strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-bubble-card > header small { overflow: hidden; color: #8d9298; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-bubble-card > button { min-height: 42px; padding: 8px 10px; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; border: 1px solid rgba(60,66,72,.12); border-radius: 12px; color: #24282c; background: #fff; text-align: left; cursor: pointer; } #custom-theater-app .ctm-bubble-card > button:disabled { opacity: .5; cursor: default; } #custom-theater-app .ctm-bubble-card > button strong { font-size: 10px; letter-spacing: .08em; } #custom-theater-app .ctm-bubble-card > button small { color: #858b90; font-size: 7px; line-height: 1.45; } #custom-theater-app .ctm-bubble-card > button.ctm-bubble-cancel { min-height: 36px; align-items: center; justify-content: center; background: #f0f0f0; font-weight: 800; font-size: 9px; } /* 编辑简讯：与聊天设置同级的整屏浮层 */ #custom-theater-app .ctm-message-editor { position: absolute; z-index: 42; inset: 0; display: flex; flex-direction: column; color: #22282e; background: #f2f3f4; } #custom-theater-app .ctm-message-editor > header { flex: 0 0 auto; min-height: 61px; padding: 7px max(17px, calc(var(--ct-safe-right) + 9px)) 7px max(17px, calc(var(--ct-safe-left) + 9px)); display: grid; grid-template-columns: 32px minmax(0,1fr) 32px; align-items: center; gap: 8px; border-bottom: 1px solid rgba(69,76,82,.12); background: rgba(250,250,250,.97); text-align: center; } #custom-theater-app .ctm-message-editor > header button { width: 32px; height: 36px; padding: 0; border: 0; color: inherit; background: transparent; font-size: 27px; cursor: pointer; } #custom-theater-app .ctm-message-editor > header button:disabled { opacity: .45; cursor: default; } #custom-theater-app .ctm-message-editor > header small, #custom-theater-app .ctm-message-editor > header strong, #custom-theater-app .ctm-message-editor > header span { display: block; } #custom-theater-app .ctm-message-editor > header small { color: #8a9095; font-size: 6px; letter-spacing: .13em; } #custom-theater-app .ctm-message-editor > header strong { margin-top: 2px; font-size: 13px; } #custom-theater-app .ctm-message-editor > header span { margin-top: 2px; overflow: hidden; color: #858b90; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; } #custom-theater-app .ctm-editor-body { box-sizing: border-box; flex: 1 1 0; min-height: 0; padding: 12px max(17px, calc(var(--ct-safe-right) + 9px)) calc(14px + var(--ct-safe-bottom)) max(17px, calc(var(--ct-safe-left) + 9px)); display: flex; flex-direction: column; gap: 10px; overflow-y: auto; overscroll-behavior: contain; } #custom-theater-app .ctm-editor-body > label { display: grid; gap: 5px; } #custom-theater-app .ctm-editor-body > label > span { color: #70757a; font-size: 8px; } #custom-theater-app .ctm-editor-body textarea { box-sizing: border-box; width: 100%; padding: 10px; resize: vertical; border: 1px solid #dddfe1; border-radius: 10px; outline: 0; color: inherit; background: #fff; font: 10px/1.65 inherit; } #custom-theater-app .ctm-editor-body textarea:focus { border-color: #6d91b4; box-shadow: 0 0 0 2px rgba(70,123,171,.12); } #custom-theater-app .ctm-editor-note { margin: 0; color: #858b90; font-size: 7px; line-height: 1.6; } #custom-theater-app .ctm-editor-actions { margin-top: auto; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; } #custom-theater-app .ctm-editor-actions button { min-height: 40px; border: 1px solid rgba(78,88,96,.18); border-radius: 11px; color: #3f464c; background: #fff; font: 800 10px/1 inherit; cursor: pointer; } #custom-theater-app .ctm-editor-actions button.is-primary { color: #fff; border: 0; background: #397f59; } #custom-theater-app .ctm-editor-actions button:disabled { opacity: .55; cursor: wait; } /* 四套构造：勾选、危险按钮与主按钮跟随各自的主色 */ #custom-theater-app .ctm-style-wechat .ctm-message-select input:checked + i { border-color: #07c160; background: radial-gradient(circle at center, #07c160 0 5px, rgba(255,255,255,.94) 6px); } #custom-theater-app .ctm-style-wechat .ctm-message-row.is-selected .ctm-message > p { box-shadow: 0 0 0 2px rgba(7,193,96,.5); } #custom-theater-app .ctm-style-qq .ctm-message-select input:checked + i { border-color: #278bd8; background: radial-gradient(circle at center, #278bd8 0 5px, rgba(255,255,255,.94) 6px); } #custom-theater-app .ctm-style-qq .ctm-message-row.is-selected .ctm-message > p { box-shadow: 0 0 0 2px rgba(39,139,216,.5); } #custom-theater-app .ctm-style-qq .ctm-select-bar { border-color: rgba(63,128,176,.1); background: rgba(246,251,255,.96); } #custom-theater-app .ctm-style-qq .ctm-select-bar button.is-primary, #custom-theater-app .ctm-style-qq .ctm-editor-actions button.is-primary { background: #278bd8; } #custom-theater-app .ctm-style-ins .ctm-message-select input:checked + i { border-color: #cf477d; background: radial-gradient(circle at center, #cf477d 0 5px, rgba(255,255,255,.94) 6px); } #custom-theater-app .ctm-style-ins .ctm-message-row.is-selected .ctm-message > p { box-shadow: 0 0 0 2px rgba(207,71,125,.45); } #custom-theater-app .ctm-style-ins .ctm-select-bar { border-color: #eee; background: #fff; } #custom-theater-app .ctm-style-ins .ctm-select-bar button.is-primary, #custom-theater-app .ctm-style-ins .ctm-editor-actions button.is-primary { background: linear-gradient(135deg,#bd3d9c,#e06768); } #custom-theater-app .ctm-style-custom .ctm-message-select input:checked + i { border-color: var(--ctm-custom-accent, #8d5f68); background: radial-gradient(circle at center, var(--ctm-custom-accent, #8d5f68) 0 5px, rgba(255,255,255,.94) 6px); } #custom-theater-app .ctm-style-custom .ctm-select-bar { border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-composer-bg, #f4eee8); } #custom-theater-app .ctm-style-custom .ctm-select-bar button { color: var(--ctm-custom-text, #302a2b); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-surface, #fffaf6); } #custom-theater-app .ctm-style-custom .ctm-select-bar button.is-primary, #custom-theater-app .ctm-style-custom .ctm-editor-actions button.is-primary { color: var(--ctm-custom-accent-contrast, #fff); background: var(--ctm-custom-accent, #8d5f68); } #custom-theater-app .ctm-style-custom .ctm-bubble-card { border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); border-radius: var(--ctm-custom-radius, 18px); background: var(--ctm-custom-surface, #fffaf6); } #custom-theater-app .ctm-style-custom .ctm-bubble-card > button { color: var(--ctm-custom-text, #302a2b); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-surface, #fffaf6); } #custom-theater-app .ctm-style-custom .ctm-message-editor { color: var(--ctm-custom-text, #302a2b); background: var(--ctm-custom-app-bg, #eee8df); } #custom-theater-app .ctm-style-custom .ctm-message-editor > header { border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-header-bg, #f7f0e9); } #custom-theater-app .ctm-style-custom .ctm-editor-body textarea { color: var(--ctm-custom-text, #302a2b); border-color: var(--ctm-custom-border, rgba(86,67,69,.16)); background: var(--ctm-custom-surface, #fffaf6); } @keyframes ctm-control-breathe { from { opacity: .38; transform: translateY(1px); } to { opacity: 1; transform: translateY(-1px); } } @supports not (-webkit-mask-image: url("")) { #custom-theater-app .ctm-control-icon { background: transparent var(--ctm-control-mask) center / contain no-repeat; } } @media (max-width: 360px), (max-height: 620px) { #custom-theater-app .ctm-select-bar { padding-left: max(8px, var(--ct-safe-left)); padding-right: max(8px, var(--ct-safe-right)); gap: 4px; } #custom-theater-app .ctm-select-bar span { flex-basis: 100%; } #custom-theater-app .ctm-select-bar button { flex: 1 1 0; min-width: 0; padding: 0 6px; } #custom-theater-app .ctm-thread-composer { grid-template-columns: 36px minmax(0,1fr) 36px 36px; gap: 4px; padding-left: max(8px, var(--ct-safe-left)); padding-right: max(8px, var(--ct-safe-right)); } #custom-theater-app .ctm-thread-composer .ctm-composer-receive, #custom-theater-app .ctm-thread-composer .ctm-composer-send { width: 36px; min-width: 36px; padding: 0; } #custom-theater-app .ctm-control-icon { width: 23px; height: 23px; } #custom-theater-app .ctm-settings-card > label, #custom-theater-app .ctm-performance-time { grid-template-columns: 1fr !important; gap: 7px; } #custom-theater-app .ctm-settings-counts { grid-template-columns: 1fr; } #custom-theater-app .ctm-typography-group > label { grid-template-columns: 1fr; gap: 5px; } #custom-theater-app .ctm-voice-id-actions { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { #custom-theater-app .ctm-message-select i { transition: none; } #custom-theater-app .ctm-settings-switch > i, #custom-theater-app .ctm-settings-switch > i::after { transition: none; } #custom-theater-app .ctm-composer-receive.is-busy .ctm-control-icon { animation: none; } #custom-theater-app .ctm-thread-composer .ctm-composer-receive, #custom-theater-app .ctm-thread-composer .ctm-composer-send { transition: none; } } #custom-theater-app .ctm-style-custom .ctm-composer-send, #custom-theater-app .ctm-style-custom .ctm-primary { color: var(--ctm-custom-accent-contrast, #fff); background: var(--ctm-custom-accent, #8d5f68); } @media (max-width: 350px) { #custom-theater-app .ctm-app { padding-left: 4px; padding-right: 4px; } #custom-theater-app .ctm-phone { border-radius: 18px; } #custom-theater-app .ctm-page { padding-left: 13px; padding-right: 13px; } #custom-theater-app .ctm-thread-messages { padding-left: 18px; padding-right: 18px; } } @media (max-height: 620px), (orientation: landscape) and (max-height: 520px) { #custom-theater-app .ctm-page-title { min-height: 48px; } #custom-theater-app .ctm-app-bar { min-height: 36px; } #custom-theater-app .ctm-tabbar { min-height: 47px; } } @media (prefers-reduced-motion: reduce) { #custom-theater-app .ctm-floating-bubble { transition: none; } } @media (prefers-contrast: more) { #custom-theater-app .ctm-phone, #custom-theater-app .ctm-list, #custom-theater-app .ctm-mask-form, #custom-theater-app .ctm-me-card, #custom-theater-app .ctm-voice-id-module { border-color: rgba(20,23,27,.62); } #custom-theater-app .ctm-thread-composer .ctm-composer-receive, #custom-theater-app .ctm-thread-composer .ctm-composer-send { border-width: 2px; background: #fff; } }