@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/dm-sans-400.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/dm-sans-500.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/dm-sans-600.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/dm-sans-700.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/outfit-300.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/outfit-400.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/outfit-500.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/outfit-600.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/outfit-700.ttf) format('truetype');
}

:root{color-scheme:dark;--bg:#101a23;--ink:#f1eee4;--muted:#8d9ca5;--gold:#d0b87d}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 45%,#20313b 0%,var(--bg) 65%);color:var(--ink);font-family:'DM Sans',sans-serif;min-height:100svh;display:flex;flex-direction:column}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:4px}.stars{position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:radial-gradient(#b5c5d0 1px,transparent 1px);background-size:91px 97px;mask-image:linear-gradient(#000,transparent)}main{width:min(1240px,94vw);margin:auto;display:grid;grid-template-columns:245px minmax(320px,540px) 210px;gap:48px;align-items:center;padding:24px 0 10px}.brand{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--ink);text-decoration:none;display:block}.brand span{display:block;color:var(--muted);font-size:8px;margin-top:7px;letter-spacing:2px}.identity{position:relative;margin-top:40px}.emblem{font-size:48px;color:var(--gold);line-height:1;margin-bottom:18px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:1.9px;color:var(--gold)}h1{font-family:Outfit,sans-serif;font-weight:300;font-size:64px;letter-spacing:1px;line-height:.94;margin:19px 0 22px;position:relative}h1 em{font-style:normal;color:var(--gold)}h1 small{font-size:10px;position:absolute;left:204px;top:5px;border:1px solid #73818b;border-radius:50%;padding:5px;letter-spacing:0}.tagline{color:#b6c1c6;line-height:1.7;font-size:13px}.mission{border-top:1px solid #ffffff1c;margin-top:34px;padding-top:23px}h2{font-family:Outfit,sans-serif;font-size:21px;font-weight:400;margin:12px 0}p{line-height:1.7}.mission p,.guide>p:not(.eyebrow){font-size:12px;color:var(--muted)}.progress{height:3px;background:#ffffff15;margin-top:20px}.progress i{height:100%;display:block;background:var(--gold);width:0;transition:width .4s}.progress-text{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:9px}.text-btn{background:none;color:#b6c1c6;border:0;padding:24px 0 0;font-size:11px;width:100%;text-align:left}.text-btn span{float:right}.stats{display:flex;justify-content:space-between;padding:0 20px 17px}.stats>div:last-child{text-align:right}label{display:block;font-size:9px;letter-spacing:1.7px;color:var(--muted)}.stats strong{font-family:Outfit,sans-serif;display:block;font-size:29px;font-weight:400;margin-top:4px;font-variant-numeric:tabular-nums}.score{text-align:center}.score strong{color:var(--gold)}.board-wrap{border:1px solid #9aadb330;border-radius:15px;background:linear-gradient(150deg,#25343e,#17232e);box-shadow:0 25px 65px #0004;padding:12px}.board-top,.board-bottom{display:flex;justify-content:space-between;align-items:center;padding:0 7px;color:var(--gold);height:29px;font-size:9px;letter-spacing:1.2px}.board-top b{font-weight:500}.board-top>span:last-child{font-size:23px}.canvas-box{position:relative;margin:9px 0;background:#0d1721;border-radius:8px;overflow:hidden;aspect-ratio:1}canvas{width:100%;height:100%;display:block;touch-action:none;user-select:none}.board-bottom{font-size:10px;color:var(--muted);letter-spacing:0}.orbit{font-size:22px;color:var(--gold)}.tools{display:flex;justify-content:space-between;gap:7px;padding:16px 5px 0}.tools button{background:none;color:#a9b7c1;border:0;padding:8px 4px;font-size:10px;white-space:nowrap}.tools button span{margin-right:5px;font-size:18px}.tools button:hover{color:var(--gold)}.guide{padding-top:40px}.compass{width:112px;height:112px;position:relative;border:1px solid #bca87130;border-radius:50%;margin-bottom:26px;color:#556673}.compass:after{content:'';position:absolute;inset:12px;border:1px dashed #bca87120;border-radius:50%}.compass span{position:absolute;font-size:18px;z-index:1}.north{top:2px;left:49px}.south{bottom:2px;left:49px}.west{left:5px;top:42px}.east{right:5px;top:42px}.compass .active{color:var(--gold);text-shadow:0 0 15px #ffda71}.compass div{position:absolute;inset:0;display:grid;place-items:center;color:var(--gold);font-size:42px}.guide h2{font-size:28px;line-height:1.2}.legend{border-top:1px solid #ffffff17;margin-top:24px;padding-top:10px}.legend>div{display:flex;align-items:center;gap:13px;margin:17px 0}.mini{display:grid;place-items:center;width:31px;height:34px;background:#54bea932;color:#9de6d3;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);font-size:23px}.vortex{background:#b994e733;color:#d3b4ff}.prism{background:#ddb96c33;color:#f4d792}.legend p{margin:0;line-height:1.7;font-size:11px}.legend strong{display:block;font-weight:500}.legend p span{color:var(--muted);font-size:10px}.record{border-top:1px solid #ffffff17;margin-top:25px;padding-top:20px}.record strong{font-family:Outfit;display:block;font-size:24px;margin:8px 0}.record>span{font-size:10px;color:var(--muted)}footer{display:flex;justify-content:space-between;width:min(1240px,94vw);margin:0 auto;padding:14px 0 18px;color:#6f818e;font-size:9px;letter-spacing:.7px}footer a{color:inherit;text-decoration:none}footer i{color:var(--gold);font-style:normal;margin:0 7px}#toast{position:absolute;top:42%;width:100%;text-align:center;font:500 24px Outfit;color:#fff7dc;text-shadow:0 2px 18px #000;pointer-events:none;opacity:0;transition:opacity .2s}#toast.show{opacity:1}dialog{color:var(--ink);border:1px solid #bda67155;border-radius:20px;background:#182731;width:min(440px,90vw);padding:32px;box-shadow:0 25px 100px #0009}dialog::backdrop{background:#08111cd9;backdrop-filter:blur(7px)}dialog h2{font-size:31px;color:var(--gold);margin-top:0}dialog p,dialog li{font-size:13px;color:#b5c2cb;line-height:1.8}dialog ul{padding-left:18px}dialog button{border:1px solid #d0b87d66;color:var(--ink);background:#d0b87d18;border-radius:9px;padding:12px 18px;margin:8px 8px 0 0}dialog .primary{background:var(--gold);color:#101a23;font-weight:700}.dialog-icon{font-size:42px;color:var(--gold);display:block;margin-bottom:16px}@media(min-width:950px) and (max-height:780px){main{grid-template-columns:220px minmax(310px, min(500px,calc(100svh - 185px))) 190px;gap:34px;justify-content:center}.identity{margin-top:24px}h1{font-size:56px}.emblem{display:none}.mission{margin-top:20px}.guide{padding-top:0}}@media(max-width:1100px){main{gap:26px;grid-template-columns:210px minmax(300px,500px)}.guide{display:none}}@media(max-width:720px){main{display:flex;flex-direction:column;width:min(490px,96vw);gap:12px;padding:17px 0 4px}.intro{width:100%;display:grid;grid-template-columns:1fr auto;gap:0 12px;padding:0 12px}.brand{font-size:8px;grid-column:1/-1}.brand span,.emblem,.identity>.eyebrow,.tagline,.mission h2,.mission p,.mission>.eyebrow,.text-btn span{display:none}.identity{margin-top:15px}h1{font-size:27px;line-height:1;margin:0;letter-spacing:1px}h1 br{display:none}h1 em{margin-left:6px}h1 small{display:none}.mission{padding:0;border:0;margin:15px 0 0;align-self:center;width:135px}.progress{margin-top:0}.progress-text{font-size:9px}.text-btn{position:absolute;right:14px;top:12px;width:auto;padding:3px;font-size:10px}.play{width:100%}.stats{padding:0 18px 8px}.stats strong{font-size:25px}.stats label{font-size:8px}.board-wrap{padding:8px;border-radius:12px}.board-top{font-size:8px;height:22px}.canvas-box{margin:5px 0}.board-bottom{height:22px;font-size:9px}.tools{padding:6px 8px 0}.tools button{font-size:10px}footer{width:92vw;font-size:8px;padding:12px 0}footer>span:last-child{font-size:7px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.level-list article{padding:12px 0;border-top:1px solid #ffffff20}.level-list b{font-size:13px;color:var(--gold)}.level-list small{display:block;color:var(--muted);margin-top:5px;font-size:11px}.level-list p{margin:7px 0 0;font-size:12px}dialog{max-height:88svh;overflow:auto}#journey{padding-top:16px}@media(max-width:720px){#journey{top:32px;padding-top:3px}.mission{width:160px}.progress-text{font-size:8px}.mission h2{display:block;font-size:11px;margin:0 0 9px}.progress-text #percent{margin-left:8px}}