/* GuYi Access visual system, adapted for the Zhixing release console.
   Reference project: MIT, copyright GuYiovo; notice in vendor/GuYi-LICENSE.txt. */
:root{color-scheme:light;--canvas:#f8fafc;--surface:#fff;--subtle:#f8fafc;--sidebar:#fff;--line:#f1f5f9;--line-strong:#e2e8f0;--ink:#0f172a;--muted:#64748b;--accent:#3b82f6;--accent-hover:#2563eb;--green:#047857;--green-tint:#ecfdf5;--red:#be123c;--red-tint:#fff1f2;--amber:#92400e;--amber-tint:#fffbeb;--radius:16px;--elevation:0 20px 50px #0f172a26;--card-shadow:0 1px 3px #00000005,0 4px 12px #00000005;--sidebar-width:250px;font-synthesis:none}
*{box-sizing:border-box;scrollbar-color:#b7c3d3 var(--subtle);scrollbar-width:thin}[hidden]{display:none!important}html{min-height:100%;scroll-padding-top:24px}body{margin:0;background:var(--canvas);color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei UI','PingFang SC',sans-serif;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #245bd666;outline-offset:3px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #245bd629;outline-offset:1px;border-color:var(--accent)}::selection{color:#153c87;background:#d9e6ff}input,textarea{caret-color:var(--accent)}h1,h2,h3,p{margin:0}h1{font-size:24px;font-weight:700;line-height:1.35;letter-spacing:-.025em;text-wrap:balance}h2{font-size:16px;font-weight:600;line-height:1.5}h3{font-size:13px;font-weight:600}a{color:var(--accent);text-underline-offset:3px}svg{flex-shrink:0}.icon-library{position:absolute;width:0;height:0;overflow:hidden}.icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;font-size:20px;flex-shrink:0;vertical-align:middle}.muted,.faint{color:var(--muted)}.faint,.hint{font-size:12px}.hint{color:var(--muted);line-height:1.65}.mono,code{font-family:'Cascadia Code',Consolas,monospace;font-size:12px}.numeric{font-variant-numeric:tabular-nums}.nowrap{white-space:nowrap}.break{overflow-wrap:anywhere}.spacer{flex:1}.brand-mark{width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;border-radius:8px;background:var(--accent);color:white;font-size:19px;font-weight:600;line-height:1}.brand{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:600}
/* Content and forms */
.section{box-shadow:var(--card-shadow);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:20px;overflow:hidden}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 24px;border-bottom:1px solid var(--line)}.section-head>div>p{margin-top:3px;color:var(--muted);font-size:12px}.section-body{padding:24px}.section-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 22px;background:var(--subtle);border-top:1px solid var(--line)}.section-foot p{font-size:12px;color:var(--muted)}.release-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(245px,.43fr);align-items:start;gap:20px}.release-grid>*{min-width:0}.release-grid .section{margin-bottom:0}.release-aside{display:grid;gap:20px}.release-summary{display:grid;grid-template-columns:minmax(110px,.65fr) minmax(220px,1.7fr) minmax(90px,.6fr) minmax(135px,1fr);gap:24px;padding:23px 22px;align-items:start}.summary-label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.summary-value{font-size:14px;font-weight:600;overflow-wrap:anywhere}.version-number{font-size:23px;line-height:1.25;font-weight:600;letter-spacing:-.025em}.summary-sub{color:var(--muted);font-size:12px;margin-top:5px}.package-name{display:flex;align-items:flex-start;gap:8px}.package-name .icon{width:17px;height:17px;margin-top:3px;color:var(--muted)}.details-line{padding:12px 22px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);display:flex;align-items:center;gap:12px}.details-line details{min-width:0;width:100%}summary{cursor:pointer}.details-line details>div{margin-top:10px;overflow-wrap:anywhere}.release-notes{white-space:pre-wrap;color:var(--muted);font-size:12px;line-height:1.8;max-height:200px;overflow:auto}.field{display:grid;gap:6px;min-width:0}.field>span:first-child,.field-label{font-weight:500;font-size:13px;color:var(--ink)}.required{color:var(--red);margin-left:3px}input[type='text'],input[type='password'],input[type='number'],input[type='url'],select,textarea{width:100%;border:1px solid var(--line-strong);background:var(--canvas);color:var(--ink);border-radius:8px;padding:9px 12px;min-height:40px;transition:border-color .15s,outline .15s}input::placeholder,textarea::placeholder{color:#68798e;opacity:1}textarea{resize:vertical;min-height:112px;line-height:1.75}.form-stack{display:grid;gap:18px}.field-row{display:grid;grid-template-columns:minmax(140px,.8fr) minmax(150px,1fr);gap:20px;align-items:start}.readonly-value{display:flex;align-items:center;min-height:37px;color:var(--muted);font-size:12px}.field-topline{display:flex;justify-content:space-between;gap:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 13px;border:1px solid var(--line-strong);border-radius:6px;background:white;color:#34465f;text-decoration:none;line-height:1.5;white-space:nowrap;font-size:12px;font-weight:500;transition:background .15s,border-color .15s}.button:hover:not(:disabled){background:#f2f5fa;border-color:#acbbcf}.button:active:not(:disabled){background:#e8edf5}.button .icon{width:15px;height:15px}.button.primary{background:var(--accent);border-color:var(--accent);color:white}.button.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.button.ghost{background:transparent;border-color:transparent}.button.ghost:hover:not(:disabled){background:#edf1f7;border-color:transparent}.button.danger{color:var(--red);border-color:#edc4c9}.button.danger:hover:not(:disabled){background:var(--red-tint);border-color:#dba0a9}.button.danger-solid{background:var(--red);color:white;border-color:var(--red)}.button.danger-solid:hover:not(:disabled){background:#921d29;border-color:#921d29}.button.small{min-height:30px;padding:4px 10px;font-size:12px}.button.block{width:100%}.button.icon-button{padding:6px;min-width:32px}.text-button{padding:0;border:0;background:none;color:var(--accent);font-size:12px}.text-button:hover{text-decoration:underline;text-underline-offset:3px}.button-group{display:flex;gap:8px;align-items:center}.dropzone{width:100%;display:flex;align-items:center;justify-content:center;gap:14px;min-height:92px;padding:16px;border:1px dashed #b7c5d8;border-radius:8px;background:#fbfcfe;color:var(--muted);text-align:left;transition:background .15s,border-color .15s}.dropzone>.icon{width:24px;height:24px;color:#7187a5}.dropzone strong{display:block;font-size:12px;font-weight:500;color:var(--ink)}.dropzone .hint{display:block;margin-top:2px}.dropzone:hover,.dropzone.dragging{border-color:var(--accent);background:#f1f5fe}.upload-file{display:flex;align-items:center;gap:11px;padding:14px;background:var(--subtle);border:1px solid var(--line);border-radius:8px;min-width:0}.upload-file>div{flex:1;min-width:0}.upload-file strong{display:block;overflow-wrap:anywhere;font-size:12px}.upload-file>.icon{color:var(--accent)}.form-error{padding:10px 12px;border-radius:6px;background:var(--red-tint);color:var(--red);font-size:12px;overflow-wrap:anywhere}.inline-note{display:flex;align-items:flex-start;gap:8px;padding:12px 14px;background:var(--subtle);color:var(--muted);border-radius:6px;font-size:12px;line-height:1.75}.inline-note>.icon{width:16px;height:16px;margin-top:2px}.inline-note.warn{background:var(--amber-tint);color:var(--amber)}.aside-list{display:grid;margin:0;gap:14px}.aside-list div{display:flex;gap:10px;justify-content:space-between}.aside-list dt{color:var(--muted);font-size:12px}.aside-list dd{margin:0;font-size:12px;font-weight:500;text-align:right}.aside-note{padding-top:16px;margin-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;line-height:1.8}.endpoint{display:grid;gap:7px}.endpoint+.endpoint{margin-top:17px}.endpoint-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:500}.endpoint code{display:block;padding:9px;border-radius:5px;background:var(--subtle);color:var(--muted);overflow-wrap:anywhere;line-height:1.65}.badge{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line-strong);border-radius:6px;padding:2px 8px;white-space:nowrap;font-size:12px;font-weight:500;color:#586980;background:#edf1f6}.badge.ok{border-color:#a7f3d0;background:var(--green-tint);color:var(--green)}.badge.fail{border-color:#fecdd3;background:var(--red-tint);color:var(--red)}.badge.warn{border-color:#fde68a;background:var(--amber-tint);color:var(--amber)}.badge.blue{border-color:#bfdbfe;color:#2559be;background:#edf3ff}
/* Data views */
.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;text-align:left;font-size:13px;font-variant-numeric:tabular-nums}.table th{font-size:12px;letter-spacing:.025em;background:var(--subtle);color:var(--muted);font-weight:500;white-space:nowrap;padding:12px 16px;border-bottom:1px solid var(--line)}.table th:first-child,.table td:first-child{padding-left:22px}.table th:last-child,.table td:last-child{padding-right:22px}.table td{padding:14px 16px;border-bottom:1px solid #edf0f5;vertical-align:middle}.table tr:last-child td{border-bottom:0}.table tbody tr:hover{background:#f1f5f9}.table .align-right{text-align:right}.table .row-title{font-weight:500}.table .row-subtitle{margin-top:4px;font-size:11px;color:var(--muted)}.ua-cell{max-width:280px;min-width:160px;overflow-wrap:anywhere;color:var(--muted);font-size:11px}.ua-cell summary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}.ua-cell details[open] summary{white-space:normal;overflow-wrap:anywhere}.filters{display:flex;align-items:end;flex-wrap:wrap;gap:10px;padding:18px 22px}.filters .field{min-width:130px}.filters .grow{flex:1;max-width:300px}.pager{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 22px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.summary-strip{display:flex;gap:24px;padding:13px 22px;color:var(--muted);background:var(--subtle);border-bottom:1px solid var(--line);font-size:12px;flex-wrap:wrap}.summary-strip strong{color:var(--ink);font-weight:600;margin-left:7px;font-variant-numeric:tabular-nums}.summary-strip .danger-text{color:var(--red)}.empty-state{display:grid;justify-items:center;text-align:center;padding:40px 24px;gap:9px}.empty-state>.icon{width:26px;height:26px;color:#7487a1;margin-bottom:5px}.empty-state strong{font-size:14px;font-weight:600}.empty-state p{color:var(--muted);font-size:12px;max-width:55ch}.empty-state .button{margin-top:7px}.error-state{background:white;border:1px solid var(--line);border-radius:var(--radius)}.empty-cell{padding:0!important}.skeleton-block{height:180px;background:#eef2f7;border-radius:var(--radius);margin-bottom:20px}.skeleton-block.short{height:72px;max-width:480px;margin-bottom:24px}.skeleton-block.large{height:290px;background:#f0f3f8}.skeleton-label{color:var(--muted);font-size:12px;margin-bottom:15px}.banner{display:flex;align-items:center;gap:10px;padding:10px 32px;font-size:12px}.banner.warn{background:var(--amber-tint);color:var(--amber);border-bottom:1px solid #efdfbf}.banner .button{margin-left:auto;color:var(--amber);background:transparent;border-color:#e3cdac}.delta-upload-bar{display:flex;align-items:center;gap:20px;padding:20px 22px}.delta-upload-bar>div:first-child{flex:1;min-width:0}.delta-upload-bar p{margin-top:5px;font-size:12px;color:var(--muted)}.delta-selection{border-top:1px solid var(--line);padding:18px 22px;display:grid;gap:12px}.help-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.help-grid p{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.8}.definition-list{margin:0}.definition-list>div{display:grid;grid-template-columns:150px 1fr;gap:25px;padding:14px 0;border-bottom:1px solid var(--line)}.definition-list>div:last-child{border-bottom:none;padding-bottom:0}.definition-list>div:first-child{padding-top:0}.definition-list dt{font-size:12px;font-weight:500}.definition-list dd{margin:0;color:var(--muted);font-size:12px;line-height:1.8}.account-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.62fr);gap:20px;align-items:start}.account-grid .section{margin-bottom:0}.account-form{max-width:440px}
/* Feedback */
.dialog{width:min(510px,calc(100% - 32px));max-height:calc(100vh - 48px);padding:0;background:var(--surface);color:var(--ink);border:0;border-radius:var(--radius);box-shadow:var(--elevation)}.dialog::backdrop{background:#1b2d4b60}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px 24px;border-bottom:1px solid var(--line)}.dialog-body{padding:24px;overflow-wrap:anywhere}.dialog-body>p{color:var(--muted);font-size:13px;line-height:1.8}.dialog-body .definition-list{margin:20px 0}.dialog-body .definition-list>div{grid-template-columns:82px 1fr;gap:16px}.dialog-body .inline-note{margin-top:18px}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;padding:16px 24px;border-top:1px solid var(--line);background:var(--subtle)}.upload-body{display:grid;gap:12px}.upload-icon{color:var(--accent);width:28px;height:28px;margin-bottom:4px}.progress{height:7px;background:#e6ebf3;border-radius:5px;overflow:hidden}.progress-bar{height:100%;width:0;background:var(--accent);transition:none}.progress-meta{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.toast-host{position:fixed;right:24px;bottom:24px;z-index:100;display:grid;gap:10px;max-width:min(430px,calc(100vw - 32px));pointer-events:none}.toast{display:flex;align-items:flex-start;gap:9px;background:var(--ink);color:white;border-radius:8px;padding:12px 16px;font-size:12px;box-shadow:0 6px 20px #00000026;animation:toast-in .18s ease-out;overflow-wrap:anywhere}.toast .icon{width:16px;height:16px;margin-top:2px}.toast.error{background:#92232e}.toast.warn{background:#76511c}.toast.ok{background:#20573e}.toast.leaving{opacity:0;transition:opacity .18s}.skip-link{position:fixed;top:-60px;left:20px;z-index:120;padding:10px 20px;color:white;background:var(--accent);border-radius:5px}.skip-link:focus{top:12px}@keyframes toast-in{from{transform:translateY(6px)}to{transform:translateY(0)}}
/* Keep every release datum available at compact widths. */
.aside-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:13px}
input[readonly]{background:var(--subtle);color:var(--muted);cursor:default}
.archive-back{margin:-7px 0 12px;padding-left:0}
.archive-metadata{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(130px,.8fr) minmax(175px,1fr);gap:24px;padding:23px 22px}
.archive-metadata strong{font-size:13px;font-weight:500}
.archive-package{max-width:340px;overflow-wrap:anywhere;min-width:180px}
.file-path{min-width:230px;max-width:580px;overflow-wrap:anywhere}
.hash-detail{min-width:150px;max-width:290px}
.hash-detail summary{font-size:12px;color:var(--muted)}
.hash-detail code{display:block;overflow-wrap:anywhere;white-space:normal;margin-top:7px;line-height:1.7}
.hash-detail>div{margin-top:8px}
.hash-detail>div code{margin-top:2px}
.filter-error{flex-basis:100%}
.compare-arrow{display:flex;align-items:center;height:37px;color:var(--muted)}
.compare-form .grow{max-width:340px}
.report-source{margin-bottom:20px;border:1px solid var(--line);background:var(--surface)}
.report-reason{min-width:230px;max-width:400px}
.report-detail{margin-top:5px;font-size:11px;color:var(--muted)}
.report-detail dl{margin:9px 0 0;display:grid;gap:9px}
.report-detail dd{margin:3px 0 0;overflow-wrap:anywhere}
.report-detail dt{font-size:11px;font-weight:500}
.report-detail .mono{font-size:11px}
.upload-state{padding:10px 12px;background:var(--subtle);border-radius:6px;font-size:12px;color:var(--muted)}
.upload-state.warn{background:var(--amber-tint);color:var(--amber)}
.upload-timing{font-size:11px}
.upload-recovery{display:grid;gap:10px}
.upload-recovery .button-group{flex-wrap:wrap}
.upload-complete-notice{display:grid;gap:10px}
.upload-complete-notice>.button{justify-self:start}
.release-heading-actions,.release-row-actions,.archive-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.release-row-actions{justify-content:flex-end;min-width:180px;flex-wrap:nowrap}
.release-heading-actions{justify-content:flex-end}
.archive-filters{flex-shrink:0}
.button.selected{border-color:#acc1ed;background:#edf3ff;color:#2559be}
@media(max-width:850px){.archive-list-head,.current-release-head{flex-wrap:wrap}.archive-filters{flex-wrap:wrap}.current-release-head .release-heading-actions{margin-left:auto}}
.announcement-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:20px;align-items:start}
.announcement-grid>*,.announcement-aside{min-width:0}
.announcement-grid>.section{margin-bottom:0}
.announcement-switch{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-bottom:18px;border-bottom:1px solid var(--line);cursor:pointer}
.announcement-switch strong{display:block;font-size:13px;font-weight:500}
.announcement-switch .hint{display:block;margin-top:3px}
.switch-input{appearance:none;position:relative;flex:0 0 38px;width:38px;height:22px;margin:0;border:1px solid #9aaabd;border-radius:12px;background:#9aaabd;cursor:pointer;transition:background .15s,border-color .15s}
.switch-input::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:white;transition:transform .15s}
.switch-input:checked{background:var(--accent);border-color:var(--accent)}
.switch-input:checked::after{transform:translateX(16px)}
.checkbox-field{display:flex;align-items:center;gap:9px;cursor:pointer;font-size:12px;font-weight:500}
.checkbox-field input{width:16px;height:16px;margin:0;accent-color:var(--accent);cursor:pointer}
.announcement-dismiss-setting{display:grid;gap:7px;padding-top:2px}
.announcement-dismiss-setting>.hint{padding-left:25px}
.announcement-preview-body{display:grid;gap:18px;padding:22px}
.announcement-preview-body h3{font-size:17px;line-height:1.5;overflow-wrap:anywhere}
.announcement-copy{white-space:pre-wrap;overflow-wrap:anywhere;max-height:360px;overflow-y:auto;line-height:1.85}
.announcement-preview-link{font-size:12px;color:var(--muted);padding-top:15px;border-top:1px solid var(--line)}
.preview-text-action{display:block;margin-top:8px;color:var(--accent);font-size:12px}
.announcement-preview-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.announcement-preview-actions .button:disabled{opacity:1;cursor:default}
.announcement-rules.definition-list>div{grid-template-columns:66px minmax(0,1fr);gap:18px}
@media(max-width:1080px){.announcement-grid{grid-template-columns:minmax(0,1fr)}.announcement-aside{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:20px;align-items:start}.announcement-aside>.section{margin:0}}
@media(max-width:720px){.announcement-aside{grid-template-columns:minmax(0,1fr);gap:16px}.announcement-grid{gap:16px}.announcement-preview-body{padding:18px 17px}.announcement-grid .section-head{flex-wrap:wrap}.announcement-preview-actions{gap:7px}}
@media(max-width:720px){.archive-metadata{grid-template-columns:minmax(0,1fr);gap:16px;padding:18px 17px}.archive-back{margin-bottom:10px}.compare-form{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch}.compare-form .grow{min-width:0;max-width:none}.compare-arrow{display:none}.compare-form .button{justify-self:start}.report-source{margin-bottom:16px}.report-source>.icon{display:none}}
.package-warning{margin:16px 22px 0}
@media(max-width:1180px){.release-summary{grid-template-columns:minmax(120px,.8fr) minmax(180px,1.4fr)}.release-summary>div:last-child{display:block}}
@media(max-width:720px){.release-summary{grid-template-columns:minmax(85px,.75fr) minmax(0,1.5fr)}.release-summary>div:nth-child(3){display:block}.package-warning{margin:14px 17px 0}.sidebar-brand>span:last-child{gap:7px}.sidebar-brand small{font-size:11px}}

/* Cloud delivery uses the existing compact release workspace. */
.cloud-result { border-top: 1px solid var(--line); display: grid; gap: 18px; }
.cloud-result-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.cloud-result-head h3 { overflow-wrap: anywhere; min-width: 0; }
.cloud-link { min-height: 112px; overflow-wrap: anywhere; word-break: break-all; font-size: 13px; }
.cloud-result .button-group { flex-wrap: wrap; }
#cloud-form details .field { margin-top: 16px; }

/* GuYi shell: 250 px white sidebar, 64 px header, grouped blue navigation. */
.app-shell { display: block; min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-width); z-index: 40; display: flex; flex-direction: column; background: var(--surface); border-right: 1px solid var(--line); box-shadow: 4px 0 24px #0000000f;  }
.sidebar-brand { height: 64px; min-height: 64px; display: flex; align-items: center; gap: 12px; padding: 0 24px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.sidebar-brand .brand-mark { width: 30px; height: 30px; flex-basis: 30px; font-size: 18px; }
.logo-info { display: flex; flex-direction: column; white-space: nowrap; overflow: hidden; }
.logo-info strong { font-size: 16px; font-weight: 700; line-height: 1.4; }
.logo-info small { font-size: 11px; color: var(--accent-hover); font-weight: 600; }
.nav-list { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; padding: 12px 0 16px; }
.menu-group { margin: 18px 24px 8px; color: var(--muted); font-size: 11px; font-weight: 600; letter-spacing: .04em; white-space: nowrap; }
.nav-item { display: flex; align-items: center; gap: 12px; min-height: 42px; margin: 4px 16px; padding: 10px 16px; border: 0; border-radius: 8px; background: transparent; color: #475569; font-weight: 500; text-align: left; transition: background .16s,color .16s; }
.nav-item .icon { width: 22px; font-size: 21px; }
.nav-item span { white-space: nowrap; }
.nav-item:hover { background: #f1f5f9; color: var(--ink); }
.nav-item.active { color: white; background: #2872e3; box-shadow: 0 4px 12px #3b82f640; }
.sidebar-bottom { margin-top: auto; padding-top: 12px; }
.sidebar-bottom .nav-item { width: calc(100% - 32px); }
.workspace-label { display: flex; gap: 8px; align-items: center; border-top: 1px solid var(--line); margin: 20px 24px 0; padding-top: 16px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.workspace-label>span:last-child { margin-left: auto; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #64748b; }
.workspace { margin-left: var(--sidebar-width); min-width: 0;  }
.topbar { position: sticky; top: 0; z-index: 30; height: 64px; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #ffffffed; border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); }
.header-left { display: flex; align-items: center; gap: 22px; min-width: 0; }
.sider-toggle { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #475569; }
.sider-toggle .icon { font-size: 24px; }
.sider-toggle:hover { background: #f1f5f9; }
.breadcrumb { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 13px; }
.breadcrumb strong { color: #475569; font-weight: 500; }
.breadcrumb-slash { color: #94a3b8; }
.topbar-actions { display: flex; align-items: center; gap: 12px; font-size: 13px; color: #475569; }
.avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--accent-hover); background: #eff6ff; font-size: 13px; font-weight: 600; }
.topbar-actions .button { border-left: 1px solid var(--line); border-radius: 0; margin-left: 2px; }
.content { padding: 28px 32px; max-width: 1680px; margin: 0 auto; min-width: 0; }
.content-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; color: var(--muted); margin-top: 28px; padding-bottom: 6px; font-size: 11px; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 28px; }
.page-head p { color: var(--muted); margin-top: 6px; font-size: 13px; }
.page-actions { display: flex; gap: 8px; flex-shrink: 0; }
.sider-collapsed { --sidebar-width: 80px; }
.sider-collapsed .sidebar-brand { justify-content: center; padding: 0; }
.sider-collapsed .logo-info,.sider-collapsed .menu-group,.sider-collapsed .nav-item span,.sider-collapsed .workspace-label { display: none; }
.sider-collapsed .nav-item { justify-content: center; padding: 12px 0; }
.sider-collapsed .nav-list { gap: 4px; padding-top: 20px; }
.mobile-nav,.mobile-brand { display: none; }

/* Matching component finishes across every route. */
.section-head h2 { display: flex; align-items: center; gap: 8px; }
.section-head h2>.icon { color: var(--accent); }
.section-head p,.form-stack>div>p { line-height: 1.8; }
.form-stack>div>p { color: var(--muted); font-size: 13px; margin-top: 5px; }
.form-stack { gap: 22px; }
.button { border-radius: 8px; min-height: 36px; padding: 7px 15px; font-size: 13px; font-weight: 500; box-shadow: 0 1px 2px #00000005; }
.button:hover { background: #eff6ff; border-color: #93c5fd; color: var(--accent-hover); }
.button.primary { color: #fff; background: #2872e3; border-color: #2872e3; box-shadow: 0 2px 6px #3b82f640; }
.button.primary:hover { color: #fff; background: var(--accent-hover); border-color: var(--accent-hover); }
.button.danger { color: var(--red); border-color: #fecdd3; background: #fff; }
.button.danger:hover { background: var(--red-tint); border-color: #fda4af; }
.button.ghost { box-shadow: none; background: transparent; border-color: transparent; }
.button.ghost:hover { background: #f1f5f9; color: var(--ink); }
.button.small { min-height: 30px; font-size: 12px; padding: 4px 10px; }
.button.icon-button { padding: 6px; width: 34px; height: 34px; }
.button-group { flex-wrap: wrap; }
.button .icon,.text-button .icon { width: 17px; height: 17px; font-size: 17px; }
.text-button { display: inline-flex; align-items: center; gap: 6px; }
.text-button:hover { color: var(--accent-hover); }
.section-foot { padding: 16px 24px; background: var(--surface); }
input:not([type='checkbox']):hover,select:hover,textarea:hover { border-color: #cbd5e1; }
input:not([type='checkbox']):focus,select:focus,textarea:focus { background: #fff; border-color: var(--accent); box-shadow: 0 0 0 3px #3b82f626; outline: none; }
input::placeholder,textarea::placeholder { color: #64748b; }
.field-topline { gap: 8px; }
.empty-state { padding: 44px 24px; }
.empty-state>.icon { width: 40px; height: 40px; font-size: 36px; color: #94a3b8; }
.summary-strip { background: #f8fafc; padding: 16px 24px; gap: 12px 24px; }
.filters { padding: 20px 24px; gap: 12px; }
.table th { padding: 14px 20px; color: #475569; }
.table td { padding: 14px 20px; color: #475569; border-color: var(--line); }
.table .row-title { color: var(--ink); font-weight: 500; }
.table th:first-child,.table td:first-child { padding-left: 24px; }
.table th:last-child,.table td:last-child { padding-right: 24px; }
.release-grid { grid-template-columns: minmax(0,1fr) minmax(280px,.45fr); gap: 24px; }
.release-aside { display: grid; gap: 24px; }
.release-summary { padding: 24px; }
.release-summary>div:last-child { display: block; }
.version-number { font-size: 26px; font-weight: 700; }
.release-summary>div:first-child .version-number { color: var(--accent-hover); }
.release-aside .section-body>.button { margin-top: 14px; }
.release-aside .endpoint { margin-top: 12px; }
.cloud-result { background: #fcfdff; gap: 20px; }
.cloud-result>.muted { padding: 14px 0; text-align: center; font-size: 13px; }
.cloud-link { background: white; }
.cloud-result .definition-list>div { grid-template-columns: 95px minmax(0,1fr); }
.announcement-grid { gap: 24px; }
.announcement-preview-body { padding: 24px; }
.announcement-aside>.section+.section { margin-top: 24px; }
.account-grid { gap: 24px; }
.announcement-copy { font-size: 14px; }
.dialog { border-radius: 16px; }
.dialog::backdrop { background: #0f172a66; backdrop-filter: blur(4px); }
.toast-host { inset: 24px auto auto 50%; transform: translateX(-50%); z-index: 100; }
.toast { background: white; color: var(--ink); border: 1px solid var(--line); padding: 12px 20px; font-size: 13px; border-radius: 12px; box-shadow: 0 10px 25px #0f172a1a; }
.toast.ok { background: #fff; color: var(--green); }.toast.warn { background: #fff; color: var(--amber); }.toast.error { background: #fff; color: var(--red); }

/* Overview follows the reference's four statistics and primary/aside composition. */
.stats-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; margin-bottom: 24px; }
.stat-card { display: flex; align-items: flex-start; gap: 16px; min-width: 0; padding: 24px 20px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: var(--card-shadow); text-align: left; color: var(--ink); transition: border-color .16s,box-shadow .16s; }
button.stat-card:hover { border-color: #bfdbfe; box-shadow: 0 4px 16px #0f172a0d; }
.stat-icon { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: #eff6ff; color: #2563eb; }
.stat-icon .icon { font-size: 25px; }
.stat-card.green .stat-icon { color: #059669; background: #ecfdf5; }
.stat-card.amber .stat-icon { color: #d97706; background: #fffbeb; }
.stat-card.violet .stat-icon { color: #7c3aed; background: #f5f3ff; }
.stat-content { display: flex; flex-direction: column; min-width: 0; }
.stat-title { font-size: 13px; color: #475569; font-weight: 500; }
.stat-value { font-size: 28px; font-weight: 700; line-height: 1.3; margin: 6px 0 8px; letter-spacing: -.025em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.stat-note { color: var(--muted); font-size: 11px; line-height: 1.7; }
.overview-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.45fr); gap: 24px; align-items: start; }
.overview-grid>* { min-width: 0; }
.overview-grid .section { margin-bottom: 24px; }
.overview-version { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.overview-version>div { min-width: 0; }.overview-version h3 { font-size: 22px; font-weight: 700; margin-bottom: 4px; }
.overview-version p { font-size: 13px; }
.release-symbol { display: grid; place-items: center; width: 56px; height: 56px; flex-shrink: 0; border-radius: 14px; background: #eff6ff; color: var(--accent); }
.release-symbol .icon { font-size: 30px; }
.overview-meta { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 18px; margin: 0; }
.overview-meta dt { font-size: 12px; color: var(--muted); margin-bottom: 6px; }.overview-meta dd { margin: 0; font-size: 13px; font-weight: 500; }
.overview-notes { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.quick-actions { padding: 8px 16px; }
.quick-action { display: flex; align-items: center; width: 100%; gap: 12px; text-align: left; background: transparent; color: var(--ink); border: 0; border-radius: 10px; padding: 15px 8px; }
.quick-action:hover { background: var(--subtle); }.quick-action>span:nth-child(2) { flex: 1; min-width: 0; }
.quick-action strong { display: block; font-size: 13px; font-weight: 500; }.quick-action small { display: block; margin-top: 3px; font-size: 11px; color: var(--muted); }
.quick-action>.icon { font-size: 16px; color: #64748b; }
.quick-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; background: #eff6ff; color: var(--accent-hover); }

/* Reference login: centered translucent panel against a deep blue surface. */
.startup-view { min-height: 100vh; display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--muted); }
.login-view { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 40px 20px; background: linear-gradient(135deg,#0a1b3d 0%,#123a7a 55%,#0d2a5c 100%); }
.login-layout { width: min(440px,100%); }
.login-card { display: grid; gap: 24px; padding: 36px; border: 1px solid #ffffff2e; border-radius: 24px; background: #0c0e1c8c; box-shadow: 0 18px 60px #05091473; backdrop-filter: blur(20px); color: #f3f6ff; }
.login-heading { display: grid; justify-items: center; gap: 10px; text-align: center; margin-bottom: 4px; }
.login-heading .brand-mark { width: 56px; height: 56px; font-size: 28px; border-radius: 16px; background: #ffffff12; border: 1px solid #ffffff30; margin-bottom: 8px; }
.login-heading h1 { font-size: 23px; font-weight: 700; }.login-heading p { color: #b9c3e6; font-size: 12px; }
.login-card .field>span:first-child { color: #dfe6ff; font-size: 13px; }
.login-card input { height: 48px; color: #f3f6ff; background: #ffffff0f; border: 1px solid #ffffff2e; border-radius: 12px; }
.login-card input::placeholder { color: #b9c3e6; }.login-card input:focus { background: #ffffff14; border-color: #9ad6ff; box-shadow: 0 0 0 3px #9ad6ff26; }
.login-card input:-webkit-autofill { -webkit-text-fill-color: #f3f6ff; box-shadow: inset 0 0 0 1000px #172749; }
.password-wrap { display: block; position: relative; }.password-wrap input { padding-right: 48px; }
.password-toggle { position: absolute; inset: 6px 6px 6px auto; display: grid; place-items: center; width: 36px; border: 0; border-radius: 8px; background: transparent; color: #b9c3e6; }.password-toggle:hover { background: #ffffff14; }
.login-card .primary { min-height: 46px; border: 0; background: linear-gradient(135deg,#ffb6f0,#9ad6ff); color: #172554; font-weight: 700; box-shadow: 0 8px 24px #7aa8ff30; border-radius: 12px; }
.login-card .primary:hover { background: linear-gradient(135deg,#ffc9f5,#b4e0ff); color: #172554; }
.login-hint { font-size: 11px; color: #b9c3e6; text-align: center; line-height: 1.8; }
.login-footer { color: #dfe6ff; opacity: .8; text-align: center; margin-top: 22px; font-size: 12px; }

@media (max-width: 1250px) {
  .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .release-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .content { padding: 24px; }.release-grid,.overview-grid { grid-template-columns: minmax(0,1fr) 280px; gap: 20px; }
}
@media (max-width: 1050px) {
  .release-grid,.overview-grid,.account-grid,.announcement-grid { grid-template-columns: minmax(0,1fr); }
  .release-aside,.overview-aside,.announcement-aside { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; align-items: start; }
  .announcement-aside>.section+.section { margin-top: 0; }
  .help-grid { grid-template-columns: minmax(0,1fr); }.overview-meta { grid-template-columns: 1fr 1fr 1.3fr; }
  .section-head,.section-foot { flex-wrap: wrap; }
}
@media (max-width: 768px) {
  body { font-size: 13px; }.sidebar { display: none; }.workspace { margin-left: 0; transition: none; }
  .topbar { height: 56px; padding: 0 16px; }.sider-toggle,.breadcrumb { display: none; }.mobile-brand { display: block; font-weight: 700; font-size: 16px; }
  .topbar-actions { gap: 8px; font-size: 12px; }.topbar-actions .avatar { width: 28px; height: 28px; }.topbar-actions .button { padding-inline: 8px; }
  #whoami { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .content { padding: 24px 16px calc(110px + env(safe-area-inset-bottom)); }.content-footer { font-size: 10px; margin-top: 24px; }
  h1 { font-size: 22px; }.page-head { align-items: flex-start; gap: 12px; margin-bottom: 22px; }.page-head p { font-size: 12px; max-width: 40ch; }.page-actions .button { padding: 6px 10px; font-size: 12px; }
  .mobile-nav { display: flex; position: fixed; z-index: 50; bottom: calc(16px + env(safe-area-inset-bottom)); left: 16px; right: 16px; padding: 6px 8px; border: 1px solid #e2e8f0; border-radius: 24px; background: #fffffff5; box-shadow: 0 8px 32px #00000014; backdrop-filter: blur(12px); }
  .mobile-nav-item { display: flex; flex: 1; flex-direction: column; align-items: center; gap: 4px; min-width: 0; min-height: 52px; padding: 6px 2px; border: 0; border-radius: 16px; background: transparent; color: #64748b; font-size: 11px; }
  .mobile-nav-item .icon { font-size: 22px; }.mobile-nav-item.active { background: #eff6ff; color: #2563eb; }.mobile-nav-item:hover { background: #f1f5f9; }
  .mobile-menu { width: calc(100% - 32px); max-width: 420px; margin: auto auto calc(16px + env(safe-area-inset-bottom)); }
  .mobile-menu-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); padding: 16px; gap: 8px; }
  .mobile-menu-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 82px; padding: 12px 6px; color: #475569; background: transparent; border: 0; border-radius: 12px; font-size: 12px; }.mobile-menu-item .icon { font-size: 24px; }.mobile-menu-item.active { color: #2563eb; background: #eff6ff; }
  .section { margin-bottom: 20px; }.section-head { padding: 18px; gap: 10px; }.section-head h2 { font-size: 15px; }.section-body { padding: 20px 18px; }.section-foot { padding: 14px 18px; flex-wrap: wrap; }.section-foot>.button-group { margin-left: auto; }
  .release-grid,.account-grid,.announcement-grid,.overview-grid { gap: 20px; }.release-aside,.overview-aside,.announcement-aside { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .release-summary { padding: 20px 18px; grid-template-columns: minmax(0,1fr); gap: 18px; }.release-summary>div:nth-child(3),.release-summary>div:last-child { display: block; }
  .archive-metadata { padding: 20px 18px; grid-template-columns: minmax(0,1fr); gap: 18px; }.field-row { grid-template-columns: minmax(0,1fr); }.definition-list>div { grid-template-columns: 85px minmax(0,1fr); gap: 16px; }
  .table { min-width: 600px; }.table th,.table td { padding-inline: 16px; }.table th:first-child,.table td:first-child { padding-left: 18px; }.table th:last-child,.table td:last-child { padding-right: 18px; }
  .filters { padding: 18px; gap: 12px; }.filters .grow { max-width: none; min-width: 150px; }.filters .field { min-width: 120px; }.summary-strip { padding: 14px 18px; gap: 8px 18px; }.pager { padding: 14px 18px; flex-wrap: wrap; }
  .compare-form { display: grid; grid-template-columns: minmax(0,1fr); }.compare-form .grow { min-width: 0; max-width: none; }.compare-arrow { display: none; }.compare-form .button { justify-self: start; }
  .banner { padding: 10px 16px; font-size: 12px; }.banner>.icon { display: none; }.banner .button { flex-shrink: 0; }
  .announcement-preview-body { padding: 20px 18px; }.announcement-preview-actions { flex-wrap: wrap; }
  .stats-grid { gap: 12px; margin-bottom: 20px; }.stat-card { padding: 18px 14px; gap: 10px; flex-direction: column; }.stat-content { width: 100%; }.stat-icon { width: 34px; height: 34px; flex-basis: 34px; border-radius: 10px; }.stat-icon .icon { font-size: 21px; }.stat-value { font-size: 25px; margin: 5px 0; }.stat-title { font-size: 12px; }.stat-note { font-size: 10px; }
  .overview-meta { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }.overview-meta>div:last-child { grid-column: 1/-1; }.overview-version h3 { font-size: 21px; }
  .overview-aside .section { margin: 0; }
  .toast-host { width: calc(100% - 32px); top: 16px; }.toast { font-size: 12px; }.login-card { padding: 28px 24px; gap: 22px; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation: none!important; transition: none!important; scroll-behavior: auto!important; } }

/* Content-only simplification: keep the original component appearance. */
/* Route changes focus this non-interactive container for keyboard navigation. */
#view-root:focus { outline: none; }
.overview-main .section-foot { justify-content: flex-end; }
.focused-form { max-width: 960px; }
.compact-details > summary { padding: 20px 24px; font-size: 13px; font-weight: 500; color: var(--muted); }
.compact-details[open] > summary { border-bottom: 1px solid var(--line); color: var(--ink); }
.compact-details .endpoint { margin-bottom: 14px; }
.cloud-result:empty { display: none; }