/* Styrke-simulator */
.sim{gap:16px}
.sim-presets,.sim-scenes{display:flex;flex-wrap:wrap;gap:8px}
.sim-chip{border:0;cursor:pointer;background:var(--surface-2);color:var(--ink);padding:9px 14px;border-radius:99px;font-weight:600;font-size:14.5px;text-decoration:none;box-shadow:inset 0 0 0 1.5px transparent;transition:background .15s,box-shadow .15s}
.sim-chip:hover{box-shadow:inset 0 0 0 1.5px var(--line)}
.sim-chip[aria-checked="true"]{background:var(--accent-soft);box-shadow:inset 0 0 0 2px var(--accent)}
.sim-chip.preset{background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--line)}
.sim-chip.preset:hover{box-shadow:inset 0 0 0 1.5px var(--accent)}
.sim-chip.link{color:var(--accent-2)}
.sim-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,1fr);gap:24px;align-items:start}
@media (max-width:900px){.sim-layout{grid-template-columns:minmax(0,1fr)}}
.sim-main{display:flex;flex-direction:column;gap:12px;min-width:0}
.sim-stage{display:block;position:relative;min-height:0;touch-action:pan-y;user-select:none;-webkit-user-select:none;background:#222;line-height:0}
.sim-stage.is-split{cursor:ew-resize;touch-action:none}
.sim-canvas{width:100%;height:auto;display:block}
.sim-split{position:absolute;inset:0;pointer-events:none}
.sim-stage.is-split .sim-split::before{content:"";position:absolute;top:0;bottom:0;left:var(--split,50%);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 14px rgba(0,0,0,.4)}
.sim-handle{pointer-events:auto;position:absolute;top:50%;left:var(--split,50%);transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#0d1a21;display:grid;place-items:center;cursor:ew-resize;box-shadow:0 2px 10px rgba(0,0,0,.45);padding:0}
.sim-handle svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.sim-handle:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.sim-lab{position:absolute;top:10px;font:600 12px/1 var(--f-mono);letter-spacing:.04em;padding:6px 10px;border-radius:99px;background:rgba(10,20,26,.72);color:#fff;white-space:nowrap}
.sim-lab.l{left:10px}.sim-lab.r{right:10px}
.sim-zones{position:absolute;inset:0;pointer-events:none}
.sim-zones svg{width:100%;height:100%}
.sim-zones path{fill:none;stroke:#fff;stroke-width:.5;stroke-dasharray:1.6 1.2;vector-effect:non-scaling-stroke;stroke-width:2;opacity:.9}
.sim-zones text{font:600 3px var(--f-mono);fill:#fff;text-anchor:middle;paint-order:stroke;stroke:rgba(0,0,0,.6);stroke-width:.6px}
.sim-hint{margin:0}
.sim-notice{background:var(--warn-soft);color:var(--warn);padding:10px 14px;border-radius:12px}
.sim-readout{display:flex;flex-direction:column;gap:10px}
.sim-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.sim-stats .stat{background:var(--surface-2);border-radius:14px;padding:10px 14px;display:flex;flex-direction:column;gap:2px}
.sim-stats .stat b{font:700 17px/1.25 var(--f-display)}
.sim-explain{font-size:16px}
.sim-cta{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--accent-soft);border-radius:var(--r);padding:14px 18px}
.sim-cta p{font-size:14.5px;color:var(--ink-2);margin-top:2px;max-width:56ch}
.sim-controls{display:flex;flex-direction:column;gap:14px;min-width:0}
.sim-group{background:var(--surface-2);border-radius:var(--r);padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.sim-group>summary{cursor:pointer;font-weight:700}
.sim .seg{grid-template-columns:repeat(auto-fit,minmax(92px,1fr))}
.sim .seg label{padding:10px 12px;font-size:14.5px;background:var(--surface)}
.sim .seg input:checked+label{background:var(--accent-soft)}
.sim-dist{grid-template-columns:repeat(auto-fit,minmax(70px,1fr))}
.sim-tint{grid-template-columns:repeat(5,minmax(0,1fr))}
.sim-tint label{padding:9px 6px;text-align:center;font-size:13.5px}
.sim-fx{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.sim-check{display:flex;gap:10px;align-items:flex-start;font-size:15px;font-weight:500;cursor:pointer}
.sim-check input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--accent);flex:none}
.sim-rx{background:var(--surface-2);border-radius:var(--r);padding:14px 16px}
.sim-rx summary{cursor:pointer;font-weight:700}
.sim-rx>*+*{margin-top:10px}
.rx-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:8px}
.rx-f{display:flex;flex-direction:column;gap:4px;font:600 12px var(--f-mono);letter-spacing:.06em}
.rx-f input{font:500 16px var(--f-body);letter-spacing:0;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);min-width:0;width:100%}
.rx-f input:focus-visible{outline-offset:1px}
@media (max-width:520px){.sim-lab{font-size:11px;padding:5px 8px}.sim-handle{width:40px;height:40px}}
/* mobil: scenen følger med når man justerer kontrollene */
.tool-shell.sim{overflow:visible}
@media (max-width:900px){
  .sim-layout{gap:14px}
  .sim-main{display:contents}
  .sim-stagewrap{position:sticky;top:0;z-index:6;background:var(--surface);padding:6px 0 8px;margin:0 calc(-1*clamp(18px,3vw,32px));padding-inline:clamp(18px,3vw,32px)}
  .sim-chip{padding:8px 12px;font-size:13.5px}
  .sim-lab{top:8px}
}
