/* Approved mobile concept: worn painted metal, petrol, rust and amber.
   Art is decorative; labels, live scores and navigation remain real UI. */
:root{--brand-ink:#10272b;--brand-petrol:#203f43;--brand-sage:#adbe9c;--brand-paper:#f2e7cd;--brand-rust:#bd7056;--brand-gold:#efbd5e;--brand-edge:3px solid var(--brand-ink)}
body:not(.playing){background-color:#18373c;background-image:radial-gradient(ellipse at 50% 0%,#51706655,transparent 65%),url('/brand/metal.webp');background-size:auto,512px;color:var(--brand-paper)}
body:not(.playing)>main{max-width:1160px;padding:20px;min-width:0;overflow-y:auto;overflow-x:hidden;scrollbar-color:#769889 #18373c}
button,input,select,summary{-webkit-tap-highlight-color:transparent}
#menu.menu-redesign,body.touch #menu.menu-redesign{background:transparent;border:0;box-shadow:none;border-radius:0;overflow:visible;gap:36px;grid-template-columns:1fr 1fr;color:var(--brand-paper);flex-shrink:0}
.menu-poster{border:0;background:none;padding:28px 0;min-height:460px;overflow:visible}
.menu-poster .new-logo{width:100%;max-width:620px;transform:none;filter:drop-shadow(0 14px 9px #071d2966)}
.poster-edition,.poster-orbit,.poster-seal,.poster-footnote,.poster-tagline,.menu-eyebrow{display:none}
.menu-play{padding:32px 8px;gap:16px}
.mode-pair{display:flex;flex-direction:column;gap:16px}
#menu.menu-redesign button.mode-card,#menu.menu-redesign .mode-pair button.mode-card{position:relative;isolation:isolate;flex-direction:row;align-items:center;gap:15px;min-height:84px;padding:18px 26px;border:var(--brand-edge);border-radius:12px;box-shadow:0 6px 0 #0b2327,inset 0 2px 0 #fff2ce88,inset 0 -4px 0 #0002;color:var(--brand-ink);text-shadow:0 1px #ffffff44;transition:transform .12s,box-shadow .12s}
#menu.menu-redesign .mode-card::after{content:'';position:absolute;inset:6px;border:1px solid #182d2b44;border-radius:7px;pointer-events:none;z-index:-1}
#menu.menu-redesign .mode-card::before{content:'';position:absolute;inset:3px;border-radius:8px;background:url('/brand/metal.webp') center/256px;mix-blend-mode:soft-light;opacity:.3;pointer-events:none;z-index:-1}
#menu.menu-redesign #worldTourButton{min-height:102px;background:#efbd5e!important;color:#172e30!important}
#menu.menu-redesign #ai{background:#bf735d!important;color:#152d30!important}
#menu.menu-redesign #invite{background:#aebfa2!important;color:#172e30!important}
#menu.menu-redesign .mode-card strong{font-size:clamp(17px,2.1vw,23px);letter-spacing:.5px;line-height:1.18;font-weight:900}
#menu.menu-redesign .mode-card small{font-size:14px;margin-top:5px;line-height:1.35;opacity:.85}
.mode-number{display:none}.mode-card>b{font-size:26px}
#menu.menu-redesign .mode-card:hover{transform:translateY(-2px);box-shadow:0 8px 0 #0b2327,inset 0 2px 0 #fff2ce88}
#menu.menu-redesign .mode-card:active{transform:translateY(4px);box-shadow:0 2px 0 #0b2327,inset 0 1px 4px #0003}
#menu.menu-redesign .mode-local{background:#284a4c!important;color:#e7e3cc!important;min-height:52px!important}
#menu.menu-redesign .mode-local strong{font-size:14px!important}
#menu.menu-redesign #tutorialButton{background:#29494c;color:#e6e6cf;border:2px solid #102b30;border-radius:8px;box-shadow:0 3px #102b30;min-height:46px;text-decoration:none;font-size:14px}
.menu-utilities{border-top:1px solid #cdd6b52b;padding:4px 6px}
#menu.menu-redesign summary{font-size:14px;color:#e1e4cd;padding:14px 0}
#menu.menu-redesign p,#menu.menu-redesign label{font-size:14px;color:#d4dfcd}
#menu.menu-redesign .sound-controls button{font-size:13px;background:#b9c5a6;color:#193a3e}
#menu.menu-redesign .sound-controls input{accent-color:#efbd5e}
#menu.menu-redesign #startRules[open]{background:#244347;border:1px solid #758e7d;padding:14px;border-radius:10px}
.menu-landscape{width:100%;height:140px;object-fit:cover;object-position:center;border-radius:10px;opacity:.65;mask-image:linear-gradient(transparent,#000 30%,#000 85%,transparent);pointer-events:none}

/* Career shell: one continuous game surface, fixed safe-area navigation on phones. */
#worldTour.tour-shell{background:transparent;color:var(--brand-paper);border:0;box-shadow:none;border-radius:0;padding:0;min-width:0}
#worldTour .tour-top{gap:12px;padding:12px 18px;margin:0 0 18px;background:#b86e55;border:var(--brand-edge);border-radius:12px;box-shadow:0 5px 0 #0c272b,inset 0 2px #f2c49a66}
#worldTour .tour-brand img{background:none;padding:0;width:138px;max-height:68px;object-fit:contain;filter:drop-shadow(0 3px 0 #192f3455)}
#worldTour .tour-brand>span{font-size:18px;letter-spacing:1px;color:#172e32}
#worldTour .tour-top button,#worldTour .tour-top select{font-size:14px;min-height:44px;padding:8px 12px;border:2px solid #19353a;background:#f0dfb8;color:#18373a;border-radius:8px}
#worldTour .tour-strip{color:#d4dfcc;font-size:14px;gap:14px;padding:12px 0}
#worldTour .tour-nav{background:#173337;border:2px solid #0d282c;box-shadow:0 4px #0b2528;padding:6px;gap:5px;margin:18px 0 24px;display:flex;flex-wrap:nowrap}
#worldTour .tour-nav button{color:#bdcfbf;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:14px;padding:10px;min-width:0;box-shadow:none;border-radius:7px}
#worldTour .tour-nav button .nav-symbol{font-size:21px;line-height:1.1}
#worldTour .tour-nav button.selected{background:#cdb371;color:#132e31;box-shadow:inset 0 1px #ffefb477}
#worldTour .tour-content>h3{font-size:22px;color:#efdfbc;margin:26px 0 14px}
#worldTour .tour-content>p{font-size:15px;color:#c4d3c1;line-height:1.55}
#worldTour .career-hero{background:#23494b;border:var(--brand-edge);border-radius:12px;box-shadow:0 5px 0 #10282b;padding:24px;gap:18px;grid-template-columns:80px minmax(0,1fr);overflow:visible}
#worldTour .career-badge{width:70px;height:82px;transform:rotate(-3deg);border-radius:10px;background:#e5b763;box-shadow:3px 3px #132d31}
#worldTour .career-badge>span{font-size:46px;color:#2b4a44}
#worldTour .career-intro small{font-size:13px;letter-spacing:1px;color:#b4c6b1}
#worldTour .career-intro h2{font-size:clamp(24px,3vw,34px);color:#f0e6cb;letter-spacing:-.4px;line-height:1.12;margin:8px 0}
#worldTour .career-intro p{color:#ccd8c0;font-size:14px}
#worldTour .career-metrics{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;border:0;gap:10px;width:100%}
#worldTour .career-metrics>div{text-align:center;padding:13px 5px;gap:4px;background:#183b3f;border:2px solid #102d31;border-radius:8px;box-shadow:inset 0 2px #68877933}
#worldTour .career-metrics strong{font-size:clamp(24px,3vw,32px);color:#f1cc7c;letter-spacing:-.6px;font-variant-numeric:tabular-nums}
#worldTour .career-metrics span{font-size:13px;color:#ced6bf;letter-spacing:.7px}
#worldTour .tour-fitness{background:#26484a;border:2px solid #132e33;color:#d2ddc8;box-shadow:none;padding:14px 17px;margin:15px 0;border-radius:9px}
#worldTour .tour-fitness strong{font-size:14px;color:#e5e5cc}
#worldTour .tour-fitness details summary{font-size:13px;color:#b8ccb8}
#worldTour .tour-fitness p{font-size:14px;line-height:1.5}
#worldTour .tour-fitness meter{width:100%;height:21px;accent-color:#9dbc78}
#worldTour .career-next{background:#ebe0c4;color:#1c3839;border:var(--brand-edge);border-radius:13px;padding:0;display:block;overflow:hidden;position:relative;box-shadow:0 5px 0 #10282c;margin:20px 0}
.career-postcard{width:100%;height:clamp(150px,25vw,250px);object-fit:cover;display:block;border-bottom:3px solid #193a3c}
.career-next-content{padding:20px;display:flex;align-items:center;flex-wrap:wrap;gap:12px}
#worldTour .career-next small{color:#655742;font-size:13px;text-transform:uppercase;letter-spacing:1px}
#worldTour .career-next h3{color:#1e3b3b;font-size:26px;margin:0;flex:1 1 100%;line-height:1.12}
#worldTour .career-next .country-flag{width:32px;height:23px;margin-right:8px;vertical-align:middle}
#worldTour .career-next p{color:#43554b;font-size:14px;margin:0;line-height:1.45}
#worldTour .career-next .tour-primary{width:100%;margin-top:4px}
#worldTour .tour-primary{background:#eabe63;color:#1a3537;border:2px solid #142e31;border-radius:8px;min-height:48px;font-size:15px;font-weight:850;box-shadow:0 4px #193739,inset 0 2px #fff4c766;padding:12px 18px}
#worldTour .tour-primary:disabled{background:#b7bdaa;opacity:.65;box-shadow:none}
#worldTour .tour-events{gap:18px}
#worldTour .tour-event{background:#e9e1c9;border:var(--brand-edge);border-radius:11px;padding:0 18px 18px;box-shadow:0 4px 0 #10282c;color:#243f3c}
#worldTour .tour-event .tour-identity{background:#abc0a5;color:#193a3a;margin:0 -18px 10px;padding:17px 18px;border-bottom:2px solid #233f3e;min-height:96px;box-shadow:inset 0 2px #eaf2cf66}
#worldTour .tour-event .tour-identity small{font-size:13px;color:#2f5148;letter-spacing:.3px}
#worldTour .tour-event .tour-identity strong{font-size:22px;line-height:1.16;letter-spacing:-.2px}
#worldTour .tour-event p{font-size:14px;line-height:1.45;margin:8px 0}
#worldTour .event-history-button{font-size:14px;color:#3b5b4e;padding:10px 0;min-height:44px}
#worldTour .tour-breaks{background:#26474a;border:2px solid #122e32;display:flex;flex-wrap:wrap;gap:12px;padding:16px;border-radius:10px}
#worldTour .tour-breaks button{flex:1;background:#b7c4a7;color:#1b3636;border:2px solid #122f32;min-height:48px;font-size:15px;box-shadow:0 3px #10292d}
#worldTour .tour-breaks p{flex-basis:100%;color:#c1d0ba;font-size:14px;margin:3px 0;line-height:1.5}
#worldTour .career-map{margin:24px 2px;background:#234950;border:2px solid #122e32;outline:0;border-radius:11px;box-shadow:0 4px #10282c;overflow:hidden}
#worldTour .career-map svg{max-height:240px;min-height:180px}
#worldTour .career-map .tour-map-caption{background:#284b4d;color:#e3dfc3;font-size:15px;padding:14px 18px;border-top:2px solid #102e32}
#worldTour .tour-backups{color:#bdcdbb;font-size:14px;border-color:#9eaf8f55;margin-top:30px}
#worldTour .tour-save{font-size:12px;color:#a0b59e;padding:12px 0}
#worldTour details>summary{font-size:14px;cursor:pointer;padding:10px 0}
#worldTour>p,#worldTour .tour-backups p,#worldTour .tour-content>details p{color:#c4d3c1;font-size:15px}
#worldTour>.tour-error{color:#733c2f}
#worldTour .tour-create input,#worldTour .tour-create select{font-size:16px;min-height:48px;background:#eee4c9;border:2px solid #122f32;border-radius:8px;color:#17393a}
#worldTour .tour-create button{min-height:48px;background:#eabe63;color:#16383b;font-size:16px}

/* Live statistics retain all columns; a compact player identity saves mobile width. */
#worldTour .tour-table{background:#eee4cd;color:#223b39;border:var(--brand-edge);border-radius:10px;box-shadow:0 4px #10292d;margin:16px 0;overflow:auto}
#worldTour .tour-table th{background:#304f4d;color:#e3dfc3;font-size:13px;padding:14px 12px;letter-spacing:.3px;white-space:nowrap}
#worldTour .tour-table td{font-size:15px;padding:13px 12px;border-color:#b2b79b66}
#worldTour .tour-table tr:nth-child(even){background:#dce0c4}
#worldTour .tour-person{font-size:15px;text-align:left;color:#24443e;line-height:1.35;padding:4px 0}
#worldTour .tour-table .your-ranking{background:#ebc879!important;box-shadow:inset 4px 0 #a85d42}
.ranking-person small{display:block;font-size:12px;font-weight:400;color:#57674f;margin-top:2px}
.ranking-change{font-size:13px;font-weight:700;white-space:nowrap}
.ranking-change[data-direction=up]{color:#3b6b46}.ranking-change[data-direction=down]{color:#974c3e}
.ranking-self{display:flex;align-items:center;gap:16px;background:#e6c478;border:var(--brand-edge);border-radius:9px;padding:14px 18px;color:#193b38;margin:16px 0}
.ranking-self>strong{font-size:24px}.ranking-self>button{flex:1}.ranking-self>span{font-size:14px;font-weight:700}
#worldTour .tour-draw{background:#24484b;border:var(--brand-edge);border-radius:12px;padding:16px;gap:25px}
#worldTour .tour-round h3{background:#24484b;color:#e9d7ab;font-size:15px;border-bottom:2px solid #acb493;letter-spacing:.5px;padding:14px 4px;z-index:3}
#worldTour .tour-pair{background:#e8e3cc;color:#1d3c39;border:2px solid #142f33;border-radius:10px;font-size:14px;box-shadow:0 4px #102b2e;padding:8px;flex-shrink:0;min-height:114px}
#worldTour .tour-pair>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;min-height:46px;padding:3px 4px}
#worldTour .tour-pair>div>.tour-person,#worldTour .tour-pair>div>span{grid-column:1;grid-row:1;max-width:100%;font-size:15px;padding:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#worldTour .tour-pair>div>small{grid-column:1;grid-row:2;font-size:12px}
#worldTour .tour-pair>div>b{grid-column:2;grid-row:1/span 2;font-size:22px;font-variant-numeric:tabular-nums;align-self:center}
#worldTour .tour-pair .winner{background:#bfd0a4}
#worldTour .tour-pair.your-match{outline:3px solid #efbb5d;outline-offset:1px}
#worldTour .tour-round{min-width:285px}
#worldTour .tour-pair small{font-size:12px;color:#4e6452}

/* Atlas is still the real zoomable map, not a picture of a map. */
.tour-atlas:not(.event-modal){background:#1c3b41;border:3px solid #102c31;color:#e9e2c8;border-radius:13px;padding:14px}
.tour-atlas .atlas-top{background:#bc7259;border:2px solid #142e33;border-radius:9px;padding:13px 17px;color:#173638}
.tour-atlas .atlas-top h2{font-size:25px;letter-spacing:.2px;margin:0}.tour-atlas .atlas-top h2::before{display:none}
.tour-atlas .atlas-tools{gap:8px}.tour-atlas .atlas-tools button{background:#edc475;color:#193b3d;box-shadow:0 3px #0e2b30;border-color:#112e32;font-weight:800}
.tour-atlas .atlas-tools select{background:#b3c5b1;color:#173a3e;font-size:15px;border-color:#142f34}
.tour-atlas .atlas-frame{border:3px solid #122e33;box-shadow:0 4px #102b2e;border-radius:10px;margin:12px 0}
.tour-atlas .atlas-info{background:#e8e1c7;border:var(--brand-edge);color:#28483e;border-radius:12px;padding:18px}
.tour-atlas .atlas-info>button{background:#edc16a;color:#183637;width:100%;min-height:50px;font-weight:800;border-color:#1c3a39;box-shadow:0 3px #1c3a39}
.tour-atlas .atlas-legend{font-size:13px;color:#c6d1bc;line-height:1.5}
.tour-atlas .event-dossier .tour-identity,.event-modal .tour-identity{background:#aebfa2;color:#1c3c37;text-shadow:none;border:2px solid #345248}
.tour-atlas .event-dossier .tour-identity small{font-size:13px}
.tour-atlas .event-dossier .tour-identity strong{font-size:23px}
.tour-atlas .event-dossier h3{font-size:20px}
.event-modal>.event-enter{background:#e9bd65;color:#1c3b38;min-height:50px;width:100%;font-size:16px;font-weight:bold;margin-top:20px;position:sticky;bottom:0;box-shadow:0 3px #183937}
#manual .manual-head{background:#234449;gap:12px}

/* Setup, invites and pause are part of the same physical UI kit. */
#nameScreen,#bracketScreen,#lobby,#manual,body.touch #manual,body.touch .tournament-screen{background:#234449;color:#e9e2c9;border:var(--brand-edge);box-shadow:0 6px #0c272c;border-radius:13px;padding:22px}
#nameScreen h2,#bracketScreen h2,#lobby h2,#manual h2{background:#bc7157;color:#173539;border:2px solid #142e32;border-radius:8px;padding:17px;font-size:25px;letter-spacing:0}
#nameScreen p,#bracketScreen p,#lobby p,#manual p,#manual li,#manual h3,#nameScreen label{color:#d6dfc7;font-size:15px;line-height:1.55}
#manual h3{color:#ebc475;font-size:18px}#manual label{color:#e1e4cb}
#nameScreen label{font-size:14px;text-transform:none;letter-spacing:0}
#nameScreen button,#bracketScreen button,#lobby button,#manual button{background:#b7c5a7;color:#193b3a;border:2px solid #142f32;box-shadow:0 3px #10292d;font-size:14px;min-height:46px}
#nameScreen button[type=submit],#playRound,#shareInvite{background:#ebbc63;color:#183738}
#manualHome,#nameBack,#bracketBack,#cancelInvite{color:#d0dec7!important;border-color:#8fa68e!important}
#bracketPath{background:#1a393e;border:2px solid #102e32}
#bracketPath>.tournament-column>h3{background:#1a393e;color:#e4d3aa;font-size:15px;padding:14px 8px;box-shadow:0 2px #a0b18c}

@media(max-width:760px){
 body:not(.playing)>main{padding:12px 12px calc(12px + env(safe-area-inset-bottom));max-width:600px}
 #menu.menu-redesign,body.touch #menu.menu-redesign{display:flex;flex-direction:column;gap:0;padding:0;border-radius:0;max-width:480px}
 .menu-poster{min-height:0;padding:14px 0 10px;width:100%;border:0}
 .menu-poster .new-logo{max-width:460px;width:100%;height:auto}
 .menu-play{padding:5px 7px 14px;gap:14px;width:100%}
 #menu.menu-redesign #worldTourButton{min-height:88px}
 #menu.menu-redesign button.mode-card,#menu.menu-redesign .mode-pair button.mode-card{min-height:75px;padding:15px 21px}
 #menu.menu-redesign .mode-card strong{font-size:19px}
 #menu.menu-redesign .mode-card small{font-size:13px}
 .mode-pair{gap:14px}.menu-landscape{height:110px}
 #worldTour.tour-shell{padding:0 0 calc(87px + env(safe-area-inset-bottom))}
 #worldTour .tour-top{padding:8px 10px;gap:8px;margin-bottom:14px}
 #worldTour .tour-brand{min-width:0;flex:1}
 #worldTour .tour-brand img{display:none}
 #worldTour .tour-brand>span{display:block;font-size:18px;letter-spacing:.4px;font-weight:900;line-height:1.1;overflow-wrap:anywhere}
 #worldTour .tour-top button,#worldTour .tour-top select{font-size:13px;padding:7px;min-height:42px}
 #worldTour .tour-nav{position:fixed;z-index:20;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,600px);margin:0;border-radius:12px 12px 0 0;gap:0;padding:7px 5px calc(7px + env(safe-area-inset-bottom));border-bottom:0;box-shadow:0 -4px 18px #0b202b66}
 #worldTour .tour-nav button{font-size:12px;padding:6px 2px;min-height:50px;gap:5px}
 #worldTour .career-hero{padding:17px 14px;gap:14px;grid-template-columns:65px minmax(0,1fr)}
 #worldTour .career-badge{width:59px;height:73px}
 #worldTour .career-intro h2{font-size:26px;letter-spacing:-.5px}
 #worldTour .career-intro small{font-size:12px;letter-spacing:.6px}
 #worldTour .career-metrics{gap:7px}
 #worldTour .career-metrics>div{padding:11px 3px}
 #worldTour .career-metrics strong{font-size:26px}
 #worldTour .career-metrics span{font-size:12px;letter-spacing:.5px}
 .career-postcard{height:170px}.career-next-content{padding:16px}
 #worldTour .career-next h3{font-size:25px}
 #worldTour .career-map svg{max-height:180px;min-height:140px}
 #worldTour .tour-table th,#worldTour .tour-table td{padding:12px 9px}
 #worldTour .ranking-table th,#worldTour .ranking-table td{padding:12px 7px}
 #worldTour .ranking-table .tour-person{font-size:14px;white-space:normal;min-width:125px}
 #worldTour .ranking-table table{min-width:0;width:100%}
 .ranking-self{gap:12px;padding:12px}.ranking-self .tour-person{color:#284535}
 #worldTour .tour-content>h3{font-size:21px}
 .tour-atlas:not(.event-modal){padding:8px;margin:3px;width:calc(100vw - 6px);max-height:calc(100dvh - 6px)}
 .tour-atlas:not(.event-modal) .atlas-map{min-height:390px;height:65dvh}
 .tour-atlas .atlas-top{padding:12px}.tour-atlas .atlas-top h2{font-size:21px}
 .tour-atlas .atlas-info{padding:13px}
 .tour-atlas .atlas-tools select{width:100%}
 #nameScreen,#bracketScreen,#lobby,#manual,body.touch #manual,body.touch .tournament-screen{padding:14px}
}
@media(max-width:360px){#menu.menu-redesign .mode-card strong{font-size:17px}#worldTour .career-intro h2{font-size:23px}#worldTour .career-metrics strong{font-size:23px}.career-postcard{height:145px}}
@media(prefers-reduced-motion:reduce){#menu.menu-redesign .mode-card{transition:none!important;transform:none!important}}