.models-page-intro{max-width:720px}
.host-card{padding:0;overflow:hidden}
.host-toolbar{
  display:grid;
  grid-template-columns:minmax(260px,1.2fr) minmax(360px,1fr) auto;
  gap:18px;
  align-items:center;
  padding:20px;
  border-bottom:1px solid var(--hairline);
  background:linear-gradient(135deg,rgba(197,161,90,.055),transparent 42%);
}
.host-identity{display:flex;align-items:center;gap:13px;min-width:0}
.host-icon{
  width:46px;height:46px;border-radius:15px;display:grid;place-items:center;
  background:linear-gradient(145deg,rgba(197,161,90,.20),rgba(197,161,90,.08));
  color:var(--gold3);font-weight:760;letter-spacing:-.04em;
  border:1px solid rgba(197,161,90,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30);
  flex:0 0 auto;
}
.host-kicker{font-size:.63rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:680}
.host-name{font-size:1.08rem;font-weight:730;letter-spacing:-.025em;margin-top:2px}
.host-status-line{display:flex;align-items:center;gap:7px;margin-top:6px;color:var(--muted);font-size:.68rem}
.host-resource{min-width:0}
.host-resource-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:8px}
.resource-name{font-size:.68rem;color:var(--muted)}
.resource-value{font-size:.76rem;font-weight:680;font-variant-numeric:tabular-nums}
.memory-track{height:8px;border-radius:999px;background:var(--hairline);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.04)}
.memory-fill{height:100%;width:100%;border-radius:inherit;background:linear-gradient(90deg,var(--gold3),var(--gold2));transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease-out)}
.resource-sub{display:flex;justify-content:space-between;gap:10px;margin-top:6px;font-size:.64rem;color:var(--muted)}
.host-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px;flex-wrap:wrap}
.host-summary{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;border-bottom:1px solid var(--hairline);
}
.summary-cell{padding:14px 18px;border-right:1px solid var(--hairline);min-width:0}
.summary-cell:last-child{border-right:0}
.summary-label{font-size:.62rem;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.summary-value{font-size:.82rem;font-weight:680;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.models-zone{padding:18px}
.models-zone-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:12px}
.models-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.model-card{
  position:relative;
  min-height:290px;
  padding:16px;
  border:1px solid var(--hairline);
  background:color-mix(in srgb,var(--glass-soft) 58%,transparent);
  border-radius:18px;
  display:flex;flex-direction:column;
  overflow:hidden;
  transition:transform .18s var(--ease-out),border-color .18s ease,background .18s ease;
}
.model-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--gold) 22%,var(--hairline))}
.model-card.is-loaded{
  border-color:rgba(197,161,90,.28);
  background:linear-gradient(155deg,rgba(197,161,90,.095),rgba(255,255,255,.12) 45%,transparent);
}
html[data-theme="dark"] .model-card.is-loaded{
  background:linear-gradient(155deg,rgba(197,161,90,.10),rgba(255,255,255,.025) 48%,transparent);
}
.model-card.is-busy::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.10),transparent 65%);
  transform:translateX(-100%);
  animation:modelSweep 1.8s ease-in-out infinite;
}
.model-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.model-role{font-size:.66rem;color:var(--gold3);font-weight:680;letter-spacing:.01em}
.model-name{font-size:1.04rem;font-weight:735;letter-spacing:-.027em;margin-top:5px}
.model-desc{font-size:.71rem;color:var(--muted);line-height:1.5;margin-top:9px;min-height:42px}
.model-state{margin-top:12px}
.model-details{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.model-detail{padding:9px 10px;border:1px solid var(--hairline);border-radius:11px;background:rgba(255,255,255,.12)}
.model-detail span{display:block;font-size:.60rem;color:var(--muted)}
.model-detail b{display:block;font-size:.72rem;margin-top:3px;font-variant-numeric:tabular-nums}
.model-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
}
.model-actions.two{grid-template-columns:1fr 1fr}
.model-actions .btn{width:100%;min-width:0}
.model-note{font-size:.62rem;color:var(--muted);line-height:1.4;margin-top:8px}
.mode-section{margin-top:16px}
.mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mode-card{
  position:relative;border:1px solid var(--hairline);border-radius:15px;padding:14px;cursor:pointer;
  min-height:112px;background:rgba(255,255,255,.10);
  transition:transform .12s ease,border-color .18s ease,background .18s ease;
}
.mode-card:hover{transform:translateY(-1px)}
.mode-card.active{border-color:rgba(197,161,90,.42);background:rgba(197,161,90,.08)}
.mode-card b{font-size:.77rem}
.mode-card p{font-size:.67rem;color:var(--muted);margin-top:6px;line-height:1.45}
.recommended{font-size:.61rem;color:var(--gold3);font-weight:700}
.mode-check{position:absolute;right:12px;top:12px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--hairline);font-size:.64rem;color:transparent}
.mode-card.active .mode-check{background:var(--gold);border-color:transparent;color:#17130b}
.models-help{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--hairline);border-radius:14px;background:rgba(255,255,255,.11);font-size:.70rem;color:var(--muted);line-height:1.5;margin-top:14px}
@keyframes modelSweep{0%{transform:translateX(-110%);opacity:0}35%{opacity:1}70%,100%{transform:translateX(110%);opacity:0}}
@media(max-width:1160px){
  .host-toolbar{grid-template-columns:1fr 1fr}.host-actions{grid-column:1/-1;justify-content:flex-start}
  .models-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:780px){
  .host-toolbar{grid-template-columns:1fr}
  .host-summary{grid-template-columns:1fr 1fr}
  .summary-cell:nth-child(2){border-right:0}
  .summary-cell:nth-child(-n+2){border-bottom:1px solid var(--hairline)}
  .models-grid,.mode-grid{grid-template-columns:1fr}
}
@media(max-width:460px){
  .host-summary{grid-template-columns:1fr}.summary-cell{border-right:0;border-bottom:1px solid var(--hairline)}
  .summary-cell:last-child{border-bottom:0}
  .model-actions.two{grid-template-columns:1fr}
}