:root{color-scheme:dark;--bg:#101e26;--panel:#192e38;--line:#344c57;--text:#f2f5f3;--muted:#b3c5cb;--accent:#a7e4cf;--font:32px;--leading:1.9;--measure:82%}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Microsoft YaHei",sans-serif;display:flex;flex-direction:column;height:100dvh}button,input,select{font:inherit}button,select{border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);padding:10px 14px;min-height:44px;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible,#reader:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}button:active{background:#2b4c55}.primary{background:var(--accent);color:#12382d;border-color:var(--accent);font-weight:700}header{display:flex;gap:12px;align-items:center;padding:calc(env(safe-area-inset-top) + 12px) 16px 10px;border-bottom:1px solid var(--line)}header>div{flex:1;min-width:0}small{font-size:11px;color:var(--muted)}h1{font-size:15px;margin:4px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}h2{font-size:18px;margin:0}#notice{font-size:12px;color:var(--muted);padding:9px 18px;background:#172a32;flex:none;line-height:1.5}#notice button{min-height:32px;padding:4px 10px;margin-left:8px;font-size:12px}#reader{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:none;touch-action:pan-y}#reader::-webkit-scrollbar{display:none}#script{width:var(--measure);max-width:860px;margin:auto;padding:16px 0 50vh;font-size:var(--font);line-height:var(--leading);overflow-wrap:anywhere}#script p{margin:0 0 .9em;color:#bac9ce;transition:color .12s}#script p.current{color:#ffffff}#script p.past{color:#7c949f}#script.mirrored{transform:scaleX(-1)}#script .placeholder{font-size:24px;color:var(--muted);padding-top:12vh}footer{padding:12px max(16px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:var(--panel);border-top:1px solid var(--line);flex:none}.speed label{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--accent);min-height:32px;margin:0}.controls{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:10px}.controls button{min-height:48px;font-size:15px}.progress{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted);padding-top:6px}.progress button{border:0;background:none;min-height:32px;padding:4px 0;font-size:12px}.sectionHeading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}#library,#settings{position:fixed;z-index:4;top:calc(env(safe-area-inset-top) + 72px);left:12px;right:12px;max-height:calc(100dvh - 100px - env(safe-area-inset-top));overflow:auto;background:#1b333e;border:1px solid #48636e;border-radius:16px;padding:20px;box-shadow:0 12px 40px #0008}section p{font-size:12px;line-height:1.7;color:var(--muted)}#documents{display:flex;flex-direction:column;gap:10px}#documents button{text-align:left;overflow-wrap:anywhere}#settings label{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:14px 0;font-size:14px;flex-wrap:wrap}#settings label input[type=range]{flex-basis:100%}#settings input[type=checkbox]{width:24px;height:24px;accent-color:var(--accent)}#countdown{position:fixed;inset:0;background:#101e26e8;z-index:5;display:grid;place-items:center;font-size:110px;font-weight:600;color:var(--accent);cursor:pointer}#countdown[hidden],[hidden]{display:none!important}@media(orientation:landscape) and (max-height:550px){header{padding-top:6px;padding-bottom:6px}header small{display:none}#notice{padding:4px 18px}footer{padding-top:5px;padding-bottom:max(5px,env(safe-area-inset-bottom))}.speed{display:flex;align-items:center;gap:20px}.speed label{min-width:190px;gap:14px}.speed input{flex:1}.controls button{min-height:42px}.progress{padding-top:0}#script{padding-top:12px}}@media(prefers-reduced-motion:reduce){#script p{transition:none}}

#cameraPreview{position:fixed;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}#cameraFrame{display:none;position:fixed;inset:0;width:100%;height:100%;object-fit:contain;transform:scaleX(-1);z-index:0;background:#101e26}body.camera-on #cameraFrame{display:block}body.camera-on header,body.camera-on #notice,body.camera-on footer{position:relative;z-index:1;background:#10232cbd}body.camera-on #reader{position:relative;z-index:1;flex:none;height:24dvh;max-height:220px;background:#07151d73;border-bottom:1px solid #8aa6ae55}body.camera-on #script{font-size:min(var(--font),30px);padding-top:12px;width:82%}body.camera-on #script p{color:#e3e8e8;text-shadow:0 1px 3px #000}body.camera-on #script p.current{color:#fff}#faceSpace{display:none}body.camera-on #faceSpace{display:block;flex:1;min-height:0;position:relative;z-index:1;pointer-events:none}#cameraControls{position:relative;z-index:2;flex:none;padding:8px 14px;background:#11232dd9}#cameraControls .controls{grid-template-columns:1fr 1.5fr auto;gap:8px}#cameraControls button{font-size:13px;padding:7px 10px;min-height:42px}#record{background:#a93737;color:white;border-color:#c45151}#cameraStatus{font-size:11px;line-height:1.5;color:#e0e9ec;padding-bottom:8px}#importPanel,#clipPanel{position:fixed;z-index:8;inset:12px;background:#192e38;border:1px solid #4d6773;border-radius:14px;padding:20px;overflow:auto;top:calc(12px + env(safe-area-inset-top));bottom:calc(12px + env(safe-area-inset-bottom))}#importText{width:100%;height:60dvh;background:#101e26;color:#fff;padding:14px;border:1px solid #52717d;border-radius:10px;font:18px/1.6 system-ui;margin:16px 0}#clipPreview{width:100%;max-height:75dvh;background:#000}#clipPanel p{color:#d2e0e5;font-size:13px}#cameraButton{font-size:12px;padding:8px 10px}body[data-camera-hosted] header{gap:8px}body[data-camera-hosted] header small{font-size:10px}body[data-camera-hosted] header h1{font-size:13px}@media(orientation:landscape) and (max-height:550px){body.camera-on #reader{height:29dvh}#cameraControls{padding:4px 14px}#cameraStatus{padding-bottom:3px}#cameraControls button{min-height:34px}}

.camera-entry{flex:none;background:#203f45;border-bottom:1px solid #45646b;padding:14px 18px}.camera-version{font-size:11px;letter-spacing:.04em;color:#b4e6d7}.camera-entry h2{font-size:20px;margin:8px 0}.camera-entry p{font-size:12px;color:#d5e6e7;margin:6px 0 10px;line-height:1.5}.camera-entry #cameraButton{width:100%;min-height:48px;font-size:16px;font-weight:700;background:#a7e4cf;border-color:#a7e4cf;color:#12382d}.camera-entry p.camera-help{font-size:11px;margin:8px 0 0;color:#bdcfd3}@media(orientation:landscape) and (max-height:550px){.camera-entry{padding:8px 16px;display:grid;grid-template-columns:1fr 1fr;gap:4px 20px}.camera-entry h2{font-size:16px;margin:0}.camera-entry .camera-version{grid-column:1}.camera-entry #cameraButton{grid-column:2;grid-row:1/4}.camera-entry p{margin:0}.camera-entry .camera-help{display:none}}

/* V4: camera and script share the viewport; the script has no backing panel. */
body.camera-on header{background:transparent;border:0;text-shadow:0 1px 3px #000}
body.camera-on #notice{display:none}
body.camera-on #reader{position:absolute;top:calc(env(safe-area-inset-top) + 76px);left:0;right:0;width:100%;height:24dvh;max-height:220px;background:transparent;border:0;z-index:1}
body.camera-on #script{background:transparent;width:var(--measure);font-size:var(--font);padding-top:0}
body.camera-on #script p{background:transparent;color:#fff;text-shadow:0 1px 3px #000,0 0 5px #000}
body.camera-on #script p.past{color:#e0e6e8}
.camera-format{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.camera-format span{font-size:11px;color:var(--muted)}
#cameraControls .camera-format button{min-height:44px}
@media(orientation:landscape) and (max-height:550px){body.camera-on #reader{top:60px;height:25dvh}.camera-format{margin-bottom:2px}}
