600;700;800;900&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--navy:#061321;--panel:rgba(7,21,37,.88);--line:rgba(155,205,235,.18);--cyan:#5ce5ef;--white:#f0f8ff;--muted:#8ba4b9;--red:#ff626c}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#061321;color:var(--white);font-family:Inter,system-ui,sans-serif}button{font:inherit;cursor:pointer}
#game-shell{position:relative;width:100%;height:100%;min-height:420px;overflow:hidden;background:#09283a}#game{position:absolute;inset:0;width:100%;height:100%;display:block}
.topbar{position:absolute;top:0;left:0;right:0;height:76px;display:flex;align-items:center;padding:0 25px;background:linear-gradient(180deg,rgba(3,13,24,.92),rgba(3,13,24,.55));border-bottom:1px solid rgba(146,209,232,.12);gap:28px;z-index:2}
.brand{display:flex;align-items:center;gap:10px;font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:27px;letter-spacing:1px}.brand-icon{display:grid;place-items:center;width:39px;height:39px;border:1px solid rgba(92,229,239,.45);border-radius:11px;background:rgba(92,229,239,.12);color:var(--cyan);font-size:23px}.accent,.start-card h1 span{color:var(--cyan)}
.stats{display:flex;gap:28px;margin-left:auto;margin-right:10px}.stats div{display:flex;flex-direction:column;gap:3px;min-width:66px}.stats small{font-size:9px;letter-spacing:1.5px;color:#7f9db4;font-weight:800}.stats b{font-size:18px;font-variant-numeric:tabular-nums}
.icon-button{width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.05);color:#d8efff;font-size:17px}
.panel{position:absolute;z-index:2;top:96px;background:var(--panel);border:1px solid var(--line);border-radius:13px;backdrop-filter:blur(12px);box-shadow:0 14px 35px rgba(0,0,0,.15)}.left-panel{left:20px;width:220px;padding:17px}.right-panel{right:20px;width:230px;padding:17px}
.panel-title{font-size:10px;letter-spacing:1.7px;font-weight:800;color:#8ca9bd;margin-bottom:16px}.ship-name{font-size:14px;font-weight:800;display:flex;align-items:center;gap:8px;margin-bottom:19px}.live-dot{width:7px;height:7px;border-radius:50%;background:#5ce5a7;box-shadow:0 0 10px #5ce5a7}
.meter-label{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.8px;color:#8da6ba;font-weight:800;margin:13px 0 7px}.meter-label span:last-child{color:#e0eff8;letter-spacing:0}.meter{height:6px;background:#1b3447;border-radius:99px;overflow:hidden}.meter-fill{height:100%;width:100%;border-radius:99px;transition:width .15s}.hull-fill{background:linear-gradient(90deg,#37d8b0,#a0f3d3)}.xp-fill{background:linear-gradient(90deg,#48c5f7,#79f2ff)}
.tip{margin-top:22px;padding-top:15px;border-top:1px solid var(--line)}.tip b{font-size:9px;letter-spacing:1.5px;color:var(--cyan)}.tip p{font-size:11px;line-height:1.6;color:#8da8bc;margin:8px 0 0}
.live-tag{float:right;color:#63e9b0;font-size:8px;letter-spacing:1px;border:1px solid rgba(99,233,176,.25);padding:3px 5px;border-radius:4px}#leaderboard{list-style:none;padding:0;margin:0}#leaderboard li{display:flex;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid rgba(155,205,235,.08);font-size:11px}#leaderboard .place{width:18px;color:#7893a9;font-weight:800}#leaderboard .captain{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#leaderboard .points{font-variant-numeric:tabular-nums;color:#b9d5e7;font-weight:700}.you-tag{font-size:8px;color:var(--cyan);border:1px solid rgba(92,229,239,.28);padding:2px 4px;border-radius:3px}.your-rank{display:flex;justify-content:space-between;margin-top:14px;font-size:10px;color:#819bb0}.your-rank b{color:var(--cyan)}
.bottom-hint{position:absolute;bottom:19px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;color:rgba(221,241,251,.7);font-size:10px;white-space:nowrap;z-index:2;text-shadow:0 2px 5px #00101a}.bottom-hint>span:not(.key-dot){color:#5e849b}.key-dot{width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.minimap-wrap{position:absolute;bottom:18px;right:20px;z-index:2;width:164px;padding:8px;background:rgba(7,21,37,.85);border:1px solid var(--line);border-radius:10px}.minimap-label{font-size:8px;letter-spacing:1.6px;color:#91adbf;margin:0 0 6px 3px;font-weight:800}#minimap{display:block;width:100%;height:auto;border-radius:5px;background:#0d3a4c}
.overlay{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:rgba(2,12,22,.44);backdrop-filter:blur(4px);padding:18px}.hidden{display:none!important}.start-card{width:min(520px,95vw);text-align:center;padding:35px 38px 28px;border:1px solid rgba(131,221,238,.24);border-radius:20px;background:linear-gradient(145deg,rgba(8,31,49,.97),rgba(4,17,31,.97));box-shadow:0 25px 90px rgba(0,0,0,.48)}.eyebrow{font-size:9px;letter-spacing:2.5px;color:var(--cyan);font-weight:800}.hero-emoji{margin:15px auto 9px;width:64px;height:64px;display:grid;place-items:center;border:1px solid rgba(92,229,239,.35);border-radius:19px;background:rgba(92,229,239,.08);font-size:34px}.start-card h1{font-family:'Barlow Condensed',sans-serif;font-size:clamp(39px,7vw,58px);line-height:1;margin:8px 0 12px;letter-spacing:1.2px;font-weight:900}.start-card p{font-size:12px;line-height:1.7;color:#9bb4c6;max-width:340px;margin:0 auto 23px}.controls-grid{display:flex;justify-content:center;gap:19px;margin:0 auto 24px;flex-wrap:wrap}.controls-grid>div{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:center}.controls-grid span{font-size:8px;letter-spacing:.7px;color:#8eaabd;margin-left:4px}.controls-grid kbd{font:800 9px Inter,sans-serif;color:#d9f7ff;background:#173347;border:1px solid #315a6d;border-bottom-width:2px;padding:6px 7px;border-radius:5px}.play-button{display:flex;align-items:center;justify-content:center;gap:35px;width:100%;border:0;border-radius:9px;padding:15px 20px;background:linear-gradient(90deg,#39cdd9,#72edf0);color:#03202c;font-size:11px;font-weight:900;letter-spacing:1.3px;box-shadow:0 7px 22px rgba(49,207,220,.16);transition:transform .15s,filter .15s}.play-button:hover{transform:translateY(-2px);filter:brightness(1.08)}.play-button span{font-size:17px}.solo-note{display:block;color:#67869b;font-size:8px;letter-spacing:1.6px;margin-top:17px}.compact{max-width:390px}.compact h1{margin-top:15px}.toast{position:absolute;z-index:4;top:88px;left:50%;transform:translateX(-50%);background:rgba(4,25,40,.92);border:1px solid rgba(92,229,239,.3);padding:10px 15px;border-radius:8px;font-size:11px;color:#bdf9ff;pointer-events:none}
@media(max-width:760px){.topbar{height:64px;padding:0 13px;gap:12px}.brand{font-size:21px}.brand-icon{width:32px;height:32px}.stats{gap:12px}.stats div{min-width:43px}.stats small{font-size:7px}.stats b{font-size:14px}.left-panel{top:78px;left:10px;width:165px;padding:12px}.right-panel{top:auto;bottom:64px;right:10px;width:174px;padding:12px}.panel-title{font-size:8px;margin-bottom:10px}.tip{display:none}.ship-name{font-size:12px;margin-bottom:12px}.bottom-hint{left:10px;transform:none;bottom:14px;font-size:8px;gap:6px}.minimap-wrap{right:10px;bottom:10px;width:125px;opacity:.9}.start-card{padding:27px 20px 22px}.controls-grid{gap:12px}.controls-grid span{font-size:7px}.right-panel #leaderboard li{padding:6px 0;font-size:9px}}

.build-tag{display:inline-block;margin-left:9px;vertical-align:middle;font:800 8px Inter,sans-serif;letter-spacing:1px;color:#6f9ab1;border:1px solid rgba(111,154,177,.35);padding:3px 5px;border-radius:4px}

/* Update 0.0.2 — vessel selection and locked-name test shop */
.secondary-button{width:100%;margin-top:10px;padding:12px 14px;border-radius:9px;border:1px solid rgba(122,214,230,.3);background:rgba(100,177,197,.08);color:#bcecf4;font-size:10px;font-weight:800;letter-spacing:.9px;transition:background .15s,border-color .15s}
.secondary-button:hover{background:rgba(100,177,197,.16);border-color:rgba(122,214,230,.65)}
.class-card{width:min(880px,96vw);max-height:92vh;overflow:auto}.class-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:20px}.class-option{display:flex;min-height:205px;flex-direction:column;align-items:center;gap:10px;padding:18px 12px;border:1px solid rgba(117,220,235,.22);border-radius:13px;background:linear-gradient(160deg,rgba(20,59,79,.9),rgba(5,23,39,.95));color:#e9faff;text-align:center;transition:transform .15s,border-color .15s,background .15s}.class-option:hover{transform:translateY(-3px);border-color:#66e5f0;background:linear-gradient(160deg,rgba(24,84,104,.96),rgba(5,23,39,.98))}.class-art{display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:rgba(94,222,236,.12);border:1px solid rgba(94,222,236,.3);font-size:27px;color:#a9f8ff;box-shadow:inset 0 0 20px rgba(94,222,236,.06)}.class-art.carrier{color:#f5e2b7;background:rgba(245,226,183,.09)}.class-art.battleship{color:#c8d5df}.class-option strong{font-size:14px}.class-option small{font-size:10px;color:#91b4c7}.class-stats{font-size:8px;letter-spacing:.4px;color:#b9d9e7}.class-option em{margin-top:auto;font-style:normal;font-size:9px;font-weight:900;letter-spacing:1px;color:#67e9f1}.identity-card{width:min(470px,95vw);max-height:94vh;overflow:auto;text-align:left;padding:30px}.identity-card h1{text-align:center;font-size:42px}.identity-card>p{text-align:center}.identity-card label{display:block;margin:13px 0 6px;color:#a7c3d4;font-size:10px;font-weight:800;letter-spacing:.5px}.identity-card input:not([type=color]){width:100%;padding:12px;border-radius:8px;border:1px solid rgba(130,201,221,.24);outline:none;background:#071b2b;color:#eafaff;font:inherit;font-size:12px}.identity-card input:focus{border-color:#5ce5ef}.color-row{display:flex;align-items:center;gap:12px;color:#9db9cb;font-size:10px}.color-row input{width:45px;height:36px;padding:3px;border:1px solid rgba(130,201,221,.24);border-radius:7px;background:#071b2b}.test-price{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:17px 0;padding:12px;border:1px solid rgba(92,229,239,.16);border-radius:8px;background:rgba(92,229,239,.05)}.test-price span{font-size:8px;letter-spacing:1px;color:#7fa4b9;font-weight:900}.test-price strong{font-size:12px;color:#b8f9ff}.test-price small{width:100%;font-size:9px;color:#7797aa}.identity-status{margin-top:12px;min-height:32px;color:#9ec4d3;font-size:10px;line-height:1.5;text-align:center}.captain-id-note{font-size:9px;color:#6f8da1}
@media(max-width:650px){.class-options{grid-template-columns:1fr}.class-option{min-height:155px}.class-card{padding:22px 15px}.identity-card{padding:23px 18px}}

/* Update 0.0.3 — fleet command, records, zones and combat progression */
.top-actions{display:flex;align-items:center;gap:7px}.nav-button{border:1px solid rgba(120,205,229,.24);background:rgba(8,35,53,.78);color:#bdebf4;border-radius:7px;padding:9px 11px;font:800 9px Inter,sans-serif;letter-spacing:.5px;white-space:nowrap;transition:.15s}.nav-button:hover{background:rgba(48,129,151,.32);border-color:rgba(92,229,239,.6);color:#fff}.panel-link{margin-top:11px;width:100%;padding:8px;border:1px solid rgba(92,229,239,.2);border-radius:6px;background:rgba(92,229,239,.06);color:#8feef5;font-size:9px;font-weight:900;letter-spacing:.7px}.bot-tag{color:#ffad9e;border-color:rgba(255,125,120,.2)}
.modal-card{width:min(760px,96vw);max-height:91vh;overflow:auto;text-align:left;padding:30px}.modal-card h1{font-size:clamp(35px,5vw,49px);text-align:center}.modal-card>p{text-align:center;margin-bottom:18px}.clan-card{width:min(600px,96vw)}.clan-current{display:flex;align-items:center;gap:14px;margin:18px 0;padding:15px;border:1px solid rgba(92,229,239,.2);border-radius:12px;background:linear-gradient(110deg,rgba(27,90,110,.28),rgba(7,25,43,.7))}.clan-emblem{width:49px;height:49px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#1a7d8a,#15354a);border:1px solid rgba(121,242,248,.4);font-size:26px;color:#d3fbff}.clan-current div{display:flex;flex-direction:column;gap:4px}.clan-current small,.clan-current span{font-size:9px;color:#85a9bc;letter-spacing:1px}.clan-current strong{font-size:15px;color:#f0fcff}.clan-card label{display:block;margin:12px 0 6px;color:#a7c3d4;font-size:10px;font-weight:800;letter-spacing:.5px}.clan-card input{width:100%;padding:12px;border-radius:8px;border:1px solid rgba(130,201,221,.24);outline:none;background:#071b2b;color:#eafaff;font:inherit;font-size:12px}.clan-list{margin-top:23px}.clan-row{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid rgba(155,205,235,.1)}.clan-small-emblem{width:33px;height:33px;display:grid;place-items:center;border-radius:9px;background:rgba(92,229,239,.1);color:#9df7ff}.clan-row>span:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1}.clan-row b{font-size:11px}.clan-row small{font-size:9px;color:#7f9fb3}.join-clan-btn{border:1px solid rgba(92,229,239,.28);background:rgba(92,229,239,.08);color:#aaf7ff;padding:7px 10px;border-radius:6px;font-size:8px;font-weight:900;letter-spacing:.7px}.leaderboard-card{width:min(680px,96vw)}.leaderboard-head{display:grid;grid-template-columns:1fr 60px 80px;gap:12px;padding:10px 12px;color:#7396aa;font-size:8px;letter-spacing:1px;font-weight:900;border-bottom:1px solid var(--line)}.leaderboard-head span:nth-child(n+2){text-align:right}.leaderboard-full{list-style:none;padding:0;margin:0;max-height:48vh;overflow:auto}.leaderboard-full li{display:grid;grid-template-columns:35px minmax(0,1fr) 60px 80px;align-items:center;gap:12px;padding:9px 12px;border-bottom:1px solid rgba(155,205,235,.07);font-size:10px}.leaderboard-full li>span:nth-last-child(2),.leaderboard-full li>b{text-align:right}.full-rank{color:#7d9eb3;font-weight:900}.full-captain{display:flex;flex-direction:column;gap:3px;overflow:hidden;font-weight:800}.full-captain small{font-size:7px;color:#6e8fa4;font-weight:600;letter-spacing:.4px}.leaderboard-full li>b{color:#c4e8f5}.leader-you{background:linear-gradient(90deg,rgba(92,229,239,.12),rgba(92,229,239,.015));outline:1px solid rgba(92,229,239,.15)}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:24px 0}.stat-grid>div{padding:16px 10px;border:1px solid rgba(130,201,221,.18);border-radius:10px;background:linear-gradient(145deg,rgba(18,53,73,.8),rgba(5,22,38,.8));display:flex;flex-direction:column;gap:9px}.stat-grid small{font-size:8px;color:#7fa5b9;letter-spacing:1px;font-weight:900}.stat-grid strong{font:800 24px 'Barlow Condensed',sans-serif;color:#e4fbff}.stats-note{font-size:10px!important;color:#789aaf!important}
@media(max-width:900px){.top-actions{gap:4px}.nav-button{padding:8px 7px;font-size:8px}.build-tag{display:none}}
@media(max-width:650px){.top-actions{gap:3px}.nav-button{padding:7px 5px;font-size:7px;letter-spacing:0}.topbar{padding:0 8px}.brand{font-size:17px}.stats{gap:7px}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.modal-card{padding:22px 15px}.leaderboard-full li{grid-template-columns:26px minmax(0,1fr) 35px 55px;gap:6px;padding:8px 5px}.leaderboard-head{grid-template-columns:1fr 35px 55px;gap:6px;padding:8px 5px}}

/* Update 0.0.5 — expanded command-center menu */
.menu-overlay{background:radial-gradient(ellipse at 50% 28%,rgba(21,100,126,.28),rgba(2,10,20,.76) 70%);backdrop-filter:blur(7px)}
.main-menu-card{width:min(850px,96vw);max-height:94vh;overflow:auto;text-align:left;padding:27px 30px 22px;background:linear-gradient(145deg,rgba(6,26,43,.98),rgba(3,13,27,.985));border-color:rgba(99,220,238,.3);box-shadow:0 28px 100px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.035)}
.menu-topline{display:flex;align-items:center;gap:13px;padding-bottom:18px;border-bottom:1px solid rgba(155,205,235,.12)}
.menu-brand-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:linear-gradient(145deg,#1a7184,#0a2b42);border:1px solid rgba(92,229,239,.5);color:#b8fbff;font-size:29px;box-shadow:0 0 26px rgba(51,205,220,.12)}
.menu-brand-text{display:flex;flex-direction:column;gap:2px}.menu-brand-text .eyebrow{font-size:8px;letter-spacing:2px}.menu-brand-text h1{font:900 34px/1 'Barlow Condensed',sans-serif;margin:0;letter-spacing:2px}.menu-brand-text h1 span,.menu-hero h2 span{color:var(--cyan)}
.menu-version{margin-left:auto;text-align:right;font-size:8px;line-height:1.6;letter-spacing:1.5px;color:#789bb0}.menu-version b{font-size:12px;color:#b8f9ff}
.menu-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:27px 5px 19px}.menu-hero .eyebrow{font-size:8px}.menu-hero h2{font:900 clamp(35px,5vw,53px)/.98 'Barlow Condensed',sans-serif;letter-spacing:1px;margin:9px 0}.menu-hero p{font-size:11px;color:#91afc2;margin:0;max-width:390px}.menu-ship-art{position:relative;display:grid;place-items:center;flex:0 0 118px;height:105px;border:1px solid rgba(92,229,239,.19);border-radius:20px;background:radial-gradient(circle at 50% 40%,rgba(49,190,207,.19),rgba(8,36,55,.15) 70%);color:#a8f7ff;font-size:57px;text-shadow:0 0 22px rgba(92,229,239,.3);transform:rotate(-7deg)}.menu-ship-art:before,.menu-ship-art:after{content:'';position:absolute;width:75px;height:20px;border:1px solid rgba(92,229,239,.22);border-radius:50%;transform:rotate(-25deg)}.menu-ship-art:after{width:95px;height:31px;border-color:rgba(92,229,239,.1)}.menu-ship-art i{position:absolute;right:16px;top:12px;color:#e8d69a;font-style:normal;font-size:15px}
.menu-play{margin:0 0 15px;padding:17px 20px;justify-content:space-between;box-shadow:0 8px 26px rgba(49,207,220,.18);font-size:12px}.menu-feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.menu-feature{position:relative;display:flex;min-width:0;flex-direction:column;align-items:flex-start;gap:7px;padding:14px 12px;border:1px solid rgba(129,197,220,.17);border-radius:11px;background:linear-gradient(145deg,rgba(14,45,65,.8),rgba(5,22,37,.85));color:#edfaff;text-align:left;transition:transform .16s,border-color .16s,background .16s}.menu-feature:hover{transform:translateY(-3px);border-color:rgba(92,229,239,.6);background:linear-gradient(145deg,rgba(23,74,93,.9),rgba(5,24,40,.95))}.feature-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:rgba(92,229,239,.1);font-size:17px}.menu-feature b{font-size:9px;letter-spacing:.7px}.menu-feature small{font-size:9px;line-height:1.4;color:#7fa2b8}.feature-arrow{position:absolute;right:10px;top:10px;color:#5ce5ef;font-size:13px}.menu-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:18px;padding-top:15px;border-top:1px solid rgba(155,205,235,.1)}.menu-controls{display:flex;align-items:center;gap:5px;color:#7f9eb2;font-size:8px;letter-spacing:.7px}.menu-controls kbd{padding:4px 5px;border-radius:4px;background:#102c40;border:1px solid #29485b;color:#d9f7ff;font:800 8px Inter,sans-serif}.menu-controls span:not(.menu-dot){margin-left:3px}.menu-dot{margin:0 6px;color:#426d83}.menu-status{font-size:8px;letter-spacing:1px;color:#7596aa}.menu-status span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#54e0ae;box-shadow:0 0 8px #54e0ae;margin-right:5px}.menu-status b{color:#426b80;margin:0 5px}
.clan-price{margin:14px 0}.tag-preview{font-size:8px;font-weight:900;letter-spacing:.7px;color:#6ce8f0;border:1px solid rgba(92,229,239,.18);padding:5px 7px;border-radius:5px}.clan-card input:disabled{opacity:.6}.clan-card #create-clan-btn:disabled{filter:grayscale(.6);opacity:.7;cursor:default}
@media(max-width:650px){.main-menu-card{padding:20px 16px 16px}.menu-brand-mark{width:43px;height:43px;font-size:24px}.menu-brand-text h1{font-size:29px}.menu-hero{padding:21px 2px 16px}.menu-ship-art{flex-basis:74px;height:74px;font-size:38px}.menu-ship-art:before{width:52px}.menu-ship-art:after{width:62px}.menu-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.menu-feature{padding:11px}.menu-footer{align-items:flex-start;flex-direction:column}.menu-hero h2{font-size:37px}.menu-hero p{font-size:10px}}

/* Update 0.0.6 — clan settings, colors, access and member capacity */
.clan-settings{margin-top:22px;padding:18px;border:1px solid rgba(92,229,239,.2);border-radius:13px;background:linear-gradient(145deg,rgba(11,39,58,.8),rgba(4,18,32,.85));box-shadow:inset 0 1px rgba(255,255,255,.025)}
.clan-section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.clan-section-heading .eyebrow{font-size:8px;letter-spacing:1.8px}.clan-section-heading h2{margin:3px 0 0;font:900 25px/1 'Barlow Condensed',sans-serif;letter-spacing:.5px;color:#f0fbff}.clan-section-heading h2 span{color:var(--cyan)}.settings-chip{font-size:7px;letter-spacing:1px;font-weight:900;color:#75e7bc;border:1px solid rgba(117,231,188,.25);padding:6px 8px;border-radius:5px;white-space:nowrap}
.clan-color-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid rgba(130,201,221,.16);border-radius:9px;background:rgba(3,16,28,.5)}.clan-color-row input[type=color]{flex:0 0 44px;width:44px;height:38px;padding:3px;border:1px solid rgba(130,201,221,.3);border-radius:7px;background:#071b2b;cursor:pointer}.clan-color-row>div{display:flex;flex-direction:column;gap:4px}.clan-color-row b{font-size:12px;color:#e7fbff;letter-spacing:1px}.clan-color-row small{font-size:9px;color:#83a6ba}.clan-card select{width:100%;padding:12px;border-radius:8px;border:1px solid rgba(130,201,221,.24);outline:none;background:#071b2b;color:#eafaff;font:inherit;font-size:12px}.clan-card input:disabled,.clan-card select:disabled{opacity:.58}.clan-settings .secondary-button{margin-top:12px}.clan-settings button:disabled{opacity:.45;cursor:not-allowed}
.clan-slots{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding:13px;border:1px solid rgba(92,229,239,.15);border-radius:9px;background:rgba(92,229,239,.035)}.clan-slots>div{display:flex;flex-direction:column;gap:5px}.clan-slots small{font-size:8px;letter-spacing:1px;color:#81a6b9;font-weight:900}.clan-slots strong{font-size:15px;color:#edfcff}.clan-slots span{font-size:9px;color:#799caf}.slot-buy-button{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;min-width:100px;padding:10px;border-radius:8px;border:1px solid rgba(92,229,239,.32);background:rgba(92,229,239,.09);color:#bafaff;font-size:9px;font-weight:900;letter-spacing:.5px}.slot-buy-button b{font-size:8px;color:#7fa7bb}.clan-members-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:18px 0 9px;color:#8daec0;font-size:8px;letter-spacing:1.3px;font-weight:900}.clan-members-head span:last-child{color:#64e5c0}.clan-invite-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.clan-card .clan-invite-row input{min-width:0}.clan-invite-row .secondary-button{width:auto;min-width:82px;margin:0;padding:10px 13px}.clan-members-list{max-height:170px;overflow:auto;margin-top:10px}.clan-member-row{display:flex;align-items:center;gap:10px;padding:9px 3px;border-bottom:1px solid rgba(155,205,235,.09)}.member-avatar{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:linear-gradient(145deg,#1b697a,#102b41);border:1px solid rgba(92,229,239,.24);color:#c4fbff;font-size:12px;font-weight:900}.member-name{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}.member-name b{font-size:10px;overflow:hidden;text-overflow:ellipsis}.member-name small{font-size:8px;color:#7398ac;letter-spacing:.8px}.member-status{font-size:7px;letter-spacing:.7px;font-weight:900;color:#67e7b3}.member-status.pending{color:#e9c77d}.clan-empty{padding:15px 8px;text-align:center;color:#789caf;font-size:10px;line-height:1.6}
@media(max-width:650px){.clan-settings{padding:13px}.clan-slots{align-items:flex-start}.slot-buy-button{min-width:88px}.clan-section-heading h2{font-size:23px}}


/* Update 0.0.7 — clan progression and fleet engineering */
.clan-profile-panel{margin:16px 0 20px;padding:17px;border:1px solid rgba(92,229,239,.2);border-radius:13px;background:radial-gradient(ellipse at 90% 0,rgba(50,158,178,.13),transparent 55%),linear-gradient(145deg,rgba(10,37,55,.82),rgba(3,17,30,.9))}
.clan-profile-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.clan-profile-head .eyebrow{font-size:8px;letter-spacing:1.7px}.clan-profile-head h2{margin:4px 0 12px;font:900 24px/1.1 'Barlow Condensed',sans-serif;color:#f0fbff}.clan-profile-head h2 span{color:var(--cyan)}.clan-level-pill{padding:7px 10px;border:1px solid rgba(92,229,239,.3);border-radius:6px;background:rgba(92,229,239,.08);font-size:8px;font-weight:900;letter-spacing:1px;color:#a6f7ff;white-space:nowrap}.clan-profile-progress{height:7px;overflow:hidden;border-radius:10px;background:#071827;border:1px solid rgba(92,229,239,.12)}.clan-profile-progress div{width:0;height:100%;border-radius:10px;background:linear-gradient(90deg,#3bb7c9,#8df7ff);box-shadow:0 0 12px rgba(92,229,239,.35);transition:width .2s}.clan-xp-caption{display:flex;justify-content:space-between;gap:10px;margin:7px 0 15px;font-size:8px;color:#83a7ba}.clan-profile-panel label{display:block;margin:11px 0 7px;font-size:9px;color:#a9c5d4;font-weight:800;letter-spacing:.4px}.clan-profile-panel select{width:100%;padding:11px;border-radius:8px;border:1px solid rgba(130,201,221,.24);background:#071b2b;color:#eafaff;font:inherit;font-size:11px}.clan-profile-panel select:disabled{opacity:.55}.clan-profile-note{margin-top:10px;color:#7599ad;font-size:9px;line-height:1.6}.clan-board-row{display:grid;grid-template-columns:24px 29px minmax(0,1fr) auto;align-items:center;gap:8px;padding:10px 2px;border-bottom:1px solid rgba(155,205,235,.08)}.clan-board-row.my-clan{background:linear-gradient(90deg,rgba(92,229,239,.1),transparent)}.clan-board-rank{font:900 12px 'Barlow Condensed',sans-serif;color:#6b92a8}.clan-board-emblem{display:grid;place-items:center;width:27px;height:27px;border-radius:7px;background:rgba(92,229,239,.08);font-size:15px}.clan-board-name{display:flex;flex-direction:column;gap:3px;min-width:0}.clan-board-name b{font-size:10px;color:#e8faff}.clan-board-name small{font-size:8px;color:#7fa1b5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.clan-board-row>strong{font-size:9px;color:#92eaf0;white-space:nowrap}.member-role-select{max-width:95px;padding:6px 5px;border-radius:6px;border:1px solid rgba(130,201,221,.2);background:#071b2b;color:#bdeef4;font-size:8px;font-weight:800}
@media(max-width:650px){.clan-board-row{grid-template-columns:18px 25px minmax(0,1fr) auto;gap:6px}.clan-board-row>strong{font-size:8px}.clan-xp-caption{font-size:7px}}

/* Update 0.0.8: free class selection */
.class-option.class-active{border-color:#7ff4ff;box-shadow:0 0 0 1px rgba(127,244,255,.22),0 0 22px rgba(92,229,239,.12)}




/* Update 0.0.9 — refreshed command center, clearer ocean controls, community and local player ID */
.main-menu-card{width:min(930px,97vw);background:radial-gradient(ellipse at 78% 10%,rgba(25,126,153,.18),transparent 38%),linear-gradient(145deg,rgba(5,28,46,.985),rgba(2,12,25,.99));border-color:rgba(108,232,244,.4);box-shadow:0 30px 110px rgba(0,0,0,.7),inset 0 1px rgba(230,255,255,.06)}
.menu-brand-mark{box-shadow:0 0 28px rgba(92,229,239,.12)}
.menu-hero{position:relative;overflow:hidden;border-top:1px solid rgba(127,226,239,.12);border-bottom:1px solid rgba(127,226,239,.12);background:linear-gradient(105deg,rgba(16,75,96,.12),transparent 68%)}
.menu-hero:after{content:"";position:absolute;right:4%;bottom:-45px;width:230px;height:100px;border-top:1px solid rgba(117,239,246,.18);border-radius:50%;transform:rotate(-12deg);pointer-events:none}
.menu-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.menu-feature{min-height:112px;padding:15px;background:linear-gradient(145deg,rgba(15,53,75,.88),rgba(4,20,35,.94));border-color:rgba(114,200,222,.2)}
.menu-feature b{font-size:10px}.menu-feature small{font-size:10px}.menu-feature:nth-child(6){border-color:rgba(92,229,239,.35);background:linear-gradient(145deg,rgba(12,72,91,.72),rgba(4,20,35,.95))}
.menu-status strong{color:#bdfaff;font-weight:900}
.zoom-control{display:flex;align-items:center;gap:5px;padding:4px 6px;border:1px solid rgba(146,209,232,.2);border-radius:8px;background:rgba(4,23,37,.8);color:#c7f7ff;font-size:9px;font-weight:900;white-space:nowrap}
.zoom-control button{display:grid;place-items:center;width:22px;height:22px;border:1px solid rgba(92,229,239,.2);border-radius:5px;background:rgba(92,229,239,.09);color:#c7faff;font-weight:900;cursor:pointer}.zoom-control button:hover{background:rgba(92,229,239,.25)}.zoom-control span{min-width:34px;text-align:center}
.community-card{width:min(480px,95vw);text-align:left}.community-card h1,.community-card>p{text-align:center}.community-banner{display:flex;align-items:center;gap:14px;margin:18px 0;padding:16px;border:1px solid rgba(92,229,239,.22);border-radius:12px;background:linear-gradient(110deg,rgba(21,92,111,.25),rgba(5,22,37,.75))}.community-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:rgba(92,229,239,.12);border:1px solid rgba(92,229,239,.25);font-size:28px;color:#b6faff}.community-banner>div:last-child{display:flex;flex-direction:column;gap:5px}.community-banner small,.community-id-panel span{font-size:8px;letter-spacing:1.4px;color:#7fa7bb;font-weight:900}.community-banner strong{font:900 22px 'Barlow Condensed',sans-serif;color:#edfcff}.community-banner span{font-size:10px;color:#8eafc1}.community-join{text-decoration:none;box-sizing:border-box;margin:0 0 14px}.community-id-panel{display:flex;flex-direction:column;gap:7px;padding:13px 15px;margin:15px 0;border:1px solid rgba(92,229,239,.13);border-radius:9px;background:rgba(92,229,239,.045)}.community-id-panel strong{font:900 22px 'Barlow Condensed',sans-serif;color:#b7fbff}.community-id-panel small{font-size:9px;line-height:1.55;color:#789bad}.community-card .secondary-button{width:100%}
@media(max-width:850px){.topbar{gap:10px}.top-actions{gap:4px}.nav-button{padding:8px 7px;font-size:8px}.zoom-control{gap:3px;padding:3px}.zoom-control button{width:19px;height:19px}}
@media(max-width:650px){.menu-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.menu-feature{min-height:102px}.zoom-control{display:none}}



/* Update 0.1.7 — online account and owner control panel */
.account-feature{border-color:rgba(105,193,255,.42);background:linear-gradient(145deg,rgba(17,54,83,.9),rgba(4,20,35,.96))}
.account-feature .feature-icon{background:rgba(94,172,255,.15)}
.account-card{width:min(760px,96vw);max-height:92vh;overflow:auto;text-align:left}
.account-card h1,.account-card>.account-intro{text-align:center}
.account-card h1 span,.account-card h2 span{color:var(--cyan)}
.account-intro{max-width:560px;margin:0 auto 15px;color:#8eafc1;font-size:11px;line-height:1.65}
.account-notice{padding:11px 12px;margin:12px 0 16px;border:1px solid rgba(92,229,239,.22);border-radius:8px;background:rgba(92,229,239,.06);color:#c5f8ff;font-size:10px;line-height:1.55;overflow-wrap:anywhere}
.account-notice.error{border-color:rgba(255,112,112,.35);background:rgba(255,70,70,.07);color:#ffb9b9}.account-notice.success{border-color:rgba(95,232,171,.35);background:rgba(95,232,171,.07);color:#a8f7cf}
.account-section{margin-top:12px;padding:16px;border:1px solid rgba(129,197,220,.16);border-radius:12px;background:rgba(4,20,34,.58)}
.account-section h2{margin:0 0 12px;font:900 22px/1.1 'Barlow Condensed',sans-serif;color:#effbff}
.account-card label{display:block;margin:12px 0 6px;color:#9bb9ca;font-size:9px;font-weight:900;letter-spacing:.8px;text-transform:uppercase}
.account-card input,.account-card select{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid rgba(130,201,221,.23);border-radius:8px;background:#071b2b;color:#e7faff;font:600 11px Inter,sans-serif;outline:none}
.account-card input:focus,.account-card select:focus{border-color:#5ce5ef;box-shadow:0 0 0 2px rgba(92,229,239,.1)}
.account-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}.account-actions button{width:100%;justify-content:center;margin:0}
.account-divider{height:1px;background:rgba(155,205,235,.13);margin:18px 0}
.account-help{font-size:10px;color:#7fa1b5;line-height:1.65;margin:9px 0}
.account-profile-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.account-profile-head>div{display:flex;flex-direction:column;gap:5px;min-width:0}.account-profile-head strong{font:900 24px 'Barlow Condensed',sans-serif;color:#effbff;overflow-wrap:anywhere}.account-profile-head h2{margin:0}.account-role-pill{padding:6px 9px;border:1px solid rgba(92,229,239,.25);border-radius:6px;background:rgba(92,229,239,.08);color:#a8f7ff;font-size:8px;font-weight:900;letter-spacing:1px;white-space:nowrap}.owner-pill{border-color:rgba(240,197,94,.36);background:rgba(240,197,94,.08);color:#f4d98b}
.account-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:16px 0}.account-metrics>div{display:flex;flex-direction:column;gap:7px;padding:13px 11px;border:1px solid rgba(129,197,220,.15);border-radius:9px;background:rgba(6,30,47,.65);min-width:0}.account-metrics small{font-size:8px;letter-spacing:.7px;color:#7598ad}.account-metrics strong{font:900 24px 'Barlow Condensed',sans-serif;color:#b7fbff;overflow-wrap:anywhere}
.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.admin-form-grid>div{padding:12px;border:1px solid rgba(129,197,220,.14);border-radius:9px;background:rgba(6,30,47,.5);min-width:0}.admin-form-grid button{width:100%;justify-content:center;margin-top:8px}.subtle-button{padding:9px 10px;font-size:9px}
.account-list-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px}.account-list-head h3{font:900 17px 'Barlow Condensed',sans-serif;margin:0;color:#eafaff}.account-list-head button{padding:8px 10px;font-size:8px}
.admin-audit-list{padding-left:22px;margin:12px 0 0;color:#9fc0d1;font-size:9px;line-height:1.7}.admin-audit-list li{padding:7px 3px;border-bottom:1px solid rgba(155,205,235,.08);overflow-wrap:anywhere}.account-close{width:100%;margin-top:14px}
@media(max-width:650px){.account-card{padding:20px 14px}.account-actions,.admin-form-grid{grid-template-columns:1fr}.account-metrics{gap:5px}.account-metrics>div{padding:10px 7px}.account-metrics small{font-size:7px}.account-metrics strong{font-size:20px}.account-profile-head strong{font-size:21px}}