/* Management refinement; user CSS remains last in the document. */
:root{--ui-font-size:13px;--font-scale:.92857143;--font-ui:"Microsoft YaHei Light","Microsoft YaHei UI Light","微软雅黑 Light","Microsoft YaHei",sans-serif}
html,body,button,input,select,textarea,code,pre,.mono,.code{font-family:var(--font-ui);font-weight:300}
body{font-size:var(--ui-font-size)}
h1,h2,h3,h4,strong,b,.btn,.nav button,.account-copy strong{font-weight:300}
.resource-links{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 24px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.resource-links .active{background:rgba(var(--accent-rgb),.28);color:var(--text)}
.resource-scope{margin-bottom:24px}.resource-scope select{max-width:65%}
.chain-map{padding:24px;overflow-x:auto}.chain-path{display:flex;align-items:stretch;list-style:none;gap:12px;margin:0;padding:0;width:max-content;min-width:100%}
.chain-hop,.chain-end{display:flex;flex-direction:column;justify-content:center;gap:12px;min-width:150px;max-width:230px;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(var(--input-rgb),.7);overflow-wrap:anywhere}
.chain-role{color:var(--muted)}.chain-edge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:40px;color:var(--tone)}
.chain-hop code,.chain-end code{white-space:normal;font-size:1em}.chain-end{min-width:90px;background:rgba(var(--secondary-rgb),.12)}
.hop-editor{border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:20px}.hop-editor h3{margin-bottom:20px}
.wizard-steps{display:flex;list-style:none;gap:20px;padding:0;margin:0 0 24px;color:var(--muted)}.wizard-steps [aria-current]{color:var(--text);border-bottom:2px solid var(--accent);padding-bottom:12px}
[hidden]{display:none!important}

/* Neutral dark glass: palette colours belong to actions and selected states. */
html[data-color-mode="dark"]{color-scheme:dark;--panel:0,0,0!important;--sidebar-rgb:0,0,0!important;--input-rgb:0,0,0!important;--text:#ededed!important;--muted:#bcbcbc!important;--button-ink:var(--palette-ink)!important;--tone:var(--accessible-accent)!important;--secondary-ink:var(--accessible-secondary)!important;--line:rgba(255,255,255,.20)!important;background:#080808}
html[data-color-mode="light"]{color-scheme:light}
html[data-color-mode="dark"] body{background-color:transparent}
html[data-color-mode="dark"] .world{background-color:#080808;background-blend-mode:normal}
html[data-color-mode="dark"] body:not(.has-wallpaper) .world{background-image:none}
html[data-color-mode="dark"] .badge{color:var(--tone);background:rgba(var(--accent-rgb),.15)}
html[data-color-mode="dark"] .badge.red,html[data-color-mode="dark"] .error{color:#ffc7c7;background:rgba(160,55,65,.15)}
html[data-color-mode="dark"] .badge.blue{color:var(--accessible-secondary);background:rgba(var(--secondary-rgb),.15)}
html[data-color-mode="dark"] .badge.gray{color:var(--muted);background:rgba(180,180,180,.12)}
html[data-color-mode="dark"] .trend-chart text{fill:var(--muted)}
html[data-color-mode="dark"] .toast{background:#181818;color:var(--text)}
body :is(p,small,button,input,select,textarea,td,th,label,code,pre,.badge,.muted,.section-note,.mono,.app-footer,.context-metrics){font-size:var(--ui-font-size);font-family:var(--font-ui);font-weight:300}
.login-art h1,.login-art>p,.login-card>.section-note,.login-card>.subtitle{display:none}
:root{--surface-alpha:var(--glass);--radius:20px;--wallpaper-blur:14px}
.btn.small,.nav button,.badge,.context-section p{font-size:var(--ui-font-size)}
.nav button.active,.resource-links .btn.active{background:rgba(var(--accent-rgb),.28);border-color:rgba(var(--accent-rgb),.55);color:var(--selected-ink)}

html[data-color-mode="dark"] .btn:not(.primary):not(.danger){background:rgba(255,255,255,.07);color:var(--text)}
html[data-color-mode="dark"] .hop-editor,html[data-color-mode="dark"] .chain-hop{background:rgba(0,0,0,.2)}
.nav-search{border:1px solid var(--line);border-radius:var(--radius);padding:0 12px;min-width:0}
html .sidebar .nav-search input,html .sidebar .nav-search input:focus{background:transparent;color:var(--text);border:0;box-sizing:border-box;flex:1;width:0;min-width:0}
html .sidebar .nav-search input::placeholder{color:var(--muted);opacity:1}
.endpoint-credentials{padding:24px 0;border-bottom:1px solid var(--line);margin-bottom:24px}
.credential-row{padding:20px 0;border-bottom:1px solid var(--line)}
.credential-row .toolbar{margin-bottom:20px}.credential-row .form-grid{align-items:start}
/* All labels stay in document flow, above the control, including empty fields. */
.field{gap:8px}
.field>label{position:static;font-size:var(--ui-font-size);line-height:1.7;pointer-events:auto;background:transparent}
.field:focus-within>label{color:var(--tone)}
:is(input,select,textarea):not(:where([type=range],[type=checkbox],[type=radio])){box-sizing:border-box;max-width:100%;min-width:0;border:1px solid var(--line);border-radius:var(--radius);padding:10px 14px;line-height:1.65;min-height:42px}
textarea{resize:vertical;overflow:auto}.form-grid,.appearance-detail-grid{min-width:0}.appearance-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
input[type=file]{overflow:hidden}input[type=file]::file-selector-button{border:1px solid var(--line);border-radius:calc(var(--radius)*.65);padding:7px 12px;margin-right:12px;background:rgba(var(--accent-rgb),.16);color:var(--text);font:inherit}
input:focus,select:focus,textarea:focus{border-color:var(--tone);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.12)}
select option,optgroup{background:rgb(var(--panel));color:var(--text)}
.panel-head{border-radius:calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0 0}
/* Wallpaper blur never changes foreground opacity or text; extra bleed hides blur edges. */
.world{inset:-64px;filter:blur(var(--wallpaper-blur))}
.world:after,.has-wallpaper .world:after{content:none;background:none}
/* One canvas for the primary shell. Keep the original wallpaper colours; only the surface paint is neutral black. */
.layout{background:rgba(var(--panel),var(--glass))}

html .layout :is(.topbar,.sidebar,.context-sidebar,.app-footer,.main,.glass,.preview-card,.panel-head){background:transparent}
html .layout .nav-search,html .layout :is(input,select,textarea){background:transparent}
.preview-input{border:1px solid var(--line);border-radius:var(--radius);padding:10px 14px;min-width:150px;font-size:var(--ui-font-size)}
/* Secondary and deeper surfaces have their own glass, regardless of primary opacity. */
html dialog,html [popover],html [role="menu"]{background:rgba(var(--panel),.94);color:var(--text);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border:1px solid var(--line);border-radius:var(--radius)}
dialog::backdrop{background:rgba(0,0,0,.22);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html dialog :is(.dialog-head,.dialog-body,.dialog-footer){background:transparent}
html[data-color-mode="dark"] :is(dialog,[popover],[role="menu"]){backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px)}
html .layout :is(.sidebar.open,.context-sidebar.open){background:rgba(var(--panel),.94);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px)}
.drawer-backdrop{background:rgba(0,0,0,.18);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
@supports not (backdrop-filter:blur(1px)){html dialog,html [popover],html [role="menu"],html .layout :is(.sidebar.open,.context-sidebar.open){background:rgb(var(--panel))}}
@media(max-width:1024px){.layout.drawer-active .main{visibility:hidden}}
@media(max-width:767px){.resource-scope{align-items:stretch;flex-direction:column}.resource-scope select{max-width:100%;width:100%}.hop-editor{padding:16px}.wizard-steps{gap:12px;font-size:.9em}.chain-map{padding:16px}.page-heading .actions{flex-wrap:wrap}.appearance-detail-grid{grid-template-columns:minmax(0,1fr)}}

.color-settings{margin:28px 0}.color-editors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:20px 0 28px}.color-editor{min-width:0;padding:20px;border:1px solid var(--line);border-radius:var(--radius)}.color-editor-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:24px}.color-editor-heading h3{margin-right:auto}.color-editor-heading code{font-size:12px}.color-swatch{width:22px;height:22px;border:1px solid var(--line);border-radius:50%;flex-shrink:0}.color-editor .field:last-child{margin-bottom:0}
input.color-slider{appearance:none;-webkit-appearance:none;padding:0;height:10px;min-height:10px;margin:10px 0 8px;border:1px solid var(--line);border-radius:8px;cursor:pointer}
html .layout input.hue-slider{background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)}
html .layout input.saturation-slider{background:linear-gradient(to right,hsl(var(--picker-hue) 0% 50%),hsl(var(--picker-hue) 100% 50%))}
html .layout input.lightness-slider{background:linear-gradient(to right,#000,hsl(var(--picker-hue) var(--picker-saturation) 50%),#fff)}
input.color-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--text);border:3px solid rgb(var(--panel));box-shadow:0 0 0 1px var(--muted)}
input.color-slider::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--text);border:3px solid rgb(var(--panel));box-shadow:0 0 0 1px var(--muted)}
@media(max-width:767px){.color-editors{grid-template-columns:minmax(0,1fr)}}

.server-list{display:grid;gap:24px}.server-card{padding:26px;min-width:0}.server-card-head{display:flex;justify-content:space-between;gap:24px;align-items:start;margin-bottom:24px}.server-identity,.server-runtime{min-width:0}.server-identity h2,.server-identity p{overflow-wrap:anywhere}.server-identity p{margin:5px 0 12px;color:var(--muted)}.server-runtime{display:grid;justify-items:end;gap:9px;text-align:right}.server-runtime span,.server-runtime small{overflow-wrap:anywhere}.server-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.server-metric{min-width:0;display:flex;flex-direction:column;gap:8px}.server-metric>span,.server-metric>small{color:var(--muted)}.server-metric>strong{font-size:1.35em;overflow-wrap:anywhere}.server-metric small{overflow-wrap:anywhere}.server-metric .progress{margin:2px 0}.server-details{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.server-details summary{cursor:pointer;display:flex;justify-content:space-between;gap:20px}.server-details summary span{color:var(--muted)}.server-detail-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:24px;margin-top:24px}.server-detail-grid>div{min-width:0}.server-detail-grid dl{display:grid;grid-template-columns:110px minmax(0,1fr);gap:8px 14px;align-content:start;margin:0}.server-detail-grid dt{color:var(--muted)}.server-detail-grid dd{margin:0;overflow-wrap:anywhere}.server-filters{display:grid;grid-template-columns:minmax(0,1fr) 170px 170px auto;gap:20px;align-items:center}.server-filters>span{color:var(--muted)}
@media(min-width:1600px){.server-metrics{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:900px){.server-filters{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.server-filters>.field:first-child{grid-column:1/-1}.server-filters>span{align-self:start}.server-detail-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:767px){.server-card{padding:20px}.server-card-head{flex-direction:column;gap:16px}.server-runtime{justify-items:start;text-align:left}.server-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.server-detail-grid dl{grid-template-columns:90px minmax(0,1fr)}}

html[data-color-mode="dark"] input::placeholder,html[data-color-mode="dark"] textarea::placeholder{color:#aaa}

.badge.blue{color:var(--secondary-ink);background:rgba(var(--secondary-rgb),.15);border-color:rgba(var(--secondary-rgb),.35)}

.btn.primary:hover{color:var(--button-hover-ink)}