:root{color-scheme:dark;--bg:#080b12;--panel:#101b2e;--line:#2c94bd;--cyan:#7de2ff;--pink:#ff7aa8;--text:#f4fbff;--muted:#b8c8d5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 50% 0,#172746 0,#080b12 48rem);color:var(--text);font:16px/1.75 system-ui,-apple-system,"Segoe UI",sans-serif}a{color:var(--cyan)}img{display:block;max-width:100%;height:auto}.wrap{width:min(1060px,calc(100% - 32px));margin:auto}.site-header{position:sticky;top:0;z-index:5;border-bottom:1px solid #2c94bd88;background:#080b12ed;backdrop-filter:blur(10px)}.header-row{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}.brand{color:#fff;font-weight:900;text-decoration:none}.nav{display:flex;align-items:center;gap:16px}.nav a{text-decoration:none}.hero{padding:72px 0 36px;text-align:center}.eyebrow{margin:0;color:var(--cyan);font-weight:800;letter-spacing:.08em}.hero h1{max-width:850px;margin:12px auto 16px;font-size:clamp(2rem,7vw,4.5rem);line-height:1.12}.lead{max-width:760px;margin:0 auto;color:var(--muted);font-size:clamp(1.05rem,3vw,1.3rem)}.actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:28px}.button{display:inline-block;padding:13px 22px;border:1px solid var(--cyan);border-radius:10px;background:#16304c;color:#fff;font-weight:800;text-decoration:none;box-shadow:0 0 24px #4ecfff28}.button.secondary{border-color:#ff7aa8;background:#381a31}.hero-image{margin:38px auto 0;border:1px solid #4ecfff66;border-radius:18px;box-shadow:0 18px 55px #000a}.section{padding:54px 0}.section h2{margin:0 0 18px;font-size:clamp(1.6rem,4vw,2.4rem)}.section-intro{max-width:780px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{padding:22px;border:1px solid #2c94bd66;border-radius:14px;background:#101b2ed9}.card h3{margin-top:0;color:var(--cyan)}.steps{padding-left:1.4rem}.steps li+li{margin-top:12px}.controls{width:100%;border-collapse:collapse;overflow:hidden;border-radius:12px;background:var(--panel)}.controls th,.controls td{padding:12px 14px;border:1px solid #2c94bd55;text-align:left}.controls th{color:var(--cyan)}.media-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.media-grid figure{margin:0;padding:10px;border:1px solid #2c94bd55;border-radius:14px;background:var(--panel)}.media-grid img{border-radius:9px}.media-grid figcaption{padding:10px 4px 2px;color:var(--muted)}details{margin:12px 0;padding:16px 18px;border:1px solid #2c94bd55;border-radius:12px;background:var(--panel)}summary{cursor:pointer;font-weight:800}.cta{margin:40px auto 64px;padding:34px;border:1px solid var(--pink);border-radius:18px;background:linear-gradient(135deg,#172846,#36192f);text-align:center}.site-footer{padding:28px 0;border-top:1px solid #2c94bd55;color:var(--muted);text-align:center}@media(max-width:760px){.header-row{align-items:flex-start;padding:12px 0}.nav{align-items:flex-end;flex-direction:column;gap:4px}.hero{padding-top:48px}.grid,.media-grid{grid-template-columns:1fr}.section{padding:38px 0}.controls{font-size:.9rem}.controls th,.controls td{padding:9px}.cta{padding:24px 16px}}
.guide-updated{color:var(--muted);font-size:.9rem;margin:16px 0 0}
.quick-links{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:24px auto 0;max-width:850px}
.quick-links a{padding:6px 12px;border:1px solid #2c94bd66;border-radius:8px;background:var(--panel);text-decoration:none}
.guide-note{padding:16px 20px;border-left:3px solid var(--cyan);border-radius:0 10px 10px 0;background:#101b2eb3;color:var(--muted)}
.card{min-width:0;overflow-wrap:anywhere}
.card p:last-child{margin-bottom:0}
.section{scroll-margin-top:84px}
.table-scroll{max-width:100%;overflow-x:auto;border-radius:12px}
.table-hint{color:var(--muted);font-size:.9rem}
.table-scroll:focus-visible,.quick-links a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.challenge-table{min-width:560px}
.controls caption{padding:10px 14px;color:var(--muted);text-align:left;background:#101b2e}
.challenge-table th[scope=row]{width:25%;white-space:nowrap}
.challenge-table td:nth-child(2){white-space:nowrap}
.reward-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
details li+li{margin-top:10px}
@media(max-width:760px){.section{scroll-margin-top:160px}.reward-grid{grid-template-columns:1fr}.quick-links a{font-size:.9rem;padding:6px 10px}.guide-note{padding:14px 16px}}
.skip-link{position:fixed;top:8px;left:8px;z-index:10;padding:10px 16px;background:var(--text);color:var(--bg);transform:translateY(-160%)}
.skip-link:focus{transform:none}
.breadcrumbs{padding-top:20px;color:var(--muted);font-size:.9rem}
.breadcrumbs+ .hero{padding-top:40px}
.character-links{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 24px}
.character-links a{padding:7px 13px;border:1px solid #2c94bd66;border-radius:999px;background:var(--panel);text-decoration:none}
.skill-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.skill-card{scroll-margin-top:90px}
.skill-card .rarity{margin:0 0 5px;color:var(--muted);font-size:.85rem}
.skill-card h3{margin:0 0 16px;font-size:1.4rem}
.character-image{width:152px;height:152px;object-fit:contain;margin:0 auto 18px;border-radius:14px;background:radial-gradient(circle,#1a3553 0,transparent 72%)}
.character-forms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:18px}
.character-forms figure{min-width:0;margin:0;text-align:center}
.character-forms .character-image{display:block;width:min(100%,152px);height:auto;aspect-ratio:1;margin:0 auto 8px}
.character-forms figcaption{color:var(--cyan);font-weight:700}
.character-form-note{color:var(--muted);font-size:.95rem}
.skill-card dl{margin:0}
.skill-card dt{margin-top:15px;color:#fff;font-weight:750}
.skill-card dd{margin:4px 0 0;color:var(--muted)}
a:focus-visible,summary:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}
@media(max-width:760px){.skill-grid{grid-template-columns:1fr}.skill-card{scroll-margin-top:160px}.character-image{width:136px;height:136px}.breadcrumbs+ .hero{padding-top:28px}.character-links a{font-size:.95rem}}
@media(max-height:480px) and (min-width:480px){.header-row{align-items:center;min-height:56px;padding:8px 0}.nav{flex-direction:row;align-items:center;gap:10px}.nav .button{padding:8px 12px}.section,.skill-card{scroll-margin-top:80px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.route-card{display:flex;flex-direction:column;align-items:flex-start}
.route-card h3{margin:8px 0}
.route-card .eyebrow{font-size:.8rem}
.route-card .ui-path{width:100%;margin:8px 0;padding:12px;border:1px solid #2c94bd66;border-radius:10px;background:#08111fcc;color:#f4fbff;font-weight:700;font-size:.95rem}
.route-card .button{margin-top:auto}
.online-steps li{padding:10px 8px 10px 6px}
.online-steps strong{display:block;color:var(--cyan)}
.ex-table{min-width:520px}
.ex-table th[scope=row]{white-space:nowrap}