/* A small home, readable achievements, and one clear next action. */
#title.ov,#over.ov{padding:22px 22px calc(26px + env(safe-area-inset-bottom));overflow-y:auto;background:radial-gradient(ellipse at 50% 35%,#1a2541f7,#090e20fc 75%)}
#title .simple-home{display:flex;flex-direction:column;max-width:410px;gap:14px;margin:auto;min-height:0;max-height:none;overflow:visible}
#title .home-toolbar{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:14px}
#title .home-toolbar .language-entry{display:flex;flex:none;align-items:center;gap:8px;width:auto;min-height:44px;padding:8px 12px;border:1px solid #a7c8e029;border-radius:999px;background:transparent;box-shadow:none;color:#c9d9ea;font-size:13px}
#title .language-entry .language-globe{width:18px;height:18px}
#title .home-toolbar .text-btn{font-size:13px;min-height:44px}
#title .home-hero{display:flex;align-items:center;justify-content:center;gap:24px;margin:6px 0 12px}
#title .home-hero .game-icon{width:84px;height:84px;box-shadow:0 12px 40px #0005}
#title .home-hero h1{font-size:52px;line-height:1.05;text-align:left;letter-spacing:.04em}
#title .home-hero h1 br{display:block}
#title .home-rule{font-size:16px;line-height:1.85;max-width:330px;color:#e1ecfa}
#title .home-controls{font-size:13px;line-height:1.8;color:#9fb4d0;margin:0 0 6px}
#title .home-rule{white-space:pre-line}
#title .title-start{width:100%;min-height:60px;font-size:21px;border-radius:18px;padding:14px 20px;background:linear-gradient(100deg,#92f0df,#b9c4ff);box-shadow:0 8px 32px #70d9d51a}
#title .home-links{display:flex;justify-content:center;gap:18px;width:100%}
#title .home-links .text-btn{font-size:13px;min-height:44px;color:#b9cce6}
#title #bestT{font-size:12px;color:#9eb4d1}
#title .home-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:10px;padding-top:20px;margin-top:4px;border-top:1px solid #aec7e21a}
#title .home-nav-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px 4px;min-height:88px;min-width:0;background:#c2dcff05;border:1px solid #b9ccea1c;border-radius:16px;color:#d5e3f5;font-size:12px;line-height:1.5}
#title .home-nav-button:hover{background:#bcdfff10;border-color:#a7d4e766}
#title .home-nav-button img{width:33px;height:33px;object-fit:contain}
.home-rank-icon{width:33px;height:33px;color:#f5d990}
#title .connection:not(.offline){display:none}
#title #startStatus:empty{display:none}
#modeDialog{width:min(440px,calc(100% - 24px))}
#modeDialog .journey-entry,#modeDialog .battle-main-entry{width:100%;min-height:82px;display:flex;align-items:center;padding:14px;gap:12px;white-space:normal;text-align:left}
#modeDialog .journey-entry strong,#modeDialog .battle-main-entry strong{font-size:16px}
#modeDialog .journey-entry small,#modeDialog .battle-main-entry small{font-size:12px;line-height:1.7}
.language-setting .language-examples{display:none}
#over .result-screen{display:flex;flex-direction:column;max-width:430px;gap:24px;max-height:none;overflow:visible;margin:auto}
#over .result-summary{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}
#over .score-label{color:#adc1da;font-size:13px}
#over .big{font-size:72px;line-height:1.1;color:#ffe59b;text-shadow:none}
#over .result-short{color:#c7d8ec;font-size:13px;line-height:1.7}
#over .killer{font-size:14px;font-weight:500;color:#a6b9d3;line-height:1.8}
#over .new{animation:none;color:#a7f0cd;font-size:14px}
#over .result-actions{display:flex;flex-direction:column;gap:10px;width:100%}
#over #retry{width:100%;min-height:56px;font-size:20px;border-radius:18px;box-shadow:none;background:linear-gradient(100deg,#92f0df,#b9c4ff)}
#over #backTitle{min-height:44px;font-size:13px}
#over .result-details{border-top:1px solid #a1c4e32b;width:100%;margin-top:8px;padding:4px 0;color:#adc1da}
#over .result-details summary{padding:14px 4px;font-size:12px;line-height:1.7;cursor:pointer;min-height:44px}
#over .result-details[open]{display:block}
#over .result-details .stat{padding:8px 0;font-size:12px}
#over .result-details .result-secondary{margin:10px 0;gap:8px}
#over .result-details .result-secondary button{font-size:12px;min-height:44px}
#over .next-challenge{display:block;max-width:100%;margin:0 auto;font-size:12px}
#over .collection-result-title{display:none}
#over .collection-run-reward,.battle-result .collection-run-reward{display:block;width:100%;padding:14px 16px;background:#bdddf505;border:1px solid #bcd9f01c;border-radius:16px}
#over .reward-heading,.battle-result .reward-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
#over .reward-heading>span,.battle-result .reward-heading>span{font-size:12px;color:#b8c9df}
#over .reward-heading>strong,.battle-result .reward-heading>strong{font-size:22px}
.earned-badges{text-align:left;width:100%;margin-top:12px}
.earned-badges h3{font-size:13px;color:#b3efd4;margin:0 0 10px;line-height:1.7}
.earned-badges ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin:0;padding:0}
.earned-badges li{display:flex;align-items:flex-start;gap:12px;border-top:1px solid #a8d6c522;padding-top:12px}
.earned-badges li>.badge-art{width:42px;height:46px;flex:0 0 42px}
.earned-badges li>div{min-width:0;flex:1}
.earned-badges strong{display:block;font-size:13px;line-height:1.6;color:#e7f5ed}
.earned-badges .earned-reason-label{display:block;font-size:10px;line-height:1.6;color:#9eb4c9;margin-top:5px}
.earned-badges li p{font-size:14px;line-height:1.7;color:#e1eefa;margin:2px 0 4px;overflow-wrap:anywhere}
.earned-badges small{display:block;font-size:11px;color:#dcc98c;line-height:1.6}
.collection-dialog[data-tab=badges] .collection-profile{display:none}
.collection-dialog[data-tab=badges] .collection-heading{padding-bottom:14px}
.collection-dialog .badge-intro{font-size:13px;line-height:1.85;color:#adc3da;padding:0 2px 16px;max-width:620px}
.collection-dialog.is-browser .badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.collection-dialog .badge-filter{position:relative;top:auto;gap:8px;padding:0 0 12px;flex-wrap:wrap}
.collection-dialog .badge-filter button{min-height:44px;font-size:12px}
.collection-dialog .badge-filter .ui-art-icon{display:none}
.collection-dialog .badge-tile{display:flex;flex-direction:row;align-items:center;min-height:138px;padding:18px 14px;gap:14px;text-align:left;border-radius:14px}
.collection-dialog .badge-tile>.badge-art.badge-enamel{width:52px;height:58px;flex:0 0 52px}
.collection-dialog .badge-tile.is-locked>.badge-art.badge-enamel{filter:saturate(.65);opacity:.7}
.collection-dialog .badge-tile>.badge-tile-copy{display:flex;flex-direction:column;gap:6px;margin:0;min-width:0;flex:1;color:#dce9f7}
.badge-tile-copy>strong{font-size:14px;line-height:1.6}
.badge-tile-copy>.badge-condition{font-size:12px;line-height:1.8;color:#bfd0e4}
.badge-tile-copy>.badge-tile-progress{font-size:11px;line-height:1.6;color:#a2dccd}
.badge-tile-copy>.badge-usage{align-items:flex-start}
.collection-dialog .badge-tile>i{height:4px}
#badgeDetail .badge-detail-inner .collection-badge>p{font-size:16px;line-height:1.85}
#badgeDetail .collection-badge>small{font-size:12px;line-height:1.8}
#badgeDetail .badge-use-help{margin-top:16px;padding-top:14px;border-top:1px solid #aec7e22b;font-size:12px;line-height:1.85;color:#adc3da}
@media(max-width:520px){
 #title.ov,#over.ov{padding:16px 20px calc(20px + env(safe-area-inset-bottom))}
 #title .simple-home{gap:10px}
 #title .home-toolbar{margin-bottom:12px}
 #title .home-hero{gap:20px;margin:4px 0 12px}
 #title .home-hero h1{font-size:44px}
 #title .home-hero .game-icon{width:72px;height:72px}
 #title .home-rule{font-size:15px}
 #title .home-nav{padding-top:16px}
 #title .home-nav-button{font-size:11px}
 .collection-dialog.is-browser .badge-grid{grid-template-columns:1fr}
 .collection-dialog .badge-tile{min-height:128px}
 #over .result-screen{gap:20px}
}
@media(max-height:650px){
 #title .simple-home{gap:6px}
 #title .home-toolbar{margin-bottom:4px}
 #title .home-hero{margin:0 0 4px;gap:16px}
 #title .home-hero h1{font-size:36px}
 #title .home-hero .game-icon{width:60px;height:60px}
 #title .home-rule{font-size:14px}
 #title .home-controls{font-size:11px;margin-bottom:2px}
 #title .title-start{min-height:52px;font-size:19px}
 #title .home-nav{padding-top:10px;margin-top:0}
 #title .home-nav-button{min-height:70px;padding:8px 4px;gap:5px}
 #over .big{font-size:56px}
 #over .result-screen{gap:16px}
}
@media(max-height:460px) and (orientation:landscape){
 #title .simple-home{max-width:620px;display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}
 #title .home-toolbar{grid-column:1/-1;margin:0}
 #title .home-hero{grid-column:1;grid-row:2/4}
 #title .home-rule{grid-column:1;grid-row:4}
 #title .home-controls{grid-column:1;grid-row:5}
 #title .title-start{grid-column:2;grid-row:2}
 #title .home-links{grid-column:2;grid-row:3;gap:8px}
 #title #bestT{grid-column:2;grid-row:4}
 #title .home-nav{grid-column:2;grid-row:5/7}
 #title #startStatus,#title #updateApp,#title .connection{grid-column:1/-1}
 #over .result-screen{display:grid;grid-template-columns:1fr 1.2fr;max-width:720px;gap:28px;align-items:start}
 .battle-result:has(.earned-badges){display:flex;max-width:440px}
}
@media(prefers-reduced-motion:reduce){#title *,#over *{animation:none!important;transition:none!important}}

/* Inline registration and a quiet daily snapshot. */
#title .home-nav-button{gap:6px}
#homeRankPeek{font-size:10px;color:#b9cbe2;line-height:1.4;overflow-wrap:anywhere}
#homeRankPeek:empty{display:none}
.quick-ranking{width:100%;border:1px solid #b9ccea28;border-radius:16px;padding:10px 14px 14px;text-align:left;background:#bcdfff06}
.quick-ranking-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.quick-ranking-heading h2{font-size:13px;color:#dce8f6}
.quick-ranking-heading .text-btn{font-size:11px;min-height:44px;padding:8px 0;flex-shrink:0}
#over .score-form{padding:0;margin:0 0 8px;background:none;border:0;border-radius:0;display:block;width:100%}
#over .score-form label{display:block;font-size:11px;color:#adc1da;margin-bottom:6px}
.score-form-row{display:flex;gap:8px;align-items:stretch}
#over .score-form input{width:0;min-width:0;flex:1;min-height:44px;font-size:16px;padding:9px 10px;border-radius:10px;user-select:text}
#over .score-form .submit{width:auto;max-width:48%;min-height:44px;padding:8px 12px;font-size:12px;border-radius:10px;background:#adeddc;color:#102b2e!important;line-height:1.5;white-space:normal}
#over .score-form .submit:disabled{opacity:.65}
.quick-ranking .status{font-size:11px;line-height:1.7;margin:5px 0;color:#aac0db}
.quick-ranking .status:empty,.quick-rank-mine:empty{display:none}
.quick-rank-list{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:2px}
.quick-rank-list:empty{display:none}
.quick-rank-list li{display:flex;align-items:center;gap:10px;min-height:32px;padding:4px 7px;border-radius:8px;font-size:12px}
.quick-rank-list li.is-you{background:#8ce1d712}
.quick-place{width:18px;flex-shrink:0;text-align:center;color:#d6c592;font-variant-numeric:tabular-nums}
.quick-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#bccfe5}
.quick-name small{font-size:9px;margin-left:6px;color:#99e3d5}
.quick-rank-list strong{color:#e4ecfa;font-size:12px;font-variant-numeric:tabular-nums}
.quick-rank-mine{font-size:11px;line-height:1.7;margin-top:8px;padding-top:8px;border-top:1px solid #aec7e21a;color:#a9e5d5}
.item-gesture-help{font-size:12px;line-height:1.85;color:#b8cde3}
.item-button:not(:disabled) .item-copy{padding-top:0}
.item-key{position:static;flex:0 1 43%;font-size:10px;white-space:normal;line-height:1.45;text-align:right}
.item-key:empty{display:none}
#bItemKey:empty{display:none}

/* A short replay stays below the immediate retry action. */
#resultReplay{width:100%}
#resultReplay:empty{display:none}
.death-replay{width:100%;overflow:hidden;text-align:left;border:1px solid #b9ccea28;border-radius:16px;background:#111a2c}
.death-replay[hidden]{display:none}
.replay-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px}
.replay-heading h3{margin:0;font-size:12px;line-height:1.5;color:#cbd9ec}
.replay-heading .text-btn{font-size:11px;min-height:44px;padding:8px 0;color:#afd7f4;flex-shrink:0}
.death-replay canvas{display:block;position:static;inset:auto;width:100%;height:auto;aspect-ratio:40/21;touch-action:pan-y}
.replay-progress{height:3px;background:#384159}
.replay-progress i{display:block;height:100%;width:0;background:#e2a4c2}
.replay-legend{display:flex;justify-content:space-between;gap:8px;align-items:center;min-height:34px;padding:8px 12px;font-size:11px;line-height:1.4;color:#bdcce1}
.replay-self{flex-shrink:0}
.replay-self:before{content:'▲';font-size:9px;color:#fff;margin-right:5px}
.replay-cause{text-align:right;color:#f3bfd4}
.replay-cause.is-ghost:before{content:'◎';margin-right:5px;color:#ff9ebe;font-weight:800}
.journey-replay{width:100%;max-width:430px;margin:16px auto 0}
.score-announcement{position:fixed;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none}
