:root{--ink:#082d4a;--sea:#075477;--sky:#95dcf2;--sun:#ffad22;--orange:#f15a24;--paper:#fffaf0}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:var(--paper);font:17px/1.6 'Trebuchet MS','Segoe UI',sans-serif}a{color:inherit;text-decoration:none}button,select{font:inherit;color:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}img{display:block;width:100%;height:auto}h1,h2,h3,p{margin-top:0}h1,h2{font-size:clamp(36px,4.8vw,68px);line-height:1.05;letter-spacing:-.035em;font-weight:900;margin-bottom:24px}h3{font-size:32px;line-height:1.15}a:focus-visible,button:focus-visible,select:focus-visible{outline:4px solid var(--orange);outline-offset:5px}.wrap{max-width:1320px;width:calc(100% - 64px);margin:auto}header{position:sticky;top:0;background:#fffffff5;backdrop-filter:blur(10px);z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 32px;gap:24px;border-bottom:2px solid var(--ink)}.brand{font-size:34px;font-weight:1000;line-height:1;letter-spacing:-1.5px}.brand span{color:#087da8}.brand small{display:block;font-size:10px;letter-spacing:1.4px;margin-top:8px}nav{display:flex;gap:30px;font-size:15px;font-weight:bold}nav a:hover{color:var(--orange)}.motion{background:transparent;border:1px solid #bcc9d2;border-radius:30px;padding:8px 14px;font-size:14px;white-space:nowrap}.hero{position:relative;overflow:hidden;background:var(--sky)}.hero>img{min-height:340px;object-fit:cover;animation:hero-drift 12s ease-in-out infinite alternate}.hero-action{position:absolute;left:7%;bottom:7%;display:flex;align-items:flex-start;flex-direction:column;gap:12px}.stamp{font-size:13px;font-weight:900;letter-spacing:1px;background:white;padding:6px 13px;border:2px solid var(--ink);transform:rotate(-3deg)}.button{display:inline-flex;align-items:center;justify-content:center;padding:13px 24px;background:white;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);border-radius:10px;font-weight:900;transition:transform .2s,box-shadow .2s}.sun{background:var(--sun)}.button:hover{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.button:disabled{opacity:.5;cursor:default}.portals{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-top:22px}.portals>a,.portals>button{padding:0;overflow:hidden;border:3px solid var(--ink);border-radius:16px;background:white;box-shadow:4px 4px 0 var(--ink);transition:transform .25s;text-align:left}.portals img{aspect-ratio:1.65;object-fit:cover;transition:transform .5s}.portals span{display:block;font-weight:900;font-size:15px;padding:10px 14px}.portals>a:hover,.portals>button:hover{transform:translateY(-7px) rotate(-1deg)}.portals>a:hover img,.portals>button:hover img{transform:scale(1.045)}.section{padding-top:100px;padding-bottom:100px}.sectionhead{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:end;margin-bottom:40px}.sectionhead p{max-width:400px;color:#526978}.eyebrow{display:block;font-size:13px;letter-spacing:1.8px;font-weight:900;margin-bottom:18px;color:#b94012}.lesson-shell{display:grid;grid-template-columns:1fr 1.25fr;border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink);border-radius:22px;overflow:hidden;background:white}.lesson-side{background:var(--sky);padding:35px;border-right:3px solid var(--ink)}.lesson-side h2{font-size:35px;letter-spacing:-.02em;margin-top:28px}.tabs{display:flex;gap:8px;flex-wrap:wrap}.tabs button{border:2px solid var(--ink);padding:9px 18px;border-radius:8px;background:transparent;font-weight:900}.tabs button[aria-pressed=true]{background:var(--ink);color:white}.steps{display:flex;gap:10px;margin-top:26px}.steps button{width:46px;height:46px;border-radius:50%;border:2px solid var(--ink);background:white;font-weight:bold}.steps button[aria-current=step]{background:var(--sun);box-shadow:3px 3px 0 var(--ink)}.lesson-main{padding:42px;display:flex;flex-direction:column;justify-content:center}.tip{border-left:4px solid var(--orange);padding:12px 16px;background:var(--paper);margin:10px 0 25px;font-size:16px}.step-actions{display:flex;gap:18px;flex-wrap:wrap}.progress{height:7px;background:#e9f1f5;margin-top:30px;border-radius:5px;overflow:hidden}.progress span{height:100%;display:block;background:var(--orange);transition:width .4s}.knowledge{background:white;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}.filters{display:flex;align-items:end;gap:20px;margin-bottom:32px;flex-wrap:wrap}.filters label{display:grid;gap:5px;font-size:14px;font-weight:bold}.filters select{background:var(--paper);border:2px solid var(--ink);padding:10px 14px;border-radius:9px;min-width:200px;font-size:16px}.reset{background:none;border:none;text-decoration:underline;padding:12px}.filters>span{margin-left:auto;font-size:14px}.materials{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.material{padding:25px;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);border-radius:14px;text-align:left;background:var(--paper);min-height:210px;transition:transform .2s}.material:nth-child(3n+2){background:#e4f5fc}.material:hover{transform:translateY(-5px)}.material small{font-size:14px;color:#526978}.material h3{font-size:25px;margin:16px 0 12px}.material p{font-size:16px;margin:0}.sea{color:white;background:var(--sea);border-bottom:3px solid var(--ink)}.coast-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.map{position:relative;transform:rotate(-2deg);border:4px solid var(--ink);border-radius:20px;overflow:hidden;box-shadow:9px 9px 0 var(--ink)}.map img{aspect-ratio:1.25;object-fit:cover}.map-note{display:block;background:var(--sun);color:var(--ink);font-weight:900;text-align:center;padding:12px;font-size:13px}.sea .eyebrow{color:var(--sun)}.coastal button{border-color:white;color:white}.coastal button[aria-pressed=true]{background:var(--sun);border-color:var(--sun);color:var(--ink)}.place{background:#ffffff12;border:1px solid #ffffff55;border-radius:14px;padding:20px;margin-top:20px}.place h3{font-size:24px;margin-bottom:10px}.place p{margin:0;font-size:16px}.sea-footnote{font-size:14px;color:#d1e6f0;margin-top:18px}.story{display:grid;grid-template-columns:.9fr 1.1fr;gap:75px;align-items:center}.story>img{border:3px solid var(--ink);border-radius:20px;box-shadow:7px 7px 0 var(--ink);transform:rotate(-2deg)}blockquote{margin:24px 0 30px;padding:20px;background:white;border:2px solid var(--ink);border-radius:12px;font-size:20px;font-weight:900}.last{background:var(--sun);border-block:3px solid var(--ink);padding:65px 0}.last .wrap{display:flex;justify-content:space-between;align-items:center;gap:30px}.last h2{font-size:44px;margin:0}footer{display:flex;align-items:center;gap:35px;padding:40px 0}footer p{margin:0;font-size:14px}footer>a:last-child{margin-left:auto;font-weight:bold;font-size:14px}dialog{width:min(700px,calc(100% - 32px));max-height:85vh;padding:46px;border:3px solid var(--ink);border-radius:22px;color:var(--ink);background:var(--paper);box-shadow:10px 10px 0 var(--ink)}dialog::backdrop{background:#041e32b5;backdrop-filter:blur(4px)}dialog h2{font-size:38px;padding-right:24px}dialog p,dialog li{font-size:17px}.close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:35px;width:44px;height:44px}dialog[open]{animation:pop .25s ease-out}.skip{position:absolute;left:-1000px}.skip:focus{left:10px;top:100px;z-index:50;background:white;padding:10px}.reveal{transition:opacity .65s,translate .65s}.js .reveal:not(.visible){opacity:0;translate:0 25px}@keyframes hero-drift{to{transform:scale(1.035) translateY(-3px)}}@keyframes pop{from{opacity:0;transform:translateY(15px) scale(.98)}to{opacity:1;transform:none}}.still *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.still .reveal{opacity:1!important;translate:none!important}@media(min-width:1500px){.hero>img{max-height:630px;object-fit:cover}}@media(max-width:1000px){header{flex-wrap:wrap;gap:16px}nav{order:3;width:100%;justify-content:center;gap:28px}.sectionhead{gap:30px}.coast-grid,.story{gap:35px}.lesson-side,.lesson-main{padding:25px}.materials{grid-template-columns:repeat(2,1fr)}.portals{gap:12px}.portals span{font-size:14px}}@media(max-width:650px){html{scroll-padding-top:150px}.wrap{width:calc(100% - 32px)}header{padding:12px 16px}.brand{font-size:28px}.brand small{font-size:8px}nav{justify-content:space-between;gap:8px;font-size:13px}.motion{font-size:12px;padding:6px 9px}.hero>img{height:360px;min-height:0;object-position:53%}.hero-action{left:16px;bottom:20px}.stamp{font-size:11px}.hero-action .button{font-size:14px;padding:10px 16px}.portals{grid-template-columns:repeat(2,1fr)}.portals span{padding:8px;font-size:13px}.section{padding-block:65px}.sectionhead,.lesson-shell,.coast-grid,.story{grid-template-columns:1fr;gap:24px}.sectionhead h1,.sectionhead h2{margin-bottom:0}.sectionhead p{margin:0}.lesson-shell{gap:0}.lesson-side{border-right:0;border-bottom:3px solid var(--ink)}.lesson-main h3{font-size:28px}.materials{grid-template-columns:1fr}.material{min-height:180px}.filters{gap:12px}.filters label{width:100%}.filters select{width:100%}.coast-grid{gap:42px}.story{gap:45px}.last .wrap{flex-direction:column;align-items:flex-start}.last h2{font-size:34px}footer{flex-wrap:wrap;gap:20px}footer p{width:100%;order:3}dialog{padding:32px 23px}dialog h2{font-size:30px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.js .reveal{opacity:1!important;translate:none!important}}

body.admin-bar>header{top:32px}@media(max-width:782px){body.admin-bar>header{top:46px}}
