@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#090e1b;--panel:#111a2b;--line:#25324a;--muted:#9baec8;--blue:#70d4ff;--purple:#b7a1ff}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0,#1e224a 0,transparent 45%),var(--bg);color:#f4f7ff;font:15px/1.6 'DM Sans',sans-serif}.shell{max-width:920px;margin:auto;padding:0 24px}header{height:90px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font:700 18px 'Space Grotesk',sans-serif;letter-spacing:2px}.brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:5px}.brand-icon{font-size:40px;color:var(--blue)}.pill,.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700}.pill{border:1px solid #3e4164;padding:5px 10px;border-radius:30px;color:var(--purple)}.eyebrow{color:var(--blue)}h1,h2,h3{font-family:'Space Grotesk',sans-serif;line-height:1.16}h1{font-size:clamp(34px,7vw,58px);letter-spacing:-2px;margin:18px 0}h2{font-size:25px;margin:12px 0}h3{font-size:18px;margin:8px 0}p{color:var(--muted)}.hero{position:relative;overflow:hidden;border:1px solid #34465d;border-radius:24px;padding:42px;min-height:370px;background:#101b2f}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#101b2f 5%,#101b2fe8 42%,#101b2f22),url('assets/gojo.png') 100% 45%/auto 155% no-repeat;opacity:.8}.hero>*{position:relative}.hero p{max-width:340px}.hero h1{max-width:420px}.accent{color:var(--blue)}.btn,button{display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:12px;padding:12px 18px;background:var(--blue);color:#091320;font:700 14px 'DM Sans',sans-serif;text-decoration:none;cursor:pointer;min-height:46px}.btn.secondary,button.secondary{background:#19243a;color:#dbe8ff;border-color:#34445e}button:disabled{opacity:.5;cursor:default}button:hover,.btn:hover{filter:brightness(1.12)}a{color:var(--blue)}.section-title{display:flex;justify-content:space-between;align-items:center;margin:30px 0 15px;gap:10px}.section-title a{font-size:13px;text-decoration:none}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.card{background:linear-gradient(145deg,#172238,#101829);border:1px solid var(--line);border-radius:18px;padding:22px}.card.link{color:inherit;text-decoration:none;transition:transform .2s}.card.link:hover{transform:translateY(-3px);border-color:#6394b3}.icon{font-size:27px;color:var(--purple);display:block}.card p{font-size:13px;margin-bottom:0}.number{font-size:30px;font-family:'Space Grotesk';color:var(--blue)}.stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}.stats .card{padding:17px 22px}.stats p{margin:0}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.stack{display:grid;gap:14px}.tag{display:inline-block;color:var(--purple);font-size:10px;letter-spacing:1px;text-transform:uppercase;background:#282641;border-radius:5px;padding:3px 7px}.muted{color:var(--muted);font-size:13px}.lesson{max-width:700px}.lesson p{font-size:16px;line-height:1.8}.lesson li{color:var(--muted);margin-bottom:10px}.notice{border-left:3px solid var(--purple);padding:10px 16px;background:#1d2035;margin:18px 0}.progress{height:5px;background:#2b3349;border-radius:5px;margin:18px 0}.progress span{display:block;height:100%;background:var(--blue);border-radius:5px}label{display:block;font-weight:600;font-size:13px;margin-bottom:12px}input,textarea,select{display:block;width:100%;background:#0c1424;color:#f4f7ff;border:1px solid #34435e;border-radius:9px;padding:12px;margin-top:6px;font:inherit}textarea{min-height:85px;resize:vertical}.fields{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.entry{overflow-wrap:anywhere}.entry p{white-space:pre-wrap}details{margin:12px 0}summary{cursor:pointer;color:var(--blue)}nav{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);display:flex;justify-content:space-around;background:#131e30f2;border:1px solid #34435c;backdrop-filter:blur(20px);border-radius:20px;padding:10px;max-width:490px;width:calc(100% - 32px);z-index:10;padding-bottom:max(10px,env(safe-area-inset-bottom))}nav a{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--muted);font-size:23px;width:25%;line-height:1.2;padding:5px;border-radius:12px}nav a span{font-size:11px;margin-top:6px}nav a.active{color:var(--blue);background:#23334a}footer{text-align:center;color:#b4c1d8;font-size:12px;padding:40px 0 130px}footer span{color:#7f92ae;font-size:11px}#notice{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);background:#d9edff;color:#13213b;border-radius:12px;padding:12px 18px;z-index:20;display:none;width:max-content;max-width:90%}:focus-visible{outline:2px solid var(--blue);outline-offset:4px}@media(max-width:600px){.shell{padding:0 18px}header{height:78px}.hero{padding:27px 24px;min-height:360px}.hero:before{background-position:80% 45%;opacity:.65}.hero p{max-width:260px}.grid{grid-template-columns:1fr}.grid .card{padding:18px}.fields{grid-template-columns:1fr}.section-title h2{font-size:22px}.hero h1{max-width:270px}.pill{font-size:8px;padding:5px 7px}}

/* v1.1 mobile usability improvements */
.journal-actions{display:flex;flex-wrap:wrap;gap:8px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#main{padding-bottom:calc(26px + env(safe-area-inset-bottom,0px))}
nav{bottom:max(12px,env(safe-area-inset-bottom,0px))}
#notice{bottom:calc(110px + env(safe-area-inset-bottom,0px));width:min(90%,480px);text-align:center}
@media(max-width:600px){.section-title:has(.journal-actions){align-items:flex-start;flex-wrap:wrap}.journal-actions{width:100%}.journal-actions button{flex:1;min-width:120px}nav a{min-height:54px}}
@media(prefers-reduced-motion:reduce){.card.link{transition:none}}

/* v1.2 community achievements; existing colors and navigation unchanged */
.challenge-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.achievement-card{display:flex;flex-direction:column;align-items:flex-start}
.achievement-card .btn,.achievement-card button{margin-top:auto}
.achievement-card p{margin:7px 0 15px}
.achievement-card .row{justify-content:space-between;width:100%}
.achievement-symbol{font-size:28px;color:var(--blue)}
.achievement-unlocked{color:#a2e6cb;font-weight:700;font-size:13px;margin-top:auto}
@media(max-width:600px){.challenge-grid{grid-template-columns:1fr}}