@font-face{font-family:StudioSerif;src:local("Songti SC"),local("STSong")}*{box-sizing:border-box}body{margin:0;background:#101719;color:#e9e5db;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,canvas:focus-visible,input:focus-visible{outline:2px solid #d8bd86;outline-offset:4px}.topbar{max-width:1600px;margin:auto;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dbbc7b22}.brand{display:flex;align-items:center;gap:12px;letter-spacing:3px;font-family:StudioSerif,serif;font-size:17px}.brand>span{display:grid;place-items:center;width:36px;height:39px;border:1px solid #c9ad75;color:#d8bd86;font-size:25px}.brand small{border-left:1px solid #d7c09644;padding-left:14px;font:11px sans-serif;letter-spacing:2px;color:#b3b5ac}.back{font-size:12px;color:#bdc2b8;min-height:44px;display:flex;align-items:center;gap:16px}.back:hover{color:#e4c48b}main{max-width:1500px;margin:auto;padding:34px 5% 28px}.intro{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:28px}.eyebrow{font-size:9px;letter-spacing:3px;color:#bda77b;margin:0 0 12px}h1{font:34px/1.3 StudioSerif,"Songti SC",serif;letter-spacing:5px;margin:0 0 12px}h1 span{font:13px -apple-system,sans-serif;letter-spacing:3px;display:inline-block;margin-left:20px;color:#b0b8b0;vertical-align:middle}.description{font-size:12px;color:#a8b0ac;line-height:1.8;margin:0}.primary{border:1px solid #d4b67d;background:#c5a66b;color:#17201f;padding:15px 20px;font-size:12px;letter-spacing:1px;min-height:46px;white-space:nowrap}.primary span{margin-left:15px}.primary:hover:not(:disabled){background:#e0c48c}.comparison{height:min(59vw,590px);min-height:420px;max-height:64vh;position:relative;background:radial-gradient(ellipse at 25% 35%,#293535 0,transparent 48%),radial-gradient(ellipse at 75% 35%,#293535 0,transparent 48%),#151f21;border:1px solid #d2bd8d33;overflow:hidden}.comparison canvas{display:block;width:100%;height:100%;touch-action:none}.pane-label{position:absolute;top:26px;display:flex;gap:12px;align-items:center;z-index:2;pointer-events:none;width:calc(50% - 48px)}.pane-label.original{left:24px}.pane-label.enhanced{left:calc(50% + 24px)}.number{font:11px Georgia,serif;color:#ab9772;border-right:1px solid #c9ab7744;padding:7px 12px 7px 0}.pane-label h2{font:20px StudioSerif,serif;letter-spacing:3px;margin:0 0 6px}.pane-label p{font-size:8px;letter-spacing:2px;color:#9faea8;margin:0}.badge{margin-left:auto;border:1px solid #b5a28244;padding:5px 8px;font-size:9px;color:#c7b697;letter-spacing:1px}.enhanced .badge{color:#bbd8c1;border-color:#87b09866;background:#79a18b0c}.divider{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#b7b5a326;pointer-events:none}.stage-notes{position:absolute;left:0;right:0;bottom:15px;display:flex;justify-content:space-between;padding:0 24px;font-size:9px;letter-spacing:1px;color:#a7b4ac;pointer-events:none}.pane-stat{position:absolute;bottom:50px;font-size:9px;letter-spacing:1px;line-height:1.9;color:#aebdb4;pointer-events:none}.pane-stat.left{left:24px}.pane-stat.right{left:calc(50% + 24px)}#compare-loading{position:absolute;inset:0;background:#121b1eef;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:5;text-align:center;padding:24px}#compare-loading[hidden]{display:none}#compare-loading strong{font:20px StudioSerif,serif;letter-spacing:3px;margin-top:15px}#compare-loading p{font-size:12px;color:#abb6ac;line-height:1.8}.loader{width:26px;height:26px;border:1px solid #d7c18b33;border-top-color:#d7c18b;border-radius:50%;animation:turn 1s linear infinite}@keyframes turn{to{transform:rotate(360deg)}}.toolbar{display:flex;flex-wrap:wrap;gap:16px 25px;align-items:center;border:1px solid #d2bd8d33;border-top:0;background:#151e20;padding:17px 20px}.control-group{display:flex;align-items:center;gap:12px}.control-label,.timeline-label{font-size:10px;color:#a8b2ac;white-space:nowrap;letter-spacing:1px}.segmented{display:flex;border:1px solid #d3c09733}.segmented button,.subtle{border:0;background:transparent;color:#adb9b1;font-size:11px;padding:11px 14px;min-height:44px}.segmented button+button{border-left:1px solid #d3c09722}.segmented button[aria-pressed=true]{background:#c2ad7c20;color:#e4d0a0}.segmented button:hover,.subtle:hover{background:#b0bdb410;color:#ece6d7}.subtle{border:1px solid #d3c09733;padding:10px 12px}.view-controls{margin-left:auto;gap:10px}.timeline-label{width:86px;display:flex;justify-content:space-between}#motion-frame{flex:1;min-width:140px;height:24px;accent-color:#cbb27c;margin:0;cursor:pointer}.details{margin-top:19px;color:#919e98;font-size:10px;line-height:1.9;letter-spacing:.3px}.details p{margin:5px 0}.dot{display:inline-block;width:4px;height:4px;border-radius:50%;background:#c3ae7e;margin:0 7px 2px 20px}.dot:first-child{margin-left:0}@media(max-width:800px){.topbar{padding:14px 5%}.brand{font-size:14px;gap:9px;letter-spacing:2px}.brand small{display:none}.back{font-size:11px}main{padding-top:25px}.intro{display:block;margin-bottom:20px}h1{font-size:28px}h1 span{font-size:11px;margin-left:12px}.description{font-size:11px;max-width:340px}.primary{margin-top:17px;width:100%;font-size:12px}.comparison{min-height:420px;height:58vh;max-height:560px}.pane-label{top:18px;width:calc(50% - 24px);gap:7px}.pane-label.original{left:12px}.pane-label.enhanced{left:calc(50% + 12px)}.pane-label h2{font-size:15px;letter-spacing:1px}.pane-label p{font-size:6px;letter-spacing:1px}.number{padding-right:7px;font-size:8px}.badge{display:none}.pane-stat.left{left:12px}.pane-stat.right{left:calc(50% + 12px)}.pane-stat{font-size:8px;letter-spacing:0}.stage-notes{padding:0 12px;font-size:8px;letter-spacing:0}.stage-notes #frame-label{display:none}.toolbar{padding:12px;gap:12px}.control-group{gap:9px;flex-wrap:wrap;width:100%}.control-label{width:28px}.segmented button{padding:10px 12px}.view-controls{margin-left:0;gap:7px}.view-controls .subtle{font-size:10px;padding:10px}.timeline-label{width:72px;font-size:9px}.details{font-size:9px}.dot{margin-left:12px}}@media(prefers-reduced-motion:reduce){.loader{animation:none}}

h1 strong{font-weight:400}.variant-picker{display:flex;gap:10px;align-items:center;font-size:10px;color:#a8b2ac}.variant-picker select{min-height:44px;border:1px solid #d3c09744;background:#1a2628;color:#e2d4b4;padding:8px 12px;font:inherit;font-size:12px;max-width:100%}.variant-picker select:focus-visible{outline:2px solid #d8bd86;outline-offset:3px}.variant-picker select:disabled{opacity:.5;cursor:wait}@media(max-width:800px){.variant-picker{width:100%}.variant-picker select{flex:1}}