/* The local AI PC sizer only. The shared tool rules (privacy line, buttons, status) stay in tools.css and play.css. */
.pcb [hidden]{display:none}
.pcb label{font:inherit;letter-spacing:normal;text-transform:none;color:inherit}
/* Phones: the stage, its buttons, the inputs, then the build list, so the parts that slide in sit right above the
   inputs that move them. The markup keeps the build list beside the stage for the wide layout below. */
.pcb{display:flex;flex-direction:column}
@media (max-width:959px){
  .pcb-view{display:contents}
  .pcb-stage{order:1}
  .pcb-bar{order:2}
  .pcb-form{order:3;margin-top:24px}
  .pcb-view>.pcb-h{order:4}
  .pcb-parts{order:5}
}
/* Wide screens: the page head and the inputs share the left column and the stage stands beside the h1, so the tower
   is in the first screen and stays in view while the inputs below the fold change it. The wrappers between the grid
   and its three items step aside. */
@media (min-width:960px){
  .pcb-page{display:grid;grid-template-columns:minmax(0,23rem) minmax(0,1fr);column-gap:40px;align-items:start}
  .pcb-sec,.pcb-sec>.tools,.pcb{display:contents}
  .pcb-page>.pagehead{grid-column:1;grid-row:1}
  .pcb-form{grid-column:1;grid-row:2;padding-bottom:clamp(40px,6vw,68px)}
  .pcb-view{grid-column:2;grid-row:1/span 2;margin-top:clamp(38px,6vw,64px)}
}
/* Sticky only on screens tall enough to hold the 72 px header, the stage, its buttons and the build list at once. */
@media (min-width:960px) and (min-height:860px){.pcb-view{position:sticky;top:84px}}
.pcb-stage{position:relative;aspect-ratio:16/11;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  background:var(--ground);contain:layout paint}
@media (max-width:640px){.pcb-stage{aspect-ratio:1/1}}
.pcb-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab;outline:none}
.pcb-canvas:active{cursor:grabbing}
.pcb-canvas:focus-visible{outline:2px solid var(--accent);outline-offset:-4px;border-radius:14px}
.pcb-hud{position:absolute;left:12px;right:12px;top:12px;width:fit-content;max-width:calc(100% - 24px);box-sizing:border-box;margin:0;
  padding:7px 13px;border-radius:12px;background:color-mix(in srgb,var(--paper) 88%,transparent);color:var(--text);
  font:500 13.5px/1.45 var(--sans);pointer-events:none;box-shadow:0 4px 18px rgb(7 12 21 / .12)}
.pcb-nogl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px}
.pcb-nogl p,.pcb-nojs{max-width:28em;margin:0;text-align:center;font-size:15px;line-height:1.6;color:var(--muted)}
.pcb-nojs{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;max-width:none}
.pcb-bar{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 0}
.pcb-bar .alt-btn{padding:9px 18px}
/* Wide enough for "Close the side panel", so the buttons beside it stay put when its text flips. */
.pcb-bar [data-pcb="panel"]{min-width:12.2em}
.pcb-bar .alt-btn[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}
.pcb-bar .alt-btn:disabled,.pcb-line:disabled{opacity:.55;cursor:default}
.pcb-h{margin:20px 0 8px;font-size:13px;font-weight:500;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pcb-h3{margin:24px 0 6px;font-size:16px;font-weight:600}
.pcb-parts{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.pcb-line{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:2px 14px;width:100%;box-sizing:border-box;
  padding:5px 12px;border:1px solid transparent;border-radius:10px;background:none;color:var(--text);font:inherit;
  text-align:left;cursor:pointer}
.pcb-line:hover,.pcb-line.is-lit{border-color:var(--hair);background:var(--paper)}
.pcb-line[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.pcb-line:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pcb-part{font:500 12.5px/1.5 var(--mono);color:var(--muted);padding-top:1px}
.pcb-text{min-height:1.45em;font-size:14.5px;line-height:1.45}
@media (max-width:520px){.pcb-line{grid-template-columns:minmax(0,1fr)}}
.pcb-set{min-width:0;margin:0 0 18px;padding:0;border:0}
.pcb-set legend{margin:0 0 8px;padding:0;font:600 15px/1.3 var(--sans);color:var(--text)}
.pcb-seg{display:flex;flex-wrap:wrap;gap:6px}
.pcb-seg label{position:relative;display:block}
.pcb-seg input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.pcb-seg span{display:block;padding:7px 13px;border:1px solid var(--hair);border-radius:999px;font:600 14px/1.2 var(--sans);color:var(--text)}
.pcb-seg input:checked+span{border-color:var(--btn);background:var(--btn);color:#fff}
.pcb-seg input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.pcb-seg input:disabled+span{opacity:.55}
.pcb-hint{margin:8px 0 0;font-size:13.5px;line-height:1.5;color:var(--muted)}
/* Three lines are reserved, so a longer status never moves the numbers under it. */
.pcb-status{min-height:4.5em;margin:4px 0 0;font-size:14.5px;line-height:1.5;color:var(--text)}
.pcb-status[data-kind="error"]{color:var(--err)}
.pcb-mem{margin:0 0 14px}
.pcb-membar{display:flex;height:14px;border-radius:7px;background:var(--line);overflow:hidden}
.pcb-membar span{display:block;height:100%;transition:width .45s ease}
.pcb-membar [data-seg="weights"],.pcb-key[data-key="weights"]::before{background:var(--accent)}
.pcb-membar [data-seg="kv"],.pcb-key[data-key="kv"]::before{background:var(--art-3)}
.pcb-membar [data-seg="runtime"],.pcb-key[data-key="runtime"]::before{background:var(--muted)}
.pcb-membar[data-over="true"]{box-shadow:0 0 0 2px var(--err)}
.pcb-legend{display:flex;flex-wrap:wrap;gap:4px 14px;min-height:1.5em;margin:8px 0 0;font-size:12.5px;color:var(--muted)}
.pcb-key::before{content:"";display:inline-block;width:9px;height:9px;margin-right:6px;border-radius:2px}
.pcb-cap{margin-left:auto}
.pcb-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;margin:0}
.pcb-stats div{min-width:0}
.pcb-stats dt{font:500 11px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pcb-stats dd{margin:5px 0 0;min-height:1.25em;font:600 19px/1.25 var(--sans);color:var(--text);overflow-wrap:anywhere}
.pcb-stats .pcb-sub{margin-top:3px;min-height:2.9em;font:400 13px/1.45 var(--sans);color:var(--muted)}
.pcb-formula{margin:18px 0 22px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.pcb-formula p{margin:0;font-size:13px;line-height:1.55;overflow-wrap:anywhere}
.pcb-formula .pcb-sum{min-height:1.55em;margin-top:4px;color:var(--accent-ink);font-weight:500}
.pcb-formula .pcb-note{margin-top:8px;font-size:13px;color:var(--muted)}
.pcb-cards .pcb-hint{margin:0 0 10px}
.pcb-card,.pcb-chip{position:relative;display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.pcb-card{margin:0 0 6px;padding-left:40px;cursor:pointer}
.pcb-card:hover{border-color:var(--accent)}
.pcb-card input{position:absolute;left:13px;top:12px;width:16px;height:16px;margin:0;padding:0;accent-color:var(--btn)}
.pcb-card:has(input:checked){border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.pcb-card:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.pcb-card-name{font-weight:600;font-size:14.5px;line-height:1.35}
.pcb-card-spec{font-size:12.5px;color:var(--muted)}
.pcb-card-fit{min-height:1.4em;font-size:13.5px;line-height:1.4;color:var(--text)}
.pcb-card-fit[data-fits="false"]{color:var(--muted)}
.pcb-chips{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.pcb-checked{margin:14px 0 0;font-size:13px;color:var(--muted)}
@media (prefers-reduced-motion:reduce){.pcb-membar span{transition:none}}
