/* Visual theme tokens and base typography. */
:root{--bg:#111118;--panel:#1b1a24;--line:#4d445c;--muted:#a19aaa;--text:#e4dfe9;--pink:#df79d0;--cyan:#4ed5dd;--green:#4be1a3;--amber:#ffbf58;--blue:#a5a6ff;--shadow:#08080b}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -20%,#393045 0,#17151e 54%,#0a0a0e 100%);color:var(--text);font:13px 'IBM Plex Mono',monospace;min-height:100vh;padding:12px}button,input,textarea,select{font:inherit}button{color:var(--text);background:#27232f;border:1px solid #685d79;padding:8px 12px;cursor:pointer;box-shadow:0 2px 0 #08080b}button:hover{border-color:var(--cyan);color:#fff}button.primary{background:#18473f;border-color:#42bf97;color:#77f3bf}button.danger{border-color:#b95d81;color:#ff9cbb}button.small{padding:5px 8px;font-size:11px}.frame{max-width:1600px;min-height:calc(100vh - 24px);margin:auto;border:1px solid #71647f;border-radius:9px;background:#111117;box-shadow:0 0 0 4px #08080c,0 15px 70px #000b;overflow:hidden;position:relative}.topbar{height:57px;display:flex;align-items:center;gap:22px;padding:0 24px;border-bottom:1px solid #5e536b;background:linear-gradient(#27232c,#17151c)}.logo{font:21px 'Press Start 2P',monospace;color:var(--pink);text-shadow:2px 2px #603a68;letter-spacing:-2px;cursor:pointer}.globe{font-size:23px;color:var(--cyan)}.nav{display:flex;gap:20px;color:#bcb5c5}.nav button{box-shadow:none;background:none;border:0;padding:4px;color:inherit}.nav button:hover,.nav .active{color:var(--cyan)}.topright{margin-left:auto;display:flex;align-items:center;gap:20px;color:#b8b0c2}.online{border:1px solid #32886b;padding:6px 12px;color:var(--green);white-space:nowrap}.clock{white-space:nowrap}/* Three-window desktop proportions follow the supplied reference; media rules below collapse the panels on narrow screens. */
.layout{display:grid;grid-template-columns:260px minmax(450px,1fr) 275px;gap:10px;padding:10px;min-height:calc(100vh - 115px)}.window{border:1px solid #665970;background:#17161e;box-shadow:inset 0 0 0 2px #0c0b10;min-width:0}.titlebar{height:39px;padding:0 12px;display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,#393044,#25222c);border-bottom:1px solid #61576d;color:#e5a3ec;font-size:14px}.titlebar strong{font-weight:600}.titlebar .controls{margin-left:auto;display:flex;gap:5px}.control{width:16px;height:16px;border:1px solid #8f849a;text-align:center;line-height:12px;color:#ddd;background:#514a59}.tabs{height:38px;display:flex;border-bottom:1px solid #48414f}.tab{flex:1;text-align:center;padding:10px 3px;color:#b7aebe;border-right:1px solid #332f38;cursor:pointer}.tab.active{color:#74f2bb;background:#15342f;border:1px solid #36aa83;box-shadow:inset 0 0 12px #16775c55}.site-list{overflow:auto;max-height:calc(100vh - 250px)}.site-row{height:53px;border-bottom:1px solid #302c36;display:flex;align-items:center;gap:10px;padding:5px 9px;cursor:pointer}.site-row:hover,.site-row.selected{background:#282532;outline:1px solid #42c8be}.site-icon{width:35px;height:35px;border:1px solid #554d60;background:#22202a;display:grid;place-items:center;font-size:20px}.site-meta{min-width:0;flex:1}.site-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#d9d1df}.site-owner{font-size:11px;color:#8f8799;margin-top:3px}.status{font-size:10px;white-space:nowrap}.status:before{content:'';display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;background:#58e7a4}.status.away:before{background:var(--amber)}.status.offline:before{background:#76717c}.browser-window{height:100%;display:flex;flex-direction:column}.browserbar{height:48px;border-bottom:1px solid #57505e;background:#d2ced5;color:#28242e;display:flex;align-items:center;gap:6px;padding:5px 10px}.browserbar button{background:#e2dfe5;color:#292430;border-color:#9a939e;box-shadow:none;padding:6px 9px}.browserbar .url{background:#fff;border:1px solid #948c98;padding:8px 11px;flex:1;min-width:80px;color:#24212b;overflow:hidden;white-space:nowrap}.browser-content{background:#e5dfd1;color:#25212b;flex:1;overflow:auto;padding:16px 22px;position:relative;min-height:580px}/* Personal homepage paper-and-banner surface. */
.home-hero{background:#11131a;color:#df83dd;min-height:150px;border:5px ridge #8f79a8;display:flex;align-items:center;justify-content:center;gap:22px;position:relative;overflow:hidden;text-align:center}.hero-moth{font-size:72px;filter:drop-shadow(0 0 8px #7b50bb)}.hero-copy h1{font:clamp(21px,3.3vw,38px) 'Press Start 2P',monospace;margin:8px 0;color:#d58bdf;text-shadow:3px 3px #55447c;line-height:1.5}.hero-copy p{color:#63cde2;margin:4px;letter-spacing:2px}.page-cols{display:grid;grid-template-columns:175px 1fr;gap:20px;margin-top:17px}.page-links{display:flex;flex-direction:column;gap:11px}.page-link{color:#4433b3;text-decoration:underline;cursor:pointer}.page-main{line-height:1.8;min-width:0}.construction{border:2px dashed #9e91b3;padding:13px;text-align:center;margin-bottom:15px}.construction b{font-size:26px}.handnote{float:right;transform:rotate(8deg);color:#69616b}.mini-photo{width:130px;height:90px;float:right;margin:4px 0 10px 12px;border:4px ridge #6b6475;background:linear-gradient(135deg,#52456e,#dc8c94,#242637);display:grid;place-items:center;font-size:32px}.feature-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.feature{border:1px solid #8f8693;padding:10px;cursor:pointer;color:#353044}.visitor{text-align:center;color:#665d69;border-top:1px dashed #a69daa;padding-top:14px;font-size:11px}.counter{font:18px monospace;color:#69ff9b;background:#090e0b;padding:4px 9px;letter-spacing:2px}.board-feed{padding:8px;max-height:calc(100vh - 278px);overflow:auto}.post{border:1px solid #48404d;margin-bottom:9px;background:#1e1c25;padding:11px}.post-head{display:flex;align-items:center;gap:8px;color:#bbb1c2;font-size:11px;margin-bottom:8px}.post-head .age{margin-left:auto;color:#8a8292}.post h3{font-size:13px;margin:7px 0;color:var(--amber)}.post p{margin:0;color:#c7c0ce;line-height:1.55}.post-actions{color:#a99faf;margin-top:10px;font-size:11px}.terminal{position:relative;margin:0 10px 10px;border:1px solid #6c6278;background:#11131a;min-height:65px;display:grid;grid-template-columns:185px 1fr 175px;align-items:center;padding:7px 11px;gap:12px;color:#b8c9d9}.term-label{border:1px solid #4d7a73;padding:7px;color:#bfe8ef}.term-text{font-size:11px;line-height:1.6}.prompt{color:#70efaa}.shortcuts{text-align:right;font-size:10px;color:#b5adbf}.modal-back{position:fixed;inset:0;background:#08070bc9;z-index:10;display:grid;place-items:center;padding:20px}.modal{width:min(650px,100%);max-height:90vh;overflow:auto;background:#1b1922;border:1px solid #91759d;box-shadow:0 20px 80px #000;padding:0 18px 18px}.modal h2{color:var(--pink);font-size:17px}.modal p{line-height:1.65;color:#c9c1ce}.modal-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #494151;padding:10px 0}.modal-head button{padding:4px 8px}.field{display:flex;flex-direction:column;gap:6px;margin:12px 0;color:#bdb4c5}.field input,.field textarea,.field select{background:#100f15;border:1px solid #5b5264;color:#eee;padding:10px;outline:none}.field textarea{min-height:90px;resize:vertical}.edit-toolbar{display:flex;gap:8px;margin:12px 0}.block-row{display:grid;grid-template-columns:135px 1fr auto;gap:8px;margin:7px 0}.block-row select,.block-row input{background:#111018;color:#eee;border:1px solid #5b5264;padding:8px;min-width:0}.hint{font-size:11px;color:#9890a0;line-height:1.5}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.theme-row{display:flex;gap:7px;flex-wrap:wrap}.theme-chip{padding:7px;border:1px solid #5d5365;cursor:pointer}.theme-chip.selected{border-color:var(--cyan);color:var(--cyan)}.tutorial{border:1px solid #347d69;background:#102a26;padding:10px;margin:10px;color:#bcf2d7;line-height:1.5}.tutorial b{color:#68ecb3}.toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:#182b28;border:1px solid #57c89a;color:#c6ffe3;padding:12px 18px;z-index:20;box-shadow:0 5px 25px #000}.empty{padding:20px;color:#a9a1b0}.mobile-nav{display:none}
body.theme-amber .browser-content{background:#eee1ca}body.theme-orchard .browser-content{background:#e5efd8}body.theme-blueprint .browser-content{background:#dce9ed}body.theme-terminal .browser-content{background:#101611;color:#a4e8a8}body.theme-terminal .page-link{color:#76efad}body.theme-terminal .home-hero{border-color:#58a567}
/* Subtle scanline treatment: keep contrast low so text stays readable. */
.frame:after{content:'';pointer-events:none;position:absolute;inset:0;z-index:5;background:repeating-linear-gradient(0deg,#0000 0 2px,#05040a12 3px),linear-gradient(90deg,#e89cff06,#0000 24%,#53dfff04 78%,#ffc85805);mix-blend-mode:multiply}.home-hero:after{content:'✦　　✧　　　·　　 ✧　　☾';position:absolute;inset:10px;display:grid;place-items:start end;color:#a88ada88;font-size:24px;pointer-events:none}.reply{border-left:2px solid #655872;margin:7px 0 4px 12px;padding:4px 8px;font-size:11px;color:#bbb2c5}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.photo-grid div{height:105px;background:linear-gradient(140deg,#292f53,#b27c9a,#293a4a);border:4px ridge #6c6471;display:flex;align-items:flex-end;justify-content:center;color:white;font-size:22px}.photo-grid small{font-size:9px;background:#13121bbd;width:100%;text-align:center;padding:3px}@media(max-width:1100px){.layout{grid-template-columns:220px minmax(380px,1fr)}.rightcol{display:none}.topbar{gap:12px;padding:0 14px}.nav{gap:6px}.topright{gap:8px}.clock{font-size:10px}}@media(max-width:700px){body{padding:0}.frame{border:0;border-radius:0;min-height:100vh}.topbar{height:auto;min-height:55px;flex-wrap:wrap;padding:9px 12px}.logo{font-size:15px}.nav{order:3;width:100%;justify-content:space-around}.topright{margin-left:auto}.clock{display:none}.layout{display:block;padding:7px;min-height:0}.leftcol{display:none}.browser-window{min-height:calc(100vh - 205px)}.browser-content{padding:12px;min-height:520px}.page-cols{grid-template-columns:1fr}.page-links{flex-direction:row;overflow:auto}.page-link{white-space:nowrap}.hero-moth{font-size:43px}.hero-copy h1{font-size:18px}.terminal{grid-template-columns:1fr;padding:7px}.term-label{display:none}.shortcuts{text-align:left}.mobile-nav{display:flex;gap:5px}.post{padding:9px}}
