@import url("../../assets/branding.css");
@import url("design-tokens.css");
@import url("icon-states.css");
/* All 68 standard screens use the same foundation as the approved homepage. */
:root{font-size:100%;--bg:var(--canvas)}
body{font:var(--font-body)/var(--line-body) var(--font-family);color:var(--text);background:var(--canvas)}
*{box-sizing:border-box}h1,h2,h3,strong{color:var(--ink)}h1{font-size:var(--font-title);line-height:var(--line-title);letter-spacing:-.4px}h2{font-size:var(--font-heading);line-height:var(--line-heading)}
:is(button,input,select,textarea){font:inherit}:is(button,a,input,select,textarea,summary):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
a{color:var(--brand)}.small,small,.muted{font-size:var(--font-caption);line-height:var(--line-caption)}.muted{color:var(--muted)}
.btn{min-height:36px;padding:7px 14px;border-radius:var(--radius-control);border-color:var(--control-border);color:var(--text);font-size:14px;gap:8px;transition:background var(--motion-fast),border-color var(--motion-fast)}
.btn:hover{background:var(--brand-soft);border-color:var(--control-hover);color:var(--brand)}.btn.primary{background:var(--brand);border-color:var(--brand);color:white;box-shadow:0 2px 5px #2c63ef12}.btn.primary:hover{background:var(--brand-hover)}.btn:disabled{opacity:1;background:var(--disabled-bg);border-color:var(--line);color:var(--disabled-text);box-shadow:none;cursor:not-allowed}.buttons{gap:8px}
.tag{border-radius:6px;padding:3px 8px;font-size:12px;line-height:18px;background:var(--brand-soft);color:var(--brand)}.tag.green{background:var(--green-bg);color:var(--green)}.tag.amber{background:var(--amber-bg);color:var(--amber)}.tag.red{background:var(--red-bg);color:var(--red)}
.design-bar{height:48px;background:#fff;color:var(--muted);border-bottom:1px solid var(--line);box-shadow:none;font-size:12px;padding:0 20px;gap:12px;z-index:40}.design-bar a,.design-bar strong{color:var(--text)}.design-bar strong{font-weight:600}.design-bar select,.design-bar button{background:var(--canvas);color:var(--text);border:1px solid var(--control-border);border-radius:8px;min-height:30px;font-size:12px}.design-bar select{max-width:260px}
.app-sidebar{width:240px;top:48px;background:var(--sidebar-surface);border-color:var(--line);padding:0 16px;z-index:30}.app{margin-left:240px;min-width:0}.brand{height:88px;padding:18px 8px;gap:12px}.brand-mark{height:38px;width:38px;border-radius:12px;background:var(--brand);color:#fff;box-shadow:var(--shadow-selected)}.brand strong{font-size:18px;letter-spacing:-.3px}.brand small{font-size:11px;color:var(--muted)}.nav-caption{font-size:10px;color:var(--subtle);padding:0 12px;margin:10px 0 12px;letter-spacing:1px}.nav-scroll{padding:0;scrollbar-width:thin}.nav-link{height:48px;margin:4px 0;padding:12px;border-radius:12px;font-size:14px;font-weight:500;color:var(--muted);gap:12px}.nav-link .icon{width:22px;height:22px}.nav-link:hover{background:var(--brand-soft);color:var(--brand)}.nav-link.active{background:var(--brand);color:#fff;box-shadow:var(--shadow-selected);--icon-cutout:var(--brand)}.nav-link .chev{font-size:16px;opacity:.75}.nav-children{margin:8px 0 12px 22px;padding-left:12px;border-color:var(--line);max-height:270px}.nav-child{font-size:13px;border-radius:8px;padding:8px 12px;margin:3px 0;color:var(--muted);line-height:20px}.nav-child.active{background:var(--brand-soft);color:var(--brand);font-weight:600}.sidebar-footer{font-size:11px;color:var(--muted);line-height:20px;border-color:var(--line);padding:16px 8px;background:var(--sidebar-surface)}
.ui-sidebar-toggle{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:36px;background:white;border:1px solid var(--control-border);border-radius:10px;color:var(--muted);cursor:pointer;margin-bottom:10px;font-size:12px}.ui-mobile-toggle{display:none}
.topbar{height:64px;padding:0 32px;border-color:var(--line);background:#fff}.crumb,.org{font-size:13px;color:var(--muted)}.crumb b{color:var(--ink);font-weight:500}.avatar{background:var(--brand-soft);color:var(--brand);border-radius:50%}.main{padding:28px 32px 40px;max-width:1800px;margin:auto}.page-head{align-items:flex-start;margin-bottom:24px;gap:24px}.page-head h1{margin:4px 0 8px}.page-head p{font-size:13px;line-height:22px;color:var(--muted);max-width:840px}.eyebrow{font-size:11px;letter-spacing:.7px;color:var(--subtle);margin-bottom:8px}.page-head>.buttons{padding-top:24px;flex-shrink:0}
.panel,.guide-section,.loading-card{border-radius:16px;border-color:var(--line);box-shadow:var(--shadow-card);margin-bottom:24px;background:white}.panel-pad{padding:24px}.panel-head{padding:22px 24px 18px;gap:16px;flex-wrap:wrap}.panel-head h2{font-size:16px}.panel-head small{font-size:12px;color:var(--muted)}.panel-foot{padding:14px 24px;background:#fcfdff;border-color:var(--line);font-size:12px;color:var(--muted)}.panel-pad .panel-head{padding:0 0 18px}.cols{gap:24px;grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr)}.cols.equal{grid-template-columns:repeat(2,minmax(0,1fr))}.cols.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.metrics{gap:20px;margin-bottom:24px}.metric{border-radius:16px;padding:20px 24px;border:1px solid var(--line);box-shadow:var(--shadow-card)}.metric.focus{border-top:1px solid var(--line)}.metric .label{font-size:13px;color:var(--muted);align-items:center;margin-bottom:12px}.metric .label .icon{width:26px;height:26px;padding:0;color:var(--brand)}.metric .value{font-size:32px;line-height:42px;font-variant-numeric:tabular-nums;letter-spacing:-.6px;color:var(--ink);margin:0 0 8px}.metric .value em{font-size:13px;letter-spacing:0;margin-left:6px;color:var(--muted)}.metric small{font-size:12px;color:var(--muted)}
.scope{padding:20px 24px;border-radius:16px;border-color:var(--line);gap:16px;margin-bottom:24px}.control{min-width:150px}.control.search{min-width:230px}.control label,.field>label{font-size:13px;color:var(--text);font-weight:500;margin-bottom:8px}.control :is(input,select),.field :is(input,select,textarea),.scope>input{font-size:14px;color:var(--text);border:1px solid var(--control-border);border-radius:10px;min-height:38px;padding:8px 12px;background:#fff}.field textarea{min-height:120px;line-height:24px}.field :is(input,select,textarea):hover,.control :is(input,select):hover{border-color:var(--control-hover)}.field [readonly]{background:var(--canvas);color:var(--muted)}.field [aria-invalid="true"]{border-color:var(--red);background:#fffafa}.field small{font-size:12px;color:var(--muted);line-height:20px}.field small.field-error{color:var(--red)}.field{min-width:0}.form-grid{gap:24px 32px}.form-footer{padding:16px 24px;border-color:var(--line);box-shadow:0 -4px 16px #1d293904}.upload{border:1px dashed #adc2ed;background:#f8faff;border-radius:12px;padding:26px}.upload .icon{width:28px;height:28px;color:var(--brand)}
.table-scroll{max-width:100%;overscroll-behavior-x:contain}table{font-size:14px;line-height:22px}th{font-size:12px;font-weight:500;color:var(--muted);background:#f8faff;padding:13px 20px;border-color:var(--line)}td{padding:var(--row-padding) 20px;border-color:var(--line);color:var(--text)}tbody tr:hover{background:#fafcff}td strong{font-weight:500;color:var(--ink)}td small{font-size:12px;color:var(--muted);line-height:20px}.text-link{font-size:13px;color:var(--brand);line-height:22px}.table-toolbar{padding:18px 24px;gap:12px;flex-wrap:wrap}.table-toolbar strong{font-size:14px}.pagination{padding:16px 24px;font-size:12px;border-color:var(--line);flex-wrap:wrap;gap:12px}.pagination .btn{min-height:32px;font-size:12px;padding:4px 10px}
.tabs{padding:0 24px;gap:28px;border-color:var(--line)}.tabs button{font-size:14px;padding:16px 0;color:var(--muted)}.tabs button.active{color:var(--brand);border-color:var(--brand)}.summary-grid{gap:24px 32px}.summary-grid dt{font-size:12px;color:var(--muted);margin-bottom:7px}.summary-grid dd{font-size:14px;color:var(--text);line-height:24px;overflow-wrap:anywhere}.timeline{font-size:14px}.timeline small{font-size:12px}.stepper{padding:24px;gap:8px}.step{font-size:13px}.step-num{height:30px;width:30px}.step.done{color:var(--green)}.route-row{padding:18px 0;border-color:var(--line);gap:16px}.route-row strong{font-size:14px;font-weight:500}.route-row small{font-size:12px;line-height:20px;margin-top:5px}.note{font-size:13px;line-height:22px;border:1px solid #e5edff;background:var(--brand-soft);color:#35568d;border-radius:10px;padding:12px 16px}.note.warning{background:var(--amber-bg);color:var(--amber);border-color:#f7e9ca}.note.success{background:var(--green-bg);color:var(--green);border-color:#dcefe7}
.quick-grid{gap:16px}.quick{border-color:var(--line);border-radius:14px;padding:20px;transition:border-color 120ms,background 120ms}.quick:hover{background:var(--brand-soft);border-color:var(--control-hover)}.quick>.icon{box-sizing:content-box;width:28px;height:28px;padding:10px;background:var(--icon-surface);border-radius:14px;color:var(--brand)}.quick strong{font-size:14px;margin-top:12px}.quick small{font-size:12px;color:var(--muted);line-height:20px}.config-grid{gap:20px}.config-card{border-color:var(--line);border-radius:16px;padding:24px}.config-card h2{font-size:16px}.config-card p{font-size:13px;line-height:22px;color:var(--muted)}.config-icon{border-radius:14px;background:var(--icon-surface);color:var(--brand)}.config-icon .icon{height:28px;width:28px}
.empty{padding:56px 24px;background:white;border:1px solid var(--line);border-radius:16px}.empty h2{font-size:16px;margin:0 0 8px}.empty p{font-size:13px;color:var(--muted);line-height:22px;max-width:520px;margin:0 auto 20px}.empty>.empty-icon{display:none}.empty .buttons{flex-wrap:wrap}.loading-card{padding:24px}.skeleton{border-radius:8px;background:linear-gradient(90deg,#f3f6fb,#eaf0f9,#f3f6fb);background-size:200% 100%}
.split-work{gap:24px;grid-template-columns:220px minmax(0,1fr)}.item-picker button{font-size:14px;border-radius:10px;padding:14px;line-height:22px}.item-picker small{font-size:12px;color:var(--muted)}.item-picker button.active{background:var(--brand-soft);border-color:var(--control-hover);color:var(--brand)}.chat-welcome h1{font-size:28px;line-height:40px}.chat-welcome p{font-size:14px;color:var(--muted)}.chat-compose{border-color:var(--control-border);border-radius:16px;box-shadow:var(--shadow-card);padding:20px}.chat-compose textarea{font-size:14px;line-height:24px}.chat-response{border-color:var(--line);border-radius:16px;padding:24px;font-size:14px;line-height:26px}.report-paper{border-color:var(--line);border-radius:16px;font-size:14px;line-height:28px}.report-paper p{color:var(--text)}.chart text{font-size:11px;fill:var(--muted)}.chart{height:220px}.legend{font-size:12px}.progress-track{height:6px;background:#eef2f8;border-radius:6px}.progress-track span{background:var(--brand)}
.dialog{border-radius:20px;box-shadow:var(--shadow-overlay);border:1px solid var(--line);color:var(--text);max-width:min(920px,calc(100vw - 32px))}.dialog::backdrop{background:#182b4947;backdrop-filter:blur(2px)}.dialog>header{padding:24px;border-color:var(--line)}.dialog>header h2{font-size:20px;line-height:28px}.dialog>header p{font-size:12px;color:var(--muted)}.dialog-body{padding:24px}.dialog>footer{padding:16px 24px;border-color:var(--line);background:#fcfdff}.dialog.drawer{max-width:min(720px,100vw);border-radius:20px 0 0 20px}.dialog table{font-size:13px}.dialog td{white-space:normal;min-width:90px}.dialog .cols{grid-template-columns:repeat(2,minmax(0,1fr))}.toast{border-radius:10px;font-size:14px;box-shadow:var(--shadow-overlay)}
.prototype-footer{padding-top:16px;font-size:11px;color:var(--muted);gap:16px;flex-wrap:wrap}.hub-main{max-width:1500px;padding:40px 32px}.hub-nav{background:white;border-color:var(--line);font-size:14px}.hub-nav a.active{color:var(--brand)}.hero{border-color:var(--line);border-radius:20px;box-shadow:none;background:linear-gradient(125deg,#eef4ff,#fff 65%)}.hero p{font-size:14px;color:var(--muted)}.guide-section{padding:28px}.guide-section p,.guide-section li{font-size:14px;line-height:26px}.module-card,.gallery-card,.flow-card{border-color:var(--line);border-radius:16px;box-shadow:var(--shadow-card)}.gallery-card img{border-color:var(--line)}.gallery-card h3,.module-card h2{font-size:16px}.gallery-card p,.module-card p{font-size:13px}.flow-svg text{font-family:var(--font-family)}
@media(min-width:901px){body.ui-nav-collapsed .app-sidebar{width:76px;padding:0 10px}body.ui-nav-collapsed .app{margin-left:76px}body.ui-nav-collapsed :is(.brand>span:last-child,.nav-caption,.nav-link>span,.nav-children,.sidebar-footer>span,.ui-sidebar-toggle>span){display:none}body.ui-nav-collapsed .brand{justify-content:center;padding:18px 0}body.ui-nav-collapsed .nav-link{justify-content:center;padding:12px}body.ui-nav-collapsed .sidebar-footer{padding:12px 0}body.ui-nav-collapsed .nav-scroll{overflow:visible}}
@media(max-width:1280px){.main{padding:24px}.topbar{padding:0 24px}.metric{padding:18px}.metrics{gap:16px}.cols{grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr)}.page-head{flex-wrap:wrap}.page-head>.buttons{padding-top:0}.design-bar{gap:8px}.design-bar .state-label{display:none}.design-bar select{max-width:220px}}
@media(max-width:900px){.app{margin-left:0}.app-sidebar{display:flex;top:0;transform:translateX(-100%);width:240px;transition:transform 180ms;box-shadow:var(--shadow-overlay);z-index:80}.ui-nav-open .app-sidebar{transform:translateX(0)}.ui-mobile-toggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;background:white;border:1px solid var(--control-border);border-radius:10px;color:var(--text);margin-right:10px}.topbar .crumb{display:flex;align-items:center;min-width:0}.org .company-name,.org .divider,.org>.tag{display:none}.design-bar{height:auto;min-height:48px;padding:8px 12px;flex-wrap:wrap}.design-bar>strong,.design-bar>a:last-child{display:none}.design-bar select{flex:1;max-width:230px;min-width:85px}.cols,.cols.equal,.cols.three{grid-template-columns:1fr}.config-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ui-nav-backdrop{position:fixed;inset:0;border:0;background:#182b4947;z-index:70}.nav-children{max-height:250px}.sidebar-footer{padding:12px 0}.hub-main{padding:24px}.split-work{grid-template-columns:1fr}.item-picker{display:flex;overflow:auto;gap:8px}.item-picker button{min-width:180px}}
@media(max-width:560px){.main{padding:20px 16px}.topbar{padding:0 16px}.org{gap:8px}.org>span:last-child{display:none}.crumb{font-size:12px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.metric{padding:16px}.metric .value{font-size:25px}.metric .value em{font-size:11px}.metric .label{font-size:12px;gap:5px}.metric .label .icon{height:22px;width:22px}.metric small{font-size:11px}.panel-pad,.panel-head,.scope{padding:20px}.scope{gap:14px}.control,.control.search{min-width:100%;width:100%}.form-grid,.summary-grid,.quick-grid,.config-grid{grid-template-columns:1fr}.page-head h1{font-size:23px}.page-head .buttons{width:100%}.stepper{padding:16px;overflow:auto}.step{min-width:105px;font-size:12px}.panel-foot{padding:14px 20px}.dialog .cols{grid-template-columns:1fr}.dialog>header,.dialog-body{padding:20px}.dialog.drawer{border-radius:16px 0 0 16px}.report-paper{padding:24px}.table-toolbar,.pagination{padding:16px}.hub-main{padding:20px 16px}.guide-section{padding:20px}.hub-nav{padding:12px 16px;flex-wrap:wrap}.chat-welcome h1{font-size:24px}.empty{padding:40px 20px}}