.sys-bygger{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:clamp(40px,6vh,64px) 0 0;padding:0;list-style:none;display:grid}.sys-bygger__kort{box-shadow:inset 0 0 0 1px var(--linje);transition:box-shadow .3s var(--husets);border-radius:24px;padding:clamp(24px,2.6vw,36px);position:relative}.sys-bygger__kort:has(a):hover{box-shadow:inset 0 0 0 1px var(--accent)}.sys-bygger__typ{font:500 13px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}.sys-bygger__kort h3{font:600 clamp(24px, 2.1vw, 30px) / 1.15 var(--display);letter-spacing:-.025em;margin:0}.sys-bygger__kort h3 a{min-height:44px;color:inherit;cursor:pointer;align-items:center;gap:8px;text-decoration:none;display:inline-flex}.sys-bygger__kort h3 a:after{content:"";border-radius:inherit;position:absolute;inset:0}.sys-bygger__kort svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:18px;height:18px}.sys-bygger__kort .tj-lank{z-index:1;margin-top:8px;position:relative}.sys-bygger__kort>p:not(.sys-bygger__typ){color:var(--mjuk);text-wrap:pretty;margin:12px 0 0;font-size:16px;line-height:1.5}.sys-scen{margin-top:clamp(40px,6vh,64px)}.sys-scen__topp{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;margin-bottom:16px;display:flex}.sys-scen__lage{font:500 13px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mjuk);margin:0}.sys-system{transition:opacity .5s var(--husets);flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.sys-system li{box-shadow:inset 0 0 0 1px var(--linje);font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mjuk);transition:background .25s var(--husets), color .25s var(--husets), box-shadow .25s var(--husets);border-radius:999px;padding:8px 12px}.sys-system li[data-puls]{color:#f4f2ee;background:#b9a3ff2e;box-shadow:inset 0 0 0 1px #b9a3ffb3,0 0 18px -2px #b9a3ff8c}.sys-scen[data-lage=kalkyl] .sys-system{opacity:.35}.sys-tavla{min-height:330px;box-shadow:inset 0 0 0 1px var(--linje);background:#f4f2ee0a;border-radius:20px;align-content:start;gap:10px;padding:18px;display:grid;position:relative}.sys-tavla__huvud,.sys-order{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);align-items:center;gap:12px;display:grid}.sys-tavla__huvud{border-bottom:1px solid var(--linje);font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mjuk);grid-area:1/1/auto/-1;padding:0 16px 8px}.sys-tavla__kol{border-bottom:1px solid var(--linje);font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mjuk);grid-row:1;padding:0 4px 8px;display:none}.sys-order{background:#f4f2ee08;border-radius:12px;min-height:52px;padding:0 16px;font-size:16px}.sys-order b{font:500 15px/1 var(--mono);letter-spacing:.02em}.sys-order span{color:#f4f2eed1}.sys-hand{--steg:62px;color:#0e0c0b;font:500 12px/1 var(--mono);letter-spacing:.04em;pointer-events:none;background:#ffa66b;border-radius:999px;padding:7px 12px;animation:2.2s step-end both sys-hand;position:absolute;top:70px;right:30px}@keyframes sys-hand{0%{transform:translateY(0)}30%{transform:translateY(calc(2 * var(--steg)))}60%{transform:translateY(var(--steg))}85%{transform:translateY(calc(3 * var(--steg)))}}.sys-scen[data-lage=system] .sys-tavla{grid-template-columns:repeat(4,minmax(0,1fr))}.sys-scen[data-lage=system] .sys-tavla__huvud{display:none}.sys-scen[data-lage=system] .sys-tavla__kol{display:block}.sys-scen[data-lage=system] .sys-order{background:#1b1822;grid-template-columns:minmax(0,1fr);align-content:center;gap:6px;min-height:72px;padding:12px 14px;box-shadow:inset 0 0 0 1px #b9a3ff66,0 14px 30px -18px #8454f699}.sys-scen[data-lage=system] .sys-order span{font-size:14px}.sys-scen[data-lage=system] .sys-order__status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.sys-scen[data-lage=system] .sys-order[data-kol="3"]{box-shadow:inset 0 0 0 1px #ffa66b8c,0 14px 30px -18px #f87a4080}.sys-logg{align-content:start;gap:6px;min-height:160px;margin:16px 0 0;padding:0;list-style:none;display:grid}.sys-logg li{color:#f4f2eed1;animation:sys-logg .45s var(--husets) both;grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;gap:12px;font-size:15px;line-height:1.45;display:grid}.sys-logg time{font:500 13px/1 var(--mono);font-variant-numeric:tabular-nums;color:var(--mjuk)}.sys-logg b{font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#b9a3ff}@keyframes sys-logg{0%{opacity:0;transform:translateY(-8px)}}.sys-scen__fot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;margin-top:8px;display:flex}.sys-scen__fot .tj-exempel{margin:0}.sys-scen:not([data-klar]):not([data-igen]) .sys-igen{visibility:hidden}.sys-val{padding-bottom:clamp(32px,5vh,56px)}.sys-sa{padding-top:clamp(48px,7vh,80px)}.sys-floden__inre{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:clamp(40px,6vw,96px);display:grid}.sys-floden__stycke{max-width:34em;color:var(--mjuk);text-wrap:pretty;margin:20px 0 0;font-size:clamp(17px,1.3vw,19px);line-height:1.55}.sys-flode{box-shadow:inset 0 0 0 1px var(--linje);background:#f4f2ee0a;border-radius:24px;margin:0;padding:clamp(20px,2.6vw,36px)}.sys-flode__val{flex-wrap:wrap;gap:8px;margin-bottom:36px;display:flex}.sys-flode__val button{min-height:44px;box-shadow:inset 0 0 0 1px var(--linje);color:var(--mjuk);font-family:var(--brod);cursor:pointer;transition:background .25s var(--husets), color .25s var(--husets), box-shadow .25s var(--husets);background:0 0;border:0;border-radius:999px;padding:0 16px;font-size:14px}.sys-flode__val button:hover{color:#f4f2ee}.sys-flode__val button[aria-pressed=true]{color:#f4f2ee;background:#b9a3ff24;box-shadow:inset 0 0 0 1px #b9a3ff99}.sys-flode__val button:focus-visible{outline-offset:3px;outline:2px solid #f4f2ee}.sys-flode__bana{position:relative}.sys-flode__linje,.sys-flode__fyll,.sys-flode__vag{height:2px;position:absolute;top:9px;left:10%;right:10%}.sys-flode__linje{background:#b9a3ff38}.sys-flode__fyll{transform-origin:0;background:#b9a3ff}.sys-flode__paket{opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;margin:-6px 0 0 -6px;position:absolute;top:1px;left:100%;box-shadow:0 0 0 4px #b9a3ff59,0 0 18px 6px #b9a3ff99}.sys-flode__spar{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid;position:relative}.sys-flode__spar li{text-align:center;justify-items:center;gap:14px;display:grid}.sys-flode__spar li:before{content:"";background:#b9a3ff;border-radius:50%;width:20px;height:20px;box-shadow:0 0 0 5px #b9a3ff2e,0 0 16px 4px #b9a3ff73}.sys-flode__spar span{font:600 15px/1.25 var(--display);letter-spacing:-.01em;overflow-wrap:anywhere}.sys-flode__fot{justify-content:flex-end;min-height:44px;margin-top:28px;display:flex}.tj[data-rorelse] [data-spela]:not([data-spelar]) .sys-flode__fyll{transform:scaleX(0)}.tj[data-rorelse] [data-spela]:not([data-spelar]) .sys-flode__spar li:before{background:#13111b;box-shadow:inset 0 0 0 2px #b9a3ff80}.tj[data-rorelse] [data-spelar] .sys-flode__fyll{animation:2.4s linear .6s both sys-fyll}.tj[data-rorelse] [data-spelar] .sys-flode__paket{animation:2.4s linear .6s both sys-paket-x}.tj[data-rorelse] [data-spelar] .sys-flode__spar li:before{animation:sys-tand .4s var(--husets) calc(.6s + var(--n) * .6s) both}.tj[data-rorelse] [data-spelar]:not([data-igen]) .sys-flode__fot .tj-igen{animation:tj-visa .4s var(--husets) 3.3s both}@keyframes sys-fyll{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes sys-paket-x{0%{opacity:0;left:0%}6%,94%{opacity:1}to{opacity:0;left:100%}}@keyframes sys-tand{0%{background:#13111b;box-shadow:inset 0 0 0 2px #b9a3ff80}}@media (max-width:1000px){.sys-bygger,.sys-floden__inre{grid-template-columns:minmax(0,1fr)}}@media (max-width:760px){.sys-tavla{gap:8px;min-height:330px;padding:12px}.sys-order{padding:0 10px;font-size:14px}.sys-order b{font-size:13px}.sys-tavla__huvud{padding:0 10px 8px}.sys-tavla__kol{letter-spacing:.04em;font-size:10px}.sys-scen[data-lage=system] .sys-order{min-height:64px;padding:10px 8px}.sys-scen[data-lage=system] .sys-order span{font-size:12px}.sys-hand{--steg:60px;padding:5px 9px;font-size:10px;top:86px;right:8px}.sys-logg{min-height:250px}.sys-logg li{grid-template-columns:auto minmax(0,1fr);gap:2px 10px;font-size:14px}.sys-logg li span{grid-column:2}.sys-flode__spar{grid-template-columns:minmax(0,1fr);gap:20px}.sys-flode__spar li{text-align:left;grid-template-columns:20px minmax(0,1fr);place-items:center start}.sys-flode__linje,.sys-flode__fyll,.sys-flode__vag{width:2px;height:auto;inset:10px auto 10px 9px}.sys-flode__fyll{transform-origin:50% 0}.sys-flode__paket{top:100%;left:1px}.tj[data-rorelse] [data-spela]:not([data-spelar]) .sys-flode__fyll{transform:scaleY(0)}.tj[data-rorelse] [data-spelar] .sys-flode__fyll{animation-name:sys-fyll-y}.tj[data-rorelse] [data-spelar] .sys-flode__paket{animation-name:sys-paket-y}}@keyframes sys-fyll-y{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes sys-paket-y{0%{opacity:0;top:0%}6%,94%{opacity:1}to{opacity:0;top:100%}}