/* AUREX V5 / Stage 5. Namespaced to avoid affecting the film or scroll chapters. */
.arx-studio{position:relative;isolation:isolate;background:radial-gradient(ellipse 70% 42% at 58% 33%,#19202a 0%,#0d1014 68%,#080a0d 100%);color:#f0ebe3;overflow:hidden;padding:clamp(76px,9vw,142px) clamp(18px,5.4vw,90px) 86px;border-top:1px solid rgba(228,206,170,.17);border-bottom:1px solid rgba(228,206,170,.17)}
.arx-studio::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(230,217,193,.035) 25%);pointer-events:none;z-index:-1}
.arx-kicker{font:700 11px/1.3 Arial,sans-serif;letter-spacing:.23em;color:#c8ad8d;display:flex;align-items:center;gap:14px;text-transform:uppercase}.arx-kicker::before{content:"";width:36px;height:1px;background:#be9e76}
.arx-top{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(250px,.62fr);gap:30px;align-items:end;max-width:1500px;margin:0 auto 35px}
.arx-heading{font:500 clamp(55px,8vw,137px)/.89 Georgia,serif;letter-spacing:-.069em;margin:24px 0 0;text-transform:uppercase}.arx-heading em{color:#dfc4a1;font-weight:400}
.arx-topcopy{color:#aeb6bc;font:400 15px/1.7 Arial,sans-serif;max-width:330px;margin:0 0 8px}.arx-topcopy strong{display:block;letter-spacing:.18em;font:700 10px/1.4 Arial,sans-serif;color:#e2cba6;margin-bottom:16px}
.arx-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,332px);gap:14px;max-width:1500px;margin:0 auto;align-items:stretch}
.arx-visual{position:relative;overflow:hidden;min-height:clamp(390px,45vw,630px);background:radial-gradient(ellipse 67% 58% at 50% 52%,#29313a 0%,#141b22 48%,#080b10 100%);border:1px solid #535b6457}
.arx-visual::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(192,209,227,.075),transparent 38%,rgba(209,153,86,.05) 78%,transparent);z-index:2}
.arx-visual::after{content:"";position:absolute;bottom:10%;width:90%;height:27%;left:5%;border-radius:50%;background:radial-gradient(ellipse,rgba(193,171,146,.15),transparent 68%);filter:blur(24px);pointer-events:none}
.arx-gridfloor{position:absolute;z-index:0;inset:42% -20% -31%;opacity:.33;transform:perspective(350px) rotateX(61deg);background-image:linear-gradient(rgba(181,195,204,.20) 1px,transparent 1px),linear-gradient(90deg,rgba(181,195,204,.20) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(transparent,black 45%,transparent)}
.arx-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.68;filter:saturate(.75) contrast(1.13)}
.arx-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;display:block;touch-action:pan-y;cursor:grab;opacity:0;transition:opacity .45s ease;outline-offset:-5px}
.arx-canvas.is-ready{opacity:1;touch-action:none}
.arx-canvas:active{cursor:grabbing}.arx-canvas:focus-visible{outline:3px solid #e9bd8b}
.arx-visual[data-mode="3d"] .arx-poster{opacity:0;transition:opacity .3s}
.arx-visual[data-mode="still"] .arx-poster,.arx-visual[data-mode="error"] .arx-poster{opacity:.83}
.arx-visual[data-mode="still"] .arx-canvas,.arx-visual[data-mode="error"] .arx-canvas{display:none}
.arx-hudtop,.arx-hudbottom{position:absolute;z-index:3;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;gap:15px;pointer-events:none;font:700 10px/1.35 Arial,sans-serif;letter-spacing:.19em;color:#e7ddcf}
.arx-hudtop{top:22px}.arx-hudbottom{bottom:20px}.arx-hudtop span:last-child,.arx-hudbottom span:last-child{color:#b5abb1}.arx-corner{position:absolute;z-index:3;top:50%;left:26px;color:#bdc4c8;font-size:18px;opacity:.42;pointer-events:none}
.arx-start{position:absolute;z-index:5;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,rgba(8,10,13,.5),rgba(8,10,13,.23));}
.arx-start button{display:inline-flex;align-items:center;gap:17px;padding:19px 25px;background:#ebd9bc;color:#101315;font:700 11px/1 Arial,sans-serif;letter-spacing:.13em;border:0;cursor:pointer;min-height:53px}.arx-start button:hover{background:white}
.arx-start[hidden],.arx-error[hidden]{display:none}
.arx-spinner{border:2px solid rgba(233,213,187,.25);border-top-color:#e6c9aa;width:26px;height:26px;border-radius:100%;display:inline-block;animation:arxspin 1.1s linear infinite}@keyframes arxspin{to{transform:rotate(360deg)}}
.arx-error{position:absolute;z-index:5;inset:auto 14px 56px;padding:18px;background:#0e1217e9;border:1px solid #c49e77;color:#eee0d0;max-width:490px;font:13px/1.6 Arial,sans-serif}.arx-error strong{display:block;margin-bottom:4px}.arx-error button{margin-top:9px;background:#d0b08b;border:0;padding:9px 13px;color:#121416;cursor:pointer}
.arx-controls{border:1px solid #535b6457;background:linear-gradient(160deg,#191d22,#0c0f12);padding:27px 24px;display:flex;flex-direction:column;gap:18px;min-width:0}
.arx-paneltitle{font:700 10px/1.2 Arial,sans-serif;color:#ccb38e;letter-spacing:.24em}.arx-panelheading{font:500 28px/1.05 Georgia,serif;color:#f8f2e9;margin:2px 0 0}.arx-paneltext{font:13px/1.6 Arial,sans-serif;color:#a6abb2;margin:2px 0 0}
.arx-rule{height:1px;background:#b3ad9b29}
.arx-label{font:700 10px/1.2 Arial,sans-serif;letter-spacing:.16em;color:#c0b2a1;margin:0 0 10px;display:block}
.arx-buttonrows{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.arx-buttonrows.wide{grid-template-columns:repeat(3,1fr)}
.arx-controlbtn{border:1px solid #59616c8a;background:transparent;color:#e0dbd4;min-height:42px;padding:10px 7px;font:700 10px/1.2 Arial,sans-serif;letter-spacing:.07em;cursor:pointer;transition:background .2s,color .2s}.arx-controlbtn:hover,.arx-controlbtn[aria-pressed="true"]{background:#dfc39b;color:#11151a;border-color:#dfc39b}
.arx-controlbtn:focus-visible,.arx-swatch:focus-visible,.arx-launch:focus-visible{outline:2px solid #edc69a;outline-offset:3px}
.arx-swatches{display:flex;gap:9px;flex-wrap:wrap}.arx-swatch{width:34px;height:34px;border-radius:50%;background:var(--paint);border:3px solid #101519;outline:1px solid #555e66;cursor:pointer}.arx-swatch[aria-pressed="true"]{outline:2px solid #f4dfbf;outline-offset:2px}
.arx-zoom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.arx-panelbottom{margin-top:auto;display:grid;gap:12px}
.arx-reset{width:100%;background:#e6d2b3;color:#11141a;border:0;padding:16px 10px;letter-spacing:.13em;font:700 11px/1 Arial,sans-serif;cursor:pointer}.arx-reset:hover{background:white}
.arx-modebtn{width:100%;background:transparent;border:1px solid #6a6b6b;color:#e7dfd1;padding:12px 10px;cursor:pointer;font:700 10px/1 Arial,sans-serif;letter-spacing:.12em}
.arx-tiny{color:#9ca2aa;font:12px/1.55 Arial,sans-serif;margin:0}
.arx-foot{max-width:1500px;display:flex;justify-content:space-between;gap:20px;margin:18px auto 0;color:#959ca4;font:700 10px/1.5 Arial,sans-serif;letter-spacing:.13em}.arx-foot strong{color:#e3c9a6;font-weight:700}
@media(max-width:970px){.arx-layout{grid-template-columns:1fr}.arx-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.arx-panelbottom{margin-top:0}.arx-controls>.arx-rule{display:none}.arx-top{grid-template-columns:1fr}.arx-heading{font-size:clamp(58px,11vw,104px)}.arx-topcopy{max-width:620px}.arx-visual{min-height:490px}}
@media(max-width:600px){.arx-studio{padding:80px 15px 66px}.arx-top{gap:17px;margin-bottom:20px}.arx-heading{font-size:clamp(53px,14vw,83px)}.arx-kicker{font-size:9px}.arx-topcopy{font-size:13px}.arx-visual{min-height:390px;aspect-ratio:4/4.4}.arx-poster{object-position:58% center}.arx-hudtop,.arx-hudbottom{left:13px;right:13px;font-size:8px;letter-spacing:.07em}.arx-hudtop{top:15px}.arx-hudbottom{bottom:13px}.arx-hudtop span:last-child{display:none}.arx-controls{grid-template-columns:1fr;padding:21px 18px}.arx-controls>.arx-rule{display:block}.arx-foot{flex-direction:column;font-size:9px;gap:5px}.arx-start button{font-size:10px;padding:15px 15px}.arx-buttonrows.wide{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){.arx-canvas,.arx-poster,.arx-controlbtn{transition:none!important}.arx-spinner{animation:none}}

/* Stage 9: accessible paint choices on touchscreens. */
@media(pointer:coarse){.arx-swatch{width:44px;height:44px}}