:root{color-scheme:dark;--page: #0b0f1a;--surface: #121828;--nav: #0e1424;--nav-text: #8b93a7;--nav-text-active: #ffffff;--accent: #3b76f6;--accent-down: #2c5cd9;--on-accent: #ffffff;--ink: #eef1f8;--ink-2: #a7aec2;--muted: #6d7590;--grid: #232b40;--hairline: rgba(255, 255, 255, .07);--ok: #2eb875;--ok-text: #4ade80;--warning: #f5b528;--serious: #ec835a;--critical: #e5484d;--seq1: #131c33;--seq2: #1a2c55;--seq3: #21407e;--seq4: #2a5cb4;--seq5: #3b76f6;--seq6: #6da7ec;--seq7: #9ec5f4;--s2: #eda100;--s3: #1baf7a;--s4: #e87ba4}@media (prefers-color-scheme: light){:root{color-scheme:light;--page: #f4f6fb;--surface: #ffffff;--nav: #0e1424;--nav-text: #8b93a7;--accent: #2f63e8;--accent-down: #234db8;--ink: #171c2c;--ink-2: #4d5670;--muted: #7d86a0;--grid: #e2e6f0;--hairline: rgba(23, 28, 44, .09);--ok: #0ca30c;--ok-text: #067a06;--warning: #d99a06;--critical: #d03b3b;--seq1: #dbe7fb;--seq2: #b7d0f7;--seq3: #8db2f2;--seq4: #6392ee;--seq5: #2f63e8;--seq6: #234db8;--seq7: #173683}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--page);color:var(--ink);font-size:16px;line-height:1.45}.shell{display:flex;min-height:100%}.nav{width:232px;flex-shrink:0;background:var(--nav);color:var(--nav-text);display:flex;flex-direction:column;padding:22px 14px;position:sticky;top:0;height:100vh;border-right:1px solid var(--hairline)}.brand{display:flex;align-items:baseline;gap:7px;padding:0 10px 26px}.brand .word{font-size:27px;font-weight:700;color:#fff;letter-spacing:-.02em}.brand .dot{width:11px;height:11px;border-radius:50%;background:var(--accent);animation:beat 2.4s ease-out infinite}@keyframes beat{0%,78%{transform:scale(1);opacity:1}85%{transform:scale(1.45);opacity:.85}to{transform:scale(1);opacity:1}}@media (prefers-reduced-motion: reduce){.brand .dot{animation:none}}.nav a{display:flex;align-items:center;gap:10px;color:var(--nav-text);text-decoration:none;padding:10px 12px;border-radius:9px;font-size:15px;margin-bottom:2px;transition:background .16s ease-out,color .16s ease-out}.nav a:hover{background:#ffffff0f;color:#fff}.nav a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.nav a.active{background:var(--accent);color:var(--on-accent);font-weight:600}.nav .spacer{flex:1}.nav .who{padding:12px 12px 4px;border-top:1px solid rgba(255,255,255,.09);font-size:13px}.nav .who .name{color:#fff;font-weight:600}.nav .who .role{color:var(--nav-text);margin-top:1px}.nav button.logout{margin:10px 12px 0;padding:8px 12px;width:calc(100% - 24px);background:none;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:var(--nav-text);font-size:13.5px;cursor:pointer;transition:border-color .16s ease-out,color .16s ease-out}.nav button.logout:hover{border-color:#fff6;color:#fff}.main{flex:1;min-width:0;padding:26px 30px 48px}.page-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:6px}.page-head h1{font-size:27px;font-weight:700;letter-spacing:-.015em}.data-note{font-size:13.5px;color:var(--muted);margin-bottom:20px}.card{background:var(--surface);border:1px solid var(--hairline);border-radius:12px;padding:16px 18px}.grid-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.section-title{font-size:16px;font-weight:650;margin:22px 0 10px}.tile .label{font-size:13px;color:var(--ink-2)}.tile .value{font-size:21px;font-weight:700;margin-top:2px;white-space:nowrap;font-variant-numeric:tabular-nums}.tile .sub{font-size:12.5px;color:var(--muted);margin-top:2px}select,input[type=date]{font:inherit;font-size:14px;color:var(--ink);background:var(--surface);border:1px solid var(--grid);border-radius:8px;padding:7px 10px}select:focus-visible,input:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.controls label{font-size:13px;color:var(--ink-2)}.login-wrap{min-height:100%;display:flex}.login-brand{flex:1;background:var(--nav);color:#fff;display:flex;flex-direction:column;justify-content:center;padding:8vh 8vw}.login-brand .big{font-size:56px;font-weight:750;letter-spacing:-.03em;display:flex;align-items:baseline;gap:12px}.login-brand .dot{width:16px;height:16px;border-radius:50%;background:var(--accent);animation:beat 2.4s ease-out infinite}.login-brand p{margin-top:14px;max-width:44ch;color:var(--nav-text);font-size:16px}.login-form{width:min(420px,100%);background:var(--surface);display:flex;flex-direction:column;justify-content:center;padding:40px 44px}.login-form h1{font-size:20px;font-weight:700;margin-bottom:18px}.login-form label{font-size:13.5px;color:var(--ink-2);display:block;margin:12px 0 5px}.login-form input{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--grid);border-radius:8px;background:var(--page);color:var(--ink)}.login-form button{margin-top:20px;width:100%;padding:11px;font:inherit;font-weight:650;font-size:15.5px;background:var(--accent);color:var(--on-accent);border:none;border-radius:9px;cursor:pointer;transition:background .16s ease-out}.login-form button:hover{background:var(--accent-down)}.login-form button:disabled{opacity:.55;cursor:default}.login-error{margin-top:12px;font-size:13.5px;color:var(--critical);display:flex;gap:6px;align-items:center}.q-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.q-item{display:flex;gap:10px;align-items:flex-start}.q-badge{width:20px;height:20px;border-radius:50%;color:#fff;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;margin-top:1px}.q-title{font-size:13.5px;font-weight:650}.q-desc{font-size:12.5px;color:var(--ink-2);margin-top:2px}table.data{width:100%;border-collapse:collapse;font-size:13.5px}table.data th{text-align:right;font-weight:600;color:var(--ink-2);font-size:12.5px;padding:7px 10px;border-bottom:1px solid var(--grid)}table.data td{text-align:right;padding:7px 10px;border-bottom:1px solid var(--grid);font-variant-numeric:tabular-nums}table.data th:first-child,table.data td:first-child{text-align:left}table.data tr:last-child td{border-bottom:none}.skeleton{border-radius:8px;background:linear-gradient(100deg,var(--grid) 40%,var(--page) 50%,var(--grid) 60%);background-size:200% 100%;animation:shimmer 1.4s infinite linear}@keyframes shimmer{to{background-position:-200% 0}}.tooltip{position:fixed;pointer-events:none;z-index:40;display:none;background:var(--surface);border:1px solid var(--grid);border-radius:8px;padding:8px 11px;font-size:12.5px;line-height:1.5;max-width:280px;box-shadow:0 6px 18px #00000073}.empty{padding:34px;text-align:center;color:var(--muted);font-size:14px}.nav a svg{flex-shrink:0;opacity:.85}.nav a.active svg{opacity:1}.sync{display:flex;align-items:center;gap:7px;padding:8px 12px;font-size:12px;color:var(--nav-text)}.sync-dot{width:8px;height:8px;border-radius:50%;box-shadow:0 0 6px currentColor}.preset-row{display:flex;gap:4px;background:var(--surface);border:1px solid var(--grid);border-radius:9px;padding:3px}.preset{font:inherit;font-size:13px;padding:5px 11px;border:none;border-radius:7px;background:none;color:var(--ink-2);cursor:pointer;transition:background .15s ease-out,color .15s ease-out}.preset:hover{color:var(--ink);background:var(--grid)}.preset.on{background:var(--accent);color:var(--on-accent);font-weight:600}.card{transition:border-color .18s ease-out,transform .18s ease-out}.card.link{cursor:pointer}.card.link:hover{border-color:var(--accent);transform:translateY(-2px)}.card.link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}table.data tbody tr{transition:background .12s ease-out}table.data tbody tr:hover{background:#3b76f612}tr.rowlink{cursor:pointer}.drawin{stroke-dasharray:1;stroke-dashoffset:1;animation:drawline .7s ease-out forwards}@keyframes drawline{to{stroke-dashoffset:0}}@media (prefers-reduced-motion: reduce){.drawin{animation:none;stroke-dashoffset:0}}@media (max-width: 900px){.shell{flex-direction:column}.nav{width:100%;height:auto;position:static;flex-direction:row;align-items:center;padding:10px 12px;overflow-x:auto;border-right:none;border-bottom:1px solid var(--hairline)}.brand{padding:0 10px 0 4px}.brand .word{font-size:20px}.nav a{white-space:nowrap}.nav .spacer,.nav .who,.nav button.logout{display:none}.main{padding:18px 14px 40px}.grid-kpi,.grid-2,.q-grid{grid-template-columns:1fr 1fr}.login-brand{display:none}.login-form{width:100%}}@media (max-width: 560px){.grid-kpi,.grid-2,.q-grid{grid-template-columns:1fr}}.hint{position:relative;display:inline-flex;margin-left:7px;vertical-align:middle;outline:none}.hint-q{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;border:1.2px solid var(--muted);color:var(--muted);font-size:10px;font-weight:700;cursor:help;-webkit-user-select:none;user-select:none}.hint:hover .hint-q,.hint:focus .hint-q{border-color:var(--accent);color:var(--accent)}.hint-pop{display:none;position:absolute;left:50%;transform:translate(-50%);bottom:calc(100% + 9px);width:300px;z-index:40;background:var(--surface);border:1px solid var(--grid);border-radius:8px;box-shadow:0 8px 24px #00000059;padding:10px 12px;font-size:12.5px;font-weight:400;line-height:1.5;color:var(--ink-2);text-transform:none;letter-spacing:normal;text-align:left;white-space:normal}.hint:hover .hint-pop,.hint:focus .hint-pop{display:block}.btn{font:inherit;font-weight:650;font-size:14px;padding:9px 16px;border-radius:9px;cursor:pointer;border:1px solid var(--grid);background:var(--surface);color:var(--ink);transition:border-color .15s ease-out,color .15s ease-out,background .15s ease-out}.btn:hover{border-color:var(--accent);color:var(--accent)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.btn.primary:hover{background:var(--accent-down);border-color:var(--accent-down);color:var(--on-accent)}.btn:disabled{opacity:.5;cursor:default;pointer-events:none}.btn.sm{font-size:13px;padding:6px 12px}.form-grid{display:grid;grid-template-columns:minmax(260px,400px) 1fr;gap:8px 36px}@media (max-width: 920px){.form-grid{grid-template-columns:1fr}}.form-title{font-size:16px;font-weight:700;margin-bottom:14px}.field{margin-bottom:14px}.field>label{display:block;font-size:13px;color:var(--ink-2);margin-bottom:5px}.field input,.field select{width:100%;font:inherit;font-size:14px;padding:9px 11px;border:1px solid var(--grid);border-radius:8px;background:var(--page);color:var(--ink)}.field .note{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.45}.chip-grid{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;font-size:13.5px;line-height:1;border:1px solid var(--grid);border-radius:999px;padding:8px 14px;cursor:pointer;background:var(--surface);-webkit-user-select:none;user-select:none;color:var(--ink);transition:border-color .14s ease-out,background .14s ease-out,color .14s ease-out}.chip:hover{border-color:var(--accent)}.chip.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}.chip input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}.chip-grid.dim .chip:not(.stay){opacity:.38}@keyframes rise-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.anim-rise{animation:rise-in .24s ease-out both}.brand-pulseline{margin-top:26px;width:200px;height:2px;border-radius:2px;background:#ffffff1a;position:relative;overflow:hidden}.brand-pulseline:after{content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;border-radius:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:pulse-run 2.2s ease-in-out infinite}@keyframes pulse-run{0%{left:-40%}to{left:100%}}@keyframes form-shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.login-form.shake{animation:form-shake .36s ease-out}.login-form button.busy{position:relative;overflow:hidden;color:#ffffffd9}.login-form button.busy:after{content:"";position:absolute;top:0;right:0;bottom:0;left:-60%;width:60%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);animation:pulse-run 1.1s ease-in-out infinite}.code-wrap{position:relative;display:flex;gap:9px;cursor:text}.code-hidden{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;border:none;font-size:16px}.code-cell{width:46px;height:56px;border-radius:10px;border:1px solid var(--grid);background:var(--page);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;animation:rise-in .2s ease-out both;transition:border-color .14s ease-out,box-shadow .14s ease-out}.code-cell.active{border-color:var(--accent);box-shadow:0 0 0 3px #3b76f62e}.code-cell.active:after{content:"";width:2px;height:22px;border-radius:1px;background:var(--accent);animation:caret-blink 1.1s steps(1) infinite}.code-cell.filled{border-color:var(--accent);animation:cell-pop .14s ease-out}@keyframes cell-pop{0%{transform:scale(.92)}60%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes caret-blink{0%,60%{opacity:1}61%,to{opacity:0}}.main .page-head{animation:rise-in .18s ease-out both}@media (prefers-reduced-motion: reduce){.anim-rise,.code-cell,.main .page-head,.login-form.shake,.login-form button.busy:after,.brand-pulseline:after,.login-brand .dot,.brand .dot{animation:none!important}}.code-wrap.checking .code-cell{border-color:var(--accent);animation:cell-scan .9s ease-in-out infinite;animation-delay:calc(var(--i) * .11s)}@keyframes cell-scan{0%,to{box-shadow:0 0 #3b76f600;border-color:var(--grid)}40%{box-shadow:0 0 0 3px #3b76f638;border-color:var(--accent);transform:translateY(-2px)}}.code-wrap.err{animation:form-shake .36s ease-out}.code-wrap.err .code-cell{border-color:var(--critical);animation:cell-err .48s ease-out}@keyframes cell-err{0%{box-shadow:0 0 #e5484d00}30%{box-shadow:0 0 0 3px #e5484d47;background:#e5484d0f}to{box-shadow:0 0 #e5484d00}}.login-form.ok{background:var(--surface)}.verify-success{text-align:center;display:flex;flex-direction:column;align-items:center}.check-tile{width:78px;height:78px;border-radius:18px;background:var(--page);color:var(--ok);display:flex;align-items:center;justify-content:center;border:1.5px solid var(--ok);box-shadow:0 0 #2eb87580;animation:tile-glow 1.6s ease-out forwards}@keyframes tile-glow{0%{transform:scale(.8);box-shadow:0 0 #2eb87580}45%{transform:scale(1.04);box-shadow:0 0 0 12px #2eb87500}to{transform:scale(1);box-shadow:0 0 34px 2px #2eb87547}}.check-path{stroke-dasharray:44;stroke-dashoffset:44;animation:check-draw .42s .18s ease-out forwards}@keyframes check-draw{to{stroke-dashoffset:0}}@media (prefers-reduced-motion: reduce){.code-wrap.checking .code-cell,.code-wrap.err,.code-wrap.err .code-cell,.check-tile,.check-path{animation:none!important}.check-path{stroke-dashoffset:0}.check-tile{box-shadow:0 0 24px 2px #2eb8753d}}
