:root{--navy:#0b2239;--blue:#123b5d;--teal:#21a6a1;--aqua:#93e1d8;--coral:#ff6b5e;--yellow:#ffc857;--cream:#f7f4ec;--ink:#142735;--muted:#5d6c78;--paper:#fffdf7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--cream)}a{color:inherit}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:28px;padding:14px clamp(18px,5vw,72px);background:rgba(247,244,236,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(11,34,57,.1)}.brand{display:flex;align-items:center;gap:10px;font-weight:850;text-decoration:none;margin-right:auto}.compass{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--yellow);color:var(--navy);font-size:22px}.topbar nav{display:flex;gap:22px}.topbar nav a{text-decoration:none;font-size:.92rem;font-weight:700;color:var(--muted)}.topbar nav a:hover{color:var(--teal)}.progress-button{border:0;border-radius:999px;background:var(--navy);color:white;padding:10px 15px;font-weight:750}.hero{min-height:650px;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:36px;padding:70px clamp(24px,6vw,96px);background:linear-gradient(135deg,var(--navy) 0 55%,#164966 55% 100%);color:white;overflow:hidden}.eyebrow{margin:0 0 12px;color:var(--teal);font-weight:900;letter-spacing:.12em;font-size:.78rem}.hero .eyebrow{color:var(--aqua)}h1{font-size:clamp(3rem,6vw,6.5rem);line-height:.92;letter-spacing:-.055em;max-width:800px;margin:0 0 28px}.lead{max-width:720px;font-size:clamp(1.08rem,1.8vw,1.38rem);line-height:1.55;color:#d9eef0}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:14px 22px;font-weight:850;text-decoration:none;font-size:1rem}.primary{background:var(--yellow);color:var(--navy)}.secondary{border:1px solid rgba(255,255,255,.35);background:transparent;color:white}.hero-map{position:relative;min-height:500px}.route-line{position:absolute;inset:75px 80px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 400'%3E%3Cpath d='M45 80 C180 15 215 180 355 95 S455 210 350 285 S180 360 80 285' fill='none' stroke='%2393e1d8' stroke-width='6' stroke-dasharray='13 15' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}.port{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:.86rem}.port span{display:grid;place-items:center;width:92px;height:92px;border-radius:45% 55% 48% 52%;background:var(--paper);box-shadow:0 10px 0 rgba(0,0,0,.12);font-size:42px}.port-a{left:3%;top:8%}.port-b{right:8%;top:8%}.port-c{left:16%;bottom:8%}.port-d{right:4%;bottom:5%}.status-strip{display:grid;grid-template-columns:repeat(4,1fr);background:var(--yellow);padding:24px clamp(24px,7vw,110px);gap:24px}.status-strip div{display:flex;align-items:baseline;gap:10px;justify-content:center}.status-strip strong{font-size:2rem}.status-strip span{font-weight:750}.map-section,.materials-section,.evaluation-section{padding:90px clamp(24px,6vw,96px)}.section-heading{max-width:780px;margin-bottom:44px}.section-heading h2,.project-copy h2{font-size:clamp(2.2rem,4vw,4.2rem);line-height:1;letter-spacing:-.045em;margin:0 0 18px;color:var(--navy)}.section-heading>p:last-child,.project-copy>p:last-child{color:var(--muted);font-size:1.08rem;line-height:1.6}.islands{display:grid;gap:38px}.island{--island-color:var(--teal);position:relative;padding:30px;border-radius:30px;background:var(--paper);box-shadow:0 16px 45px rgba(11,34,57,.08);border-top:8px solid var(--island-color)}.island-head{display:flex;align-items:flex-start;gap:18px;margin-bottom:24px}.island-icon{font-size:2.4rem}.island h3{margin:0;color:var(--navy);font-size:1.7rem}.island-meta{color:var(--muted);margin-top:5px}.missions{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}.mission{position:relative;text-align:left;border:2px solid rgba(11,34,57,.1);border-radius:22px;background:#fff;padding:20px;min-height:155px;cursor:pointer;transition:.2s}.mission:hover,.mission:focus-visible{transform:translateY(-3px);border-color:var(--island-color);box-shadow:0 12px 24px rgba(11,34,57,.1)}.coin{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--yellow);border:4px solid #eba928;box-shadow:inset 0 0 0 2px #ffe385;color:var(--navy);font-weight:950;margin-bottom:16px}.mission b{display:block;font-size:1.04rem;color:var(--navy)}.mission small{display:block;margin-top:8px;color:var(--muted);line-height:1.4}.mission.done{background:#edf9f7;border-color:var(--teal)}.mission.done .coin{background:var(--teal);border-color:#15847f;color:white}.project-section{background:var(--navy);color:white;padding:90px clamp(24px,6vw,96px)}.project-copy{max-width:800px}.project-copy h2{color:white}.project-copy>p:last-child{color:#cfe1e6}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:42px 0}.mode-grid article{padding:28px;border-radius:26px;background:#163d59}.mode-icon{font-size:2rem}.mode-grid h3{font-size:1.35rem;margin:14px 0 8px}.mode-grid p{color:#cfe1e6;line-height:1.55}.roles{display:flex;flex-wrap:wrap;gap:10px}.roles span{padding:10px 15px;border-radius:999px;background:var(--teal);font-weight:800}.materials-section{background:#eaf4f4}.materials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.materials-grid a{display:flex;flex-direction:column;gap:8px;padding:22px;border-radius:20px;background:white;text-decoration:none;border:2px solid transparent}.materials-grid a:hover{border-color:var(--teal)}.materials-grid b{color:var(--navy);font-size:1.08rem}.materials-grid span{color:var(--muted);line-height:1.4}.evaluation-section{background:var(--paper)}.score-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.score-grid div{border-top:8px solid var(--score);background:var(--cream);border-radius:20px;padding:24px}.score-grid strong{display:block;color:var(--score);font-size:2.2rem}.score-grid span{font-weight:750}.note{color:var(--muted);margin-top:22px}dialog{width:min(820px,calc(100% - 30px));border:0;border-radius:28px;padding:34px;background:var(--paper);color:var(--ink);box-shadow:0 30px 100px rgba(0,0,0,.35)}dialog::backdrop{background:rgba(3,18,32,.74);backdrop-filter:blur(4px)}.dialog-close{position:absolute;right:18px;top:14px;border:0;background:transparent;font-size:2rem;cursor:pointer}.dialog-summary{font-size:1.1rem;color:var(--muted)}.mission-detail{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0}.mission-detail>div{background:var(--cream);padding:18px;border-radius:16px}.mission-detail b{color:var(--navy)}.mission-detail p{line-height:1.5;margin-bottom:0}.complete-check{display:flex;align-items:center;gap:10px;background:#eaf4f4;padding:15px;border-radius:14px;font-weight:800}.complete-check input{width:22px;height:22px;accent-color:var(--teal)}@media(max-width:850px){.topbar nav{display:none}.hero{grid-template-columns:1fr;padding-top:50px}.hero-map{min-height:420px}.status-strip{grid-template-columns:1fr 1fr}.mode-grid,.score-grid{grid-template-columns:1fr 1fr}.mission-detail{grid-template-columns:1fr}}@media(max-width:560px){h1{font-size:3.4rem}.hero{padding-inline:20px}.hero-map{min-height:390px}.port span{width:72px;height:72px;font-size:32px}.status-strip,.mode-grid,.score-grid{grid-template-columns:1fr}.status-strip div{justify-content:flex-start}.topbar{padding:12px 16px}.progress-button{font-size:.82rem}.map-section,.materials-section,.evaluation-section,.project-section{padding:66px 20px}.island{padding:22px}.missions{grid-template-columns:1fr}.mission-detail{grid-template-columns:1fr}}