.hskduel-ui .home-logo:not(.hskduel-identity){visibility:hidden}
.hskduel-ui .home-logo.hskduel-identity{display:flex;flex-direction:column;align-items:center;position:relative;filter:none!important;width:100%;max-width:580px;max-height:none;margin:0 auto;overflow:visible;color:var(--fg)}
.hskduel-ui .hskduel-stage{position:relative;width:100%;max-width:440px;aspect-ratio:480/360;isolation:isolate}
.hskduel-stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.hskduel-stage canvas{z-index:3}
.hskduel-stage .hskduel-slot{position:absolute;left:50%;top:48%;width:38%;transform:translate(-50%,-50%);transition:transform 540ms cubic-bezier(.22,.8,.25,1);z-index:2}.hskduel-stage .hskduel-gem{display:block;opacity:0;visibility:hidden}.hskduel-stage .hskduel-gem>.stone-cell{width:100%}
.hskduel-stage .hskduel-gem.is-active{opacity:1;visibility:visible}.hskduel-stage .hskduel-gem.is-falling{animation:hskduel-fall 580ms cubic-bezier(.24,.7,.23,1) both}
.hskduel-stage .hskduel-ring{position:absolute;left:50%;top:78%;width:28%;height:8%;border:1px solid currentColor;border-radius:50%;opacity:0;transform:translate(-50%,-50%);transform-origin:center}
.hskduel-identity.is-releasing .hskduel-ring{animation:hskduel-impact 800ms 260ms ease-out both}
.hskduel-ui .hskduel-wordmark{font-family:'Bansho Sans',Montserrat,Arial,sans-serif;font-size:clamp(26px,3.25vw,54px);font-weight:450;line-height:1.2;letter-spacing:.25em;margin:0 -.25em 0 0;white-space:nowrap}
.hskduel-ui .hskduel-sound{align-self:center;display:flex;align-items:center;justify-content:center;gap:7px;background:none;border:0;border-radius:50%;min-width:44px;min-height:44px;margin:14px 0 0;padding:10px;color:var(--muted);font-size:12px;line-height:1}
.hskduel-ui .hskduel-sound svg{width:18px;height:18px}
.hskduel-ui .hskduel-sound[aria-pressed="true"]{color:var(--fg)}
.hskduel-ui .home-menu .level-card{transition:background 150ms,color 150ms,border-color 150ms,box-shadow 150ms}
.hskduel-ui .home-menu .level-card.hskduel-hover{background:var(--fg);color:var(--bg);border-color:var(--fg);box-shadow:0 5px 22px #0000000c}
.hskduel-ui .home-menu:has(.hskduel-hover) .level-card.primary:not(.hskduel-hover){background:var(--bg);color:var(--fg);border-color:var(--line)}
.hskduel-ui .home-menu .home-brand{min-width:0}
.hskduel-ui .home-brand .syllabus-label{display:none}
.hskduel-ui .auth-brand .hskduel-sound{display:none}
.hskduel-ui .boot-screen img{filter:none!important;max-height:250px}

@keyframes hskduel-fall{0%{opacity:0;transform:translateY(-105px)}55%{opacity:1;transform:translateY(5px)}72%{transform:translateY(-3px)}100%{opacity:1;transform:translateY(0)}}
@keyframes hskduel-impact{0%{opacity:0;transform:scale(.35)}14%{opacity:.55}100%{opacity:0;transform:scale(2.1)}}
@media(max-width:800px){.hskduel-ui .home-logo.hskduel-identity{width:100%;max-width:330px;margin:0 auto}.hskduel-ui .hskduel-stage{max-width:270px}.hskduel-ui .hskduel-wordmark{font-size:30px}.hskduel-ui .hskduel-sound{margin-top:5px}.hskduel-ui .home-brand .online-now{margin-top:3px}}
@media(max-width:650px){.hskduel-ui .hskduel-stage{width:clamp(167px,28dvh,233px);height:auto;aspect-ratio:4/3}.hskduel-ui .hskduel-wordmark{font-size:26px}.hskduel-ui .home-menu .home-brand{margin-bottom:16px}.hskduel-ui .hskduel-sound{position:absolute;right:0;bottom:0;margin:0}.hskduel-ui .auth-brand .hskduel-stage{width:200px}}
@media(prefers-reduced-motion:reduce){.hskduel-stage .hskduel-gem,.hskduel-stage .hskduel-slot,.hskduel-stage .hskduel-ring{animation:none!important;transition:none!important}.hskduel-stage canvas{display:none}}

.hskduel-identity:not([data-level="4"]) .hskduel-slot{transform:rotate(0deg)}
/* Element colours follow the selected level throughout practice and duel setup. */
.hskduel-ui{--accent:#bddbe9;--aura:#85b9d225}
.hskduel-ui[data-element="2"]{--accent:#7bdec0;--aura:#43b89425}
.hskduel-ui[data-element="3"]{--accent:#ffb374;--aura:#f06d2828}
.hskduel-ui[data-element="4"]{--accent:#e8cf8b;--aura:#d7a94324}
.hskduel-ui .level-card[data-level="1"],.hskduel-ui [data-duel-level="1"]{--card-accent:#bddbe9;--card-aura:#73b3e024}
.hskduel-ui .level-card[data-level="2"],.hskduel-ui [data-duel-level="2"]{--card-accent:#7bdec0;--card-aura:#43b89424}
.hskduel-ui .level-card[data-level="3"],.hskduel-ui [data-duel-level="3"]{--card-accent:#ffb374;--card-aura:#f06d2826}
.hskduel-ui .home-menu .level-card,.hskduel-ui .duel-level-options button{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(115deg,var(--card-aura,#b3975920),var(--bg) 75%)!important;color:var(--fg)!important;border:1px solid color-mix(in srgb,var(--card-accent,#d7bc7b) 25%,var(--line))!important;box-shadow:inset 0 1px #ffffff08,0 14px 45px #00000012;border-radius:23px!important}
.hskduel-ui .home-menu .level-card.hskduel-hover,.hskduel-ui .home-menu .level-card.primary,.hskduel-ui .duel-level-options button.selected{border-color:var(--card-accent,#d7bc7b)!important;box-shadow:inset 0 0 45px var(--card-aura,#b3975920),0 8px 36px var(--card-aura,#b3975920)}
.hskduel-ui #home-challenge{--card-accent:#efd794;--card-aura:#a8904226;background:linear-gradient(115deg,#5e9e8a14,#cd702f14,#b7973922)!important}
.hskduel-ui .practice-options button.selected,.hskduel-ui .setup-steps [aria-current=step]{border-color:var(--accent)!important;background:linear-gradient(125deg,var(--aura),var(--soft))!important;color:var(--fg)!important;box-shadow:0 5px 30px var(--aura)}
.hskduel-ui .setup-words .controls>label,.hskduel-ui .setup-words .controls>button{background:linear-gradient(125deg,var(--aura),var(--soft));border-color:color-mix(in srgb,var(--accent) 22%,var(--line))}
.hskduel-ui input:focus-visible,.hskduel-ui select:focus-visible,.hskduel-ui button:focus-visible{outline-color:var(--accent)}
.hskduel-ui .duel-player.is-you{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));background:linear-gradient(130deg,var(--aura),var(--bg) 80%)}
.hskduel-ui .duel-player progress::-webkit-progress-value{background:var(--accent)}
.hskduel-identity[data-level="4"] .hskduel-slot[data-slot="1"]{transform:translate(-112%,-45%) rotate(-9deg)}
.hskduel-identity[data-level="4"] .hskduel-slot[data-slot="2"]{transform:translate(12%,-45%) rotate(9deg)}
.hskduel-identity[data-level="4"] .hskduel-slot[data-slot="3"]{transform:translate(-50%,-20%)}
html[data-theme=light].hskduel-ui{--accent:#345d72;--aura:#78badb20}html[data-theme=light].hskduel-ui[data-element="2"]{--accent:#176d52;--aura:#53b99522}html[data-theme=light].hskduel-ui[data-element="3"]{--accent:#a84514;--aura:#f4974422}
.hskduel-ui .menu-dust{color:var(--accent)!important}.hskduel-stage{color:var(--accent)}.one-avatar{display:inline-block;vertical-align:middle;margin-right:10px;border-radius:9px}

/* The signed-out screen keeps the complete crest and the ambient embers. */
html.hskduel-ui[data-auth=guest] body>.menu-dust{display:block;color:#cb6f2e!important}
html.hskduel-ui[data-auth=guest][data-theme=dark] body>.menu-dust{color:#ffac60!important}
.hskduel-ui .auth-brand .hskduel-stage{display:flex;align-items:center;justify-content:center;gap:8px;max-width:480px;width:100%;aspect-ratio:auto;min-height:300px;padding:10px 12px 24px}
.hskduel-ui .auth-brand .hskduel-stage .hskduel-slot{position:relative;left:auto;top:auto;flex:0 1 30%;width:30%;transform:none}
.hskduel-ui .auth-brand .hskduel-slot[data-slot="1"]{order:1}
.hskduel-ui .auth-brand .hskduel-slot[data-slot="2"]{order:3}
.hskduel-ui .auth-brand .hskduel-slot[data-slot="3"]{order:2}
.hskduel-ui .auth-brand .stone-cell{mask-image:radial-gradient(ellipse at center,#000 55%,transparent 73%)}
.hskduel-ui .auth-brand .gem-numeral{bottom:-16px}
.hskduel-ui .auth-brand .hskduel-wordmark{margin-top:20px}
@media(max-width:720px){
 .hskduel-ui .auth-brand .hskduel-stage{max-width:310px;min-height:200px;padding-bottom:20px;gap:4px}
 .hskduel-ui .auth-brand .hskduel-wordmark{margin-top:8px}
 .hskduel-ui .auth-home{gap:30px}
}

.hskduel-ui .boot-screen{min-height:75dvh;place-content:center}
.hsk-boot-mark{display:flex;flex-direction:column;align-items:center;gap:28px}
.hskduel-ui .hsk-boot-mark img{width:160px;height:160px;max-height:none;border-radius:34px;box-shadow:0 0 65px #edab4025;animation:hsk-boot-breathe 2.4s ease-in-out infinite}
.hsk-boot-mark b{font-family:'Bansho Sans',Montserrat,Arial,sans-serif;font-size:22px;font-weight:500;letter-spacing:.22em;margin-right:-.22em}
.hsk-boot-dots{display:flex;gap:9px}
.hsk-boot-dots i{width:6px;height:6px;border-radius:50%;background:#82bdeb;animation:hsk-boot-dot 1.4s ease-in-out infinite}
.hsk-boot-dots i:nth-child(2){background:#ffac60;animation-delay:.16s}
.hsk-boot-dots i:nth-child(3){background:#60bd93;animation-delay:.32s}
@keyframes hsk-boot-breathe{50%{transform:translateY(-5px);box-shadow:0 0 80px #edab4040}}
@keyframes hsk-boot-dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}
@media(prefers-reduced-motion:reduce){.hskduel-ui .hsk-boot-mark img,.hsk-boot-dots i{animation:none}}
