:root{--bg:#0c1117;--panel:#151c24;--muted:#9ba4ac;--cream:#efece4;--red:#e34538;--gold:#d9b36b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--cream);font-family:"Microsoft YaHei",sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}header{min-height:96px;padding:20px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;gap:20px}.brand{display:flex;gap:12px;align-items:center;font-size:20px;letter-spacing:3px;font-weight:800}.brand b{display:block;font-size:9px;letter-spacing:2px;margin-top:7px;color:var(--muted)}.emblem{font-size:36px;color:var(--gold)}nav{display:flex;gap:22px}nav button{min-height:44px;border:0;background:none;color:var(--muted);font-size:13px;position:relative}nav button.active{color:var(--cream)}nav button.active:after{content:"";position:absolute;bottom:-26px;left:15%;right:15%;height:3px;background:var(--red)}.version{color:#87909a;font-size:11px;border:1px solid #ffffff20;padding:8px 12px}main{max-width:1600px;margin:auto;padding:44px 5% 20px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--gold);display:flex;align-items:center;gap:9px}.eyebrow>span{height:6px;width:6px;border-radius:50%;background:var(--red)}.arena-layout{display:grid;grid-template-columns:0.9fr 1.2fr;gap:5%;align-items:center;min-height:485px}.kicker{letter-spacing:5px;color:var(--muted);font-size:12px;margin-top:36px}h1{font-size:clamp(44px,4.6vw,72px);line-height:1.22;letter-spacing:1px;margin:20px 0}h1 span{color:var(--red)}.lead{font-size:14px;line-height:2;color:var(--muted);max-width:700px}.actions{display:flex;gap:14px;margin-top:28px}.primary,.secondary{height:52px;padding:0 26px;border:0;font-size:13px;font-weight:700}.primary{background:var(--red);color:white;min-width:180px;text-align:left}.primary span{float:right;margin-left:30px}.secondary{border:1px solid #ffffff30;background:transparent;color:var(--cream)}.primary:hover{background:#f45446}.secondary:hover{border-color:var(--gold)}.stats{display:flex;gap:30px;margin-top:36px}.stats>div{display:flex;flex-direction:column;gap:8px}.stats strong{font-family:Impact,"Arial Narrow",sans-serif;font-size:26px;letter-spacing:1px}.stats strong span{font-size:15px}.stats>div>span{font-size:10px;color:#89939e}.matchup{position:relative;margin-top:24px}.arena-label,.match-bottom{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:var(--muted);padding:16px 0}.arena-label{border-bottom:1px solid #ffffff20}.arena-label span{color:var(--gold)}.fighters{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative;padding-top:15px}.fighter{height:355px;position:relative;background:#222;overflow:hidden;transform:skewY(-2deg)}.fighter img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.65);opacity:.85}.fighter:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 20%,#12182140 45%,#121821 100%);border-bottom:3px solid var(--red)}.fighter.gold:after{border-color:var(--gold)}.fighter-info{position:absolute;bottom:22px;left:22px;z-index:1;transform:skewY(2deg)}.fighter-info span{font-size:9px;letter-spacing:2px;color:var(--gold)}.fighter-info h2{font-size:25px;margin:12px 0}.fighter-info p{font-size:11px;color:#b2bbc4}.vs{position:absolute;z-index:2;left:50%;top:44%;transform:translateX(-50%) rotate(-8deg);font:italic 54px Impact,sans-serif;color:var(--gold);text-shadow:3px 3px #0c1117}.match-bottom{border-bottom:1px solid #ffffff20;padding-top:22px;font-size:10px;letter-spacing:0}.below{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;margin-top:34px;padding:25px 0;gap:22px}.below>div{display:flex;gap:18px}.number{font-size:12px;color:var(--gold);padding-top:4px}h3{font-size:14px;margin:0 0 8px}.below p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.draft-note{font-size:11px;color:#89939e;line-height:1.9;margin:22px 0}.page-title{font-size:44px;margin:28px 0}.card-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin:30px 0;min-height:420px}.character{background:var(--panel);border:1px solid #ffffff12;padding:0;color:var(--cream);text-align:left;min-width:0}.character:hover{border-color:var(--gold)}.character img,.placeholder{width:100%;height:180px;object-fit:cover;display:block}.placeholder{display:grid;place-items:center;background:repeating-linear-gradient(135deg,#1a2430,#1a2430 10px,#1d2936 10px,#1d2936 11px);font-size:42px;color:#647488}.character .card-body{padding:18px}.character h2{font-size:17px;margin:0 0 7px}.character p{font-size:11px;color:var(--muted);margin:0}.world-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px}.world-grid article{background:var(--panel);border-top:2px solid var(--gold);padding:30px;min-height:240px}.world-grid span{font-size:10px;color:var(--gold);letter-spacing:2px}.world-grid h2{font-size:24px;margin:35px 0 16px}.world-grid p{font-size:12px;color:var(--muted);line-height:2}.source{font-size:12px;color:var(--gold)}footer{padding:23px 5%;border-top:1px solid #ffffff12;display:flex;justify-content:space-between;gap:14px;color:#89939e;font-size:10px}dialog{background:var(--panel);color:var(--cream);border:1px solid #ffffff30;padding:36px;max-width:560px;width:calc(100% - 32px)}dialog::backdrop{background:#000c}dialog h2{font-size:28px}dialog p,dialog li{color:#b0bac4;font-size:14px;line-height:2}dialog a{color:var(--gold)}.close{position:absolute;right:10px;top:8px;background:none;border:none;color:white;font-size:30px;min-width:44px;min-height:44px}#game-dialog{padding:0;max-width:none;width:96vw;height:94dvh;max-height:94dvh;overflow:hidden}#game-dialog[open]{display:flex;flex-direction:column}.game-toolbar{padding:8px 16px;display:flex;align-items:center;justify-content:space-between;font-size:12px;height:60px;flex-shrink:0;border-bottom:1px solid #ffffff25}.game-toolbar button{background:transparent;color:white;border:1px solid #ffffff30;padding:10px;min-height:44px}iframe{width:100%;flex:1;border:0;min-height:0}[hidden]{display:none!important}@media(min-width:1600px){.arena-layout{min-height:550px}.fighter{height:420px}}@media(max-width:1000px){header{flex-wrap:wrap}.version{display:none}nav{gap:10px}nav button.active:after{bottom:-8px}.arena-layout{gap:25px;grid-template-columns:1fr 1fr}h1{font-size:48px}.fighter{height:310px}.fighter-info{left:12px}.fighter-info h2{font-size:20px}.card-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){header{padding:14px 5%;gap:10px}.brand{font-size:17px}.emblem{font-size:28px}nav{width:100%;justify-content:space-between;gap:0}nav button{font-size:11px;padding:0 5px}main{padding-top:28px}.arena-layout{grid-template-columns:1fr;gap:18px}.kicker{margin-top:25px}h1{font-size:46px}.lead{font-size:13px}.stats{gap:28px}.matchup{margin-top:0}.fighter{height:280px}.fighter-info h2{font-size:21px}.match-bottom{gap:10px;font-size:9px}.below{grid-template-columns:1fr;margin-top:25px;gap:25px}.below p{font-size:12px}.card-grid{grid-template-columns:repeat(2,1fr);gap:12px}.character img,.placeholder{height:150px}.character .card-body{padding:14px}.world-grid{grid-template-columns:1fr}.world-grid article{min-height:180px}.world-grid h2{margin-top:25px}.page-title{font-size:36px}footer{flex-wrap:wrap;line-height:1.7}.game-toolbar{font-size:10px;padding:6px 8px}.game-toolbar button{font-size:11px}.draft-note{font-size:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

.fighter img{object-fit:contain;background:linear-gradient(145deg,#223b53,#122135)}.character img{object-fit:contain;background:linear-gradient(145deg,#263c50,#122035)}

.study-section{margin-top:48px;padding-top:28px;border-top:1px solid #334250}.study-section h2{font-size:clamp(24px,3vw,36px);margin:12px 0}.study-section>p{color:#b3bfcb;max-width:800px;line-height:1.8}.study-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}.study-grid article{border:1px solid #344857;border-radius:10px;background:linear-gradient(135deg,#182c3a,#102030);padding:24px}.study-grid article>span{color:#e3bd78;font-size:11px;letter-spacing:2px}.study-grid h3{font-size:20px;margin:15px 0}.study-grid p{font-size:14px;line-height:1.9;color:#b6c5cf}.study-grid button{background:none;border:0;border-bottom:1px solid #b59763;color:#f0d395;padding:10px 0;font:inherit;cursor:pointer;min-height:44px}@media(max-width:800px){.study-grid{grid-template-columns:1fr}.study-section{margin-top:30px}.study-grid article{padding:20px}}

.archive-skills{display:grid;grid-template-columns:1fr 1fr;gap:12px}.archive-skills p{background:#162a3c;padding:12px;border-radius:6px;font-size:12px;line-height:1.8}.archive-skills b{color:#e8c682}@media(max-width:550px){.archive-skills{grid-template-columns:1fr}}

.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:30px 0}.guide-grid article{padding:24px;background:#142131;border:1px solid #ffffff20}.guide-grid article>span{font-size:10px;letter-spacing:2px;color:#e2bc70}.guide-grid h2{font-size:19px;margin:14px 0}.guide-grid p{font-size:12px;line-height:2;color:#b1c0d0}.guide-grid button{background:transparent;border:1px solid #7c93ab55;color:#e4c992;min-height:44px;padding:10px;font:inherit;font-size:11px}.guide-start{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.guide-start p{color:#a7bacb;font-size:12px;line-height:1.9}kbd{border:1px solid #ffffff30;padding:2px 5px;font:inherit;font-size:11px;color:#e3c78f}.text-rule{border:0;background:none;color:#bfd0de;min-height:44px;cursor:pointer}nav{flex-wrap:wrap}.actions{flex-wrap:wrap}@media(max-width:1000px){.guide-grid{grid-template-columns:1fr 1fr}}@media(max-width:650px){.guide-grid{grid-template-columns:1fr}.guide-grid article{padding:20px}.guide-start .primary,.guide-start .secondary{flex:1;font-size:12px}.guide-start p{margin:0}header nav button{font-size:10px;padding:8px}}

.power-guide{border:1px solid #41617b;padding:22px;margin:25px 0;background:#122332}.power-guide p{color:#adc2ce;line-height:1.8}.fight-tools [hidden]{display:none!important}

/* V08 visual hierarchy: horizon, nautical details and distinct mode entry cards. */
body{background:radial-gradient(ellipse at 95% 10%,#1b354339,transparent 46%),#0b1219}header{background:#0b131de6;backdrop-filter:blur(12px)}.arena-layout{position:relative;padding-block:20px}.arena-layout:before{content:'';position:absolute;inset:0 -3%;background:linear-gradient(90deg,#0b1219 10%,#0b1219d0 45%,#0b121966),url('assets/harbor.webp') center/cover;opacity:.16;pointer-events:none;border-radius:20px}.intro,.matchup{position:relative}.intro h1{font-size:clamp(46px,5.2vw,78px)}.fighter{border:1px solid #91b5c333;border-radius:12px;background:radial-gradient(ellipse at 50% 10%,#31566a,#152332)}.fighter img{filter:saturate(.96);opacity:1;object-fit:contain;object-position:center top}.fighter:after{background:linear-gradient(transparent 42%,#101d2966 68%,#101d29 100%)}.fighter-info{bottom:25px}.fighters{gap:20px}.vs{font-size:62px;text-shadow:2px 3px 15px #071017}.arena-label{color:#b1c6d3}.mode-gallery{margin-top:40px;padding:25px 0;border-top:1px solid #5b788733}.mode-gallery h2{font-size:26px}.mode-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.mode-cards button{position:relative;display:grid;gap:15px;text-align:left;border:1px solid #53738866;border-top:3px solid #d1b06a;background:linear-gradient(130deg,#1c3444,#111e2b);color:#f0e8d7;padding:24px;min-height:195px;border-radius:8px;transition:transform .15s,border-color .15s}.mode-cards button:hover{transform:translateY(-3px);border-color:#d6ba77}.mode-cards small{color:#d6ba77;letter-spacing:2px;font-size:10px}.mode-cards b{font-size:23px}.mode-cards span{font-size:12px;color:#b1c6d3;line-height:1.8}.mode-cards i{font-size:12px;color:#eab478;font-style:normal}.world-hero{padding:28px 35px;border:1px solid #58849a33;border-radius:16px;background:linear-gradient(90deg,#142939f0,#172e4099),url('assets/harbor.webp') center/cover}.sea-chart{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:center;margin:30px 0;padding:25px;background:#101e2a;border:1px solid #536f8144;border-radius:12px}.sea-chart svg{width:100%;height:auto}.sea-chart small{letter-spacing:3px;color:#d4b371}.sea-chart p{color:#acc3ce;line-height:1.9;font-size:13px}.sea-chart .chart-note{color:#d1b779;font-size:11px}.world-grid{gap:18px;margin-top:26px}.world-grid article{border-radius:10px;background:linear-gradient(140deg,#1b3040,#131f2c);border:1px solid #54708444;border-top:3px solid #d3ae68;padding:28px}.world-grid h2{font-size:24px;margin:28px 0 18px}.world-grid p{font-size:13px;line-height:1.9}.world-grid button{background:transparent;border:1px solid #869ba955;border-radius:5px;color:#e4c98e;padding:10px;font-size:12px;min-height:44px}.power-guide{border-radius:12px}.power-guide h3{color:#e9c987}.power-guide p{font-size:13px}#skill-facts .power-card{grid-column:1/-1}
@media(max-width:1000px){.mode-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.sea-chart{grid-template-columns:1fr;gap:15px}.world-hero{padding:25px}}@media(max-width:650px){.mode-cards{grid-template-columns:1fr}.mode-cards button{min-height:155px}.mode-gallery h2{font-size:23px}.sea-chart{padding:18px}.world-hero{padding:22px}.world-grid article{padding:22px}.fighter{border-radius:6px}.fighters{gap:10px}.fighter-info{left:12px}.power-guide{padding:18px}}
@media(prefers-reduced-motion:reduce){.mode-cards button{transition:none}.mode-cards button:hover{transform:none}}

.ability-index{margin:25px 0;border:1px solid #526e8155;border-radius:8px;padding:18px;background:#102130}.ability-index summary{cursor:pointer;color:#e7c98a;min-height:30px;font-size:15px}#ability-table{overflow:auto}#ability-table table{width:100%;border-collapse:collapse;margin-top:15px;text-align:left;font-size:12px;min-width:660px}#ability-table th,#ability-table td{padding:12px;border-bottom:1px solid #54718144;line-height:1.8}#ability-table th{color:#e6c995}#ability-table td{color:#b9cdd8}#ability-table td a{color:#efcca0}#ability-table p{font-size:12px;color:#aec3d0}

#view-back{margin:20px 4.4% 0;min-height:44px}#info>.close{position:sticky;top:0;width:auto;min-height:44px;background:#192b39;font-size:14px}

.rank-badge{position:absolute;right:9px;top:9px;z-index:2;display:grid;place-items:center;min-width:32px;height:32px;padding:0 6px;background:#192b38;border:1px solid #8aabbc;border-radius:6px;color:#d7e9f5;font:bold 23px Georgia,serif;box-shadow:0 3px 10px #0005}.rank-S{background:#513c20;color:#ffda80;border-color:#e9bb58}.rank-A{background:#283d57;color:#bfe0ff}.rank-B{background:#283c37;color:#b7d8c7}.character,.roster-card{position:relative}

.share-entry{background:#152532;border:1px solid #496579;color:#e5cf91;padding:10px 15px;cursor:pointer;min-height:44px;white-space:nowrap}#info .dialog-actions{display:flex;gap:10px;flex-wrap:wrap}#info button:disabled{opacity:.45;cursor:default}#info details{line-height:1.85;margin-top:18px}#share-status{min-height:24px;color:#b9e3c6}#info .primary,#info .quiet{padding:12px 16px;border:1px solid #587182;background:#233b4b;color:#fff;cursor:pointer}@media(max-width:650px){header .version{display:none}.share-entry{padding:8px}}

.entry-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:32px}.entry-path a{padding:18px 20px;background:#16212b;border:1px solid #394a58;text-decoration:none;color:#efd0a0;min-height:78px}.entry-path b,.entry-path span{display:block}.entry-path span{color:#a3b6c7;font-size:12px;margin-top:7px}.entry-path a:hover{border-color:#c19b63}.guide-start{flex-wrap:wrap}.guide-start a{min-height:44px;text-decoration:none}@media(max-width:700px){.entry-path{grid-template-columns:1fr;gap:8px}.entry-path a{padding:13px 16px;min-height:65px}}

/* Visual polish preserves navigation and combat structure. */
.arena-layout{min-height:460px}.intro .kicker{margin-top:12px}.intro h1{letter-spacing:-1px}.lead{color:#b3c3cf}.fighter{box-shadow:0 16px 40px #0004}.entry-path{margin-top:28px}.entry-path a{border-radius:10px;transition:border-color .15s,background .15s}.entry-path a:hover{border-color:#d9b36b;background:#1b3040}.mode-cards button{min-height:170px;gap:10px}.study-section{margin-top:25px}.study-grid p{font-size:13px;line-height:1.8}.guide-grid article{border-radius:10px;background:linear-gradient(135deg,#172838,#101d29);padding:22px}.guide-grid details{border-top:1px solid #ffffff16;margin-top:15px;padding-top:12px}.guide-grid summary,.advanced-rules>summary{color:#e2c286;cursor:pointer;font-size:13px;min-height:30px}.advanced-rules>summary{font-size:18px;font-weight:bold}.advanced-rules p{color:#acc0cf;font-size:13px;line-height:1.9}.guide-grid article>p{font-size:13px;line-height:1.85}.view>.guide-block:last-of-type{border-radius:10px}.page-title{line-height:1.25}@media(max-width:650px){.arena-layout{min-height:0}.mode-cards{grid-template-columns:1fr 1fr}.mode-cards button{padding:15px;min-height:160px}.mode-cards b{font-size:19px}.mode-cards span{font-size:11px}.mode-gallery h2{font-size:21px}.guide-grid article{padding:18px}}@media(max-width:380px){.mode-cards{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.entry-path a{transition:none}}

.rating-reference{color:#b9c8d3;font-size:12px;line-height:1.7;margin:12px 0;}

.rank-SS{color:#f6d596;background:#53365c;border:1px solid #e7b5ec;font-size:14px;}

.power-guide summary{cursor:pointer;font-size:18px;color:#e7bd77;font-weight:700;min-height:40px;}.power-guide details>p{font-size:13px;line-height:1.9;}
