body.hq-locked #shell,body.hq-locked #modal{display:none}
#hq{position:fixed;inset:0;z-index:9999;overflow:auto;font-family:'Hanken Grotesk',system-ui,sans-serif;
  background:linear-gradient(rgba(10,20,14,.55),rgba(10,20,14,.55)),url('/login-bg.jpg') center/cover no-repeat,#1C3B29}
.hq-wrap{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.hq-card{background:#fff;color:#1A1A1A;width:100%;max-width:440px;box-shadow:0 2px 6px rgba(0,0,0,.3),0 12px 40px rgba(0,0,0,.3);color-scheme:light}
.hq-main{padding:32px 44px 28px}
.hq-logo img{display:block;width:210px;max-width:100%;height:auto}
.hq-card h1{font:600 24px 'Hanken Grotesk',system-ui,sans-serif;margin:22px 0 14px;color:#1A1A1A}
.hq-card label{display:block;font-weight:600;font-size:14px;margin:12px 0 4px}
.hq-card input{width:100%;box-sizing:border-box;padding:10px 4px;border:0;border-bottom:1px solid #666;border-radius:0;font:inherit;font-size:16px;background:#fff !important;color:#1A1A1A !important;-webkit-text-fill-color:#1A1A1A;caret-color:#1A1A1A}
.hq-card input:-webkit-autofill{box-shadow:0 0 0 100px #fff inset}
.hq-card input:focus{outline:0;border-bottom:2px solid #9D7106}
.hq-btn{display:block;margin:22px 0 0 auto;min-width:108px;padding:9px 22px;border:0;background:#22412F;color:#fff;font:600 15px 'Hanken Grotesk',system-ui,sans-serif;cursor:pointer}
.hq-btn:hover{background:#1C3B29}
.hq-btn:disabled{opacity:.6;cursor:wait}
.hq-link{margin:10px 0 0}
.hq-link button{background:none;border:0;padding:0;color:#76530A;cursor:pointer;font:inherit;font-size:14px}
.hq-link button:hover{text-decoration:underline}
.hq-msg{color:#B3261E;min-height:1.2em;margin:12px 0 0;font-size:14px}
.hq-msg.good{color:#1E7A47}
.hq-note{color:#566A5D;font-size:13px;margin:10px 0 0}
.hq-legal{background:#F2F2F2;padding:20px 44px;font-size:14px;line-height:1.45;color:#1A1A1A}
@media (max-width:480px){.hq-main,.hq-legal{padding-left:24px;padding-right:24px}}

/* ---- layout polish ---- */
html,body{margin:0;padding:0}
.shell.side-min{grid-template-columns:84px minmax(0,1fr)}
.shell.side-min aside{padding:14px 10px;align-items:center}
.shell.side-min .rail{gap:2px;margin-top:2px}
.railbtn{width:64px;height:54px;flex-direction:column;gap:3px;display:flex;align-items:center;justify-content:center;border-radius:12px}
.railbtn svg{width:21px;height:21px}
.railbtn .rl{font-size:10.5px;line-height:1;letter-spacing:.01em;opacity:.78;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.railbtn.on .rl,.railbtn[aria-expanded=true] .rl{opacity:1}
/* pop-out: light flat panel with a pointer */
aside .flyout{left:92px;width:240px;padding:10px;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:visible}
aside .flyout::before{content:"";position:absolute;left:-6px;top:var(--arrow,27px);width:11px;height:11px;background:var(--surface);border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
aside .flyout .flytitle{color:var(--muted);opacity:1;margin:4px 8px 8px;font-size:11px}
aside .flyout .navbtn{color:var(--fg);padding:9px 10px;border-radius:8px;font-size:14px}
aside .flyout .navbtn:hover{background:var(--surface2)}
aside .flyout .navbtn[aria-current=true]{background:var(--accent-soft);color:var(--accent-ink);font-weight:600}
aside .flyout .navbtn .ico{color:var(--accent)}
aside .flyout .navbtn .ct{color:var(--muted)}
aside .flyout .sub{color:var(--muted)}
/* full sidebar: tighter, quieter */
aside .acct-toggle{font-size:14.5px}
aside .grphead .btn{opacity:.7}
.sidebottom{border-top-color:color-mix(in srgb,var(--side-fg) 14%,transparent)}

/* ---- edge arrow ---- */
.sidetoggle{display:none!important}
.edgetoggle{position:fixed;top:30px;left:292px;width:24px;height:24px;padding:0;border-radius:50%;background:var(--surface);color:var(--fg);border:1px solid var(--line);box-shadow:var(--shadow);display:grid;place-items:center;cursor:pointer;z-index:50;transition:background .12s,transform .12s}
.edgetoggle:hover{background:var(--surface2)}
.edgetoggle svg{transition:transform .15s}
.shell:not(.side-min) .edgetoggle svg{transform:rotate(180deg)}
.shell.side-min .edgetoggle{left:72px}
@media (max-width:860px){.edgetoggle{display:none}}

/* ---- full sidebar: icon strip + page list ---- */
.shell.split{grid-template-columns:320px minmax(0,1fr)}
aside.split{display:flex;flex-direction:row;gap:0;padding:0;overflow:hidden}
.split .rail2{width:84px;flex:none;display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 10px;background:color-mix(in srgb,var(--side-bg) 84%,#000);overflow-y:auto;scrollbar-width:none}
.split .rail2::-webkit-scrollbar{display:none}
.split .rail2 .wsmenu{margin-bottom:8px}
.split .rail{margin-top:0}
.split .railbtn{position:relative}
.split .railbtn.here:not(.on)::after{content:"";position:absolute;top:8px;right:10px;width:6px;height:6px;border-radius:50%;background:var(--side-accent)}
.split .panel2{flex:1;min-width:0;display:flex;flex-direction:column;padding:14px 12px 12px;overflow-y:auto;border-left:1px solid rgba(0,0,0,.22)}
.split .panel2 .sidehead,.split .panel2 .wsmenu{width:100%}
.split .panel2 .wsbtn{width:100%;height:46px;display:flex;align-items:center;gap:8px;padding:0 8px;margin-bottom:0;border-radius:0;border-bottom:1px solid color-mix(in srgb,var(--side-fg) 14%,transparent);font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:-.01em}
.split .panel2 .wsbtn .logo,.split .panel2 .wsbtn .mark{display:none}
.split .panel2 .wsbtn .wsname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.split .panel2 .wsbtn .chev{opacity:.6;font-size:12px}
.paneltitle{display:flex;align-items:center;justify-content:space-between;margin:18px 8px 10px}
.paneltitle h3{font-size:20px;margin:0;color:var(--side-fg)}
.panelnav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px}
.panelnav li{list-style:none}
.panelnav .navbtn{height:38px;padding:0 10px;border-radius:9px;font-size:14.5px;font-weight:500;color:color-mix(in srgb,var(--side-fg) 86%,transparent)}
.panelnav .navbtn:hover{background:color-mix(in srgb,var(--side-fg) 9%,transparent)}
.panelnav .navbtn[aria-current=true]{background:rgba(216,165,49,.2);color:#fff;font-weight:600}
.panelnav .sub{color:color-mix(in srgb,var(--side-fg) 60%,transparent);font-size:13.5px}
.split .panel2 .sidebottom{position:static;margin-top:auto;padding:12px 0 0;bottom:auto}
.split .mepop{left:98px}
.split .wspop{left:98px;top:20px}
.shell.split .edgetoggle{left:308px}
@media (max-width:860px){.shell.split{grid-template-columns:minmax(0,1fr)}}
aside.split{z-index:55}
/* account and workspace pop-ups: same light panel as the page list pop-out */
aside .wspop,aside .mepop{--side-fg:var(--fg);--sm:var(--muted);--sh:var(--surface2);--sl:var(--line);color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
aside .wspop .sub,aside .mepop .sub,aside .wspop .lbl,aside .mepop .lbl{color:var(--muted)}
aside .wspop .btn,aside .mepop .btn{background:var(--surface);color:var(--fg);border-color:var(--line)}
aside .wspop .btn:hover{background:var(--surface2)}
aside .wsitem,aside .merow{color:var(--fg)}
aside .wsitem:hover,aside .merow:hover{background:var(--surface2)}
aside .wscard .mark{background:#D8A531}
aside .mepop .stseg button,aside .mepop .themeseg button{background:var(--surface2);color:var(--fg);border-color:transparent}
aside .mepop .stseg button[aria-pressed=true],aside .mepop .themeseg button[aria-pressed=true],aside .mepop .stseg .on,aside .mepop .themeseg .on{background:var(--accent-soft);border-color:var(--accent)}
aside .mepop hr,aside .mepop .sep{border-color:var(--line2)}
.edgetoggle{z-index:56}
aside:has(.wspop,.mepop,.flyout)~.edgetoggle{display:none}