/* Formal shell inherits the night-stadium palette. */
[hidden]{display:none!important}body.shell-open{overflow:auto}body.shell-open #viewport{visibility:hidden}#shell{position:fixed;inset:0;z-index:120;background:linear-gradient(90deg,rgba(6,16,14,.98) 20%,rgba(6,16,14,.76)),url('assets/stadium.png') center/cover,#06100e;overflow:auto;color:#e5eedf;scrollbar-color:#7c7355 #0a1d18}#shell *{box-sizing:border-box}.shell-frame{max-width:1180px;min-height:100%;margin:auto;padding:32px 48px;display:flex;flex-direction:column}.shell-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:28px;border-bottom:1px solid #344b3f}.shell-nav b{font-size:20px;letter-spacing:.06em;color:#d9b95e}.shell-nav b span{display:block;font-size:12px;color:#a6b8aa;letter-spacing:.2em;margin-top:4px}.shell-content{padding:52px 0;flex:1}.shell-heading{display:flex;align-items:center;gap:20px}.shell-heading h1{font-size:clamp(28px,4vw,46px);line-height:1.2;letter-spacing:-.025em;margin:0 0 16px;outline:none}.shell-lead{font-size:17px;color:#a6b8aa;margin:0 0 38px;line-height:1.7}#shell button,#shellDialog button{min-height:44px;padding:10px 20px;font:inherit;color:#e5eedf;background:#17372d;border:1px solid #496151;border-radius:8px;cursor:pointer}#shell button:hover,#shellDialog button:hover{background:#244e3e}#shell button.primary,#shellDialog button.primary{background:#d9b95e;color:#101c13;border-color:#d9b95e;font-weight:700}#shell button:disabled,#shellDialog button:disabled{opacity:.45;cursor:not-allowed}#shell button:focus-visible,#shell input:focus-visible,#shell select:focus-visible,#shellDialog :focus-visible{outline:3px solid #f0cf72;outline-offset:3px}#shell .shell-back{padding:8px 12px;margin-bottom:16px;background:transparent}#shell footer{display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#a6b8aa;padding-top:22px;border-top:1px solid #344b3f}.home-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:72px;align-items:start}.mode-list{display:grid;gap:16px}#shell .mode-button{display:grid;grid-template-columns:1fr auto;gap:8px;text-align:left;padding:24px 28px;min-height:118px;background:#102a22}#shell .mode-button.primary{background:#d9b95e}.mode-button strong{font-size:26px}.mode-button span{grid-column:1;font-size:14px;opacity:.85}.mode-button b{grid-column:2;grid-row:1/3;align-self:center;font-size:14px}.continue-button{justify-self:start;background:transparent!important}.home-aside{padding-left:36px;border-left:1px solid #344b3f}.home-aside h2{margin:18px 0 12px}.home-aside p{line-height:1.9;color:#a6b8aa;margin-top:30px}.profile-emblem{width:70px;height:80px;border-radius:8px 8px 30px 30px;background:var(--crest);display:grid;place-items:center;font-size:32px;color:#06100e;font-weight:bold}.shell-form{max-width:640px;display:grid;gap:24px;margin-top:24px}.shell-form label,.join-form label{display:grid;gap:9px;font-size:15px}.shell-form input:not([type=checkbox]):not([type=radio]),.shell-form select,.join-form input{width:100%;min-height:48px;border:1px solid #496151;border-radius:6px;background:#0a1d18;color:#e5eedf;font:inherit;padding:10px 12px;caret-color:#d9b95e;color-scheme:dark}.shell-form input::placeholder,.join-form input::placeholder{color:#a6b8aa}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}.shell-form p{margin:0;color:#a6b8aa;line-height:1.7}.shell-form fieldset{border:0;padding:0;margin:0}.shell-form legend{margin-bottom:12px}.crest-options{display:flex;gap:16px}.crest-options label{position:relative}.crest-options input{position:absolute;inset:0;opacity:0;cursor:pointer}.crest-options span{display:block;width:48px;height:48px;background:var(--crest);border-radius:8px}.crest-options input:checked+span{outline:3px solid #e5eedf;outline-offset:4px}.crest-options input:focus-visible+span{outline:3px solid #f0cf72;outline-offset:4px}#shell .check-row{display:flex;align-items:center;gap:12px}.check-row input{width:22px;height:22px;accent-color:#d9b95e}.setup-note{color:#a6b8aa;font-size:14px;line-height:1.7}.room-tools{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.join-form{display:flex;gap:12px;align-items:end;margin:28px 0}.join-form label{flex:1;max-width:340px}.room-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid #344b3f}.room-row small{display:block;color:#a6b8aa;margin-top:8px}.empty-room{padding:28px 0;color:#a6b8aa}.room-summary{padding:12px 0 22px;border-bottom:1px solid #344b3f}.room-summary strong{font-size:25px;letter-spacing:.12em;color:#f0cf72;margin:0 20px 0 8px}.room-summary p{color:#a6b8aa}.lobby-players{max-width:740px}.lobby-player{display:flex;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid #344b3f}.lobby-player strong{flex:1}.lobby-player small{color:#d9b95e}.seat-number{width:36px;height:36px;display:grid;place-items:center;border:1px solid #496151;border-radius:50%;font-variant-numeric:tabular-nums}#shellError{color:#ffadad;line-height:1.6}#shellDialog{z-index:160;max-width:500px;width:calc(100% - 32px);max-height:85dvh;overflow:auto;padding:28px;background:#102a22;color:#e5eedf;border:1px solid #7c7355;border-radius:12px}#shellDialog::backdrop{background:#020806cc}.shell-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.shell-dialog-head h2{margin:0}.settings-options{display:grid;margin:24px 0}.settings-options label{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:66px;border-bottom:1px solid #344b3f}.settings-options small{display:block;font-size:12px;color:#a6b8aa;margin-top:5px}.settings-options input{accent-color:#d9b95e}.settings-options input[type=checkbox]{width:24px;height:24px}.settings-options input[type=range]{width:150px}.settings-options output{color:#d9b95e;font-variant-numeric:tabular-nums}#shellDialog p,#shellDialog li{line-height:1.8;color:#c4d3c7}#shellDialog .danger{color:#ffb8b8;border-color:#8a5555;background:#402321}#turnClock{position:absolute;left:630px;top:47px;font-size:18px;font-variant-numeric:tabular-nums;color:#d9b95e}#turnClock.urgent{color:#ffb0a3;font-weight:800}#appcontrols [hidden]{display:none!important}#shell ::selection,#shellDialog ::selection{background:#d9b95e;color:#06100e}@media(max-width:767px){.shell-frame{padding:22px 22px max(22px,env(safe-area-inset-bottom))}.shell-content{padding:34px 0}.shell-nav{padding-bottom:20px}.home-layout{grid-template-columns:1fr;gap:32px}.home-aside{border-left:0;border-top:1px solid #344b3f;padding:24px 0 0;display:grid;grid-template-columns:60px 1fr auto;gap:12px;align-items:center}.profile-emblem{width:50px;height:58px;font-size:25px}.home-aside h2{margin:0;font-size:20px}.home-aside p{grid-column:1/4;margin:10px 0}.home-aside>button:last-child{grid-column:1/4}.shell-heading{gap:10px;align-items:start}.shell-heading h1{font-size:30px}.shell-lead{font-size:15px;margin-bottom:26px}#shell .mode-button{padding:22px 20px}.mode-button strong{font-size:23px}.mode-button span{font-size:12px}.form-row{grid-template-columns:1fr;gap:24px}#shell footer{font-size:11px}.room-summary strong{display:inline-block;margin-bottom:12px}.room-summary button{display:block}.lobby-player{gap:12px}.join-form{align-items:stretch}.join-form button{align-self:end}.settings-options input[type=range]{width:125px}#turnClock{position:static;font-size:12px;margin-left:auto}#stage header{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){#shell *,#shellDialog *{scroll-behavior:auto!important}}
@media(max-height:500px) and (max-width:950px){#turnClock{position:static;font-size:12px;margin-left:auto}.shell-content{padding:26px 0}.shell-frame{padding-top:18px;padding-bottom:18px}.shell-heading h1{font-size:30px}}
.auth-tabs{display:flex;gap:12px;max-width:640px}.auth-tabs button{flex:1}.auth-tabs button[aria-pressed=true]{border-color:#d9b95e!important;color:#f0d480!important;background:#273c29!important}.account-note,.account-caption{font-size:13px;color:#b2c4b6;line-height:1.7}.guest-entry{margin-top:24px;background:transparent!important}.badge-options{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:12px 8px}.badge-options label{position:relative;display:flex!important;flex-direction:column;align-items:center;gap:4px!important;cursor:pointer}.badge-options input{position:absolute;width:100%;height:100%;opacity:0;inset:0;margin:0;cursor:pointer}.badge-options span{display:block;width:48px;height:54px;padding:3px;border-radius:6px;border:1px solid transparent}.badge-options small{font-size:10px;color:#afc4b7}.badge-options input:checked+span{background:#284334;border-color:#e4cd8d;outline:1px solid #e4cd8d}.badge-options input:focus-visible+span{outline:3px solid #eddbab;outline-offset:3px}.shell-form legend small{font-size:12px;color:#adbfaf}.profile-emblem{background:none!important;border-radius:0;width:76px;height:84px}.password-change{border-top:1px solid #3e5746;padding-top:14px}.password-change summary{cursor:pointer;color:#d9c281;min-height:40px}.password-change label{margin:12px 0}.account-caption{margin:0}.shell-form .password-change input{min-height:44px}#accountError{color:#f0b1ab}.home-aside .profile-emblem .club-crest{width:100%;height:100%}#shellDialog .badge-options{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:767px){.badge-options{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px 8px}.badge-options span{width:46px;height:52px}.home-aside .profile-emblem{width:54px;height:64px}.account-caption{font-size:12px}}

/* First-time players see the existing manual tutorial entry before starting a match. */
.home-aside .first-play-tip{margin:18px 0 12px;padding:10px 13px;border-left:3px solid #e6c775;background:#d9b95e1c;color:#f1e2b8;font-size:14px;line-height:1.6}
#shell .rules-suggested{border-color:#e6c775;background:#68552b;color:#fff1c7;box-shadow:0 0 0 2px #e6c77545}
