:root{--c1:#320315;--c2:#47061b;--c3:#c9a46b;
--serif:Georgia,"Iowan Old Style","Palatino Linotype",serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
--side:var(--c1);--bg:#f8f3f0;--card:#fff;--ink:#2a1a1f;--mut:#7a6d69;--line:#eadfd9;--acc:var(--c2);--onacc:#fff;--warn:#b5523b;color-scheme:light}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--side:color-mix(in srgb,var(--c1) 72%,#000);--bg:#1c0b12;--card:#2a1119;--ink:#f1e6e4;--mut:#b6a0a6;--line:#44222d;--acc:var(--c3);--onacc:#1c0b12;--warn:#ec9a82;color-scheme:dark}}
:root[data-theme="dark"]{--side:color-mix(in srgb,var(--c1) 72%,#000);--bg:#1c0b12;--card:#2a1119;--ink:#f1e6e4;--mut:#b6a0a6;--line:#44222d;--acc:var(--c3);--onacc:#1c0b12;--warn:#ec9a82;color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font:15px/1.5 var(--sans);background:var(--bg);color:var(--ink);padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
.app{display:flex;min-height:100%}
nav{width:236px;background:var(--side);color:#d9dfda;padding:16px 12px;overflow-y:auto;position:sticky;top:0;height:100vh;flex:none;display:flex;flex-direction:column}
.brand{padding:6px 14px 14px;text-align:center}.brand img{max-width:100%;max-height:130px;object-fit:contain}
.grp{font-size:11px;letter-spacing:.06em;color:var(--c3);padding:14px 10px 4px}
nav a{display:block;padding:7px 10px;border-radius:8px;color:#e6ebe7;text-decoration:none;font-size:14px}
nav a:hover{background:rgba(255,255,255,.08)}
nav a.on{background:rgba(255,255,255,.14);color:#fff;box-shadow:inset 3px 0 var(--c3)}
nav .who{margin-top:auto;padding:14px 10px 0;font-size:13px;color:#c9d1cb;border-top:1px solid rgba(255,255,255,.12)}
nav .who button{background:none;border:0;color:var(--c3);cursor:pointer;font:inherit;padding:0;margin-top:2px}
main{flex:1;padding:28px 32px 90px;max-width:1000px;min-width:0}
h1{font:400 34px var(--serif);margin:0}
h2{font:600 21px var(--serif);margin:0 0 10px}
.sub{color:var(--mut)}
.top{margin-bottom:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:14px}
.btn{border:1px solid var(--line);background:var(--card);color:var(--ink);padding:8px 14px;border-radius:9px;font:inherit;cursor:pointer;text-decoration:none;display:inline-block}
.btn.p{background:var(--acc);border-color:var(--acc);color:var(--onacc)}
.btn:disabled{opacity:.6;cursor:wait}
.btn:focus-visible,a:focus-visible,input:focus-visible,nav button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.row{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.row:first-of-type{border-top:0}
.grow{flex:1;min-width:0}
label{display:block;margin:10px 0 0;font-size:14px;color:var(--mut)}
input:not([type=color]):not([type=file]){display:block;width:100%;margin-top:4px;padding:10px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit}
.hex{width:110px!important;margin:0!important}
input[type=color]{width:44px;height:36px;border:1px solid var(--line);border-radius:8px;background:none;padding:2px;cursor:pointer}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.seg button{border:0;background:var(--card);color:var(--ink);padding:8px 14px;font:inherit;cursor:pointer}
.seg button.on{background:var(--acc);color:var(--onacc)}
.logo-prev{background:var(--side);border-radius:12px;padding:16px;max-width:280px}.logo-prev img{max-width:100%;max-height:110px;display:block;margin:auto}
.err{color:var(--warn);min-height:1.2em;margin:8px 0}
.ok{color:var(--acc);margin:8px 0}
.plain{display:flex;justify-content:center;padding:24px}
.box{width:100%;max-width:460px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;align-self:flex-start}
.narrow{max-width:380px;margin-top:8vh}
.logo-login{display:block;max-width:220px;max-height:140px;margin:0 auto 12px;background:var(--c1);border-radius:12px;padding:14px}
.plain .btn.p{width:100%;margin-top:14px;padding:11px}
#burger{display:none;position:fixed;left:12px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:30}
@media(max-width:860px){
 nav{position:fixed;z-index:40;left:0;top:0;transform:translateX(-100%);transition:transform .2s}
 nav.open{transform:none}
 #burger{display:inline-block}
 main{padding:18px 16px 90px}
}
@media(prefers-reduced-motion:reduce){nav{transition:none}}