/* yhteinen.css (v132) – yksi ilme kaikille alasivuille (kirjaudu, tila, raportti, tarkista, tuki, tietosuoja, käyttöehdot, oma tili).
   Samat muuttujat, fontti, kortti ja napin muoto kuin Enginessä. Ladataan sivun oman tyylin jälkeen. */
:root{--bg:#000;--pan:#0a0a0a;--pan2:#141414;--ink:#fff;--mut:#a3a3a3;--mut2:#737373;--line:#1f1f1f;--line2:#262626;--ok:#3DDC97;--warn:#E8B100;--bad:#FF5C5C;--ak:#6F95FF;--yel:#FFD83D;
  --kortti-tausta:var(--pan);--kortti-reuna:var(--line);--kortti-sade:12px;--kortti-pad:18px}
:root[data-theme=light]{--bg:#fff;--pan:#f6f7fa;--pan2:#eceef3;--ink:#14161d;--mut:#5a6372;--mut2:#8a93a3;--line:#e3e6ec;--line2:#d5d9e2}
html{-webkit-font-smoothing:antialiased}
body{background:var(--bg)!important;color:var(--ink);font-family:Inter,"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif!important;background-image:none!important}
h1,h2,h3{letter-spacing:-.015em;text-wrap:balance}
a{color:inherit}
/* kortit */
.big,.c,.card,.kortti,.box,.help,.r2,.pe{background:var(--kortti-tausta)!important;border:1px solid var(--kortti-reuna)!important;border-radius:var(--kortti-sade)!important;box-shadow:none!important;background-image:none!important}
/* napit: yksi muoto, kaksi tasoa */
button,.btn,.pill,input[type=submit]{border-radius:99px!important;font-family:inherit;font-weight:600}
form button,.btn.p,button.p,.pill.p{background:var(--yel)!important;color:#1a1500!important;border:0!important;box-shadow:none!important}
.btn.s,button.s,.pill.s{background:var(--pan2)!important;color:var(--ink)!important;border:1px solid var(--line2)!important}
/* kentät */
input:not([type=checkbox]):not([type=radio]):not([type=submit]),textarea,select{border-radius:12px!important;background:var(--pan2)!important;border:1px solid var(--line2)!important;color:var(--ink)!important;box-shadow:none!important}
input:focus,textarea:focus,select:focus{border-color:var(--ak)!important;outline:none!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--ak) 25%,transparent)!important}
/* hehkut pois */
.dot,.ok .dot,.bad .dot{box-shadow:none!important}
/* yhteinen ylätunniste; sivun oma paluulinkki piiloon */
.bk,a.back,.takaisin{display:none!important}
.yt{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.yt .in{max-width:1100px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.yt .br{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px;text-decoration:none;color:var(--ink)}.yt .br img{width:26px;height:26px}
.yt .lk{display:inline-flex;gap:6px 18px;flex-wrap:wrap;font-size:13.5px}.yt .lk a{text-decoration:none;color:var(--mut)}.yt .lk a:hover{color:var(--ink)}
.yt .lk a.p{padding:7px 14px;border-radius:99px;background:var(--pan2);border:1px solid var(--line2);color:var(--ink)}
body.yt-on .w,body.yt-on main{padding-top:40px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media print{.yt{display:none}}

/* v135: viimeistely */
:root{--ink2:#e6e6ea;--sh1:0 1px 2px rgba(0,0,0,.35),0 8px 24px -16px rgba(0,0,0,.6);--sh2:0 1px 2px rgba(0,0,0,.4),0 14px 36px -18px rgba(0,0,0,.75);--ring:0 0 0 2px var(--bg),0 0 0 4px color-mix(in srgb,var(--ak) 65%,transparent)}
:root[data-theme=light]{--ink2:#2a2d34;--sh1:0 1px 2px rgba(16,18,27,.06),0 8px 24px -16px rgba(16,18,27,.18);--sh2:0 1px 2px rgba(16,18,27,.08),0 14px 36px -18px rgba(16,18,27,.26)}
body{color:var(--ink2)}h1,h2,h3,h4,b,strong{color:var(--ink)}p{line-height:1.6}
.big,.c,.card,.kortti,.box,.help,.r2,.pe{box-shadow:var(--sh1)!important;transition:border-color .2s ease,box-shadow .2s ease}
button,.btn,.pill,a{transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .15s ease,filter .2s ease}
form button:hover,.btn.p:hover,button.p:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:var(--sh1)!important}
form button:active,.btn.p:active{transform:none;filter:brightness(.98)}
:focus-visible{outline:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{box-shadow:var(--ring)!important}
.r{transition:background-color .15s ease}.r:hover{background:color-mix(in srgb,var(--pan2) 60%,transparent)}
.yt .lk a.p:hover{background:color-mix(in srgb,var(--pan2) 70%,var(--ink) 6%);border-color:var(--mut2)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
