:root{--blue-100: #e3f3ff;--blue-200: #c2e0fe;--blue-400: #30a8ff;--blue-500: #1576ef;--blue-600: #0e65d2;--blue-700: #074fac;--navy-100: #273572;--navy-300: #1e2857;--navy-500: #182045;--grey-100: #f6f7f9;--grey-200: #f1f3f5;--grey-300: #e9ecef;--grey-500: #e2e5e9;--grey-600: #cbd1d7;--grey-700: #a8b2bd;--grey-800: #8b96a5;--grey-900: #667385;--green-100: #e5fbf4;--green-500: #20c997;--green-700: #199e77;--red-100: #fef0f0;--red-500: #f95050;--red-700: #bc0b1d;--yellow-100: #fff9f0;--yellow-500: #ffb433;--yellow-700: #d18605;--cyan-500: #3bc9db;--orange-500: #ff791f;--violet-500: #7c5cff;--bg: var(--grey-100);--surface: #ffffff;--border: var(--grey-300);--border-strong: var(--grey-600);--text: var(--navy-300);--text-muted: var(--grey-900);--text-faint: var(--grey-800);--up: var(--green-700);--down: var(--red-700);--radius: 12px;--radius-sm: 8px;--shadow: 0 1px 2px rgba(30, 40, 87, .06), 0 4px 16px rgba(30, 40, 87, .05);--shadow-pop: 0 8px 32px rgba(30, 40, 87, .16);--sidebar: 232px;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,Roboto,Helvetica,Arial,sans-serif;font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}h1,h2,h3,h4{margin:0;color:var(--navy-300);font-weight:650;letter-spacing:-.01em}h1{font-size:24px}h2{font-size:18px}h3{font-size:15px}p{margin:0}a{color:var(--blue-500);text-decoration:none}a:hover{text-decoration:underline}.shell{display:flex;min-height:100%}.sidebar{width:var(--sidebar);flex:0 0 var(--sidebar);background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.sidebar__brand{display:flex;align-items:center;gap:10px;padding:18px 18px 14px;font-weight:700;font-size:15px;color:var(--navy-300)}.sidebar__brand svg{flex:0 0 auto}.sidebar__brand small{display:block;font-weight:500;font-size:11px;color:var(--text-faint)}.sidebar__nav{display:flex;flex-direction:column;gap:2px;padding:6px 10px;flex:1;overflow-y:auto}.navlink{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-sm);color:var(--text-muted);font-weight:500;transition:background .12s,color .12s}.navlink:hover{background:var(--grey-200);text-decoration:none;color:var(--navy-300)}.navlink.is-active{background:var(--blue-100);color:var(--blue-700);font-weight:600}.navlink svg{flex:0 0 auto;opacity:.85}.sidebar__footer{border-top:1px solid var(--border);padding:12px}.sidebar__user{font-size:12px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis}.content{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:0;z-index:20;flex-wrap:wrap}.topbar__title{flex:1;min-width:180px}.topbar__title p{font-size:12px;color:var(--text-muted)}.page{padding:20px 24px 48px;display:flex;flex-direction:column;gap:16px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.card--flush{padding:0;overflow:hidden}.card__head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap}.card__head h2,.card__head h3{flex:1;min-width:140px}.card__body{padding:16px}.grid{display:grid;gap:16px}.grid--stats{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.grid--halves{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.grid--form{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.stat{display:flex;flex-direction:column;gap:4px}.stat__label{font-size:12px;color:var(--text-muted);font-weight:500}.stat__value{font-size:22px;font-weight:650;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.stat__hint{font-size:12px;color:var(--text-faint);font-variant-numeric:tabular-nums}.up{color:var(--up)}.down{color:var(--down)}.flat{color:var(--text-muted)}.num{font-variant-numeric:tabular-nums}.mono{font-family:var(--mono);font-size:12px}.table-wrap{overflow-x:auto}table.data{width:100%;border-collapse:collapse;font-size:13px}table.data th{text-align:left;font-weight:600;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint);padding:10px 12px;border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:0;white-space:nowrap}table.data th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none}table.data th.sortable:hover{color:var(--blue-500)}table.data td{padding:9px 12px;border-bottom:1px solid var(--grey-200);vertical-align:middle}table.data tbody tr:hover{background:var(--grey-100)}table.data tbody tr.is-clickable{cursor:pointer}table.data .right{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}table.data tfoot td{padding:10px 12px;font-weight:650;border-top:1px solid var(--border-strong);background:var(--grey-100)}.cell-title{font-weight:600;color:var(--navy-300)}.cell-sub{font-size:11px;color:var(--text-faint)}table.data td:first-child .cell-title,table.data td:first-child .cell-sub{white-space:nowrap}label.field{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--text-muted);font-weight:500}label.field>span.req:after{content:" *";color:var(--red-500)}input[type=text],input[type=password],input[type=email],input[type=number],input[type=date],input[type=datetime-local],input[type=search],select,textarea{width:100%;padding:8px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font:inherit;font-size:13px;transition:border-color .12s,box-shadow .12s}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px var(--blue-100)}input:disabled,select:disabled,textarea:disabled{background:var(--grey-200);color:var(--text-faint)}textarea{resize:vertical;min-height:64px}.checkbox{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text);cursor:pointer}.checkbox input{width:16px;height:16px;accent-color:var(--blue-500)}.field__hint{font-size:11px;color:var(--text-faint);font-weight:400}.field__error{font-size:11px;color:var(--down);font-weight:500}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border-radius:var(--radius-sm);border:1px solid transparent;background:var(--blue-500);color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .12s,border-color .12s,color .12s}.btn:hover:not(:disabled){background:var(--blue-600)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn--ghost{background:transparent;border-color:var(--border-strong);color:var(--text)}.btn--ghost:hover:not(:disabled){background:var(--grey-200);border-color:var(--grey-700)}.btn--quiet{background:transparent;color:var(--text-muted);padding:6px 8px}.btn--quiet:hover:not(:disabled){background:var(--grey-200);color:var(--navy-300)}.btn--danger{background:var(--red-500)}.btn--danger:hover:not(:disabled){background:var(--red-700)}.btn--sm{padding:5px 10px;font-size:12px}.btn-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.segmented{display:inline-flex;border:1px solid var(--border-strong);border-radius:var(--radius-sm);overflow:hidden}.segmented button{padding:6px 12px;border:none;background:var(--surface);color:var(--text-muted);font:inherit;font-size:12px;font-weight:600;cursor:pointer;border-right:1px solid var(--border)}.segmented button:last-child{border-right:none}.segmented button.is-active{background:var(--blue-500);color:#fff}.segmented button:hover:not(.is-active){background:var(--grey-200)}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:650;background:var(--grey-300);color:var(--text-muted);white-space:nowrap}.badge--blue{background:var(--blue-100);color:var(--blue-700)}.badge--green{background:var(--green-100);color:var(--green-700)}.badge--red{background:var(--red-100);color:var(--red-700)}.badge--yellow{background:var(--yellow-100);color:var(--yellow-700)}.dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;display:inline-block}.notice{padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;border:1px solid transparent}.notice--error{background:var(--red-100);color:var(--red-700);border-color:#ffc9c9}.notice--warn{background:var(--yellow-100);color:var(--yellow-700);border-color:#ffe5b8}.notice--info{background:var(--blue-100);color:var(--blue-700);border-color:var(--blue-200)}.empty{padding:36px 20px;text-align:center;color:var(--text-muted);display:flex;flex-direction:column;gap:8px;align-items:center}.empty h3{color:var(--text-muted)}.skeleton{background:linear-gradient(90deg,var(--grey-200) 25%,var(--grey-300) 50%,var(--grey-200) 75%);background-size:400% 100%;animation:shimmer 1.4s ease-in-out infinite;border-radius:var(--radius-sm)}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0 0}}.spinner{width:16px;height:16px;border:2px solid var(--blue-200);border-top-color:var(--blue-500);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#18204559;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto;z-index:100}.modal{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-pop);width:100%;max-width:560px;display:flex;flex-direction:column}.modal--wide{max-width:780px}.modal__head{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--border)}.modal__head h2{flex:1}.modal__body{padding:16px;display:flex;flex-direction:column;gap:14px}.modal__foot{display:flex;gap:8px;justify-content:flex-end;padding:14px 16px;border-top:1px solid var(--border)}.toolbar{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.toolbar label.field{min-width:130px}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{padding:4px 10px;border-radius:999px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text-muted);font-size:12px;font-weight:600;cursor:pointer}.chip:hover{background:var(--grey-200)}.chip.is-active{background:var(--blue-500);border-color:var(--blue-500);color:#fff}.pager{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding:12px 16px;font-size:12px;color:var(--text-muted)}.chart{width:100%;display:block}.chart__grid{stroke:var(--grey-300);stroke-width:1}.chart__axis{fill:var(--text-faint);font-size:10px}.chart__area{fill:url(#areaFill)}.chart__line{fill:none;stroke:var(--blue-500);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.chart__cursor{stroke:var(--grey-700);stroke-width:1;stroke-dasharray:3 3}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--text-muted)}.legend__item{display:flex;align-items:center;gap:6px}.tooltip{position:absolute;pointer-events:none;background:var(--navy-300);color:#fff;padding:8px 10px;border-radius:var(--radius-sm);font-size:12px;box-shadow:var(--shadow-pop);z-index:30;white-space:nowrap;line-height:1.5}.tooltip b{font-variant-numeric:tabular-nums}.donut-wrap{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.donut-legend{flex:1;min-width:200px;display:flex;flex-direction:column;gap:6px}.donut-legend__row{display:flex;align-items:center;gap:8px;font-size:12px}.donut-legend__row span:nth-child(2){flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.donut-legend__row b{font-variant-numeric:tabular-nums}.bar-track{height:6px;border-radius:3px;background:var(--grey-300);overflow:hidden;min-width:60px}.bar-track>span{display:block;height:100%;border-radius:3px;background:var(--blue-500)}.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(160deg,#eef5ff 0%,var(--grey-100) 55%,#f4f9ff 100%)}.login__card{width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px}.login__brand{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}.login__brand p{color:var(--text-muted);font-size:13px}@media(max-width:900px){.shell{flex-direction:column}.sidebar{width:100%;flex:none;height:auto;position:static;border-right:none;border-bottom:1px solid var(--border)}.sidebar__nav{flex-direction:row;overflow-x:auto;padding:8px}.navlink{white-space:nowrap}.sidebar__footer{display:flex;align-items:center;gap:12px}.page{padding:16px 12px 40px}.topbar{padding:12px}}
