:root{--bg:#0A0B0D;--panel:rgba(16,18,22,.74);--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--t1:#F5F7FA;--t2:rgba(245,247,250,.66);--t3:rgba(245,247,250,.42);--blue:#3B8BFF;--blue2:#69A8FF;--red:#FF5B4D;--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",Inter,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--panelW:344px;--r:16px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--t1);font-family:var(--font);font-size:14px;overflow:hidden;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button{font-family:var(--font);color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--blue2);outline-offset:2px}.app{position:relative;width:100%;height:100%;display:flex}.stage{position:relative;flex:1;min-width:0;height:100%;overflow:hidden;background:var(--bg)}.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 50%;will-change:transform,filter;opacity:0;transition:opacity .5s ease}.bg.ready{opacity:1}.veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#06080a57,#06080a00 22% 70%,#06080a6b)}.frameov{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.rig{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;pointer-events:none}.rig img{position:absolute;display:block;-webkit-user-drag:none;user-select:none;pointer-events:none}.rig .ground{position:absolute;left:5%;width:90%;height:6%;bottom:-2.2%;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,#0000008c,#00000047 40%,#0000 72%)}.rig .legs{transform-origin:50% 100%}.rig .column{transform-origin:50% 0}.camwrap{position:absolute;cursor:pointer;pointer-events:auto}.camwrap .camimg{left:0;top:0;width:100%;filter:drop-shadow(0 3px 5px rgba(0,0,0,.42))}.camwrap .lcd{position:absolute;left:11%;top:34.2%;width:66%;height:58.6%;display:block;background:#05070a}.glass{background:var(--panel);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);border:1px solid var(--line);box-shadow:0 10px 30px #00000059}.topbar{position:absolute;left:14px;right:14px;top:calc(12px + env(safe-area-inset-top,0px));display:flex;justify-content:space-between;align-items:center;gap:10px;pointer-events:none;z-index:3}.pill{border-radius:999px;padding:7px 12px;font-size:12px;font-weight:500;color:var(--t2);pointer-events:auto;white-space:nowrap;border:1px solid var(--line);line-height:1.2}.pill b{color:var(--t1);font-weight:600}.pill.tg[aria-pressed=true]{color:var(--t1);border-color:var(--line2);background:#3b8bff38}.tgs{display:flex;gap:6px}.scenebtn{display:flex;align-items:center;gap:8px}.scenebtn:after{content:"";width:6px;height:6px;border-right:1.5px solid var(--t3);border-bottom:1.5px solid var(--t3);transform:translateY(-2px) rotate(45deg)}.menu{position:absolute;left:14px;top:calc(50px + env(safe-area-inset-top,0px));z-index:4;min-width:220px;border-radius:14px;padding:6px;display:flex;flex-direction:column;gap:2px;transform-origin:top left;transition:opacity .18s ease,transform .18s cubic-bezier(.2,.8,.2,1)}.menu[hidden]{display:none}.menu button{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;border:none;background:transparent;border-radius:9px;padding:9px 10px;font-size:13px;font-weight:500;color:var(--t1);text-align:left}.menu button span{color:var(--t3);font-size:12px}.menu button:hover{background:#ffffff12}.menu button[aria-current=true]{background:#3b8bff33}.menu button[aria-current=true] span{color:var(--blue2)}.panel{width:var(--panelW);flex:0 0 auto;height:100%;overflow:auto;background:#0c0d10f0;border-left:1px solid var(--line);padding:22px 20px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:18px;scrollbar-width:thin}.ph{display:flex;flex-direction:column;gap:2px}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}.ph h1{margin:0;font-size:24px;font-weight:700;letter-spacing:-.02em;line-height:1.15}.ph .sub{font-size:13px;color:var(--t2);margin-top:2px}.grp{display:flex;flex-direction:column;gap:18px;padding:16px 16px 14px;border-radius:var(--r);background:#ffffff0b;border:1px solid var(--line)}.grp h2{margin:0 0 -2px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}.sl{display:flex;flex-direction:column;gap:4px}.slh{display:flex;justify-content:space-between;align-items:baseline}.slh .nm{font-size:13.5px;font-weight:500;color:var(--t2)}.slh output{font-size:15px;font-weight:600;color:var(--t1);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.ticks{display:flex;justify-content:space-between;font-size:10.5px;color:var(--t3);font-variant-numeric:tabular-nums;margin-top:-5px}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:30px;background:transparent;margin:0;cursor:pointer;touch-action:pan-y}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--blue) var(--p,0%),rgba(255,255,255,.16) var(--p,0%))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;margin-top:-11px;box-shadow:0 1px 3px #00000080,0 0 0 .5px #0003;transition:transform .12s ease}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.08)}input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:#ffffff29}input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--blue)}input[type=range]::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:none;box-shadow:0 1px 3px #00000080}.seg{display:flex;background:#ffffff14;border-radius:10px;padding:2px}.seg button{flex:1;border:none;background:transparent;color:var(--t2);font-size:13px;font-weight:500;padding:7px 0;border-radius:8px;transition:background .15s ease,color .15s ease}.seg button[aria-pressed=true]{background:#ffffff29;color:#fff;box-shadow:0 1px 2px #00000059}.shrow{display:flex;align-items:center;justify-content:center;gap:16px;padding:6px 0 2px}.shutter{width:66px;height:66px;border-radius:50%;background:#fff;border:none;padding:0;box-shadow:0 0 0 3px var(--bg),0 0 0 5px #ffffffe6,0 8px 20px #0006;transition:transform .12s cubic-bezier(.2,.8,.2,1)}.shutter:active{transform:scale(.9)}.shlab{display:flex;flex-direction:column;gap:2px}.shlab b{font-size:14px;font-weight:600}.shlab span{font-size:12px;color:var(--t3);font-variant-numeric:tabular-nums}.roll{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;min-height:0}.roll:empty{display:none}.roll::-webkit-scrollbar{display:none}.roll figure{margin:0;flex:0 0 auto;width:84px;border-radius:8px;overflow:hidden;cursor:pointer;background:#000;border:1px solid var(--line);transition:transform .15s ease,border-color .15s ease}.roll figure:hover{transform:translateY(-1px);border-color:var(--line2)}.roll img{display:block;width:100%;height:56px;object-fit:cover}.roll figcaption{font-size:10px;color:var(--t3);padding:4px 6px;line-height:1.3;font-variant-numeric:tabular-nums}.primary{border:none;border-radius:12px;background:var(--blue);color:#fff;font-size:14px;font-weight:600;padding:12px 16px;transition:background .15s ease,transform .12s ease}.primary:hover{background:var(--blue2)}.primary:active{transform:scale(.985)}.ghost{border:1px solid var(--line2);border-radius:12px;background:transparent;color:var(--t1);font-size:14px;font-weight:500;padding:11px 16px}.ghost:hover{background:#ffffff0f}.foot{font-size:11px;color:var(--t3);line-height:1.5;margin-top:auto}@media(max-width:900px){.app{display:block}.stage{height:100%}.panel{position:absolute;left:0;right:0;bottom:0;width:auto;height:auto;max-height:64%;border-left:none;border-top:1px solid var(--line);border-radius:20px 20px 0 0;padding:12px 16px calc(18px + env(safe-area-inset-bottom,0px));gap:14px;background:#0c0d10db;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);transition:max-height .5s cubic-bezier(.22,.8,.25,1)}.panel:before{content:"";display:block;width:38px;height:4px;border-radius:2px;background:#ffffff38;margin:0 auto 2px}.ph h1{font-size:19px}.ph .sub{display:none}.app[data-mode=wide] .panel{max-height:38%}.app[data-mode=close] .panel{max-height:56%}.app[data-mode=wide] .grp.cam,.app[data-mode=wide] .shrow,.app[data-mode=wide] .roll,.app[data-mode=wide] .foot{display:none}.app[data-mode=close] .grp.tri{order:5}.app[data-mode=close] .btnAdjust,.app[data-mode=wide] .btnBack{display:none}.grp{padding:14px 14px 12px;gap:12px}.panel .roll{order:6}}@media(min-width:901px){.btnAdjust,.btnBack{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}