:root{--bg: oklch(.165 .013 264);--bg-elev: oklch(.185 .014 264);--panel: oklch(.205 .015 264);--chip: oklch(.255 .016 264);--chip-hi: oklch(.3 .017 264);--hairline: oklch(.305 .016 264);--border-hi: oklch(.44 .018 264);--text-hi: oklch(.965 .006 264);--text-mid: oklch(.79 .012 264);--text-low: oklch(.64 .014 264);--text-faint: oklch(.52 .014 264);--mint: oklch(.85 .15 172);--mint-dim: oklch(.85 .15 172 / .15);--amber: oklch(.83 .13 78);--amber-dim: oklch(.83 .13 78 / .15);--red: oklch(.71 .17 22);--red-dim: oklch(.71 .17 22 / .16);--accent-solid: var(--mint);--accent-on: oklch(.22 .04 172);--badge: oklch(.68 .2 32);--badge-on: oklch(.99 0 0);--shadow-sm: 0 1px 2px oklch(0 0 0 / .3);--shadow-md: 0 4px 16px oklch(0 0 0 / .34);--shadow-lg: 0 18px 48px oklch(0 0 0 / .5);--ring: 0 0 0 3px oklch(.85 .15 172 / .28);--font-display: "Fraunces", "Instrument Serif", Georgia, serif;--font-body: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;color-scheme:dark}:root[data-theme=light]{--bg: oklch(.972 .004 250);--bg-elev: oklch(.986 .003 250);--panel: oklch(.995 .0015 250);--chip: oklch(.945 .006 255);--chip-hi: oklch(.915 .008 255);--hairline: oklch(.915 .006 255);--border-hi: oklch(.82 .012 255);--text-hi: oklch(.255 .021 264);--text-mid: oklch(.435 .021 264);--text-low: oklch(.545 .019 264);--text-faint: oklch(.625 .015 264);--mint: oklch(.56 .12 168);--mint-dim: oklch(.56 .12 168 / .12);--amber: oklch(.62 .12 66);--amber-dim: oklch(.7 .12 78 / .16);--red: oklch(.55 .19 25);--red-dim: oklch(.63 .19 25 / .12);--accent-solid: oklch(.61 .14 164);--accent-on: oklch(.995 0 0);--badge: oklch(.6 .2 30);--badge-on: oklch(.995 0 0);--shadow-sm: 0 1px 2px oklch(.5 .03 264 / .08);--shadow-md: 0 6px 20px oklch(.5 .03 264 / .1);--shadow-lg: 0 22px 52px oklch(.45 .04 264 / .16);--ring: 0 0 0 3px oklch(.61 .14 164 / .24);color-scheme:light}*{box-sizing:border-box;margin:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--text-hi);font-family:var(--font-body);font-size:15px;line-height:1.55;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body,.sidebar,.card,.okul-card,.okul-stat,.nav-item,.btn,.tenant-select{transition:background-color .2s ease,border-color .2s ease,color .2s ease}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}:focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px}*{scrollbar-width:thin;scrollbar-color:var(--border-hi) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--border-hi);border-radius:99px;border:3px solid var(--bg)}*::-webkit-scrollbar-thumb:hover{background:var(--text-faint)}::selection{background:var(--mint-dim);color:var(--text-hi)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.wordmark{display:inline-flex;align-items:center}.wordmark-mark{display:block;width:auto;height:40px}.kicker{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-faint)}.mono{font-family:var(--font-mono);font-size:.92em}.login-stage{min-height:100%;display:grid;place-items:center;padding:24px}.login-card{width:min(400px,100%);background:var(--panel);border:1px solid var(--hairline);border-radius:10px;padding:40px 36px 32px}.login-card .wordmark-mark{height:58px}.login-thesis{margin:6px 0 32px;color:var(--text-low);font-size:14px}.login-thesis em{color:var(--mint);font-style:normal}.field{margin-bottom:16px}.field label{display:block;margin-bottom:6px;font-size:13px;color:var(--text-mid)}.field input{width:100%;background:var(--bg);border:1px solid var(--hairline);border-radius:6px;padding:10px 12px;color:var(--text-hi);font:inherit}.field input:focus{border-color:var(--border-hi);outline:none}.btn{display:inline-flex;align-items:center;gap:8px;background:var(--chip);color:var(--text-hi);border:1px solid var(--hairline);border-radius:6px;padding:9px 16px;font-weight:500;transition:border-color .15s}.btn:hover{border-color:var(--border-hi)}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--accent-solid);color:var(--accent-on);border-color:transparent;font-weight:600;box-shadow:var(--shadow-sm)}.btn-primary:hover{filter:brightness(1.06);border-color:transparent}.btn-block{width:100%;justify-content:center}.form-error{margin:0 0 16px;padding:10px 12px;border:1px solid var(--red);background:var(--red-dim);border-radius:6px;color:var(--red);font-size:13px}.frame{display:grid;grid-template-columns:236px 1fr;height:100%}.sidebar{background:var(--panel);border-right:1px solid var(--hairline);display:flex;flex-direction:column;padding:20px 14px;gap:4px;box-shadow:var(--shadow-sm);z-index:1}.sidebar .wordmark{padding:0 10px 18px}.nav-section{margin-top:14px}.nav-section .kicker{padding:0 10px 8px;display:block}.nav-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:6px;color:var(--text-mid);font-size:14px}.nav-item:hover,.nav-item.active{background:var(--chip);color:var(--text-hi)}.nav-ico{width:18px;height:18px;flex:none;color:var(--text-low)}.nav-item:hover .nav-ico,.nav-item.active .nav-ico{color:inherit}.nav-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-badge{flex:none;min-width:19px;height:19px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:var(--badge);color:var(--badge-on);font-size:11px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.module-nav .nav-item.active{background:var(--accent-solid);color:var(--accent-on)}.module-nav .nav-item.active:hover{background:var(--accent-solid);filter:brightness(1.04)}.module-nav .nav-item.active .nav-ico{color:var(--accent-on)}.module-nav{margin-top:12px}.module-nav+.module-nav{margin-top:16px}.nav-item .dot{width:6px;height:6px;border-radius:50%;background:var(--mint);flex:none}.nav-item.shop{font-family:var(--font-mono);font-size:13px}.module-back{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:none;border-radius:6px;padding:8px 10px;margin-bottom:2px;color:var(--text-mid);font-family:var(--font-mono);font-size:12.5px;letter-spacing:.02em}.module-back:hover{background:var(--chip);color:var(--mint)}.module-back span{font-size:15px;line-height:1}.module-title{font-family:var(--font-display);font-size:23px;font-weight:500;font-optical-sizing:auto;letter-spacing:-.01em;padding:6px 10px 2px;border-top:1px solid var(--hairline);margin-top:4px}.nav-empty{padding:8px 10px;color:var(--text-faint);font-size:13px}.nav-empty a{color:var(--mint)}.sidebar-foot{margin-top:auto;border-top:1px solid var(--hairline);padding-top:14px;display:flex;flex-direction:column;gap:10px}.tenant-select{appearance:none;background:var(--chip);color:var(--text-mid);border:1px solid var(--hairline);border-radius:6px;padding:6px 8px;font-size:12px;cursor:pointer}.tenant-select:hover{border-color:var(--border-hi);color:var(--text-hi)}.tenant-chip{display:flex;flex-direction:column;gap:2px;padding:0 10px}.tenant-chip .name{font-size:13.5px;font-weight:500}.tenant-chip .slug{color:var(--text-faint)}.linklike{background:none;border:none;color:var(--text-low);text-align:left;padding:4px 10px;font-size:13px;border-radius:6px}.linklike:hover{color:var(--text-hi);background:var(--chip)}.theme-toggle{display:flex;align-items:center;gap:8px;background:none;border:none;color:var(--text-low);text-align:left;padding:6px 10px;font-size:13px;border-radius:6px}.theme-toggle:hover{color:var(--text-hi);background:var(--chip)}.theme-toggle svg{width:16px;height:16px;flex:none}.main{overflow-y:auto;padding:36px 44px}.page-title{font-family:var(--font-display);font-size:36px;font-weight:500;font-optical-sizing:auto;letter-spacing:-.01em;line-height:1.1;margin-bottom:4px}.page-sub{color:var(--text-low);margin-bottom:32px;font-size:14px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.card{background:var(--panel);border:1px solid var(--hairline);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-sm);transition:box-shadow .18s ease,border-color .18s ease,transform .18s ease}.card:hover{box-shadow:var(--shadow-md);border-color:var(--border-hi)}.card h3{font-size:16px;font-weight:600}.card .desc{color:var(--text-low);font-size:13.5px;flex:1}.card-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.price{color:var(--text-mid);font-size:14px}.tag{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:99px;font-family:var(--font-mono);font-size:11.5px;background:var(--chip);color:var(--text-mid)}.tag.live{background:var(--mint-dim);color:var(--mint)}.stat-list{display:flex;flex-direction:column}.stat-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:13px 2px;border-bottom:1px solid var(--hairline)}.stat-row:last-child{border-bottom:none}.stat-row .k{color:var(--text-low);font-size:13.5px}.stat-row .v{font-family:var(--font-mono);font-size:13.5px}.toast{position:fixed;bottom:24px;right:24px;background:var(--chip);border:1px solid var(--border-hi);border-left:3px solid var(--mint);border-radius:8px;padding:12px 18px;font-size:14px;animation:toast-in .25s ease-out}@keyframes toast-in{0%{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}.module-stage{min-height:60vh}.stage-note{border:1px dashed var(--hairline);border-radius:10px;padding:40px;text-align:center;color:var(--text-low)}.spinner{width:18px;height:18px;border:2px solid var(--hairline);border-top-color:var(--mint);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:760px){.frame{grid-template-columns:1fr}.sidebar{flex-direction:row;flex-wrap:wrap;align-items:center}.sidebar-foot{margin-top:0;border:none;padding:0}.main{padding:24px 18px}}.field select{width:100%;background:var(--bg);border:1px solid var(--hairline);border-radius:6px;padding:10px 12px;color:var(--text-hi);font:inherit;cursor:pointer}.field select:focus{border-color:var(--border-hi);outline:none}.btn-danger{background:var(--red-dim);color:var(--red);border-color:transparent;font-weight:600}.btn-danger:hover{border-color:var(--red)}.nav-item.shop.suspended,.nav-item.shop.revoked{color:var(--text-faint);cursor:default}.nav-item.shop.suspended:hover,.nav-item.shop.revoked:hover{background:none;color:var(--text-faint)}.nav-item.shop.suspended .dot{background:var(--amber)}.nav-item.shop.revoked .dot{background:var(--text-faint)}.shop-status{flex:none;font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint)}.nav-item.shop.suspended .shop-status{color:var(--amber)}.notif{position:relative}.notif-bell{position:relative;width:100%}.notif-panel{position:absolute;bottom:calc(100% + 6px);left:0;right:0;max-height:340px;overflow-y:auto;background:var(--bg-elev);border:1px solid var(--border-hi);border-radius:10px;box-shadow:var(--shadow-lg);padding:6px;z-index:20;animation:toast-in .16s ease-out}.notif-head{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 6px}.notif-item{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;background:none;border:none;border-radius:6px;padding:8px 10px}.notif-item:hover{background:var(--chip)}.notif-item.unread{background:var(--mint-dim)}.notif-item.unread:hover{filter:brightness(1.05)}.notif-title{font-size:13px;font-weight:500;color:var(--text-hi)}.notif-body{font-size:12px;color:var(--text-low)}.modal-backdrop{position:fixed;inset:0;background:#00000080;display:grid;place-items:center;padding:24px;z-index:50;animation:toast-in .18s ease-out}.modal{width:min(420px,100%);cursor:default}.modal h3{font-size:18px;font-weight:600}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:4px}
