/* Työnäkymien yhteiset tokenit ja komponentit (etuliite wk-). Tumma tila: asetusohjeen väritaulukko (kohta 5). */
/* Hiiren päällä (8.10.2026) napin väri ei vaihdu: sininen nappi vaalenee ja nousee, valkoinen tummuu ja nousee, harmaa
   vaalenee tai tummuu (--hv-f), sävytetty saa ohuen reunan (--hv-ring), klikattava rivi hennon taustan (--hv-row). */
:root{--hv-f:brightness(.95);--hv-row:rgba(120,135,160,.09);--hv-ring:rgba(var(--acc-d-rgb,47,95,168),.55);--wk-green-ink:#1f7a45;--wk-amber-ink:#8f600a;--wk-bg:#f4f6fa;--wk-panel:#fff;--wk-card:#fbfcfd;--wk-inner:#fff;--wk-field:#fff;--wk-field-line:#7f8999;--wk-line:#eef0f4;--wk-line-2:#e3e6ec;--wk-ink:#16202e;--wk-body:#4f5664;--wk-mut:#5b6576;--wk-dim:#626c7c;--wk-brand:var(--acc-d,#2f5fa8);--wk-link:var(--acc-d,#2f5fa8);--wk-tint:var(--acc-t,#eef3fb);--wk-green-t:#eaf6ec;--wk-green:#2e9b5c;--wk-red-t:#fdeceb;--wk-red:#e0453c;--wk-red-ink:#c4302a;--wk-amber-t:#fff8ec;--wk-amber:#c58a1d;--wk-violet-t:#f1edfa;--wk-violet:#6b4fb5;--wk-btn2:#fff;--wk-btn2-line:#dfe1e6;--wk-scrim:rgba(16,21,31,.35);--wk-shadow:0 20px 40px -30px rgba(16,24,40,.45);--wk-shadow-lg:0 30px 60px -24px rgba(16,24,40,.35);--wk-chip:#eef0f4;--wk-chip-fg:#4a5468;--wk-ai:#eaf1fc;--wk-ai-fg:#24508f;--wk-av:#4f5d75}
html[data-theme="dark"]{--hv-f:brightness(1.25);--hv-row:rgba(170,185,210,.07);--hv-ring:rgba(var(--acc-rgb,59,111,209),.7);--wk-green-ink:#6fcf8e;--wk-amber-ink:#f0c36a;--wk-bg:#0d1119;--wk-panel:#111726;--wk-card:#141a26;--wk-inner:#18203a;--wk-field:#0f1523;--wk-field-line:rgba(255,255,255,.35);--wk-line:rgba(255,255,255,.06);--wk-line-2:rgba(255,255,255,.12);--wk-ink:#f4f6fa;--wk-body:#c3cad8;--wk-mut:#98a3ba;--wk-dim:#939db1;--wk-brand:var(--acc,#3b6fd1);--wk-link:#8fb4e8;--wk-tint:rgba(var(--acc-rgb,59,111,209),.16);--wk-green-t:rgba(46,155,92,.16);--wk-green:#6fcf8e;--wk-red-t:rgba(224,69,60,.16);--wk-red:#ff8a7e;--wk-red-ink:#ff8a7e;--wk-amber-t:rgba(224,169,46,.12);--wk-amber:#f0c36a;--wk-violet-t:rgba(107,79,181,.2);--wk-violet:#b9a4f0;--wk-btn2:#1b2336;--wk-btn2-line:rgba(255,255,255,.12);--wk-scrim:rgba(0,0,0,.55);--wk-shadow:0 20px 40px -24px rgba(0,0,0,.8);--wk-shadow-lg:0 30px 60px -20px rgba(0,0,0,.8);--wk-chip:#252d3c;--wk-chip-fg:#b9c2d3;--wk-ai:#16263f;--wk-ai-fg:#a9c6f0;--wk-av:#3a465c}

/* ilmoitus + Peru */
.wk-toast{position:fixed;left:50%;bottom:26px;z-index:210;display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:10px 12px 10px 16px;border-radius:14px;background:#16202e;color:#fff;font-size:14px;font-weight:500;box-shadow:0 20px 40px -16px rgba(0,0,0,.6);transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:transform .2s,opacity .2s}
.wk-toast.show{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.wk-toast svg{width:16px;height:16px;color:#6fcf8e;flex-shrink:0;stroke-width:2.2}
.wk-toast.err svg{color:#f28b82}
.wk-toast span{min-width:0;overflow-wrap:anywhere}
.wk-toast button{margin-left:6px;border:0;border-radius:9px;padding:7px 12px;background:rgba(255,255,255,.12);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.wk-toast button:hover,.wk-toast button:focus-visible{background:rgba(255,255,255,.22)}
html[data-theme="dark"] .wk-toast{background:#1b2336;border:1px solid rgba(255,255,255,.1)}
@media (max-width:760px){.wk-toast{bottom:calc(90px + env(safe-area-inset-bottom,0px))}}

/* dialogi */
.wk-dlg{width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:1px solid var(--wk-line-2);border-radius:18px;background:var(--wk-panel);color:var(--wk-ink);box-shadow:var(--wk-shadow-lg)}
.wk-dlg::backdrop{background:var(--wk-scrim)}
.wk-dlg-in{display:flex;flex-direction:column;max-height:calc(100vh - 34px)}
.wk-dlg-hd{display:flex;align-items:flex-start;gap:12px;padding:20px 20px 14px;border-bottom:1px solid var(--wk-line)}
.wk-dlg-hd h2{margin:0 0 3px;font-family:var(--font-heading);font-weight:600;font-size:21px;color:var(--wk-ink)}
.wk-dlg-hd p{margin:0;font-size:13.5px;line-height:1.5;color:var(--wk-mut)}
.wk-dlg-hd>div{flex:1;min-width:0}
.wk-dlg-ic{width:38px;height:38px;border-radius:11px;flex-shrink:0;display:grid;place-items:center;background:var(--wk-tint);color:var(--wk-link)}
.wk-dlg-ic svg{width:18px;height:18px;stroke-width:2}
.wk-x{width:32px;height:32px;flex-shrink:0;display:grid;place-items:center;border:1px solid var(--wk-btn2-line);border-radius:10px;background:var(--wk-btn2);color:var(--wk-mut);cursor:pointer}
.wk-x svg{width:15px;height:15px;stroke-width:2}
.wk-dlg-bd{display:grid;gap:12px;padding:16px 20px;overflow-y:auto}
.wk-dlg-bd label{display:grid;gap:5px;font-size:12.5px;font-weight:600;color:var(--wk-mut)}
.wk-dlg-bd input{width:100%;min-width:0;height:40px;padding:0 11px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:14px;font-weight:500}
.wk-dlg-bd input:focus{outline:2px solid var(--wk-brand);outline-offset:0;border-color:transparent}
/* Liitä viesti- ja Asiakas soitti -ikkunoiden tekstikenttä samaan tyyliin kuin muut kentät. */
.wk-dlg-bd textarea{width:100%;min-width:0;padding:10px 11px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:15px;font-weight:500;line-height:1.45;resize:vertical}
.wk-dlg-bd textarea:focus{outline:2px solid var(--wk-brand);outline-offset:0;border-color:transparent}
.wk-dlg-bd textarea::placeholder{font-weight:400;color:var(--wk-dim)}
.wk-dlg-bd select{width:100%;min-width:0;height:40px;padding:0 9px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:14px}
.of-sv-h{display:block;margin-bottom:6px;font-size:12.5px;color:var(--wk-mut)}
.of-sv-c{display:grid;gap:6px;margin-bottom:8px}
.of-sv-r{display:flex!important;gap:10px;align-items:flex-start;padding:9px 11px;border:1px solid var(--wk-line);border-radius:10px;cursor:pointer;color:var(--wk-ink)!important}
.of-sv-r input{width:auto!important;height:auto!important;margin-top:3px}
.of-sv-r span{display:grid;gap:2px;min-width:0}.of-sv-r small{font-weight:500;color:var(--wk-dim)}
.of-sv-r b,.of-sv-r small{overflow-wrap:anywhere}
.of-sv-s{display:flex;gap:8px}.of-sv-s input{flex:1}
html[data-theme="dark"] .wk-dlg-bd input,html[data-theme="dark"] .wk-dlg-bd textarea{color-scheme:dark}
.wk-row3{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:10px}
.wk-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wk-auto{display:flex;align-items:center;gap:5px;margin-top:6px;font-size:12.5px;font-weight:500;color:var(--wk-ai-fg)}
.wk-auto[hidden]{display:none}
.wk-auto svg{width:12px;height:12px;flex:none}
@media (max-width:480px){.wk-row2{grid-template-columns:1fr}}
.wk-note{margin:0;font-size:12.5px;color:var(--wk-dim)}
.wk-err{margin:0;padding:9px 12px;border-radius:10px;background:var(--wk-red-t);color:var(--wk-red);font-size:13px;font-weight:600}
.wk-dlg-ft{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding:14px 20px 18px;border-top:1px solid var(--wk-line)}
.ch-dlg .wk-dlg-bd p{margin:0;font-size:14px;line-height:1.5;color:var(--wk-ink)}
.ch-act{display:flex;flex-wrap:wrap;gap:8px}
.wk-dlg-bd .ch-ok{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;font-weight:600;color:var(--wk-ink);cursor:pointer}.wk-dlg-bd .ch-ok input{margin:2px 0 0;padding:0;flex:none;width:18px;height:18px;accent-color:var(--wk-brand)}
.wk-dlg-ft a.primary-btn[aria-disabled="true"]{opacity:.55}
.ch-act a,.wk-dlg-ft a.primary-btn{display:inline-flex;align-items:center;text-decoration:none}
.ch-hint{margin-top:14px}
.wk-dlg-ft .primary-btn,.wk-dlg-ft .secondary-btn{margin:0}
@media (max-width:480px){.wk-row3{grid-template-columns:1fr 1fr}.wk-row3 label:first-child{grid-column:1/-1}.wk-dlg-ft>*{flex:1 1 auto}}
[data-job-book] svg{width:16px;height:16px;margin-right:6px;vertical-align:-3px}

/* ===== työnäkymän banneri (html.dash-view.wk-view) ===== */
.wk-view .banner-ridge,.wk-view .banner-nodes{display:none}
.wk-view .dash-banner{padding:4px max(32px,calc((100% - 1540px)/2 + 32px)) 26px}
.wk-view .content-wrap{padding-top:20px;width:min(1540px,100%)}
/* Otsikko ja painikkeet rinnakkain, kun ne mahtuvat. Kapeassa ikkunassa (esim. jaettu näyttö, sivupalkki auki)
   painikkeet siirtyvät otsikon alle; aiemmin ne veivät koko leveyden ja otsikko meni kirjain kerrallaan allekkain. */
.wk-ban{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 20px;color:#fff}
.wk-ban-l{min-width:0;flex:1 1 auto}
.wk-hlab{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--acc-l,#9dc0f2);overflow-wrap:anywhere}
.wk-ban h1{margin:4px 0 0;font-family:var(--font-heading);font-weight:600;font-size:32px;line-height:1.15;color:#fff;padding:0}
.wk-sub{margin:6px 0 0!important;color:rgba(244,246,250,.75)!important;font-size:14px!important}
.wk-ban-r{display:flex;flex-direction:column;align-items:flex-end;gap:12px;min-width:0;max-width:100%}
.wk-src{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:rgba(244,246,250,.78);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:4px 11px;white-space:nowrap}
.wk-src svg{width:14px;height:14px;color:var(--acc-l,#9dc0f2);stroke-width:2}
/* Päivitä-painike bannerissa (dist/work.js wkRefresh): sama vaalea pilleri kuin lähdemerkki, mutta painettava. */
.wk-refresh{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12.5px;font-weight:600;color:rgba(244,246,250,.9);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:5px 12px;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}
.wk-refresh svg{width:14px;height:14px;stroke-width:2}
.wk-refresh:hover:not(:disabled){background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.26)}
.wk-refresh:focus-visible{outline:2px solid var(--acc-l,#9dc0f2);outline-offset:2px}
.wk-refresh:disabled{cursor:default;opacity:.7}
.wk-refresh.busy svg{animation:wk-spin .9s linear infinite}
@keyframes wk-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.wk-refresh.busy svg{animation:none}}
.wk-prog{min-width:230px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);border-radius:14px;padding:12px 14px}
.wk-prog span{display:block;font-size:12px;font-weight:600;color:rgba(244,246,250,.65)}
.wk-prog b{display:block;font-family:var(--font-heading);font-weight:600;font-size:24px;margin:2px 0 8px;color:#fff}
.wk-prog i{display:block;height:6px;border-radius:6px;background:rgba(255,255,255,.12);overflow:hidden}
.wk-prog i em{display:block;height:100%;background:linear-gradient(90deg,#2e9b5c,#6fcf8e);border-radius:6px;transition:width .4s}
@media (max-width:880px){.wk-view .dash-banner{padding:4px 18px 20px}}
@media (max-width:760px){.wk-ban{flex-direction:column;align-items:flex-start}.wk-ban h1{font-size:26px}.wk-ban-r{align-items:flex-start}.wk-ban-r .ms-paste{align-self:flex-start}.wk-prog,.wk-src{display:none}.wk-view .content-wrap{padding:12px 12px 24px}}

/* ===== yhteiset palat ===== */
.wk-c-blue{--tc:var(--acc-d,#2f5fa8);--tb:var(--acc-t,#eef3fb)}.wk-c-amber{--tc:#8f600a;--tb:#fff8ec}.wk-c-red{--tc:#c43d35;--tb:#fdeceb}.wk-c-violet{--tc:#6b4fb5;--tb:#f1edfa}.wk-c-green{--tc:#1f7a45;--tb:#eaf6ec}
html[data-theme="dark"] .wk-c-blue{--tc:#8fb4e8;--tb:rgba(var(--acc-rgb,59,111,209),.16)}html[data-theme="dark"] .wk-c-amber{--tc:#f0c36a;--tb:rgba(224,169,46,.12)}html[data-theme="dark"] .wk-c-red{--tc:#ff8a7e;--tb:rgba(224,69,60,.16)}html[data-theme="dark"] .wk-c-violet{--tc:#b9a4f0;--tb:rgba(107,79,181,.2)}html[data-theme="dark"] .wk-c-green{--tc:#6fcf8e;--tb:rgba(46,155,92,.16)}
.wk-lbl{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wk-dim);margin-bottom:8px}
.wk-lbl em{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--wk-mut);margin-left:2px}
.dr-notes{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.dr-notes .hint{font-size:12.5px;color:var(--wk-mut);margin:0}
.dr-note{background:#f7f9fc;border-radius:12px;padding:10px 12px}
html[data-theme="dark"] .dr-note{background:var(--wk-inner)}
.dr-note-h{display:flex;align-items:center;gap:8px}
.dr-note-h b{font-size:12.5px;color:var(--wk-ink)}
.dr-note-h span{font-size:11px;color:var(--wk-mut)}
.dr-note-h button{margin-left:auto;display:flex;border:0;background:transparent;padding:2px;cursor:pointer;color:var(--wk-mut)}
.dr-note-h button svg{width:11px;height:11px}
.dr-note-h button:hover{color:var(--wk-body)}
.dr-note p{margin:4px 0 0;font-size:13px;line-height:1.5;color:var(--wk-body);white-space:pre-wrap;overflow-wrap:anywhere}
.dr-note-add{display:flex;gap:8px;align-items:flex-end}
.dr-note-add textarea{flex:1;min-height:44px;resize:vertical;border:1px solid var(--wk-line-2);border-radius:11px;padding:8px 12px;font:inherit;font-size:13px;color:var(--wk-ink);background:var(--wk-card)}
.dr-note-add button{border:1px solid var(--wk-line-2);background:var(--wk-btn2);border-radius:999px;padding:8px 14px;font:inherit;font-size:12.5px;font-weight:600;color:var(--wk-body);cursor:pointer;white-space:nowrap}
.dr-note-add button:hover{border-color:#b9cbe8;color:var(--wk-link)}
.wk-lbl svg{width:13px;height:13px;stroke-width:2}
.wk-search{position:relative;display:flex;align-items:center}
.wk-search>svg{position:absolute;left:12px;width:15px;height:15px;color:var(--wk-dim);stroke-width:2;pointer-events:none}
.wk-search input{width:100%;height:40px;border:1px solid var(--wk-line-2);border-radius:11px;padding:0 36px 0 36px;font:inherit;font-size:13.5px;background:var(--wk-field);color:var(--wk-ink);outline:none;-webkit-appearance:none;appearance:none}
.wk-search input::-webkit-search-cancel-button{display:none}
.wk-search input::placeholder{color:var(--wk-dim)}
.wk-search input:focus{border-color:var(--wk-brand);box-shadow:0 0 0 3px rgba(var(--acc-d-rgb,47,95,168),.12)}
.wk-search button{position:absolute;right:6px;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:var(--wk-mut);display:grid;place-items:center;cursor:pointer}
.wk-search button svg{width:14px;height:14px;stroke-width:2}
.wk-seg{display:flex;gap:4px;background:#eef1f5;border-radius:11px;padding:3px;overflow-x:auto;scrollbar-width:none}
.wk-seg::-webkit-scrollbar{display:none}
html[data-theme="dark"] .wk-seg{background:rgba(255,255,255,.05)}
.wk-seg button{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:4px;border:0;background:transparent;border-radius:8px;height:32px;padding:0 6px;font:inherit;font-size:12.5px;font-weight:700;color:var(--wk-mut);cursor:pointer;white-space:nowrap;transition:background-color .15s}
.wk-seg button:not(.on):hover{background-color:var(--hv-row);color:var(--wk-ink)}
.wk-seg button em{font-style:normal;font-size:11px;color:var(--wk-dim)}
.wk-seg button.on{background:var(--wk-panel);color:var(--wk-ink);box-shadow:0 1px 3px rgba(16,24,40,.12)}
html[data-theme="dark"] .wk-seg button.on{background:#1b2336;box-shadow:none}
.wk-seg button.on em{color:var(--wk-link)}
.wk-none{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:26px 14px;border:1px dashed var(--wk-line-2);border-radius:14px;color:var(--wk-mut);font-size:12.5px}
.wk-none svg{width:20px;height:20px;color:var(--wk-dim);margin-bottom:4px}.wk-none b{color:var(--wk-ink);font-size:14px}
.wk-empty{text-align:center;background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;padding:60px 20px;box-shadow:var(--wk-shadow)}
.wk-ei{width:64px;height:64px;border-radius:50%;margin:0 auto 14px;background:var(--wk-green-t);color:var(--wk-green);display:flex;align-items:center;justify-content:center}
.wk-ei svg{width:30px;height:30px;stroke-width:2}
.wk-empty h2{font-family:var(--font-heading);font-weight:600;font-size:24px;margin:0 0 6px;color:var(--wk-ink)}
.wk-empty p{margin:0 auto 18px;color:var(--wk-mut);font-size:14px;max-width:460px}
.wk-empty-act{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.wk-btn2{border:1px solid #c9d6ea;background:var(--wk-btn2);color:var(--wk-link);border-radius:11px;height:40px;padding:0 16px;font:inherit;font-weight:700;cursor:pointer}
html[data-theme="dark"] .wk-btn2{border-color:var(--wk-btn2-line)}

/* ===== Luonnokset ===== */
.dr-body{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px;align-items:start}
.dr-body>.wk-empty{grid-column:1/-1}
.dr-q{display:flex;flex-direction:column;gap:10px;position:sticky;top:14px;min-width:0}
.dr-qh{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--wk-dim);padding:0 4px}
.dr-list{display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 220px);overflow-y:auto;padding:2px;margin:-2px}
.dr-it{position:relative;display:flex;gap:12px;text-align:left;width:100%;font:inherit;background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:14px;padding:13px 14px;cursor:pointer;transition:border-color .15s,box-shadow .15s;color:var(--wk-ink)}
.dr-it:hover{border-color:#cfdbee}
html[data-theme="dark"] .dr-it:hover{border-color:rgba(var(--acc-m-rgb,111,160,224),.35)}
.dr-it.on{border-color:var(--wk-brand);box-shadow:0 0 0 1px var(--wk-brand),0 14px 30px -20px rgba(var(--acc-d-rgb,47,95,168),.7)}
.dr-ic{width:36px;height:36px;border-radius:11px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--tb);color:var(--tc)}
.dr-ic svg{width:16px;height:16px;stroke-width:2}
.dr-t{flex:1;min-width:0}
.dr-ty{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;font-weight:700;color:var(--tc)}
.dr-ty span{color:var(--wk-dim);font-weight:600;white-space:nowrap}
.dr-it b{display:block;font-size:14px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-pv{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dr-it.late{border-color:rgba(224,69,60,.35)}
.dr-late{display:inline-flex;align-items:center;gap:4px;color:var(--wk-red);font-weight:700}
.dr-late svg{width:11px;height:11px}
.dr-it.out{animation:drOut .3s ease forwards}
@keyframes drOut{to{opacity:0;transform:translateX(-20px)}}
.dr-dd{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;box-shadow:var(--wk-shadow);overflow:hidden;min-width:0}
.dr-dd0{padding:40px;text-align:center;color:var(--wk-mut)}
.dr-ddh{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--wk-line)}
.dr-ddh .dr-ic{width:40px;height:40px;border-radius:12px}
.dr-ddh .dr-ic svg{width:18px;height:18px}
.dr-ddh>div{min-width:0;flex:1}
.dr-ddh h2{margin:0;font-size:17px;color:var(--wk-ink);overflow-wrap:anywhere}
.dr-ddh p{margin:2px 0 0;font-size:13px;color:var(--wk-mut)}
.dr-tps{margin-left:auto;display:flex;align-items:center;gap:6px;flex-shrink:0}
.dr-tp{font-size:12px;font-weight:700;color:var(--tc);background:var(--tb);border-radius:999px;padding:4px 11px;white-space:nowrap}
.dr-tp.late{display:inline-flex;align-items:center;gap:5px;color:var(--wk-red);background:var(--wk-red-t)}
.dr-tp.late svg{width:12px;height:12px}
.dr-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 20px;border-bottom:1px solid var(--wk-line)}
.dr-tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dr-tag{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;color:var(--wk-body);background:#f1f5fb;border-radius:999px;padding:4px 6px 4px 10px}
html[data-theme="dark"] .dr-tag{background:var(--wk-inner)}
.dr-tag button{display:flex;border:0;background:transparent;padding:2px;cursor:pointer;color:var(--wk-mut)}
.dr-tag button svg{width:11px;height:11px}
.dr-tag button:hover{color:var(--wk-body)}
.dr-tagbtn{border:1px dashed var(--wk-line-2);background:transparent;border-radius:999px;padding:4px 10px;font:inherit;font-size:12px;font-weight:600;color:var(--wk-dim);cursor:pointer}
.dr-tagbtn:hover{border-color:#b9cbe8;color:var(--wk-link)}
.dr-tagadd{display:inline-flex;align-items:center;gap:6px}
.dr-tagadd input{border:1px solid var(--wk-line-2);border-radius:999px;padding:4px 10px;font:inherit;font-size:12px;width:120px}
.dr-tagadd button{border:1px solid var(--wk-line-2);background:var(--wk-btn2);border-radius:999px;padding:4px 10px;font:inherit;font-size:12px;font-weight:600;color:var(--wk-body);cursor:pointer}
.dr-assign{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--wk-dim)}
.dr-assign svg{width:14px;height:14px;color:var(--wk-link)}
.dr-assign select{border:1px solid var(--wk-line-2);border-radius:999px;padding:4px 10px;font:inherit;font-size:12px;color:var(--wk-body);background:var(--wk-btn2)}
.dr-ddb{padding:18px 20px;display:flex;flex-direction:column;gap:16px}
.dr-orig{background:#f7f9fc;border-radius:14px;padding:12px 14px;font-size:13.5px;line-height:1.55;color:var(--wk-body);white-space:pre-wrap;overflow-wrap:anywhere;max-height:260px;overflow-y:auto}
html[data-theme="dark"] .dr-orig{background:var(--wk-inner)}
.dr-ans{border:1.5px solid #dfe8f7;border-radius:14px;background:var(--wk-field);transition:border-color .15s}
html[data-theme="dark"] .dr-ans{border-color:var(--wk-field-line)}
.dr-ans:focus-within{border-color:var(--wk-brand);box-shadow:0 0 0 4px rgba(var(--acc-d-rgb,47,95,168),.1)}
.dr-tx{display:block;width:100%;min-height:160px;border:0;background:transparent;resize:vertical;padding:14px 16px;font:inherit;font-size:14px;line-height:1.65;color:var(--wk-ink);outline:none}
.dr-tx[aria-busy="true"]{opacity:.55}
.dr-att{display:flex;align-items:center;gap:10px;margin:0 16px 14px;padding:10px 12px;border:1px solid var(--wk-line-2);border-radius:11px;background:var(--wk-card);font-size:13px}
.dr-ai{width:32px;height:38px;border-radius:6px;background:var(--wk-amber-t);color:var(--wk-amber);font-size:14px;font-weight:800;display:flex;align-items:center;justify-content:center}
.dr-att b{display:block;color:var(--wk-ink)}.dr-att span{display:block;font-size:12px;color:var(--wk-mut)}
.dr-ask{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:10px 16px;border-top:1px solid var(--wk-line);background:var(--wk-card);border-radius:0 0 14px 14px}
.dr-ask>span{font-size:12px;font-weight:600;color:var(--wk-dim);margin-right:2px;display:flex;align-items:center;gap:5px}
.dr-ask>span svg{width:12px;height:12px;color:var(--wk-link)}
.dr-ask button{border:1px solid var(--wk-line-2);background:var(--wk-btn2);border-radius:999px;padding:5px 11px;font:inherit;font-size:12px;font-weight:600;color:var(--wk-body);cursor:pointer}
.dr-ask button:hover:not(:disabled){border-color:#b9cbe8;color:var(--wk-link)}
.dr-ask button:disabled{opacity:.6;cursor:progress}
.dr-alts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:10px 16px;border-top:1px solid var(--wk-line);background:var(--wk-card)}
.dr-alts>span{font-size:12px;font-weight:600;color:var(--wk-dim);margin-right:2px;display:flex;align-items:center;gap:5px}
.dr-alts>span svg{width:12px;height:12px;color:var(--wk-link)}
.dr-alts button{border:1px solid var(--wk-line-2);background:var(--wk-btn2);border-radius:999px;padding:5px 11px;font:inherit;font-size:12px;font-weight:600;color:var(--wk-body);cursor:pointer}
.dr-alts button:hover{border-color:#b9cbe8;color:var(--wk-link)}
.dr-alts select{border:1px solid var(--wk-line-2);background:var(--wk-btn2);border-radius:999px;padding:5px 11px;font:inherit;font-size:12px;font-weight:600;color:var(--wk-body);cursor:pointer}
.dr-why{display:flex;flex-wrap:wrap;gap:6px}
.dr-why span{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--wk-body);background:#f1f5fb;border-radius:999px;padding:4px 10px}
html[data-theme="dark"] .dr-why span{background:var(--wk-tint)}
.dr-why span svg{width:12px;height:12px;color:var(--wk-link);stroke-width:2}
.dr-why span.w{background:var(--wk-amber-t);color:#8a5d0c}.dr-why span.w svg{color:var(--wk-amber)}
html[data-theme="dark"] .dr-why span.w{color:var(--wk-amber)}
.dr-act{display:flex;align-items:center;gap:10px;padding:14px 20px;border-top:1px solid var(--wk-line);background:var(--wk-card)}
.dr-to{font-size:12.5px;color:var(--wk-mut);margin-right:auto;display:flex;align-items:center;gap:6px;min-width:0}
.dr-to svg{width:13px;height:13px;flex-shrink:0}
.dr-to b{color:var(--wk-ink);overflow-wrap:anywhere}
.dr-act button{height:42px;border-radius:11px;font:inherit;font-size:13.5px;font-weight:700;display:flex;align-items:center;gap:7px;padding:0 16px;cursor:pointer;white-space:nowrap}
.dr-act button svg{width:15px;height:15px;stroke-width:2.2}
.dr-rj{border:1px solid var(--wk-btn2-line);background:var(--wk-btn2);color:var(--wk-mut)}
.dr-rj:hover{color:var(--wk-red);border-color:#f3cfcc}
.dr-ok{border:0;background:#1f7a45;color:#fff;padding:0 22px!important;box-shadow:0 10px 20px -12px rgba(46,155,92,.9)}
.dr-ok:hover{background:#196a3b}
.dr-hist{border:1px solid var(--wk-line);border-radius:14px;background:var(--wk-panel);padding:4px 12px;font-size:13px;color:var(--wk-mut)}
.dr-hist summary{cursor:pointer;padding:8px 0;font-weight:600}
.dr-hrow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--wk-line)}
.dr-hrow>span:first-child{min-width:0}
.dr-hrow b{display:block;color:var(--wk-ink);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-hrow small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-hrow .status-tag{flex-shrink:0}
.dr-body>.dr-hist{grid-column:1/-1}
@media (max-width:1100px){.dr-body{grid-template-columns:minmax(0,1fr)}.dr-q{position:static}.dr-list{max-height:none}}
@media (max-width:760px){.dr-act{flex-wrap:wrap}.dr-to{width:100%;margin-bottom:4px}.dr-act button{flex:1;justify-content:center;padding:0 10px}.dr-rj{flex:0 0 auto!important}.dr-ddh{flex-wrap:wrap}.dr-tps{margin-left:0}.dr-ddb,.dr-ddh,.dr-act{padding-left:14px;padding-right:14px}}

/* ===== Viestit ===== */
.ms-chs{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
/* Liitä viesti (Gmail- tai Outlook-yhteyttä ei ole): näkyy myös puhelimessa, toisin kuin kanavalista. */
.ms-paste{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13px;font-weight:700;color:#16202e;background:#fff;border:0;border-radius:99px;padding:8px 14px;cursor:pointer;align-self:flex-end;transition:filter .15s,box-shadow .15s,transform .15s}
.ms-paste:hover{filter:brightness(.93);box-shadow:0 10px 20px -12px rgba(0,0,0,.55);transform:translateY(-1px)}
.ms-paste svg{width:14px;height:14px}
.ms-mt0 .ms-mt0p{display:block;margin:10px auto 14px;max-width:360px}
.ms-mt0 .primary-btn{display:inline-flex;align-items:center;gap:6px}
.ms-mt0 .primary-btn svg{width:14px;height:14px}
.ms-chp{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12px;color:rgba(244,246,250,.8);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:3px 10px}
.ms-chp i{width:7px;height:7px;border-radius:50%;background:#6fcf8e;box-shadow:0 0 0 3px rgba(111,207,142,.2)}
.ms-chp.off{cursor:pointer;color:#f0c36a;border-color:rgba(240,195,106,.4)}
.ms-stat{display:flex;gap:10px}
.ms-st{min-width:150px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);border-radius:14px;padding:11px 14px;text-align:left;font:inherit;color:#fff;cursor:pointer}
.ms-st:hover,.ms-st:focus-visible{background:rgba(255,255,255,.12)}
.ms-st span{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:rgba(244,246,250,.7)}
.ms-st span svg{width:13px;height:13px;color:var(--acc-l,#9dc0f2);stroke-width:2}
.ms-st b{display:block;font-family:var(--font-heading);font-weight:600;font-size:24px;margin-top:3px;color:#fff}
.ms-st.hot{border-color:rgba(240,195,106,.5);background:rgba(224,169,46,.14)}
.ms-st.hot span svg{color:#f0c36a}
.ms-body{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px;align-items:start}
.ms-l{display:flex;flex-direction:column;gap:10px;position:sticky;top:14px;min-width:0}
.ms-list{display:flex;flex-direction:column;background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:16px;overflow:hidden;max-height:calc(100vh - 230px);overflow-y:auto}
.ms-none{border:0}
.ms-none-b{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:11px 18px;border:0;border-radius:10px;background:var(--wk-brand);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:filter .15s}
.ms-none-b svg{width:15px;height:15px;color:#fff;margin:0}
.ms-none-b:hover,.ms-none-b:focus-visible{filter:var(--hv-f)}
.ms-it{position:relative;display:flex;gap:12px;text-align:left;width:100%;font:inherit;background:var(--wk-panel);border:0;border-bottom:1px solid var(--wk-line);padding:13px 14px;cursor:pointer;color:var(--wk-ink);transition:background .12s}
.ms-it:last-child{border-bottom:0}
.ms-it:hover{background:#f8fafd}
html[data-theme="dark"] .ms-it:hover{background:rgba(255,255,255,.03)}
.ms-it.on{background:var(--wk-tint)}
.ms-it.on::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--wk-brand)}
.ms-av{position:relative;width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;background:var(--wk-av)!important}
.ms-chb{position:absolute;right:-3px;bottom:-3px;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px var(--wk-panel);color:#fff}
.ms-chb svg{width:10px;height:10px;stroke-width:2.2}
.ms-chb.w{background:#2e9b5c}.ms-chb.m{background:var(--acc-d,#2f5fa8)}.ms-chb.t{background:#5b5fc7}.ms-chb.s{background:#b27a12}.ms-chb.i{background:#c43d8f}.ms-chb.f{background:#0866ff}
.ms-t{flex:1;min-width:0}
.ms-r1{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.ms-r1 b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-r1 span{font-size:11.5px;color:var(--wk-dim);white-space:nowrap}
.ms-sb{display:block;font-size:13px;font-weight:600;color:var(--wk-body);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-pv{display:block;font-size:12.5px;color:var(--wk-dim);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-it.unread .ms-r1 b,.ms-it.unread .ms-sb{color:var(--wk-ink);font-weight:800}
.ms-it.unread .ms-r1 span{color:var(--wk-link);font-weight:700}
.ms-dot{position:absolute;right:14px;bottom:16px;width:8px;height:8px;border-radius:50%;background:var(--wk-brand)}
.ms-st2{display:inline-flex;align-items:center;gap:4px;margin-top:6px;font-size:11px;font-weight:700;border-radius:999px;padding:2px 8px}
.ms-st2 svg{width:10px;height:10px;stroke-width:2.2}
.ms-st2.need{background:var(--wk-amber-t);color:var(--wk-amber-ink)}.ms-st2.draft{background:var(--wk-tint);color:var(--wk-link)}.ms-st2.done{background:var(--wk-green-t);color:var(--wk-green-ink)}.ms-st2.skip,.ms-st2.team{background:#f1f3f7;color:var(--wk-dim)}
html[data-theme="dark"] .ms-st2.need{color:var(--wk-amber)}html[data-theme="dark"] :is(.ms-st2.skip,.ms-st2.team){background:rgba(255,255,255,.06)}
.ms-mt{display:flex;flex-direction:column;background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;box-shadow:var(--wk-shadow);overflow:hidden;min-height:560px;min-width:0}
.ms-mt0{align-items:center;justify-content:center;color:var(--wk-dim);padding:40px;text-align:center}
.ms-mth{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--wk-line)}
.ms-mth .ms-av{flex-shrink:0}
.ms-who{min-width:0}
.ms-mth h2{margin:0;font-size:17px;color:var(--wk-ink);overflow-wrap:anywhere}
.ms-mth p{margin:2px 0 0;font-size:12.5px;color:var(--wk-mut);display:flex;align-items:center;gap:6px;overflow-wrap:anywhere}
.ms-mth p svg{width:13px;height:13px;flex-shrink:0}
.ms-mth p .ms-whoh{margin-left:-6px;min-width:0}
.ms-lk{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.ms-lkc{display:inline-flex;align-items:center;gap:5px;font:inherit;font-size:12px;font-weight:700;color:var(--wk-link);background:var(--wk-tint);border:1px solid var(--acc-bd,#e0e8f5);border-radius:9px;padding:5px 9px;cursor:pointer;white-space:nowrap;text-decoration:none;transition:box-shadow .15s}
.ms-lkc:hover{box-shadow:inset 0 0 0 1px var(--hv-ring)}
html[data-theme="dark"] .ms-lkc{border-color:rgba(var(--acc-m-rgb,111,160,224),.25)}
.ms-lkc svg{width:12px;height:12px;stroke-width:2}
.ms-ban{display:flex;gap:10px;align-items:center;margin:14px 18px 0;padding:11px 13px;border-radius:12px;font-size:13px;line-height:1.45}
.ms-ban>svg{width:15px;height:15px;flex-shrink:0;stroke-width:2}
.ms-ban>div{flex:1;min-width:0;overflow-wrap:anywhere}.ms-ban b{display:block}
.ms-ban button,.ms-lnk{flex-shrink:0;height:34px;border-radius:9px;padding:0 12px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px;text-decoration:none}
.ms-ban button svg{width:13px;height:13px;stroke-width:2}
.ms-ban button:disabled{opacity:.6;cursor:progress}
.ms-ban.need{background:var(--wk-amber-t);border:1px solid #f6e3bf;color:#5c4210}.ms-ban.need>svg{color:var(--wk-amber)}
/* Hionta 19.10.2026: painettava nappi on sininen kuten muut (rauhalliset värit), ei musta */
.ms-ban.need button{border:0;background:var(--acc-d,#2f5fa8);color:#fff}
.ms-ban.need.fail{background:var(--wk-red-t);border-color:rgba(224,69,60,.25);color:#7a241d}.ms-ban.need.fail>svg{color:var(--wk-red)}
.ms-bub.mine.failed{opacity:.85}.ms-bub.mine.failed .ms-aib{background:var(--wk-red);color:#fff}.ms-bub.mine.uncertain .ms-aib{background:var(--wk-amber-t);color:var(--wk-amber-ink)}
.ms-ban.draft{background:#f1f5fb;border:1px solid #dfe8f7;color:#2f3d55}.ms-ban.draft>svg{color:var(--wk-link)}
.ms-ban.draft button{border:0;background:var(--acc-d,#2f5fa8);color:#fff}
.ms-ban.draft.complaint{background:var(--wk-red-t);border-color:rgba(224,69,60,.25);color:#7a241d}.ms-ban.draft.complaint>svg{color:var(--wk-red)}
.ms-ban.draft.complaint button{background:var(--wk-red)}
.ms-ban.done{background:#f1f9f3;border:1px solid #cfe9d7;color:#2c5a3d}.ms-ban.done>svg{color:var(--wk-green)}
.ms-ban.skip{background:#f7f8fa;border:1px solid #eceff3;color:var(--wk-mut)}
.ms-ban.skip button,.ms-lnk{border:1px solid #dfe3ea;background:var(--wk-btn2);color:var(--wk-body)}
.ms-lead{display:flex;gap:8px;align-items:flex-start;margin:8px 18px 0;padding:9px 12px;border-radius:10px;background:#f1f5fb;border:1px solid #dfe8f7;color:#2f3d55;font-size:12.5px;line-height:1.4}
.ms-lead svg{width:14px;height:14px;flex-shrink:0;margin-top:1px;stroke-width:2;color:var(--wk-link)}
html[data-theme="dark"] .ms-lead{background:var(--wk-tint);border-color:rgba(var(--acc-m-rgb,111,160,224),.25);color:#c9d8f0}
.ms-lead.warn{background:var(--wk-amber-t);border-color:#f6e3bf;color:#5c4210}.ms-lead.warn svg{color:var(--wk-amber)}
html[data-theme="dark"] .ms-lead.warn{background:var(--wk-amber-t);border-color:rgba(240,195,106,.25);color:#f3dfb5}
html[data-theme="dark"] .ms-ban.need{border-color:rgba(240,195,106,.25);color:#f3dfb5}
html[data-theme="dark"] .ms-ban.need button{background:var(--acc,#3b6fd1);color:#fff}
html[data-theme="dark"] .ms-ban.need.fail{border-color:rgba(224,69,60,.3);color:#f3c4bf}
html[data-theme="dark"] .ms-ban.draft{background:var(--wk-tint);border-color:rgba(var(--acc-m-rgb,111,160,224),.25);color:#c9d8f0}
html[data-theme="dark"] .ms-ban.draft button{background:var(--acc,#3b6fd1)}
html[data-theme="dark"] .ms-ban.done{background:var(--wk-green-t);border-color:rgba(111,207,142,.25);color:#bfe8cc}
html[data-theme="dark"] .ms-ban.skip{background:rgba(255,255,255,.04);border-color:var(--wk-line-2)}
html[data-theme="dark"] :is(.ms-ban.skip button,.ms-lnk){border-color:var(--wk-btn2-line)}
.ms-thr{flex:1;display:flex;flex-direction:column;gap:12px;padding:18px;overflow-y:auto;max-height:520px;background:linear-gradient(180deg,var(--wk-panel),var(--wk-card))}
.ms-empty-thr{margin:auto;color:var(--wk-dim);font-size:13px}
.ms-day{align-self:center;font-size:11.5px;font-weight:700;color:var(--wk-dim);letter-spacing:.04em}
.ms-bub{max-width:72%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.ms-bub small{display:block;margin-top:4px;font-size:11px;opacity:.65;text-align:right}
.ms-bub.c{align-self:flex-start;background:#f1f3f7;color:var(--wk-ink);border-bottom-left-radius:4px}
html[data-theme="dark"] .ms-bub.c{background:var(--wk-inner)}
/* Puhelinvastaajan äänite asiakkaan viestin alla; poistuu, kun viesti on käsitelty. */
.ms-audio{display:flex;flex-direction:column;gap:4px;margin-top:8px;white-space:normal}
.ms-audio span{font-size:11px;opacity:.7}
.ms-audio audio{width:100%;max-width:280px;height:34px}
.ms-bub.mine{align-self:flex-end;background:var(--acc-d,#2f5fa8);color:#fff;border-bottom-right-radius:4px}
/* Ainion luonnos -merkki omalle rivilleen viestin yläpuolelle, ei tekstin viereen. */
.ms-aib{display:flex;width:fit-content;align-items:center;gap:4px;font-size:10.5px;font-weight:700;background:rgba(255,255,255,.2);color:#fff;border-radius:999px;padding:1px 8px;margin-bottom:8px;white-space:nowrap}
.ms-aib svg{width:10px;height:10px;stroke-width:2.2}
.ms-aev{align-self:center;display:inline-flex;align-items:center;gap:6px;max-width:85%;font-size:12px;color:var(--wk-body);background:var(--wk-panel);border:1px dashed #cfdbee;border-radius:999px;padding:5px 12px;text-align:center}
html[data-theme="dark"] .ms-aev{border-color:rgba(var(--acc-m-rgb,111,160,224),.35)}
.ms-aev svg{width:12px;height:12px;color:var(--wk-link);flex-shrink:0}
.ms-comp{border-top:1px solid var(--wk-line);padding:12px 16px 14px;background:var(--wk-panel)}
.ms-ct{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--wk-mut);margin-bottom:8px}
.ms-ct svg{width:12px;height:12px}
.ms-ct b{color:var(--wk-ink)}
.ms-box{display:flex;align-items:flex-end;gap:8px;border:1.5px solid var(--wk-line-2);border-radius:14px;padding:8px 8px 8px 14px;background:var(--wk-field);transition:border-color .15s}
.ms-box:focus-within{border-color:var(--wk-brand);box-shadow:0 0 0 4px rgba(var(--acc-d-rgb,47,95,168),.1)}
.ms-box textarea{flex:1;min-width:0;border:0;outline:none;resize:none;font:inherit;font-size:14px;line-height:1.5;min-height:42px;max-height:160px;padding:4px 0;color:var(--wk-ink);background:transparent}
.ms-box button{height:38px;border-radius:10px;font:inherit;font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;padding:0 12px;cursor:pointer;white-space:nowrap}
.ms-box button svg{width:14px;height:14px;stroke-width:2}
.ms-ai{border:1px solid #dfe8f7;background:var(--wk-tint);color:var(--wk-link);transition:box-shadow .15s}
.ms-ai:hover{box-shadow:inset 0 0 0 1px var(--hv-ring)}
html[data-theme="dark"] .ms-ai{border-color:rgba(var(--acc-m-rgb,111,160,224),.25)}
.ms-snd{border:0;background:var(--acc-d,#2f5fa8);color:#fff}
.ms-snd:disabled{background:#dde5f1;color:#4f5d75;cursor:default}
html[data-theme="dark"] .ms-snd:disabled{background:rgba(var(--acc-rgb,59,111,209),.3);color:rgba(255,255,255,.5)}
.ms-note{margin:8px 0 0;font-size:12px;color:var(--wk-dim)}
/* Tekstiviestin osat (dist/messages.js msSmsShow): laskuri ja Siisti merkit -nappi luonnoksen ja vastauskentän alla. */
.ms-smsc{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:6px 0 0;font-size:12px;color:var(--wk-dim)}
.ms-smsc[hidden]{display:none}
.ms-smsc button{border:1px solid var(--wk-line-2);background:var(--wk-btn2);color:var(--wk-ink);font:inherit;font-size:12px;font-weight:700;border-radius:8px;padding:3px 9px;cursor:pointer}
.ms-smsc button[hidden]{display:none}
@media (max-width:1280px){.ms-st{min-width:0}}
@media (max-width:1100px){.ms-body{grid-template-columns:minmax(0,1fr)}.ms-l{position:static}.ms-list{max-height:420px}.ms-stat{display:none}}
@media (max-width:760px){.ms-chs{display:none}.ms-mth{flex-wrap:wrap}.ms-lk{margin-left:0;justify-content:flex-start;width:100%}.ms-bub{max-width:88%}.ms-ban{flex-wrap:wrap}.ms-ban>div{flex:1 1 calc(100% - 30px)}.ms-ban button,.ms-ban .ms-lnk{width:100%;justify-content:center}.ms-box{flex-wrap:wrap}.ms-box textarea{width:100%;flex-basis:100%}.ms-box button{flex:1;justify-content:center}.ms-mt{min-height:0}}

/* ===== sivupaneeli (tarjous, keikka) ===== */
.wk-pscrim{position:fixed;inset:0;background:rgba(13,17,25,.38);opacity:0;transition:opacity .2s;z-index:60}
.wk-pscrim.on{opacity:1}
.wk-panel{position:fixed;top:0;right:0;bottom:0;width:480px;max-width:100vw;background:#f7f9fc;box-shadow:-24px 0 60px -20px rgba(9,14,26,.5);transform:translateX(105%);transition:transform .26s cubic-bezier(.2,.8,.2,1);z-index:61;display:flex;flex-direction:column;outline:none;color:var(--wk-ink)}
html[data-theme="dark"] .wk-panel{background:#0f1523}
.wk-panel.on{transform:none}
.wk-ph{position:relative;overflow:hidden;padding:20px 22px 18px;color:#fff;background:linear-gradient(128deg,#0d1119 0%,#182644 55%,#2f5fa8 100%);flex-shrink:0}
.wk-phg{position:absolute;width:320px;height:320px;right:-120px;top:-180px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--acc-m-rgb,111,160,224),.35),transparent);pointer-events:none}
.wk-ph>*:not(.wk-phg){position:relative}
.wk-ptop{display:flex;justify-content:space-between;align-items:center;gap:10px}
.wk-pwhen{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12.5px;font-weight:700;color:var(--acc-l,#9dc0f2)}
.wk-pwhen svg{width:15px;height:15px;stroke-width:2}
/* Etusivulta avattu tapahtuma (dist/calendar.js calOpenEvent o.toCalendar): linkki viikkonäkymään. */
.cal-tocal{display:inline-flex;align-items:center;min-height:44px;margin:2px 0 -8px;padding:0;border:0;background:none;color:var(--acc-l,#9dc0f2);font:inherit;font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cal-tocal:hover{color:#fff}
.wk-px{width:32px;height:32px;flex-shrink:0;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}
.wk-px:hover{background:rgba(255,255,255,.18)}
.wk-px svg{width:15px;height:15px;stroke-width:2}
.wk-ph h2{font-family:var(--font-heading);font-weight:600;font-size:26px;margin:10px 0 2px;color:#fff;overflow-wrap:anywhere}
.wk-pc{font-size:14px;color:rgba(244,246,250,.8)}
.wk-pact{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.wk-pact a{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 6px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#fff;font-size:12px;font-weight:700;text-decoration:none;cursor:pointer}
.wk-pact a:hover{background:rgba(255,255,255,.14)}
.wk-pact a.off{opacity:.45;cursor:default}
.wk-pact svg{color:var(--acc-l,#9dc0f2);stroke-width:2}
.wk-pb{flex:1;overflow-y:auto;padding:16px 16px 20px;display:flex;flex-direction:column;gap:12px}
/* Kutistunut yläbanneri (dist/work.js wkPanelMini): yksi rivi, jossa otsikko, toimintonapit kuvakkeina ja sulkurasti. */
.wk-panel.wk-mini .wk-ph{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:12px 16px 12px 22px}
.wk-panel.wk-mini .wk-phg,.wk-panel.wk-mini .wk-pwhen,.wk-panel.wk-mini .wk-pc{display:none}
.wk-panel.wk-mini .wk-ptop{display:contents}
.wk-panel.wk-mini .wk-ph h2{grid-column:1;grid-row:1;margin:0;font-size:17px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
.wk-panel.wk-mini .wk-pact{grid-column:2;grid-row:1;display:flex;gap:6px;margin:0}
.wk-panel.wk-mini .wk-pact a{width:40px;height:40px;padding:0;gap:0;font-size:0;justify-content:center;border-radius:10px}
.wk-panel.wk-mini .wk-pact svg{width:18px;height:18px}
.wk-panel.wk-mini .wk-px{grid-column:3;grid-row:1}
.wk-pcard{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:14px;padding:14px 16px}
.wk-pcard h4{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wk-dim)}
.wk-pcard h4 svg{width:13px;height:13px;stroke-width:2}
.wk-pf{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--wk-line-2);background:var(--wk-panel);flex-shrink:0}
.wk-pf button{flex:1;height:42px;border-radius:11px;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px}
.wk-pf button svg{width:15px;height:15px;stroke-width:2}
.wk-pf .b1{background:var(--wk-btn2);border:1px solid var(--wk-btn2-line);color:var(--wk-ink);transition:filter .15s}
.wk-pf .b1:hover:not(:disabled){filter:var(--hv-f)}
.wk-pf .b2{background:var(--acc-d,#2f5fa8);border:1px solid var(--acc-d,#2f5fa8);color:#fff;transition:filter .15s,box-shadow .15s,transform .15s}
.wk-pf .b2:hover:not(:disabled){filter:brightness(1.1);box-shadow:0 10px 20px -12px rgba(var(--acc-d-rgb,47,95,168),.95);transform:translateY(-1px)}
/* Tukkulista kuvana (6.10.2026): esikatselu ennen tallennusta, kuva piirretään puhelimessa. */
.wk-pf .tk-imgb{flex:1.4}
.tk-imgd{position:fixed;inset:0;z-index:10000;background:var(--wk-scrim);display:flex;align-items:center;justify-content:center;padding:16px}
.tk-imgb2{background:var(--wk-panel);color:var(--wk-ink);border-radius:18px;max-width:440px;width:100%;max-height:calc(100vh - 32px);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--wk-shadow-lg)}
.tk-imgh{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--wk-line-2);font-size:16px}
.tk-imgx{border:0;background:var(--wk-card);color:var(--wk-ink);width:36px;height:36px;border-radius:50%;cursor:pointer;display:grid;place-items:center}
.tk-imgx svg{width:16px;height:16px;stroke-width:2}
.tk-imgv{overflow:auto;padding:14px 16px;background:var(--wk-card);flex:1;min-height:0}
.tk-imgv img{display:block;width:100%;border-radius:10px;box-shadow:0 4px 14px rgba(0,0,0,.12)}
.tk-imgv img+.tk-imgp,.tk-imgv img+img{margin-top:14px}
.tk-imgp{font-size:12.5px;font-weight:700;color:var(--wk-mut);margin:0 0 6px;letter-spacing:.04em;text-transform:uppercase}
.tk-imgt{margin:0;padding:12px 16px 4px;font-size:13.5px;line-height:1.45;color:var(--wk-mut)}
.tk-imgf{padding:12px 16px 16px}
.tk-imgs{width:100%;height:50px;border:0;border-radius:12px;background:var(--acc-d,#2f5fa8);color:#fff;font:inherit;font-size:15.5px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}
.tk-imgs svg{width:18px;height:18px;stroke-width:2}
.wk-pf button:disabled{opacity:.6;cursor:progress}
@media (max-width:560px){.wk-panel{width:100vw}
 /* Puhelimella paneelin sulkurasti on sormen kokoinen, eikä yläosa silti kasva. */
 .wk-px{width:44px;height:44px;margin:-6px -6px -6px 0}.wk-px svg{width:18px;height:18px}
 .wk-panel.wk-mini .wk-ph{padding:10px 12px 10px 18px;gap:8px}.wk-panel.wk-mini .wk-pact a{width:42px;height:42px}.wk-panel.wk-mini .wk-px{margin:0}
 /* Alanapit saavat leveyden tekstinsä mukaan, joten pitkä nappi mahtuu yhdelle riville. */
 .wk-pf button{flex:1 1 auto;padding:0 8px}}
@media (max-width:380px){.wk-pf button{font-size:13px;padding:0 4px;gap:5px}}

/* ===== Tarjoukset ===== */
.of-hbtn{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.of-hb,.of-hb2{height:38px;display:flex;align-items:center;gap:7px;padding:0 14px;border-radius:11px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.of-hb svg,.of-hb2 svg{width:15px;height:15px;stroke-width:2}
.of-hb{border:0;background:#fff;color:#16202e;box-shadow:0 6px 16px -6px rgba(0,0,0,.4);transition:filter .15s,box-shadow .15s,transform .15s}
.of-hb:hover{filter:brightness(.93);box-shadow:0 10px 20px -12px rgba(0,0,0,.55);transform:translateY(-1px)}
.of-hb2{border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff}
.of-body{display:flex;flex-direction:column;gap:22px}
.of-gate{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:14px;background:var(--wk-panel);border:1px solid var(--wk-line);color:var(--wk-mut);font-size:13px}
.of-gate svg{width:15px;height:15px;color:var(--wk-link)}
.cal-gate{margin-top:12px;padding:10px 12px;font-size:12.5px;flex-wrap:wrap}
.of-gate button{border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--wk-link);cursor:pointer}
.of-bar{display:flex;gap:3px;height:44px;border-radius:10px;overflow:hidden}
.of-bar i{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 10px;font-style:normal;min-width:0;line-height:1.15}
.of-bar span{font-size:11.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.of-bar em{font-style:normal;font-size:10.5px;font-weight:600;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.of-bar .s1{background:#2e9b5c;color:#fff}.of-bar .s2{background:linear-gradient(90deg,#2f5fa8,var(--acc,#3b6fd1));color:#fff}.of-bar .s4{background:linear-gradient(90deg,#b27a12,#d9a441);color:#fff}
.of-bar .s3{background:repeating-linear-gradient(135deg,#eef1f5 0 5px,#f7f9fc 5px 10px);color:var(--wk-mut);border:1px dashed #cfd6e2;border-radius:0 10px 10px 0}
html[data-theme="dark"] .of-bar .s3{background:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 5px,rgba(255,255,255,.08) 5px 10px);border-color:var(--wk-line-2)}
.of-cdays{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.of-cdr{display:grid;grid-template-columns:18px minmax(200px,1fr) fit-content(60%);gap:10px;align-items:center;font-size:12.5px;color:var(--wk-body);padding:4px 0}
.of-cdr>span:first-of-type{min-width:0}
.of-cdr>svg{width:14px;height:14px;stroke-width:2}
.of-cdr b{color:var(--wk-ink);font-weight:700}
.of-when{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;min-width:0}
.of-cdr.lock>svg{color:var(--wk-link)}.of-cdr.ok>svg{color:var(--wk-green)}.of-cdr.no{opacity:.8}.of-cdr.no>svg{color:var(--wk-dim)}
.of-slot{display:inline-flex;align-items:center;gap:6px;background:var(--acc-t,#eef3fb);border:1px solid #dfe8f7;border-radius:9px;padding:4px 9px;font-size:12.5px;color:var(--acc-d,#2f5fa8);white-space:nowrap}
html[data-theme="dark"] .of-slot{background:var(--wk-tint);border-color:rgba(var(--acc-m-rgb,111,160,224),.25);color:#8fb4e8}
.of-slot svg{width:12px;height:12px;flex-shrink:0;stroke-width:2}
.of-slot b{color:var(--wk-ink);font-weight:700}
.of-slot i{font-style:normal;font-weight:700;padding-left:6px;border-left:1px solid #cfdcf0}
.of-slot.mv{background:#f1f3f7;border-color:#e6e9ef;color:var(--wk-mut);font-weight:600}
html[data-theme="dark"] .of-slot.mv{background:rgba(255,255,255,.05);border-color:var(--wk-line-2)}
.of-note{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;font-size:12.5px;line-height:1.45;color:var(--wk-body);background:var(--acc-t2,#f5f8fd);border:1px solid #dfe8f7}
html[data-theme="dark"] .of-note{background:var(--wk-tint);border-color:rgba(var(--acc-m-rgb,111,160,224),.2)}
.of-note svg{width:14px;height:14px;color:var(--wk-link);flex-shrink:0;margin-top:2px}
.of-osh{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.of-osh h2{font-family:var(--font-heading);font-weight:600;font-size:21px;margin:0;color:var(--wk-ink)}
.of-osh p{margin:3px 0 0;font-size:13px;color:var(--wk-mut)}
.of-ocnt{font-size:12px;font-weight:700;color:var(--wk-chip-fg);background:var(--wk-chip);border-radius:999px;padding:4px 11px}
.of-acts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.of-ac{position:relative;display:flex;flex-direction:column;background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;padding:16px;box-shadow:var(--wk-shadow);cursor:pointer;transition:transform .15s,box-shadow .15s;min-width:0}
.of-ac:hover{transform:translateY(-2px)}
.of-ac::before{content:"";position:absolute;left:16px;right:16px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--tc)}
.of-at{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;color:var(--tc)}
.of-at i{width:24px;height:24px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--tb);font-style:normal}
.of-at i svg{width:13px;height:13px;stroke-width:2}
.of-aw{margin-left:auto;font-weight:600;color:var(--wk-dim);white-space:nowrap}
.of-ac h3{margin:12px 0 2px;font-size:15.5px;color:var(--wk-ink);overflow-wrap:anywhere}
.of-acu{font-size:13px;color:var(--wk-mut)}
.of-ain{display:flex;gap:9px;align-items:flex-start;margin:12px 0 14px;padding:10px 11px;border-radius:12px;background:var(--acc-t2,#f5f8fd);font-size:12.5px;line-height:1.45;color:var(--wk-body)}
html[data-theme="dark"] .of-ain{background:var(--wk-inner)}
.of-ain svg{width:13px;height:13px;color:var(--wk-link);flex-shrink:0;margin-top:2px}
.of-ain b{color:var(--wk-ink)}
.of-apl{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.of-ab{margin-top:auto;height:40px;border-radius:11px;border:0;background:var(--acc-d,#2f5fa8);color:#fff;font:inherit;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;padding:0 12px}
.of-ab svg{width:15px;height:15px;stroke-width:2}
.of-ab:hover{background:#274f8e}
.of-ab.sec{background:var(--wk-btn2);color:var(--wk-link);border:1px solid #c9d6ea}
.of-ab:disabled{opacity:.6;cursor:progress}
.of-rate{display:inline-flex;align-items:center;font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px;white-space:nowrap}
.of-rate.y,.of-rate.b{background:transparent;color:var(--wk-mut);padding-left:0;padding-right:0}.of-rate.r{background:transparent;color:#c43d35;padding-left:0;padding-right:0}
html[data-theme="dark"] .of-rate.r{color:var(--wk-red)}
html[data-theme="dark"] .of-rate.r{color:var(--wk-red)}
/* Puhelimella sarakeotsikkoa ei ole, joten merkki kertoo itse, mikä luku on (käytettävyyskatselmus 4.10.2026). */
.of-rate-l{display:none;font:inherit;font-weight:600;margin-right:3px}
.of-fit{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px;white-space:nowrap}
.of-fit svg{width:11px;height:11px;stroke-width:2.2}
.of-fit.o{background:#fff4e5;color:#b27a12}.of-fit.y{background:var(--wk-green-t);color:var(--wk-green)}.of-fit.n{background:#f1f3f7;color:var(--wk-mut)}.of-fit.b{background:var(--wk-tint);color:var(--wk-link)}
html[data-theme="dark"] .of-fit.o{background:var(--wk-amber-t);color:var(--wk-amber)}html[data-theme="dark"] .of-fit.n{background:rgba(255,255,255,.06)}
/* Kannattavuusennuste viikkokorttina (dist/offers.js ofComboHtml): tämän viikon keikat ja tulevat viikot. */
.ofw{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:20px;box-shadow:var(--wk-shadow);overflow:hidden;min-width:0}
.ofw-hd{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:center;padding:22px 26px 24px;background:linear-gradient(128deg,#0d1119 0%,#182644 55%,var(--acc-d,#2f5fa8) 100%);color:#fff}
.ofw0 .ofw-hd{grid-template-columns:1fr}
.ofw-k{font-size:11px;font-weight:700;letter-spacing:.13em;color:#8fb3ec}
.ofw-hd h2{font-family:var(--font-heading);font-weight:600;font-size:24px;margin:6px 0 4px;color:#fff}
.ofw-hd p{margin:0;font-size:13px;color:#c7d2e3;line-height:1.5}
.ofw-sum{text-align:right}.ofw-sum small{display:block;font-size:12px;color:#c7d2e3}
.ofw-sum b{display:block;font-family:var(--font-heading);font-weight:600;font-size:34px;line-height:1.1;color:#fff;white-space:nowrap}
.ofw-cap{grid-column:1/-1;display:flex;align-items:center;gap:12px;font-size:12px;color:#c7d2e3;flex-wrap:wrap}
.ofw-bar{flex:1 1 200px;height:9px;border-radius:99px;background:rgba(255,255,255,.14);overflow:hidden;display:flex}
.ofw-bar i{display:block;height:100%}.ofw-bar .a{background:#8fb3ec}.ofw-bar .b{background:#f0c36a}
.ofw-lg{display:flex;gap:12px;flex-wrap:wrap}.ofw-lg span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:6px}
.ofw-lg .a::before{background:#8fb3ec}.ofw-lg .b::before{background:#f0c36a}.ofw-lg .c::before{background:rgba(255,255,255,.3)}
.ofw-list{padding:4px 26px}
.ofw-row{display:grid;grid-template-columns:52px minmax(0,1fr) 220px 96px 160px;gap:18px;align-items:center;padding:14px 0;border-bottom:1px solid var(--wk-line);cursor:pointer}
.ofw-row:last-of-type{border-bottom:0}
.ofw-date{width:50px;border:1px solid var(--wk-line);border-radius:12px;text-align:center;overflow:hidden;background:var(--wk-panel)}
.ofw-date span{display:block;background:var(--wk-tint);color:var(--wk-link);font-size:10px;font-weight:700;letter-spacing:.08em;padding:3px 0}
.ofw-date b{display:block;font-family:var(--font-heading);font-size:19px;font-weight:600;color:var(--wk-ink);padding:2px 0 4px}
.ofw-w{min-width:0}.ofw-w b{display:block;font-size:15px;color:var(--wk-ink);overflow-wrap:anywhere}.ofw-w span{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:2px}
.ofw-steps{display:flex;justify-content:space-between}
.ofw-st{display:flex;flex-direction:column;align-items:center;gap:4px;width:72px;font-size:11px;color:var(--wk-dim)}
.ofw-st i{width:20px;height:20px;border-radius:50%;border:2px solid var(--wk-line-2,#d5dbe6);background:var(--wk-panel);display:flex;align-items:center;justify-content:center}
.ofw-st i svg{width:11px;height:11px;stroke-width:3;color:#fff}
.ofw-st.d{color:var(--wk-green)}.ofw-st.d i{background:var(--wk-green);border-color:var(--wk-green)}
.ofw-st.n{color:var(--wk-link);font-weight:700}.ofw-st.n i{border-color:var(--wk-link);box-shadow:0 0 0 3px var(--wk-tint)}
.ofw-eur{text-align:right;font-weight:700;font-size:15px;color:#1f7a45;white-space:nowrap}
html[data-theme="dark"] .ofw-eur{color:#6fcf8e}
.ofw-eur small{display:block;font-size:11.5px;font-weight:500;color:var(--wk-mut)}
.ofw-eur.m{color:var(--wk-dim);font-weight:600;font-size:13px}
.ofw-btn{height:38px;border-radius:11px;border:0;background:var(--acc-d,#2f5fa8);color:#fff;font:inherit;font-size:13px;font-weight:700;cursor:pointer;padding:0 12px}
.ofw-btn:hover{background:#274f8e}.ofw-btn:disabled{opacity:.6;cursor:progress}
.ofw-ok{display:flex;align-items:center;justify-content:center;gap:6px;height:38px;border-radius:11px;background:var(--wk-green-t);color:var(--wk-green);font-size:13px;font-weight:700}
.ofw-ok svg{width:13px;height:13px;stroke-width:2.4}
.ofw-none{padding:18px 0;font-size:13px;color:var(--wk-mut)}
.ofw-more{display:block;margin:4px auto 10px;border:0;background:none;font:inherit;font-size:13px;font-weight:700;color:var(--wk-link);cursor:pointer}
.ofw-ft{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 26px 20px;font-size:13px;color:var(--wk-mut)}
.ofw-all{height:40px;border-radius:12px;border:0;background:#16202e;color:#fff;font:inherit;font-size:13px;font-weight:700;padding:0 18px;cursor:pointer}
html[data-theme="dark"] .ofw-all{background:#f4f6fa;color:#16202e}
.ofw-q{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 26px 4px;padding:12px 14px;border-radius:14px;background:var(--wk-tint);border:1px solid rgba(var(--acc-rgb,59,111,209),.25)}
.ofw-q>div{flex:1 1 200px;min-width:0}.ofw-q b{display:block;color:var(--wk-ink)}.ofw-q span{font-size:12.5px;color:var(--wk-mut)}
.ofw-qn{flex:0 0 auto;font-size:12px;font-weight:700;color:var(--wk-link);background:var(--wk-panel);border-radius:99px;padding:3px 10px}
.ofw-up{border-top:1px solid var(--wk-line);padding:18px 26px 22px;background:var(--wk-card)}
.ofw-up h3{margin:0;font-family:var(--font-heading);font-weight:600;font-size:18px;color:var(--wk-ink)}
.ofw-up>p{margin:3px 0 10px;font-size:13px;color:var(--wk-mut)}
.ofw-wkw{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:14px;margin-top:8px;overflow:hidden}
.ofw-wk{width:100%;display:grid;grid-template-columns:110px minmax(0,1fr) 150px 96px 18px;gap:16px;align-items:center;padding:12px 16px;border:0;background:none;font:inherit;text-align:left;color:inherit;cursor:pointer}
.ofw-wk.free{border:1px dashed var(--wk-line-2,#d5dbe6);border-radius:14px;margin-top:8px;cursor:default;background:transparent}
.ofw-wk>svg{width:16px;height:16px;color:var(--wk-dim);transition:transform .15s}
.ofw-wkw.open .ofw-wk>svg{transform:rotate(90deg)}
.ofw-wn b{display:block;font-size:15px;color:var(--wk-ink)}.ofw-wn span{font-size:12px;color:var(--wk-mut)}
.ofw-chips{display:flex;gap:6px;flex-wrap:wrap;min-width:0}
.ofw-chips span{background:var(--wk-card);border:1px solid var(--wk-line);border-radius:8px;padding:4px 9px;font-size:12.5px;font-weight:600;color:var(--wk-ink)}
.ofw-chips small{font-weight:500;color:var(--wk-mut);margin-left:5px}.ofw-chips em{font-style:normal;font-size:13px;color:var(--wk-mut)}
.ofw-wc{font-size:12px;color:var(--wk-mut)}.ofw-wc i{display:block;height:5px;border-radius:99px;background:var(--wk-line);margin-top:5px;overflow:hidden}.ofw-wc em{display:block;height:100%;background:#8fb3ec}
.ofw-list.sub{border-top:1px solid var(--wk-line);padding:0 16px}
.ofw-later{margin:12px 0 0;font-size:12.5px;color:var(--wk-mut)}
.of-tknote{margin:10px 12px 4px;font-size:12.5px;color:var(--wk-mut);line-height:1.5}.of-tknote b{color:var(--wk-ink)}
@media (max-width:960px){.ofw-row{grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"d w e" "s s b"}.ofw-date{grid-area:d}.ofw-w{grid-area:w}.ofw-eur{grid-area:e}.ofw-steps{grid-area:s;justify-content:flex-start}.ofw-row>.ofw-btn,.ofw-row>.ofw-ok{grid-area:b}
 .ofw-wk{grid-template-columns:minmax(0,1fr) auto 18px;grid-template-areas:"n e c" "j j j" "w w w"}.ofw-wn{grid-area:n}.ofw-chips{grid-area:j}.ofw-wc{grid-area:w}.ofw-wk .ofw-eur{grid-area:e}.ofw-wk>svg{grid-area:c}.ofw-wk.free>span{display:none}}
@media (max-width:560px){.ofw-hd{grid-template-columns:1fr;padding:18px 16px}.ofw-sum{text-align:left}.ofw-list,.ofw-up{padding-left:14px;padding-right:14px}.ofw-ft{padding:12px 14px 16px}.ofw-q{margin:12px 14px 4px}.ofw-st{width:62px}}
.of-ins{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;padding:18px;box-shadow:var(--wk-shadow);min-width:0}
.of-inn{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.of-inn li{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--wk-ink);line-height:1.45}
.of-inn li svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--wk-mut)}
.of-ingw{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.of-ing h3{font-size:13px;font-weight:600;margin:0 0 8px;color:var(--wk-mut)}
.of-inr{display:grid;grid-template-columns:minmax(0,1fr) 90px 44px auto;gap:8px;align-items:center;font-size:13px;padding:5px 0;color:var(--wk-ink)}
.of-inr>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.of-inb{height:8px;border-radius:99px;background:var(--wk-line);overflow:hidden}
.of-inb i{display:block;height:100%;border-radius:99px;background:currentColor;opacity:.55}
.of-inr b{text-align:right;font-variant-numeric:tabular-nums}
.of-inr small{color:var(--wk-mut);white-space:nowrap}
.of-list{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;padding:18px 18px 10px;box-shadow:var(--wk-shadow);scroll-margin-top:16px;min-width:0}
.of-list.flash{animation:ofFlash 1.2s ease}
@keyframes ofFlash{0%{box-shadow:0 0 0 3px rgba(var(--acc-rgb,59,111,209),.55)}100%{box-shadow:0 0 0 0 rgba(var(--acc-rgb,59,111,209),0)}}
.of-oflt{display:flex;gap:10px;align-items:center;flex-wrap:wrap;min-width:0;flex-basis:100%}
.of-srch input{width:220px;height:36px}
.of-chips{flex:0 1 auto;max-width:100%}
.of-chips button{flex:0 0 auto}
.of-rows{container-type:inline-size}
.of-orh,.of-orw{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1.6fr) 100px 90px 18px;gap:14px;align-items:center;padding:0 12px}
.of-orh{height:34px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--wk-dim);background:var(--wk-card);border-radius:10px}
.of-orh .n,.of-pr{text-align:right}
.of-orw{width:100%;min-height:64px;padding:10px 12px;border:0;border-bottom:1px solid var(--wk-line);background:transparent;cursor:pointer;font:inherit;color:var(--wk-ink);text-align:left}
.of-orw:last-child{border-bottom:0}
/* Odottaa sinua -rivit listan ylimpänä: merkki otsikon perässä ja oma toimintonappi tilan alla (offers.js ofListHtml). */
/* Odottaa sinua -rivi: keltainen reuna kertoo saman kuin keltainen tausta, mutta lista pysyy rauhallisena. */
.of-orw.hot{box-shadow:inset 3px 0 0 var(--wk-amber)}
.of-orw:focus-visible{outline:2px solid var(--wk-link);outline-offset:-2px}
.of-orw.hot .of-cw b{display:flex;align-items:center;gap:8px}
.of-tt{min-width:0;font-style:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Puhelimella Odottaa sinua -merkki nimen yläpuolelle, jotta pitkä nimi näkyy kokonaan. */
@media (max-width:760px){.of-orw.hot .of-cw b{flex-direction:column-reverse;align-items:flex-start;gap:6px}.of-tt{white-space:normal}}
.of-rab{display:block;width:max-content;margin-top:6px;height:34px;padding:0 14px;border:0;border-radius:10px;background:var(--acc-d,#2f5fa8);color:#fff;font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:filter .15s,box-shadow .15s,transform .15s}
.of-rab:hover{filter:brightness(1.1);box-shadow:0 10px 20px -12px rgba(var(--acc-d-rgb,47,95,168),.95);transform:translateY(-1px)}
.of-rab.sec{background:var(--wk-btn2);color:var(--wk-ink);border:1px solid var(--wk-line-2)}
.of-orw:hover{background:#f8fafd}
html[data-theme="dark"] .of-orw:hover{background:rgba(255,255,255,.03)}
.of-cw{min-width:0}.of-cw b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.of-cw span{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.of-sw2>span:not(.of-stp):not(.of-ftc){display:block;font-size:11.5px;color:var(--wk-dim);margin-top:4px}
.of-sw2>.of-ftc{display:inline-block;margin-left:6px;vertical-align:middle}
.of-stp{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.of-stp.sent{background:var(--wk-chip);color:var(--wk-chip-fg)}
.of-stp::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.of-stp.new{background:#fff6e6;color:#b27a12}.of-stp.sent{background:var(--wk-tint);color:var(--wk-link)}.of-stp.won{background:var(--wk-green-t);color:var(--wk-green)}.of-stp.lost{background:#f1f3f7;color:var(--wk-dim)}
html[data-theme="dark"] .of-stp.new{background:var(--wk-amber-t);color:var(--wk-amber)}html[data-theme="dark"] .of-stp.lost{background:rgba(255,255,255,.06)}
.of-ftc{min-width:0}
.of-pr{font-weight:700;font-size:14px;white-space:nowrap}
.of-kp small{display:block;font-size:11.5px;font-weight:600;color:var(--wk-dim);margin-top:2px}
.of-prv{display:block;font-size:11px;font-weight:600;color:var(--wk-dim)}
.of-ehc{justify-self:end}
.of-orw>svg{width:16px;height:16px;color:var(--wk-dim)}
.of-tools{display:flex;gap:16px;flex-wrap:wrap;padding:12px 4px 4px;border-top:1px solid var(--wk-line);margin-top:6px}
/* Tarjouslistan väliotsikot ja siirtoilmoitus (6.10.2026) */
.of-gh{display:flex;align-items:center;gap:8px;padding:16px 12px 8px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--wk-mut)}
.of-gh:first-child{padding-top:8px}
.of-gh em{font-style:normal;background:var(--wk-amber-t,#fdf1dc);color:#9a5b00;border-radius:999px;padding:2px 8px;letter-spacing:0;font-size:11.5px}
html[data-theme="dark"] .of-gh em{color:var(--wk-amber)}
.of-moved{margin:14px 0 4px;padding:12px 14px;border:1px dashed var(--wk-line-2);border-radius:12px;color:var(--wk-mut);font-size:13.5px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.of-moved button{background:none;border:0;padding:0;color:var(--wk-link);font:inherit;font-weight:700;cursor:pointer}
/* Uusi tarjous -valikko (6.10.2026): yksi nappi, kolme tapaa */
.of-neww{position:relative;display:inline-block}
.of-newm{position:absolute;right:0;top:calc(100% + 8px);z-index:60;width:300px;max-width:calc(100vw - 32px);background:var(--wk-panel);color:var(--wk-ink);border:1px solid var(--wk-line-2);border-radius:14px;box-shadow:var(--wk-shadow-lg);padding:6px;text-align:left}
.of-newm button{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;border:0;background:transparent;color:inherit;font:inherit;padding:11px 12px;border-radius:10px;cursor:pointer}
.of-newm button:hover,.of-newm button:focus-visible{background:var(--wk-card);outline:none}
.of-newm svg{width:20px;height:20px;flex-shrink:0;margin-top:1px;color:var(--wk-link);stroke-width:2}
.of-newm b{display:block;font-size:14.5px}
.of-newm span span{display:block;color:var(--wk-mut);font-size:13px;line-height:1.35;margin-top:2px}
@media (max-width:899px){.of-neww{display:block;width:100%}.of-neww>.of-hb{width:100%;justify-content:center}.of-newm{left:0;right:auto;width:100%}}
@container (max-width:760px){
 .of-orh{display:none}
 .of-rate-l{display:inline}
 .of-orw{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"cw pr" "st eh";gap:6px 10px;padding:12px}
 .of-cw{grid-area:cw}.of-pr{grid-area:pr}.of-sw2{grid-area:st}.of-ehc{grid-area:eh}.of-orw>svg{display:none}
}
/* tarjouspaneeli */
.of-pstp{font-size:11px;font-weight:700;border-radius:999px;padding:2px 9px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2)}
.of-pstp.new{background:rgba(224,169,46,.18);border-color:rgba(240,195,106,.4);color:#f3dfb5}.of-pstp.won{background:rgba(46,155,92,.2);border-color:rgba(111,207,142,.35);color:#bfe7cc}
.of-q{background:#f7f9fc;border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.55;color:var(--wk-body);white-space:pre-wrap;overflow-wrap:anywhere;max-height:220px;overflow-y:auto}
html[data-theme="dark"] .of-q{background:var(--wk-inner)}
.of-line{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;padding:7px 0;border-top:1px solid var(--wk-line)}
.of-line:first-of-type{border-top:0;padding-top:0}
.of-line>span{min-width:0}.of-line small{display:block;font-size:12.5px;color:var(--wk-mut)}
.of-line b{white-space:nowrap}
.of-line.sm{font-size:13px;padding:5px 0}
.of-tot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:10px;padding-top:10px;border-top:2px solid var(--wk-ink);font-size:13.5px;font-weight:700}
.of-tot>span:last-child{text-align:right}.of-tot b{font-family:var(--font-heading);font-size:22px}.of-tot small{display:block;font-size:11.5px;color:var(--wk-dim);font-weight:600}
.of-kp{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.of-kp div{background:#f7f9fc;border-radius:10px;padding:8px 10px;min-width:0}
html[data-theme="dark"] .of-kp div{background:var(--wk-inner)}
.of-kp span{display:block;font-size:11px;color:var(--wk-dim);font-weight:600}
.of-kp b{font-family:var(--font-heading);font-weight:600;font-size:18px;white-space:nowrap}
.of-kp .g{background:var(--wk-green-t)!important}.of-kp .g b{color:var(--wk-green)}
.of-kp .r{background:var(--wk-red-t)!important}.of-kp .r b{color:#c43d35}
html[data-theme="dark"] .of-kp .r b{color:var(--wk-red)}
.of-muted{margin:8px 0 0;font-size:12.5px;color:var(--wk-mut)}
.of-tip{display:flex;gap:10px;align-items:flex-start;margin-top:10px;padding:11px 12px;border-radius:12px;background:var(--wk-amber-t);border:1px solid #f6e3bf;font-size:12.5px;line-height:1.5;color:var(--wk-body)}
html[data-theme="dark"] .of-tip{border-color:rgba(240,195,106,.25)}
.of-tip>svg{width:14px;height:14px;color:var(--wk-amber);flex-shrink:0;margin-top:2px}
.of-tip b{color:var(--wk-ink)}
.of-tip button{display:block;margin-top:7px;border:0;background:#16202e;color:#fff;border-radius:8px;padding:6px 10px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
html[data-theme="dark"] .of-tip button{background:#f4f6fa;color:#16202e}
.of-sched{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--wk-body)}
.of-sched b{color:var(--wk-ink)}
.of-wk{flex-shrink:0;width:46px;height:52px;border-radius:10px;border:1px solid #dfe8f7;background:var(--acc-t2,#f3f7fd);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:600;font-size:20px;color:var(--wk-ink)}
html[data-theme="dark"] .of-wk{background:var(--wk-tint);border-color:rgba(var(--acc-m-rgb,111,160,224),.25)}
.of-wk small{font-family:var(--font-body);font-size:10px;font-weight:700;color:var(--wk-link)}
.of-slots{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.of-sec{display:flex;gap:16px;flex-wrap:wrap;padding:0 4px}
.of-copy{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:0 4px}.of-copy>span{font-size:12px;color:var(--wk-mut)}.of-copy .text-btn{display:inline-flex;align-items:center;gap:6px}.of-copy svg{width:14px;height:14px}
.of-form label{display:grid;gap:5px;font-size:12.5px;font-weight:600;color:var(--wk-mut)}
.of-form input{width:100%;min-width:0;height:40px;padding:0 11px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:14px}
html[data-theme="dark"] .of-form input{color-scheme:dark}
.wk-pf .of-del{flex:0 0 auto;padding:0 16px;color:#c43d35}
@media (max-width:1280px){.of-acts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1100px){.of-srch input{width:100%}.of-oflt{width:100%}.of-srch{flex:1 1 200px}}
/* Puhelimella yhteenvetolaatikot piiloon: luvut näkyvät välilehdissä, ja Odottaa sinua näkyy heti ilman vierittämistä. */
@media (max-width:760px){.of-acts{grid-template-columns:1fr}.of-cdr{grid-template-columns:18px minmax(0,1fr)}.of-when{grid-column:2;justify-content:flex-start}.of-list{padding:14px 10px 8px}}
/* S4 (puhelin): Asiakas hyväksyi / hylkäsi ovat peukalolle sopivia reunallisia nappeja, eivät pieniä tekstilinkkejä */
/* Täydennä arvio (Kannattavuus-kortti, offers.js). */
.of-fillb{margin-top:8px}
/* Puhelimella korttien tekstilinkit ovat sormen kokoisia nappeja; kortin päätoiminto (.p) on täytetty. Tietokone ennallaan. */
@media (max-width:560px){.wk-pcard .text-btn,.iv-planb .text-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 14px;border:1px solid var(--wk-line-2);border-radius:11px;background:var(--wk-panel);color:var(--wk-link);font-size:14px;font-weight:700;margin-top:4px;text-decoration:none}
 .wk-pcard .text-btn.p,.iv-planb .text-btn.p{background:var(--acc-d,#2f5fa8);border-color:var(--acc-d,#2f5fa8);color:#fff}}
@media (max-width:760px){.of-sec{gap:8px;padding:0}.of-sec .text-btn{flex:1 1 40%;min-height:44px;padding:0 10px;border:1px solid var(--wk-line-2);border-radius:11px;background:var(--wk-panel);color:var(--wk-link);font-size:14px}}

/* ===== Kalenteri ===== */
.cal-ctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.cal-navb{display:flex;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:11px;overflow:hidden}
.cal-navb button{height:36px;min-width:36px;border:0;background:transparent;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font:inherit;font-size:13px;font-weight:700}
.cal-navb button svg{width:15px;height:15px;stroke-width:2}
.cal-navb button:disabled{opacity:.35;cursor:default}
.cal-navb .tdy{padding:0 12px;border-left:1px solid rgba(255,255,255,.12);border-right:1px solid rgba(255,255,255,.12)}
.cal-navb button:hover:not(:disabled){background:rgba(255,255,255,.08)}
.cal-newb{height:38px;display:flex;align-items:center;gap:7px;padding:0 14px;border-radius:11px;border:0;background:#fff;color:#16202e;font:inherit;font-size:13px;font-weight:700;cursor:pointer;box-shadow:0 6px 16px -6px rgba(0,0,0,.4);transition:filter .15s,box-shadow .15s,transform .15s}
.cal-newb:hover{filter:brightness(.93);box-shadow:0 10px 20px -12px rgba(0,0,0,.55);transform:translateY(-1px)}
.cal-newb svg{width:15px;height:15px;stroke-width:2}
.cal-mbar{display:block;height:5px;border-radius:5px;background:rgba(255,255,255,.12);margin-top:6px;overflow:hidden}
.cal-mbar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc,#3b6fd1),var(--acc-l,#9dc0f2));border-radius:5px}
.cal-conn{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;padding:12px 16px;border-radius:14px;background:var(--wk-tint);color:var(--wk-body);font-size:13.5px}
.cal-conn svg{width:16px;height:16px;color:var(--wk-link)}
.cal-conn span{flex:1;min-width:200px}
.cal-conn button{border:0;background:var(--acc-d,#2f5fa8);color:#fff;border-radius:9px;height:34px;padding:0 12px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.cal-conn .cal-reconn{display:inline-flex;align-items:center;background:var(--acc-d,#2f5fa8);color:#fff;border-radius:9px;height:34px;padding:0 12px;font-size:12.5px;font-weight:700;text-decoration:none}
.cal-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
.cal-calc{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;box-shadow:var(--wk-shadow);overflow:hidden;min-width:0}
.cal-lgd{display:flex;gap:18px;font-size:12.5px;color:var(--wk-body);flex-wrap:wrap}
.cal-lgd span{display:flex;align-items:center;gap:7px}
.cal-k{display:inline-block;width:16px;height:12px;border-radius:4px}
.cal-k.k1{background:#dde8f8;border-left:3px solid var(--acc-d,#2f5fa8)}
.cal-k.k2{border:1.5px dashed var(--acc,#3b6fd1);background:var(--wk-panel)}
.cal-scroll{overflow-x:auto}
.cal-grid{position:relative;display:grid;min-width:640px}
.cal-dh{height:98px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-bottom:1px solid var(--wk-line-2);border-left:1px solid var(--wk-line);background:var(--wk-panel)}
.cal-corner{border-left:0}
.cal-dh span{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--wk-dim)}
.cal-dh b{font-family:var(--font-heading);font-weight:600;font-size:19px;color:var(--wk-ink);width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.cal-dh em{font-style:normal;font-size:10.5px;font-weight:700;color:var(--wk-mut);height:13px;white-space:nowrap}
.cal-dh em.full{color:var(--wk-dim)}
.cal-dh.td b{background:var(--acc-d,#2f5fa8);color:#fff}.cal-dh.td span{color:var(--wk-link)}
.cal-dh.we{background:#f7f8fa}.cal-dh.we:not(.td) b,.cal-dh.we:not(.td) span{color:var(--wk-dim)}.cal-dh.we b{font-size:16px}
html[data-theme="dark"] .cal-dh.we{background:rgba(255,255,255,.02)}
/* Tekstilinkit (esim. Tarjoukset → Vie CSV) tummassa teemassa: korostussininen jäisi alle 4,5:1-kontrastin. */
html[data-theme="dark"] .text-btn{color:var(--wk-link)}
.cal-hrs{position:relative}
.cal-hr{font-size:11.5px;font-weight:600;color:var(--wk-dim);text-align:right;padding-right:10px;transform:translateY(-8px)}
.cal-hr:first-child{visibility:hidden}
.cal-col{position:relative;border-left:1px solid var(--wk-line);background-image:linear-gradient(#e9ecf1 1px,transparent 1px),linear-gradient(#f5f6f8 1px,transparent 1px);background-size:100% 64px,100% 32px}
html[data-theme="dark"] .cal-col{background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px)}
.cal-col.td{background-color:#fafcff}
html[data-theme="dark"] .cal-col.td{background-color:rgba(var(--acc-rgb,59,111,209),.05)}
.cal-col.we{background-color:#f7f8fa;background-image:none}
html[data-theme="dark"] .cal-col.we{background-color:rgba(255,255,255,.02)}
.cal-wel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--wk-dim);white-space:nowrap}
.cal-off{position:absolute;left:0;right:0;background:#f5f6f8;pointer-events:none}
html[data-theme="dark"] .cal-off{background:rgba(255,255,255,.03)}
.cal-off span{position:absolute;left:8px;top:6px;font-size:10.5px;font-weight:600;color:#aab1bd}
.cal-now{position:absolute;left:-5px;right:0;height:2px;background:#e0453c;z-index:3;pointer-events:none}
.cal-now::before{content:"";position:absolute;left:0;top:-4px;width:10px;height:10px;border-radius:50%;background:#e0453c}
.cal-ev,.cal-gh,.cal-ad1{position:absolute;border-radius:10px;overflow:hidden;text-align:left;font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:stretch;color:var(--wk-ink)}
.cal-ev{padding:8px 10px;background:#e6eefb;border:0;border-left:4px solid var(--acc-d,#2f5fa8);transition:box-shadow .15s,transform .15s}
html[data-theme="dark"] .cal-ev{background:rgba(var(--acc-rgb,59,111,209),.22)}
.cal-ev:hover{box-shadow:0 10px 22px -12px rgba(16,24,40,.45);transform:translateY(-1px)}
.cal-ev.ai{border-left-color:#2e9b5c;background:#e3f3e8}
html[data-theme="dark"] .cal-ev.ai{background:rgba(46,155,92,.2)}
.cal-tm{display:block;font-size:11.5px;font-weight:700;color:var(--wk-link);white-space:nowrap}
.cal-ev.ai .cal-tm{color:#23804a}
html[data-theme="dark"] .cal-ev.ai .cal-tm{color:#6fcf8e}
.cal-h1 b{display:block;font-size:13.5px;line-height:1.3;margin-top:2px;overflow-wrap:anywhere}
.cal-cu{display:block;font-size:12.5px;font-weight:600;color:var(--wk-body);margin-top:1px}
.cal-ad{display:flex;align-items:flex-start;gap:5px;font-size:12px;line-height:1.35;color:var(--wk-body);margin-top:5px;min-width:0}
.cal-ad svg{width:12px;height:12px;flex-shrink:0;margin-top:1px;color:var(--wk-dim);stroke-width:2}
.cal-ev.c1 .cal-cu{display:none}
.cal-ev.c2 .cal-ad>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-ev.c3,.cal-gh.c3{padding-top:5px;padding-bottom:5px}
.cal-ev.c3 .cal-h1,.cal-gh.c3 .cal-h1{display:flex;align-items:baseline;gap:7px;min-width:0}
.cal-ev.c3 .cal-h1 b,.cal-gh.c3 .cal-h1 b{margin-top:0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-ev.c5 .cal-ad{display:none}
.cal-gh{padding:8px 10px;border:1.5px dashed var(--acc,#3b6fd1);background:var(--wk-panel);box-shadow:0 6px 14px -10px rgba(var(--acc-d-rgb,47,95,168),.5);transition:background .15s}
.cal-gh:hover,.cal-gh.hl{background:#f3f7fe;border-style:solid;box-shadow:0 12px 26px -14px rgba(var(--acc-d-rgb,47,95,168),.9)}
html[data-theme="dark"] .cal-gh:hover,html[data-theme="dark"] .cal-gh.hl{background:var(--wk-tint)}
.cal-gt{display:flex;align-items:center;justify-content:space-between;gap:6px}
.cal-gl{display:flex;align-items:center;gap:4px;font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--wk-link)}
.cal-gl svg{width:11px;height:11px;stroke-width:2}
.cal-gh .cal-tm{color:var(--wk-mut);margin-top:6px}
.cal-gh.c1 .cal-cu,.cal-gh.c2 .cal-cu{display:none}
.cal-gh.c3 .cal-tm{margin-top:3px}
.cal-gh.c4 .cal-gt{display:none}
.cal-eh{font-size:11px;font-weight:700;border-radius:999px;padding:2px 8px;white-space:nowrap}
.cal-eh.g{background:transparent;color:var(--wk-mut);padding-left:0;padding-right:0}.cal-eh.r{background:transparent;color:#e0453c;padding-left:0;padding-right:0}
html[data-theme="dark"] .cal-eh.r{color:var(--wk-red)}
.cal-ad1{left:4px;right:4px;height:22px;padding:2px 8px;font-size:11.5px;font-weight:700;background:#fff4e5;border:1px solid #f1d9ad;color:#8a5d0c;white-space:nowrap;text-overflow:ellipsis;display:block;z-index:2}
html[data-theme="dark"] .cal-ad1{background:var(--wk-amber-t);border-color:rgba(240,195,106,.3);color:var(--wk-amber)}
.cal-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:14px;min-width:0}
.cal-sc{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;padding:16px;box-shadow:var(--wk-shadow)}
.cal-sh{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.cal-sh h3{margin:0;font-size:15px;color:var(--wk-ink)}.cal-sh>span{font-size:12px;color:var(--wk-dim);font-weight:600}
.cal-aiw{display:inline-flex;align-items:center;gap:5px;font-size:11px!important;font-weight:700!important;color:var(--wk-link)!important;background:var(--wk-tint);border-radius:999px;padding:3px 9px}
.cal-aiw svg{width:11px;height:11px}
.cal-sp{margin:-4px 0 12px;font-size:12.5px;color:var(--wk-mut)}
/* S8: Tulevat keikat -kortti näkyy vain puhelimella, jossa viikkoruudukko on piilossa */
.cal-next{display:none}
.cal-dayh{margin:12px 0 2px;font-size:12.5px;font-weight:700;color:var(--wk-mut);cursor:pointer}.cal-dayh+.cal-ag{border-top:0}
.cal-ag{display:grid;grid-template-columns:46px 1fr;gap:10px;padding:10px 0;border:0;border-top:1px solid var(--wk-line);width:100%;background:none;text-align:left;font:inherit;color:inherit;cursor:pointer;transition:background-color .15s}
.cal-ag:hover{background-color:var(--hv-row)}
.cal-ag:first-of-type{border-top:0}
div.cal-ag{cursor:default}
.cal-ag>b{font-size:13px;color:var(--wk-ink);padding-top:1px}
.cal-ag strong{display:block;font-size:13px;color:var(--wk-ink)}.cal-ag span span{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--wk-mut);margin-top:2px}
.cal-ag span svg{width:12px;height:12px;flex-shrink:0}
.cal-ag.now>b{color:#e0453c}
.cal-ag.free strong{color:var(--wk-mut)}
.cal-of{border:1px solid var(--wk-line-2);border-radius:14px;padding:12px;margin-top:8px;cursor:pointer;transition:border-color .15s,background .15s}
.cal-of:hover,.cal-of.hl{border-color:#b9cbe8;background:#f7faff}
html[data-theme="dark"] .cal-of:hover,html[data-theme="dark"] .cal-of.hl{background:var(--wk-tint);border-color:rgba(var(--acc-m-rgb,111,160,224),.35)}
.cal-ot{display:flex;justify-content:space-between;align-items:center;gap:8px}.cal-ot b{font-size:13.5px;color:var(--wk-ink)}
.cal-om{font-size:12px;color:var(--wk-mut);margin-top:2px}
.cal-fitl{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;margin-top:8px}
.cal-fitl svg{width:13px;height:13px;stroke-width:2}
.cal-of.fit .cal-fitl{color:var(--wk-green)}.cal-of.no .cal-fitl{color:var(--wk-dim);font-weight:600}
.cal-of.no{background:var(--wk-card)}
.cal-ob{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:10px;height:34px;border-radius:10px;border:1px solid #c9d6ea;background:var(--wk-btn2);color:var(--wk-link);font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
html[data-theme="dark"] .cal-ob{border-color:var(--wk-btn2-line)}
.cal-ob svg{width:14px;height:14px}
.cal-jrow{display:grid;grid-template-columns:22px 1fr;gap:8px;align-items:start;font-size:13.5px}
.cal-jrow>svg{width:15px;height:15px;color:var(--wk-dim);margin-top:2px}
.cal-jrow b{display:block}.cal-jrow a{font-size:12.5px;font-weight:700;color:var(--wk-link)}
.cal-jrow span>span{display:block;font-size:12.5px;color:var(--wk-dim);overflow-wrap:anywhere}
.cal-bans{margin:6px 0 10px 30px;font-size:12.5px;overflow-wrap:anywhere}.cal-bans dt{font-weight:700;margin-top:6px}.cal-bans dd{margin:2px 0 0;color:var(--wk-dim);white-space:pre-line}
@media (max-width:1599px){.cal-body{grid-template-columns:minmax(0,1fr)}.cal-side{position:static;display:grid;grid-template-columns:1fr 1fr;align-items:start}}
@media (max-width:760px){.cal-ctl{width:100%;justify-content:space-between}.cal-calc{display:none}.cal-next{display:block}.cal-side{grid-template-columns:1fr}}

.dr-sumb{margin-top:6px;font-size:12.5px}
.dr-sum{margin:8px 0 0;padding:10px 12px;border-radius:12px;background:var(--wk-tint);font-size:13px;line-height:1.5;color:var(--wk-body);white-space:pre-wrap}
/* "Toistuuko tämä?" (Tarjoukset, valmiiksi merkittäessä) */
.of-rep-o{display:grid;gap:8px}
.of-rep-o button{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:46px;padding:0 14px;border:1px solid var(--wk-line-2);border-radius:12px;background:var(--wk-panel);color:var(--wk-ink);font:inherit;font-size:14px;font-weight:600;text-align:left;cursor:pointer}
.of-rep-o button:hover{border-color:var(--wk-link)}
.of-rep-o button.on{border:2px solid var(--wk-link);padding:0 13px;background:var(--wk-tint)}
.of-rep-o small{padding:2px 8px;border-radius:999px;background:var(--wk-tint);font-size:11.5px;font-weight:700;color:var(--wk-link)}
/* Asentajanäkymä (installer.js): puhelimelle suunniteltu päivän keikkalista. */
.in-wrap{max-width:720px;margin:0 auto;padding:24px 16px 40px}
.in-top{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.in-kick{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--wk-mut)}
.in-h{font-size:26px;margin:4px 0 2px;color:var(--wk-ink)}
.in-sub{margin:0;color:var(--wk-body);font-size:14px}
.in-wrap .in-btn,.in-wrap .in-route,.in-wrap .in-cal,.in-omw .in-btn{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:10px;border:1px solid var(--wk-btn2-line);background:var(--wk-btn2);color:var(--wk-ink);font-family:inherit;font-size:14px;font-weight:600;line-height:1.3;text-decoration:none;cursor:pointer}
.in-wrap .in-route,.in-omw .in-btn.p{background:var(--wk-brand);border-color:var(--wk-brand);color:#fff}
.in-route svg,.in-btn svg,.in-cal svg{width:16px;height:16px;flex:none}
.in-list{display:grid;gap:12px}
.in-card{background:var(--wk-panel);border:1px solid var(--wk-line-2);border-radius:14px;padding:14px 16px;box-shadow:var(--wk-shadow)}
.in-card.now{border-color:var(--wk-brand)}
.in-card.past{opacity:.6}
.in-omw{margin-top:12px;padding-top:12px;border-top:1px solid var(--wk-line-2);display:grid;gap:8px}
.in-omw-h{font-size:13px;font-weight:600;color:var(--wk-mut)}
.in-omw-c{display:flex;flex-wrap:wrap;gap:6px}
.in-chip{min-height:36px;padding:6px 12px;border-radius:99px;border:1px solid var(--wk-line-2);background:var(--wk-panel);color:var(--wk-ink);font:inherit;font-size:13px;cursor:pointer}
.in-chip.on{border-color:var(--wk-brand);box-shadow:inset 0 0 0 1px var(--wk-brand);font-weight:600}
.in-omw textarea{width:100%;box-sizing:border-box;resize:vertical;font:inherit;font-size:14px;padding:10px 12px;border:1px solid var(--wk-line-2);border-radius:10px;background:var(--wk-field,#fff);color:var(--wk-ink)}
.in-omw .in-acts{display:flex;flex-wrap:wrap;gap:8px}
.in-omw-n{font-size:12.5px;color:var(--wk-mut)}
.in-card h2{font-size:17px;margin:6px 0 4px;color:var(--wk-ink)}
.in-when{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--wk-body)}
.in-when b{color:var(--wk-ink)}
.in-tag{font-size:11px;font-weight:700;padding:2px 8px;border-radius:99px;background:var(--wk-tint);color:var(--wk-link)}
.in-tag.now{background:var(--wk-green-t);color:var(--wk-green)}
.in-tag.done{background:var(--wk-line);color:var(--wk-mut)}
.in-line{color:var(--wk-body);font-size:14px}
.in-access{margin-top:8px;padding:8px 10px;border-radius:10px;background:var(--wk-amber-t);color:var(--wk-ink);font-size:14px;overflow-wrap:anywhere}
.in-access span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--wk-amber)}
.in-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.in-wrap .in-btn{max-width:100%;overflow-wrap:anywhere;text-align:left}
.in-wrap .in-done.confirm{border-color:var(--wk-brand);color:var(--wk-brand)}
.in-empty{padding:18px;border:1px dashed var(--wk-line-2);border-radius:14px;color:var(--wk-body);background:var(--wk-card)}
.in-wrap .in-cal{margin-top:16px}
/* Omat keikat: tulevat keikat (dist/installer.js inUpcomingHtml) */
.in-up{margin-top:22px;display:grid;gap:6px}
.in-uh{display:flex;align-items:baseline;gap:8px;margin:0 0 4px;font-family:var(--font-heading);font-size:18px;font-weight:600;color:var(--wk-ink)}
.in-uh small{font-family:var(--font-body);font-size:12.5px;font-weight:500;color:var(--wk-mut)}
.in-ud{margin-top:8px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--wk-dim)}
.in-ur{display:grid;grid-template-columns:62px minmax(0,1fr) 16px;gap:10px;align-items:center;width:100%;min-height:52px;padding:10px 12px;border:1px solid var(--wk-line-2);border-radius:12px;background:var(--wk-panel);color:var(--wk-ink);font:inherit;text-align:left;cursor:pointer}
.in-ur:hover,.in-ur:focus-visible{border-color:var(--wk-link)}
.in-ut{font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.in-uw{min-width:0;display:grid;gap:1px}
.in-uw b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.in-uw small{font-size:12.5px;color:var(--wk-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.in-ur>svg{width:16px;height:16px;color:var(--wk-dim)}
/* Keikan tarvikkeet asentajalle (dist/installer.js inSupHtml): sama rastilista kuin tukkulistassa. */
.in-sup{margin-top:10px;padding:8px 12px 10px;border-radius:12px;background:var(--wk-card);border:1px solid var(--wk-line-2)}
.in-sup-h{display:flex;align-items:center;gap:8px;width:100%;min-height:40px;padding:0;border:0;background:none;color:var(--wk-ink);font:inherit;font-size:14.5px;font-weight:700;cursor:pointer;text-align:left}
.in-sup-h svg{width:17px;height:17px;flex:none;color:var(--wk-amber-ink)}
.in-sup.ok .in-sup-h svg{color:var(--wk-green-ink)}
.in-sup-h span{flex:1}
.in-sup-h b{font-size:13px;color:var(--wk-amber-ink)}
.in-sup.ok .in-sup-h b{color:var(--wk-green-ink)}
.in-sup-h svg:last-child{color:var(--wk-mut);transition:transform .15s}
.in-sup-h[aria-expanded="true"] svg:last-child{transform:rotate(90deg)}
.in-sup-h:focus-visible{outline:2px solid var(--wk-brand);outline-offset:2px;border-radius:6px}
.in-sup-bar{margin-top:2px}
.in-sup-l{margin-top:6px}
.in-wrap .in-sup-r{grid-template-columns:22px 56px minmax(0,1fr);gap:9px}
.in-sup-r input{width:22px;height:22px}
.in-sup-r.cust{cursor:default}
.in-sup-i svg{width:18px;height:18px;color:var(--wk-mut)}
.in-sup-r .tk-nm small.late{display:flex;align-items:center;gap:4px;color:var(--wk-amber-ink);font-weight:600}
.in-sup-r .tk-nm small.late svg{width:13px;height:13px;flex:none}
.in-sup-f{margin:4px 0 0;font-size:12.5px;color:var(--wk-mut)}
.dr-rcpt{font-weight:600;color:var(--wk-ink,inherit);overflow-wrap:anywhere}
/* Puhelin: luonnoksen otsake. Otsikko saa koko leveyden, tila-merkit (Myöhässä, tyyppi) omalle rivilleen tekstin alle. */
@media (max-width:760px){
 .dr-ddh{align-items:flex-start;row-gap:10px}
 .dr-ddh>div{flex:1 1 calc(100% - 56px)}
 .dr-ddh h2{font-size:18px;line-height:1.3;overflow-wrap:break-word;word-break:normal;hyphens:auto}
 .dr-ddh p{overflow-wrap:anywhere}
 .dr-tps{width:100%;padding-left:52px;flex-wrap:wrap}
}
/* Viestit: luonnoskupla keskustelussa (messages.js) kaikilla leveyksillä. Tietokoneella teksti on suoraan
   muokattava kenttä ja mukana ovat Perustuu-rivi ja Pyydä Ainiota -napit; puhelimessa (alla) teksti ja Muokkaa-nappi. */
.ms-back,.ms-dpv{display:none}
/* Viestien suodatus yhdellä rivillä (6.10.2026): Vastaa itse, Odottaa, Kaikki, Lähetetyt ja Muut samassa ryhmässä.
   Napit saavat tilan tekstinsä mukaan; jos rivi ei mahdu, se vierii sivuttain. */
.ms-cats{display:flex;flex-direction:column;gap:8px}
.ms-cats .wk-seg button{flex:1 1 auto;min-width:max-content;white-space:nowrap}
/* Tyyppitagi listassa ja suodatinrivi. */
.ms-ty{display:inline-flex;align-self:flex-start;margin:4px 0 2px;font-size:11px;font-weight:700;line-height:1.35;border-radius:6px;padding:2px 7px;cursor:pointer;white-space:nowrap}
.ms-ty:hover{filter:brightness(.96)}
/* Tagin värit muuttujina, jotta etusivun Odottaa sinua -lista (home.css .hm-tk) käyttää täsmälleen samoja värejä. */
.ms-ty{color:var(--ty-c);background:var(--ty-b)}
.ms-ty-red{--ty-c:#b8332b;--ty-b:var(--wk-red-t)}.ms-ty-amber{--ty-c:var(--wk-amber-ink);--ty-b:#fbf1dc}.ms-ty-green{--ty-c:var(--wk-green-ink);--ty-b:var(--wk-green-t)}
/* Neljän värin sääntö (omistajan valinta 6.10.2026): punainen vain ongelmalle, muut aiheet harmaalla, jotta lista
   pysyy rauhallisena ja punainen erottuu. */
.ms-ty-teal,.ms-ty-grey,.ms-ty-orange,.ms-ty-violet,.ms-ty-blue,.ms-ty-amber,.ms-ty-green{--ty-c:var(--wk-chip-fg);--ty-b:var(--wk-chip)}
html[data-theme="dark"] .ms-ty-red{--ty-c:var(--wk-red)}
.ms-tyr{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:4px 0 2px}.ms-tyr .ms-ty{margin:0}
.ms-late{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;color:var(--wk-red);white-space:nowrap}
.ms-late svg{width:10px;height:10px;stroke-width:2.4}
.ms-tf{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:12.5px;color:var(--wk-mut)}
.ms-tf .ms-ty{margin:0;cursor:default}
.ms-tf button{display:inline-flex;align-items:center;gap:4px;border:0;background:none;font:inherit;font-size:12.5px;font-weight:700;color:var(--wk-link);cursor:pointer;padding:2px 4px}
.ms-tf button svg{width:11px;height:11px;stroke-width:2.2}
/* Ainion ehdotus: huomio ja summa keskustelun alussa (maksumuistutus, laskuluonnos, tarjousmuistutus...). */
.ms-info{display:flex;gap:10px;align-self:stretch;border:1px solid #ecd7bf;background:#fdf7f0;color:#3a2a14;border-radius:12px;padding:11px 14px;font-size:13px}
.ms-info>svg{flex:none;width:16px;height:16px;margin-top:2px;color:#b25a12}
.ms-info b{display:block;font-size:13px;color:#a8520f}
.ms-info p{margin:3px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.ms-info-sum{display:inline-block;margin-top:6px;font-size:12.5px;color:#6b5840}.ms-info-sum b{display:inline;color:#3a2a14;font-size:14px}
.ms-info-src{display:block;margin-top:6px;padding-top:6px;border-top:1px dashed #ecd7bf;font-size:12px;color:#6b5840}
html[data-theme="dark"] .ms-info{background:rgba(168,82,15,.12);border-color:rgba(243,178,122,.25);color:#f1dcc6}
html[data-theme="dark"] .ms-info b,html[data-theme="dark"] .ms-info>svg{color:#f3b27a}html[data-theme="dark"] .ms-info-sum,html[data-theme="dark"] .ms-info-sum b{color:#f1dcc6}
html[data-theme="dark"] .ms-info-src{color:#e5cdb4;border-top-color:rgba(243,178,122,.25)}
/* Sisäiset muistiinpanot keskustelun otsikkorivin alla (vain tiimille). */
.ms-mt.sug:not(.editing) .ms-comp{display:none}
@media (max-width:760px){.ms-lkc .ms-lkt{display:none}}
/* Vastasin itse: teksti näkyy myös puhelimella, ettei pelkkä valintamerkki näytä Lähetä- tai Hyväksy-napilta. */
@media (max-width:760px){.ms-lkc.ms-hand .ms-lkt{display:inline}}
.ms-lkc.on{background:var(--acc-d,#2f5fa8);color:#fff;border-color:var(--acc-d,#2f5fa8)}
.ms-lkc em{font-style:normal;font-size:11px;opacity:.8}
.ms-notes{margin:10px 16px 0;border:1px solid var(--wk-line-2);border-radius:12px;padding:11px 13px;background:var(--wk-card);display:flex;flex-direction:column;gap:8px}
.ms-notes-h{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px}
.ms-notes-h b{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--wk-ink)}.ms-notes-h svg{width:13px;height:13px}
.ms-notes-h em{font-style:normal;font-size:11.5px;color:var(--wk-dim)}
.ms-notes .hint{margin:0;font-size:12.5px;color:var(--wk-dim)}
.ms-note{border-left:3px solid var(--wk-line-2);padding:2px 0 2px 9px}
.ms-note-h{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--wk-dim)}.ms-note-h b{color:var(--wk-ink)}
.ms-note-h button{margin-left:auto;border:0;background:none;color:var(--wk-dim);cursor:pointer;padding:2px}.ms-note-h button svg{width:11px;height:11px}
.ms-note p{margin:2px 0 0;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--wk-body)}
.ms-note-add{display:flex;gap:8px;align-items:flex-end}
.ms-note-add textarea{flex:1;min-width:0;resize:vertical;font:inherit;font-size:13px;border:1px solid var(--wk-field-line);border-radius:9px;padding:7px 9px;background:var(--wk-field);color:var(--wk-ink)}
.ms-note-add button{border:0;background:var(--acc-d,#2f5fa8);color:#fff;font:inherit;font-size:12.5px;font-weight:700;border-radius:9px;padding:8px 12px;cursor:pointer}
.ms-mt.has-dbub .ms-ban.draft{display:none}
/* Kun Ainion luonnos on auki, alla ei ole toista kirjoituskenttää ja Lähetä-nappia: tilalla on linkki omaan vastaukseen.
   Muokkaa (puhelin) tai linkki lisää editing-luokan, jolloin kenttä tulee näkyviin. */
.ms-mt.has-dbub:not(.editing) .ms-box,.ms-mt.has-dbub:not(.editing) [data-ms-smsc="tx"]{display:none}
.ms-own{display:none;align-items:center;gap:6px;margin-top:2px;padding:4px 0;border:0;background:none;color:var(--wk-link);font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.ms-own svg{width:14px;height:14px}
.ms-mt.has-dbub:not(.editing) .ms-own{display:inline-flex}
/* B11: Muokkaa-tilasta takaisin Ainion luonnokseen */
.ms-unown{display:none;align-items:center;gap:4px;margin-top:2px;padding:4px 0;border:0;background:none;color:var(--wk-link);font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.ms-unown svg{width:15px;height:15px}
.ms-mt.has-dbub.editing .ms-unown{display:inline-flex}
/* Kun keskustelussa on luonnoskupla, keskustelualue kasvaa sisällön mukaan eikä rullaa sisäisesti: Lähetä-nappi ei jää piiloon. */
.ms-mt.has-dbub .ms-thr{max-height:none;overflow:visible}
.ms-dbub{display:block;align-self:flex-end;width:100%;max-width:min(94%,680px);padding:12px 16px 14px;border:1.5px dashed var(--acc-bd,#9db9e8);border-radius:16px;border-bottom-right-radius:5px;background:var(--acc-t2,#f5f8fd)}
html[data-theme="dark"] .ms-dbub{border-color:rgba(143,179,236,.55);background:rgba(59,111,209,.10)}
.ms-dlab{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:8px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--acc-d,#2f5fa8)}
html[data-theme="dark"] .ms-dlab{color:#8fb3ec}
.ms-dlab svg{width:12px;height:12px}
.ms-dlab em{font-style:normal;display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;background:#fdecea;color:#b3261e;letter-spacing:0;text-transform:none;font-size:11.5px}
html[data-theme="dark"] .ms-dlab em{background:rgba(240,138,126,.14);color:#f08a7e}
.ms-dhint{margin-left:auto;text-transform:none;letter-spacing:0;font-weight:600;font-size:12px;color:var(--wk-mut)}
.ms-dtx{display:none;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.45;color:var(--wk-ink)}
.ms-dta{display:block;width:100%;box-sizing:border-box;resize:none;font:inherit;font-size:15px;line-height:1.5;color:var(--wk-ink);padding:10px 12px;border-radius:10px;background:var(--wk-card,#fff);border:1px solid var(--wk-line-2);outline:none;min-height:88px}
.ms-dta:focus{border-color:var(--acc-bd,#9db9e8);box-shadow:0 0 0 3px rgba(59,111,209,.12)}
.ms-dta[aria-busy="true"]{opacity:.6}
/* Sopimuksen saate (messages.js signCov): oma luokka, jotta kenttä näkyy ja on muokattava myös puhelimella. */
.ms-dcov{margin:0 0 14px}
.ms-dclab{display:block;margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--wk-mut)}
.ms-dclab span{margin-left:6px;font-weight:500;letter-spacing:0;text-transform:none}
.ms-dcta{display:block;width:100%;box-sizing:border-box;resize:vertical;font:inherit;font-size:15px;line-height:1.5;color:var(--wk-ink);padding:10px 12px;border-radius:10px;background:var(--wk-card,#fff);border:1px solid var(--wk-line-2);outline:none;min-height:150px}
.ms-dcta:focus{border-color:var(--acc-bd,#9db9e8);box-shadow:0 0 0 3px rgba(59,111,209,.12)}
.ms-dcta[readonly]{opacity:.75}
.ms-dsnote{display:flex;gap:8px;align-items:flex-start;margin:8px 2px 0;font-size:13.5px;line-height:1.5;color:var(--wk-mut)}
.ms-dsnote svg{flex:none;width:14px;height:14px;margin-top:3px}
.ms-dsnote b{font-weight:600;color:var(--wk-ink)}
.ms-dwhy{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;margin-top:10px;overflow:hidden;white-space:nowrap}
.ms-dwhy.open{flex-wrap:wrap;overflow:visible;white-space:normal}
.ms-dwhy>b{flex:none;font-size:12px;font-weight:600;color:var(--wk-mut);margin-right:2px}
.ms-dwhy span{flex:none;display:inline-block;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:600;color:var(--wk-body);background:#e9eff9;border-radius:999px;padding:2px 10px}
.ms-dwhy.open span{max-width:none;white-space:normal;line-height:1.35;padding:4px 10px}
.ms-dwhy span.w{background:var(--wk-red-t,#fdecea);color:#7a241d}
.ms-dwhy .ms-dmore{flex:none;height:24px;padding:0 9px;border:0;border-radius:999px;background:#d9e4f6;color:var(--acc-d,#2f5fa8);font:inherit;font-size:12px;font-weight:700;cursor:pointer}
html[data-theme="dark"] .ms-dwhy span{background:var(--wk-inner);color:#dbe6f7}
html[data-theme="dark"] .ms-dwhy .ms-dmore{background:rgba(59,111,209,.3);color:#8fb3ec}
/* Hinnaston rivit luonnoksen alla (dist/messages.js msPriceHtml): yksi rivi, josta Muuta määriä avaa rivit. Vaaleansininen ✦ =
   Ainion oma huomio, keltainen = puuttuva määrä, harmaa = ei hinnastossa. */
.ms-pr{margin-top:10px;font-size:13.5px;line-height:1.4;color:var(--wk-ink)}
.ms-pr[aria-busy="true"] .ms-pr-ed{opacity:.6}
.ms-pr-line{display:flex;align-items:center;gap:8px;min-height:40px;padding:5px 5px 5px 12px;border-radius:10px;background:var(--wk-ai);color:var(--wk-ai-fg)}
.ms-pr-line b{font-weight:700;color:var(--wk-ink)}
.ms-pr-tx{flex:1;min-width:0}
.ms-pr-tx svg{width:13px;height:13px;margin-right:5px;vertical-align:-2px}
.ms-pr-line.miss{background:var(--wk-amber-t);color:var(--wk-ink)}
.ms-pr-line.miss b{color:var(--wk-amber-ink)}
.ms-pr-line.none{min-height:0;padding:8px 12px;background:var(--wk-chip);color:var(--wk-chip-fg)}
.ms-pr-open{flex:none;height:30px;padding:0 12px;border:1px solid var(--wk-btn2-line);border-radius:999px;background:var(--wk-btn2);color:var(--wk-ink);font:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.ms-pr-ed{margin-top:4px}
.ms-pr-r{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 0 0 12px;border-bottom:1px solid var(--wk-line)}
.ms-pr-n{display:contents}
.ms-pr-n>span:first-child{order:1;flex:1;min-width:0}
.ms-pr-qb{order:2;flex:none;display:inline-flex;align-items:center;height:30px;border:1px solid var(--wk-field-line);border-radius:8px;background:var(--wk-field);overflow:hidden}
.ms-pr-qb input{width:44px;height:100%;box-sizing:border-box;padding:0 2px 0 6px;border:0;background:transparent;color:var(--wk-ink);font:inherit;font-weight:700;text-align:right;outline:none}
.ms-pr-qb input[aria-invalid="true"]{color:var(--wk-red)}
.ms-pr-qb span{padding:0 8px 0 3px;font-size:12px;color:var(--wk-mut)}
.ms-pr-qb:focus-within{border-color:var(--wk-brand);box-shadow:0 0 0 2px var(--wk-tint)}
.ms-pr-r.miss .ms-pr-qb{border-color:var(--wk-amber);background:var(--wk-amber-t)}
.ms-pr-sum{order:3;flex:none;width:84px;text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
/* Kate omistajalle ja ylläpitäjälle (dist/messages.js msPrKate). */
.ms-pr-kate{margin-left:8px;color:var(--wk-mut);font-size:12.5px;white-space:nowrap}
.ms-pr-k{display:block;font-size:11.5px;color:var(--wk-mut);line-height:1.2}
.ms-pr-x{order:4;flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-right:-6px;border:0;border-radius:8px;background:transparent;color:var(--wk-mut);cursor:pointer}
.ms-pr-x svg{width:16px;height:16px}
.ms-pr-x:hover{background:var(--wk-chip)}
.ms-pr-add{display:block;margin:8px 0 0 12px;max-width:calc(100% - 12px);height:32px;padding:0 14px;-webkit-appearance:none;appearance:none;border:1px solid var(--wk-line-2);border-radius:999px;background:var(--wk-btn2);color:var(--wk-link);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.ms-pr-undo,.ms-pr-warn{margin:8px 0 0 12px;font-size:12.5px;color:var(--wk-mut)}
.ms-pr-undo button{margin-left:2px;padding:0 4px;border:0;background:none;color:var(--wk-link);font:inherit;font-weight:700;cursor:pointer}
.ms-pr-warn{color:var(--wk-amber-ink)}
/* Vara hintaan (dist/messages.js msBufHtml): Ainion ✦-kysymys hintarivin alla, samat värit kuin hintarivillä. */
.ms-pr-buf{display:flex;gap:8px;align-items:flex-start;margin-top:6px;padding:10px 12px;border-radius:10px;background:var(--wk-ai);color:var(--wk-ai-fg);font-size:13.5px;line-height:1.45}
.ms-pr-buf>svg{width:13px;height:13px;flex:none;margin-top:3px}
.ms-pr-buf p{margin:0}
.ms-pr-bb{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.ms-pr-bb .ofw-btn{height:34px}
.ms-pr-warn button{margin-left:4px;height:26px;padding:0 10px;border:0;border-radius:999px;background:var(--wk-brand);color:#fff;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
@media (max-width:760px){
 .ms-pr-r{padding:4px 0 4px 4px}
 .ms-pr-n{display:flex;flex-direction:column;flex:1;min-width:0}
 .ms-pr-n>span:first-child{order:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .ms-pr-sum{order:0;width:auto;text-align:left;font-size:12.5px;font-weight:600;color:var(--wk-mut)}
 .ms-pr-add,.ms-pr-warn,.ms-pr-undo{margin-left:4px;max-width:calc(100% - 4px)}
}
.ms-dask{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:10px}
.ms-dask>span{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;color:var(--wk-mut)}
.ms-dask>span svg{width:13px;height:13px}
.ms-dask button{height:30px;padding:0 11px;border-radius:999px;border:1px solid var(--wk-line-2);background:var(--wk-card,#fff);color:var(--wk-ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.ms-dask button:disabled{opacity:.6;cursor:default}
.ms-dact{display:flex;gap:8px;margin-top:12px;align-items:center}
.ms-dact button{height:40px;padding:0 16px;border-radius:11px;border:1px solid var(--wk-line-2);background:var(--wk-btn2);color:var(--wk-ink);font:inherit;font-size:14px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.ms-dact .ms-dok{border:0;background:var(--acc-d,#2f5fa8);color:#fff;padding:0 20px}
.ms-dact .ms-dok svg{width:15px;height:15px}
.ms-dact .ms-dno{color:var(--wk-mut)}
.ms-dact .ms-dno svg{width:14px;height:14px}
.ms-dact .ms-dto{flex:1;min-width:0;font-size:12.5px;color:var(--wk-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-dact [data-ms-dedit]{display:none}
/* Varaa aika kalenteriin lähetyksen yhteydessä (wkBookRender, dist/work.js): kuplassa ja Luonnoksissa Lähetä-napin yläpuolella */
.wk-bk{margin-top:10px;padding:8px 12px 9px;border:1px solid var(--wk-line-2);border-radius:11px;background:var(--wk-inner);color:var(--wk-ink);font-size:13.5px}
.wk-bk label{display:flex;align-items:center;gap:8px;min-height:30px;cursor:pointer}
.wk-bk input{flex:none;width:17px;height:17px;margin:0;accent-color:var(--wk-green-ink);cursor:pointer}
html[data-theme="dark"] .wk-bk input{color-scheme:dark}
.wk-bk-on{font-weight:700}
.wk-bk-on svg{flex:none;width:15px;height:15px;color:var(--wk-link)}
.wk-bk-on b{font-weight:600;color:var(--wk-body)}
.wk-bk-ls{display:flex;flex-direction:column;margin:2px 0 0 25px}
.wk-bk-ls label{font-weight:500}
.wk-bk-n{margin:3px 0 0 25px;font-size:12px;line-height:1.4;color:var(--wk-mut)}
.ms-cbk{display:none;margin:0 0 8px}
.ms-mt.editing .ms-cbk:not([hidden]){display:block}
.dr-bk{margin:0 20px 12px}
@media (max-width:760px){.wk-bk label{min-height:38px}.wk-bk-on span{min-width:0;overflow-wrap:anywhere}.dr-bk{margin:0 14px 12px}}
@media (max-width:760px){
 /* listan rivillä Ainion luonnoksen alku (korvaa Luonnos valmis -merkin) */
 .ms-dpv{display:flex;gap:7px;align-items:flex-start;margin-top:7px;padding:7px 10px;border-radius:10px;border:1px dashed var(--acc-bd,#bcd0f0);background:var(--acc-t2,#f5f8fd);font-size:13.5px;line-height:1.4;color:var(--wk-body);white-space:normal}
 .ms-dpv svg{width:13px;height:13px;flex:none;margin-top:3px;color:var(--acc-d,#2f5fa8)}
 .ms-dpv>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 html[data-theme="dark"] .ms-dpv{border-color:rgba(143,179,236,.45);background:rgba(59,111,209,.12);color:#dbe6f7}
 html[data-theme="dark"] .ms-dpv svg{color:#8fb3ec}
 .ms-st2.ms-st2-hide{display:none}
 .ms-list{max-height:none!important;overflow:visible}
 .ms-it .ms-dot{top:18px;bottom:auto;right:12px}
 .ms-it .ms-r1{padding-right:14px}
 /* lista ja keskustelu eri näkymiä */
 .ms-body.m-open>.ms-l{display:none!important}
 .ms-body:not(.m-open)>.ms-mt{display:none!important}
 html.ms-open .top-area{display:none}
 .ms-mt.editing .ms-dbub{display:none}
 .ms-body.m-open>.ms-mt{min-height:calc(100dvh - 60px - env(safe-area-inset-bottom,0px))}
 .ms-body.m-open .ms-thr{flex:1}
 html.ms-open .wsb-tabbar,html.ms-open .chat-fab{display:none}
 /* S1: overflow:clip (ei hidden), jotta otsikkorivi pysyy ylhäällä, kun .app-shell vierittää */
 .ms-mt{border-radius:0;border-left:0;border-right:0;box-shadow:none;min-height:0;margin:-12px -12px 0;overflow:visible;overflow:clip}
 .ms-mth{position:sticky;top:0;z-index:5;background:var(--wk-panel);flex-wrap:wrap;padding:10px 12px;gap:8px 10px}
 /* Nimelle jää aina tilaa: jos napit (esim. Vastasin itse, Muistiinpanot ja Tarjous) eivät mahdu samalle riville, ne siirtyvät
    nimen alle omalle rivilleen (4.11.2026; ennen nimi puristui näkymättömiin ja osoite kirjain kerrallaan allekkain). */
 .ms-mth .ms-who{flex:1 1 120px;min-width:120px}
 .ms-mth .ms-who h2{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .ms-mth .ms-who p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 /* Hionta 19.10.2026: kanava ylärivillä, koko osoite tai numero kuvakkeen kanssa omalla rivillään (messages.js msWhoLine) */
 .ms-mth .ms-who p.has-h{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:6px;row-gap:1px;white-space:normal;overflow:visible}
 .ms-mth .ms-who p.has-h .ms-whoc{grid-column:1/-1;grid-row:1}
 .ms-mth .ms-who p.has-h svg{grid-column:1;grid-row:2;align-self:center}
 .ms-mth .ms-who p.has-h .ms-whoh{grid-column:2;grid-row:2;overflow-wrap:anywhere;margin-left:0}
 .ms-mth .ms-who p.has-h .ms-whos{display:none}
 .ms-mth .ms-lk{width:auto;margin-left:auto;flex:none}
 /* A2: otsikkorivin napit sormen kokoisiksi; ainoa nappi näyttää myös nimensä */
 .ms-mth .ms-lk .ms-lkc{min-height:40px;min-width:40px;justify-content:center;padding:0 12px;font-size:13px;border-radius:11px}
 .ms-mth .ms-lk .ms-lkc svg{width:15px;height:15px}
 .ms-mth .ms-lk .ms-lkc:only-child .ms-lkt{display:inline}
 .ms-mth:has(.ms-who p.has-h) .ms-lk .ms-lkc:only-child .ms-lkt{display:none}
 .ms-tf button{min-height:40px}
 .ms-tf .ms-ty{align-self:center}
 .ms-own,.ms-unown{min-height:44px}
 .ms-mt.has-dbub.editing .ms-snd:not(:disabled){background:#1e7f46}
 .ms-back{display:flex;align-items:center;justify-content:center;width:34px;height:40px;margin-left:-6px;border:0;background:transparent;color:var(--acc-d,#2f5fa8);cursor:pointer;flex:none}
 .ms-back svg{width:24px;height:24px}
 html[data-theme="dark"] .ms-back{color:#8fb3ec}
 .ms-thr{max-height:none;overflow:visible;padding:14px 12px}
 .ms-dta,.ms-dwhy,.ms-dask,.ms-dhint,.ms-dact .ms-dto{display:none}
 .ms-dtx{display:block}
 /* Sopimus muokataan puhelimellakin kuplassa: saate ja teksti näkyvät yhdessä hyväksyttäessä (ei Muokkaa-tilaa). */
 .ms-dbub.sign .ms-dta{display:block}
 .ms-dbub.sign .ms-dtx{display:none}
 .ms-dact [data-ms-dedit]{display:inline-flex}
 .ms-dact .ms-dno svg{display:none}
 .ms-dbub{display:block;align-self:flex-end;width:auto;max-width:94%;padding:10px 14px 12px;border:1.5px dashed var(--acc-bd,#9db9e8);border-radius:16px;border-bottom-right-radius:5px;background:var(--acc-t2,#f5f8fd)}
 html[data-theme="dark"] .ms-dbub{border-color:rgba(143,179,236,.55);background:rgba(59,111,209,.10)}
 .ms-dlab{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--acc-d,#2f5fa8)}
 html[data-theme="dark"] .ms-dlab{color:#8fb3ec}
 .ms-dlab svg{width:12px;height:12px}
 .ms-dlab em{font-style:normal;display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;background:#fdecea;color:#b3261e;letter-spacing:0;text-transform:none;font-size:11.5px}
 html[data-theme="dark"] .ms-dlab em{background:rgba(240,138,126,.14);color:#f08a7e}
 .ms-dtx{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.45;color:var(--wk-ink)}
 .ms-dact{display:flex;gap:8px;margin-top:12px}
 .ms-dact button{flex:1;padding:0 8px;height:40px;border-radius:11px;border:1px solid var(--wk-line-2);background:var(--wk-btn2);color:var(--wk-ink);font:inherit;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
 .ms-dact .ms-dok{flex:1.4;border:0;background:var(--acc-d,#2f5fa8);color:#fff}
 .ms-dact .ms-dok svg{width:15px;height:15px}
 .ms-dact .ms-dno{flex:.8;color:var(--wk-mut)}
 .ms-comp{position:sticky;bottom:0;z-index:5;padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px))}
 .ms-comp .ms-ct{display:none}
}
@media (max-width:760px){.wk-toast{left:12px;right:12px;max-width:none;width:auto;transform:translateY(20px)}.wk-toast.show{transform:none}}

/* Asiakkaan sähköpostin kuvat: pikkukuvat viestin alla, isona koskettamalla */
.wk-imgs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.wk-img{width:84px;height:84px;padding:0;border:1px solid var(--wk-line,#dfe3ea);border-radius:10px;overflow:hidden;background:var(--wk-inner,#eef1f5);cursor:zoom-in;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;color:var(--wk-mute,#667085)}
.wk-img img{width:100%;height:100%;object-fit:cover;display:block}
.wk-img-ph{width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);background-size:200% 100%;animation:wkImgPh 1.2s linear infinite}
@keyframes wkImgPh{from{background-position:200% 0}to{background-position:-200% 0}}
.wk-img.fail{cursor:default;padding:6px}
.wk-img.fail svg{width:18px;height:18px}
.wk-img.fail small{font-size:10px;line-height:1.25;text-align:center;overflow-wrap:anywhere;white-space:normal}
.wk-inote{display:flex;gap:7px;align-items:flex-start;margin-top:8px;padding:8px 10px;border-radius:10px;background:rgba(47,95,168,.08);color:var(--wk-ink);font-size:12.5px;line-height:1.45;white-space:normal}
.wk-inote svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--acc,#2f5fa8)}
.wk-lbox{position:fixed;inset:0;z-index:2000;background:rgba(10,14,22,.97);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom))}
.wk-lbox img{max-width:100%;max-height:calc(100% - 40px);object-fit:contain;border-radius:6px}
.wk-lbox-n{color:#fff;opacity:.8;font-size:13px;margin-top:10px;text-align:center;overflow-wrap:anywhere}
.wk-lbox-x{position:absolute;top:max(12px,env(safe-area-inset-top));right:12px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:18px;cursor:pointer}
@media (prefers-reduced-motion:reduce){.wk-img-ph{animation:none}}
/* Tarjouksen Matka-kortti (dist/travel.js) */
.tr-addr{display:flex;gap:8px;align-items:center;margin-top:8px}.tr-addr .in{flex:1;min-width:0;height:36px;border:1px solid #dfe1e6;border-radius:9px;padding:0 10px;font:inherit;background:#fff}
html[data-theme="dark"] .tr-addr .in{background:var(--wk-inner);border-color:rgba(255,255,255,.12);color:inherit}
.tr-own .in{flex:0 1 90px}.tr-own span{font-size:13px;color:var(--wk-mut,#6b7280)}
/* Kalenterin ajot (dist/travel.js) */
.cal-tr{position:absolute;left:12px;right:12px;border-radius:7px;background:repeating-linear-gradient(135deg,#fff4e0 0 6px,#fdebc8 6px 12px);display:flex;align-items:center;justify-content:center;overflow:hidden;pointer-events:none;z-index:1}
.cal-tr span{font-size:10.5px;font-weight:700;color:#8f600a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 4px}
.cal-tr-s span{font-size:9.5px;line-height:1}
.cal-k.k3{background:repeating-linear-gradient(135deg,#fff4e0 0 4px,#fdebc8 4px 8px)}
.cal-drv{display:block;font-size:10px;font-weight:700;color:#8f600a;white-space:nowrap}
.cal-why{display:block;font-size:11px;font-weight:700;color:var(--wk-mut);margin-top:2px}
.cal-route .cal-sh span{font-size:11.5px;color:var(--wk-dim)}
.cal-rs{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:start;padding:4px 0}
.cal-rs i{width:10px;height:10px;border-radius:50%;background:var(--acc,#2f5fa8);margin-top:4px}.cal-rs i.o{background:var(--wk-ink,#16202e)}
.cal-rs b{display:block;font-size:13px}.cal-rs span{font-size:11.5px;color:var(--wk-dim)}.cal-rs em{font-style:normal;font-size:12px;font-weight:700;color:var(--wk-link,#2f5fa8)}
.cal-rl{font-size:11.5px;font-weight:700;color:#8f600a;padding:2px 0 2px 22px}
.cal-rsum{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--wk-line);margin-top:8px;padding-top:10px;font-size:13px}.cal-rsum small{display:block;color:var(--wk-dim);font-size:11.5px}.cal-rsum b{font-family:var(--font-heading);font-size:19px;color:#8f600a}
.cal-tg,.cal-tw{border-radius:12px;padding:10px 12px;margin-top:8px;font-size:12.5px;line-height:1.45}
.cal-tg{background:#f1faf4;border:1px solid #bfe3cc;color:var(--wk-body)}.cal-tg b{display:block;color:#1f7a45}
/* Ainio optimoi ajot: ehdotus on nappi, joka avaa saman Ainion ehdotus -paneelin kuin kalenteriruudukossa (calOpenSug). */
button.cal-tg{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font:inherit;font-size:12.5px;line-height:1.45;cursor:pointer}
button.cal-tg>span{flex:1;min-width:0}button.cal-tg>svg{width:18px;height:18px;flex-shrink:0;color:#1f7a45;stroke-width:2}
button.cal-tg:hover{border-color:#8fcfa8}html[data-theme="dark"] button.cal-tg>svg{color:#6fd39b}
.cal-tw{background:#fdf6f5;border:1px solid #f3cfcc;color:var(--wk-body)}.cal-tw b{display:block;color:#c43d35}
.cal-tsv{font-size:12.5px;color:var(--wk-body);margin:4px 0 0}
html[data-theme="dark"] .cal-tr{background:repeating-linear-gradient(135deg,rgba(197,138,29,.16) 0 6px,rgba(197,138,29,.26) 6px 12px)}
html[data-theme="dark"] .cal-tr span,html[data-theme="dark"] .cal-drv,html[data-theme="dark"] .cal-rl,html[data-theme="dark"] .cal-rsum b{color:#f0c877}
html[data-theme="dark"] .cal-tg{background:rgba(46,155,92,.1);border-color:rgba(46,155,92,.35)}html[data-theme="dark"] .cal-tg b{color:#6fd39b}
html[data-theme="dark"] .cal-tw{background:rgba(196,61,53,.1);border-color:rgba(196,61,53,.35)}html[data-theme="dark"] .cal-tw b{color:#f08f88}
/* Sivupalkin kortit kahtena pinona: kapealla näytöllä kortit ovat kahdessa sarakkeessa päällekkäin ilman aukkoja. */
.cal-sa{display:flex;flex-direction:column;gap:14px;min-width:0}
.cal-sa:empty{display:none}
/* S8: Tulevat-kortti on tietokoneella piilossa (.cal-next); jos se on pinon ainoa kortti, pino piilotetaan kuten tyhjä pino, jotta väli ei kasva. */
@media (min-width:761px){.cal-sa:has(>.cal-next:only-child){display:none}}
.cal-tg+.cal-sp,.cal-tw+.cal-sp{margin-top:14px}
/* Avoimet tarjoukset: kapeammalla näytöllä koko leveydellä sivupalkin alla, tarjoukset ruudukkona. */
.cal-ofl{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 12px;align-items:start}
@media (max-width:1599px){.cal-ofc{grid-column:1/-1}}
/* Kahden sarakkeen näkymässä pinot ovat yhtä korkeat: kummankin viimeinen kortti venyy, ettei väliin jää rakoa. */
@media (max-width:1599px) and (min-width:761px){.cal-sa{align-self:stretch}.cal-sa>.cal-sc:last-child{flex:1}.cal-sa>.cal-sc:has(+.cal-next:last-child){flex:1}}
.cal-route{display:flex;flex-direction:column}.cal-route .cal-rsum{margin-top:auto}
/* Kenen aikataulu (Yhteinen / Oma / työkaveri) kalenterin yläpalkissa */
/* Kalenterin yläreuna yhdellä rivillä ja yksi valinta "kenen keikat" (kaverin palaute 6.10.2026). */
.cal-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin:16px 0 0;color:rgba(255,255,255,.86);font-size:15px}
.cal-line b{color:#fff;font-weight:700}
.cal-line .cal-mbar{width:120px;margin:0}
.cal-sug{display:inline-flex;align-items:center;gap:6px;color:#bcd3ff}
.cal-sug svg{width:15px;height:15px;stroke-width:2}
.cal-whos select{appearance:auto;font:inherit;font-weight:700;font-size:14px;padding:8px 12px;border-radius:11px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;max-width:200px;transition:background .15s}
.cal-whos select:hover{background:rgba(255,255,255,.16)}
.cal-whos option{color:#16202e;background:#fff}
@media (max-width:760px){.cal-whos,.cal-whos select{width:100%;max-width:none}}
.cal-asel{width:100%;height:38px;border:1px solid var(--wk-line-2);border-radius:10px;padding:0 10px;font:inherit;background:var(--wk-panel);color:inherit}
/* Yhteinen näkymä: tekijän väri tapahtuman reunassa, merkitsemättömät harmaalla */
.cal-ev.wc{border-left-color:var(--wc)!important;background:color-mix(in srgb,var(--wc) 9%,var(--wk-panel))}
.cal-ev.wn{border-left-color:#aab3c2!important}
.cal-wl{display:flex;gap:14px;flex-wrap:wrap;margin-left:auto}.cal-wl span{display:flex;align-items:center;gap:6px}
.cal-wl i{width:10px;height:10px;border-radius:50%;display:inline-block}.cal-wl i.none{background:#aab3c2}
/* Kapea keikka yhteisessä näkymässä: tekijän nimi pystyssä, tiedot kuplassa */
.cal-evc{padding:6px 2px!important;display:flex;align-items:flex-start;justify-content:center;overflow:hidden}
.cal-evc .cal-cn{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:700;color:var(--wc,var(--wk-dim));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-height:100%}
.cal-evc.wn .cal-cn{color:var(--wk-dim)}
.cal-tip{position:fixed;z-index:60;max-width:260px;background:#16202e;color:#fff;border-radius:12px;padding:10px 12px;font-size:12.5px;line-height:1.4;box-shadow:0 12px 28px -8px rgba(0,0,0,.45);pointer-events:none}
.cal-tip .cal-tw2{display:flex;align-items:center;gap:7px;margin-bottom:6px}.cal-tip .cal-tw2 i{font-style:normal;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:9.5px;font-weight:700;color:#fff}.cal-tip .cal-tw2 i.none{background:#6b7690}
.cal-tip .cal-tw2 small{color:#aab3c2;font-size:11px}
.cal-tip .cal-tt{font-weight:700;color:#9dc0f2}.cal-tip .cal-tn{font-weight:700;margin:1px 0 3px}
.cal-tip .cal-tl{color:#c7d0de;display:flex;gap:5px;align-items:flex-start}.cal-tip .cal-tl svg{width:12px;height:12px;flex-shrink:0;margin-top:2px;fill:none;stroke:currentColor;stroke-width:2}
/* Veljen lista 1.10.2026: kalenterin päivän reitti (1) ja Ainion ehdotuksen kortti (2) */
.cal-dh[data-cal-day]{cursor:pointer;transition:background .15s}
.cal-dh[data-cal-day]:hover,html[data-theme="dark"] .cal-dh.we[data-cal-day]:hover{background:var(--wk-tint,rgba(47,95,168,.08))}
.cal-dh[data-cal-day]:focus-visible{outline:2px solid var(--wk-brand,#2f5fa8);outline-offset:-2px}
.cal-dh .cal-dr{display:inline-flex;align-items:center;gap:3px;margin-top:4px;padding:3px 8px;border-radius:99px;background:var(--wk-tint,rgba(47,95,168,.08));font:700 11px/1 var(--font-body);letter-spacing:0;color:var(--wk-link,#2f5fa8)}
.cal-dr svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}
.cal-prr{padding:6px 0!important}
.cal-prs{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;padding:10px 14px;border:0;background:transparent;text-align:left;font:inherit;color:var(--wk-ink);border-radius:10px}
button.cal-prs{cursor:pointer}button.cal-prs:hover{background:var(--wk-tint,rgba(47,95,168,.06))}
.cal-prs>i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--wk-brand,#2f5fa8);color:#fff;font:700 12.5px/1 var(--font-body);font-style:normal}
.cal-prs.home>i{background:var(--wk-inner,#eef1f5);color:var(--wk-mut)}
.cal-prs.sug>i{background:transparent;border:1.5px dashed var(--wk-brand,#2f5fa8);color:var(--wk-brand,#2f5fa8)}
.cal-prs>i svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.cal-prs b{display:block;font-size:14px}.cal-prs b small{font-size:11px;font-weight:600;color:var(--wk-link,#2f5fa8)}
.cal-prs span{display:block;font-size:12.5px;color:var(--wk-mut)}
.cal-prs em{font-style:normal;font-weight:700;font-size:13px;color:var(--wk-link,#2f5fa8);white-space:nowrap}
.cal-prl{display:flex;align-items:center;gap:6px;padding:2px 14px 2px 52px;font-size:12px;color:var(--wk-mut)}
.cal-prl svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;transform:rotate(90deg)}
.cal-prsum b{font:700 22px/1.2 var(--font-heading);color:var(--wk-ink);display:block}.cal-prsum span{font-size:13px;color:var(--wk-mut)}
.cal-sugnote{display:flex;gap:10px;align-items:flex-start;background:var(--wk-tint,rgba(47,95,168,.06))!important}
.cal-sugnote>svg{width:18px;height:18px;flex:none;stroke:var(--wk-link,#2f5fa8);fill:none;stroke-width:2;margin-top:2px}
.cal-sugnote p{font-size:13.5px;color:var(--wk-ink);margin:0}
.cal-kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 16px;margin:0;font-size:13.5px}
.cal-kv dt{color:var(--wk-mut)}.cal-kv dd{margin:0;color:var(--wk-ink)}
.cal-kv b.g{color:#178755}.cal-kv b.r{color:#d34242}
.cal-sugbtns{display:flex;flex-direction:column;gap:8px}
.cal-sugbtns button{display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:10px;border:1px solid var(--wk-line-2);background:var(--wk-panel);color:var(--wk-ink);font:600 14px/1 var(--font-body);cursor:pointer;text-align:left}
.cal-sugbtns button.p{background:var(--wk-brand,#2f5fa8);color:#fff;border-color:transparent}
.cal-sugbtns button:disabled{opacity:.6;cursor:default}
.cal-sugbtns svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
/* Paras yhdistelmä -merkintä kannattavuusennusteessa (3) ja Tarjoukset ja laskut -välilehdet (8) */
/* Ainion oma huomio (✦): haalea sininen, ei reunaa eikä hover-tilaa, jottei se näytä painettavalta (6.10.2026). */
.of-best{display:inline-flex;align-items:center;gap:8px;margin:8px 0 4px;padding:7px 14px 7px 10px;border-radius:99px;background:var(--wk-ai);color:var(--wk-ai-fg);font:700 14px/1.2 var(--font-heading)}
.of-best svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.of-best.sm{margin:0 0 0 10px;padding:4px 10px 4px 8px;font-size:12px}
/* Puhelimella välilehdet jakavat rivin tasan, jotta kaikki (myös Laskut) näkyvät ilman vieritystä. */
/* Tarjousten suodattimet jakavat rivin puhelimella, joten kaikki viisi näkyvät kokonaan (Kaikki ei katkea). */
@media (max-width:640px){.of-chips{flex:1 1 100%;gap:2px}.of-chips button{flex:1 1 auto;padding:0 4px;font-size:12px;gap:3px}.of-chips button em{font-size:10.5px}}
@media (max-width:379px){.of-chips button{padding:0 2px;font-size:11.5px}.of-chips button em{font-size:10px}}
/* Neljä välilehteä (Asiakkaat mukana) puhelimella kahdessa rivissä, jotta kaikki nimet mahtuvat kokonaan. */
/* Viestit: lähetetty viesti jää näkyviin (4) ja maksumuistutuksen laskunapit */
.ms-sentok{display:flex;gap:12px;align-items:flex-start;margin:14px 0 4px auto;max-width:560px;padding:14px 16px;border-radius:14px;background:var(--wk-green-t,#e9f8f0);color:var(--wk-ink);border:1px solid rgba(23,135,85,.25)}
.ms-sentok>svg{width:20px;height:20px;stroke:#178755;fill:none;stroke-width:2.2;flex:none;margin-top:2px}
.ms-sentok b{display:block;font-size:14.5px}
.ms-sentok span{display:block;font-size:13px;color:var(--wk-mut);margin-top:3px}
.ms-nextmsg{display:inline-flex;align-items:center;gap:6px;margin-top:10px;height:36px;padding:0 14px;border-radius:10px;border:1px solid var(--wk-line-2);background:var(--wk-panel);color:var(--wk-ink);font:600 13px/1 var(--font-body);cursor:pointer}
.ms-nextmsg svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.ms-infob{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px;padding-top:10px;border-top:1px dashed var(--wk-line-2)}
.ms-infob button{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;border-radius:10px;border:1px solid var(--wk-line-2);background:var(--wk-panel);color:var(--wk-ink);font:600 13.5px/1 var(--font-body);cursor:pointer}
.ms-infob button.p{background:var(--wk-brand,#2f5fa8);border-color:transparent;color:#fff}
.ms-infob button:disabled{opacity:.6;cursor:default}
.ms-infob svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.cal-trt{display:inline-flex;align-items:center;gap:5px;margin-left:auto;height:30px;padding:0 10px;border-radius:99px;border:1px solid var(--wk-line-2);background:var(--wk-tint,rgba(47,95,168,.08));color:var(--wk-link,#2f5fa8);font:700 12px/1 var(--font-body);cursor:pointer;transition:box-shadow .15s}
.cal-trt:hover{box-shadow:inset 0 0 0 1px var(--hv-ring)}
.cal-trt svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}

/* C8 (käytettävyystesti 4.10.2026): kolme lukua, Tukkulista-nappi yläreunassa, värien selitys ruudukon kulman ?-napin
   takana ja Ainion ehdotukset -osio (avoimet tarjoukset, Täytä päivä, ajot), joka aukeaa yhdellä painalluksella. */
.cal-shopb{height:38px;display:flex;align-items:center;gap:7px;padding:0 13px;border-radius:11px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.cal-shopb:hover{background:rgba(255,255,255,.14)}
.cal-shopb svg{width:15px;height:15px;stroke-width:2}
.cal-shopb i{font-style:normal;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#f0c877;color:#3d2a05;font-size:11.5px;display:grid;place-items:center}
.cal-calc{position:relative}
.cal-lgb{width:30px;height:30px;border-radius:50%;border:1px solid var(--wk-line-2);background:var(--wk-panel);color:var(--wk-link);font:700 15px/1 var(--font-body);cursor:pointer}
.cal-lgb:hover,.cal-lgb[aria-expanded="true"]{background:var(--wk-tint);border-color:var(--acc,#3b6fd1)}
.cal-lgp{position:absolute;top:72px;left:12px;z-index:30;width:min(330px,calc(100% - 24px));background:var(--wk-panel);border:1px solid var(--wk-line-2);border-radius:14px;box-shadow:0 18px 40px -12px rgba(16,24,40,.35);padding:12px 14px 14px}
.cal-lgp[hidden]{display:none}
.cal-lgph{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.cal-lgph b{font-size:13.5px;color:var(--wk-ink)}
.cal-lgph button{width:28px;height:28px;border:0;border-radius:8px;background:none;color:var(--wk-dim);cursor:pointer;display:grid;place-items:center}.cal-lgph button:hover{background:var(--wk-tint)}
.cal-lgph button svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.cal-lgp .cal-lgd{flex-direction:column;gap:9px}
.cal-lgp .cal-wl{margin:2px 0 0;padding-top:9px;border-top:1px solid var(--wk-line);gap:8px 14px}
.cal-aie{min-width:0}
.cal-aieh{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;border:1px solid var(--wk-line);border-radius:18px;background:var(--wk-panel);box-shadow:var(--wk-shadow);font:inherit;color:inherit;text-align:left;cursor:pointer}
.cal-aieh:hover,.cal-aie.open .cal-aieh{border-color:rgba(var(--acc-rgb,59,111,209),.4)}
.cal-aiic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--wk-tint);color:var(--wk-link);flex-shrink:0}
.cal-aiic svg{width:18px;height:18px}
.cal-aiet{flex:1;min-width:0}.cal-aiet b{display:block;font-size:15px;color:var(--wk-ink)}.cal-aiet small{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:2px}
.cal-aieb{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;color:var(--wk-link);white-space:nowrap}
.cal-aieb svg{width:15px;height:15px;stroke-width:2;transform:rotate(90deg);transition:transform .15s}
.cal-aie.open .cal-aieb svg{transform:rotate(-90deg)}
.cal-aib{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.cal-aib[hidden],.cal-of[hidden],.cal-ofm[hidden]{display:none}
.cal-aix{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;align-items:start}
.cal-aix:not(:has(>:not([hidden]))){display:none}
.cal-ofm{display:block;width:100%;margin-top:10px;height:36px;border:1px dashed var(--wk-line-2);border-radius:10px;background:none;color:var(--wk-link);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.cal-ofm:hover{background:var(--wk-tint)}
@media (max-width:1599px){.cal-aie{grid-column:1/-1}}
@media (max-width:1599px) and (min-width:761px){.cal-sa.solo{grid-column:1/-1}}
/* Puhelimella Tukkulista-napissa on vain kärry ja luku kulmassa, jotta viikon nuolet, Tukkulista ja Uusi tapahtuma mahtuvat samalle riville. */
@media (max-width:560px){.cal-ctl{gap:8px}.cal-shopb{position:relative;width:40px;padding:0;justify-content:center}.cal-shopb span{display:none}
 .cal-shopb i{position:absolute;top:-7px;right:-7px;min-width:19px;height:19px;padding:0 5px;font-size:10.5px}}
/* Puhelimella (2.10.2026, R1 ja R2): kalenterin luvut yhtenä kapeana laatikkona, jotta päivän keikat näkyvät heti;
   tarjouslistan otsikko ja ohjeteksti pois, koska Avoimet-suodatin kertoo saman ja tarjouksia mahtuu ruutuun kaksi. */
@media (max-width:640px){
 .cal-line{gap:2px 14px;margin-top:14px}
 .cal-line .cal-mbar{display:none}
 .of-ohd{display:none}
}
/* Tarjous PDF:nä (dist/offers.js opdf*): kortti tarjouksen paneelissa ja liite tarjousviestin vieressä. */
.op-row{display:flex;gap:14px;align-items:flex-start}
.op-thumb{flex:none;display:flex;flex-direction:column;gap:4px;width:52px;height:68px;box-sizing:border-box;padding:8px 7px;border:1px solid var(--wk-line-2);border-radius:5px;background:#fff;box-shadow:0 1px 3px rgba(16,24,40,.1)}
.op-thumb i{display:block;height:2px;border-radius:1px;background:#d5dae2}
.op-thumb i.h{width:60%;height:4px;margin-bottom:2px;background:#16202e}
.op-thumb i.s{width:65%}
.op-thumb i.r{margin-left:45%}
html[data-theme="dark"] .op-thumb{border-color:transparent;background:#e9edf3}
.op-main{flex:1;min-width:0}
.op-name{display:block;font-size:14px;line-height:1.35;color:var(--wk-ink);overflow-wrap:anywhere}
.op-meta{display:block;margin-top:3px;font-size:12.5px;color:var(--wk-mut)}
.op-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.op-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border:1px solid var(--wk-line-2);border-radius:10px;background:var(--wk-btn2);color:var(--wk-link);font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.op-btn svg{width:15px;height:15px;stroke-width:2}
.op-lang{margin-top:12px;display:grid;gap:2px}
.op-lang>label:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;font-weight:600;color:var(--wk-ink)}
.op-lang select{min-height:40px;padding:6px 10px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:14px}
.op-lang .op-chk{margin-top:8px;font-weight:600}
.op-chk{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:14px;font-weight:700;color:var(--wk-ink);cursor:pointer}
.op-chk input{width:18px;height:18px;margin:0;accent-color:var(--wk-brand)}
.op-warn{display:flex;gap:6px;align-items:flex-start}
.op-warn svg{flex:none;width:14px;height:14px;margin-top:1px}
.op-days{display:block;margin-top:8px}
.op-chip-w{margin-top:10px}
.op-chip-w:empty,.op-chip-w.op-comp{display:none}
.op-chip{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--wk-line-2);border-radius:12px;background:var(--wk-inner)}
.op-pdf{flex:none;display:flex;align-items:flex-end;justify-content:center;width:34px;height:40px;padding-bottom:6px;box-sizing:border-box;border-radius:6px;background:#c8372d;color:#fff;font-size:10px;font-weight:800;letter-spacing:.04em}
.op-ct{flex:1;min-width:0}
.op-ct b{display:block;font-size:13.5px;color:var(--wk-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.op-ct small{display:block;margin-top:2px;font-size:12px;color:var(--wk-mut)}
.op-pv{flex:none;padding:6px;border:0;background:none;color:var(--wk-link);font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.op-x{flex:none;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;border-radius:8px;background:none;color:var(--wk-mut);cursor:pointer}
.op-x:hover{background:var(--wk-line)}
.op-x svg{width:15px;height:15px;stroke-width:2.2}
.op-add{display:inline-flex;align-items:center;gap:6px}
.op-add svg{width:14px;height:14px}
/* Hyväksyntälinkki (dist/offers.js olAdd, olCardHtml): viestin alla ja Tarjous PDF:nä -kortissa. */
.ol-add,.ol-in{margin-left:16px}
/* Hyväksyntälinkki näkyvänä napina ja perusteluna, ei pienenä tekstilinkkinä (käytettävyyskatselmus 4.10.2026). */
.ol-offer{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin-top:10px}
.ol-offer .ol-add{margin-left:0}
.op-chip-w>.ol-add:first-child,.op-chip-w>.ol-in:first-child{margin-left:0}
.op-chip+.ol-add,.op-chip+.ol-in{margin:8px 0 0}
.ol-in{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--wk-green-ink)}
.ol-in svg{width:14px;height:14px}
/* Ehdotettu aika hyväksyntälinkissä (dist/offers.js olSlotHtml) ja sen vaihto. */
.ol-slot{display:flex;align-items:flex-start;gap:8px;margin-top:8px;padding:8px 10px;border:1px solid var(--wk-line);border-radius:10px;font-size:13px}
.ol-slot>svg{width:16px;height:16px;flex:none;margin-top:1px;color:var(--wk-link)}
.ol-slot>span{flex:1;min-width:0}.ol-slot small{display:block;color:var(--wk-mut,#667085);font-size:12px;margin-top:2px}
.ol-slot .text-btn{flex:none}
.ol-slots{display:flex;flex-direction:column;gap:8px}
.wk-dlg-bd .ol-sl{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--wk-ink);padding:10px 12px;border:1px solid var(--wk-line);border-radius:10px;cursor:pointer}
.wk-dlg-bd .ol-sl input{width:18px;height:18px;padding:0;margin:2px 0 0;flex:none;accent-color:var(--wk-link)}.ol-sl small{display:block;color:var(--wk-mut,#667085);font-size:12px;font-weight:400}
.wk-dlg-bd .ol-sl:has(input:checked){border-color:var(--wk-link);box-shadow:inset 0 0 0 1px var(--wk-link)}
.ol-sec{margin-top:14px;padding-top:12px;border-top:1px solid var(--wk-line)}
.ol-h{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--wk-ink)}
.ol-h svg{width:15px;height:15px}
.ol-out{margin-top:10px}
.ol-row{display:flex;gap:8px;align-items:center}
.ol-url{flex:1;min-width:0;height:36px;padding:0 10px;border:1px solid var(--wk-field-line);border-radius:9px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:13px}
.ol-out small{display:block;margin-top:6px}
.ol-ok{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:12px 14px;border-radius:12px;background:var(--wk-green-t);color:var(--wk-green-ink)}
.ol-ok svg{flex:none;width:18px;height:18px;margin-top:1px}
.ol-ok b{display:block;font-size:14px}.ol-ok small{display:block;margin-top:2px;font-size:12.5px}
.ol-warn{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:var(--wk-amber-t);color:var(--wk-amber-ink);font-size:13px}
/* Tarjouksen lisävalinnat (dist/offers.js ooPaint): asiakas valitsee hyväksyntälinkistä. */
.oo-card .of-muted{margin:0 0 8px}
.oo-row{align-items:flex-start}.oo-row>span{flex:1}.oo-row b{text-align:right}
.oo-del{flex:none;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin:-6px -6px 0 0;border:0;border-radius:8px;background:none;color:var(--wk-mut);cursor:pointer}
.oo-del:hover{background:var(--wk-btn2);color:var(--wk-ink)}.oo-del svg{width:14px;height:14px}
.oo-add{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.oo-add input{height:36px;padding:0 10px;border:1px solid var(--wk-field-line);border-radius:9px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:13.5px}
.oo-add [data-oo-text]{flex:1 1 220px;min-width:0}.oo-add [data-oo-price]{flex:0 0 110px;width:110px}
.jw-dform .jw-dl{display:grid;gap:4px;margin:8px 0}.jw-dl>span{font-size:12px;font-weight:600;color:var(--wk-mut)}.jw-dl input,.jw-dl textarea{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--wk-field-line);border-radius:9px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:13.5px;resize:vertical}
.jw-dent{margin:6px 0;padding:8px 10px;border-radius:9px;background:var(--wk-btn2)}.jw-dent summary{cursor:pointer;display:flex;flex-direction:column;gap:2px;list-style:none}.jw-dent summary small{color:var(--wk-mut)}.jw-dent p{margin:6px 0 0;font-size:13.5px;white-space:pre-line}.jw-dent p span{display:inline-block;min-width:88px;color:var(--wk-mut)}
@media (max-width:760px){.jw-dl input,.jw-dl textarea{font-size:16px}}
/* Aliurakoitsijat (dist/job-work.js jwSubPaint): tilausrivit, tilakieli, työtilauksen teksti ja tilauslomake. */
.jw-srow{margin:6px 0;padding:8px 10px;border-radius:9px;background:var(--wk-btn2)}.jw-srow summary{cursor:pointer;display:flex;align-items:center;gap:10px;list-style:none}.jw-srow summary::-webkit-details-marker{display:none}
.jw-sl{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.jw-sl small{color:var(--wk-mut)}
.jw-sc{flex:none;padding:3px 9px;border-radius:99px;font-size:11.5px;font-weight:600;white-space:nowrap}.jw-sc.w{background:var(--amber-soft);color:var(--ink)}.jw-sc.y{background:var(--green-soft);color:var(--green)}.jw-sc.r{background:var(--red-soft);color:var(--red)}
.jw-stext{margin:6px 0 0;padding:10px 12px;border-radius:9px;background:var(--surface);border:1px solid var(--line);font:inherit;font-size:13px;line-height:1.5;white-space:pre-wrap;word-break:break-word;user-select:all}
.jw-sbtns{grid-template-columns:1fr auto}.jw-sbtns .jw-go{width:auto}
.jw-sinv{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end;margin-top:8px}.jw-sinv .jw-dl{margin:0}.jw-sinv .jw-sec{min-height:42px;font-size:14px;padding:0 12px}
.jw-sdel{margin-top:4px}.jw-sdel .jw-link{color:var(--muted)}
.jw-sadd{margin-top:10px;padding-top:4px;border-top:1px solid var(--line)}.jw-sadd .jw-dl{margin:8px 0}.jw-sadd select{width:100%;box-sizing:border-box;min-height:42px;padding:8px 10px;border:1px solid var(--wk-field-line);border-radius:9px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:13.5px}
.jw-s3{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px}.jw-snew{padding:4px 10px 6px;border-radius:9px;background:var(--wk-btn2)}
@media (max-width:760px){.jw-sadd select,.jw-sinv input{font-size:16px}.jw-s3{grid-template-columns:1fr}}
.ov-add [data-ov-label]{flex:0 0 140px;width:140px}.ov-add [data-ov-text]{flex:1 1 240px;min-width:0}.ov-add [data-ov-price]{flex:0 0 150px;width:150px}
@media (max-width:760px){.oo-add input{height:44px;font-size:16px}.oo-add .op-btn{height:44px}.oo-del{width:44px;height:44px;margin:-12px -10px 0 0}}
/* Puhelimen Muokkaa-tilassa kupla on piilossa, joten liite näkyy vastauskentän alla. */
@media (max-width:760px){.ms-mt.editing .op-chip-w.op-comp:not(:empty){display:block;margin:8px 0 0}.op-chip{gap:10px}.op-pv{padding:6px 4px}}
/* Tarjous hyväksytty – varaa aika (dist/work.js openBooking): kuittaus ja Ainion ehdottamat vapaat ajat. */
.wk-bk-ok{display:flex;gap:9px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:var(--wk-green-t);color:var(--wk-green-ink);font-size:13.5px;font-weight:600;line-height:1.4}
.wk-bk-ok svg{width:16px;height:16px;flex:none;margin-top:1px;stroke-width:2.4}
.wk-bk-note{margin:0;padding:10px 12px;border-radius:12px;background:var(--wk-amber-t);color:var(--wk-amber-ink);font-size:13.5px;font-weight:600;line-height:1.4}
.wk-bk-sg>p{margin:0 0 6px;font-size:12.5px;font-weight:700;color:var(--wk-ink)}
/* Ainion täyttämä osoite varausikkunassa (6.10.2026): sininen kehys ja selite, jotta sen huomaa tarkistaa. */
.wk-bk-pre input{border-color:var(--wk-link)!important;box-shadow:0 0 0 3px var(--wk-tint)}
.wk-bk-pre small{display:block;margin-top:4px;font-size:12.5px;font-weight:500;color:var(--wk-mut)}
.wk-bk-sg>div{display:flex;flex-direction:column;gap:6px}
.wk-bk-sg button{display:flex;text-align:left;border:1px solid var(--wk-line-2);background:var(--wk-panel);border-radius:11px;padding:9px 12px;font:inherit;font-size:13.5px;line-height:1.35;color:var(--wk-ink);cursor:pointer}
.wk-bk-sg button:hover{border-color:var(--wk-link)}
.wk-bk-sg button.on{border-color:var(--wk-link);box-shadow:0 0 0 2px var(--wk-tint)}
.wk-bk-sg small{display:block;margin-top:1px;color:var(--wk-mut);font-size:12px;font-weight:500}
/* Asiakkaat ja asiakaskortti (dist/customers.js). */
.cu-card{background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:18px;padding:20px 22px;box-shadow:var(--wk-shadow)}
.cu-card h3{display:flex;align-items:center;gap:8px;margin:0;font-size:19px;color:var(--wk-ink);font-family:var(--font-heading)}
.cu-card h3 svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.cu-lead{margin:4px 0 0;font-size:13.5px;line-height:1.45;color:var(--wk-mut)}
.cu-mut{margin:8px 0 0;font-size:12.5px;line-height:1.45;color:var(--wk-mut)}
.cu-empty{margin:16px 0 4px;font-size:14px;color:var(--wk-mut)}
.cu-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.cu-chips{display:flex;flex-wrap:wrap;gap:6px}
.cu-chips button{border:1px solid var(--wk-line-2);border-radius:999px;padding:6px 12px;font:600 13px/1.2 var(--font-body);color:var(--wk-mut);background:var(--wk-panel);cursor:pointer}
.cu-chips button b{font-weight:800;margin-left:2px}
.cu-chips button.on{background:var(--wk-ink);color:var(--wk-panel);border-color:transparent}
.cu-search{display:flex;align-items:center;gap:7px;min-width:min(280px,100%);height:38px;padding:0 11px;border:1px solid var(--wk-field-line,var(--wk-line-2));border-radius:10px;background:var(--wk-field,var(--wk-panel));color:var(--wk-mut)}
.cu-search svg{width:15px;height:15px;flex:none;stroke:currentColor;fill:none;stroke-width:2}
.cu-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--wk-ink);font:inherit;font-size:14px;outline:0}
.cu-search:focus-within{border-color:var(--wk-brand);box-shadow:0 0 0 3px rgba(var(--acc-d-rgb,47,95,168),.25)}
.cu-tbl{width:100%;border-collapse:collapse;margin-top:14px;font-size:13.5px;color:var(--wk-ink)}
.cu-tbl th{text-align:left;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--wk-dim);font-weight:700;padding:10px 12px;background:rgba(127,140,160,.10)}
.cu-tbl th:first-child{border-radius:10px 0 0 10px}.cu-tbl th:last-child{border-radius:0 10px 10px 0}
.cu-tbl td{padding:12px;border-top:1px solid var(--wk-line);vertical-align:top}
.cu-tbl tbody tr{cursor:pointer}
.cu-tbl tbody tr:hover td,.cu-tbl tbody tr:focus-visible td{background:var(--wk-tint)}
.cu-tbl tbody tr:focus-visible{outline:2px solid var(--wk-brand);outline-offset:-2px}
.cu-tbl td small{display:block;color:var(--wk-mut);font-size:12.5px;margin-top:2px}
.cu-tbl .r{text-align:right;white-space:nowrap}
.cu-ago{color:var(--wk-mut)}
.cu-pill{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;border-radius:999px;padding:2px 9px;border:1px solid var(--wk-line-2);color:var(--wk-mut);white-space:nowrap}
.cu-pill.g{background:var(--wk-green-t);color:var(--wk-green-ink);border-color:transparent}
.cu-pill.a{background:var(--wk-amber-t);color:var(--wk-amber-ink);border-color:transparent}
.cu-pill.r{background:var(--wk-red-t);color:var(--wk-red-ink,#c4302a);border-color:transparent}
.cu-pill.b{background:var(--wk-tint);color:var(--wk-link);border-color:transparent}
.cu-row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--wk-line);font-size:13.5px;color:var(--wk-ink)}
.wk-pcard h4+.cu-row,.cu-sub+.cu-row{border-top:0;padding-top:0}
.cu-row>span{min-width:0;overflow-wrap:anywhere}.cu-row small{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:1px}
/* Huoltomuistutukset ja tarjoukset -rivin valinta (dist/customers.js cuMkHtml): vaihtoehdot rivin alla, selitys niiden alla. */
.cu-mk .wk-seg{margin:2px 0 8px}.cu-mk>.cu-mut{margin:0 0 10px}
.cu-row>b{white-space:nowrap}
.cu-sub{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--wk-dim);margin:12px 0 6px}
.wk-pcard h4+.cu-sub{margin-top:0}
.cu-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:6px}
.cu-tiles>div{border:1px solid var(--wk-line);border-radius:11px;padding:9px 10px;background:var(--wk-inner,var(--wk-panel))}
.cu-tiles span{display:block;font-size:11.5px;color:var(--wk-mut);font-weight:600}
.cu-tiles b{display:block;font-size:16px;color:var(--wk-ink);margin-top:2px;font-family:var(--font-heading)}
.cu-tiles small{display:block;font-size:11.5px;color:var(--wk-mut)}
.cu-tiles .a b{color:var(--wk-amber-ink)}.cu-tiles .r b{color:var(--wk-red)}.cu-tiles .g b{color:var(--wk-green-ink)}
.cu-ai{display:flex;gap:10px;align-items:flex-start;border-radius:11px;padding:10px 12px;background:var(--wk-tint);color:var(--wk-ink);font-size:13.5px;margin-top:10px}
.cu-ai svg{width:16px;height:16px;flex:none;color:var(--wk-link);margin-top:2px;stroke:currentColor;fill:none;stroke-width:2}
.cu-ai b{display:block}
.cu-note{border:1px solid var(--wk-line);border-radius:11px;padding:9px 11px;margin-top:8px;background:var(--wk-inner,var(--wk-panel))}
.cu-note p{margin:0;font-size:13.5px;line-height:1.45;color:var(--wk-ink);white-space:pre-wrap;overflow-wrap:anywhere}
.cu-note small{display:block;font-size:11.5px;color:var(--wk-mut);margin-top:3px}
.cu-in{display:flex;gap:8px;align-items:flex-end;margin-top:10px}
.cu-in textarea{flex:1;min-width:0;min-height:40px;resize:vertical;border:1px solid var(--wk-field-line,var(--wk-line-2));background:var(--wk-field,var(--wk-panel));color:var(--wk-ink);border-radius:10px;padding:9px 11px;font:inherit;font-size:13.5px}
html[data-theme="dark"] .cu-in textarea{color-scheme:dark}
.cu-btn{display:inline-flex;align-items:center;height:40px;border:1px solid var(--wk-line-2);background:var(--wk-panel);color:var(--wk-link);border-radius:10px;padding:0 14px;font:700 13px/1 var(--font-body);cursor:pointer;white-space:nowrap}
.cu-link{border:0;background:none;padding:0;font:inherit;color:var(--wk-link);font-weight:700;cursor:pointer}
.cu-pr{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr)) auto;gap:8px;align-items:end;margin-top:10px}
.cu-pr label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--wk-mut);min-width:0}
.cu-pr input{height:40px;min-width:0;border:1px solid var(--wk-field-line,var(--wk-line-2));background:var(--wk-field,var(--wk-panel));color:var(--wk-ink);border-radius:10px;padding:0 10px;font:inherit;font-size:13.5px}
html[data-theme="dark"] .cu-pr input{color-scheme:dark}
.cu-pr-v{display:flex;align-items:center;gap:10px;white-space:nowrap}.cu-pr-v .cu-link{font-size:12.5px}
@media (max-width:640px){.cu-pr{grid-template-columns:repeat(2,minmax(0,1fr))}.cu-pr label:first-child,.cu-pr .cu-btn{grid-column:1/-1}}
.cu-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.of-cust{display:inline-flex;align-items:center;gap:5px;border:0;background:none;padding:0;font:inherit;color:inherit;text-decoration:underline;text-decoration-color:rgba(244,246,250,.45);text-underline-offset:3px;cursor:pointer}
.of-cust svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
@media (max-width:640px){
 .cu-card{padding:16px 14px;border-radius:16px}
 .cu-search{min-width:100%}
 .cu-tbl thead{display:none}
 /* styles.css antaa taulukoille pienellä näytöllä min-width:650px; asiakaslista on puhelimella lista. */
 .cu-tbl,.cu-tbl tbody{display:block;min-width:0}
 .cu-none{display:none}
 .cu-tbl tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:11px 4px;border-top:1px solid var(--wk-line)}
 .cu-tbl td{display:block;padding:0;border:0}
 .cu-tbl td:first-child{grid-column:1/-1}
 .cu-tbl td[data-l]{display:none}
 .cu-tbl .cu-st{grid-column:1}.cu-tbl .cu-ago{grid-column:2;text-align:right}
 .cu-tiles{grid-template-columns:1fr 1fr}
}

/* Keikan tarvikkeet ja tukkulista (dist/job-supplies.js, server/job-supplies.mjs) */
.tk-list{display:flex;flex-direction:column}
.tk-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;align-items:center;padding:9px 0;border-top:1px solid var(--wk-line)}
.tk-row:first-child{border-top:0;padding-top:0}
.tk-nm{min-width:0;overflow-wrap:anywhere}
.tk-nm b{display:block;font-size:13.5px;line-height:1.35;color:var(--wk-ink);font-weight:700}
.tk-nm small{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:1px}
.tk-ctl{display:flex;align-items:center;gap:2px}
.tk-st{appearance:none;-webkit-appearance:none;max-width:150px;border:1px solid var(--wk-line-2);border-radius:999px;padding:5px 26px 5px 11px;font:700 12px/1.2 var(--font-body);color:var(--wk-mut);background:var(--wk-panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%238a94a6' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 8px center/11px;cursor:pointer}
.tk-st.a{background-color:var(--wk-amber-t);color:var(--wk-amber-ink);border-color:transparent}
.tk-st.b{background-color:var(--wk-tint);color:var(--wk-link);border-color:transparent}
.tk-st.g{background-color:var(--wk-green-t);color:var(--wk-green-ink);border-color:transparent}
html[data-theme="dark"] .tk-st,html[data-theme="dark"] .tk-eta input{color-scheme:dark}
.tk-st:focus-visible,.tk-x:focus-visible{outline:2px solid var(--wk-brand,#2f5fa8);outline-offset:2px}
.tk-x{width:30px;height:30px;display:grid;place-items:center;border:0;background:none;color:var(--wk-dim);border-radius:8px;cursor:pointer}
.tk-x:hover{background:var(--wk-tint);color:var(--wk-red)}
.tk-x svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.tk-eta{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12.5px;color:var(--wk-mut);font-weight:600}
.tk-eta input{border:1px solid var(--wk-field-line,var(--wk-line-2));background:var(--wk-field,var(--wk-panel));color:var(--wk-ink);border-radius:8px;padding:4px 8px;font:inherit;font-size:12.5px}
.tk-eta em{display:inline-flex;align-items:center;gap:4px;font-style:normal;color:var(--wk-red);font-weight:700}
.tk-eta em svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
.tk-stock{display:flex!important;align-items:center;gap:5px;color:var(--wk-green-ink)!important;font-weight:600}
.tk-stock svg{width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2}
.tk-left{grid-column:1/-1;justify-self:start;font-size:12.5px}
.tk-lf input{width:80px}
.tk-lf .cu-btn{padding:4px 10px;font-size:12.5px}
.tk-lefted{grid-column:1/-1;display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;color:var(--wk-green-ink)}
.tk-lefted svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
.tk-prog{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-size:13.5px;color:var(--wk-ink)}
.tk-prog span{color:var(--wk-mut);font-weight:600}
.tk-bar{height:8px;border-radius:999px;background:var(--wk-line);overflow:hidden;margin-top:6px}
.tk-bar i{display:block;height:100%;border-radius:999px;background:#d39a1c}
.tk-bar.ok i{background:#2e9b5c}
.tk-note{display:flex;gap:10px;align-items:flex-start;border-radius:11px;padding:10px 12px;background:var(--wk-tint);color:var(--wk-ink);font-size:13px;line-height:1.45;margin-top:12px}
.tk-note svg{width:16px;height:16px;flex:none;color:var(--wk-link);margin-top:2px;stroke:currentColor;fill:none;stroke-width:2}
.tk-note b{display:block}
.tk-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tk-btns .cu-btn svg{width:14px;height:14px;margin-right:6px;stroke:currentColor;fill:none;stroke-width:2}
.tk-btns [hidden]{display:none}
.tk-foot{margin:10px 0 0;font-size:12px;line-height:1.45;color:var(--wk-mut)}
.tk-add{margin-top:12px}
.tk-addr{display:grid;grid-template-columns:minmax(0,1fr) 80px 64px;gap:6px}
.tk-addr input{min-width:0;height:40px;border:1px solid var(--wk-field-line,var(--wk-line-2));background:var(--wk-field,var(--wk-panel));color:var(--wk-ink);border-radius:10px;padding:0 10px;font:inherit;font-size:13.5px}
html[data-theme="dark"] .tk-addr input{color-scheme:dark}
.tk-addb{display:flex;align-items:center;gap:14px;margin-top:8px}
.tk-sug{display:flex;flex-direction:column;gap:2px;margin-top:6px;padding:6px;border:1px solid var(--wk-line);border-radius:10px;background:var(--wk-inner,var(--wk-panel))}
.tk-sug[hidden]{display:none}
.tk-sug>span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--wk-dim);padding:2px 6px}
.tk-sug button{display:block;text-align:left;border:0;background:none;padding:6px;border-radius:8px;font:600 13px/1.3 var(--font-body);color:var(--wk-ink);cursor:pointer}
.tk-sug button:hover,.tk-sug button:focus-visible{background:var(--wk-tint)}
.tk-sug small{display:block;font-size:12px;color:var(--wk-mut);font-weight:500}
.tk-range{margin:12px 0 0;font-size:13.5px;color:var(--wk-mut)}
.tk-range b{color:var(--wk-ink)}
.tk-jobs{display:flex;flex-direction:column;gap:2px;margin-top:10px;padding:8px 10px;border:1px solid var(--wk-line);border-radius:11px;background:var(--wk-inner,var(--wk-panel))}
.tk-jobs label{display:flex;gap:9px;align-items:flex-start;padding:5px 0;font-size:13.5px;color:var(--wk-ink);cursor:pointer}
.tk-jobs small{display:block;font-size:12px;color:var(--wk-mut)}
.tk-jobs input,.tk-li input{width:20px;height:20px;margin:1px 0 0;accent-color:#2f5fa8;flex:none}
.tk-shop{margin-top:10px}
.tk-li{display:grid;grid-template-columns:22px 62px minmax(0,1fr);gap:10px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--wk-line);cursor:pointer}
.tk-li:first-child{border-top:0}
.tk-q{font-weight:800;font-size:14px;line-height:1.35;color:var(--wk-ink);overflow-wrap:anywhere}
.tk-li .tk-nm b{font-size:14px;font-weight:600}
.tk-li.done .tk-q,.tk-li.done .tk-nm b,.tk-li.done .tk-nm small{text-decoration:line-through;color:var(--wk-mut)}
.tk-empty{margin:16px 0 4px;font-size:14px;color:var(--wk-mut)}
/* Ota mukaan (dist/job-supplies.js tkOtaHtml): Ainion kuvista arvioimat tarvikkeet ehdotuksina. */
.tk-ota{margin:0 0 14px;padding:0 0 14px;border-bottom:1px solid var(--wk-line)}
.tk-ota-card{border:1.5px dashed #d39a1c}
.tk-ota-card .tk-ota{margin:0;padding:0;border:0}
.tk-new{margin-left:2px;font-size:10.5px;font-weight:800;letter-spacing:.02em;text-transform:none;background:var(--wk-tint);color:var(--wk-link);border-radius:999px;padding:2px 8px}
.tk-ota-ai{display:flex;gap:9px;align-items:flex-start;border-radius:11px;padding:10px 12px;background:var(--wk-tint);color:var(--wk-ink);font-size:13px;line-height:1.45;margin:0 0 4px}
.tk-ota-ai svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--wk-link)}
.tk-ota-l .tk-li:first-child{border-top:0}
.tk-ota-r input:disabled{opacity:.55}
.tk-ota-r.on .tk-q,.tk-ota-r.on .tk-nm b{color:var(--wk-ink)}
.tk-skip{margin-top:8px}
/* Ainion kuvatarkistus luonnoksen yläpuolella (dist/work.js wkPhotoCheckHtml). */
.wk-pchk{display:flex;gap:9px;align-items:flex-start;margin:0 0 8px;padding:10px 12px;border-radius:11px;background:rgba(47,95,168,.08);color:var(--wk-ink);font-size:13px;line-height:1.45;white-space:normal;text-align:left}
.wk-pchk svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--acc,#2f5fa8)}
.wk-pchk>div>b{display:block}
.wk-pchk p{margin:2px 0 0}
.wk-pchk .wk-pchk-p{margin-top:6px}
.cal-ev.sp{border-left-color:#d39a1c;background:#fdf0d5}
html[data-theme="dark"] .cal-ev.sp{background:rgba(255,255,255,.07)}
.cal-sup{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;margin-top:4px;font-size:11px;font-weight:800;color:#8a5a00;background:rgba(255,255,255,.65);border-radius:999px;padding:1px 7px;white-space:nowrap}
html[data-theme="dark"] .cal-sup{color:#f0c46c;background:rgba(0,0,0,.25)}
/* Kapeassa viikkosarakkeessa (läppäri) teksti rivittyy eikä katkea kesken ("1/2 tarviketta hankitt…", korjauslista 17.10.2026). */
.cal-ev .cal-sup{white-space:normal;max-width:100%;box-sizing:border-box;line-height:1.25;border-radius:9px}
.cal-sup svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.2}
.cal-ag .cal-sup{display:inline-flex;margin-top:4px;color:#8a5a00;background:#fdefd2;font-size:11px}
html[data-theme="dark"] .cal-ag .cal-sup{color:#f0c46c;background:rgba(211,154,28,.2)}
.cal-k.k4{background:#fdefd2;border-left:3px solid #d39a1c}
/* Puhelimella lomakekentät ovat 16 px (iOS ei zoomaa), joten tila ja poisto ovat omalla rivillään nimen alla. */
@media (max-width:640px){.tk-li{grid-template-columns:22px 56px minmax(0,1fr);gap:9px}.tk-addr{grid-template-columns:minmax(0,1fr) 70px 56px}
 .tk-row .tk-nm,.tk-ctl{grid-column:1/-1}.tk-ctl{justify-content:space-between}.tk-st{max-width:none}}
/* Täytä päivä (dist/fill-day.js): kalenterin sivukortti ja paneeli. Ajot raidallisina kuten viikkonäkymän .cal-tr, työt
   katkoviivalaatikoina (ehdotus, ei vielä sovittu). */
.fd-card{border:1.5px dashed #d39a1c}
.fd-card[hidden]{display:none}
.fd-new{font-size:10.5px!important;font-weight:800!important;letter-spacing:.04em;text-transform:uppercase;background:var(--wk-brand);color:#fff!important;border-radius:999px;padding:2px 8px}
.fd-mini{display:flex;flex-direction:column;gap:6px}
.fd-mini div{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;font-size:12.5px;line-height:1.35;color:var(--wk-mut)}
.fd-mini b{color:var(--wk-ink);font-weight:700}
.fd-mini span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-lead{margin:0 0 12px;font-size:14px;line-height:1.5;color:var(--wk-body)}
.fd-note{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;padding:9px 12px;border-radius:11px;background:var(--wk-tint);color:var(--wk-ink);font-size:13px;line-height:1.45}
.fd-note svg{width:15px;height:15px;flex:none;margin-top:2px;color:var(--wk-link);stroke:currentColor;fill:none;stroke-width:2}
.fd-tl{display:flex;flex-direction:column;gap:8px}
.fd-leg{display:flex;align-items:center;justify-content:center;gap:6px;min-height:30px;padding:4px 10px;border-radius:999px;background:repeating-linear-gradient(135deg,#fff4e0 0 6px,#fdebc8 6px 12px);font-size:12.5px;font-weight:700;color:#8f600a;text-align:center}
.fd-leg svg{width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2.2}
.fd-job{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;padding:12px 14px;border:1.5px dashed #6d8fc7;border-radius:12px;background:rgba(47,95,168,.05)}
.fd-job>b{font-size:14.5px;color:var(--wk-ink);white-space:nowrap}
.fd-job strong{display:block;font-size:14px;color:var(--wk-ink);overflow-wrap:anywhere}
.fd-job small{display:block;margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--wk-mut);overflow-wrap:anywhere}
.fd-sum{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-top:16px}
.fd-sum b{font-size:13.5px;line-height:1.4;color:var(--wk-ink)}
.fd-sum span{display:flex;flex-direction:column;align-items:flex-end;flex:none;font-size:20px;font-weight:800;color:var(--wk-ink);white-space:nowrap}
.fd-sum small{font-size:11px;font-weight:600;color:var(--wk-dim)}
.fd-bar i{background:#2e9b5c}
/* Puhelimella paneelin runko on joustava sarake: osat eivät saa kutistua (edistymispalkki katosi). Pääpainike omalle rivilleen. */
.fd-pb>*{flex-shrink:0}
.fd-pf{flex-wrap:wrap}
.fd-pf .b2{flex-basis:100%}
.fd-cmp{margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--wk-mut)}
.fd-done{display:flex;gap:9px;align-items:flex-start;margin-top:12px;padding:10px 12px;border-radius:11px;background:var(--wk-green-t);color:var(--wk-ink);font-size:13px;line-height:1.45}
.fd-done[hidden]{display:none}
.fd-done svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--wk-green);stroke:currentColor;fill:none;stroke-width:2.2}
html[data-theme="dark"] .fd-leg{background:repeating-linear-gradient(135deg,rgba(197,138,29,.16) 0 6px,rgba(197,138,29,.26) 6px 12px);color:#f0c877}
html[data-theme="dark"] .fd-job{border-color:rgba(143,180,232,.55);background:rgba(143,180,232,.06)}
@media (max-width:640px){.fd-job{grid-template-columns:1fr;gap:4px}.fd-sum{flex-direction:column;align-items:flex-start}.fd-sum span{align-items:flex-start}}
/* Kuitit ja ajanotto keikalle (dist/job-work.js). Värit tulevat styles.css:n muuttujista, joten tumma tila toimii samoilla säännöillä. */
.jw-ic{width:16px;height:16px;flex:none}
.jw-cards{display:flex;flex-direction:column;gap:12px}
.jw-card h4 .jw-n{margin-left:auto}
.jw-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--blue-soft);color:var(--blue);font-size:11px;font-weight:700;letter-spacing:0}
.jw-go,.jw-stop,.jw-sec{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 18px;border-radius:12px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;border:1px solid transparent;box-sizing:border-box;text-decoration:none}
.jw-go{background:var(--green);color:#fff;width:100%}
html[data-theme="dark"] .jw-go{background:#178755}
.jw-go:hover{filter:brightness(1.08)}
.jw-stop{background:#d34242;color:#fff;min-height:44px;flex:none}
.jw-sec{background:var(--surface);color:var(--ink);border-color:var(--line)}
.jw-sec:hover{border-color:var(--blue)}
.jw-go:focus-visible,.jw-stop:focus-visible,.jw-sec:focus-visible,.jw-link:focus-visible,.jw-chip.a:focus-visible,.jw-th:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.jw-go:disabled,.jw-stop:disabled,.jw-sec:disabled{opacity:.6;cursor:wait}
.jw-cam{background:var(--blue)}
html[data-theme="dark"] .jw-cam{background:#2f5fa8}
.jw-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--red);flex:none;box-shadow:0 0 0 0 rgba(211,66,66,.5);animation:jwPulse 1.6s infinite}
@keyframes jwPulse{70%{box-shadow:0 0 0 8px rgba(211,66,66,0)}100%{box-shadow:0 0 0 0 rgba(211,66,66,0)}}
@media (prefers-reduced-motion:reduce){.jw-dot{animation:none}}
.jw-live{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 14px;border-radius:12px;background:var(--red-soft);border:1px solid color-mix(in srgb,var(--red) 35%,transparent)}
.jw-live>div{flex:1;min-width:0;display:grid}
.jw-live b{color:var(--red);font-size:15px}
.jw-live small{color:var(--muted);font-size:12.5px}
.jw-warn{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:var(--amber-soft);color:var(--ink);font-size:13px;line-height:1.45}
.jw-logh{margin:14px 0 0;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--wk-dim)}
.jw-logh+.jw-log{margin-top:6px}
.jw-log{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
.jw-log li{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px;align-items:center;font-size:13.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.jw-log b{color:var(--ink);font-weight:600}
.jw-link{background:none;border:0;padding:4px 2px;color:var(--blue);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.jw-log li.jw-tedit{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;border-radius:10px;background:var(--bg)}
.jw-tedit label{display:grid;gap:4px;font-size:12px;font-weight:600;color:var(--muted)}
.jw-tedit input{min-height:40px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
.jw-tedit .jw-btns{grid-column:1/-1;grid-template-columns:1fr auto auto;margin-top:4px}
.jw-tedit .jw-go,.jw-tedit .jw-sec{min-height:42px;font-size:14px;padding:0 12px}
.jw-sum{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.jw-sum div{display:grid;gap:2px;padding:10px 12px;border-radius:10px;background:var(--bg)}
.jw-sum span{font-size:11.5px;color:var(--muted)}
.jw-sum b{font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums}
.jw-note{margin:10px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.jw-empty{margin:0 0 12px;font-size:13.5px;color:var(--muted)}
.jw-rcl{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.jw-rcl li{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:start;padding-bottom:10px;border-bottom:1px solid var(--line-soft)}
.jw-th{display:grid;place-items:center;width:48px;height:60px;padding:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fbfaf6;color:#5a6470;cursor:zoom-in}
.jw-th.pdf{cursor:pointer}
.jw-th.big{width:100%;height:160px}
.jw-th.big .jw-ic{width:40px;height:40px}
.jw-th img{width:100%;height:100%;object-fit:cover;object-position:top}
.jw-rci{display:grid;gap:3px;min-width:0}
.jw-rci b{font-size:14px;color:var(--ink)}
.jw-rci small{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.jw-rca{display:grid;justify-items:end;gap:2px;font-variant-numeric:tabular-nums}
.jw-rca b{font-size:14.5px;color:var(--ink)}
.jw-rca small{font-size:11px;color:var(--muted)}
.jw-chip{justify-self:start;margin-top:3px;padding:3px 9px;border-radius:99px;font-size:11.5px;font-weight:600;border:0;font-family:inherit}
.jw-chip.y{background:var(--green-soft);color:var(--green)}
.jw-chip.n{background:var(--bg);color:var(--muted)}
.jw-chip.a{background:var(--amber-soft);color:var(--ink);cursor:pointer}
.jw-btns{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:12px}
/* Yksin rivillä oleva nappi täyttää koko leveyden: tyhjä auto-sarake ja väli kavensivat Lataa käyntiraportti- ja Tilaa aliurakoitsija -nappeja 8 px muita kapeammiksi (korjauslista 17.10.2026). */
.jw-btns>:only-child{grid-column:1/-1}
/* Etusivun ja työntekijän päivän keikka */
.jw-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:0 0 12px}
.jw-bar:has(.jw-live){grid-template-columns:1fr}
.jw-bar .jw-go{min-height:52px;font-size:16px}
.jw-bar .jw-live b{font-size:16px}
.in-card .jw-bar{margin:12px 0 0}
.jw-pill{display:inline-flex;align-items:center;gap:6px;width:fit-content;margin-left:8px;padding:2px 9px 2px 7px;border-radius:99px;background:var(--red-soft);color:var(--red);font-size:11.5px;font-weight:700;vertical-align:2px;white-space:nowrap}
.jw-pill .jw-dot{width:7px;height:7px}
.hm-tt b .jw-pill{display:inline-flex}
/* Käynnissä oleva keikka etusivulla (omistajan huomio 6.10.2026): punainen reuna pyöristyy rivin mukana. Aiemmin suora
   palkki jatkui rivin pyöristetyn kulman ohi ja pilkisti sen alta terävänä kärkenä. */
.hm-jcr.jw-run{border-radius:12px;overflow:hidden;box-shadow:inset 3px 0 0 var(--red)}
.in-card.jw-run{border-color:var(--red);box-shadow:inset 4px 0 0 var(--red),var(--wk-shadow)}
/* Kalenteri: käynnissä oleva keikka punaisena, merkki omalla rivillään otsikon alla, jottei sana katkea kapeassa sarakkeessa. */
.cal-ev.jw-run,html[data-theme="dark"] .cal-ev.jw-run{background:var(--red-soft);border-left-color:var(--red)!important}
.cal-ev .jw-cb{display:flex;align-items:center;gap:5px;margin:3px 0 2px;color:var(--red);font-size:10.5px;font-weight:800;line-height:1.25;white-space:nowrap}
.cal-ev .jw-cb .jw-dot{width:8px;height:8px;box-shadow:none;animation:none}
.cal-k.jw-k{background:var(--red-soft);border-left:3px solid var(--red)}
/* Kuitin lisäys ja muokkaus */
.jw-ov{position:fixed;inset:0;z-index:2000;background:rgba(10,14,22,.55);display:grid;place-items:center;padding:16px}
.jw-sh{width:min(560px,100%);max-height:calc(100% - 8px);overflow:auto;background:var(--surface);color:var(--ink);border-radius:18px;box-shadow:var(--shadow-lg);display:grid;align-content:start}
.jw-shh{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px 6px}
.jw-shh small{color:var(--muted);font-size:12.5px}
.jw-shh h3{margin:2px 0 0;font-size:20px}
.jw-x{width:36px;height:36px;flex:none;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.jw-shb{padding:12px 20px 20px;display:grid;gap:12px}
.jw-bigcam{display:grid;justify-items:center;gap:6px;padding:28px 16px;border:2px dashed color-mix(in srgb,var(--blue) 50%,transparent);border-radius:16px;background:var(--blue-soft);color:var(--blue);cursor:pointer;text-align:center}
.jw-bigcam .jw-ic{width:40px;height:40px}
.jw-bigcam b{font-size:17px}
.jw-bigcam small{color:var(--muted)}
.jw-wide{width:100%}
.jw-wait{display:flex;align-items:center;justify-content:center;gap:10px;padding:36px 0;color:var(--muted);font-weight:600}
.jw-spin{width:20px;height:20px;border:3px solid var(--line);border-top-color:var(--blue);border-radius:50%;animation:jwSpin .8s linear infinite}
@keyframes jwSpin{to{transform:rotate(360deg)}}
.jw-rv{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:start}
.jw-rv>img{width:100%;border:1px solid var(--line);border-radius:10px;background:#fbfaf6}
.jw-rvf{display:grid;gap:6px;min-width:0}
.jw-rvf label{font-size:12px;font-weight:600;color:var(--muted);margin-top:4px}
.jw-rvf input:not([type=checkbox]){width:100%;box-sizing:border-box;min-height:42px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:inherit;font-size:14.5px}
.jw-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.jw-2>div{display:grid;gap:6px;min-width:0}
.jw-ai{margin:0;padding:10px 12px;border-radius:10px;background:var(--blue-soft);color:var(--ink);font-size:13px;line-height:1.45}
.jw-rvf .jw-warn{margin:0}
.jw-rvf .jw-chk{display:flex;gap:10px;align-items:flex-start;margin-top:8px;padding:12px;border:1px solid var(--line);border-radius:12px;color:var(--ink);cursor:pointer}
.jw-chk input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--green)}
.jw-chk span{display:grid;gap:2px}
.jw-chk b{font-size:14.5px}
.jw-chk small{font-weight:400;color:var(--muted);font-size:12.5px}
.jw-sell{display:grid;gap:6px}
.jw-sell[hidden]{display:none}
.jw-sell small{font-size:12px;color:var(--muted);line-height:1.4}
.jw-shf{position:sticky;bottom:0;display:flex;align-items:center;gap:8px;padding:12px 0 0;background:var(--surface)}
.jw-shf>span{flex:1}
.jw-shf .jw-go{width:auto}
.jw-del{color:var(--red)}
.jw-full{width:100%;border-radius:10px;border:1px solid var(--line);background:#fbfaf6}
@media (max-width:600px){
 .jw-ov{padding:8px;align-items:end}
 .jw-rv{grid-template-columns:1fr}
 .jw-rv>img{max-width:140px}
 .jw-bar{grid-template-columns:1fr}
 .jw-shf{flex-wrap:wrap}
 .jw-shf .jw-go{flex:1 1 100%;order:-1}
}
.jw-card .jw-live+.jw-live,.jw-card .jw-live+.jw-go,.jw-card .jw-go+.jw-live{margin-top:8px}
/* Kohde- ja laiterekisteri (dist/sites.js) */
.ks-dev{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--wk-line);font-size:13.5px;color:var(--wk-ink)}
.ks-dev:first-of-type{border-top:0;padding-top:2px}
.ks-dm{min-width:0}.ks-dm b{display:block}.ks-dm small{display:block;color:var(--wk-mut);font-size:12.5px;line-height:1.45;overflow-wrap:anywhere}
.ks-dm .ks-note{font-style:italic}
.ks-da{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0}
.ks-da .cu-btn{height:32px;gap:5px}.ks-da .cu-btn svg{width:14px;height:14px}
.ks-add{margin-top:8px}
.ks-parts{display:grid;gap:10px;min-width:0;margin-top:4px;padding-top:14px;border-top:1px solid var(--wk-line)}
.ks-parts h3{margin:0;font-size:14px;font-weight:700;color:var(--wk-ink)}
.ks-parts>p{margin:-4px 0 0;font-size:12.5px;line-height:1.5}
.ks-plist{display:grid;gap:10px}.ks-plist:empty{display:none}
.ks-part{position:relative;display:grid;gap:10px;padding:6px 12px 12px;border:1px solid var(--wk-line-2);border-radius:12px;background:var(--wk-card)}
.ks-part>label:first-of-type{grid-template-rows:40px auto;align-items:center}
.ks-part:focus{outline:none}.ks-part:focus-visible{outline:2px solid var(--wk-brand);outline-offset:2px}
.ks-part .ks-pg{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,.8fr) minmax(0,1.2fr) minmax(0,1.2fr);gap:8px}
.ks-prm{position:absolute;top:6px;right:4px;display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:40px;min-width:44px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--wk-mut);font:700 12.5px/1 var(--font-body);cursor:pointer}
.ks-prm svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2}
.ks-prm:hover{text-decoration:underline}
.ks-addp{justify-self:start;gap:6px}.ks-addp svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}
.wk-dlg-bd input[aria-invalid="true"]{border-color:var(--wk-red)}.wk-dlg-bd input[aria-invalid="true"]:focus{outline-color:var(--wk-red)}
@media (max-width:480px){.ks-part .ks-pg{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.ks-h{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--wk-line);font-size:13.5px;color:var(--wk-ink)}
.ks-h b{display:block;font-weight:600;overflow-wrap:anywhere}.ks-h small{display:block;color:var(--wk-mut);font-size:12.5px}
.ks-hd{color:var(--wk-mut);font-size:12.5px;font-variant-numeric:tabular-nums;padding-top:1px}
.ks-logf{display:flex;gap:8px;margin:2px 0 10px;flex-wrap:wrap}
.ks-logf input{height:40px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:13.5px;padding:0 10px;min-width:0}
.ks-logf input[name=text]{flex:1 1 160px}.ks-logf input[type=date]{flex:0 0 140px}
.ks-cdev{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ks-cdev>span{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--wk-line-2);border-radius:999px;padding:3px 10px;font-size:12.5px;font-weight:600;color:var(--wk-ink)}
.ks-cdev small{font-weight:500;color:var(--wk-mut)}
.ks-cdev .cu-pill{padding:0 7px;font-size:11px}
.ks-unl{margin-top:8px;font-size:12.5px}
.ks-srow{cursor:pointer;border-radius:8px}.ks-srow>span{min-width:0}.ks-srow .cu-pill{flex-shrink:0}.ks-srow:hover b{color:var(--wk-link)}
.ks-warn{background:var(--wk-red-t)}.ks-warn svg{color:var(--wk-red)}
.ks-foot{padding:0 4px}
.wk-dlg-ft .ks-del{color:var(--wk-red)}
html[data-theme="dark"] .ks-logf input{color-scheme:dark}
@media (max-width:640px){.ks-dev{flex-direction:column}.ks-da{flex-direction:row;align-items:center;flex-wrap:wrap}.ks-h{grid-template-columns:62px minmax(0,1fr)}}
/* Alan omat työn tiedot: kuljetus ja catering (dist/job-details.js) */
.jd-dl{display:grid;grid-template-columns:minmax(110px,max-content) minmax(0,1fr);gap:6px 14px;margin:2px 0 0;font-size:13.5px}
.jd-dl dt{color:var(--wk-mut);font-size:12.5px;padding-top:1px}.jd-dl dd{margin:0;color:var(--wk-ink);font-weight:600;overflow-wrap:anywhere}
.jd-dl dd.jd-long{white-space:pre-wrap;font-weight:500}
.jd-btns{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.jd-lots{margin-top:12px;padding-top:8px;border-top:1px solid var(--wk-line)}
.jd-lots h5{margin:0 0 4px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--wk-mut)}
.dl-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:13.5px;border-top:1px solid var(--wk-line)}.dl-row:first-of-type{border-top:0}.dl-row b.dl-ok{color:var(--wk-green-ink)}
.dl-lot{padding:8px 0 4px;font-size:13.5px;border-top:1px solid var(--wk-line);line-height:1.4}.dl-sn{display:inline;color:var(--wk-mut);font-size:12.5px}.dl-sub{display:block;color:var(--wk-mut);font-size:12.5px}.dl-lot .jd-btns{margin-top:4px;gap:14px}.dl-lot .cu-link{font-size:13px}.dl-del{color:var(--wk-red)}
.dl-form{display:grid;gap:8px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--wk-line-2)}.dl-form label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--wk-mut);min-width:0}.dl-form label small{color:var(--wk-mut);font-size:12px}
.dl-form input,.dl-form textarea{width:100%;box-sizing:border-box;min-width:0;border:1px solid var(--wk-field-line,var(--wk-line-2));background:var(--wk-field,var(--wk-panel));color:var(--wk-ink);border-radius:10px;padding:8px 10px;font:inherit;font-size:13.5px}.dl-form textarea{resize:vertical;min-height:38px}html[data-theme="dark"] .dl-form input,html[data-theme="dark"] .dl-form textarea{color-scheme:dark}
.dl-r,.dl-r2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:end}.dl-r label:first-child{grid-column:1/-1}
@media (max-width:640px){.dl-r2{grid-template-columns:minmax(0,1fr)}}
.jd-btns .cu-btn{gap:6px;text-decoration:none}.jd-btns .cu-btn svg{width:14px;height:14px}
.jd-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.jd-f{display:grid;gap:5px;font-size:12.5px;font-weight:600;color:var(--wk-mut);min-width:0}
.jd-w{grid-column:1/-1}
.jd-f input,.jd-f select,.jd-f textarea{width:100%;min-width:0;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:14px;font-weight:500;padding:0 10px;height:40px}
.jd-f textarea{height:auto;padding:9px 10px;resize:vertical;line-height:1.45}
.jd-diets{border:1px solid var(--wk-line-2);border-radius:12px;padding:10px 12px 12px;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.jd-diets legend{padding:0 4px;font-size:12.5px}.jd-diets legend small{font-weight:500}
.jd-diets label{display:grid;gap:4px;font-size:11.5px;font-weight:600}
.jd-diets .jd-w{grid-column:1/-1}
html[data-theme="dark"] .jd-f input{color-scheme:dark}
@media (max-width:640px){.jd-form{grid-template-columns:1fr}.jd-diets{grid-template-columns:repeat(3,minmax(0,1fr))}.jd-dl{grid-template-columns:1fr;gap:2px}.jd-dl dd{margin-bottom:6px}}
/* Yrityksen tiedot Y-tunnuksella (dist/company.js): jokaisen arvon lähde näkyy kentän otsikossa. */
.cmp-ov{position:fixed;inset:0;z-index:3000;background:rgba(10,14,22,.55);display:grid;place-items:center;padding:16px}
.cmp-sh{width:min(520px,100%);max-height:calc(100% - 8px);overflow:auto;background:var(--surface);color:var(--ink);border-radius:18px;box-shadow:var(--shadow-lg)}
.cmp-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px 4px}
.cmp-h h3{margin:0;font-size:20px}
.cmp-x{width:36px;height:36px;flex:none;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.cmp-b{padding:8px 20px 20px}
.cmp-f{display:grid;gap:12px}
.cmp-id{display:flex;align-items:flex-end;gap:8px}
.cmp-id .cmp-fl{flex:1}
.cmp-id .secondary-btn{min-height:44px;white-space:nowrap}
.cmp-fl{display:grid;gap:6px;min-width:0}
.cmp-fl label,.cmp-chk b{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;font-weight:650;color:var(--muted)}
.cmp-chk b{font-size:14px;color:var(--ink)}
.cmp-in{width:100%;box-sizing:border-box;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:inherit;font-size:14.5px}
.cmp-in:focus{outline:2px solid var(--blue);outline-offset:1px}
.cmp-note{margin:-4px 0 2px;font-size:13px;line-height:1.45;color:var(--muted)}
.cmp-why{font-size:12px;color:var(--muted);line-height:1.4}
.cmp-src{display:inline-block;padding:1px 7px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.01em}
.cmp-src-ytj{background:var(--green-soft);color:var(--green)}
.cmp-src-ai{background:var(--blue-soft);color:var(--blue)}
.cmp-src-own{background:var(--amber-soft);color:var(--amber)}
.cmp-chk{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.cmp-chk input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--blue)}
.cmp-chk span{display:grid;gap:3px}
.cmp-chk small{font-size:12.5px;color:var(--muted);line-height:1.4}
.cmp-foot{position:sticky;bottom:0;display:flex;justify-content:flex-end;gap:8px;padding-top:10px;background:var(--surface)}
.cmp-spin{width:14px;height:14px;border-width:2px}
@media (max-width:600px){
 .cmp-ov{padding:8px;align-items:end}
 .cmp-foot .primary-btn{flex:1}
}
.op-addco{padding:0;border:0;background:none;color:var(--blue);font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
/* Sopimuksen käynnit kalenterissa (dist/calendar.js calContractCard, server/contracts.mjs) */
.cal-ev.ct{border-left-color:#7c4dbd;background:#f1eafb}html[data-theme="dark"] .cal-ev.ct{background:rgba(124,77,189,.24)}
.cal-ev.ct .cal-tm,.cal-ctl{color:#6a3fb0}html[data-theme="dark"] .cal-ev.ct .cal-tm,html[data-theme="dark"] .cal-ctl{color:#c3a6f0}
/* Hyväksyntälinkistä varattu alustava aika (server/booking.mjs): keltainen katkoviiva, kunnes omistaja vahvistaa sen. */
.cal-ev.tn{border:2px dashed #d9a521;border-left:4px solid #d9a521;background:#fff8e6}html[data-theme="dark"] .cal-ev.tn{background:rgba(217,165,33,.16)}
.cal-ev.tn .cal-tm,.cal-tnl{color:#8a5a00}html[data-theme="dark"] .cal-ev.tn .cal-tm,html[data-theme="dark"] .cal-tnl{color:#f0c96a}
.cal-tnl{display:block;font-weight:700;font-size:11px;line-height:1.3}.cal-ag.tn{border:2px dashed #d9a521;border-radius:12px;background:#fff8e6}html[data-theme="dark"] .cal-ag.tn{background:rgba(217,165,33,.16)}
.cal-k.k6{background:#fff8e6;border:2px dashed #d9a521}html[data-theme="dark"] .cal-k.k6{background:rgba(217,165,33,.2)}
.cal-ctl{margin-bottom:1px}.cal-k.k5{background:#f1eafb;border-left:3px solid #7c4dbd}html[data-theme="dark"] .cal-k.k5{background:rgba(124,77,189,.3)}
.of-pstp.ct{background:rgba(124,77,189,.3);border-color:rgba(195,166,240,.45);color:#e4d6fa;margin-left:6px}
.cal-ctmv{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.cal-ctmv .iv-lbl{margin:0}
.cal-ev .cal-wb+.cal-ctl{margin-right:24px}
/* Tiedostot yksitellen (dist/settings.js wsFilesOpen): Asetukset → Yleiset ja lukitusnäkymä. */
.ws-files .wk-dlg-bd{gap:14px;max-height:min(60vh,520px)}
.ws-fg{display:grid;gap:6px}
.ws-fg>[data-ws-more]{justify-self:start;margin-top:4px}
.ws-fh{margin:0;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--wk-mut)}
.ws-fh span{display:inline-block;margin-left:4px;padding:0 7px;border-radius:999px;background:var(--wk-line-2);color:var(--wk-ink);font-size:11px;letter-spacing:0}
.ws-fr{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--wk-line-2);border-radius:12px;background:var(--wk-inner);color:var(--wk-ink);text-decoration:none}
.ws-fr:hover{border-color:var(--wk-brand)}
.ws-fr>span{flex:1;min-width:0;display:grid;gap:2px}
.ws-fr b{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ws-fr small{font-size:12px;color:var(--wk-dim)}
.ws-fr em{display:flex;align-items:center;gap:6px;font-style:normal;font-size:13px;font-weight:700;color:var(--wk-link);flex:none}
.ws-fr em svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* Varasto keikan tarvikkeissa ja tukun kuitti (dist/job-supplies.js, dist/stock.js) */
.tk-fromst{grid-column:1/-1;justify-self:start;min-height:36px}
.tk-fromst svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}
.tk-pick{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:8px 0 6px;padding:10px 12px;border-radius:12px;border:1px solid var(--wk-line-2);border-left:4px solid var(--wk-green-ink);background:var(--wk-card)}
.tk-pick>div{display:flex;gap:8px;align-items:flex-start;flex:1 1 220px;min-width:0;color:var(--wk-green-ink)}
.tk-pick>div svg{width:16px;height:16px;flex:none;margin-top:2px;stroke:currentColor;fill:none;stroke-width:2}
.tk-pick b{display:block;color:var(--wk-ink);font-size:13.5px}.tk-pick small{display:block;color:var(--wk-mut);font-size:12.5px;margin-top:2px}
.jw-stk{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 10px;align-items:start;padding:12px;border:1px dashed var(--line);border-radius:12px}
.jw-stk .stk-ic{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--green-soft);color:var(--green)}
.jw-stk .stk-ic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.jw-stk b{display:block;font-size:14px}.jw-stk small{display:block;color:var(--muted);font-size:12.5px;line-height:1.45;margin-top:2px}
.jw-stk button{grid-column:2;justify-self:start;width:auto}
.stk-lh{display:flex;justify-content:space-between;align-items:center;font-size:14px}
.stk-rl{display:grid;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.stk-ri{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:start;padding:11px 12px;border-top:1px solid var(--line);cursor:pointer}
.stk-ri:first-child{border-top:0}.stk-ri.on{background:var(--blue-soft)}.stk-ri.off{opacity:.6;cursor:default}
.stk-ri>input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--green)}
.stk-rn{min-width:0;display:grid;gap:3px;overflow-wrap:anywhere}.stk-rn b{font-size:14px;line-height:1.35}.stk-rn small{color:var(--muted);font-size:12px}
.stk-chip{justify-self:start;padding:2px 8px;border-radius:99px;font-size:12px;font-weight:600;border:1px solid var(--line);color:var(--ink)}
.stk-chip.g{color:var(--wk-green-ink);border-color:currentColor}.stk-chip.n{color:var(--muted)}
.stk-rq{display:flex;align-items:center;gap:4px}
.stk-rq input{width:62px;min-height:40px;text-align:right;padding:0 8px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit}
.stk-rq em{font-style:normal;font-size:12.5px;color:var(--muted);min-width:22px}
/* Kuvat keikalta, asiakkaan kuittaus ja käyntiraportti (dist/job-work.js jwReportCard). */
.jw-phl{display:grid;gap:12px}
.jw-ph{display:grid;gap:6px}
.jw-phh{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.jw-phh b{font-size:14px;color:var(--ink)}
.jw-phh small{font-size:12px;color:var(--muted)}
.jw-phs{display:flex;flex-wrap:wrap;gap:8px}
.jw-phs .jw-th{width:64px;height:64px}
/* Työmaan vaiheet Kuvat ja kuittaus -kortissa (dist/job-work.js jwSitePhase): neutraali rivi, väri vain reunassa
   (vihreä valmis, sininen menossa, keltainen kuva puuttuu). */
.jw-site{padding:8px 10px;border:1px solid var(--line);border-left:3px solid var(--line);border-radius:10px}
.jw-site.done{border-left-color:var(--ok,#1e9e5a)}
.jw-site.now{border-left-color:var(--brand,#1d5fd1)}
.jw-site.miss{border-left-color:var(--warn,#d9a400)}
.jw-site .jw-phh{flex-wrap:wrap;align-items:center}
.jw-site .jw-phh b small{font-weight:600;color:var(--muted);margin-left:4px}
.jw-site .jw-phh small{flex:1 1 100%;order:3}
.jw-site .jw-pdone{margin-left:auto}
.jw-site.todo .jw-phh b{color:var(--muted)}
.jw-th img{object-position:center}
.jw-rcl .jw-th img{object-position:top}
.jw-padd{border:2px dashed color-mix(in srgb,var(--blue) 45%,transparent);background:var(--blue-soft);color:var(--blue);cursor:pointer}
.jw-padd .jw-ic{width:22px;height:22px}
.jw-sok{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;align-items:center;margin-top:8px;padding:10px;border-radius:12px;background:var(--green-soft)}
.jw-sok>div{display:grid;gap:2px;min-width:0}
.jw-sok b{font-size:14.5px;color:var(--ink)}
.jw-sok small{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.jw-sok .jw-link{justify-self:start;padding-left:0}
.jw-sig{width:120px;height:56px;object-fit:contain;background:#fff;border-radius:8px;border:1px solid var(--line)}
.jw-card .jw-logh+.jw-wide{margin-top:8px}
.jw-fl{display:grid;gap:5px;font-size:13px;font-weight:600;color:var(--muted)}
.jw-fl .in{min-height:44px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:inherit;font-size:15px;font-weight:400;resize:vertical}
.jw-pad{position:relative;border:2px dashed var(--line);border-radius:14px;background:#fff;overflow:hidden}
.jw-pad canvas{display:block;width:100%;height:180px;touch-action:none;cursor:crosshair}
.jw-pad small{position:absolute;left:12px;bottom:8px;font-size:12px;color:#7a8490;pointer-events:none}
.jw-pad .jw-link{position:absolute;right:8px;top:6px;color:#2d5fb0}
html[data-theme="dark"] .jw-sok{background:var(--bg);box-shadow:inset 3px 0 0 var(--green)}
html[data-theme="dark"] .jw-pad{border-color:#4a5562}
/* Reklamaatio ja takuukeikka (dist/offers.js wyChipHtml, wyCardHtml): viestissä asiakkaan keikka, paneelissa takuukeikat. */
.wy-chip{align-self:flex-end;width:100%;max-width:min(94%,680px);padding:12px 16px;border:1px solid var(--wk-line-2);border-left:3px solid var(--wk-red);border-radius:14px;background:var(--wk-panel)}
.wy-chip .of-line:first-of-type{border-top:0}
.wy-h{display:flex;align-items:center;gap:6px;font-size:14px;margin:0 0 6px;color:var(--wk-ink)}.wy-h svg{width:15px;height:15px}
.wy-chip .op-btns,.wy-card .op-btns{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px}
.wy-chip .of-muted{margin:8px 0 0;font-size:12.5px}
.wy-card .text-btn{display:block;margin-top:6px}
/* Kannattavuus-sivun myyntinäkymä Huippu-paketissa (dist/offers.js ofSalesHtml, omistajan päätös 7.10.2026). Värit: punainen =
   kate alle tavoitteen, keltainen = odottaa sinua, vaaleansininen ✦ = Ainion oma huomio, muu harmaata (rauhalliset värit). */
.ofs-hint{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;padding:14px 16px;border-radius:16px;background:var(--wk-ai);color:var(--wk-ai-fg);font-size:14.5px;line-height:1.5}
.ofs-hint>svg{width:16px;height:16px;flex:none;margin-top:3px}
.ofs-hint p{margin:0}
.ofs-hint-b{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.ofs{margin:0 0 18px;background:var(--wk-panel);border:1px solid var(--wk-line);border-radius:20px;box-shadow:var(--wk-shadow);padding:18px 22px;min-width:0}
.ofs svg{width:16px;height:16px;flex:none}
.ofs-hd{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.ofs-hd h2{margin:0;font:700 19px/1.25 var(--font-heading);color:var(--wk-ink)}
.ofs-hd em,.ofs-h3 em{font-style:normal;font-size:11.5px;font-weight:700;padding:1px 8px;border-radius:99px;background:var(--wk-chip);color:var(--wk-chip-fg)}
.ofs-rule{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:3px 10px;border-radius:99px;background:var(--wk-ai);color:var(--wk-ai-fg)}
.ofs-rule svg{width:13px;height:13px}
.ofs-cs{display:grid;gap:8px}
.ofs-c,.ofs-l{display:grid;grid-template-columns:minmax(0,1fr) auto 170px;gap:6px 18px;align-items:center;cursor:pointer}
.ofs-c{padding:14px 16px;border:1px solid var(--wk-line);border-radius:16px;background:var(--wk-card);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.ofs-c:hover{transform:translateY(-1px);box-shadow:var(--wk-shadow);border-color:var(--wk-line-2)}
.ofs-l{padding:14px 8px;border-top:1px solid var(--wk-line);transition:background .15s}
.ofs-l:hover{background:var(--wk-card)}
.ofs-c:focus-visible,.ofs-l:focus-visible{outline:2px solid var(--wk-link);outline-offset:2px}
.ofs-w{display:grid;gap:3px;min-width:0}
.ofs-w b{font-size:14.5px;color:var(--wk-ink)}.ofs-c .ofs-w b{font-size:16px}
.ofs-w>span:not(.ofs-why):not(.ofs-m){font-size:12.5px;color:var(--wk-mut)}
.ofs-why{font-size:13px;font-weight:600;color:var(--wk-mut)}
.ofs-why.ok{color:var(--wk-ink)}.ofs-why.r{color:#c0392b}.ofs-why.y{color:var(--wk-amber-ink)}
.ofs-why.ai{display:inline-flex;align-items:center;gap:6px;width:fit-content;margin-top:2px;padding:3px 8px;border-radius:8px;background:var(--wk-ai);color:var(--wk-ai-fg)}
.ofs-why.ai svg{width:13px;height:13px}
.ofs-p{font-size:15.5px;font-weight:700;color:var(--wk-ink);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.ofs-c .ofs-p{font-size:18px;letter-spacing:-.01em}
.ofs-b .ofw-btn{width:100%;white-space:nowrap}
.ofw-btn.sec{background:var(--wk-tint);color:var(--wk-link)}
.ofw-btn.sec:hover{background:var(--wk-tint);filter:brightness(.97)}
.ofs-m{position:relative;display:block;width:min(220px,100%);height:5px;margin-top:5px;border-radius:99px;background:var(--wk-line-2)}
.ofs-m i{position:absolute;inset:0 auto 0 0;border-radius:99px;background:var(--wk-mut)}
.ofs-c .ofs-m i{background:var(--wk-ink);opacity:.75}
.ofs-m.low i{background:#c0392b}
.ofs-m s{position:absolute;top:-3px;bottom:-3px;width:2px;margin-left:-1px;border-radius:2px;background:var(--wk-ink);opacity:.55}
.ofs-h3{display:flex;align-items:center;gap:8px;margin:26px 0 2px;font:700 15px/1.3 var(--font-heading);color:var(--wk-ink)}
.ofs-h3 svg{stroke:var(--wk-mut)}
.ofs-none{margin:0 0 4px;font-size:12.5px;color:var(--wk-mut)}
.ofs-ft{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--wk-line);font-size:12.5px;color:var(--wk-mut)}
.ofs-plan{margin-top:10px;font-weight:700}
@keyframes ofsIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.ofs-c,.ofs-l{animation:ofsIn .3s ease both}
@media (prefers-reduced-motion:reduce){.ofs-c,.ofs-l{animation:none;transition:none}.ofs-c:hover{transform:none}}
@media (max-width:720px){.ofs{padding:16px 14px}.ofs-c,.ofs-l{grid-template-columns:minmax(0,1fr) auto}.ofs-b{grid-column:1/-1}}
/* Kohteet-sivu (dist/sites.js renderSitesPage): rivit avautuvat napautuksesta, erääntyvä huolto näkyy vain reunana ja
   pillerinä (rauhalliset värit, 6.10.2026). Värit work.css:n --wk-muuttujista, joten pimeä tila seuraa mukana. */
.aset .ksp-sub{margin:0 0 12px;color:var(--wk-mut);font-size:13px;line-height:1.5}
.aset .ksp-q{width:100%;box-sizing:border-box;height:38px;border:1px solid var(--wk-field-line);border-radius:10px;padding:0 12px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:14px;margin:0 0 10px}
.aset .ksp-q:focus{outline:2px solid var(--hv-ring);outline-offset:-1px}
.aset .ksp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px}
.aset .ksp-chip{border:1px solid var(--wk-line-2);background:transparent;color:var(--wk-ink);border-radius:99px;padding:5px 11px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;min-height:32px}
.aset .ksp-chip:hover{background:var(--hv-row)}
.aset .ksp-chip.on{background:var(--wk-ink);color:var(--wk-panel);border-color:var(--wk-ink)}
.aset .ksp-list{display:flex;flex-direction:column}
.aset .ksp-row{display:flex;gap:12px;align-items:center;padding:12px 8px 12px 14px;border-top:1px solid var(--wk-line);cursor:pointer;color:var(--wk-ink);box-shadow:inset 3px 0 0 transparent;border-radius:0}
.aset .ksp-row:first-child{border-top:0}
.aset .ksp-row.warn{box-shadow:inset 3px 0 0 var(--wk-amber)}
.aset .ksp-row.bad{box-shadow:inset 3px 0 0 var(--wk-red)}
.aset .ksp-row:hover,.aset .ksp-row.open{background:var(--hv-row)}
.aset .ksp-row:focus-visible{outline:2px solid var(--hv-ring);outline-offset:-2px}
.aset .ksp-main{flex:1;min-width:0}
.aset .ksp-t{font-weight:700;font-size:14px;display:block}
.aset .ksp-s{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:2px;line-height:1.4}
.aset .ksp-r{text-align:right;flex-shrink:0;max-width:42%}
.aset .ksp-r .cu-pill{white-space:normal;text-align:left}
.aset .ksp-cv{color:var(--wk-mut);display:grid;place-items:center;width:20px;flex-shrink:0;transition:transform .15s;transform:rotate(90deg)}
.aset .ksp-cv svg{width:16px;height:16px}
.aset .ksp-row.open .ksp-cv{transform:rotate(-90deg)}
.aset .ksp-det{padding:4px 8px 16px 14px;display:flex;flex-direction:column;gap:10px;border-top:1px dashed var(--wk-line-2);background:var(--hv-row)}
.aset .ksp-det h5{margin:8px 0 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--wk-mut)}
.aset .ksp-kv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;font-size:13px;color:var(--wk-ink)}
.aset .ksp-kv span:nth-child(even){color:var(--wk-mut);text-align:right}
.aset .ksp-kv .ksp-bad{color:var(--wk-red)}
.aset .ksp-kv .ksp-warn{color:var(--wk-amber-ink)}
.aset .ksp-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.aset .ksp-acts .btn{margin:0}
/* Puhelimella pilleri siirtyy tekstin alle ja laitteen tila omalle rivilleen, jotta nimet eivät katkeile. */
@media(max-width:700px){.aset .ksp-row{flex-wrap:wrap;padding-left:10px;row-gap:4px}.aset .ksp-main{flex:1 1 calc(100% - 32px)}.aset .ksp-r{order:3;flex:1 1 100%;max-width:none;text-align:left}.aset .ksp-r:empty{display:none}.aset .ksp-det{padding-left:10px}.aset .ksp-kv{grid-template-columns:minmax(0,1fr);gap:2px 0}.aset .ksp-kv span:nth-child(even){text-align:left;margin-bottom:6px}.aset .ksp-acts .btn{flex:1 1 auto;justify-content:center}}
/* Tunnit-sivu (dist/invoices.js renderHoursPage): rivit avautuvat napautuksesta, tuntipankin palkki ja ylitys näkyvät vain
   reunana, palkkina ja pillerinä (rauhalliset värit). Värit --wk-muuttujista, joten pimeä tila seuraa mukana. */
.aset .hbp-sub{margin:0 0 12px;color:var(--wk-mut);font-size:13px;line-height:1.5}
.aset .hbp-form{margin-bottom:14px}
.aset .hbp-form .iv-in{width:100%;box-sizing:border-box}
.aset .hbp-grp{margin:10px 0 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--wk-mut)}
.aset .hbp-list{display:flex;flex-direction:column}
.aset .hbp-row{display:flex;gap:12px;align-items:center;padding:12px 8px 12px 14px;border-top:1px solid var(--wk-line);cursor:pointer;color:var(--wk-ink);box-shadow:inset 3px 0 0 transparent;border-radius:0}
.aset .hbp-row:first-child{border-top:0}
.aset .hbp-row.warn{box-shadow:inset 3px 0 0 var(--wk-amber)}
.aset .hbp-row.bad{box-shadow:inset 3px 0 0 var(--wk-red)}
.aset .hbp-row:hover,.aset .hbp-row.open{background:var(--hv-row)}
.aset .hbp-row:focus-visible{outline:2px solid var(--hv-ring);outline-offset:-2px}
.aset .hbp-main{flex:1;min-width:0}
.aset .hbp-t{font-weight:700;font-size:14px;display:block}
.aset .hbp-s{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:2px;line-height:1.4}
.aset .hbp-bar{display:block;height:6px;border-radius:99px;background:var(--wk-chip);margin-top:6px;max-width:260px;overflow:hidden}
.aset .hbp-bar i{display:block;height:100%;border-radius:99px;background:var(--wk-green)}
.aset .hbp-bar i.warn{background:var(--wk-amber)}
.aset .hbp-bar i.bad{background:var(--wk-red)}
.aset .hbp-r{text-align:right;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:4px;max-width:42%}
.aset .hbp-r b{font-variant-numeric:tabular-nums;font-size:14px}
.aset .hbp-cv{color:var(--wk-mut);display:grid;place-items:center;width:20px;flex-shrink:0;transition:transform .15s;transform:rotate(90deg)}
.aset .hbp-cv svg{width:16px;height:16px}
.aset .hbp-row.open .hbp-cv{transform:rotate(-90deg)}
.aset .hbp-det{padding:4px 8px 16px 14px;display:flex;flex-direction:column;gap:10px;border-top:1px dashed var(--wk-line-2);background:var(--hv-row)}
.aset .hbp-det h5{margin:8px 0 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--wk-mut)}
.aset .hbp-kv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;font-size:13px;color:var(--wk-ink)}
.aset .hbp-kv span:nth-child(even){color:var(--wk-mut);text-align:right;white-space:nowrap}
.aset .hbp-today{padding:4px 0 2px}
.aset .hbp-x{border:0;background:transparent;color:var(--wk-mut);cursor:pointer;font:inherit;padding:0 2px;line-height:1}
.aset .hbp-x:hover{color:var(--wk-red)}
.aset .hbp-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.aset .hbp-acts .btn{margin:0}
.aset .hbp-batch{padding:10px 0 2px}
.aset .hbp-foot{margin-top:14px}
@media(max-width:700px){.aset .hbp-row{flex-wrap:wrap;padding-left:10px;row-gap:4px}.aset .hbp-main{flex:1 1 calc(100% - 32px)}.aset .hbp-r{order:3;flex:1 1 100%;max-width:none;flex-direction:row;justify-content:space-between;align-items:center}.aset .hbp-det{padding-left:10px}.aset .hbp-acts .btn{flex:1 1 auto;justify-content:center}}
/* Lisämaksut keikalta ja toimituksen kuittauksen tavaran kunto (kuljetusala, dist/job-work.js) */
.jw-sur,.jw-seg{display:flex;flex-wrap:wrap;gap:8px}
.jw-chipb{min-height:44px;padding:0 14px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.jw-chipb small{font-weight:500;color:var(--muted);margin-left:4px}
.jw-chipb:hover{border-color:var(--blue)}
.jw-chipb.on{border-color:var(--green);background:var(--green-soft);color:var(--green)}
.jw-chipb:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.jw-chipb:disabled{opacity:.6;cursor:default}
.jw-sur-l{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.jw-sur-l li{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:6px 0;border-bottom:1px solid var(--line-soft)}
.jw-sur-l li:last-child{border-bottom:0}
.jw-sur-l b{font-variant-numeric:tabular-nums}
.jw-sur+.jw-logh{margin-top:12px}
.jw-box{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:8px;margin-top:10px}
.jw-box label{display:grid;gap:4px;font-size:12px;font-weight:600;color:var(--muted)}
.jw-box input{min-height:44px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:15px;min-width:0}
@media (max-width:420px){.jw-box{grid-template-columns:1fr 1fr}.jw-box label:last-child{grid-column:1/-1}}
.jw-stops{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.jw-stops li{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.jw-stops li.ok{border-left:3px solid var(--green)}
.jw-stops b{display:block;font-size:14px;line-height:1.35}
.jw-stops small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.jw-stn{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;background:var(--bg);color:var(--ink)}
.jw-stops li.ok .jw-stn{background:var(--green-soft,var(--bg));color:var(--green)}
.jw-sta{display:flex;gap:4px;align-items:center}
.jw-ib{min-width:36px;min-height:36px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);font:inherit;cursor:pointer}
.jw-ib:disabled{opacity:.35;cursor:default}
.jw-lnk{border:0;background:none;color:var(--muted);font:inherit;font-size:13px;text-decoration:underline;cursor:pointer;min-height:36px}
.jw-stadd{display:grid;grid-template-columns:110px 1fr;gap:8px;margin-top:10px}
.jw-stadd input:last-child{grid-column:1/-1}
.jw-stadd .in{min-height:44px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:15px;min-width:0}
a.jw-sec{text-decoration:none}
.wk-pchk>div{flex:1;min-width:0}
.wk-move{margin-top:8px}
.wk-move table{width:100%;min-width:0;border-collapse:collapse;margin-top:4px;font-size:13px}
.wk-move td{padding:4px 0;border-bottom:1px solid rgba(47,95,168,.15);vertical-align:top}
.wk-move td:last-child{text-align:right;white-space:nowrap;padding-left:10px;font-weight:600}
.wk-move tfoot td{border-bottom:0;font-weight:700}
.wk-move dl{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:6px 0 0}
.wk-move dt{color:var(--wk-mut,var(--muted))}
.wk-move dd{margin:0;font-weight:600;text-align:right}
.wk-move>b{display:block}
/* Tapahtuma- ja kuvausala: henkilömäärän vahvistus, toimitus ja peruutus (dist/event-jobs.js) */
.tp-box{margin-top:14px;border-top:1px solid var(--wk-line-2);padding-top:4px}
/* Vedoksen hyväksyntä (dist/job-details.js vdPaint): kuvan valinta ja tila Tilaus ja toimitus -kortin lopussa. */
.vd-box{padding:10px 0 2px;margin-top:8px;border-top:1px solid var(--wk-line-2)}.vd-box h5{margin:0 0 6px;font-size:12.5px;font-weight:700;color:var(--wk-mut);letter-spacing:.02em}
.vd-th{display:block;width:120px;height:90px;object-fit:cover;border-radius:8px;border:1px solid var(--wk-line);margin:4px 0}
.vd-cm{margin:0 0 6px;font-size:13.5px;color:var(--wk-ink);white-space:pre-wrap}
.vd-ph{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 8px}.vd-ph label{cursor:pointer;position:relative}.vd-ph input{position:absolute;opacity:0;width:1px;height:1px}
.vd-ph img{display:block;width:72px;height:72px;object-fit:cover;border-radius:8px;border:2px solid var(--wk-line);background:var(--wk-tint)}.vd-ph input:checked+img{border-color:var(--wk-link);box-shadow:0 0 0 2px var(--wk-tint)}.vd-ph input:focus-visible+img{outline:2px solid var(--wk-link);outline-offset:2px}
.vd-form input[type=text]{width:100%;font:inherit;font-size:14px;padding:8px 10px;border:1px solid var(--wk-line);border-radius:8px;background:var(--wk-card);color:var(--wk-ink)}
.vd-out{width:100%;min-height:110px;margin-top:6px;font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--wk-line);border-radius:8px;background:var(--wk-tint);color:var(--wk-ink);resize:vertical}
.tp-sec{padding:10px 0 2px}.tp-sec+.tp-sec{border-top:1px solid var(--wk-line-2)}
.tp-sec h5{margin:0 0 6px;font-size:12.5px;font-weight:700;color:var(--wk-mut);letter-spacing:.02em}
.tp-line{margin:0 0 4px;font-size:13.5px;color:var(--wk-ink);display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.tp-line a{color:var(--wk-link)}
.tp-terms{margin:0;padding-left:18px;font-size:13px;color:var(--wk-ink)}.tp-terms li{margin:2px 0}
.tp-text{width:100%;min-height:120px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;font-size:13.5px;padding:9px 10px;margin-top:6px;resize:vertical}
.tp-tier{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 0;font-size:14px;color:var(--wk-ink)}
.tp-tier label{display:flex;align-items:center;gap:6px;font-weight:600}
.tp-tier input{width:64px;height:40px;border:1px solid var(--wk-field-line);border-radius:10px;background:var(--wk-field);color:var(--wk-ink);font:inherit;text-align:right;padding:0 8px}
.tp-tier input[readonly]{opacity:.7}
.tp-tier .cu-link svg{width:14px;height:14px}
.tp-calc{margin-top:12px}.tp-calc .jd-dl{margin:8px 0}
.wk-dlg-ft .tp-off{margin-right:auto;color:var(--wk-red)}
.tp-box .cu-link{font-size:13px;font-weight:600}
/* Google Maps -merkintä Googlelta tulleiden ajojen ja matkojen vieressä (dist/travel.js TR_GMP; Googlen ohje: nimi
   sellaisenaan, 12–16 px, normaali paino, harmaa #5e5e5e tai tummalla pohjalla valkoinen, ei rivity). */
span.gmp-attr.gmp-attr{font-size:12px;font-weight:400;font-style:normal;color:#5e5e5e;white-space:nowrap;letter-spacing:0;text-transform:none}
html[data-theme="dark"] span.gmp-attr.gmp-attr{color:#fff}
/* Kalenterin yläreunan "Ajoa … · Google Maps" -rivi on tummalla pohjalla molemmissa teemoissa (portal.css .dash-view .top-area). */
.cal-line span.gmp-attr.gmp-attr{color:#fff}
.tr-srcl{display:block;margin-top:4px;font-size:12px;font-weight:400;color:var(--wk-mut)}
.cal-gsrc{margin:0;padding:6px 14px 8px;border-top:1px solid var(--wk-line);font-size:12px;color:var(--wk-mut)}
.in-routes{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
/* Asiantuntijat (dist/expert.js): Esteellisyys ja Sopimusehdot tarjouksen paneelissa. Neutraali tausta, väri vain reunassa. */
.ex-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:4px}
.ex-chip{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 14px;border:1px solid var(--wk-line-2);border-radius:99px;background:var(--wk-panel);color:var(--wk-ink);font:inherit;font-size:13.5px;font-weight:600;line-height:1;text-align:center;cursor:pointer}
.ex-chip.on{background:var(--wk-chip);color:var(--wk-chip-fg);border-color:transparent;cursor:default;padding-right:6px}
.ex-chip button{display:inline-grid;place-items:center;width:26px;height:26px;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}
.ex-chip button svg{width:13px;height:13px}
.ex-addf{display:flex;gap:6px;flex:1 1 220px}
.ex-addf .iv-in{flex:1;min-width:0;min-height:36px}
.ex-warn,.ex-ok{margin-top:10px;padding:10px 12px;border:1px solid var(--wk-line);border-left:3px solid var(--wk-red);border-radius:10px;font-size:13.5px;line-height:1.45;color:var(--wk-ink)}
.ex-warn span{display:block;margin-top:4px;font-weight:700}
.ex-ok{border-left-color:var(--wk-green-ink);display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.ex-note{display:grid;gap:4px;margin:10px 0 8px;font-size:12.5px;font-weight:600;color:var(--wk-mut)}
.ex-term{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ex-term .op-chk{margin-top:8px;flex:1}
.ex-up{margin-top:12px;cursor:pointer}
.ex-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}
.ex-f{display:grid;gap:4px;font-size:12.5px;font-weight:600;color:var(--wk-mut)}
.ex-f .iv-in{min-height:40px}
@media (max-width:560px){.ex-grid{grid-template-columns:1fr}}
.ex-total{margin:12px 0 8px;font-size:15px;font-weight:700;color:var(--wk-ink)}
.ex-bud span{display:block;font-size:14px;color:var(--wk-ink);margin-bottom:6px}
.ex-bud i{display:block;height:10px;border-radius:99px;background:var(--wk-line-2);position:relative;overflow:hidden}
.ex-bud i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--p);background:var(--wk-brand);border-radius:inherit}
.ex-bud.near i::after{background:var(--wk-amber)}
.ex-bud.over i::after{background:var(--wk-red)}
.ex-warn.near{border-left-color:var(--wk-amber)}
.ex-ph{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ex-ph .op-chk{flex:1;margin-top:8px}
.ex-ph>span{font-size:12.5px;color:var(--wk-mut);margin-top:8px}
.ex-addf .ex-h{flex:0 0 64px}
.ex-card .ex-addf{margin-top:10px}
.ex-rev{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--wk-line)}
.ex-rev>div{flex:1;min-width:180px}.ex-rev span{display:block;font-size:12.5px;color:var(--wk-mut);margin-top:2px}
.ex-cmt{margin:6px 0 0;padding:8px 10px;border-left:3px solid var(--wk-amber);background:var(--wk-card);border-radius:6px;font-size:13.5px;white-space:pre-wrap;color:var(--wk-ink)}
.ex-link{display:grid;gap:8px;margin:10px 0;padding:12px;border:1px solid var(--wk-line-2);border-radius:12px}
.ex-doc{padding:10px 0;border-top:1px solid var(--wk-line)}.ex-it{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;font-size:13.5px;margin-top:6px}
.ex-qform{display:grid;gap:8px;margin-top:10px}.ex-qform textarea{min-height:72px}
/* Lue lisää (dist/work.js wkMoreHtml): linkin näköinen nappi tekstin perässä. */
.wk-more{display:inline;border:0;background:none;padding:0;font:inherit;font-weight:600;color:var(--wk-link,#2f5fa8);text-decoration:underline;cursor:pointer}
/* Käytön läpikäynti 18.10.2026 (kohta 4): kosketusnäytöllä pienten linkkien ja nappien napautusalue on vähintään 44 × 44 px.
   Näkymätön ::after-alue kasvaa vain sen verran, mikä puuttuu 44 px:stä, eikä se muuta ulkoasua eikä asettelua. */
@media (pointer:coarse){
 .text-btn,.hm-jft a,.hm-fcs-go,.flw-go,.cal-dayh,.iv-link,.aset .hbp-x,.rc-cb,.wk-more{position:relative}
 .text-btn::after,.hm-jft a::after,.hm-fcs-go::after,.flw-go::after,.cal-dayh::after,.iv-link::after,.aset .hbp-x::after,.rc-cb::after,.wk-more::after{content:'';position:absolute;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px));left:min(0px,calc(50% - 22px));right:min(0px,calc(50% - 22px))}
}

/* Markkinointiapuri (dist/marketing.js, Huippu): Markkinointi-sivu, Tee somejulkaisu -ikkuna ja A5-esite. Sininen nappi
   painetaan (rauhalliset värit), hover vain kirkastaa. */
.mk-ic{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mk-go{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:0;border-radius:12px;background:var(--acc-d,#2f5fa8);color:#fff;font:inherit;font-size:15px;font-weight:700;white-space:nowrap;cursor:pointer;transition:filter .15s}
.mk-go:hover:not(:disabled),.mk-go:focus-visible{filter:brightness(1.1)}
.mk-go:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.mk-go:disabled{opacity:.6;cursor:default}
.mk-go .jw-ic{width:18px;height:18px}
.mk-wide{width:100%}
.jw-mk{margin-top:10px}
.mk-page .mk-sec{display:grid;gap:12px;padding:4px 0 18px}
.mk-page .mk-sec+.mk-sec{border-top:1px solid var(--line);padding-top:18px}
.mk-page h2{margin:0;font-size:18px}
.mk-list{display:grid;gap:8px}
.mk-job{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--line);border-left:4px solid var(--acc-d,#2f5fa8);border-radius:12px;background:var(--surface)}
.mk-rt{display:grid;gap:3px;min-width:0;flex:1}
.mk-job .mk-go{flex:none;width:auto}
.mk-rt b{font-size:15px}
.mk-rt small{color:var(--muted);font-size:13px;line-height:1.4}
.mk-empty{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.mk-info,.mk-perm{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:13px;line-height:1.45;color:var(--muted)}
.mk-info .mk-ic,.mk-perm .mk-ic{width:15px;height:15px;margin-top:1px}
.mk-soon p{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.mk-ph{display:flex;gap:8px;flex-wrap:wrap}
.mk-pk{position:relative;width:92px;height:92px;padding:0;border:2px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface);cursor:pointer;opacity:.55}
.mk-pk.on{border-color:var(--acc-d,#2f5fa8);opacity:1}
.mk-pk img{width:100%;height:100%;object-fit:cover;display:block}
.mk-pk span{position:absolute;left:4px;bottom:4px;padding:1px 6px;border-radius:6px;background:rgba(20,33,61,.82);color:#fff;font-size:11px;font-weight:700}
.mk-pk:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.mk-text{font-size:15px;line-height:1.5}
.mk-btns{display:flex;flex-wrap:wrap;gap:8px}
.mk-btns .jw-sec{min-height:44px}
.mk-fly{display:grid;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
.mk-fly h4{margin:0;font-size:15px}
.mk-tpls{display:flex;flex-wrap:wrap;gap:6px}
.mk-tpls .jw-chipb{min-height:38px;font-size:13.5px}
.mk-cv{width:100%;max-width:360px;height:auto;aspect-ratio:1240/1748;border:1px solid var(--line);border-radius:8px;background:#fff;justify-self:center}
.mk-card .rc-ft p:empty{display:none}
.mk-card .rc-ft .mk-go{margin-left:auto;max-width:420px}
@media (max-width:760px){.mk-job{flex-direction:column;align-items:stretch}.mk-job .mk-go{width:100%}.mk-btns>*{flex:1}.mk-card .rc-ft .mk-go{max-width:none}}
#mkPrint{display:none}
@media print{
 @page{size:A5;margin:0}
 html.mk-printing body>*:not(#mkPrint){display:none!important}
 html.mk-printing #mkPrint{display:block}
 html.mk-printing #mkPrint img{width:148mm;height:210mm;display:block}
}
/* Kuittauksen kuvalupa (Huippu): iso napautettava rivi asiakkaalle. */
.jw-ok{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font-size:14px;line-height:1.45;color:var(--ink);cursor:pointer}
.jw-ok input{width:22px;height:22px;margin:0;flex-shrink:0;accent-color:var(--acc-d,#2f5fa8)}
/* Markkinointiapuri osa 2: hiljainen jakso (dist/marketing.js mkQuietCard ja Markkinointi-sivun osio). Hiljaiset viikot
   keltaisella reunalla (odottaa sinua), muut neutraaleina; kutsurivit ovat varauskierroksen rc-*-rivejä (dist/home.css). */
.mkq-lead{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.mkq-wks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:4px 0 10px}
.mkq-wk{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.mkq-wk b{font-size:14px}
.mkq-wk small{font-size:12.5px;color:var(--muted)}
.mkq-wk.q{border-color:#e0a82e;border-left:4px solid #e0a82e;background:rgba(224,168,46,.08)}
.mkq-wk.q small{color:inherit;font-weight:600}
.mkq-h{margin:10px 0 2px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mkq-new{display:grid;gap:8px;margin-top:12px}
.mkq-post{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:inherit;font:inherit;font-size:14.5px;font-weight:700;cursor:pointer;transition:box-shadow .15s}
.mkq-post:hover,.mkq-post:focus-visible{box-shadow:0 0 0 4px var(--hv-row,rgba(47,95,168,.08))}
.mkq-post:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.mkq-post .mk-ic{width:17px;height:17px}
.mk-page .rc-ft{border-top-color:var(--line)}
@media (max-width:760px){.mkq-wks{grid-template-columns:repeat(2,minmax(0,1fr))}.mkq-card .rc-ft,.mk-page .rc-ft{flex-direction:column;align-items:stretch}.mkq-card .rc-go,.mk-page .rc-go{margin-left:0;justify-content:center;height:46px}}
/* Markkinointiapuri osa 3: esittäytyminen (dist/marketing.js mbSection ja viestien läpikäynti). Yleinen osoite ja vastaus vihreällä,
   odottaa sinua keltaisella, soita itse oranssilla ja ohitettavat harmaalla; Ainion huomio vaaleansinisellä reunalla. */
.mb-area{margin:-6px 0 0;color:var(--muted);font-size:14px}
.mb-lead{margin:0;padding:12px 14px;border-left:4px solid var(--acc-d,#2f5fa8);border-radius:10px;background:#eef3fb;font-size:14px;line-height:1.5}
.mb-lead b{color:var(--acc-d,#2f5fa8)}
.mb-lead .mk-ic{width:15px;height:15px;margin-right:4px;vertical-align:-2px}
.mb-rows{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.mb-r{display:flex;align-items:center;gap:12px;padding:12px 14px;border-top:1px solid var(--line)}
.mb-r:first-child{border-top:0}
.mb-r .mk-rt small{overflow-wrap:anywhere}
.mb-r:not(.mb-off) .rc-cb{border-color:var(--acc-d,#2f5fa8);background:var(--acc-d,#2f5fa8)}
.mb-r:not(.mb-off) .rc-cb svg{display:block}
.mb-dim{opacity:.55}
.mb-tag{flex:none;padding:4px 10px;border-radius:999px;font-size:12.5px;font-weight:700;white-space:nowrap}
.mbt-g{background:#e7f6ee;color:#1d7a4c}
.mbt-y{background:#fff6e0;color:#9a6a08}
.mbt-a{background:#fdeee3;color:#a4561b}
.mbt-n{background:#eef0f4;color:#5b6474}
.mb-no{flex:none;min-height:32px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:none;color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer;transition:box-shadow .15s}
.mb-no:hover,.mb-no:focus-visible{box-shadow:0 0 0 4px var(--hv-row,rgba(47,95,168,.08))}
.mb-wait{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #e0a82e;border-left-width:4px;border-radius:12px;background:rgba(224,168,46,.08);font-size:14px;font-weight:600}
.mb-wait .mk-go{margin-left:auto}
.mb-sec .mk-go .mk-ic,.mb-sec .jw-sec .mk-ic{width:17px;height:17px}
.mb-sec>.jw-sec{justify-self:start;min-height:44px;display:inline-flex;align-items:center;gap:8px}
.mb-sec .rc-go{justify-self:start;justify-content:center;height:48px;margin-left:0;padding:0 24px}
.mb-limit{margin:-4px 0 0;color:var(--muted);font-size:13px}
.mb-set summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--acc-d,#2f5fa8);padding:6px 0}
.mb-set[open]{display:grid;gap:10px}
.mb-set .jw-sec{justify-self:start;min-height:44px}
.mb-help{color:var(--muted);font-size:12.5px;font-weight:400}
.mb-to{margin:0;font-size:15px}
.mb-mail{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface)}
.mb-hd{display:grid;gap:4px;padding:10px 12px;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--muted);overflow-wrap:anywhere}
.mb-hd b{color:var(--ink)}
.mb-hd label{display:grid;gap:4px;margin-top:4px}
.mb-body{display:block;width:100%;box-sizing:border-box;padding:12px;border:0;border-radius:0;min-height:200px;font-size:14.5px;line-height:1.55;resize:none;overflow:hidden}
.mb-pdf{display:flex;gap:12px;align-items:center;margin:0 12px 12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;color:inherit;text-decoration:none;transition:box-shadow .15s}
.mb-pdf:hover,.mb-pdf:focus-visible{box-shadow:0 0 0 4px var(--hv-row,rgba(47,95,168,.08))}
.mb-pdfi{display:grid;place-items:center;flex:none;width:38px;height:46px;border-radius:6px;background:#14213d;color:#fff;font-size:11.5px;font-weight:800}
.mb-pdf small{display:block;color:var(--muted);font-size:12.5px;line-height:1.4}
.mb-checks{display:grid;gap:6px;margin:0;padding:0;list-style:none;font-size:14px}
.mb-checks li{display:flex;gap:8px;align-items:center}
.mb-checks .mk-ic{width:16px;height:16px}
.mb-checks .ok .mk-ic{color:#1d7a4c}
.mb-checks .bad{color:#a4561b;font-weight:600}
html[data-theme="dark"] .mb-lead{background:rgba(var(--acc-rgb,59,111,209),.13)}
html[data-theme="dark"] .mb-lead b{color:#8fb4e8}
html[data-theme="dark"] .mbt-g{background:rgba(29,122,76,.2);color:#6fcf8e}
html[data-theme="dark"] .mbt-y{background:rgba(224,169,46,.14);color:#f0c36a}
html[data-theme="dark"] .mbt-a{background:rgba(214,120,50,.16);color:#f2a46a}
html[data-theme="dark"] .mbt-n{background:rgba(170,185,210,.1);color:#9daac4}
html[data-theme="dark"] .mb-pdfi{background:#2a3a5c}
html[data-theme="dark"] .mb-checks .ok .mk-ic{color:#6fcf8e}
html[data-theme="dark"] .mb-checks .bad{color:#f2a46a}
@media (max-width:760px){.mb-r{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px 12px}.mb-no{grid-column:2/-1;justify-self:start}.mb-tag{font-size:12px;padding:3px 8px}.mb-wait{flex-direction:column;align-items:stretch}.mb-wait .mk-go{margin-left:0}.mb-sec>.jw-sec,.mb-sec .rc-go{justify-self:stretch}}