/* Island Conquest: lobby page and match client. Uses the blue edition tokens. */
.multiplayer-page .profile-main{max-width:1080px}
.multiplayer-page label{display:block;font-size:13px;color:var(--blue-text,#f5f8ff);margin-top:14px}
.multiplayer-page label input,.multiplayer-page label select{display:block;width:100%;min-height:46px;margin-top:7px;padding:11px;border-radius:8px;border:1px solid #395171;background:#060e1c;color:var(--blue-text,#f5f8ff);font:16px system-ui,sans-serif}
.multiplayer-page form button[type=submit]{margin-top:20px;width:100%}
.multiplayer-page .status-line{min-height:22px;margin:12px 0 0;font-size:13px;color:#aed7ff}
.multiplayer-page .status-line.error,.multiplayer-page .lobby-status.error{color:#ffadae}
.player-name-field{flex:1 1 220px;margin-top:0!important}
.lobby-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:20px 0}
.lobby-grid .profile-card{margin:0}
.lobby-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.lobby-heading h2{margin:6px 0 0}
.game-code{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#060e1c;border:1px solid #2d466c;border-radius:12px}
.game-code small{font-size:10px;letter-spacing:2px;color:var(--blue-muted,#9caccc)}
.game-code strong{font:750 24px/1 ui-monospace,Consolas,monospace;letter-spacing:4px;color:var(--blue-cyan,#7dd8ff)}
.game-code button{min-height:36px;padding:6px 12px;font-size:12px}
.lobby-status{font-size:15px;color:#bfd8ff;margin:12px 0 18px}
.seats{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.seat{display:flex;align-items:center;gap:14px;padding:16px;border-radius:14px;background:#0f1c32;border:1px solid #243653;flex-wrap:wrap}
.seat.empty{border-style:dashed;color:var(--blue-muted,#9caccc)}
.seat .swatch{width:34px;height:34px;border-radius:10px;border:2px solid #ffffff33;flex:none}
.seat>div:not(.swatch){flex:1 1 120px;min-width:0}
.seat strong{display:block;font-size:15px}
.seat small{display:block;font-size:12px;color:var(--blue-muted,#9caccc)}
.seat .state{margin-left:auto;font-size:11px;letter-spacing:1px;text-transform:uppercase;padding:5px 9px;border-radius:7px;background:#132c4c;color:#b6dcff}
.seat .state.ready{background:#163f33;color:#9af0c8}
.seat .state.away{background:#4a2634;color:#ffd5dc}
.team-badge{font-size:11px;letter-spacing:1px;text-transform:uppercase;padding:5px 9px;border-radius:7px;background:#1d2b44;color:#dfe9ff;border:1px solid #33496d}
.team-select{min-height:36px;padding:6px 8px;border-radius:8px;border:1px solid #395171;background:#060e1c;color:var(--blue-text,#f5f8ff);font:13px system-ui,sans-serif}
.lobby-settings{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:20px 0 6px}
.lobby-settings div{padding:12px 14px;background:#0b1527;border:1px solid #243653;border-radius:12px}
.lobby-settings dt{font-size:11px;letter-spacing:1.5px;color:var(--blue-muted,#9caccc)}
.lobby-settings dd{margin:4px 0 0;font-weight:650}
.color-picker{margin:18px 0}
.color-picker>span{display:block;font-size:12px;color:var(--blue-muted,#9caccc);margin-bottom:8px}
.color-picker div{display:flex;gap:10px;flex-wrap:wrap}
.color-picker button{width:44px;height:44px;min-width:44px;border-radius:12px;border:2px solid #ffffff22;padding:0}
.color-picker button[aria-pressed=true]{outline:3px solid #fff;outline-offset:2px}
.color-picker button:disabled{opacity:.35}
.browse-list{display:grid;gap:10px}
.browse-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px;border-radius:12px;background:#0f1c32;border:1px solid #243653}
.browse-row strong{display:block;font-size:15px}
.browse-row small{display:block;font-size:12px;color:var(--blue-muted,#9caccc)}
.browse-row button{min-height:40px;padding:8px 14px}
.how-list{padding-left:20px;color:#bac8df;line-height:1.7}
.how-list li{margin:8px 0}
.how-list b{color:var(--blue-text,#f5f8ff)}
@media(max-width:600px){.seats{grid-template-columns:1fr}.lobby-heading{flex-direction:column}.game-code{width:100%;justify-content:space-between}}
@media(max-width:420px){.horizon-nav a,.horizon-nav button{font-size:11px;padding:9px 4px}}

/* ---- match client: the city game's own chrome, with match-specific bits ---- */
body.match-page .time-controls{gap:10px;align-items:center}
.prep-status{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;padding:6px 10px;border-radius:7px;background:#3a2f17;color:#f0ce8b;white-space:nowrap}
.prep-status.open{background:#163f33;color:#9af0c8}
body.match-page .story-panel .era-checklist{display:none}
body.match-page .goal-line small{margin-left:auto;color:var(--blue-muted,#9caccc);font-size:11px}
body.match-page .goal{padding:9px 0}
body.match-page #loading .loading-flame{color:#7dd8ff}
body.match-page #loading button{min-height:44px;margin:6px;padding:10px 18px;border-radius:10px;border:1px solid #3e8cff;background:#3e8cff;color:#05142c;font-weight:750;cursor:pointer}
body.match-page #loading button.secondary{background:#111e35;color:#f5f8ff;border-color:#345075}
body.match-page #loading-actions{margin-top:14px}
body.match-page .military-destination label{display:block;font-size:12px;letter-spacing:1.5px;color:var(--blue-cyan,#7dd8ff);margin-bottom:6px}
body.match-page .military-destination p{margin:0 0 8px}
body.match-page .military-destination select{display:block;width:100%;min-height:42px;margin:4px 0 8px;padding:8px 10px;border-radius:8px;border:1px solid #395171;background:#060e1c;color:var(--blue-text,#f5f8ff);font:14px system-ui,sans-serif}
.stats-table{width:100%;border-collapse:collapse;font-size:13px;margin:12px 0}
.stats-table th,.stats-table td{padding:8px 6px;border-bottom:1px solid #243653;text-align:right;vertical-align:top}
.stats-table th:first-child,.stats-table td:first-child{text-align:left;color:#9caccc}
.stats-table th.me,.stats-table td.me{background:#13284a;color:#f5f8ff}
.stats-table thead th small{display:block;font-weight:500;color:#9caccc;font-size:11px}
body.match-page .modal-buttons button.danger{background:#542936;border-color:#9d4c61;color:#ffd5dc}
body.match-page .voyage-row .modal-buttons{margin-top:8px}
body.match-page #raid-status{pointer-events:none}
body.match-page #sound-toggle{flex-shrink:0;font-size:18px}
body.match-page .island-card small{letter-spacing:1px}
@media(max-width:800px){body.match-page .bottom-area{bottom:calc(10px + env(safe-area-inset-bottom))}body.match-page #battle-bar{bottom:calc(150px + env(safe-area-inset-bottom))}body.match-page #toast{bottom:calc(165px + env(safe-area-inset-bottom))}body.match-page .time-controls{width:auto}.stats-table{font-size:11px}.stats-table th,.stats-table td{padding:6px 3px}}

/* ---- screenshot gallery (home page and multiplayer page) ------------------------ */
.shots{margin:36px 0}
.shots h2{margin:8px 0 18px}
.shots-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.shot{margin:0;border-radius:14px;overflow:hidden;background:#0b1527;border:1px solid #243653;box-shadow:0 18px 40px -26px #000;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.shot.wide{grid-column:1 / -1}
.shot a{display:block;overflow:hidden;background:#071021}
.shot img{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.shot.wide img{aspect-ratio:16 / 9}
.shot:hover{transform:translateY(-3px);border-color:#4f78b4;box-shadow:0 22px 48px -24px #3e8cff88}
.shot:hover img{transform:scale(1.04)}
.shot figcaption{padding:10px 14px 12px;font-size:12.5px;color:var(--blue-muted,#9caccc);line-height:1.5}
.menu-card+.shots,.shots+#account-panel{margin-top:40px}
body:not(.multiplayer-page) .shots{box-sizing:border-box;max-width:1120px;margin:40px auto 0;padding:8px 28px 110px}
body:not(.multiplayer-page) .shots .eyebrow{font-size:11px;letter-spacing:2px;color:var(--blue-cyan,#7dd8ff)}
@media(max-width:640px){.shots-grid{grid-template-columns:1fr}.shot img,.shot.wide img{aspect-ratio:16 / 10}}

/* ---- polish: motion and small details ---------------------------------------- */
@keyframes ic-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes ic-pop{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes ic-glow{0%,100%{box-shadow:0 0 0 0 #7dd8ff00}50%{box-shadow:0 0 22px 2px #7dd8ff33}}
@keyframes ic-pulse{0%,100%{opacity:1}50%{opacity:.55}}
@keyframes ic-drift{0%{transform:translate3d(-4%,0,0) scale(1)}50%{transform:translate3d(4%,-3%,0) scale(1.06)}100%{transform:translate3d(-4%,0,0) scale(1)}}
@keyframes ic-sheen{from{transform:translateX(-130%) skewX(-18deg)}to{transform:translateX(230%) skewX(-18deg)}}
@keyframes ic-dots{0%{content:'.'}33%{content:'..'}66%{content:'...'}100%{content:'.'}}
@keyframes ic-bump{0%{transform:scale(1)}35%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes ic-confetti{0%{transform:translateY(-20px) rotate(0);opacity:0}10%{opacity:1}100%{transform:translateY(420px) rotate(720deg);opacity:0}}
@keyframes ic-ring{0%{box-shadow:0 0 0 0 #ff8c6a66}100%{box-shadow:0 0 0 10px #ff8c6a00}}
.multiplayer-page{position:relative;overflow-x:hidden}
.multiplayer-page::before{content:'';position:fixed;inset:-20% -10% auto;height:70vh;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 20% 30%,#1f58a855 0,transparent 55%),radial-gradient(ellipse at 80% 20%,#7dd8ff22 0,transparent 50%),radial-gradient(ellipse at 55% 80%,#2fb7ad22 0,transparent 55%);animation:ic-drift 26s ease-in-out infinite}
.multiplayer-page .profile-header,.multiplayer-page .profile-main,.multiplayer-page .horizon-nav{position:relative;z-index:1}
.multiplayer-page h1{text-shadow:0 10px 40px #0b2b5e99}
.multiplayer-page h1 em{background:linear-gradient(90deg,#7dd8ff,#3e8cff 55%,#a7e9ff);-webkit-background-clip:text;background-clip:text;color:transparent;font-style:normal}
.multiplayer-page .profile-card{position:relative;overflow:hidden;animation:ic-rise .55s cubic-bezier(.2,.7,.2,1) both;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.multiplayer-page .profile-card::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,#ffffff0a,transparent 40%)}
.multiplayer-page .profile-card:hover{transform:translateY(-2px);border-color:#4f78b4;box-shadow:0 18px 40px -22px #3e8cff88}
.multiplayer-page .profile-main>.profile-card:nth-of-type(2),.lobby-grid .profile-card:nth-child(2){animation-delay:.08s}
.multiplayer-page .profile-main>.profile-card:nth-of-type(3),.lobby-grid .profile-card:nth-child(3){animation-delay:.16s}
.multiplayer-page .profile-main>.profile-card:nth-of-type(4){animation-delay:.24s}
.multiplayer-page .eyebrow{display:inline-flex;align-items:center;gap:8px}
.multiplayer-page .eyebrow::before{content:'';width:18px;height:2px;background:currentColor;opacity:.7}
.multiplayer-page button{position:relative;overflow:hidden;transition:transform .15s ease,box-shadow .2s ease,filter .2s ease}
.multiplayer-page button:not(:disabled):hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 8px 22px -12px #7dd8ffaa}
.multiplayer-page button:not(:disabled):active{transform:translateY(0) scale(.98)}
.multiplayer-page button:not(.secondary):not(:disabled)::after{content:'';position:absolute;top:0;bottom:0;width:40%;background:linear-gradient(90deg,transparent,#ffffff55,transparent);animation:ic-sheen 3.6s ease-in-out infinite;pointer-events:none}
.game-code{animation:ic-glow 3.2s ease-in-out infinite}
.game-code strong{text-shadow:0 0 14px #7dd8ff66}
.seat{animation:ic-pop .4s cubic-bezier(.2,.7,.2,1) both;transition:border-color .2s ease,background .2s ease}
.seat:nth-child(2){animation-delay:.05s}.seat:nth-child(3){animation-delay:.1s}.seat:nth-child(4){animation-delay:.15s}.seat:nth-child(5){animation-delay:.2s}
.seat:hover{border-color:#3b5a8a;background:#12223c}
.seat .swatch{box-shadow:0 0 0 3px #ffffff0d,0 6px 14px -6px currentColor}
.seat .state.ready{animation:ic-pop .3s ease both}
.seat.empty .swatch{animation:ic-pulse 2.4s ease-in-out infinite}
.lobby-status{position:relative}
.lobby-status.waiting::after{content:'.';display:inline-block;width:1.4em;text-align:left;animation:ic-dots 1.4s steps(1) infinite}
.browse-row{transition:transform .2s ease,border-color .2s ease,background .2s ease}
.browse-row:hover{transform:translateX(3px);border-color:#3b5a8a;background:#12223c}
.lobby-settings div{transition:border-color .2s ease}
.lobby-settings div:hover{border-color:#3b5a8a}
.horizon-nav a[aria-current=page]{position:relative}
.horizon-nav a[aria-current=page]::after{content:'';position:absolute;left:25%;right:25%;bottom:4px;height:2px;border-radius:2px;background:var(--blue-cyan,#7dd8ff);animation:ic-rise .4s ease both}
/* match page */
body.match-page dialog[open]{animation:ic-pop .28s cubic-bezier(.2,.7,.2,1) both}
body.match-page dialog::backdrop{background:#04101fb0;backdrop-filter:blur(6px) saturate(1.1)}
body.match-page .modal-content h2{animation:ic-rise .45s .05s ease both}
body.match-page .modal-content>p:first-of-type{animation:ic-rise .45s .12s ease both}
body.match-page #battle-bar:not([hidden]){animation:ic-rise .35s cubic-bezier(.2,.7,.2,1) both}
body.match-page #toast{transition:opacity .25s ease,transform .25s cubic-bezier(.2,.7,.2,1);box-shadow:0 10px 30px -12px #000000aa,0 0 0 1px #7dd8ff22 inset}
body.match-page .prep-status.open{animation:ic-glow 2.6s ease-in-out infinite}
body.match-page #raid-status.danger{animation:ic-ring 1.4s ease-out infinite}
body.match-page .map-button{transition:transform .15s ease,box-shadow .2s ease}
body.match-page .map-button:hover{transform:translateY(-1px);box-shadow:0 8px 20px -10px #000c}
body.match-page .building-card{transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .2s ease}
body.match-page .building-card:hover{transform:translateY(-2px);box-shadow:0 10px 22px -14px #000c}
body.match-page .building-card canvas{transition:transform .2s ease}
body.match-page .building-card:hover canvas{transform:translateY(-2px) scale(1.06)}
body.match-page .building-card.selected{box-shadow:0 0 0 2px #7dd8ff66,0 10px 22px -14px #000c}
body.match-page #resources.bump .resource strong{animation:ic-bump .35s ease}
body.match-page #minimap{transition:box-shadow .25s ease}
body.match-page #minimap:hover{box-shadow:0 0 0 2px #7dd8ff55}
body.match-page .goal.done .goal-check{animation:ic-pop .3s ease both}
body.match-page .confetti{position:absolute;top:0;width:8px;height:14px;border-radius:2px;pointer-events:none;animation:ic-confetti 2.6s ease-in forwards;opacity:0}
body.match-page .modal-content{position:relative}
@media(prefers-reduced-motion:reduce){.multiplayer-page::before,.multiplayer-page .profile-card,.seat,.game-code,.seat .state.ready,.seat.empty .swatch,.lobby-status.waiting::after,.multiplayer-page button::after,body.match-page dialog[open],body.match-page .modal-content h2,body.match-page .modal-content>p:first-of-type,body.match-page #battle-bar:not([hidden]),body.match-page .prep-status.open,body.match-page #raid-status.danger,body.match-page #resources.bump .resource strong,body.match-page .goal.done .goal-check,body.match-page .confetti,.horizon-nav a[aria-current=page]::after{animation:none!important}.multiplayer-page .profile-card,.multiplayer-page button,.seat,.browse-row,body.match-page .building-card,body.match-page .map-button{transition:none!important}}