:root{color-scheme:dark;--bg:#0a1032;--card:#111e3e;--line:#344b70;--text:#f4f7ff;--muted:#b6c7df;--cyan:#00c8ff;--gold:#ffce64;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:10px;background:#142342;color:#dfedff;cursor:pointer;font-weight:600;transition:background .15s,border-color .15s}button:hover{background:#234469;border-color:#6cd2f5}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--cyan);color:#051c31;border-color:var(--cyan)}button.gold{background:#ad80291f;border-color:#887140;color:var(--gold)}button.danger{background:#582536;border-color:#ae5368;color:#ffe3e8}:focus-visible{outline:3px solid var(--gold);outline-offset:4px}a{color:#81deff}p{color:var(--muted);line-height:1.7}h1,h2,h3{letter-spacing:-.8px;line-height:1.2}h1{font-size:clamp(30px,5vw,52px)}h2{font-size:30px}h3{font-size:21px}small{color:var(--muted);line-height:1.5}.top{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 1300px)/2));background:#090f2b;gap:12px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;letter-spacing:1px;font-weight:850;color:white;white-space:nowrap}.brand img{border-radius:10px}.top-actions{display:flex;gap:6px}.top-actions button{padding:9px 12px;background:transparent}.layout{display:grid;grid-template-columns:160px minmax(0,1100px);max-width:1300px;margin:auto;min-height:calc(100svh - 135px)}.nav{border-right:1px solid var(--line);padding:24px 12px;display:flex;flex-direction:column;gap:6px}.nav button{border-color:transparent;background:transparent;display:flex;gap:12px;text-align:left}.nav button[aria-current=page]{background:#00c8ff12;border-color:#00c8ff66;color:#81e4ff}.nav button span{font-size:13px}.nav button:first-letter{font-size:21px}main{padding:36px;min-width:0;background:radial-gradient(ellipse at 100% 0%,#15456755,transparent 60%)}main>h1{margin:12px 0 20px}main:focus{outline:0}.kicker{color:#79dbff;font:11px ui-monospace,monospace;letter-spacing:2px;text-transform:uppercase}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.card{background:linear-gradient(135deg,#17274c,#101c3a);border:1px solid var(--line);border-radius:16px;padding:24px;margin-bottom:16px}.card h3{margin:8px 0 14px}.hero{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;overflow:hidden;padding:36px;border:1px solid #3a5d7c;border-radius:20px;background:radial-gradient(ellipse at 100% 60%,#22687166,transparent 70%),#142346}.hero h1{margin:16px 0}.hero em{color:var(--gold);font-style:normal}.hero-art{display:flex;align-items:center;justify-content:center;gap:8px}.hero-art img{width:48%;filter:drop-shadow(0 18px 16px #0005)}.hero-art img:nth-child(2){transform:translateY(-20px)}.pill{border:1px solid #477694;border-radius:99px;font:11px ui-monospace,monospace;color:#a2e7f6;padding:7px 10px;display:inline-flex;gap:7px;align-items:center}.section-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:30px 0 18px}.section-head h2{margin:8px 0;font-size:25px}.champion{border-color:#806b39;position:relative}.champion.wild{border-color:#407599}.champion .score{font-size:42px;color:var(--gold);font-weight:800}.champion .row{justify-content:space-between}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 0}.actions button{flex:none}.player{background:transparent;border:0;color:#88e0ff;text-decoration:underline;text-underline-offset:4px;padding:0;text-align:left}.arena{text-align:center;background:radial-gradient(ellipse at center,#173e54,#101d3a 70%);border:1px solid var(--line);border-radius:20px;padding:28px}.score{font-size:80px;line-height:1.2;font-weight:850;color:var(--gold);letter-spacing:-4px}.arena .score small{font-size:14px;letter-spacing:0}.coins{display:flex;justify-content:center;gap:32px;padding:22px 0}.coins button{width:160px;border:0;background:transparent;padding:8px;perspective:800px;color:#c7d5e9}.coin{display:block;position:relative;width:144px;height:144px;transition:transform .7s cubic-bezier(.22,.8,.25,1);transform-style:preserve-3d}.coin img{position:absolute;inset:0;width:100%;backface-visibility:hidden}.coin img:last-child{transform:rotateY(180deg)}.revealed .coin{transform:rotateY(180deg)}.coins button small{display:block;margin-top:18px;letter-spacing:2px}.arena .actions{justify-content:center}.arena p{min-height:28px}.training{color:#ffd987;border:1px solid #806b39;background:#ffbf0010;padding:12px 16px;border-radius:10px;font-size:13px;line-height:1.6;margin-bottom:18px}.empty{border:1px dashed #516588;padding:24px;border-radius:12px;margin:16px 0;text-align:center;color:var(--muted)}.empty strong{color:white}.notice{padding:12px 20px;border-bottom:1px solid #84764e;background:#3d321a;color:#ffe1a0;font-size:13px}.notice[hidden]{display:none}.form{max-width:560px}.form label{display:block;margin:18px 0 8px;font-weight:600;font-size:13px}.form input,.form textarea,.form select,.filters select,.search{width:100%;min-height:48px;background:#0a1530;color:white;border:1px solid #526a90;border-radius:10px;padding:12px}.form textarea{min-height:110px;resize:vertical}.form .primary{width:100%;margin-top:24px}.form-feedback{color:#ffe0a0}.google{background:white;color:#1a2a41;width:100%;display:flex;gap:10px;align-items:center;justify-content:center;margin:20px 0}.google b{color:#4285f4;font-size:20px}.divider{color:#9bb0ca;text-align:center;margin:18px 0}.filters{padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--card);margin:22px 0}.filters .grid{gap:16px}.filters label{display:block;color:#c8d8ed;font-size:12px;margin:12px 0 8px}.segmented{display:flex;gap:5px;border:1px solid var(--line);border-radius:12px;background:#09132b;padding:4px}.segmented button{flex:1;border-color:transparent}.segmented button[aria-pressed=true]{background:#124359;border-color:#00c8ff88;color:#c9f5ff}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}table{width:100%;border-collapse:collapse;font-size:13px}th{font:10px ui-monospace,monospace;color:#a8c3e4;text-align:left;padding:16px;white-space:nowrap}td{padding:18px 16px;border-top:1px solid #33476c}td .points{color:#ffcf65;font-size:20px;font-weight:800}tbody tr:first-child{background:#ffd56b06}.time{font:10px ui-monospace,monospace;white-space:nowrap}.loc{white-space:nowrap;color:#bed9ef}.profile-head{display:flex;gap:20px;align-items:center;margin-bottom:24px}.avatar{width:76px;height:76px;display:grid;place-items:center;font-size:28px;color:#b7e9fa;border-radius:20px;background:linear-gradient(135deg,#25617b,#24355c);border:1px solid #507194}.profile-head h1{margin:4px 0 12px}.list-item{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 0;border-bottom:1px solid var(--line)}.list-item:last-child{border:0}.list-item strong{display:block}.list-item small{display:block;margin-top:5px}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.menu-group h3{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#94c6e2}.menu-group button{width:100%;text-align:left;display:block;margin:5px 0;background:#152b46;border-color:transparent}.menu-group small{display:block;font-weight:400}.qr{background:white;border-radius:12px;width:min(300px,100%);margin:18px auto;overflow:hidden}.qr svg{width:100%;display:block}.referral-layout{display:grid;grid-template-columns:1fr 300px;gap:24px}.referral-code{display:block;padding:14px;background:#0a1530;border:1px solid var(--line);border-radius:10px;word-break:break-word;font:12px/1.7 ui-monospace,monospace}.shop-item{cursor:pointer;text-align:left}.shop-item img{width:130px;display:block;margin:10px auto}.mat-preview{height:130px;border-radius:10px;border:2px solid #a68443;background:radial-gradient(ellipse,#176448,#10362e);margin:12px 0}.shop-item[aria-pressed=true]{border-color:#00c8ff;background:#143549}.setting{display:flex;align-items:center;justify-content:space-between;padding:18px 0;border-bottom:1px solid var(--line);gap:16px}.setting input{width:24px;height:24px;accent-color:#00c8ff}.setting strong,.setting small{display:block}dialog{width:min(620px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:24px;background:#0e1d38;color:white;border:1px solid #456687;border-radius:18px;box-shadow:0 20px 90px #0009}dialog::backdrop{background:#030a1acc;backdrop-filter:blur(6px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:23px;margin:0}.dialog-head button{width:44px;font-size:22px;padding:0}footer{max-width:1300px;margin:auto;padding:14px 20px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;border-top:1px solid var(--line)}footer button{border:0;background:transparent;font-size:12px}footer span{margin-left:auto;font-size:12px;color:#91abc9}#toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);padding:12px 18px;border:1px solid #4c7692;border-radius:12px;background:#142d45;box-shadow:0 10px 40px #0005;z-index:20;max-width:calc(100vw - 32px);pointer-events:none}#toast:empty{display:none}.skip{position:fixed;top:-60px;background:#00c8ff;color:#041329;padding:14px;z-index:30}.skip:focus{top:10px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.loading{min-height:200px;display:grid;place-items:center;color:#a5c9e4}.error{border:1px solid #956073;padding:22px;border-radius:14px}.auth-note{font-size:12px}body.reduced .coin{transition:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:980px){.layout{display:flex;flex-direction:column}.nav{order:2;position:sticky;bottom:0;z-index:5;flex-direction:row;justify-content:space-around;background:#0b1632;border:0;border-top:1px solid var(--line);padding:8px 8px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -10px 25px #03091955}.nav button{flex:1;flex-direction:column;align-items:center;gap:5px;min-height:60px;padding:8px 5px}.nav button span{font-size:11px}main{padding:28px}.hero{padding:28px}.top{padding:0 18px}}@media(max-width:650px){.grid,.referral-layout{grid-template-columns:1fr}.hero{grid-template-columns:1fr;padding:24px}.hero-art{max-width:300px;margin:28px auto 0}.hero h1{font-size:38px}.top{height:68px;padding:0 12px}.brand{font-size:13px;letter-spacing:.5px}.top-actions button{padding:8px;font-size:12px}.top-actions{gap:3px}main{padding:24px 16px}.card{padding:20px}.coins{gap:14px}.coins button{width:125px;padding:0}.coin{width:120px;height:120px}.arena{padding:24px 12px}.section-head{align-items:flex-start}.menu-grid{grid-template-columns:1fr}td,th{padding:14px 12px}.actions button{flex:1;min-width:130px}footer span{width:100%;margin:12px 0}.score{font-size:68px}}

/* Collection, navigation et confort : même palette que le prototype V2. */
.country-flag{display:inline-block;width:25px;height:17px;vertical-align:middle;border-radius:3px;box-shadow:0 0 0 1px #ffffff30;flex-shrink:0}.country-flag.globe{box-shadow:none}.loc{display:inline-flex;align-items:center;gap:7px}.country-emoji{font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif}
.mat-night{background:radial-gradient(ellipse at 50% 10%,#244b6c,#101b38 75%)}
.base-themes{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}.base-theme{text-align:left;padding:16px;background:#142342;border:1px solid #526a90;border-radius:14px}.base-theme.current{border-color:var(--cyan)}.base-theme:hover{border-color:var(--cyan);background:#1b304e}.base-theme .outfit-stage{margin:0 0 16px;padding:22px 8px}.base-theme strong{font-size:23px;display:block}.base-theme p{font-size:12px;min-height:64px;font-weight:400}.base-theme .pill{font-size:10px}.base-theme-entry{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:16px;background:#142342}.base-theme-entry small{display:block;margin-top:5px;font-size:11px}.base-theme-entry button{font-size:12px}@media(max-width:440px){.base-theme{padding:12px}.base-themes{gap:10px}.base-theme strong{font-size:20px}.base-theme-entry{align-items:flex-start;flex-direction:column}}
.mat-jade,.outfit-art.mat-jade{background:radial-gradient(ellipse at 50% 12%,#23734b66,transparent 70%),repeating-linear-gradient(18deg,#ffffff05 0 1px,transparent 1px 3px),repeating-linear-gradient(108deg,#00000009 0 1px,transparent 1px 4px),#0b442e;border-color:#aa8b4f}
.mat-velvet,.outfit-art.mat-velvet{background:radial-gradient(ellipse at 50% 12%,#72304788,transparent 70%),repeating-linear-gradient(100deg,#ffffff03 0 1px,transparent 1px 4px),#301425;border-color:#c69958}
.mat-aurora,.outfit-art.mat-aurora{background:radial-gradient(ellipse at 12% 0%,#218b8266,transparent 65%),radial-gradient(ellipse at 90% 50%,#7452b355,transparent 70%),#111d35;border-color:#72bfb4}
.mat-onyx,.outfit-art.mat-onyx{background:repeating-linear-gradient(45deg,#d3dce409 0 1px,transparent 1px 16px),repeating-linear-gradient(-45deg,#d3dce409 0 1px,transparent 1px 16px),radial-gradient(ellipse at top,#303a45,#11151c);border-color:#a0afbb}
.mat-copper,.outfit-art.mat-copper{background:radial-gradient(circle at 25% 30%,#e9bd7655 0 1px,transparent 2px),radial-gradient(circle at 75% 70%,#e9bd7633 0 1px,transparent 2px),radial-gradient(ellipse at top,#634330,#231a21);background-size:53px 61px,71px 43px,100% 100%;border-color:#c38e69}
.arena[class*="mat-"],.outfit-stage{position:relative;isolation:isolate;overflow:hidden}.arena[class*="mat-"]::before,.outfit-stage::before{content:"";position:absolute;inset:9px;border:1px solid #e8c88f30;border-radius:12px;pointer-events:none;z-index:-1}
.arena.mat-velvet::before,.outfit-stage.mat-velvet::before{border:3px double #e8c88f70}.mat-onyx .mini-table{border-color:#acbec480}.mat-aurora .mini-table{border-color:#8cdfc680}.mat-copper .mini-table{border-color:#db9b7080}
.finish-gold{filter:sepia(.85) saturate(1.65) hue-rotate(350deg) brightness(1.12)}
.shop-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start;margin-top:26px}
.wardrobe-preview{position:sticky;top:24px}.wardrobe-preview>button{width:100%}
.outfit-card{padding:0;overflow:hidden;margin:0;border-color:#3a5475;transition:transform .2s,border-color .2s}
.outfit-card:hover{transform:translateY(-2px);border-color:#65b8cd}.outfit-card.equipped{border-color:var(--cyan)}
.outfit-art{min-height:185px;display:grid;place-items:center;background:radial-gradient(ellipse,#2b3a55,#101d34);border-bottom:1px solid var(--line)}
.outfit-art.mat-night{background:radial-gradient(ellipse,#244b6c,#101b38)}
.coin-pair,.mini-table{display:flex;justify-content:center;align-items:center;gap:6px;width:100%}.coin-pair img{width:44%;max-width:160px;filter:drop-shadow(0 12px 12px #0005)}
.coin-pair img.finish-gold{filter:sepia(.85) saturate(1.65) hue-rotate(350deg) brightness(1.12) drop-shadow(0 12px 12px #0005)}
.mini-table{width:88%;border:1px solid #b9a57480;border-radius:50%;min-height:125px}.mini-table img{width:70px}
.outfit-body{padding:20px}.outfit-body p{font-size:13px;min-height:66px}.outfit-body button{width:100%;font-size:13px}.outfit-body .pill{font-size:10px}
.equipped-label{color:#8bf0da;font-size:11px}.outfit-stage{border:1px solid #958054;border-radius:16px;padding:28px 12px;margin:20px 0}
.preview-labels{display:flex;justify-content:space-around;font:10px ui-monospace,monospace;color:#e2edf2;letter-spacing:1px;margin-top:14px}
.shop-note{margin:24px 0 18px;border-top:1px solid var(--line);padding-top:18px;font-size:13px}.shop-note strong{color:#a9e6f3}.shop-note p{font-size:12px}
.arena-outfit{font-size:11px;color:#a9c6d4;margin:10px 0}.arena-outfit button{min-height:32px;padding:6px 9px;margin-left:8px;font-size:11px;background:#0002}
.auth-layout{display:grid;grid-template-columns:minmax(0,560px) minmax(230px,1fr);gap:24px;align-items:start}.auth-benefits ul{padding-left:22px;color:var(--muted);line-height:2.2}
.password-field{display:flex;gap:8px;align-items:center}.password-field input{min-width:0;flex:1}.password-field button{font-size:12px;min-height:48px}
.form small{display:block;margin-top:8px}.menu-group button{display:flex;justify-content:space-between;align-items:center}.menu-group button[aria-current=page]{border-color:#00c8ff88;color:#8ee9ff}
details{padding:16px 0;border-bottom:1px solid var(--line)}details:last-child{border:0}summary{cursor:pointer;font-weight:650;min-height:30px}.top{position:relative;z-index:6}
@media(min-width:981px){.nav{position:sticky;top:0;height:calc(100svh - 76px)}.top-actions button{min-width:44px}}
@media(max-width:1100px){.shop-layout{grid-template-columns:1fr}.wardrobe-preview{position:static;display:grid;grid-template-columns:1fr 1fr;column-gap:24px}.wardrobe-preview .outfit-stage{grid-column:2;grid-row:1/5}.wardrobe-preview .shop-note,.wardrobe-preview>small{grid-column:1/-1}}
@media(max-width:650px){.auth-layout{grid-template-columns:1fr}.auth-benefits{order:2}.collection{grid-template-columns:1fr 1fr;gap:10px}.outfit-art{min-height:145px}.outfit-body{padding:14px}.outfit-body h3{font-size:18px}.outfit-body .row{gap:7px}.outfit-body button{padding:10px 8px}.outfit-body p{min-height:90px}.mini-table img{width:50px}.wardrobe-preview{display:block}.outfit-stage .coin-pair img{max-width:135px}.shop-layout{gap:16px}.password-field{gap:5px}}
@media(max-width:380px){.collection{grid-template-columns:1fr}.outfit-body p{min-height:0}}

.filter-step{display:flex;align-items:center;gap:10px;margin:18px 0 12px}.filter-step:first-child{margin-top:0}.filter-step h3{font-size:15px;margin:0;letter-spacing:0}.filter-step>span{border:1px solid #00c8ff55;border-radius:6px;padding:4px 6px;color:#83e4ff;font:10px ui-monospace,monospace}.filters>.grid{margin-top:24px}.filters .segmented small{display:block;font-weight:400;margin:4px 0;color:inherit;font-size:11px}.filter-hint{display:block;margin-top:10px;font-size:11px}.filter-summary{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:24px;padding-top:16px;border-top:1px solid var(--line)}.filter-summary button{font-size:11px;min-height:36px}.filter-summary button:first-of-type{margin-left:auto}.ranking-tools h2{font-size:23px}.ranking-tools p{font-size:12px;margin:8px 0}.ranking-tools>div:last-child{max-width:280px}.my-ranking{background:#00c8ff12!important;box-shadow:inset 3px 0 var(--cyan)}.you-label{margin-left:8px;border:1px solid #00c8ff55;border-radius:4px;padding:2px 5px;font-size:10px;color:#8de6ff}.table-wrap tr[hidden]{display:none}
@media(max-width:650px){.filter-summary button:first-of-type{margin-left:0}.ranking-tools{flex-direction:column;align-items:stretch}.ranking-tools>div:last-child{max-width:none}.filters{padding:18px}.filters .segmented button{padding:10px 8px}.nav{position:fixed;bottom:0;left:0;right:0}.layout{padding-bottom:86px}footer{padding-bottom:100px}}

.appearance-drawer{border:1px solid var(--line);border-radius:12px;padding:16px;margin:16px 0 28px}.appearance-drawer>summary{color:#b8ecff}.qr-error{color:#15243c;padding:18px;font-size:13px;line-height:1.6}.form-feedback[role=alert]{padding:12px;border-left:3px solid #f29a88;background:#4f273055}.form[aria-busy=true]{opacity:.8}dialog{overflow-y:auto}button:focus-visible,summary:focus-visible{outline:3px solid #8de7ff;outline-offset:4px}
.profile-head>div:last-child{min-width:0;flex:1}.profile-head h1{overflow-wrap:anywhere}.profile-head .loc{white-space:normal;overflow-wrap:anywhere;max-width:100%}.list-item>div{min-width:0;max-width:100%;overflow-wrap:anywhere}.list-item .player{max-width:100%;white-space:normal;overflow-wrap:anywhere}.profile-head .avatar{flex-shrink:0}.profile-head{gap:14px}.profile-head .loc .country-flag{align-self:flex-start}.form input{min-width:0}

/* Same V2 identity; hierarchy and compact leaderboard optimized for touch reading. */
:root{--space-1:8px;--space-2:16px;--space-3:24px;--radius-card:14px}
.mobile-label{display:none}.error .actions{margin-top:18px}.filters .filter-step{margin-top:14px}.filters .filter-step h3{font-size:14px}
@media(max-width:650px){
 .filters .grid{gap:14px}.filters .filter-step{margin-bottom:8px}.filters .grid>div{padding-top:8px;border-top:1px solid var(--line)}
 .filters label{margin-top:10px}.filters select{min-height:44px;padding:10px}.filter-summary{margin-top:16px;padding-top:12px}.filter-summary button{min-height:44px}
 .leaderboard{overflow:visible;border:0;background:transparent}.leaderboard table,.leaderboard tbody{display:block}
 .leaderboard thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
 .leaderboard tr{display:grid;grid-template-columns:36px minmax(0,1fr) 62px;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px}
 .leaderboard td{display:block;padding:0;border:0;min-width:0}.leaderboard .rank-cell{grid-column:1;grid-row:1;font:12px ui-monospace,monospace;padding-top:10px;color:#aac6e1}
 .leaderboard .player-cell{grid-column:2;grid-row:1}.leaderboard .player{min-height:44px;max-width:100%;overflow-wrap:anywhere;text-align:left;padding:8px 0}
 .leaderboard .score-cell{grid-column:3;grid-row:1;text-align:right;align-self:center;white-space:nowrap;font-size:11px}.leaderboard .points{font-size:25px}
 .leaderboard .location-cell{grid-column:2/4;grid-row:2;font-size:12px}.leaderboard .loc{white-space:normal;overflow-wrap:anywhere}
 .leaderboard .time{grid-column:2/4;grid-row:3;color:#a5bed8;font-size:10px;white-space:normal;line-height:1.6}.leaderboard .mobile-label{display:block;font-size:9px;color:#829ebd}
 .leaderboard .you-label{display:block;width:max-content;margin:0}.leaderboard .my-ranking{box-shadow:inset 3px 0 var(--cyan)}
 main{scroll-margin-bottom:100px}button{touch-action:manipulation}.top-actions button{min-height:44px}
}

/* Spring-like 3D reveal, inspired by the two-face CodePen reference.
   Only a newly resolved turn animates; rerenders preserve the final face. */
.coins .coin{transform-style:preserve-3d;will-change:auto}
.coin img{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.coin-flipping .coin{animation:lucky-coin-reveal 900ms cubic-bezier(.3,.75,.25,1) both;will-change:transform}
@keyframes lucky-coin-reveal{
  0%{transform:translateY(0) rotateY(0deg)}
  55%{transform:translateY(-12px) rotateY(155deg)}
  82%{transform:translateY(-2px) rotateY(194deg)}
  100%{transform:translateY(0) rotateY(180deg)}
}
.reduced .coin-flipping .coin{animation:none;will-change:auto}
@media(prefers-reduced-motion:reduce){.coin-flipping .coin{animation:none;will-change:auto}}

.outfit-stage.mat-only{min-height:220px}
.outfit-stage.coin-only{background:radial-gradient(ellipse,#25344a,#111c31);border-color:var(--line)}
.outfit-stage.coin-only::before{display:none}

/* Comfortable touch targets and readable action groups on narrow screens. */
.feedback-entry{width:100%;margin-top:24px;background:transparent;font-size:13px}
@media(max-width:650px){
 button,summary{min-height:48px}button{min-width:48px;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
 summary{display:flex;align-items:center;padding:8px 0}
 .top{height:auto;min-height:72px;flex-wrap:wrap;padding:12px;gap:10px}.top-actions{gap:8px;flex-wrap:wrap}.top-actions button{min-width:48px;min-height:48px;padding:10px}
 .actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:12px;width:100%}.actions button{min-width:0;width:100%;padding:12px 16px}
 .segmented{flex-wrap:wrap;gap:8px}.segmented button{min-width:100px;padding:12px 10px}
 .list-item{flex-wrap:wrap;gap:12px}.list-item .actions{margin-top:8px}
 .arena-outfit button{min-height:48px;margin:8px 0 0;padding:12px}.filter-summary button{min-height:48px}
 dialog{padding:18px;max-height:calc(100dvh - 24px - env(safe-area-inset-bottom))}.dialog-head{align-items:flex-start}.dialog-head button{flex:0 0 48px;width:48px;height:48px}
 .nav{gap:8px}.nav button{min-width:0}.layout{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
 footer{gap:10px;padding-bottom:calc(110px + env(safe-area-inset-bottom))}footer button{padding:12px;text-align:left}
 .form input,.form select,.form textarea,.search{font-size:16px}
}

.contact-link{display:inline-flex;align-items:center;min-height:48px;padding:12px;font-size:13px;overflow-wrap:anywhere}