.by-blad{--b-bg:var(--bg,#fff);--b-yta:var(--yta,#fff);--b-y2:var(--yta2,var(--panel,#f4f5f8));--b-ink:var(--ink,#0b1533);--b-mut:var(--mut,#5d6578);--b-l:var(--linje,#e3e6ee);--b-l2:var(--linje2,#d5d9e4);--b-acc:var(--acc,#2c5cff);--b-accs:var(--acc-svag,#eaf0ff);--b-ok:var(--ok,#0f8a55);--b-oks:var(--ok-svag,#e3f5ec);--b-var:var(--var,#b26a00);--b-vars:var(--var-svag,#fbf0dc);--b-fel:var(--fel,#c4321f);}
/* Byggaren (G-onboarding). Självständig: läser bara tokens (--bg --yta --ink --mut --linje --acc --ok --var --fel). Premium enligt B57. */
.by{--b-bg:var(--bg,#fff);--b-yta:var(--yta,#fff);--b-y2:var(--yta2,var(--panel,#f4f5f8));--b-ink:var(--ink,#0b1533);--b-mut:var(--mut,#5d6578);--b-l:var(--linje,#e3e6ee);--b-l2:var(--linje2,#d5d9e4);--b-acc:var(--acc,#2c5cff);--b-accs:var(--acc-svag,#eaf0ff);--b-ok:var(--ok,#0f8a55);--b-oks:var(--ok-svag,#e3f5ec);--b-var:var(--var,#b26a00);--b-vars:var(--var-svag,#fbf0dc);--b-fel:var(--fel,#c4321f);
  display:flex;flex-direction:column;height:calc(100dvh - var(--huvud,56px) - 44px);min-height:420px;max-width:1320px;margin:0 auto;font-family:var(--sans,inherit);color:var(--b-ink)}
.by *{box-sizing:border-box}
.by-dold{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.by :focus-visible,.by-blad :focus-visible{outline:3px solid var(--b-acc);outline-offset:2px;border-radius:8px}
.by-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:6px 12px;background:var(--b-y2);margin:8px 12px 0;border-radius:14px}
.by-tabs button{min-height:44px;border:0;border-radius:11px;background:transparent;color:var(--b-mut);font:600 15px/1 inherit;cursor:pointer;transition:background .18s,color .18s,box-shadow .18s}
.by-tabs button[aria-selected=true]{background:var(--b-yta);color:var(--b-ink);box-shadow:0 1px 2px rgba(11,21,51,.08),0 4px 12px -6px rgba(11,21,51,.2)}
.by section{flex:1;min-height:0;display:flex;flex-direction:column;min-width:0}
.by [data-dold]{display:none}
.by-ch,.by-ph{display:flex;align-items:center;gap:8px;padding:10px 14px;flex-wrap:wrap;border-bottom:1px solid var(--b-l)}
.by-spacer{flex:1}
.by-lank{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;border:0;background:none;color:var(--b-acc);font:600 14px/1 inherit;cursor:pointer;border-radius:10px}
.by-lank svg,.by-sek svg,.by-bav svg,.by-x svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.by-lank[disabled]{opacity:.4;cursor:not-allowed}.by-lank i{font-style:normal;background:var(--b-accs);color:var(--b-acc);border-radius:99px;padding:1px 7px;font-size:12px}
.by-sek,.by-prim{min-height:44px;padding:0 16px;border-radius:14px;font:600 15px/1 inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid transparent;transition:transform .15s,filter .15s,box-shadow .15s}
.by-sek{background:var(--b-yta);color:var(--b-ink);border-color:var(--b-l2);box-shadow:0 1px 2px rgba(11,21,51,.06)}
.by-prim{background:var(--b-ink);color:var(--b-bg);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 10px 22px -12px rgba(11,21,51,.6)}
.by-sek:hover,.by-prim:hover:not([disabled]){transform:translateY(-1px)}.by-prim:active,.by-sek:active{transform:scale(.985)}.by-prim[disabled]{opacity:.5}
.by-pill{display:inline-block;padding:3px 10px;border-radius:99px;font-size:12.5px;font-weight:600;background:var(--b-y2);color:var(--b-mut)}.by-pill.ok{background:var(--b-oks);color:var(--b-ok)}.by-pill.var{background:var(--b-vars);color:var(--b-var)}.by-pill.acc{background:var(--b-accs);color:var(--b-acc)}
.by-flode{flex:1;min-height:0;overflow:auto;padding:16px 14px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}
.by-msg{display:flex;gap:10px;max-width:92%;min-width:0}
.by-msg.du{align-self:flex-end;background:var(--b-ink);color:var(--b-bg);padding:10px 14px;border-radius:18px 18px 4px 18px;overflow-wrap:anywhere}
.by-msg.bot{align-self:flex-start}.by-msg.bot>div{min-width:0}.by-msg.bot p{margin:0;overflow-wrap:anywhere}
.by-bav{flex:none;width:28px;height:28px;border-radius:50%;background:var(--b-accs);color:var(--b-acc);display:grid;place-items:center}
.by-diff{margin:8px 0 0;border:1px solid var(--b-l);border-radius:14px;background:var(--b-yta);overflow:hidden;box-shadow:0 1px 2px rgba(11,21,51,.04)}
.by-diff summary{cursor:pointer;padding:9px 12px;font-weight:600;font-size:13.5px;color:var(--b-ink);min-height:40px;display:flex;align-items:center}
.by-diff ul{list-style:none;margin:0;padding:0 12px 10px;display:grid;gap:8px}
.by-diff li{display:grid;gap:2px;font-size:13.5px;min-width:0}.by-diff li b{color:var(--b-ink)}
.by-diff .fran{color:var(--b-mut);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--b-fel) 50%,transparent);overflow-wrap:anywhere}
.by-diff .till{color:var(--b-ok);background:var(--b-oks);border-radius:8px;padding:2px 8px;overflow-wrap:anywhere}
.by-in{padding:10px 14px 14px;border-top:1px solid var(--b-l);background:color-mix(in srgb,var(--b-bg) 88%,transparent)}
.by-chips{display:flex;gap:8px;overflow-x:auto;padding:0 0 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.by-chips::-webkit-scrollbar{display:none}
.by-chips button{flex:none;min-height:44px;padding:0 14px;border-radius:99px;border:1.5px solid var(--b-l2);background:var(--b-yta);color:var(--b-ink);font:500 14px/1 inherit;cursor:pointer;transition:background .15s,border-color .15s}
.by-chips button:hover{background:var(--b-accs);border-color:var(--b-acc)}
.by-inrad{display:flex;gap:8px;align-items:flex-end;background:var(--b-yta);border:1.5px solid var(--b-l2);border-radius:20px;padding:6px 6px 6px 14px;box-shadow:0 8px 24px -16px rgba(11,21,51,.3);transition:border-color .16s,box-shadow .16s}
.by-inrad:focus-within{border-color:var(--b-acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--b-acc) 24%,transparent)}
.by-inrad textarea{flex:1;min-width:0;border:0;outline:0;background:transparent;resize:none;font:inherit;font-size:16px;color:var(--b-ink);padding:10px 0;max-height:140px;min-height:44px}
.by-skicka{flex:none;width:44px;height:44px;border-radius:14px;border:0;background:var(--b-ink);color:var(--b-bg);display:grid;place-items:center;cursor:pointer;transition:transform .15s}.by-skicka:active{transform:scale(.94)}.by-skicka[disabled]{opacity:.5}
.by-skicka svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.by-skel{display:grid;gap:8px;width:min(260px,70vw)}.by-skel i{display:block;height:14px;border-radius:8px;background:linear-gradient(90deg,var(--b-y2) 25%,var(--b-l) 50%,var(--b-y2) 75%);background-size:220% 100%;animation:by-s 1.4s ease-in-out infinite}.by-skel i+i{width:60%}
@keyframes by-s{from{background-position:120% 0}to{background-position:-120% 0}}
.by-pb{flex:1;min-height:0;overflow:auto;padding:16px 14px 24px}
.by-kort{max-width:560px;margin:0 auto;background:var(--b-yta);border:1px solid var(--b-l);border-radius:24px;padding:18px;box-shadow:0 1px 2px rgba(11,21,51,.05),0 28px 60px -34px rgba(11,21,51,.35)}
.by-agent{display:flex;gap:14px;align-items:center;margin:0 0 14px}.by-av{flex:none;width:52px;height:52px;border-radius:18px;background:var(--b-ink);color:var(--b-bg);display:grid;place-items:center;font:600 22px/1 var(--disp,inherit)}
.by-an{min-width:0}.by-an b{display:block;font-size:20px;letter-spacing:-.02em;overflow-wrap:anywhere}.by-an span{color:var(--b-mut);font-size:14px;overflow-wrap:anywhere}
.by-bubbla{background:var(--b-y2);border-radius:18px 18px 18px 6px;padding:12px 14px;margin:0 0 14px;transition:box-shadow .4s,background .4s}.by-bubbla small{display:block;color:var(--b-mut);font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin:0 0 4px}.by-bubbla p{margin:0 0 8px;overflow-wrap:anywhere}
.by-rader{margin:0;display:grid;gap:2px}.by-rader>div{display:grid;gap:2px;padding:10px 10px;border-radius:12px;transition:background .4s,box-shadow .4s}
.by-rader dt{font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;color:var(--b-mut)}.by-rader dd{margin:0;overflow-wrap:anywhere}
.by .ny{background:var(--b-oks);box-shadow:inset 3px 0 0 var(--b-ok);animation:by-ny 2.6s ease-out}
@keyframes by-ny{from{background:color-mix(in srgb,var(--b-ok) 28%,transparent)}}
.by-not{margin:0 14px 14px;padding:10px 14px;border-radius:14px;font-size:14.5px}.by-not.ok{background:var(--b-oks);color:var(--b-ok)}.by-not.fel{background:color-mix(in srgb,var(--b-fel) 12%,transparent);color:var(--b-fel)}
.by-blad{position:fixed;inset:0;z-index:70;background:rgba(8,10,18,.4);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);display:grid;place-items:end center;font-family:var(--sans,inherit);animation:by-t .2s ease-out}
.by-blad>div{background:var(--bg,#fff);color:var(--ink,#0b1533);width:100%;max-width:560px;max-height:92dvh;overflow:auto;border-radius:28px 28px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -24px 64px -24px rgba(0,0,0,.5);animation:by-u .34s cubic-bezier(.2,.9,.25,1.04)}
.by-bh{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 6px}.by-bh h2{margin:0;font:400 24px/1.1 var(--disp,inherit);letter-spacing:-.02em}
.by-x{width:44px;height:44px;border:0;border-radius:12px;background:var(--yta2,#f1f1f3);color:inherit;display:grid;place-items:center;cursor:pointer}
.by-ing{color:var(--mut,#5d6578);margin:0 0 14px;font-size:15px}
.by-vers{list-style:none;margin:0;padding:0;display:grid;gap:8px}.by-vers li{display:flex;gap:10px;align-items:center;justify-content:space-between;border:1px solid var(--linje,#e3e6ee);border-radius:16px;padding:12px 14px;background:var(--yta,#fff)}
.by-vers li.nu{border-color:var(--acc,#2c5cff);background:var(--acc-svag,#eaf0ff)}.by-vt{min-width:0;display:grid;gap:3px}.by-vt b{overflow-wrap:anywhere}.by-vt small{color:var(--mut,#5d6578);overflow-wrap:anywhere}
.by-vd{display:flex;flex-wrap:wrap;gap:4px}.by-vd i{font-style:normal;font-size:12px;padding:2px 8px;border-radius:99px;background:var(--yta2,#f1f1f3);color:var(--mut,#5d6578)}
.by-prov{max-height:42dvh;min-height:140px;background:var(--yta2,#f4f5f8);border-radius:16px;margin:0 0 10px}
.by-rostval{display:flex;align-items:center;gap:10px;min-height:44px;margin:10px 0 0;color:var(--mut,#5d6578);font-size:14.5px;cursor:pointer}.by-rostval input{width:22px;height:22px}.by-rostval svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;vertical-align:-3px;margin-right:6px}
@keyframes by-u{from{transform:translateY(32px);opacity:0}}@keyframes by-t{from{opacity:0}}
@media (min-width:881px){
  .by{flex-direction:row;gap:0;padding:0 0 0}
  .by-tabs{display:none}
  .by section{flex:none}.by-chatt{width:min(440px,38%);border-right:1px solid var(--b-l)}.by-prev{flex:1!important}
  .by [data-dold]{display:flex}
  .by-pb{padding:28px 32px}
  .by-blad{place-items:center}.by-blad>div{border-radius:28px}
}
@media (max-width:880px){.by-ph .by-spacer{display:none}.by-ph .by-prim{flex:1}}
@media (prefers-reduced-motion:reduce){.by *,.by-blad,.by-blad>div{animation:none!important;transition:none!important}}

.by-mkl{display:inline-flex;min-height:44px;padding:0 14px}
@media (min-width:881px){.by-mkl{display:none}}
.by-ch .by-mkl{flex:1 1 100%;margin:2px 0 0}
@media (min-width:881px){.by-ch .by-mkl{display:none}}
