:root{color-scheme:dark;--bg:#10131c;--panel:#161a25;--border:#2b2e3d;--text:#eeeef6;--muted:#9499ae;--purple:#bca4f5;--tank:#4e9fee;--healer:#65cb85;--dps:#ee777b;font-family:Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px}button,input,select{font:inherit}button,a,select,input{touch-action:manipulation}button{cursor:pointer;color:inherit;border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--purple);outline-offset:4px}button{transition:background .16s,border-color .16s,color .16s}button:hover{filter:brightness(1.13)}.site-header{height:72px;display:flex;align-items:center;padding:0 36px;border-bottom:1px solid var(--border);gap:44px}.brand{font-size:13px;letter-spacing:2px;display:flex;align-items:center;gap:8px}.brand strong{font-weight:400;color:var(--muted)}.brand-mark{color:var(--purple);font-size:30px;margin-right:6px}.breadcrumb{font-size:10px;letter-spacing:1.8px;color:var(--muted)}.breadcrumb span{margin:0 12px;color:#51566c}.text-button{margin-left:auto;background:none;color:#c2c3d0;font-size:12px}.text-button span{margin-left:15px;color:var(--purple)}main{max-width:1640px;margin:auto;padding:36px 36px 0}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.7px;color:var(--muted)}.violet-dot,.live-dot{display:inline-block;height:5px;width:5px;background:var(--purple);border-radius:50%;margin-right:8px;vertical-align:middle}h1{font-size:42px;font-weight:600;letter-spacing:-1.7px;margin:10px 0 8px;line-height:1.15}.title-dot{color:var(--purple)}.page-heading p{color:var(--muted);font-size:13px;margin:0}.mode-badge{font-size:9px;letter-spacing:1.6px;color:#aaa6bc;background:#1c1b29;border:1px solid #343042;padding:10px 12px;border-radius:4px}.mode-badge span{color:var(--purple);margin-right:8px}.workspace{display:grid;grid-template-columns:244px minmax(400px,1fr) 264px;gap:26px;align-items:start}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 15px}.section-heading h2{font-size:12px;font-weight:600;margin:0}.section-heading>span{font-size:9px;letter-spacing:1px;color:#787f96}.variants{display:grid;gap:9px}.variant{display:flex;align-items:center;gap:10px;text-align:left;min-height:65px;padding:11px 12px;background:var(--panel);border:1px solid var(--border);border-radius:6px}.variant[aria-pressed=true]{background:#282236;border-color:#ad91e3;box-shadow:inset 3px 0 #bca4f5}.variant-symbol{font-size:17px;color:#9c98b5;letter-spacing:-4px;width:23px;flex-shrink:0}.variant strong{display:block;font-size:12px;font-weight:550}.variant small{display:block;font-size:10px;margin-top:6px;color:var(--muted);white-space:nowrap}.selected-dot{margin-left:auto;width:5px;height:5px;border-radius:50%;flex-shrink:0}.variant[aria-pressed=true] .selected-dot{background:var(--purple)}.surprise{background:transparent;border:1px dashed #494157;border-radius:6px;padding:14px 13px;display:flex;align-items:center;gap:10px;font-size:12px;color:#c7b3ed;margin-top:2px}.surprise span:first-child{font-size:20px;line-height:12px}.surprise span:last-child{margin-left:auto}.panel-divider{height:1px;background:var(--border);margin:23px 0}.tiny-button{background:none;color:var(--purple);font-size:10px;padding:0}.small-muted{color:var(--muted);font-size:11px;line-height:1.65;margin:0 0 14px}.party-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.player-button{padding:9px 0;background:#181d29;border:1px solid #30394a;border-radius:5px;font-size:11px;font-weight:600;color:var(--player-color)}.player-button[aria-pressed=true]{border-color:var(--player-color);background:color-mix(in srgb,var(--player-color) 15%,#111522)}.role-legend{display:flex;gap:19px;margin:13px 0 0;font-size:10px;color:var(--muted)}.role-legend i{display:inline-block;width:5px;height:5px;margin-right:6px;border-radius:50%}.tank{background:var(--tank)}.healer{background:var(--healer)}.dps{background:var(--dps)}.toggle-row{display:flex;position:relative;align-items:center;justify-content:space-between;margin:16px 0;font-size:11px;color:#b4b6c7;cursor:pointer}.toggle-row input{position:absolute;right:0;opacity:0;width:30px;height:20px;cursor:pointer}.switch{width:28px;height:16px;background:#343647;border-radius:20px;pointer-events:none;position:relative}.switch:after{content:"";position:absolute;top:3px;left:3px;width:10px;height:10px;border-radius:50%;background:#b6b6c5;transition:transform .15s}.toggle-row input:checked+.switch{background:#796397}.toggle-row input:checked+.switch:after{transform:translateX(12px);background:#ebddff}.toggle-row input:focus-visible+.switch{outline:2px solid var(--purple);outline-offset:4px}.teaching-note{font-size:10px;line-height:1.7;color:#7f859c;margin:18px 0}.arena-panel{border:1px solid #343344;border-radius:8px;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#252d43 0%,#171d2c 65%,#141a27 100%)}.stage-heading{display:flex;align-items:center;justify-content:space-between;margin:17px 20px;color:#9ca4bd;font-size:8px;letter-spacing:1.25px}.stage-heading span:first-child{color:#bcb3d2}.compass-mini{font-size:13px;margin-left:7px}.boss-bar{width:66%;max-width:430px;margin:23px auto 0}.boss-title{display:flex;justify-content:space-between;color:#9aa0b2;font-size:10px;align-items:center}.boss-title strong{color:#dddce9;font-size:12px;font-weight:500;margin-left:6px}.boss-title>span:last-child{font-size:8px;letter-spacing:1px;color:#a88697}.boss-diamond{color:#e5859a;margin-right:6px;font-size:9px}.hp-line{height:3px;background:linear-gradient(90deg,#965267,#d28491);margin:7px 0 13px;box-shadow:0 0 8px #bb71872a}.cast-label{display:flex;justify-content:space-between;gap:6px;font-size:11px;margin-bottom:6px;color:#e9d8b2}.cast-label #cast-time{font-variant-numeric:tabular-nums;font-size:10px;color:#c4bda8}.cast-track{height:7px;border-radius:2px;background:#35343e;border:1px solid #696150;overflow:hidden}.cast-track>div{height:100%;width:0;background:linear-gradient(90deg,#967345,#f1d997);box-shadow:0 0 8px #eacb91}.arena-container{width:100%;max-width:650px;margin:0 auto}.arena-container svg{display:block;width:100%;height:auto}.direction{fill:#909bb5;font-size:12px;font-weight:500;text-anchor:middle;letter-spacing:1px}.board-footer{display:flex;align-items:center;justify-content:space-between;margin:0 18px 16px;gap:10px;font-size:9px;color:#9a9fb5}.board-footer>span:first-child{display:flex;align-items:center;white-space:nowrap;gap:6px}.board-footer>span:last-child{color:#d0c1ee;text-align:right}.aoe-key,.bait-key{display:inline-block;width:8px;height:8px;border:1px solid #e6a974;background:#a46b4033;border-radius:2px}.bait-key{border-radius:50%;background:transparent;border-color:#df95c6;margin-left:8px}.transport{display:flex;align-items:center;gap:12px;padding:16px 1px 12px}.transport-buttons{display:flex;gap:9px;align-items:center}.icon-button{background:none;color:#9f9eb6;border-radius:4px;padding:7px;font-size:17px;line-height:1}.icon-button[aria-pressed=true]{color:var(--purple);background:#2a2338}.play-button{display:flex;gap:9px;align-items:center;border-radius:5px;background:#c0a4ef;color:#211932;font-size:12px;font-weight:650;padding:10px 18px;min-width:84px;justify-content:center}.play-button span:first-child{font-size:10px}.time-display{margin-left:auto;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}.time-display>span:last-child{color:#707891}.speed-label select{border:0;background:#1e2230;color:#b9bacc;border-radius:4px;padding:6px 5px;font-size:10px;max-width:82px}.timeline{position:relative;padding-top:3px}input[type=range]{width:100%;margin:0;appearance:none;background:transparent;height:18px;cursor:pointer;position:relative;z-index:2}input[type=range]::-webkit-slider-runnable-track{height:4px;background:linear-gradient(to right,#b69be7 var(--progress,0%),#353346 var(--progress,0%));border-radius:8px}input[type=range]::-webkit-slider-thumb{appearance:none;background:#dbcbf7;height:11px;width:11px;border-radius:50%;margin-top:-3.5px;box-shadow:0 0 0 3px #b69be718}input[type=range]::-moz-range-track{height:4px;background:#353346}input[type=range]::-moz-range-progress{background:#b69be7;height:4px}input[type=range]::-moz-range-thumb{background:#dbcbf7;width:11px;height:11px;border:0;border-radius:50%}.timeline-ticks{position:absolute;top:9px;left:5px;right:5px;pointer-events:none}.tick{position:absolute;top:0;height:5px;width:2px;background:#d9b680}.tick em{font-size:8px;color:#81859b;position:absolute;top:14px;left:50%;transform:translateX(-50%);font-style:normal;white-space:nowrap}.timeline-label{display:flex;justify-content:space-between;font-size:7px;letter-spacing:.8px;color:#727a92;margin-top:18px}.timeline-label span:nth-child(2){opacity:0}.keyboard-hint{display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#777f97;margin-top:22px;gap:10px}.keyboard-hint b{font-weight:400;color:#aaaec3;font-variant-numeric:tabular-nums;margin-left:5px}kbd{font-family:inherit;font-size:8px;border:1px solid #333747;border-radius:3px;padding:2px 4px;margin-right:3px}kbd:not(:first-child){margin-left:6px}.pill{padding:5px 7px;border:1px solid #3b344d;background:#211d2b;border-radius:4px;color:#b9a8d4!important;font-size:8px!important;letter-spacing:.5px!important}.right-panel>h3{font-size:23px;letter-spacing:-.7px;margin:23px 0 9px;font-weight:500}.steps{position:relative;margin:23px 0}.steps:before{content:"";position:absolute;left:15px;top:22px;bottom:22px;border-left:1px solid #363344}.step{display:flex;gap:13px;width:100%;text-align:left;background:none;padding:13px 0;position:relative;align-items:center;border-radius:5px}.step-num{background:#1e2230;border:1px solid #444252;color:#81849c;width:31px;height:31px;display:grid;place-items:center;border-radius:50%;font-size:10px;flex-shrink:0}.step.current .step-num{border-color:#bba0ed;background:#30263f;color:#e5d3ff;box-shadow:0 0 0 4px #bba0ed0b}.step.done .step-num{background:#233631;border-color:#46685b;color:#87c9a5}.step-copy{flex:1}.step-copy strong{display:block;font-size:12px;font-weight:550}.step-copy small{display:block;font-size:10px;color:#9298ae;margin-top:5px}.step-time{font-size:9px;color:#717b94;font-variant-numeric:tabular-nums}.step.current .step-copy strong{color:#d3bdf8}.instruction-card{background:#211f2e;border:1px solid #40364e;border-radius:6px;padding:17px;margin:16px 0}.instruction-card .eyebrow{font-size:8px;color:#baa0e5;letter-spacing:1.1px}.instruction-card h3{font-size:16px;font-weight:500;margin:10px 0;line-height:1.4}.instruction-card p,.remember p,.focus-card p{color:#b1adc3;font-size:11px;line-height:1.75;margin:0}.remember{display:flex;gap:11px;padding:9px 2px}.remember>span{font-size:21px;color:var(--purple)}.remember strong{display:block;font-size:11px;font-weight:500;margin:1px 0 7px}.remember p{font-size:10px;color:#8b92aa}.notes-link{width:100%;display:flex;justify-content:space-between;background:none;font-size:10px;color:#b5a0d5;border-top:1px solid var(--border);padding:18px 0 0;margin-top:20px}.focus-card{border-left:2px solid var(--purple);padding:0 10px;margin:0 0 17px;font-size:12px}.focus-card strong{display:block;margin-bottom:6px;color:var(--purple)}footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid #262b39;margin-top:32px;padding:20px 0;color:#6f7890;font-size:9px}footer>span:first-child{letter-spacing:1.5px;font-size:8px}footer a{color:#a99bbb}.player-token{cursor:pointer;outline:none}.player-token:focus-visible .token-outline{stroke:#fff;stroke-width:4}.player-label{font-size:12px;text-anchor:middle;dominant-baseline:central;fill:#fff;font-weight:700;paint-order:stroke;stroke:#151a2633;stroke-width:2}.waymark-text{font-size:18px;font-weight:600;text-anchor:middle;dominant-baseline:central}.cue-text{font-size:9px;letter-spacing:1px;fill:#d9bedf;text-anchor:middle}.status-text{font-size:8px;text-anchor:middle;fill:#a7d0b9}dialog{color:var(--text);background:#191d29;border:1px solid #51405e;border-radius:10px;max-width:660px;width:calc(100% - 32px);max-height:85vh;padding:25px 30px;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#070911c7;backdrop-filter:blur(6px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center}dialog h2{font-size:30px;letter-spacing:-1px;margin:15px 0 20px}dialog h3{color:#d9c5f8;font-size:14px;margin-top:25px}dialog p,dialog li{font-size:12px;line-height:1.8;color:#b4b7cb}.source-list{padding-left:18px}.source-list a{color:#c7adef;text-decoration:underline;text-underline-offset:3px}dialog strong{color:#e0d9ee}.source-list li{margin:7px 0}[hidden]{display:none!important}
@media(min-width:1450px){.workspace{grid-template-columns:270px minmax(450px,1fr) 290px;gap:32px}.variant{padding:14px}.variant strong{font-size:13px}.variant small{font-size:11px}.arena-container{max-width:660px}}
@media(max-width:1150px){main{padding:28px 22px 0}.site-header{padding:0 22px}.workspace{grid-template-columns:210px minmax(340px,1fr);gap:22px}.right-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.right-panel>.section-heading,.right-panel>h3,.right-panel>.small-muted,.right-panel>.steps{grid-column:1}.right-panel>.section-heading{grid-row:1}.right-panel>h3{grid-row:2;margin-top:10px}.right-panel>.small-muted{grid-row:3}.right-panel>.steps{grid-row:4/8;margin:0}.instruction-card{grid-column:2;grid-row:1/5;margin:0 0 15px}.focus-card,.remember,.notes-link{grid-column:2}.variant{padding:11px 8px;gap:6px}.variant small{font-size:9px}.variant strong{font-size:11px}.selected-dot{display:none}.stage-heading{font-size:7px}.keyboard-hint{font-size:7px}.transport{gap:6px}.transport-buttons{gap:3px}.play-button{padding:10px 12px;min-width:70px}.mode-badge{font-size:8px}.right-panel .steps:before{bottom:28px}.right-panel .notes-link{margin-top:12px}}
@media(max-width:700px){.site-header{height:60px;padding:0 18px}.brand{font-size:11px;letter-spacing:1.3px}.breadcrumb{display:none}main{padding:25px 16px 0}.page-heading{margin-bottom:25px}.mode-badge{display:none}h1{font-size:36px}.page-heading p{font-size:11px}.workspace{display:flex;flex-direction:column;gap:24px}.left-panel,.stage-column,.right-panel{width:100%}.left-panel>.panel-divider,.left-panel>.section-heading:not(:first-child),.left-panel>.small-muted,.left-panel>.party-grid,.left-panel>.role-legend,.left-panel>.toggle-row,.left-panel>.teaching-note{display:none}.variants{grid-template-columns:1fr 1fr;gap:8px}.variant{min-height:61px;padding:10px}.variant strong{font-size:11px}.variant small{font-size:8px}.surprise{grid-column:1/-1;padding:11px 13px}.arena-container{max-width:550px}.boss-bar{margin-top:20px;width:72%}.stage-heading{margin:14px}.right-panel{display:block}.right-panel>.steps{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;margin:12px 0}.steps:before{display:none}.right-panel>.instruction-card{margin:16px 0}.right-panel>.section-heading{margin-bottom:15px}.transport{gap:8px}.transport-buttons{gap:1px}.time-display{font-size:9px}.icon-button{padding:6px;font-size:15px}.play-button{min-width:62px;padding:9px 10px}.speed-label select{font-size:9px;max-width:67px}.board-footer{font-size:8px;margin:0 12px 14px}.keyboard-hint{font-size:8px}.keyboard-hint>span:first-child{display:none}.keyboard-hint>span:last-child{margin-left:auto}footer{font-size:8px;line-height:1.6;align-items:center}footer>span:last-child{max-width:220px;text-align:right}dialog{padding:22px}.step-time{font-size:8px}.step{gap:9px}.step-copy strong{font-size:11px}.step-copy small{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

@media(min-width:701px){.arena-container{max-width:clamp(440px,calc(100vh - 400px),600px)}}

/* Keep the tell large and clear, outside player movement lanes. */
.tell-display{display:flex;justify-content:center;margin:10px auto 0;min-height:88px}
.tell-display svg{display:block;width:180px;height:auto;overflow:visible}
.tell-display .cue-text{font-size:10px;letter-spacing:.8px;fill:#e0d6ec}
@media(max-width:700px){.tell-display{margin-top:12px;min-height:82px}.tell-display svg{width:165px}}