:root{--blue:#0b63ce;--ink:#172033;--muted:#64748b;--bg:#eef4fb;--card:#fff;--line:#dbe5f2;--danger:#b42318;--ok:#067647;--warn:#b54708;--nav:#0f1f35}*{box-sizing:border-box}body{margin:0;font-family:"Trebuchet MS","Segoe UI",Tahoma,sans-serif;background:var(--bg);color:var(--ink)}a{color:inherit}.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top right,#fff7e1,#eaf3ff 45%,#eef4fb)}.login-card{width:min(420px,92vw);background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:0 24px 60px rgba(21,34,56,.12)}.login-card h1{margin:0 0 6px}.login-card label{display:block;margin-top:14px;font-size:13px;color:var(--muted)}input,select,textarea{width:100%;border:1px solid #d8dee9;border-radius:12px;padding:10px;background:#fff}textarea{min-height:44px}button,.btn{display:inline-block;border:0;border-radius:12px;padding:10px 14px;background:linear-gradient(135deg,#0b63ce,#0f7ae5);color:#fff;font-weight:700;text-decoration:none;cursor:pointer}.secondary{background:linear-gradient(135deg,#4b5565,#636f83)}.alert{padding:10px 12px;border-radius:12px;margin:10px 0;background:#eaf2ff}.danger{color:var(--danger);background:#fff1f0}.ok{color:var(--ok);background:#ecfdf3}.warn{color:var(--warn);background:#fff7ed}.sidebar{position:fixed;inset:0 auto 0 0;width:260px;background:var(--nav);color:#fff;padding:18px;overflow:auto}.sidebar h2{margin:0}.sidebar small{color:#b8c7dc}.sidebar nav{display:grid;gap:7px;margin-top:18px}.sidebar a{padding:10px 12px;border-radius:12px;text-decoration:none;color:#dbeafe}.sidebar a.active,.sidebar a:hover{background:#1d4ed8;color:#fff}.main{margin-left:260px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:sticky;top:0;z-index:2}.content{padding:18px;flex:1}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:14px;box-shadow:0 10px 30px rgba(21,34,56,.06)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.kpi{background:#f7fbff;border:1px solid #e4eefc;border-radius:14px;padding:14px}.kpi h3{font-size:13px;color:var(--muted);margin:0 0 8px}.kpi p{font-size:24px;font-weight:800;margin:0}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;align-items:end}.table-wrap{overflow:auto;border:1px solid #edf0f4;border-radius:12px;background:#fff}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:9px 8px;border-bottom:1px solid #edf0f4;text-align:left;vertical-align:top}th{background:#f4f8ff}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 14px}.tabs a{padding:9px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);text-decoration:none;font-weight:700}.tabs a.active{background:#0b63ce;color:#fff}.legacy-frame{width:100%;height:calc(100vh - 110px);border:0;border-radius:16px;background:#fff}.nowrap{white-space:nowrap}.right{text-align:right}footer{padding:10px 18px;color:var(--muted);font-size:12px}@media(max-width:820px){.sidebar{position:static;width:auto}.main{margin-left:0}.topbar{position:static}}
.status-badge{display:inline-block;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:800;white-space:nowrap}.badge-danger{background:#fee2e2;color:#991b1b}.badge-ok{background:#dcfce7;color:#166534}.badge-softok{background:#d9f99d;color:#3f6212}.badge-info{background:#dbeafe;color:#1d4ed8}.badge-warn{background:#ffedd5;color:#9a3412}.badge-muted{background:#e5e7eb;color:#374151}.tone-good{background:linear-gradient(135deg,#ecfdf3,#d1fae5);border-color:#bbf7d0}.tone-bad{background:linear-gradient(135deg,#fff1f2,#fee2e2);border-color:#fecaca}.tone-warn{background:linear-gradient(135deg,#fffbeb,#ffedd5);border-color:#fed7aa}.tone-info{background:linear-gradient(135deg,#eff6ff,#dbeafe);border-color:#bfdbfe}.tone-neutral{background:linear-gradient(135deg,#f8fafc,#eef2f7);border-color:#e2e8f0}.tone-softgood{background:linear-gradient(135deg,#f7fee7,#ecfccb);border-color:#d9f99d}.row-better td{background:#ecfdf3}.row-worse td{background:#fff1f2}.row-warn td{background:#fffbeb}.row-new td{background:#eff6ff}.row-lost td{background:#f7fee7}.row-stable td{background:#f8fafc}.row-better td:first-child,.row-worse td:first-child,.row-warn td:first-child,.row-new td:first-child,.row-lost td:first-child,.row-stable td:first-child{border-left:5px solid transparent}.row-better td:first-child{border-left-color:#16a34a}.row-worse td:first-child{border-left-color:#dc2626}.row-warn td:first-child{border-left-color:#f59e0b}.row-new td:first-child{border-left-color:#2563eb}.row-lost td:first-child{border-left-color:#84cc16}.row-stable td:first-child{border-left-color:#94a3b8}.chart-row{border-bottom:1px solid #edf0f4;padding:10px 0}.chart-row:last-child{border-bottom:0}.bar-line{display:grid;grid-template-columns:110px minmax(160px,1fr) 150px;gap:10px;align-items:center;margin:6px 0}.bar-line span{font-size:12px;color:var(--muted);font-weight:700}.bar-line em{font-style:normal;font-size:12px;text-align:right;color:var(--muted)}.bar-bg{height:13px;border-radius:999px;background:#eef2f7;overflow:hidden}.bar{height:100%;border-radius:999px}.bar.blue{background:#2563eb}.bar.green{background:#16a34a}.bar.softgreen{background:#84cc16}.bar.red{background:#dc2626}.bar.orange{background:#f59e0b}.bar.gray{background:#94a3b8}.flow-list{display:grid;gap:8px}.flow-item{display:grid;grid-template-columns:1fr auto 1fr auto;gap:10px;align-items:center;border:1px solid #e5e7eb;border-radius:12px;padding:10px;background:#fff}.flow-item span{font-weight:800}.flow-item b{color:#64748b}.flow-item em{font-style:normal;font-size:12px;color:#64748b;text-align:right}.flow-red{border-color:#fecaca;background:#fff1f2}.flow-green{border-color:#bbf7d0;background:#ecfdf3}.flow-blue{border-color:#bfdbfe;background:#eff6ff}.flow-softgreen{border-color:#d9f99d;background:#f7fee7}.flow-gray{border-color:#e2e8f0;background:#f8fafc}@media(max-width:700px){.bar-line,.flow-item{grid-template-columns:1fr}.bar-line em,.flow-item em{text-align:left}}

img,canvas,svg{max-width:100%}.content{overflow-x:hidden}.summary-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.kpi{min-width:0;overflow:hidden}.kpi p{font-size:clamp(20px,2vw,30px);line-height:1.18;word-break:break-word;overflow-wrap:anywhere}.visual-section{overflow:hidden}.visual-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px;align-items:stretch}.visual-card{background:#fff;border:1px solid #dbe5f2;border-radius:18px;padding:18px;min-height:300px;overflow:hidden;box-shadow:0 10px 24px rgba(21,34,56,.05)}.visual-card h3{font-size:clamp(18px,1.5vw,22px);line-height:1.2;margin:0 0 16px}.chart-scroll{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;padding-bottom:4px}.visual-card .chart-row{min-width:0}.visual-card .bar-line{grid-template-columns:minmax(92px,118px) minmax(120px,1fr) minmax(62px,86px);gap:9px;max-width:100%}.visual-card .bar-line span{white-space:normal;line-height:1.2}.visual-card .bar-line em{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visual-card .bar-bg{min-width:0;width:100%;height:16px}.migration-list{max-height:285px;overflow:auto;border:1px solid #edf0f4;border-radius:14px}.compact-table{min-width:520px;font-size:13px}.compact-table th,.compact-table td{padding:9px 10px}.flow-arrow{display:inline-block;color:#64748b;font-weight:800;margin:0 6px}.visual-card .btn{white-space:normal;max-width:100%;line-height:1.25}@media(min-width:1500px){.visual-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.summary-grid{grid-template-columns:1fr}.visual-grid{grid-template-columns:1fr}.visual-card{min-height:auto}.visual-card .bar-line{grid-template-columns:1fr}.visual-card .bar-line em{text-align:left}.compact-table{min-width:460px}}

.sidebar{width:282px;padding:20px 16px;background:linear-gradient(180deg,#0f1f35 0%,#102b4f 62%,#0b1728 100%)}.main{margin-left:282px}.brand{display:flex;align-items:center;gap:12px;padding:6px 6px 18px;border-bottom:1px solid rgba(255,255,255,.12)}.brand-mark{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#38bdf8,#2563eb);font-weight:900;letter-spacing:.5px;box-shadow:0 14px 35px rgba(37,99,235,.28)}.brand h2{font-size:19px;line-height:1.1;margin:0}.brand small{display:block;margin-top:4px;color:#b8c7dc}.main-nav{display:grid;gap:8px;margin-top:18px}.main-nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid transparent;border-radius:14px;color:#dbeafe;text-decoration:none;font-weight:800;transition:background .16s ease,border-color .16s ease,transform .16s ease}.main-nav a:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.12);transform:translateX(2px)}.main-nav a.active{background:linear-gradient(135deg,#2563eb,#0ea5e9);border-color:rgba(255,255,255,.18);color:#fff;box-shadow:0 14px 30px rgba(14,165,233,.2)}.nav-number{flex:0 0 auto;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.11);font-size:12px;color:#bfdbfe}.main-nav a.active .nav-number{background:rgba(255,255,255,.22);color:#fff}.sidebar-note{margin-top:18px;padding:13px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.07);color:#dbeafe}.sidebar-note strong{display:block;font-size:13px;margin-bottom:5px}.sidebar-note span{display:block;font-size:12px;line-height:1.45;color:#cbd5e1}.topbar{height:auto;min-height:76px;padding:14px 22px;gap:16px}.page-title{min-width:0}.page-title strong{display:block;font-size:clamp(20px,2vw,28px);line-height:1.15}.breadcrumb{display:block;margin-bottom:4px;color:#64748b;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.user-panel{display:flex;align-items:center;gap:12px;min-width:fit-content}.user-meta{text-align:right}.user-meta span{display:block;font-weight:900}.user-meta small{display:block;color:#64748b;margin-top:2px}.content{padding:20px;max-width:1680px;width:100%}footer{border-top:1px solid var(--line);background:rgba(255,255,255,.55)}@media(max-width:900px){.sidebar{position:static;width:auto;border-radius:0}.main{margin-left:0}.brand{padding-bottom:14px}.main-nav{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.main-nav a:hover{transform:none}.sidebar-note{display:none}.topbar{position:static;align-items:flex-start;flex-direction:column}.user-panel{width:100%;justify-content:space-between}.user-meta{text-align:left}.content{padding:14px}}
.status-legend{margin-top:12px;padding:13px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.05);color:#dbeafe}.status-legend strong{display:block;font-size:13px;margin-bottom:8px}.status-legend span{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.4;color:#cbd5e1;margin:5px 0}.legend-dot{width:10px;height:10px;border-radius:999px;display:inline-block;box-shadow:0 0 0 3px rgba(255,255,255,.08)}.legend-dot.green{background:#16a34a}.legend-dot.red{background:#dc2626}.legend-dot.gray{background:#6b7280}.legend-dot.blue{background:#2563eb}.legend-dot.softgreen{background:#86efac}.legend-dot.yellow{background:#facc15}@media(max-width:900px){.status-legend{display:none}}