:root{color-scheme:light dark;--c-bg: #f5f6fa;--c-surface: #ffffff;--c-text: #1f2330;--c-text-muted: #6b7280;--c-border: #e1e4eb;--c-primary: #3553e3;--c-primary-dark: #2740b8;--c-success: #1f8a4a;--c-success-bg: #e2f5e9;--c-warning: #c47a00;--c-danger: #c4313b;--c-danger-bg: #fbe6e8;--c-info: #1c6db5;--c-info-bg: #e0eefb;--c-input-bg: #ffffff;--c-overlay: rgba(15, 18, 30, .45);--c-cell-hover: rgba(53, 83, 227, .05);--c-danger-hover: #a52731;--r-sm: 4px;--r-md: 8px;--r-lg: 12px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-8: 48px}@media(prefers-color-scheme:dark){:root{--c-bg: #0f1115;--c-surface: #1a1d27;--c-text: #e8eaf0;--c-text-muted: #9aa0ac;--c-border: #2c303c;--c-primary: #6c8aff;--c-primary-dark: #5572e0;--c-success: #4ad580;--c-success-bg: #143524;--c-warning: #f5b441;--c-danger: #ff7a85;--c-danger-bg: #3a1518;--c-info: #6cb0ff;--c-info-bg: #102d44;--c-input-bg: #232735;--c-overlay: rgba(0, 0, 0, .65);--c-cell-hover: rgba(108, 138, 255, .1);--c-danger-hover: #ff9aa3;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 4px 12px rgba(0, 0, 0, .5)}}*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.5;color:var(--c-text);background:var(--c-bg)}a{color:var(--c-primary);text-decoration:none}a:hover{text-decoration:underline}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:10px 18px;border:1px solid var(--c-primary);border-radius:var(--r-md);background:var(--c-primary);color:#fff;font-size:.95rem;font-weight:500;cursor:pointer;transition:background-color .15s,border-color .15s}.btn:hover:not(:disabled){background:var(--c-primary-dark);border-color:var(--c-primary-dark)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--ghost{background:transparent;color:var(--c-text);border-color:var(--c-border)}.btn--ghost:hover:not(:disabled){background:var(--c-bg);border-color:var(--c-text-muted)}.btn--danger{background:var(--c-danger);border-color:var(--c-danger);color:#fff}.btn--danger:hover:not(:disabled){background:var(--c-danger-hover);border-color:var(--c-danger-hover)}.btn--block{width:100%}label{display:block;font-size:.9rem;color:var(--c-text-muted);margin-bottom:var(--space-1)}input[type=text],input[type=number],input[type=password],input[type=email],select{width:100%;padding:10px 12px;border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-input-bg);font:inherit;color:inherit}input[type=text]:focus,input[type=number]:focus,input[type=password]:focus,input[type=email]:focus,select:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px #3553e326}input[type=text].is-invalid,input[type=number].is-invalid,input[type=password].is-invalid,input[type=email].is-invalid,select.is-invalid{border-color:var(--c-danger)}input[type=text].is-invalid:focus,input[type=number].is-invalid:focus,input[type=password].is-invalid:focus,input[type=email].is-invalid:focus,select.is-invalid:focus{box-shadow:0 0 0 3px #c4313b26}.form-group{margin-bottom:var(--space-4)}.form-error{margin-top:var(--space-1);color:var(--c-danger);font-size:.85rem}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:var(--space-5);box-shadow:var(--shadow-sm)}.alert{padding:var(--space-3) var(--space-4);border-radius:var(--r-md);margin-bottom:var(--space-4);font-size:.95rem}.alert--error{background:var(--c-danger-bg);color:var(--c-danger)}.alert--success{background:var(--c-success-bg);color:var(--c-success)}.alert--info{background:var(--c-info-bg);color:var(--c-info)}.app-header{display:grid;grid-template-columns:1fr auto;grid-template-areas:"brand user" "nav nav";align-items:center;gap:var(--space-2) var(--space-3);background:var(--c-surface);border-bottom:1px solid var(--c-border);padding:var(--space-2) var(--space-3)}.app-header .brand{grid-area:brand;font-weight:600;font-size:1.05rem}.app-header .nav{grid-area:nav;display:flex;gap:var(--space-1);overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin:0 calc(var(--space-3) * -1);padding:0 var(--space-3)}.app-header .nav::-webkit-scrollbar{display:none}.app-header .nav a{color:var(--c-text-muted);padding:var(--space-2) var(--space-3);border-radius:var(--r-sm);text-decoration:none;white-space:nowrap;font-size:.9rem}.app-header .nav a:hover{color:var(--c-text);background:var(--c-bg)}.app-header .nav a.active{color:var(--c-primary);font-weight:500}.app-header .user-menu-wrap{grid-area:user;position:relative}.user-trigger{display:inline-flex;align-items:center;gap:var(--space-2);padding:6px 10px;border:1px solid transparent;border-radius:var(--r-md);background:transparent;color:var(--c-text);font:inherit;cursor:pointer;transition:background-color .15s,border-color .15s}.user-trigger .nick{color:var(--c-text-muted);font-size:.85rem;max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-trigger .badge{font-size:.7rem;padding:2px 6px;border-radius:999px;background:var(--c-info-bg);color:var(--c-info);text-transform:uppercase;letter-spacing:.5px}.user-trigger .chev{color:var(--c-text-muted);transition:transform .15s}.user-trigger:hover,.user-trigger.is-open{background:var(--c-bg);border-color:var(--c-border)}.user-trigger.is-open .chev{transform:rotate(180deg)}.user-menu{position:absolute;top:calc(100% + 4px);right:0;min-width:200px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-md);box-shadow:var(--shadow-md);padding:var(--space-1);z-index:50;display:flex;flex-direction:column}.user-menu a,.user-menu button{display:flex;align-items:center;gap:var(--space-2);padding:10px 12px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--c-text);text-decoration:none;font:inherit;text-align:left;cursor:pointer;transition:background-color .12s,color .12s}.user-menu a svg,.user-menu button svg{color:var(--c-text-muted);flex-shrink:0}.user-menu a:hover,.user-menu button:hover{background:var(--c-bg);text-decoration:none}.user-menu a:hover svg,.user-menu button:hover svg{color:var(--c-text)}.user-menu a.active,.user-menu button.active{color:var(--c-primary)}.user-menu a.active svg,.user-menu button.active svg{color:var(--c-primary)}.user-menu a.danger:hover,.user-menu button.danger:hover{color:var(--c-danger)}.user-menu a.danger:hover svg,.user-menu button.danger:hover svg{color:var(--c-danger)}@media(min-width:720px){.user-trigger{padding:6px 12px}.user-trigger .nick{font-size:1rem;max-width:none}}@media(min-width:720px){.app-header{display:flex;gap:var(--space-5);padding:0 var(--space-5);height:56px}.app-header .brand{font-size:1.1rem}.app-header .nav{flex:1;gap:var(--space-3);overflow:visible;margin:0;padding:0}.app-header .nav a{font-size:1rem}}.app-main{max-width:960px;margin:0 auto;padding:var(--space-4) var(--space-3)}@media(min-width:720px){.app-main{padding:var(--space-5) var(--space-4)}}.dialog-backdrop{position:fixed;inset:0;background:var(--c-overlay);display:flex;align-items:center;justify-content:center;z-index:100}.dialog{background:var(--c-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-md);padding:var(--space-4);max-width:420px;width:calc(100% - var(--space-4) * 2);max-height:calc(100vh - var(--space-4) * 2);overflow-y:auto}@media(min-width:480px){.dialog{padding:var(--space-5);width:90%}}.dialog h3{margin:0 0 var(--space-3);font-size:1.15rem}.dialog p{margin:0 0 var(--space-5);color:var(--c-text-muted)}.dialog .dialog-actions{display:flex;gap:var(--space-3);justify-content:flex-end}.toast-container{position:fixed;bottom:var(--space-5);right:var(--space-5);z-index:200;display:flex;flex-direction:column;gap:var(--space-2)}.toast{background:var(--c-surface);border:1px solid var(--c-border);border-left:4px solid var(--c-primary);border-radius:var(--r-md);padding:var(--space-3) var(--space-4);box-shadow:var(--shadow-md);min-width:240px;max-width:380px;animation:toast-in .18s ease-out}.toast--error{border-left-color:var(--c-danger)}.toast--success{border-left-color:var(--c-success)}@keyframes toast-in{0%{transform:translate(20px);opacity:0}to{transform:translate(0);opacity:1}}
