:root{--cream:#fff8df;--ink:#191c1b;--green:#126c5d;--mint:#92e6c0;--yellow:#ffd84d;--pink:#ff7897;--blue:#75bfff;--grey:#d8d4c7;--navy:#082e6f}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Courier New","Malgun Gothic",monospace;color:var(--ink)}
body{overflow-x:hidden;background-color:#164a43;background-image:linear-gradient(45deg,#ffffff0a 25%,transparent 25%),linear-gradient(-45deg,#ffffff0a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ffffff0a 75%),linear-gradient(-45deg,transparent 75%,#ffffff0a 75%);background-size:28px 28px;background-position:0 0,0 14px,14px -14px,-14px 0}
body::after{content:"";position:fixed;inset:0;z-index:100;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 3px,#00130e12 3px 4px);mix-blend-mode:multiply}a{color:inherit}
.desktop{min-height:calc(100dvh - 47px);padding:18px 30px 68px;position:relative}.shortcuts{display:flex;flex-direction:column;gap:20px;position:fixed;z-index:70;top:28px;left:25px;width:86px}.shortcut{border:0;background:none;color:#fff;text-align:center;text-decoration:none;text-shadow:2px 2px #000;font:900 11px inherit;cursor:pointer}.shortcut-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 7px;border:2px solid #fff;border-radius:8px;background:#fff6;font-size:31px;box-shadow:3px 3px #152b27}.shortcut-icon img{display:block;width:46px;height:46px;object-fit:contain}.shortcut:hover .shortcut-icon,.shortcut:focus-visible .shortcut-icon{background:var(--yellow);transform:translateY(-2px)}
.window{display:grid;grid-template-rows:auto auto auto;width:min(1100px,calc(100% - 150px));margin:0 auto;border:3px solid var(--ink);border-radius:3px;background:var(--cream);box-shadow:11px 12px #0a2824;animation:boot .2s steps(5)}@keyframes boot{from{opacity:0;transform:scale(.97) translateY(10px)}}
.titlebar{height:43px;display:flex;align-items:center;padding:5px 7px 5px 12px;border-bottom:3px solid var(--ink);background:linear-gradient(90deg,#082e6f,#168da1);color:#fff;font-weight:1000}.titlebar-name{flex:1;overflow:hidden;white-space:nowrap}.controls{display:flex;gap:5px}.control{width:29px;height:27px;padding:0;border:2px solid var(--ink);background:var(--grey);box-shadow:inset 2px 2px #fff,inset -2px -2px #817e74;font:bold 17px Arial;cursor:pointer}.control:active{box-shadow:inset 2px 2px #777}.menubar{display:flex;gap:22px;padding:7px 13px;border-bottom:2px solid #817e74;background:#e7e2d3;font-size:13px}.menubar a{text-decoration:none}.menubar a:hover{text-decoration:underline}.window-body{padding:24px 34px 20px}.window-body[hidden]{display:none}
.hero{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;padding:6px 0 30px;border-bottom:3px dashed var(--ink)}.eyebrow{display:inline-block;padding:5px 10px;border:2px solid var(--ink);background:var(--yellow);box-shadow:3px 3px var(--ink);color:var(--ink);font-size:12px;font-weight:1000;letter-spacing:.4px;transform:rotate(-1deg)}h1{margin:24px 0 0;font-size:clamp(41px,5vw,67px);line-height:.94;letter-spacing:-5px;text-shadow:4px 4px var(--mint)}.subtitle{margin:20px 0 0;font:900 clamp(14px,1.6vw,17px)/1.7 "Malgun Gothic",sans-serif}.mascot{width:126px;height:126px;object-fit:contain;filter:drop-shadow(6px 6px #0003);animation:float 1.8s ease-in-out infinite alternate}@keyframes float{to{transform:translateY(-8px) rotate(2deg)}}
.section-head{display:flex;justify-content:space-between;align-items:end;margin:20px 0 12px}.section-head h2{margin:0;font-size:22px}.section-head p{margin:0;font-size:11px;font-weight:900}.blink{animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}
.directory-grid,.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.directory,.tool-card{position:relative;display:grid;grid-template-columns:58px 1fr auto;gap:14px;align-items:center;min-height:105px;padding:14px 16px;border:3px solid var(--ink);background:#fff;box-shadow:6px 6px var(--ink);color:var(--ink);text-decoration:none;transition:.12s}.directory:hover,.tool-card:hover{transform:translate(-2px,-3px);box-shadow:9px 10px var(--ink)}.directory:active,.tool-card:active{transform:translate(4px,4px);box-shadow:1px 1px var(--ink)}.directory:nth-child(4n+2),.tool-card:nth-child(4n+2){background:#f1fffa}.directory:nth-child(4n+3),.tool-card:nth-child(4n+3){background:#fff5d1}.directory:nth-child(4n+4),.tool-card:nth-child(4n+4){background:#ffe9ef}.directory-icon,.tool-icon{display:grid;place-items:center;width:56px;height:56px;border:3px solid var(--ink);border-radius:9px;background:var(--blue);box-shadow:4px 4px var(--ink);font-size:29px}.directory:nth-child(4n+2) .directory-icon,.tool-card:nth-child(4n+2) .tool-icon{background:var(--mint)}.directory:nth-child(4n+3) .directory-icon,.tool-card:nth-child(4n+3) .tool-icon{background:var(--yellow)}.directory:nth-child(4n+4) .directory-icon,.tool-card:nth-child(4n+4) .tool-icon{background:var(--pink)}.directory h3,.tool-card h3{margin:0 0 7px;font-size:18px}.directory p,.tool-card p{margin:0;color:#555;font:700 13px/1.45 "Malgun Gothic",sans-serif}.status{align-self:start;padding:4px 7px;border:2px solid var(--ink);background:var(--grey);font-size:10px;font-weight:1000;white-space:nowrap}.status.live{background:var(--mint)}.status.wait{background:#eee}.tool-card[hidden]{display:none}.pending{cursor:pointer}
.tool-icon img{display:block;width:42px;height:42px;object-fit:contain;image-rendering:pixelated}
.tool-grid.page-next{animation:pageNext .2s ease-out}.tool-grid.page-prev{animation:pagePrev .2s ease-out}@keyframes pageNext{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:translateX(0)}}@keyframes pagePrev{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:translateX(0)}}.pager{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px 0 0}.pager[hidden]{display:none}.pager button{width:42px;height:34px;border:3px solid var(--ink);background:var(--yellow);box-shadow:3px 3px var(--ink);font:1000 18px/1 inherit;cursor:pointer}.pager button:active{transform:translate(2px,2px);box-shadow:1px 1px var(--ink)}.pager button:disabled{background:#ccc;color:#777;cursor:default}.page-label{min-width:56px;text-align:center;font-weight:1000}
.terminal{margin-top:16px;padding:10px 13px;border:2px solid var(--ink);background:#111;color:#79ffb5;box-shadow:inset 0 0 0 3px #333;font-size:13px;line-height:1.6}.cursor{display:inline-block;width:9px;height:14px;background:currentColor;vertical-align:-2px;animation:blink 1s steps(1) infinite}.disclaimer{margin:18px 0 0;text-align:center;color:#5f6663;font:700 11px "Malgun Gothic",sans-serif}
.page-panel{margin-top:20px;padding:20px;border:3px solid var(--ink);background:#fff;box-shadow:6px 6px var(--ink)}.page-panel h2{margin:0 0 10px;font-size:21px}.page-panel p{margin:0;color:#48514e;font:700 14px/1.75 "Malgun Gothic",sans-serif}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:17px}.info-card{padding:16px;border:2px solid var(--ink);background:#f8f5ea}.info-card:nth-child(2){background:#effff7}.info-card:nth-child(3){background:#fff4c2}.info-card b{display:block;margin-bottom:8px}.info-card p{font-size:13px}.timeline{display:grid;gap:12px;margin-top:16px}.timeline article{display:grid;grid-template-columns:115px 1fr;gap:14px;padding:13px;border-left:6px solid var(--mint);background:#f5f3eb}.timeline time{font-weight:1000}.timeline h3{margin:0 0 5px;font-size:15px}.timeline p{font-size:13px}.note-empty{min-height:220px;display:grid;place-content:center;text-align:center}.note-empty strong{font-size:21px}.note-empty p{margin-top:9px}
.taskbar{position:fixed;z-index:110;left:0;right:0;bottom:0;height:47px;display:flex;align-items:center;gap:6px;padding:4px 6px;border-top:3px solid #fff;background:#d3cfc2;box-shadow:0 -3px var(--ink)}.start{height:34px;padding:0 13px;border:3px solid var(--ink);background:var(--yellow);box-shadow:inset 2px 2px #fff,inset -2px -2px #8b7b31;font:1000 14px inherit;cursor:pointer}.task{height:34px;max-width:280px;padding:7px 11px;border:2px solid var(--ink);background:#eee;box-shadow:inset 2px 2px #777;font-weight:900;overflow:hidden;white-space:nowrap}.clock{min-width:86px;margin-left:auto;padding:7px 8px;border:2px solid #777;background:#eee;text-align:center;font-weight:900}.toast{position:fixed;z-index:120;right:18px;bottom:69px;max-width:330px;padding:14px 17px;border:3px solid var(--ink);background:var(--yellow);box-shadow:6px 6px #0a2824;font:900 13px/1.45 "Malgun Gothic",sans-serif;transform:translateX(120%);transition:.22s}.toast.show{transform:translateX(0)}
@media(max-width:900px){.shortcuts{display:none}.window{width:100%}.desktop{padding:15px 12px 68px}.info-grid{grid-template-columns:1fr}.hero{grid-template-columns:1fr}.mascot{display:none}}
@media(max-width:680px){.window-body{padding:18px}.directory-grid,.tool-grid{grid-template-columns:1fr}.directory,.tool-card{grid-template-columns:55px 1fr}.status{position:absolute;right:8px;top:8px}.menubar{gap:14px;overflow-x:auto}h1{font-size:42px;letter-spacing:-3px}.task{max-width:calc(100vw - 190px)}.clock{min-width:72px;font-size:12px}.timeline article{grid-template-columns:1fr;gap:5px}}