.ab-archive-scene{position:relative;isolation:isolate;min-height:380px;overflow:hidden;--scene-ink:#252a24;--scene-muted:#77796e;--scene-line:rgba(50,55,43,.12);--scene-red:#e74625;color:var(--scene-ink)}
.ab-scene-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:3;cursor:grab;touch-action:pan-y}
.ab-scene-dragging .ab-scene-canvas{cursor:grabbing}
.ab-scene-grid{position:absolute;inset:7% 5% 8%;opacity:.35;background-image:radial-gradient(var(--scene-muted) .6px,transparent .6px);background-size:23px 23px;mask-image:radial-gradient(ellipse,black,transparent 70%);pointer-events:none}
.ab-scene-ring{position:absolute;border:1px solid var(--scene-line);border-radius:50%;pointer-events:none;z-index:1}
.ab-scene-ring--one{width:76%;height:76%;left:12%;top:12%;transform:rotate(-27deg) scaleY(.87)}
.ab-scene-ring--two{width:95%;height:52%;left:2.5%;top:25%;transform:rotate(-27deg);border-style:dashed;border-color:var(--scene-line)}
.ab-scene-ring--one:after{content:"";position:absolute;top:22%;left:4%;width:7px;height:7px;background:var(--scene-red);border:3px solid #f5f3eb;border-radius:50%;box-shadow:0 0 0 1px var(--scene-red)}
.ab-scene-caption{position:absolute;top:9%;left:4.5%;z-index:4;display:flex;gap:10px;font:500 9px/1.55 "IBM Plex Mono","Courier New",monospace;letter-spacing:1px;pointer-events:none}
.ab-scene-cross{font-size:22px;font-weight:300;line-height:.85;opacity:.5}
.ab-scene-number{display:block;color:var(--scene-muted);font-size:8px;letter-spacing:.6px}
.ab-scene-shadow{position:absolute;left:21%;right:20%;bottom:10%;height:8%;border-radius:50%;background:rgba(34,39,29,.2);filter:blur(16px);transform:rotate(-8deg);z-index:0}
.ab-scene-tag{position:absolute;right:2%;bottom:25%;display:flex;align-items:center;gap:7px;z-index:4;font:500 8px/1.4 "IBM Plex Mono","Courier New",monospace;letter-spacing:.65px;pointer-events:none}
.ab-scene-tag:before{content:"";width:38px;height:1px;background:var(--scene-line);margin-right:2px}
.ab-scene-tag-dot{height:4px;width:4px;background:var(--scene-red);border-radius:50%}
.ab-scene-side-label{position:absolute;right:2%;top:24%;writing-mode:vertical-rl;font:500 8px/1 "IBM Plex Mono","Courier New",monospace;letter-spacing:1.8px;color:var(--scene-muted);pointer-events:none}
.ab-scene-footer{position:absolute;left:5%;right:4%;bottom:3%;z-index:5;display:flex;justify-content:space-between;align-items:center}
.ab-scene-instruction{font:500 8px/1 "IBM Plex Mono","Courier New",monospace;letter-spacing:1px;color:var(--scene-muted);display:flex;align-items:center;gap:8px}
.ab-scene-instruction>span{font:400 17px/1 Arial,sans-serif;color:var(--scene-ink)}
.ab-scene-controls{display:flex;gap:7px}
.ab-scene-controls button{display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--scene-line);border-radius:50%;color:var(--scene-ink);background:transparent;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.ab-scene-controls button:hover{background:rgba(100,100,80,.07);border-color:var(--scene-muted);transform:translateY(-2px)}
.ab-scene-controls button:focus-visible{outline:2px solid var(--scene-red);outline-offset:4px}
.ab-scene-controls svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.ab-scene-fallback{position:absolute;inset:0;perspective:1000px;z-index:3}
.ab-scene-fallback[hidden]{display:none}
.ab-fallback-disk{width:48%;height:63%;position:absolute;top:16%;left:28%;background:linear-gradient(140deg,#3a3d37,#1b201b);border-radius:12px 12px 24px 12px;transform:rotate(-9deg) rotateY(-20deg);box-shadow:9px 7px 0 #121710,17px 14px 0 rgba(240,74,36,.65),28px 24px 0 rgba(100,110,95,.2)}
.ab-fallback-shutter{position:absolute;top:0;left:25%;width:57%;height:37%;background:#ef4b29;border-radius:0 0 5px 5px}
.ab-fallback-shutter:after{content:"";position:absolute;top:20%;right:20%;height:65%;width:20%;background:#252b24;border-radius:2px}
.ab-fallback-label{position:absolute;left:7%;right:7%;bottom:8%;height:43%;padding:9% 7%;box-sizing:border-box;background:#e7e5d8;border-radius:4px;font:900 clamp(19px,3vw,33px)/.95 Arial,sans-serif;color:#22281f;letter-spacing:-1.5px}
.ab-fallback-label small{display:block;font:8px/1.2 monospace;letter-spacing:.3px;margin-top:12px;padding-top:8px;border-top:1px solid #41473a}
html[data-theme="dark"] .ab-archive-scene,body[data-theme="dark"] .ab-archive-scene{--scene-ink:#ebe8dc;--scene-muted:#969b8b;--scene-line:rgba(220,225,208,.13)}
html[data-theme="dark"] .ab-scene-shadow,body[data-theme="dark"] .ab-scene-shadow{background:rgba(0,0,0,.6)}
html[data-theme="dark"] .ab-scene-ring--one:after,body[data-theme="dark"] .ab-scene-ring--one:after{border-color:#1b211b}
@media(max-width:800px){.ab-scene-caption{top:6%;left:5%}.ab-scene-tag{right:4%;bottom:20%;font-size:7px}.ab-scene-tag:before{width:20px}.ab-scene-side-label{right:3%;font-size:7px}.ab-scene-footer{bottom:1%}.ab-scene-shadow{bottom:8%;}.ab-scene-controls button{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.ab-scene-controls button{transition:none}.ab-scene-controls button:hover{transform:none}}