:root{font-family:Inter,"Segoe UI","Microsoft YaHei",ui-sans-serif,system-ui,sans-serif;color:#202d41;background:#f5f7fb;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-width:320px}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #b0c6ff;outline-offset:2px}
[hidden]{display:none!important}
.app-layout{display:flex;min-height:100vh}
.sidebar{width:238px;flex:0 0 238px;min-height:100vh;background:#17253e;color:#e9effc;display:flex;flex-direction:column;padding:25px 13px 18px;position:sticky;top:0;height:100vh}
.brand{display:flex;gap:11px;align-items:center;padding:0 12px}
.brand-mark{width:37px;height:37px;border-radius:11px;background:linear-gradient(145deg,#a9e6c6,#75b7e3);color:#152945;display:grid;place-items:center;font-weight:800;font-size:19px;box-shadow:0 5px 18px #0002}
.brand strong,.brand small{display:block}.brand strong{font-size:17px;letter-spacing:.01em}.brand small{font-size:11px;color:#9eafc8;margin-top:2px}
.workspace-label{display:flex;align-items:center;justify-content:space-between;margin:35px 9px 17px;padding:10px 11px;border:1px solid #3c4c67;background:#22334f;border-radius:9px;color:#c6d5ed;font-size:12px}
.workspace-state{display:flex;align-items:center;gap:5px;font-size:11px;color:#a4d9c1}.workspace-state i,.footer-dot{width:6px;height:6px;border-radius:50%;background:#61c992;display:inline-block}
.side-nav{overflow:auto;padding:0 3px}.nav-group{margin-bottom:21px}.nav-caption{display:block;padding:0 12px 8px;color:#8294b2;font-size:10px;font-weight:700;letter-spacing:.13em}
.nav-item,.nav-future{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;color:#c5d2e9;font-size:12px;text-align:left;white-space:nowrap}
.nav-item:hover{background:#263957;color:#fff}.nav-item.active{background:#34537e;color:#fff;font-weight:700;box-shadow:inset 3px 0 #86d6bb}
.nav-icon{display:inline-grid;place-items:center;width:18px;height:18px;color:#9dc8d9;font-size:16px;flex:none}.nav-item.active .nav-icon{color:#b9f4d8}
.nav-future{color:#8494ac;cursor:default}.nav-future>span:last-child{margin-left:auto;font-size:10px;color:#8494ac;background:#2b3b55;padding:2px 5px;border-radius:4px}
.sidebar-footer{display:flex;gap:9px;align-items:flex-start;border-top:1px solid #33435e;margin-top:auto;padding:17px 12px 0;color:#c7d5e8;font-size:11px;line-height:1.55}.footer-dot{margin-top:5px;flex:none}.sidebar-footer small{font-size:10px;color:#8fa2bf}
.main-area{flex:1;min-width:0}.topbar{height:57px;background:#fff;border-bottom:1px solid #e5eaf2;padding:0 30px;display:flex;justify-content:space-between;align-items:center;gap:16px}.breadcrumb{font-size:11px;font-weight:700;letter-spacing:.1em;color:#8b9ab1}.breadcrumb span{padding:0 10px;color:#c0cad9}.breadcrumb strong{color:#33425b;letter-spacing:0;font-size:12px}.topbar-actions{display:flex;align-items:center;gap:18px}.topbar-tag{font-size:11px;color:#6d7d96;border:1px solid #e2e8f2;padding:5px 9px;border-radius:20px}.quiet-button{border:0;background:transparent;color:#53708e;font-size:12px;padding:7px 3px}.quiet-button:hover{color:#196db3}
.content{max-width:1480px;padding:30px clamp(20px,3.4vw,52px) 50px;margin:0 auto}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:10px}.eyebrow,.card-overline{display:block;color:#5690b2;font-size:10px;font-weight:800;letter-spacing:.13em}.page-heading h1{margin:7px 0 6px;font-size:26px;letter-spacing:-.035em}.page-heading p{margin:0;color:#718099;font-size:13px;line-height:1.5}.feedback{min-height:28px;margin:0 0 13px;color:#2c7e68;font-size:12px}.feedback span:not(:empty){display:inline-block;margin-right:12px;padding:5px 9px;background:#eaf8f0;border-radius:6px}
button.primary,.section-title>button,.model-row button,.level-grid>button{border:1px solid #cdd8e8;background:white;color:#284264;border-radius:7px;padding:9px 13px;font-size:12px;font-weight:650}
button.primary{background:#2f67a3;border-color:#2f67a3;color:#fff;box-shadow:0 3px 9px #2f67a322}button.primary:hover{background:#25598f}.section-title>button:hover,.model-row button:hover,.level-grid>button:hover{border-color:#82a9d2;background:#f3f8fe}
.panel{animation:panel-in .2s ease-out}@keyframes panel-in{from{opacity:.6;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.card{background:#fff;border:1px solid #e4eaf2;border-radius:12px;padding:25px;box-shadow:0 5px 20px #192c4b07}.section-title{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:19px;border-bottom:1px solid #edf1f5}.section-title h2,.card h3{margin:6px 0 7px;font-size:18px}.section-title p,.card>p{margin:0;color:#75839a;font-size:12px;line-height:1.6}.section-title>button{white-space:nowrap}
.grid,.level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}.grid.compact{grid-template-columns:minmax(200px,260px)}label{display:grid;align-content:start;gap:7px;color:#52627a;font-size:12px;font-weight:600}input,select,textarea{min-width:0;width:100%;border:1px solid #d7dfeb;border-radius:7px;padding:9px 10px;background:#fff;color:#25364b;font-weight:400;font-size:12px;min-height:36px}input:hover,select:hover,textarea:hover{border-color:#aabdd4}input[type=checkbox]{width:16px;min-height:16px;height:16px;accent-color:#2f67a3}textarea{resize:vertical;line-height:1.5}
.form-list{margin-top:4px}.model-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px 18px;padding:21px 0;border-bottom:1px solid #edf1f5}.model-row:last-child{border-bottom:0;padding-bottom:3px}.model-row .wide{grid-column:1/-1;margin:0;font-size:14px}.model-row button{justify-self:start;align-self:end}.model-row textarea{min-height:72px}.level-grid{align-items:end}.level-grid>button{justify-self:start;min-height:36px}.inline-note{margin-top:22px!important;padding:12px 14px;background:#f0f6fc;border-left:3px solid #77a8d8;color:#59728b!important;border-radius:4px}
.empty-state{margin-top:20px;padding:24px;border:1px dashed #cfdbea;border-radius:9px;background:#f9fbfe;color:#7588a1;text-align:center;font-size:12px}
.table-wrap{width:100%;overflow:auto}table{width:100%;border-collapse:collapse;margin-top:18px;min-width:590px}th,td{text-align:left;padding:11px 9px;border-bottom:1px solid #eef1f6}th{font-size:11px;color:#8694a9;font-weight:700}td{font-size:12px}td:last-child{width:64px}td button{background:#fff;border:1px solid #f0d8d8;border-radius:6px;padding:7px 10px;font-size:11px}.danger{color:#b74444}
.hero{display:grid;grid-template-columns:minmax(270px,1fr) minmax(280px,.9fr);gap:28px;min-height:260px;padding:32px 36px;background:linear-gradient(120deg,#1c3456,#315d80 68%,#3b7d86);color:white;border-radius:14px;overflow:hidden;position:relative;box-shadow:0 13px 30px #1b3e6b20}.hero:after{content:"";position:absolute;width:340px;height:340px;border:1px solid #ffffff20;border-radius:50%;right:-140px;top:-170px;pointer-events:none}.hero-kicker{font-size:10px;font-weight:750;letter-spacing:.14em;color:#aee9d1}.hero h2{font-size:25px;line-height:1.45;margin:12px 0}.hero p{font-size:12px;line-height:1.75;color:#d2e2f0;max-width:570px;margin:0}.hero-link{border:0;background:transparent;color:#b9f0d7;font-weight:700;padding:16px 0 0;font-size:12px}.hero-link span{margin-left:5px}.hero-diagram{display:flex;align-items:center;gap:8px;align-self:center;z-index:1}.hero-diagram>div{flex:1;min-width:0;background:#ffffff15;border:1px solid #ffffff29;padding:18px 12px;border-radius:10px;backdrop-filter:blur(5px)}.hero-diagram small,.hero-diagram strong,.hero-diagram span{display:block}.hero-diagram small{font-size:9px;color:#add0e5;white-space:nowrap}.hero-diagram strong{font-size:15px;margin:10px 0 4px}.hero-diagram span{font-size:10px;color:#d4e8f1;line-height:1.45}.hero-diagram i{font-style:normal;color:#a9dfd3;font-size:18px}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}.metric{background:#fff;border:1px solid #e4eaf2;border-radius:11px;padding:20px 21px;min-height:116px}.metric span,.metric small,.metric strong{display:block}.metric span{font-size:11px;color:#74839a}.metric strong{font-size:29px;margin:7px 0 1px;color:#1e3656}.metric small{color:#a0abbb;font-size:10px}.overview-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}.overview-grid .card{min-height:230px}.step-list{list-style:none;padding:0;margin:15px 0 0;counter-reset:step}.step-list li{display:flex;align-items:baseline;gap:12px;padding:10px 0;border-top:1px solid #f0f2f6;font-size:12px}.step-list li:before{counter-increment:step;content:counter(step,decimal-leading-zero);font-size:10px;color:#5f9abe;font-weight:800}.step-list b{min-width:72px;color:#2f405b}.step-list span{color:#738299}.roadmap-card>p{margin-top:15px!important;max-width:430px}.roadmap-note{margin-top:20px;color:#5b7b95;font-size:11px;background:#edf5fa;border-radius:7px;padding:12px 14px}
@media(max-width:1100px){.hero{grid-template-columns:1fr}.hero-diagram{max-width:650px}.metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.app-layout{display:block}.sidebar{position:static;width:auto;height:auto;min-height:0;padding:13px}.brand{padding:0 3px}.workspace-label,.sidebar-footer,.nav-caption,.nav-future{display:none}.side-nav{display:flex;gap:6px;overflow-x:auto;margin-top:13px}.nav-group{display:flex;gap:4px;margin:0;flex:none}.nav-item{width:auto;padding:8px 10px}.nav-icon{display:none}.topbar{height:49px;padding:0 16px}.content{padding:23px 16px 35px}.page-heading{align-items:flex-start}.page-heading h1{font-size:22px}.section-title{align-items:flex-start}.grid,.level-grid,.model-row,.overview-grid{grid-template-columns:1fr}.hero{padding:26px 22px}.hero h2{font-size:21px}.hero-diagram{overflow:auto}.metric-grid{gap:8px}.metric{padding:15px;min-height:100px}}
.model-workspace { display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: 560px; border: 1px solid #dbe3ee; border-radius: 14px; overflow: hidden; background: #fff; }
.model-tree { background: #f7f9fc; border-right: 1px solid #e5eaf1; padding: 16px 12px; }
.model-tree-head, .model-detail-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.model-tree-head { padding: 2px 4px 14px; border-bottom: 1px solid #e2e8f0; }
.model-tree-actions { display: flex; gap: 5px; }
.model-tree-actions button { border: 1px solid #cbd5e1; background: #fff; border-radius: 6px; padding: 5px 7px; color: #334155; cursor: pointer; }
.model-tree-list { padding-top: 10px; }
.model-tree-group { margin-bottom: 5px; }
.model-tree-provider-row { display: flex; align-items: center; gap: 2px; }
.model-tree-provider-row .model-tree-item { width: auto; min-width: 0; flex: 1; }
.model-tree-toggle { width: 22px; height: 22px; padding: 0; border: 0; background: transparent; color: #64748b; cursor: pointer; border-radius: 5px; }
.model-tree-toggle:hover { background: #e2e8f0; color: #1e3a5f; }
.model-tree-add-child { flex: 0 0 auto; border: 1px solid #b8cbe2; background: #fff; color: #2d5b89; border-radius: 5px; padding: 4px 7px; font-size: 11px; cursor: pointer; white-space: nowrap; }
.model-tree-add-child:hover { background: #eaf2fb; border-color: #6f9ccc; }
.model-tree-item { width: 100%; display: flex; align-items: center; gap: 9px; text-align: left; border: 0; background: transparent; border-radius: 8px; padding: 9px 8px; color: #263449; cursor: pointer; }
.model-tree-item:hover, .model-tree-item.selected { background: #e4edf9; color: #0f3b74; }
.model-tree-item span:last-child { min-width: 0; display: flex; flex-direction: column; }
.model-tree-item b, .model-tree-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-tree-item small { margin-top: 3px; color: #718096; font-size: 11px; }
.model-tree-icon { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 24px; border-radius: 6px; background: #dbeafe; color: #2563eb; font-size: 11px; }
.model-tree-children { margin: 2px 0 0 22px; border-left: 1px solid #d9e2ef; padding-left: 5px; }
.model-tree-item.model-child { padding: 6px; }
.model-tree-item.model-child .model-tree-icon { background: #ede9fe; color: #7c3aed; }
.model-detail { padding: 28px 34px; overflow: auto; }
.model-detail-form { max-width: 760px; }
.model-detail-title { margin-bottom: 26px; }
.model-detail-title h2 { margin: 3px 0 0; font-size: 20px; color: #172033; }
.model-kicker { color: #64748b; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.model-detail-form label { display: block; color: #475569; font-size: 12px; font-weight: 600; margin-bottom: 14px; }
.model-detail-form input, .model-detail-form select, .model-detail-form textarea { display: block; width: 100%; box-sizing: border-box; margin-top: 6px; border: 1px solid #cbd5e1; border-radius: 7px; padding: 9px 10px; background: #fff; color: #172033; font: inherit; }
.model-detail-form textarea { min-height: 120px; resize: vertical; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; }
.model-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.model-check { display: flex !important; align-items: center; gap: 8px; }
.model-check input { width: auto; margin: 0; }
.model-save { border: 0; border-radius: 7px; background: #172033; color: #fff; padding: 9px 16px; cursor: pointer; }
.model-detail-empty { display: grid; place-items: center; min-height: 300px; color: #94a3b8; }