:root{--bg: #EEF0F4;--surface: #FFFFFF;--surface-2: #F3F5F9;--surface-3: #F6F7FB;--border: #E6E9F0;--border-strong: #DDE2EA;--track: #E9ECF2;--pill-bg: #E4E7EE;--navy: #0F1E2E;--text: #0F1E2E;--muted: #5B6472;--muted-2: #6B7480;--placeholder: #8A93A0;--accent: #2BD47A;--accent-soft: #E7F8EE;--accent-ring: #9FE2BD;--accent-border: #C6F0D8;--green: #15803D;--green-dot: #22C55E;--amber: #B45309;--amber-soft: #FEF3DF;--amber-bar: #F59E0B;--red: #DC2626;--red-soft: #FEE2E2;--red-cell: #FEF0F0;--red-cell-border: #F5B5B7;--red-text: #B91C1C;--blue: #1E56E8;--idle: #CBD2DC;--font: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;--mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--display: "Space Grotesk", var(--font);--r-sm: 6px;--r-md: 10px;--r-lg: 12px;--r-xl: 16px;--r-card: 20px;--r-2xl: 24px;--shadow-card: 0 1px 2px rgba(15, 30, 61, .04);--shadow-hover: 0 6px 18px rgba(15, 30, 61, .07);--shadow-float: 0 12px 32px rgba(15, 30, 61, .14);--ease: cubic-bezier(.2, .7, .2, 1)}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:13px;line-height:1.45;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--text)}a:hover{color:var(--green)}h1,h2,h3{margin:0;font-weight:600}h1{font-size:22px;letter-spacing:-.01em}h2{font-size:14px}button{font-family:inherit}.mono{font-family:var(--mono)}.muted{color:var(--muted)}.small{font-size:12px}.app{display:flex;min-height:100vh}.app>nav{flex:0 0 56px;border-right:1px solid var(--border);background:var(--bg)}.app>nav .logo{display:block;margin-bottom:14px}.app>nav .rail{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:4px}.app>main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}.hdr{display:flex;background:var(--surface);align-items:center;gap:16px;padding:12px 24px;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:6}.pad{padding:24px;display:flex;flex-direction:column;gap:20px}.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}.span-3{grid-column:span 3}.span-4{grid-column:span 4}.span-5{grid-column:span 5}.span-7{grid-column:span 7}.span-8{grid-column:span 8}.span-12{grid-column:span 12}.rb{width:40px;height:40px;border:0;border-radius:10px;background:transparent;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative;transition:background .15s,color .15s}.rb:hover{background:#eef1f6;color:var(--text)}.rb[data-on="1"]{background:var(--accent-soft);color:var(--text)}.rb:focus-visible,.bt:focus-visible,.in:focus-visible,.cell:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.rb .tip{position:absolute;left:52px;top:50%;transform:translateY(-50%);background:var(--navy);color:#fff;font-size:12px;padding:6px 10px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s;z-index:5}.rb:hover .tip{opacity:1}.srf{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-card);transition:box-shadow .15s,border-color .15s}.srf:hover{box-shadow:var(--shadow-hover);border-color:var(--border-strong)}.srf:focus-within{border-color:var(--border-strong)}.srf.celebra{background:var(--accent-soft);border-color:var(--accent-border)}.srf.dashed{border-style:dashed}.row{transition:background .15s;border-radius:10px}.row:hover{background:var(--surface-3)}.bt{height:40px;border:0;border-radius:10px;padding:0 16px;font:600 13px var(--font);cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:filter .15s,background .15s,transform .15s,box-shadow .15s;text-decoration:none}.bt:hover{filter:brightness(.97);transform:translateY(-1px);box-shadow:0 4px 12px #0f1e3d1a}.bt:active{transform:scale(.98);box-shadow:none}.bt:disabled{cursor:not-allowed;filter:none;opacity:.45;transform:none;box-shadow:none}.bt.primary{background:var(--navy);color:#fff}.bt.secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.bt.ghost{background:transparent;color:var(--muted);border:1px solid var(--border-strong)}.bt.sm{height:32px;padding:0 12px;font-size:12px}.bt.outline{background:var(--surface);color:var(--text);border:1px solid var(--border-strong)}.in{height:40px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);padding:0 14px;font:14px var(--font);width:100%}.in.icon{padding-left:38px}.in::placeholder{color:var(--placeholder)}textarea.in{height:auto;padding:10px 14px;resize:vertical}.cell{height:44px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);font:500 12px var(--font);cursor:pointer;transition:background .15s,border-color .15s,transform .12s}.cell[data-p="1"]{background:var(--accent-soft);border-color:var(--accent-ring)}.cell[data-p="0"]{background:var(--red-cell);border-color:var(--red-cell-border);color:var(--red-text)}.cell:hover{transform:translateY(-1px)}.cell:active{transform:scale(.97)}.dot{width:8px;height:8px;border-radius:50%;background:var(--green-dot);box-shadow:0 0 #22c55e80;animation:pulse 1.8s ease-out infinite;display:inline-block}@keyframes pulse{0%{box-shadow:0 0 #22c55e73}70%{box-shadow:0 0 0 8px #22c55e00}to{box-shadow:0 0 #22c55e00}}.live{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--green);font-weight:600;background:var(--accent-soft);padding:6px 12px;border-radius:999px}.live.sm{padding:5px 10px;align-self:flex-start}.post{display:block;height:34px;border-radius:9px;background:var(--track);transition:transform .15s}.post:hover{transform:translateY(-1px)}.post[data-on="1"]{background:var(--accent);box-shadow:0 0 0 3px #2bd47a2e}.fill{transform-origin:left;animation:grow .7s var(--ease) both;transition:width .5s}@keyframes grow{0%{transform:scaleX(0)}}.track{height:8px;border-radius:4px;background:var(--track);overflow:hidden}.track>.fill{height:100%;border-radius:inherit}.hint{border-bottom:1px dotted var(--placeholder);cursor:help}.pill{position:relative;display:grid;background:var(--pill-bg);border-radius:999px;padding:4px;isolation:isolate}.pill .ind{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / var(--n));border-radius:999px;background:var(--navy);box-shadow:0 2px 6px #0f1e3d40;transition:transform .2s var(--ease);z-index:0}.pill .op{position:relative;z-index:1;height:36px;border:0;background:transparent;border-radius:999px;padding:0 18px;font:500 13px var(--font);color:var(--muted);cursor:pointer;transition:color .2s;white-space:nowrap}.pill.sm .op{height:30px;padding:0 12px;font-size:12px}.pill .op:hover{color:var(--text)}.pill .op[data-on="1"]{color:#fff;font-weight:600}.pill .op:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.sel{display:flex;align-items:center;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:24px;padding:12px 18px 12px 14px;cursor:pointer;text-align:left;font-family:var(--font);color:var(--text);transition:box-shadow .15s,transform .15s,border-color .15s;min-width:0}.sel:hover{box-shadow:0 6px 18px #0f1e3d14;transform:translateY(-1px);border-color:var(--border-strong)}.sel:active{transform:scale(.98)}.sel:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.sel .ico{width:36px;height:36px;border-radius:50%;background:var(--accent-soft);color:var(--green);display:inline-flex;align-items:center;justify-content:center;flex:none}.sel .ico.warm{background:var(--amber-soft);color:var(--amber)}.sel .lnk{font-size:12px;font-weight:500;color:var(--blue)}.back{width:48px;height:48px;border-radius:50%;border:0;background:var(--surface);color:var(--text);box-shadow:0 4px 14px #0f1e3d1f;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s,box-shadow .15s;flex:none}.back:hover{transform:translateY(-1px);box-shadow:0 8px 20px #0f1e3d29}.back:active{transform:scale(.96)}.back:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.skel{border-radius:16px;background:linear-gradient(100deg,#eef0f4 30%,#f8f9fb,#eef0f4 70%);background-size:200% 100%;animation:shimmer 1.6s linear infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.tile{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 14px 0 6px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font:500 13px var(--font);cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s;text-decoration:none}.tile:hover{transform:translateY(-1px);box-shadow:0 6px 16px #0f1e3d14;border-color:var(--border-strong)}.tile:active{transform:scale(.98)}.tile:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.tile .tico{width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--green);display:inline-flex;align-items:center;justify-content:center}.toast{position:fixed;right:24px;bottom:24px;z-index:9;animation:rise .4s var(--ease) both;max-width:400px}@keyframes rise{0%{opacity:0;transform:translateY(12px)}}.chip{font-size:12px;font-weight:500;padding:3px 8px;border-radius:6px;white-space:nowrap;display:inline-block}.chip.ok{color:var(--green);background:var(--accent-soft)}.chip.warn{color:var(--amber);background:var(--amber-soft)}.chip.bad{color:var(--red);background:var(--red-soft)}.chip.neu{color:var(--muted);background:var(--surface-2)}.mark{width:24px;height:24px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}.mark.ok{background:var(--accent-soft);color:var(--green)}.mark.warn{background:var(--amber-soft);color:var(--amber)}.mark.lg{width:28px;height:28px}.icoc{width:28px;height:28px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center}.icoc.ok{background:var(--accent-soft);color:var(--green)}.icoc.warn{background:var(--amber-soft);color:var(--amber)}.icoc.bad{background:var(--red-soft);color:var(--red)}.icoc.neu{background:var(--surface-2);color:var(--muted)}.av{border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex:none}table.tbl{width:100%;border-collapse:collapse;min-width:820px}table.tbl th{padding:10px 14px;font-weight:500;text-align:left;font-size:12px;color:var(--muted)}table.tbl td{padding:10px 14px}table.tbl tbody tr{border-top:1px solid var(--border)}.tl{display:flex;gap:6px;align-items:stretch;height:64px}.jor{display:flex;gap:6px;align-items:stretch}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:100%;max-width:420px;padding:32px;display:flex;flex-direction:column;gap:18px}@media(max-width:980px){.span-3{grid-column:span 6}.span-4,.span-5,.span-7,.span-8{grid-column:span 12}}@media(max-width:720px){.app{flex-direction:column}.app>nav{position:fixed;left:0;right:0;bottom:0;z-index:8;flex:none;border-right:0;border-top:1px solid var(--border);background:var(--surface)}.app>nav .rail{position:static;height:auto;flex-direction:row;justify-content:space-around;padding:6px 8px;gap:0}.app>nav .logo,.app>nav .avatar{display:none}.app>main{padding-bottom:64px}.pill{width:100%}.pill .op{padding:0 6px;font-size:12px}.tl{height:40px}.tl .tll{display:none}.jor{flex-direction:column}.jor>div{height:44px!important;flex:none!important}.toast{bottom:72px;left:16px;right:16px;max-width:none}.sel{border-radius:16px}.rb .tip{display:none}.bento{grid-template-columns:1fr}.bento>*{grid-column:auto}.pad{padding:16px;gap:16px}.hdr{padding:10px 16px;gap:10px}.hdr .clock,.hdr .cta{display:none}.hdr .search{flex:1 1 auto}}@media(prefers-reduced-motion:reduce){.dot,.fill,.toast,.skel{animation:none}.pill .ind,.bt,.sel,.back,.tile,.cell,.post{transition:none}}
