/* Laskurit.fi – laskureiden tyylit */
:root {
  --lk-ink: #0E1A2B;
  --lk-muted: #4A5568;
  --lk-line: #D9DFEA;
  --lk-line2: #EEF1F6;
  --lk-field: #B8C2D3;
  --lk-bg: #F4F6FA;
  --lk-card: #FFFFFF;
  --lk-brand: #1D4ED8;
  --lk-raha: #0B7A4B; --lk-raha-t: #E7F5EE; --lk-raha-l: #BFE3CF;
  --lk-terveys: #C0304A; --lk-terveys-t: #FCEBEE; --lk-terveys-l: #F3C5CE;
  --lk-koti: #B45309; --lk-koti-t: #FDF1E4; --lk-koti-l: #F2D3AE;
  --lk-tieto: #6D28D9; --lk-tieto-t: #F1EBFD; --lk-tieto-l: #D8C8FA;
  --lk-muunnin: #1D4ED8; --lk-muunnin-t: #EAF0FD; --lk-muunnin-l: #C6D5F7;
  --lk-ok: #0B7A4B;
  --lk-radius: 16px;
}
@media (prefers-color-scheme: dark) {
  :root.lk-dark-auto {
    --lk-ink: #E8EDF5; --lk-muted: #A9B4C6; --lk-line: #2A3750; --lk-line2: #1E2A3D; --lk-field: #3A4A66;
    --lk-bg: #0F1623; --lk-card: #172133; --lk-brand: #7FA6FF;
    --lk-raha: #4CC48E; --lk-raha-t: #133126; --lk-raha-l: #1E4A39;
    --lk-terveys: #FF8197; --lk-terveys-t: #3A1820; --lk-terveys-l: #5A2632;
    --lk-koti: #F5A55A; --lk-koti-t: #3A2714; --lk-koti-l: #573A1D;
    --lk-tieto: #B79CFF; --lk-tieto-t: #261C40; --lk-tieto-l: #3A2C60;
    --lk-muunnin: #7FA6FF; --lk-muunnin-t: #18264A; --lk-muunnin-l: #263B6E;
  }
}
.lk-c-raha { --c: var(--lk-raha); --ct: var(--lk-raha-t); --cl: var(--lk-raha-l); }
.lk-c-terveys { --c: var(--lk-terveys); --ct: var(--lk-terveys-t); --cl: var(--lk-terveys-l); }
.lk-c-koti { --c: var(--lk-koti); --ct: var(--lk-koti-t); --cl: var(--lk-koti-l); }
.lk-c-tieto { --c: var(--lk-tieto); --ct: var(--lk-tieto-t); --cl: var(--lk-tieto-l); }
.lk-c-muunnin { --c: var(--lk-muunnin); --ct: var(--lk-muunnin-t); --cl: var(--lk-muunnin-l); }

/* Laskurikortti */
.lk-wrap { margin: 0 0 1.5rem; color: var(--lk-ink); font-variant-numeric: tabular-nums; }
.lk-calc {
  background: var(--lk-card); border: 1px solid var(--lk-line); border-top: 5px solid var(--c, var(--lk-brand));
  border-radius: var(--lk-radius); padding: 16px; display: flex; flex-direction: column; gap: 16px;
  min-height: 320px; box-sizing: border-box;
}
.lk-calc.lk-ready { min-height: 0; }
.lk-calc * { box-sizing: border-box; }
.lk-loading { color: var(--lk-muted); font-size: 15px; margin: 0; }
.lk-form { display: flex; flex-wrap: wrap; gap: 14px 12px; margin: 0; }
.lk-field { flex: 1 1 100%; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.lk-field[hidden] { display: none; }
@media (min-width: 560px) {
  .lk-w-half { flex: 1 1 calc(50% - 6px); }
  .lk-w-third { flex: 1 1 calc(33.333% - 8px); }
}
.lk-label { font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--lk-ink); }
.lk-help { margin: 0; font-size: 13.5px; line-height: 1.45; color: var(--lk-muted); }
.lk-inbox { position: relative; display: flex; align-items: stretch; }
.lk-in {
  width: 100%; min-height: 52px; border: 1.5px solid var(--lk-field); border-radius: 12px; background: var(--lk-card);
  color: var(--lk-ink); font: inherit; font-size: 20px; font-weight: 600; padding: 0 14px; font-variant-numeric: tabular-nums;
  -webkit-appearance: none; appearance: none;
}
select.lk-in { font-size: 17px; padding-right: 40px; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
input[type=date].lk-in, input[type=time].lk-in { font-size: 18px; }
textarea.lk-in { min-height: 140px; padding: 12px 14px; font-size: 16px; font-weight: 400; line-height: 1.5; resize: vertical; }
.lk-in:focus { outline: none; border-color: var(--c, var(--lk-brand)); box-shadow: 0 0 0 3px var(--ct, #EAF0FD); }
.lk-inbox.has-unit .lk-in { padding-right: 64px; }
.lk-unit { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 17px; font-weight: 600; color: var(--lk-muted); pointer-events: none; }
.lk-inbox.has-step .lk-unit { right: 62px; }
.lk-inbox.has-step .lk-in { text-align: center; border-radius: 0; border-left: 0; border-right: 0; }
.lk-step { flex: 0 0 48px; min-height: 52px; border: 1.5px solid var(--lk-field); background: var(--lk-bg); color: var(--lk-ink); font-size: 22px; font-weight: 600; cursor: pointer; }
.lk-step:first-child { border-radius: 12px 0 0 12px; }
.lk-step:last-child { border-radius: 0 12px 12px 0; }
.lk-seg { display: grid; grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); gap: 6px; }
.lk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lk-opt {
  min-height: 46px; padding: 0 12px; border: 1.5px solid var(--lk-line); border-radius: 10px; background: var(--lk-card);
  color: var(--lk-ink); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; line-height: 1.2;
}
.lk-chips .lk-opt { min-height: 40px; border-radius: 999px; padding: 0 14px; font-size: 14px; }
.lk-opt.on { background: var(--c, var(--lk-brand)); border-color: var(--c, var(--lk-brand)); color: #fff; }
:root.lk-dark-auto .lk-opt.on { color: #0F1623; }
.lk-check { display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: 15px; font-weight: 600; cursor: pointer; }
.lk-check input { width: 22px; height: 22px; accent-color: var(--c, var(--lk-brand)); }

/* Tulos */
.lk-result { background: var(--ct, #EAF0FD); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.lk-result.is-err { background: var(--lk-bg); }
.lk-main { display: flex; flex-direction: column; gap: 2px; }
.lk-main-l { font-size: 14px; font-weight: 700; color: var(--c, var(--lk-brand)); }
.lk-main-v { font-size: clamp(30px, 8vw, 40px); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; color: var(--lk-ink); word-break: break-word; }
.lk-main-s { font-size: 15px; color: var(--lk-ink); }
.lk-text { margin: 0; font-size: 15.5px; line-height: 1.5; }
.lk-warn { margin: 0; font-size: 14.5px; line-height: 1.45; padding: 8px 10px; border-radius: 8px; background: var(--lk-card); border: 1px solid var(--cl, var(--lk-line)); }
.lk-err { margin: 0; font-size: 15px; color: var(--lk-muted); }
.lk-note { margin: 0; font-size: 13.5px; color: var(--lk-muted); line-height: 1.45; }
.lk-rows { margin: 4px 0 0; padding: 10px 0 0; border-top: 1px solid var(--cl, var(--lk-line)); display: flex; flex-direction: column; gap: 6px; }
.lk-row { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; }
.lk-row dt { margin: 0; color: var(--lk-ink); }
.lk-row dd { margin: 0; font-weight: 700; text-align: right; white-space: nowrap; }
.lk-row.strong dt, .lk-row.strong dd { font-weight: 800; }
.lk-row.sub dt { padding-left: 12px; color: var(--lk-muted); }
.lk-row.sub dd { font-weight: 600; }
.lk-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--lk-line); border-radius: 12px; overflow: hidden; background: var(--lk-card); }
.lk-list li { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; column-gap: 8px; align-items: center; padding: 8px 6px 8px 14px; border-bottom: 1px solid var(--lk-line2); }
.lk-list li:last-child { border-bottom: 0; }
.lk-list li.on { background: var(--ct, #EAF0FD); }
.lk-li-v { font-size: 17px; font-weight: 700; word-break: break-word; }
.lk-li-n { grid-row: 2; font-size: 13px; color: var(--lk-muted); }
.lk-copy1 { grid-column: 2; grid-row: 1 / span 2; width: 44px; height: 44px; border: 0; background: transparent; color: var(--c, var(--lk-brand)); border-radius: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.lk-copy1.ok { color: var(--lk-ok); }
.lk-tablewrap { overflow-x: auto; background: var(--lk-card); border: 1px solid var(--lk-line); border-radius: 12px; }
.lk-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.lk-table caption { text-align: left; font-weight: 700; padding: 10px 12px 4px; font-size: 14px; }
.lk-table th, .lk-table td { padding: 8px 12px; border-bottom: 1px solid var(--lk-line2); text-align: right; white-space: nowrap; }
.lk-table th:first-child { text-align: left; }
.lk-table thead th { background: var(--ct, #EAF0FD); color: var(--lk-ink); font-weight: 700; position: sticky; top: 0; }
.lk-table tbody th { font-weight: 600; }
.lk-table tr.hl th, .lk-table tr.hl td { background: var(--ct, #EAF0FD); font-weight: 700; }
.lk-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lk-btn { min-height: 44px; border-radius: 10px; border: 1.5px solid var(--lk-line); background: var(--lk-card); color: var(--lk-ink); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; padding: 0 8px; }
.lk-btn-main { background: var(--c, var(--lk-brand)); border-color: var(--c, var(--lk-brand)); color: #fff; }
:root.lk-dark-auto .lk-btn-main { color: #0F1623; }
.lk-btn.ok { border-color: var(--lk-ok); }
.lk-opt:focus-visible, .lk-btn:focus-visible, .lk-step:focus-visible, .lk-copy1:focus-visible, .lk-check input:focus-visible { outline: 3px solid var(--lk-brand); outline-offset: 2px; }
.lk-sticky {
  position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; padding: 12px 16px; border-radius: 12px;
  background: var(--lk-ink); color: #fff; font-weight: 700; font-size: 16px; box-shadow: 0 6px 20px rgba(14, 26, 43, .25);
  transform: translateY(150%); transition: transform .2s ease; pointer-events: none; font-variant-numeric: tabular-nums;
}
.lk-sticky.on { transform: none; }
@media (prefers-reduced-motion: reduce) { .lk-sticky { transition: none; } }

/* Arvolaatikko */
.lk-values { margin: 12px 0 0; border: 1px solid var(--lk-line); border-radius: 14px; background: var(--lk-card); }
.lk-values summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; font-weight: 600; font-size: 15px; cursor: pointer; list-style: none; }
.lk-values summary::-webkit-details-marker { display: none; }
.lk-values summary::after { content: ""; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-top: -4px; }
.lk-values[open] summary::after { transform: rotate(-135deg); margin-top: 4px; }
.lk-values-in { padding: 0 16px 14px; font-size: 14.5px; line-height: 1.55; }
.lk-values-in ul { margin: 0 0 8px; padding-left: 18px; }
.lk-values-in p { margin: 6px 0 0; color: var(--lk-muted); }

/* Mainospaikka */
.lk-ad { margin: 20px auto; text-align: center; min-height: 280px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.lk-ad-l { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--lk-muted); margin-bottom: 4px; }
@media (max-width: 767px) { .lk-ad { min-height: 250px; } }

/* Kortit ja listat */
.lk-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin: 16px 0 24px; padding: 0; list-style: none; }
.lk-card { display: flex; flex-direction: column; gap: 4px; padding: 16px 16px 14px; border: 1px solid var(--lk-line); border-left: 5px solid var(--c); border-radius: 14px; background: var(--lk-card); color: var(--lk-ink); text-decoration: none; min-height: 100%; }
.lk-card:hover { border-color: var(--c); }
.lk-card .n { font-size: 17px; font-weight: 700; line-height: 1.3; }
.lk-card .k { font-size: 14px; color: var(--lk-muted); line-height: 1.45; }
.lk-card .c { font-size: 12.5px; font-weight: 700; color: var(--c); }
.lk-related { margin: 32px 0 8px; }
.lk-related h2 { margin: 0 0 4px; }
.lk-az { columns: 1; margin: 8px 0 24px; }
@media (min-width: 700px) { .lk-az { columns: 2; column-gap: 32px; } }
@media (min-width: 1000px) { .lk-az { columns: 3; } }
.lk-az-g { break-inside: avoid; margin: 0 0 16px; }
.lk-az-g h2 { font-size: 22px; margin: 0 0 6px; }
.lk-az-g ul { list-style: none; margin: 0; padding: 0; }
.lk-az-g li { padding: 4px 0; }
.lk-az-g a { text-decoration: none; font-weight: 600; }
.lk-az-g .dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--c); margin-right: 8px; }

/* Haku */
.lk-search { position: relative; display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; max-width: 760px; }
.lk-search label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.lk-search input { flex: 999 1 260px; min-width: 0; min-height: 56px; border: 1.5px solid var(--lk-field); border-radius: 14px; padding: 0 16px; font: inherit; font-size: 17px; background: var(--lk-card); color: var(--lk-ink); }
.lk-search button { flex: 1 1 100px; min-height: 56px; border: 0; border-radius: 14px; background: var(--lk-brand); color: #fff; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.lk-search-out { flex: 1 1 100%; display: flex; flex-direction: column; border: 1px solid var(--lk-line); border-radius: 14px; background: var(--lk-card); overflow: hidden; }
.lk-search-hit { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--lk-line2); text-decoration: none; color: var(--lk-ink); }
.lk-search-hit:last-child { border-bottom: 0; }
.lk-search-hit .n { font-weight: 700; }
.lk-search-hit .c { font-size: 13px; color: var(--c); font-weight: 700; white-space: nowrap; }
.lk-search-none { margin: 0; padding: 12px 16px; color: var(--lk-muted); }

/* Palaute ja vastuuvapaus */
.lk-fb { margin: 28px 0 12px; padding: 16px; border: 1px solid var(--lk-line); border-radius: 14px; background: var(--lk-card); display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.lk-fb p { margin: 0; font-weight: 600; }
.lk-fb button { min-height: 44px; min-width: 80px; border-radius: 10px; border: 1.5px solid var(--lk-line); background: var(--lk-card); color: var(--lk-ink); font: inherit; font-weight: 600; cursor: pointer; }
.lk-disclaimer { margin: 12px 0 0; font-size: 14px; line-height: 1.5; color: var(--lk-muted); }
.lk-breadcrumb { font-size: 14px; color: var(--lk-muted); margin: 0 0 4px; }
.lk-breadcrumb a { color: var(--lk-muted); text-decoration: none; }
.lk-breadcrumb a.cat { color: var(--c); font-weight: 600; }
.lk-breadcrumb span[aria-hidden] { margin: 0 6px; }

/* Nettilaskin ym. erikoislaskurit */
.lk-keys { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.lk-key { min-height: 56px; border-radius: 12px; border: 1.5px solid var(--lk-line); background: var(--lk-card); color: var(--lk-ink); font: inherit; font-size: 22px; font-weight: 600; cursor: pointer; }
.lk-key.op { background: var(--ct); color: var(--c); border-color: var(--cl); }
.lk-key.eq { background: var(--c); border-color: var(--c); color: #fff; }
.lk-screen { background: var(--ct); border-radius: 12px; padding: 12px 16px; text-align: right; min-height: 96px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; }
.lk-screen .expr { font-size: 16px; color: var(--lk-muted); min-height: 22px; word-break: break-all; }
.lk-screen .val { font-size: 38px; font-weight: 800; word-break: break-all; line-height: 1.1; }
.lk-filter { min-height: 52px; }
.lk-big-btn { min-height: 56px; border-radius: 12px; border: 0; background: var(--c); color: #fff; font: inherit; font-size: 18px; font-weight: 700; cursor: pointer; }
.lk-draw { font-size: clamp(28px, 7vw, 44px); font-weight: 800; text-align: center; padding: 16px; background: var(--ct); border-radius: 12px; min-height: 90px; display: flex; align-items: center; justify-content: center; word-break: break-word; }

/* Etusivun ryhmät */
.lk-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; margin: 16px 0 32px; }
.lk-group { background: var(--lk-card); border: 1px solid var(--lk-line); border-top: 5px solid var(--c); border-radius: 16px; padding: 18px 20px; }
.lk-group-h { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.lk-group-h h3 { margin: 0; font-size: 21px; font-weight: 800; }
.lk-tile { width: 40px; height: 40px; border-radius: 10px; background: var(--c); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 700; line-height: 1; flex-shrink: 0; }
.lk-group ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.lk-group li { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.lk-group a { font-weight: 600; text-decoration: none; color: var(--lk-ink); padding: 4px 0; }
.lk-group a:hover { color: var(--c); text-decoration: underline; }
.lk-count { font-size: 13px; color: var(--lk-muted); font-variant-numeric: tabular-nums; }
.lk-ad { overflow: hidden; max-width: 100%; }

/* Korjaukset */
.lk-search-out[hidden] { display: none; }
.lk-wrap, .lk-wrap *, .lk-related, .lk-related *, .lk-fb, .lk-fb *, .lk-values, .lk-values *, .lk-search, .lk-search *, .lk-cards, .lk-cards *, .lk-groups, .lk-groups * { box-sizing: border-box; }
.lk-wrap { font-variant-numeric: normal; }
.lk-in, .lk-main-v, .lk-rows dd, .lk-li-v, .lk-table td, .lk-sticky, .lk-screen { font-variant-numeric: tabular-nums; }
.lk-table th:first-child { white-space: normal; min-width: 8em; }
.lk-calc > *, .lk-result > *, .lk-field, .lk-inbox { min-width: 0; max-width: 100%; }
.lk-tablewrap, .lk-extra { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lk-extra table { border-collapse: collapse; font-size: 14.5px; }
.lk-extra th, .lk-extra td { padding: 6px 10px; border-bottom: 1px solid var(--lk-line2); }
.lk-row { flex-wrap: wrap; }
.lk-row dt { flex: 1 1 55%; min-width: 0; }
.lk-row dd { flex: 0 1 auto; white-space: normal; overflow-wrap: anywhere; }
