/* Build planner (/planner/). Mobile first; summary card fits one 375px screen. */
.planner{display:grid;gap:14px;margin:8px 0 24px}
.planner-loading{color:var(--muted)}
.pl-controls{display:grid;gap:10px}
.pl-row{display:grid;gap:4px}
.pl-seg{display:flex;flex-wrap:wrap;gap:6px}
.pl-seg button,.pl-skill{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:10px;cursor:pointer}
.pl-seg button{padding:6px 10px;font-size:.9rem;font-weight:600}
.pl-seg button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#1d1400}
.pl-summary{margin:0}
.pl-summary .pl-dropped{margin:6px 0}
.pl-order{display:flex;flex-wrap:wrap;gap:4px 6px;list-style:none;padding:0;margin:0;counter-reset:o}
.pl-order li{counter-increment:o;border:1px solid var(--line);border-radius:8px;padding:1px 7px;font-size:.86rem}
.pl-order li::before{content:counter(o) ". ";color:var(--muted)}
.pl-gear li{font-size:.86rem;padding:2px 0}
.pl-actions{display:flex;gap:6px}
.pl-url{width:100%;margin-top:8px;font:inherit;font-size:.8rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px}
.pl-guide{margin:8px 0 0;font-size:.88rem}
.pl-section h2{margin:.6rem 0 .2rem}
.pl-group h3{margin:12px 0 6px;font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.pl-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.pl-skill{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:6px 8px;min-height:44px}
.pl-skill .pl-name{font-weight:600;font-size:.9rem;line-height:1.25;padding-right:22px}
.pl-skill small{color:var(--muted);font-size:.68rem;line-height:1.3}
.pl-skill[aria-pressed=true]{border-color:var(--accent);background:#2a2240}
.pl-rank{position:absolute;top:5px;right:6px;min-width:18px;height:18px;border-radius:9px;background:var(--accent);color:#1d1400;font-size:.72rem;font-weight:800;text-align:center;line-height:18px}
.pl-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.pl-slot{display:grid;gap:2px;min-width:0}
.pl-slot label{font-weight:600;font-size:.9rem;display:flex;gap:6px;align-items:center}
.pl-slot select{width:100%;min-width:0;font:inherit;font-size:.9rem;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px}
.pl-slot select:disabled{opacity:.6}
.pl-slot small{color:var(--muted);font-size:.72rem;line-height:1.3}
@media (max-width:420px){.pl-chips{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.content:has(.planner){max-width:none}.planner{grid-template-columns:minmax(0,1fr) 400px;align-items:start}.pl-controls{grid-column:1/-1}.pl-summary{grid-column:2;grid-row:2/span 2;position:sticky;top:12px}.pl-section{grid-column:1}}