.sv-odottaa main, .sv-odottaa .ftr, .sv-odottaa [data-footer] { display: none !important; }
.sv-odottaa .side__nav, .side__group[hidden] { display: none !important; }
.side__nav { gap: 14px; }
.sv-suljettu main { display: none !important; }
[data-sv-piilotettu][hidden], .sv-avain[hidden], .sv-huolto[hidden] { display: none !important; }
.sv-avain { position: fixed; z-index: 140; right: 22px; bottom: 24px; border: 1px solid #ffffff26; border-radius: 12px; background: #18191ef2; box-shadow: 0 8px 32px #0006; color: #fff; padding: 12px 16px; font: 600 13px system-ui; cursor: pointer; }
.sv-avain:hover { border-color: #ffb85a; }
.sv-suljettu .ftr { display: none; }
.sv-huolto { min-height: 100svh; display: grid; place-items: center; padding: calc(var(--hdr, 64px) + 40px) 28px 56px; box-sizing: border-box; color: #f5f5f7; font-family: Archivo, system-ui, sans-serif; }
.sv-huolto__kortti { width: min(100%, 620px); text-align: center; position: relative; padding: 0; }
.sv-huolto__kuvitus { position: relative; width: 150px; height: 112px; margin: 0 auto 32px; }
.sv-huolto__kuvitus::before { content: ''; position: absolute; inset: -40px; background: radial-gradient(ellipse, #fa454518, transparent 68%); pointer-events: none; }
.sv-huolto__ikkuna { position: absolute; inset: 8px 14px 8px 4px; border: 1px solid #ffffff26; border-radius: 12px; background: linear-gradient(150deg, #222229, #111116); box-shadow: 0 18px 40px #0005; transform: rotate(-7deg); }
.sv-huolto__pisteet { display: flex; gap: 4px; padding: 10px; border-bottom: 1px solid #ffffff0d; }
.sv-huolto__pisteet i { width: 4px; height: 4px; border-radius: 50%; background: #666671; }
.sv-huolto__pisteet i:first-child { background: #fa5a5a; }
.sv-huolto__viivat { display: grid; gap: 7px; padding: 16px; }
.sv-huolto__viivat i { height: 4px; width: 68%; border-radius: 3px; background: #ffffff14; }
.sv-huolto__viivat i:nth-child(2) { width: 86%; }
.sv-huolto__viivat i:last-child { width: 48%; background: #f4434338; }
.sv-huolto__tyokalu { position: absolute; right: -15px; bottom: -6px; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; border: 1px solid #ff6b6b45; background: #331c20; color: #ff7b7b; box-shadow: 0 8px 20px #0005; transform: rotate(14deg); }
.sv-huolto__tyokalu svg { width: 26px; height: 26px; }
.sv-kicker { display: flex; align-items: center; justify-content: center; gap: 8px; font: 600 10px system-ui; letter-spacing: .17em; color: #b6b6c1; margin: 0 0 20px; }
.sv-kicker i { width: 5px; height: 5px; background: #ff6262; border-radius: 50%; box-shadow: 0 0 10px #ff626240; }
.sv-huolto h1 { font-size: clamp(44px, 5vw, 76px); line-height: 1.02; font-weight: 800; letter-spacing: -.055em; margin: 0 0 24px; }
.sv-huolto h1 span { color: #a2a2b0; }
.sv-huolto__kuvaus { color: #a4a4b1; font: 15px/1.8 system-ui; margin: 0 auto; }
.sv-huolto__linkit { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin: 28px 0 22px; }
.sv-huolto__linkit:empty { margin: 26px 0 0; }
.sv-huolto__linkit a { padding: 12px 19px; border: 1px solid #ffffff20; border-radius: 10px; background: #ffffff05; color: #f4f4f6; text-decoration: none; font: 600 12px system-ui; }
.sv-huolto__linkit a:first-child { background: #e73131; border-color: #ff62624d; }
.sv-huolto__linkit a:hover { background: #ffffff12; }
.sv-huolto__linkit a:first-child:hover { background: #fb4141; }
.sv-huolto__linkit button { padding: 12px 19px; border: 1px solid #ff62624d; border-radius: 10px; background: #e73131; color: #fff; font: 600 12px system-ui; cursor: pointer; }
.sv-huolto__linkit button:hover { background: #fb4141; }
.sv-kirjaudu { color: #858593; font: 12px system-ui; text-decoration: none; }
.sv-kirjaudu span { margin-left: 5px; }
.sv-kirjaudu:hover { color: #fff; }
.sv-huolto a:focus-visible { outline: 2px solid #ff7474; outline-offset: 5px; }
@media (max-width: 600px) { .sv-huolto { min-height: calc(100svh - 76px); padding: calc(var(--hdr, 58px) + 28px) 20px 50px; } .sv-huolto__kuvitus { margin-bottom: 28px; } }
.sv-paneeli { width: min(560px, calc(100vw - 28px)); max-height: calc(100dvh - 50px); padding: 26px; border: 1px solid #ffffff24; border-radius: 22px; background: #131419; color: #f4f4f6; box-sizing: border-box; box-shadow: 0 40px 140px #000b; font-family: system-ui; }
.sv-paneeli::backdrop { background: #030408b8; backdrop-filter: blur(8px); }
.sv-paneeli header { display: flex; justify-content: space-between; align-items: start; gap: 20px; }
.sv-paneeli h2 { font-size: 26px; margin: 0; }
.sv-paneeli header button { border: 1px solid #ffffff20; background: #ffffff08; border-radius: 9px; padding: 8px 12px; color: #fff; cursor: pointer; }
.sv-ohje { font-size: 13px; line-height: 1.7; color: #a6a7b4; margin: 18px 0; }
.sv-rivi { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; gap: 14px; border-bottom: 1px solid #ffffff0d; position: relative; cursor: pointer; }
.sv-rivi b { display: block; font-size: 14px; }
.sv-rivi small { display: block; font-size: 11px; color: #90919f; margin-top: 4px; }
.sv-rivi input { position: absolute; right: 0; width: 44px; height: 26px; opacity: 0; cursor: pointer; }
.sv-rivi i { width: 44px; height: 26px; border-radius: 20px; background: #34353e; flex-shrink: 0; padding: 3px; box-sizing: border-box; pointer-events: none; }
.sv-rivi i::after { content: ''; display: block; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .15s; }
.sv-rivi input:checked + i { background: #398b64; }
.sv-rivi input:checked + i::after { transform: translateX(18px); }
.sv-rivi input:focus-visible + i { outline: 2px solid #ffba66; outline-offset: 4px; }
.sv-rivi input:disabled + i { opacity: .4; }
.sv-tila { min-height: 20px; font-size: 12px; color: #ffba66; margin: 18px 0 0; }
@media (max-width: 1023px) { .sv-avain { bottom: 86px; right: 14px; } .sv-huolto { margin-left: 0; } }
@media (prefers-reduced-motion: reduce) { .sv-rivi i::after { transition: none; } }