:root{--text: rgba(255,255,255,.92);--muted: rgba(255,255,255,.7);--border: rgba(255,255,255,.14);--shadow: 0 20px 50px rgba(0,0,0,.55);--radius: 14px;--topH: 76px;--bottomH: 58px;--leftW: 240px;--leftWClosed: 72px;--rightW: 340px;--rightWClosed: 54px}*{box-sizing:border-box}html,body{height:100%;overflow-x:hidden}@supports (overflow: clip){html,body{overflow-x:clip}}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text)}.appShell{height:100vh;position:relative;overflow:hidden;display:grid;grid-template-rows:var(--topH) 1fr var(--bottomH);grid-template-columns:var(--leftCol, auto) minmax(0,1fr) var(--rightCol, auto);grid-template-areas:"top top top" "left center right" "bottom bottom bottom"}.bg{position:absolute;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;transform:scale(1.02);filter:saturate(.95) contrast(1.05);z-index:0}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,#00000026,#000000b3 75%,#000000e0),linear-gradient(to bottom,#00000059,#0009);z-index:1}.drawerBackdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:40}.drawerBackdrop.show{opacity:1;pointer-events:auto}.topHeader{grid-area:top;position:relative;z-index:60;padding:18px 16px}.topHeaderInner{height:100%;width:100%;max-width:none;margin:0;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}.brand{letter-spacing:.5px;font-size:20px;opacity:.95;text-align:center;flex:1 1 0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.iconButton{width:44px;height:44px;display:grid;place-items:center;background:#00000059;border:1px solid var(--border);color:var(--text);border-radius:12px;cursor:pointer;box-shadow:0 10px 30px #00000059}.hamburger{display:inline-flex;flex-direction:column;gap:4px}.hamburger span{display:block;width:18px;height:2px;background:#ffffffd9;border-radius:2px}.leftNav,.rightPanel{display:flex;flex-direction:column}.leftNav{grid-area:left;position:relative;z-index:55;height:calc(100vh - var(--topH) - var(--bottomH));border-right:1px solid var(--border);background:#0000008c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden}.leftNav.open{width:var(--leftW)}.leftNav.closed{width:var(--leftWClosed)}.leftNavTop{display:flex;align-items:center;justify-content:space-between;padding:14px 12px;border-bottom:1px solid var(--border);flex:0 0 auto}.leftNavTitle{font-size:14px;color:var(--muted)}.miniBtn{border:1px solid var(--border);background:#00000059;color:var(--text);border-radius:10px;width:34px;height:34px;padding:0;display:grid;place-items:center;line-height:1;cursor:pointer}.leftNavLinks{flex:1 1 auto;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:12px;scrollbar-gutter:stable}.navLink{display:block;text-decoration:none;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:#00000059;color:#ffffffd9}.navLink:hover{background:#ffffff14}.navLink.active{background:#ffffff1f;color:#fffffff2}.leftNav.closed .leftNavTitle{display:none}.leftNav.closed .leftNavTop{justify-content:flex-end}.leftNav.closed .leftNavLinks{padding:12px 0;align-items:center}.leftNav.closed .navLink{width:48px;height:48px;padding:0;display:grid;place-items:center;text-align:center;line-height:1;font-size:20px;white-space:normal}.rightPanel{grid-area:right;position:relative;z-index:55;height:calc(100vh - var(--topH) - var(--bottomH));border-left:1px solid var(--border);background:#0000008c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden}.rightPanel.open{width:var(--rightW)}.rightPanel.closed{width:var(--rightWClosed)}.rightPanelTop{display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:14px 12px;border-bottom:1px solid var(--border);flex:0 0 auto;min-height:56px}.rightPanelTitle{font-size:14px;color:var(--muted);display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto;min-width:0}.rightPanel.closed .rightPanelTitle{display:none}.rightPanel.closed .rightPanelTop{justify-content:center}.center{grid-area:center;position:relative;z-index:10;height:calc(100vh - var(--topH) - var(--bottomH));display:grid;place-items:start center;padding:18px 14px;min-height:0}.footer{grid-area:bottom;position:relative;z-index:60;display:flex;align-items:center;justify-content:center;padding:12px 14px}.footerInner{color:var(--muted);font-size:12px}.footerInner a{color:inherit;text-decoration:underline;text-underline-offset:2px}.footerInner a:hover{opacity:.9}.hero{text-align:center;padding:26px 18px;max-width:760px}.heroTitle{margin:0 0 10px;font-weight:500;font-size:clamp(32px,4vw,54px)}.heroSub{margin:0;color:var(--muted);font-size:13px}.pageCard{width:100%;max-width:90%;min-width:0;padding:22px 20px;border-radius:var(--radius);border:1px solid var(--border);background:#00000052;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);max-height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable both-edges}.rightPanelBottom{flex:0 0 auto;padding:12px;border-top:1px solid var(--border);background:#0000004d}.authArea{padding:14px 12px;flex:1 1 auto;overflow-y:auto;overflow-x:hidden;min-height:0;scrollbar-gutter:stable}.fieldLabel{display:block;font-size:12px;color:var(--muted);margin:10px 0 6px}.input{width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);background:#00000059;color:var(--text);outline:none}.input::placeholder{color:#ffffff59}.authRow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}.link{color:#ffffffbf;text-decoration:none;font-size:12px}.link:hover{text-decoration:underline}.btn{border:1px solid var(--border);background:#ffffff1a;color:var(--text);border-radius:10px;padding:9px 12px;cursor:pointer}.modeTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.modeTab{border:1px solid var(--border);background:#00000059;color:#ffffffd9;border-radius:10px;padding:8px 10px;cursor:pointer;font-size:12px}.modeTab:hover{background:#ffffff14}.modeTab.active{background:#ffffff1f;color:#fffffff2}.notice{color:#ffffffd1}.error{color:#ff7a7a}.btn:hover{background:#ffffff24}.divider{height:1px;background:var(--border);margin:14px 0}.authButtons{display:grid;gap:10px}.btnGhost{width:100%;display:inline-block;text-align:center;text-decoration:none}.btnDanger{background:#ff464633;text-decoration:none;width:100%;display:inline-block;text-align:center}.leftNavLinks,.authArea{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}.leftNavLinks::-webkit-scrollbar,.authArea::-webkit-scrollbar{width:8px}.leftNavLinks::-webkit-scrollbar-track,.authArea::-webkit-scrollbar-track{background:transparent}.leftNavLinks::-webkit-scrollbar-thumb,.authArea::-webkit-scrollbar-thumb{background:#fff3;border-radius:999px;border:2px solid transparent;background-clip:padding-box}.leftNavLinks::-webkit-scrollbar-thumb:hover,.authArea::-webkit-scrollbar-thumb:hover{background:#ffffff4d;border:2px solid transparent;background-clip:padding-box}@media (max-width: 900px){.appShell{grid-template-columns:1fr;grid-template-areas:"top" "center" "bottom"}.leftNav,.rightPanel{position:fixed;top:var(--topH);bottom:var(--bottomH);height:auto;z-index:55;box-shadow:var(--shadow);transition:transform .22s ease}.leftNav{left:0;width:min(82vw,320px)}.leftNav.closed{transform:translate(-110%)}.leftNav.open{transform:translate(0)}.rightPanel{right:0;width:min(86vw,360px)}.rightPanel.closed{transform:translate(110%)}.rightPanel.open{transform:translate(0)}.leftNav.open,.leftNav.closed{width:min(82vw,320px)}.leftNav.open .navLink{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rightPanel.open,.rightPanel.closed{width:min(86vw,360px)}.center{width:100%}}.aboutLead{margin-top:8px;color:var(--muted);line-height:1.5}.aboutBadges{margin-top:12px}.codeBadge{display:inline-block;border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:.85rem;color:var(--muted);margin:6px 8px 0 0;background:#00000038}.aboutGrid{margin-top:16px;display:grid;gap:14px}@media (min-width: 860px){.aboutGrid{grid-template-columns:1fr 1fr}}.aboutCard{border:1px solid var(--border);border-radius:var(--radius);padding:14px;background:#0003;min-width:0}.aboutCard h2{margin:0 0 8px;font-size:1.05rem}.aboutCard img{width:100%;height:auto;border-radius:16px;display:block}@media (max-width: 420px){.aboutCard img{height:clamp(140px,42vw,200px);object-fit:cover}}.aboutList{margin:0;padding-left:18px;color:var(--muted);line-height:1.5}.aboutMeta{margin:10px 0 0;color:var(--muted);font-size:.95rem}.aboutFooter{margin-top:16px;color:var(--muted);line-height:1.5}.pillBtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:#ffffffeb;font-size:13px;line-height:1;cursor:pointer;-webkit-user-select:none;user-select:none;text-decoration:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .12s ease,background .12s ease,border-color .12s ease}.pillBtn:hover{background:#ffffff1a;border-color:#ffffff38;transform:translateY(-1px)}.pillBtn:active{transform:translateY(0)}.pillBtn:focus-visible{outline:2px solid rgba(255,255,255,.35);outline-offset:2px}.pillBtn.icon{padding:6px}.md h2,.md h3,.md h4{margin:0 0 10px}.mdP{margin:10px 0;color:var(--muted);line-height:1.6}.mdList{margin:8px 0;padding-left:18px;color:var(--muted);line-height:1.6}.mdInlineCode{padding:2px 6px;border-radius:10px;border:1px solid var(--border);background:#00000040;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.95em}.mdCode{margin:12px 0;padding:10px;border-radius:var(--radius);border:1px solid var(--border);background:#00000059;overflow:auto}.mdCodeLang{font-size:.85rem;color:var(--muted);margin-bottom:6px}.mdGallery{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}.mdImg{width:100%;max-width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.mdGallery .mdImg{flex:1 1 260px}.clickableCard{cursor:pointer;transition:transform .12s ease,background .12s ease,border-color .12s ease}.clickableCard:hover{background:#ffffff0f;border-color:#ffffff38;transform:translateY(-2px)}.clickableCard:focus-visible{outline:2px solid rgba(255,255,255,.35);outline-offset:2px}.projectCta{margin:10px 0 6px;font-size:13px;opacity:.65;color:#ffffffd9;transition:opacity .12s ease,transform .12s ease}.clickableCard:hover .projectCta{opacity:1;transform:translateY(-1px)}@media (max-width: 420px){.pageCard{max-width:100%;padding:16px 14px}.aboutCard{padding:12px}.center{padding:12px 10px}}:root{color-scheme:dark}