/* Bureo shell M1 (shell-m1.js): sidebar | chat (main column) | work panel, on a soft peach ground in one glass window.
   Everything is scoped to html.b-m1, so the classic layout is untouched while the switch is off. Loaded after the app's own
   styles, so equal specificity wins by source order. Concentric radii: window 30 px, inset 10 px, inner surfaces 30 − 10 − 1 = 19 px.
   Light and dark follow :root[data-theme] (bureo-ds.css tokens); motion stops under prefers-reduced-motion. */
/* the tokens live in m1-kit.css (the design system, --k-*); these older names are its aliases */
html.b-m1{--m1-r:var(--k-r-win);--m1-pad:var(--k-pad);--m1-in:var(--k-r-in);--m1-nav:var(--k-nav-w);--b-chat-w:var(--k-chat-w);
  --m1-ground:var(--k-ground);--m1-glass:var(--k-glass);--m1-edge:var(--k-edge);--m1-chat:var(--km-chat);--m1-work:var(--k-work);--m1-card:var(--k-card);--m1-soft:var(--k-soft);
  --m1-hover:var(--k-hover);--m1-text:var(--k-text);--m1-text-2:var(--k-text-2);--m1-text-3:var(--k-text-3);--m1-me:var(--k-me);--m1-me-ink:var(--k-me-ink);
  --m1-olive:#4A5C00;--m1-shadow:var(--k-sh-win)}
html.b-m1[data-theme="dark"]{--m1-olive:#D8F500}
/* S74 app size A (owner 13.10): the window fills the browser (no peach stage, rim or shadow around it; inside unchanged) and the
   whole UI is 112.5 % (body 16 → 18): type, spacing, controls and icons grow together. The desk zooms the page (--k-zoom; viewport
   heights inside divide by it; JS that turns rects into px divides by BureoM1.zoom()); a phone scales its viewport the same
   (shell-m1.js scaleViewport: initial-scale 1.125, so the layout is 1/1.125 as wide and nothing inside needs to know). */
html.b-m1{--k-zoom:1}
/* from 1024 px (the 3-column desk needs ~910 CSS px), and only where the browser has CSS zoom (else no height division either) */
/* the text size (owner 14.10: "16 px default, ability to zoom in", in percent): Settings › Accessibility 100 · 110 · 125 · 150 % sets
   --m1-z (100 % = 1) before first paint (index.html) and on change (shell-m1.js setSize); ?size=100|110|125|150 for testing */
@supports (zoom:1){@media (min-width:1024px){html.b-m1{--k-zoom:var(--m1-z,1);zoom:var(--k-zoom)}}}
html.b-m1,html.b-m1 body{background:var(--m1-ground);background-attachment:fixed}
html.b-m1 body{padding:0;min-height:100dvh}
@media (min-width:861px){
  html.b-m1 body{height:calc(100dvh / var(--k-zoom));min-height:0;overflow:hidden}
  html.b-m1 .shell,html.b-m1 .shell.b-split{max-width:none;height:calc(100dvh / var(--k-zoom));margin:0;padding:var(--m1-pad);gap:0;align-items:stretch;
    grid-template-columns:var(--m1-nav) var(--m1-pad) var(--b-chat-w) var(--m1-pad) minmax(0,1fr);grid-template-rows:minmax(0,1fr);
    background:var(--ka-win);-webkit-backdrop-filter:blur(40px) saturate(1.4);backdrop-filter:blur(40px) saturate(1.4);border:0;border-radius:0;box-shadow:none;
    transition:grid-template-columns var(--b-d-slow) var(--b-ease);overflow:hidden}
  html.b-m1 .shell{--ka-win:rgba(255,255,255,.5);line-height:1.5}html.b-m1[data-theme="dark"] .shell{--ka-win:rgba(24,24,28,.62)}   /* the study's M1 window glass (.k-win) */
  html.b-m1 body.b-dragging .shell{transition:none}
  html.b-m1.b-m1-workoff .shell,html.b-m1.b-m1-workoff .shell.b-split{grid-template-columns:var(--m1-nav) var(--m1-pad) minmax(0,1fr) var(--m1-pad) 52px}
  html.b-m1 .agent{position:relative;top:auto;height:auto;min-height:0;border-radius:var(--m1-in);box-shadow:0 1px 0 rgba(20,22,30,.03)}
  html.b-m1 .app{height:auto;min-height:0;overflow:auto;border-radius:var(--m1-in);box-shadow:none;background:var(--m1-work);padding:14px 18px 22px;overscroll-behavior:contain}
  html.b-m1.b-m1-workoff .app{display:none}
  html.b-m1 .b-resizer{position:relative;top:auto;height:auto;width:var(--m1-pad)}
  html.b-m1 .b-resizer::before,html.b-m1 .m1-grip::before{width:4px;height:40px}
  html.b-m1 .m1-grab,html.b-m1 #m1MenuBtn,html.b-m1 #m1WorkBtn{display:none}
  html.b-m1 #agHead #gwIn{margin-left:auto}
}
/* ---------- sidebar ---------- */
.m1-side,.m1-grip,.m1-hero,.m1-strip,.m1-scrim,.m1-grab,.m1-hb,.m1-wclose{display:none}
/* the menu is the study's (mix.js nav: k-n1 k-mbrand k-mnew k-mi k-mh k-mchats k-mco, all in m1-kit.css); only what the app's
   markup adds is here: the brand is a button home, the person card is the profile menu's button, the history scrolls */
html.b-m1 .m1-side{display:flex;min-width:0;min-height:0;overflow:hidden}
html.b-m1 .m1-side.k-m1{background:none}
html.b-m1 .m1-grip{display:flex;align-items:center;justify-content:center;cursor:col-resize;touch-action:none;outline:none;border-radius:6px}
html.b-m1 .m1-grip::before{content:"";border-radius:4px;background:var(--b-line-strong);transition:background var(--b-d),height var(--b-d) var(--b-ease)}
html.b-m1 .m1-grip:hover::before,html.b-m1 .m1-grip:focus-visible::before,html.b-m1 .m1-grip.is-drag::before{background:var(--m1-text);height:64px}
html.b-m1 .b-resizer:hover::before,html.b-m1 .b-resizer:focus-visible::before,html.b-m1 .b-resizer.is-drag::before{background:var(--m1-text)}
html.b-m1 .m1-grip:focus-visible,html.b-m1 .b-resizer:focus-visible{box-shadow:inset 0 0 0 2px var(--b-focus)}
.m1-home{display:flex;align-items:center;gap:8px;border:0;background:none;padding:0;border-radius:10px;cursor:pointer;color:inherit;font:inherit;letter-spacing:inherit;min-width:0}
.m1-home b{font-weight:inherit}
.m1-mark{width:22px;height:22px;flex:none}.m1-mark-2{fill:var(--m1-text)}
.m1-grow{flex:1;min-width:0}
.m1-side :is(.k-mi,.m1k-mi):hover,.m1-side .k-tgl:hover,.m1-side .k-mco:hover{background:var(--ka-card)}
.m1-side :is(.k-mi,.m1k-mi)[aria-current]:hover{background:var(--ka-card)}
.m1-hist{display:flex;flex-direction:column;min-height:0;overflow:auto;scrollbar-width:thin}
.m1-areas{display:flex;flex-direction:column;flex:none}
.m1-foot{position:relative;flex:none}
.m1-me{border:0;width:100%;text-align:left;color:var(--k-text);font:inherit;cursor:pointer}
.m1-who{display:block;min-width:0}
.m1-chevup{color:var(--k-text-3);display:grid}
/* the profile menu opens upward */
.m1-menu{position:absolute;left:0;bottom:calc(100% + 6px);width:max(100%,260px);max-height:min(70dvh,560px);overflow:auto;background:var(--m1-card);color:var(--m1-text);border-radius:16px;padding:6px;box-shadow:0 30px 70px -20px rgba(20,22,30,.45),0 0 0 1px var(--m1-soft);z-index:60}
.m1-menu[hidden]{display:none}
.m1-menu hr{border:0;border-top:1px solid var(--m1-soft);margin:6px 4px}
.m1-mh{font-size:var(--k-t-cap);letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--m1-text-3);padding:6px 10px 4px}
.m1-mi{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;color:inherit;border-radius:10px;padding:8px 10px;font:inherit;font-size:var(--k-t-sm);text-align:left;cursor:pointer;min-height:38px}
.m1-mi:hover,.m1-mi:focus-visible{background:var(--m1-soft);outline:none}
.m1-mi svg{color:var(--m1-text-2);flex:none}
.m1-mi>span:not(.m1-chev):not(.m1-sp){flex:1;min-width:0}
.m1-mi small{color:var(--m1-text-3);font-size:var(--k-t-xs);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.m1-mi[data-mm="sub"]>span:not(.m1-chev):not(.m1-sp):has(+small){flex:none}
.m1-mi[data-mm="sub"] small{margin-left:auto}   /* a row with a value: the label keeps its words, the value («Maja Novak s.p. · Slovenija») truncates at 390 */
.m1-mi[aria-checked="true"]::after{content:"✓";font-weight:600;margin-left:auto}
.m1-mi[aria-expanded="true"] .m1-chev{transform:rotate(90deg)}
.m1-chev{display:grid;color:var(--m1-text-3);transition:transform var(--b-d)}
.m1-sp{width:17px;flex:none}
.m1-subm{padding-left:16px;display:flex;flex-direction:column}
/* collapsed: the study's .k-nav-off (on the window, shell-m1.js applyLayout) shows the icons only */
html.b-m1 .k-nav-off .m1-home{flex-direction:column}
html.b-m1 .k-nav-off .k-mnew .k-kbd{display:none}
html.b-m1 .k-nav-off .m1-menu{left:4px}
/* ---------- the chat: light, the main column ---------- */
html.b-m1:not([data-theme="dark"]) .agent{--panel:#FFFFFF;--panel-2:#F3F4F6;--on-dark:#0B0B0C;--on-dark-muted:#5E636A;--b-chat:#FFFFFF;--b-chat-2:#F3F4F6;--b-on-chat:#0B0B0C;--b-on-chat-2:#5E636A;background:var(--m1-chat);color:var(--m1-text)}
html.b-m1:not([data-theme="dark"]) .ag-head{border-bottom-color:var(--m1-soft)}
html.b-m1:not([data-theme="dark"]) .m.me{background:var(--m1-me);color:var(--m1-me-ink)}
html.b-m1:not([data-theme="dark"]) .m.ai b{color:var(--m1-text)}
html.b-m1:not([data-theme="dark"]) .ag-row,html.b-m1:not([data-theme="dark"]) .ag-kv,html.b-m1:not([data-theme="dark"]) .ag-help div{border-top-color:var(--m1-soft)}
html.b-m1:not([data-theme="dark"]) .ag-card .code{background:#EEF0F2;color:#3A4500}
html.b-m1:not([data-theme="dark"]) .ag-btn{border-color:#D3D6DA;color:var(--m1-text)}
html.b-m1:not([data-theme="dark"]) .ag-btn:hover{border-color:#A9AEB4;background:#F3F4F6}
html.b-m1:not([data-theme="dark"]) .ag-btn.lime{background:var(--b-accent);border-color:var(--b-accent);color:#0B0B0C}
html.b-m1:not([data-theme="dark"]) .ag-btn.quiet{color:var(--m1-text-2);border-color:transparent}
html.b-m1:not([data-theme="dark"]) .ag-btn.quiet:hover{color:var(--m1-text);background:none}
html.b-m1:not([data-theme="dark"]) .ag-step svg,html.b-m1:not([data-theme="dark"]) .ag-done,html.b-m1:not([data-theme="dark"]) .ag-kv.tot,html.b-m1:not([data-theme="dark"]) .ye-doc svg{color:var(--m1-olive)}
html.b-m1:not([data-theme="dark"]) .ag-chips button,html.b-m1:not([data-theme="dark"]) .ag-sug button{border-color:#E1E3E6;background:#FFFFFF;color:#2A2D31}
html.b-m1:not([data-theme="dark"]) .ag-chips button:hover,html.b-m1:not([data-theme="dark"]) .ag-sug button:hover{border-color:#A9AEB4;background:#F7F7F8;color:var(--m1-text)}
html.b-m1:not([data-theme="dark"]) .agent :focus-visible{outline-color:#0B0B0C}
html.b-m1:not([data-theme="dark"]) .ag-toggle{border-color:#D3D6DA;color:var(--m1-text)}
html.b-m1:not([data-theme="dark"]) .ag-thread{scrollbar-color:#D0D3D7 transparent}
html.b-m1:not([data-theme="dark"]) .ag-peek{color:var(--m1-text-2)}
html.b-m1:not([data-theme="dark"]) .ag-sig{box-shadow:0 0 0 1px var(--m1-soft)}
html.b-m1:not([data-theme="dark"]) .agent .card.dark{background:#F3F4F6;color:var(--m1-text)}
html.b-m1 .ag-thread{padding:12px 22px 10px}
html.b-m1 .ag-head{padding:12px 16px}
/* the home hero */
/* the home is the study's (mix.js home: k-thread > k-tcol > k-hero2 / k-amsg, all in m1-kit.css); here only how it sits in the
   app's chat column (it stands in for the thread while the conversation has not started) */
html.b-m1 .m1-hero{display:block;flex:1;min-height:0;background:none}
html.b-m1 .m1-hero[hidden],html.b-m1.m1-onboarding .m1-hero{display:none}
.m1-hero :is(.k-stc,.m1k-stc),.m1-hero .k-fc,.m1-hero .k-ps button{cursor:pointer}
.m1-hero .k-fc{border:0;text-align:left;color:var(--k-text)}
.m1-hero .k-fc:hover,.m1-hero .k-fc:focus-visible{z-index:4}
.m1-hero :is(.k-stc,.m1k-stc):hover{border-color:var(--k-line-strong)}
.m1-hero .k-ps button{padding:0}
.m1-hero .k-ps button[aria-pressed="true"]{background:var(--ka-soft)}
.m1-hero .k-result{justify-content:flex-start}
/* ---------- the work panel ---------- */
html.b-m1 .app .top .brand{display:none}
html.b-m1 .m1-wclose{display:grid}
html.b-m1 .m1-strip{display:none;flex-direction:column;align-items:center;gap:8px;padding:12px 0;background:var(--m1-work);border-radius:var(--m1-in)}
html.b-m1.b-m1-workoff .m1-strip{display:flex}
.m1-sb{width:34px;height:34px;border-radius:50%;border:1px solid var(--m1-soft);background:var(--m1-card);color:var(--m1-text-2);display:grid;place-items:center;cursor:pointer;padding:0}
.m1-sb:hover{color:var(--m1-text)}
.m1-sd{width:20px;height:1px;background:var(--m1-soft)}
.m1-theme-card .seg{margin-top:10px}
/* ---------- phone: the chat is the screen; the menu is a drawer; the work is a sheet ---------- */
@media (max-width:860px){
  html.b-m1 body{padding:0}
  html.b-m1 .shell{line-height:1.5}   /* the study's window line height, on a phone too */
  html.b-m1 .shell,html.b-m1 .shell.b-split{display:block;max-width:none;margin:0}
  html.b-m1 .agent,html.b-m1 .agent.open{position:fixed;inset:0;top:0;left:0;right:0;bottom:0;height:100dvh;max-height:none;border-radius:0;box-shadow:0 1px 0 rgba(20,22,30,.03);z-index:20}
  html.b-m1 .agent:not(.open) .ag-thread{display:flex}
  html.b-m1 .agent:not(.open) .ag-head{border-bottom:1px solid var(--m1-soft);padding-bottom:8px;cursor:default}
  html.b-m1 .agent:not(.open) .ag-who>span{display:flex}
  html.b-m1 .agent:not(.open) .ag-peek{display:none}
  html.b-m1 .ag-toggle,html.b-m1 .agent .b-grab,html.b-m1 .m1-grip,html.b-m1 .b-resizer,html.b-m1 .m1-strip,html.b-m1 .m1-wclose{display:none!important}
  html.b-m1 .ag-head{padding:8px 10px;gap:8px;padding-top:max(8px,env(safe-area-inset-top))}
  html.b-m1 .m1-hb{display:inline-flex;align-items:center;gap:6px;height:40px;min-width:40px;justify-content:center;border:1px solid var(--m1-soft);background:var(--m1-card);color:var(--m1-text);border-radius:999px;padding:0 10px;font:inherit;font-size:var(--k-t-sm);cursor:pointer;flex:none}
  /* the work sheet */
  html.b-m1 .app{position:fixed;left:0;right:0;bottom:0;top:auto;height:58dvh;z-index:45;border-radius:24px 24px 0 0;padding:4px 14px max(20px,env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;
    background:var(--m1-work);box-shadow:0 -20px 60px -20px rgba(20,22,30,.5);transform:translateY(105%);visibility:hidden;transition:transform var(--b-d-slow) var(--b-ease),visibility 0s linear var(--b-d-slow)}
  html.b-m1.b-m1-sheet .app{transform:none;visibility:visible;transition:transform var(--b-d-slow) var(--b-ease)}
  html.b-m1 .m1-grab{display:flex;position:sticky;top:0;z-index:2;width:100%;justify-content:center;align-items:center;height:28px;border:0;background:var(--m1-work);cursor:pointer;padding:0;margin:0 0 4px;flex:none}
  html.b-m1 .m1-grab i{width:40px;height:5px;border-radius:3px;background:var(--b-line-strong)}
  html.b-m1 .m1-scrim{display:block;position:fixed;inset:0;background:rgba(11,11,12,.35);opacity:0;pointer-events:none;z-index:44;transition:opacity var(--b-d)}
  html.b-m1.b-m1-sheet .m1-scrim,html.b-m1.b-m1-drawer .m1-scrim{opacity:1;pointer-events:auto}
  html.b-m1.b-m1-drawer .m1-scrim{z-index:49}
  /* the menu drawer */
  html.b-m1 .m1-side{position:fixed;left:0;top:0;bottom:0;width:min(86vw,300px);z-index:50;background:var(--m1-work);padding:max(10px,env(safe-area-inset-top)) 8px max(10px,env(safe-area-inset-bottom));transform:translateX(-105%);visibility:hidden;transition:transform var(--b-d-slow) var(--b-ease),visibility 0s linear var(--b-d-slow);box-shadow:20px 0 60px -30px rgba(20,22,30,.5)}
  html.b-m1.b-m1-drawer .m1-side{transform:none;visibility:visible;transition:transform var(--b-d-slow) var(--b-ease)}
  html.b-m1 .m1-side :is(.k-mi,.m1k-mi),html.b-m1 .m1-side .k-mnew,html.b-m1 .m1-side .k-tgl,html.b-m1 .m1-home{min-height:var(--k-tap)}
  html.b-m1.b-m1-navoff .m1-lbl{display:revert}
  html.b-m1 .m1-tgl{display:none}
}
@media (prefers-reduced-motion:reduce){.m1-orb i{animation:none}html.b-m1 .shell,html.b-m1 .app,html.b-m1 .m1-side,html.b-m1 .m1-scrim,.m1-chev{transition:none!important}}
html.b-m1 #agHead #gwIn{flex:none}
/* chat onboarding's cards (door.js: dl.onb-card + .onb-acts) on the light chat */
html.b-m1:not([data-theme="dark"]) .agent .onb-card{background:#F3F4F6;color:var(--m1-text)}
html.b-m1:not([data-theme="dark"]) .agent .onb-card>*{border-color:var(--m1-soft)}
html.b-m1:not([data-theme="dark"]) .agent .onb-card dt,html.b-m1:not([data-theme="dark"]) .agent .onb-card small{color:var(--m1-text-2)}
/* the work panel shows the page, not the classic chrome: the sidebar is the nav; language, bell and avatar are in the profile
   menu (html.m1-chrome puts the classic header back, for the classic suites' flag-on run) */
html.b-m1:not(.m1-chrome) .app>.top{display:none}
html.b-m1 .app .subbar{position:relative;padding-right:52px}
html.b-m1 .m1-wclose{position:absolute;top:0;right:0}
/* confirm cards in the chat column */
html.b-m1 .agent .b-confirm-dock{position:static;width:auto;margin:8px 22px 8px;max-height:max(60%,calc(100% - 140px));overflow:auto;flex:none;border-radius:22px}   /* the card takes the room it needs, the last chat line stays above it (ES inv S6: DESPUÉS never cut at the buttons) */
@media (max-width:860px){html.b-m1 .agent .b-confirm-dock{margin:8px 12px;max-height:68%}}
/* a total inside the card ("= …"): a rule above it, like a sum on paper */
html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-kv,.m1k-kv) :is(.k-sum,.m1-cfsum){border-top:1px solid var(--k-line);padding-top:4px;margin-top:2px;color:var(--k-text)}
html.b-m1 :is(.k-cc,.m1k-cc) .b-confirm-to{margin:0;color:var(--k-text)}
/* Why, To and Then read alike: the parts' size and the text colour (the kit's note was smaller and grey) */
html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts) .b-confirm-note,html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts) .m1-then,html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts) .b-confirm-to{font-size:inherit;line-height:1.45;color:var(--k-text)}
/* the quick chips scroll sideways, fading at the edge */
html.b-m1 .ag-chips{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);padding-right:40px;scroll-padding-right:40px}

/* ================= the study's look (docs/ux/chat-studies/mix/M1), HQ 8 definition of done ================= */
html.b-m1 body{font-size:var(--k-t-md)}
/* chat head: the conversation's title, the text nav and the bell (no assistant avatar) */
html.b-m1 .ag-head{border-bottom:0;padding:14px 16px 8px 20px;min-height:52px;gap:10px}
html.b-m1 .ag-av,html.b-m1 .ag-who{display:none}
/* the head row is the study's .k-ctop (k-ct, k-tnav, k-ichip from m1-kit.css) inside the app's #agHead */
html.b-m1 .m1-chattop{display:flex;align-items:center;gap:10px;flex:1;min-width:0;background:none}
html.b-m1 .m1-chattop :is(.k-ct,.m1k-ct){font-size:var(--k-t-sm);font-weight:500;min-width:0}
html.b-m1 .m1-chattop :is(.k-ichip,.m1k-ichip){background:none;cursor:pointer;flex:none;min-height:28px}
html.b-m1 .m1-chattop :is(.k-ichip,.m1k-ichip) svg{width:14px;height:14px}
html.b-m1 .agent{container-type:inline-size}
@container (max-width:560px){html.b-m1 .m1-chattop .m1-tnav{display:none}}   /* the chat head's nav only: the work head keeps its tabs */
/* the home: the thread steps aside for the study's hero */
/* (html.m1-chrome, the classic suites' flag-on run, keeps the classic chip row) */
html.b-m1.b-m1-home #agThread,html.b-m1.b-m1-home:not(.m1-chrome) #agChips,html.b-m1.b-m1-home .agent .b-confirm-dock{display:none}
/* one suggestion above the composer */
html.b-m1 .m1-sug{flex:none;padding:0 14px 6px}
html.b-m1 .m1-sug[hidden]{display:none}
.m1-sugc{border:0;font:inherit;font-size:var(--k-t-xs);font-weight:500;cursor:pointer}
/* the composer: the study's wide white pill, ghost autocomplete with a Tab hint */
html.b-m1 .ag-compose input[type=text]{font-size:var(--k-t-base);position:relative;z-index:1;background:transparent}
.m1-ghost{position:absolute;display:flex;align-items:center;font-size:var(--k-t-base);color:var(--m1-text-3);pointer-events:none;white-space:pre;overflow:hidden;max-width:60%}
.m1-ghost i{font-style:normal;color:transparent}
.m1-tab{font-family:var(--b-mono,monospace);font-size:var(--k-t-cap);border:1px solid var(--b-line-strong);border-bottom-width:2px;border-radius:5px;padding:0 5px;color:var(--m1-text-2);flex:none}
.m1-tab[hidden]{display:none}
html.b-m1 #bCtx{display:none}
/* messages: the lavender bubble with its time; the agent's name and time row */
html.b-m1 .ag-thread{padding:6px max(22px,calc((100% - 660px) / 2)) 12px;gap:16px}
html.b-m1 .m{font-size:var(--k-t-base);line-height:1.55}
html.b-m1 .m.me{border-radius:18px;padding:10px 14px;max-width:72%}
html.b-m1 .m.me[data-m1t]::after{content:attr(data-m1t);display:block;font-size:var(--k-t-cap);opacity:.7;text-align:right;margin-top:2px}
html.b-m1 .m.ai[data-m1t]:first-child::before,html.b-m1 .m.me+.m.ai[data-m1t]::before{content:"Bureo  " attr(data-m1t);white-space:pre;display:block;font-size:var(--k-t-xs);font-weight:600;margin:0 0 6px;padding-left:26px;min-height:18px;line-height:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M11 5H35a12.5 12.5 0 0 1 0 25H11Z' fill='%23D8F500'/%3E%3Cpath d='M11 34H39a12.5 12.5 0 0 1 0 25H11Z' fill='%230B0B0C'/%3E%3C/svg%3E") no-repeat 0 50%/18px 18px}
html.b-m1[data-theme="dark"] .m.ai[data-m1t]:first-child::before,html.b-m1[data-theme="dark"] .m.me+.m.ai[data-m1t]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M11 5H35a12.5 12.5 0 0 1 0 25H11Z' fill='%23D8F500'/%3E%3Cpath d='M11 34H39a12.5 12.5 0 0 1 0 25H11Z' fill='%23F2F3F5'/%3E%3C/svg%3E")}
html.b-m1 .m.ai>*{margin-left:26px}
html.b-m1 .ag-steps{font-size:var(--k-t-sm)}
/* the confirm card = the kit's :is(.k-cc,.m1k-cc) (shell-m1.js toKit puts the classes on); bridge rules only: the dock, the What list when
   the To rows are split out, the approver line, a decided card */
html.b-m1 .agent .b-confirm:is(.k-cc,.m1k-cc){padding:0;margin:0;color:var(--k-text)}
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-cch,.m1k-cch){margin:0}
/* the study's head: the title, its grey line (what it is made from · nothing sent yet) and a chip */
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-cch,.m1k-cch) .b-confirm-sub{display:block;margin:2px 0 0;line-height:1.35}
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-cch,.m1k-cch) :is(.k-chip,.m1k-chip){flex:none}
/* What: at most 5 rows (shell-m1.js toKit), the rest of what the action writes behind "Show more" */
html.b-m1 .agent :is(.k-cc,.m1k-cc) .m1-cfmore{margin-top:4px}
html.b-m1 .agent :is(.k-cc,.m1k-cc) .m1-cfmore>summary{min-height:28px;font-size:var(--k-t-xs)}
html.b-m1 .agent :is(.k-cc,.m1k-cc) .m1-cfmore :is(.k-kv,.m1k-kv){margin-top:4px}
/* the buttons stay in view while the card scrolls in its dock (desk and phone) */
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-act,.m1k-act){position:sticky;bottom:0;z-index:1;background:var(--ka-card)}
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-cch,.m1k-cch) h4{margin:0}
:is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts){margin:0}
:is(.k-cc,.m1k-cc) .m1-to{list-style:none;margin:0;padding:0;display:grid;gap:2px}
:is(.k-cc,.m1k-cc) .m1-to li{display:flex;justify-content:space-between;gap:12px;background:none;padding:0;border:0;border-radius:0}
:is(.k-cc,.m1k-cc) .m1-to li span{color:var(--k-text-2)}
:is(.k-cc,.m1k-cc) .m1-to li b{font-weight:500}
:is(.k-cc,.m1k-cc) .b-confirm-note,:is(.k-cc,.m1k-cc) .m1-then{margin:0;color:var(--k-text-2)}
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-act,.m1k-act){margin:0}
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-act,.m1k-act) :is(.k-who,.m1k-who){display:flex;gap:6px;align-items:center;margin:0 0 0 auto}
html.b-m1 .agent :is(.k-cc,.m1k-cc) :is(.k-who,.m1k-who) .b-av{width:18px;height:18px;font-size:9px}
/* a decided card (approved / declined) keeps its approver line, never its buttons */
html.b-m1 .agent .b-confirm[data-state] .b-confirm-acts :is(.k-btn,.m1k-btn),html.b-m1 .agent .b-confirm[data-state] .b-confirm-acts .b-btn,html.b-m1 .agent .b-diff[data-state] .b-confirm-acts .b-btn{display:none}
/* ---------- the work panel: the study's header; the page in the study's design language ---------- */
html.b-m1 .app{padding:0;display:flex;flex-direction:column;font-size:var(--k-t-md)}
html.b-m1 .m1-whead{position:sticky;top:0;z-index:3;background:none;flex:none}html.b-m1 .m1-whead.m1-stuck{background:var(--k-work)}   /* flex:none: a tall page in the phone sheet (a flex column) squeezed the head */
html.b-m1 .m1-whead .k-ibc[aria-pressed="true"]{background:var(--ka-soft);color:var(--k-text)}
html.b-m1:not(.m1-chrome) .app>.subbar,html.b-m1:not(.m1-chrome) #bStrip{display:none}
html.b-m1 #main{padding:2px 16px 18px}
html.b-m1 .app .card{border:0;border-radius:20px;box-shadow:0 10px 30px -24px rgba(20,22,30,.45);padding:16px 18px}
html.b-m1 .app .card h2{font-size:var(--k-t-base);font-weight:500;letter-spacing:-.01em}
html.b-m1 .app h1{font-weight:500;letter-spacing:-.025em}
html.b-m1 .app .card.dark{border-radius:20px}
/* a page's own tab row (.seg: Payroll's Plače · Odsotnosti · Evidenca ur) reads as every work head's tabs: the selected one a soft
   pill, never a black one (one black per view: the page's main action; App fix 1) */
html.b-m1 .app .seg{background:none;border:0;box-shadow:none;gap:2px}
html.b-m1 .app .seg button{background:none;color:var(--k-text-2);border-radius:999px}
html.b-m1 .app .seg button[aria-pressed="true"],html.b-m1 .app .months button.on{background:var(--ka-soft);color:var(--k-text)}
html.b-m1:not([data-theme="dark"]) .app .card:not(.dark){background:#FFFFFF}
/* wide: the work panel takes the chat's room too */
@media (min-width:861px){
  html.b-m1.b-m1-wide .shell,html.b-m1.b-m1-wide .shell.b-split{grid-template-columns:var(--m1-nav) var(--m1-pad) 0 0 minmax(0,1fr)}
  html.b-m1.b-m1-wide .agent,html.b-m1.b-m1-wide .b-resizer{visibility:hidden;overflow:hidden}
}
/* the document view: a draft invoice is the panel, the classic page around it steps aside */
html.b-m1.m1-doc #main>section[data-view="invoices"]:not(.bureo-v2-on)>:not(#bDraft):not(#m1Earlier){display:none}
/* dark: the study's dark (chat #1B1C20, work #141518, cards #1F2024) */
html.b-m1[data-theme="dark"] .agent{background:var(--m1-chat);color:var(--k-text);--panel:var(--m1-chat);--panel-2:var(--m1-card);--b-chat:var(--m1-chat);--b-chat-2:var(--m1-card)}
html.b-m1[data-theme="dark"] .app .card:not(.dark){background:var(--m1-card)}
/* the work panel's dark ground is the study's (#141518), not the classic dark surface (bureo-ds.css :root[data-theme=dark] .app) */
html.b-m1[data-theme="dark"] .app{background:var(--m1-work)}
html.b-m1[data-theme="dark"] .m.me{background:var(--m1-me);color:var(--m1-me-ink)}
@media (max-width:860px){
  html.b-m1 .m1-stc{min-height:var(--k-tap)}
  html.b-m1 .m1-whead{position:sticky;top:28px}   /* under the sheet's grabber */
  /* the chat head's text nav stays off; the work head's tabs (Bank To check · All · Rules, Overview Board · Table) get their own row */
  html.b-m1 .m1-chattop .m1-tnav{display:none}
  html.b-m1 .m1-whead{flex-wrap:wrap}
  html.b-m1 .m1-whead .m1-tnav{order:9;flex:1 0 100%;overflow-x:auto;scrollbar-width:none;margin:2px 0 0 2px}
  html.b-m1 .m1-whead .m1-tnav button{min-height:var(--k-tap);flex:none;white-space:nowrap;position:relative;z-index:0;background:none}   /* 44 px to tap, the study's small pill to see */
  html.b-m1 .m1-whead .m1-tnav button[aria-current]::before{content:"";position:absolute;inset:50% 0 auto;height:26px;transform:translateY(-50%);border-radius:999px;background:var(--ka-soft);z-index:-1}
}
html.b-m1:not(.m1-chrome) #app .foot,html.b-m1:not(.m1-chrome) #app .made-si,html.b-m1:not(.m1-chrome) #app .i18n-mt{display:none}
/* overview in the study's language: light big numerals, a plain black tile, the "Coming up" rows with dot pills */
html.b-m1 .app .money{font-weight:300;letter-spacing:-.03em}
html.b-m1 .app .card.dark.glow{background:#0B0B0C}
html.b-m1 .app .card.dark.glow::before,html.b-m1 .app .card.dark.glow::after{opacity:.35}
html.b-m1 .app .next-item{border:0;border-top:1px solid var(--m1-soft);border-radius:0;background:none;padding:8px 0;box-shadow:none}
html.b-m1 .app .next-item:first-child{border-top:0}
html.b-m1 .app .next-item .daybadge{width:auto;height:auto;min-width:44px;background:none!important;color:var(--m1-text-2);font-family:var(--b-mono,monospace);font-size:var(--k-t-cap);border-radius:0;display:block;text-align:left}
html.b-m1 .app .next-item .daybadge small,html.b-m1 .app .next-item .daybadge span{display:inline;font-size:var(--k-t-cap);margin-left:3px}
html.b-m1 .app .next-item .chip.soft,html.b-m1 .app .chip.soft{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 9px 3px 7px;font-size:var(--k-t-cap);font-weight:500;background:var(--m1-card);border:1px solid var(--m1-soft);color:var(--m1-text-2)}
html.b-m1 .app .chip.soft::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--b-ok,#1E9E5A)}
html.b-m1 .app .chip.line{border-radius:999px;font-size:var(--k-t-xs)}
/* the notifications panel (notify.js) opens below the chat head's bell, not over it; in the classic suites' flag-on run
   (html.m1-chrome) below the classic header's bell, which sits lower, in the work panel */
html.b-m1 .bn-panel{top:78px}
html.b-m1.m1-chrome .bn-panel{top:136px}
/* ---------- the Overview board (m1-board.js), the study's dashboard; the classic cards behind the "Table" tab (html.m1-otable)
   and in the classic suites' flag-on run (html.m1-chrome). The setup card stays while a new account has no company yet ---------- */
.m1-board{display:none}
/* a board sits on the work panel's own ground (the kit's .k-m1 root carries the study's page background) */
html.b-m1 .m1-board.k-m1{background:none}
/* the board's rows are buttons (they open the page): the UA button look off, the kit's row look on */
html.b-m1 .m1-board button.k-du{width:100%;border-left:0;border-right:0;border-bottom:0;background:none;text-align:left;color:inherit;cursor:pointer}
html.b-m1 .m1-board button.k-fcol{width:100%;border:0;text-align:left;color:inherit;cursor:pointer}
html.b-m1:not(.m1-chrome):not(.m1-otable) .m1-board{display:flex;flex-direction:column;gap:10px;grid-column:1/-1;min-width:0}
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-view="overview"]>:not(#m1Board):not(#gw-overview-co){display:none!important}
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-view="overview"]>#gw-overview-co:has([data-gwa="co-edit"]){display:none!important}
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-view="overview"]{display:flex;flex-direction:column;gap:10px;container-type:inline-size}
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-view="overview"][hidden]{display:none}
/* the Bank board (m1-board.js #m1Bank, the study's bank screen): To check · All; Rules = the app's own cards (html.m1-otable) */
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-view="bank"].m1-has-board>:not(#m1Bank){display:none!important}
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-view="bank"].m1-has-board:not([hidden]){display:flex;flex-direction:column;gap:10px}
html.b-m1.m1-otable #m1Bank{display:none}

/* ---------- bridge: the app's own composer on the study's (k-pillc: + · text · mic · send); only what the app's markup needs ---------- */
html.b-m1 #agForm.k-pillc{width:calc(100% - 28px);margin:4px auto 16px;flex:none;position:relative}
html.b-m1 #agForm.k-pillc:focus-within{border-color:var(--k-text)}
html.b-m1 #agForm.k-pillc>#agAttach{order:0}html.b-m1 #agForm.k-pillc>#agInput{order:1}html.b-m1 #agForm.k-pillc>#agMic{order:2}html.b-m1 #agForm.k-pillc>#agSend{order:3}
html.b-m1 #agForm.k-pillc .k-ib:hover{color:var(--k-text)}
html.b-m1 #agForm.k-pillc #agMic.rec{color:#fff;background:#D93A2B}
html.b-m1 #agForm.k-pillc .k-go:hover{opacity:.88}
html.b-m1 #agForm.k-pillc input[type=text]{flex:1;font-size:var(--k-t-base);color:var(--k-text);padding:8px 4px}
html.b-m1 #agForm.k-pillc input::placeholder{color:var(--k-text-3)}
/* the phone head: ☰ · Bureo · (work, once there is work) · bell; shortcuts are not shown on touch */
.m1-pbrand{display:none}
@media (max-width:860px){
  html.b-m1 #agForm.k-pillc{width:calc(100% - 20px);margin:4px auto max(10px,env(safe-area-inset-bottom))}
  html.b-m1 #agForm.k-pillc .k-ib,html.b-m1 #agForm.k-pillc .k-go{width:var(--k-tap);height:var(--k-tap)}
  html.b-m1 .m1-pbrand{display:flex;align-items:center;gap:6px;font-size:17px;flex:none}.m1-pbrand b{font-weight:500;letter-spacing:-.01em}.m1-pbrand .m1-mark{width:20px;height:20px}
  html.b-m1 #m1MenuBtn{border:0;background:none;width:var(--k-tap);height:var(--k-tap);padding:0}
  html.b-m1 #m1WorkBtn{display:none;width:var(--k-tap);height:var(--k-tap);padding:0}
  html.b-m1.m1-hadwork #m1WorkBtn{display:inline-flex}
  html.b-m1 .m1-chattop .m1-ct{display:none}
  html.b-m1 .m1-chattop .m1-ichip{width:var(--k-tap);height:var(--k-tap);border:0;border-radius:16px;box-shadow:inset 0 0 0 6px var(--km-chat),inset 0 0 0 7px var(--k-soft)}
  html.b-m1 .agent:not(.open) .ag-head,html.b-m1 .ag-head{border-bottom:0}
}
@media (hover:none),(max-width:860px){html.b-m1 .m1-kbd{display:none}}/* your message is the kit's bubble (.k-bub: base 16 / 1.6, 12 / 16 padding; HQ 27 r5 fix 2); its time stays xs */
html.b-m1 #agThread .m.me{font-size:var(--k-t-base);line-height:var(--k-lh-base);padding:12px 16px}
html.b-m1 #agThread .m.me small{font-size:var(--k-t-xs)}
/* the palette hint belongs to the tabs row: alone (one page open, no tabs) it floats under the panel button, so it goes (HQ 14) */
.b-m1 .b-strip:not(:has(.b-tab)) .b-hint{display:none}
/* phone, during setup: the "page updated · View" pill above the composer instead of the sheet over the question */
.m1-pill{display:flex;align-items:center;gap:8px;margin:0 auto 8px;padding:7px 14px;border-radius:999px;border:1px solid var(--m1-line,rgba(0,0,0,.08));background:var(--m1-card,#fff);color:var(--m1-text,#0b0b0c);font:inherit;font-size:14px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.m1-pill b{font-weight:600;text-decoration:underline}

/* starter cards in longer languages (es, de …): the grey line keeps the study's two lines at most, the title never splits a word */
html.b-m1 :is(.k-stc,.m1k-stc) small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
html.b-m1 :is(.k-stc,.m1k-stc)>b{text-wrap:balance;hyphens:manual}
/* the history list never ends on a cut-off row or day header: it fades out at the bottom when it runs on (m1-more, set by paintSide) */
html.b-m1 .m1-hist.m1-more{-webkit-mask-image:linear-gradient(#000 calc(100% - 28px),transparent);mask-image:linear-gradient(#000 calc(100% - 28px),transparent)}
/* phone: the sheet scrolls itself (not #app), so the sticky work head keeps a solid background there and never shows the page through */
@media (max-width:860px){html.b-m1 .m1-whead{background:var(--k-work)}}
/* phone sheet (HQ 17): the study's head keeps its ⤢ / ✕ (✕ closes the sheet, ⤢ makes it full height); the scrim covers the
   whole screen edge to edge, so the dimmed chat is never cut at the right */
@media (max-width:860px){
  html.b-m1.b-m1-wide.b-m1-sheet .app{height:100dvh;border-radius:0}
  html.b-m1 .m1-scrim{left:0;right:0;width:100vw}
}
/* phone: the work sheet opens at about half height over the chat and its composer (the study's phone; "chat visible everywhere"); ⤢ makes it full height */
@media (max-width:860px){
  html.b-m1 .app{bottom:calc(76px + env(safe-area-inset-bottom));height:min(56dvh,calc(100dvh - 76px - 70px));border-radius:24px;left:8px;right:8px}
  html.b-m1.b-m1-wide.b-m1-sheet .app{bottom:calc(76px + env(safe-area-inset-bottom));height:calc(100dvh - 76px - env(safe-area-inset-bottom) - env(safe-area-inset-top) - 8px);left:0;right:0;border-radius:24px 24px 0 0}
  html.b-m1 .m1-scrim{bottom:calc(76px + env(safe-area-inset-bottom))}
}
/* one accent per view (UK round-4 review): the bell's count is neutral (black on light, light on dark), the sync dot shows only
   when something is off (syncing / offline / error: synced is the quiet default), the phone top bar's round buttons share one style,
   and in dark the composer tray has no outline ring (whitespace, not a line) */
html.b-m1 .bn-badge{background:var(--k-text);color:var(--ka-card)}
html.b-m1 .b-sync[data-s=synced]{display:none}
html.b-m1 .m1-hb{box-shadow:none;background:var(--m1-card);border:1px solid var(--m1-soft)}
@media (max-width:860px){html.b-m1 .m1-hb{width:40px;min-width:40px;height:40px;padding:0;border-radius:999px}}
html.b-m1[data-theme="dark"] #agForm.k-pillc{border-color:transparent;box-shadow:0 12px 32px -20px rgba(0,0,0,.6)}
/* (HQ 19: the ☰ menu button is round too, like the bell and the panel button) */
@media (max-width:860px){html.b-m1 #m1MenuBtn{display:inline-grid;color:var(--k-text)}html.b-m1 .m1-chattop :is(.k-ichip,.m1k-ichip):not([hidden]),html.b-m1 #m1WorkBtn,html.b-m1 #m1MenuBtn{width:44px;min-width:44px;height:44px;padding:0;border-radius:999px;background:var(--m1-card);border:1px solid var(--m1-soft);box-shadow:none;place-items:center}html.b-m1 .m1-chattop :is(.k-ichip,.m1k-ichip):not([hidden]){display:inline-grid}}
/* Growth review: the starter art stays inside its card; the home's last row (the fanned card's "Open →") never ends under the
   suggestion row; on the phone the work sheet has no scrim (the chat above stays clear, as the study's phone): only the menu
   drawer dims the page */
html.b-m1 :is(.k-stc,.m1k-stc){overflow:hidden}
html.b-m1 #m1Hero{padding-bottom:28px}
@media (max-width:860px){html.b-m1.b-m1-sheet:not(.b-m1-drawer) .m1-scrim{opacity:0;pointer-events:none}}
/* the palette hint belongs to the tabs row: alone (one page open, no tabs) it floats under the panel button, so it goes (HQ 14) */
.b-m1 .b-strip:not(:has(.b-tab)) .b-hint{display:none}
/* phone, during setup: the "page updated · View" pill above the composer instead of the sheet over the question */
.m1-pill{display:flex;align-items:center;gap:8px;margin:0 auto 8px;padding:7px 14px;border-radius:999px;border:1px solid var(--m1-line,rgba(0,0,0,.08));background:var(--m1-card,#fff);color:var(--m1-text,#0b0b0c);font:inherit;font-size:14px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.m1-pill b{font-weight:600;text-decoration:underline}
/* phone, during setup (HQ 19): an open work sheet never hides the question the chat is waiting on: no scrim over the chat, and the
   sheet's own fit (fitAboveSheet, --m1-sheetpad) keeps the question and its buttons in view and tappable */
@media (max-width:860px){
  html.b-m1.b-m1-sheet.m1-asking .m1-scrim{opacity:0;pointer-events:none}
  html.b-m1.b-m1-sheet.m1-asking:not(.b-m1-wide) #agThread .ob-q{scroll-margin-top:84px}
  /* the room above the sheet holds the question and its next answer: the quest card shows only its next open win, and the chip row
     behind the sheet is hidden (no edges peeking above the composer) */
  html.b-m1.b-m1-sheet.m1-asking:not(.b-m1-wide) #agThread .m.ai:last-child .ob-quest li:not(.q-next){display:none}
}
/* ---------- one lime per view (owner's declutter rule 5; HQ 19 + HQ 20): the view's own main element keeps the lime (Overview /
   Your books / Money: the hero ring; Home: the front waiting card's due tag, as the study's home); the shell is neutral: New chat +,
   the nav count, the suggestion chips, the greeting orb's lime part, the starter art's tick, the person's avatar; in the chat
   nothing is lime (its primary action is the one black button). Kit tokens only. ---------- */
html.b-m1 .k-mnew>span:first-child{background:var(--ka-soft);color:var(--k-text)}
html.b-m1 #m1Side .k-badge{background:var(--ka-soft);color:var(--k-text-2)}
html.b-m1 :is(.k-sugc,.m1c-sugc),html.b-m1 #agThread .ag-btn:is(.k-refc,.m1k-refc),html.b-m1 #agThread .ag-btn:is(.k-refc,.m1k-refc):hover{background:var(--ka-soft);color:var(--k-text-2)}
html.b-m1 .k-fwm-dots li[aria-current]{background:var(--k-text-2)}
html.b-m1 :is(.k-orb,.m1k-orb) i:nth-child(1){background:radial-gradient(circle at 35% 35%,#F7B267,transparent 65%)}
html.b-m1 :is(.k-vis,.m1k-vis).k-pen .k-ck{border-color:var(--k-text-3)}
html.b-m1 .k-mco .k-av{background:var(--ka-soft);color:var(--k-text)}
html.b-m1 :is(.k-steps,.m1k-steps) li.k-run :is(.k-tk,.m1k-tk),html.b-m1 :is(.k-cc,.m1k-cc) .k-ed,html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-cch,.m1k-cch) :is(.k-ic,.m1k-ic){background:var(--ka-soft);color:var(--k-text)}
html.b-m1 .k-thumbs i:nth-child(3){background-color:var(--ka-soft)}
html.b-m1 .ag-btn.lime,html.b-m1:not([data-theme="dark"]) .ag-btn.lime{background:var(--k-text);border-color:var(--k-text);color:var(--ka-card)}
/* the boards: the view keeps its own lime (the hero ring, Money's this-week bar); the hero's delta and the set-up banner are not lime */
html.b-m1 .k-kt.k-hero em.k-ok{color:var(--k-ok)}
html.b-m1 .ob-banner{background:var(--ka-card);border:0;border-radius:var(--k-r-card);box-shadow:var(--k-sh-1)}
html.b-m1 .ob-banner .ob-b-t span{color:var(--k-text-2)}
html.b-m1 .ob-banner .btn{background:var(--k-text);border-color:var(--k-text);color:var(--ka-card)}
/* HQ 20: no shortcut chips in the menu (the shortcut stays in the row's tooltip); a starter's line is never cut with "…" on desk */
html.b-m1 #m1Side .k-kbd{display:none}
@media (min-width:861px){html.b-m1 :is(.k-stc,.m1k-stc) small{display:block;-webkit-line-clamp:unset;overflow:visible}}
/* HQ 20, phone: the thread fades out under the top bar (no hard clip of bubbles and card tops); the board's section strip scrolls
   sideways and fades at its edge (never a cut "Pe…"); the sheet's edge reads in dark (a hairline ring, a shadow upwards); the
   suggestion chips behind an open sheet are not drawn (their outlines showed between the sheet and the composer) */
@media (max-width:860px){
  html.b-m1 .k-ptabs{overflow-x:auto;scrollbar-width:none}
  /* the edge fade is a sticky gradient, not a mask: a masked child in the sheet's rounded scroller drew black corner wedges (HQ 22 r4a) */
  html.b-m1 .k-ptabs.m1-ovf,html.b-m1 .m1-tnav.m1-ovf{padding-right:0}
  html.b-m1 .k-ptabs.m1-ovf::after,html.b-m1 .m1-tnav.m1-ovf::after{content:"";position:sticky;right:-4px;flex:none;width:32px;margin-left:-32px;align-self:stretch;pointer-events:none;border-radius:0 999px 999px 0;background:linear-gradient(to right,transparent,var(--ka-card) 70%)}
  html.b-m1 .k-ptabs::-webkit-scrollbar{display:none}
  html.b-m1 .k-ptabs>button{flex:none}
  html.b-m1[data-theme="dark"] .app{border-color:transparent;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 -20px 44px -22px rgba(0,0,0,.75)}
  html.b-m1.b-m1-sheet:not(.m1-sheetchips) #agChips{visibility:hidden}
  /* the chips the person may tap stay in view: the sheet sits above them (HQ 22) */
  html.b-m1.b-m1-sheet.m1-sheetchips:not(.b-m1-wide) #app.app{bottom:calc(76px + env(safe-area-inset-bottom) + var(--m1-chipsh,0px))}
  /* the thread's room is a spacer, not padding: padding is a floor under a flex item's height, so a tall sheet (Izdelki, REKIT-L) grew
     the thread past its column and pushed the chips + composer under the screen edge; the spacer only adds scroll room (less the
     thread's 16px gap, so the scroll end stays where the padding put it) */
  html.b-m1.b-m1-sheet #m1Hero{padding-bottom:var(--m1-sheetpad,0px)}
  html.b-m1.b-m1-sheet #agThread::after{content:'';flex:none;height:max(0px,calc(var(--m1-sheetpad,0px) - 16px))}
  /* nothing ends in a hard cut: the thread and the home fade at the composer, the sheet's content at its bottom edge (and can
     scroll clear of it); the sheet stops above the composer, the chat's composer is never covered */
  html.b-m1 #agThread{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 24px,#000 calc(100% - 16px),transparent);mask-image:linear-gradient(to bottom,transparent 0,#000 24px,#000 calc(100% - 16px),transparent)}
  html.b-m1 #m1Hero{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 16px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 16px),transparent)}
  html.b-m1 #app.app{padding-bottom:24px;scroll-padding-bottom:24px}
  /* HQ 21: the half sheet is as tall as what it shows (up to the half-height max), never an empty lower half; ⤢ keeps full height */
  html.b-m1:not(.b-m1-wide) #app.app{height:auto;max-height:min(var(--m1-sheeth,min(50dvh,calc(100dvh - 76px - 70px))),var(--m1-sheetcap,100dvh))}
  /* HQ 21: the first message's header (logo, "Bureo 01:59") starts below the fade under the top bar, never hidden by it */
  html.b-m1 #agThread{padding-top:24px;scroll-padding-top:28px}
}
html.b-m1.m1-pchip #agChips{display:none}
/* HQ 20 (Growth board r3, UK r9): the fan's back cards show no cut text at their edges (the front card says it; a back card's text
   shows when it is hovered or focused to the front); dates in lists are the body face with tabular numerals, not the mono face;
   in dark a plain button lifts off its card (a lighter surface and a visible edge, as the light ghost button reads) */
html.b-m1 .k-du .k-dd,html.b-m1 td.k-date{font-family:inherit;letter-spacing:0;font-variant-numeric:tabular-nums;font-size:var(--k-t-xs);color:var(--k-text-2);white-space:nowrap}
html.b-m1 .k-du .k-dd{width:auto;min-width:44px}
html.b-m1[data-theme="dark"] :is(.k-btn,.m1k-btn):not(:is(.k-pri,.m1c-pri)):not(.k-ghost){background:var(--k-chat-3);border-color:color-mix(in srgb,var(--k-text-3) 45%,transparent);color:var(--k-text)}
html.b-m1[data-theme="dark"] :is(.k-btn,.m1k-btn):not(:is(.k-pri,.m1c-pri)):not(.k-ghost):hover{border-color:var(--k-text-3)}
/* HQ 21 (fwm review): the home's last row (the fan and its icon rail) scrolls clear of the suggestion chip; the starter art's pill
   is soft (the view's black is its main action); send is the composer's own control: neutral while the field is empty, black
   only with text to send */
html.b-m1 #m1Hero{padding-bottom:56px}
/* HQ 22, phone: the sheet clips its content to its rounded corners (no square hero wedges); with numbers on the board the set-up
   card and the section strip's "Overview" (the sheet's title says it) step back; the greeting orb is not drawn under an open
   sheet (it slid under the top bar); the top bar's icons are quiet glyphs on a 44 px invisible tap area, as the kit's */
@media (max-width:860px){
  /* the half sheet is rounded at the top only and docks square on the composer: a rounded clip at its bottom (radius or
     clip-path) over a sideways-scrolling strip inside it drew black corner wedges in Chromium (HQ 22 r4a, es: its tab strip runs on) */
  html.b-m1:not(.b-m1-wide) #app.app{border-radius:24px 24px 0 0}
  html.b-m1.b-m1-sheet .m1-orb{display:none}
  html.b-m1 .m1-hb,html.b-m1 .m1-chattop :is(.k-ichip,.m1k-ichip):not([hidden]),html.b-m1 #m1WorkBtn,html.b-m1 #m1MenuBtn{background:none;border:0;box-shadow:none;width:44px;min-width:44px;height:44px;color:var(--k-text-2)}
}
/* HQ 22: the tax starter's art: a small return form (its % disc and two lines), the k-pen card's language */
html.b-m1 .m1-taxart{display:grid;place-items:center}
html.b-m1 .m1-taxart .m1-tf{position:relative;display:block;width:96px;height:34px;border-radius:8px;background:var(--ka-card);box-shadow:0 6px 16px -8px rgba(20,22,30,.35)}
html.b-m1 .m1-taxart .m1-tf b{position:absolute;left:8px;top:6px;width:22px;height:22px;border-radius:50%;background:var(--ka-soft);color:var(--k-text);display:grid;place-items:center;font-size:var(--k-t-xs);font-weight:600}
html.b-m1 .m1-taxart .m1-tf i{position:absolute;left:38px;right:12px;height:2px;border-radius:2px;background:var(--k-line-strong)}
html.b-m1 .m1-taxart .m1-tf i:nth-of-type(1){top:12px}html.b-m1 .m1-taxart .m1-tf i:nth-of-type(2){top:20px;right:30px}
/* HQ 22: a narrow chat column (the work panel open beside it) lists the starters as compact rows: no art, one line each */
@container (max-width:620px){
  html.b-m1 .m1-starters{grid-template-columns:1fr;gap:8px}
  html.b-m1 .m1-stc{flex-direction:row;align-items:center;gap:12px;padding:10px 12px;min-height:var(--k-tap)}
  html.b-m1 .m1-stc .m1-vis{display:none}
  html.b-m1 .m1-stc>:is(.k-sti,.m1k-sti){position:static;border-radius:15px}
  html.b-m1 .m1-stc:has(>:is(.k-sti,.m1k-sti)){padding:6px 12px 6px 6px}
  html.b-m1 .m1-stc>b{margin:0;font-size:var(--k-t-sm);white-space:nowrap}
}
/* HQ 22: the menu's chat-history buttons (chat-sync.js: ⋯, Pin / Rename / Delete) are quiet rows and links of the kit, never a
   grey native button box */
html.b-m1 .m1-hist button:not(:is(.k-mi,.m1k-mi)){-webkit-appearance:none;appearance:none;background:none;border:0;box-shadow:none;font:inherit;color:var(--k-text-2);cursor:pointer}
html.b-m1 .m1-hist .b-chat-more{padding:4px 8px;border-radius:var(--k-r-sm)}
html.b-m1 .m1-hist .b-chat-more:hover{background:var(--ka-card);color:var(--k-text)}
html.b-m1 .m1-hist .b-chat-acts{gap:12px;padding:2px 10px 6px}
html.b-m1 .m1-hist .b-chat-acts button{font-size:var(--k-t-xs);padding:2px 0;border:0;opacity:1;text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--k-line-strong)}
html.b-m1 .m1-hist .b-chat-acts button:hover{color:var(--k-text)}
/* the Home's lime (the front card's due tag) is the view's only while the home is the view: with a page open beside it (desk) or
   over it (phone sheet), that page's main element has the lime and the tag is grey text (HQ29) */
@media (min-width:861px){html.b-m1:not(.b-m1-workoff) .k-fc :is(.k-tag,.m1k-tag):is(.k-lime,.m1k-lime){background:none;color:var(--k-text-3);padding-left:0;padding-right:0}}
@media (max-width:860px){html.b-m1.b-m1-sheet .k-fc :is(.k-tag,.m1k-tag):is(.k-lime,.m1k-lime){background:none;color:var(--k-text-3);padding-left:0;padding-right:0}}
html.b-m1 :is(.k-vis,.m1k-vis):is(.k-btn,.m1k-btn) b{background:var(--ka-soft);color:var(--k-text)}
html.b-m1 #agForm:has(#agInput:placeholder-shown) #agSend{background:var(--ka-soft);color:var(--k-text-2);border-color:transparent}

/* ---------- kit-wide (HQ 22 A5, A7) ---------- */
/* a focus ring only for the keyboard: a clicked link, summary or button shows none (the "caret" after a clicked link) */
html.b-m1 :focus:not(:focus-visible){outline:none}
html.b-m1 :is(.k-more,.m1k-more)>summary{display:inline-flex}
/* the toast: one line, clear of the composer; its Undo is a text button (one lime per view) */
html.b-m1 .b-toast{background:var(--k-text);color:var(--ka-card);max-width:calc(100vw - 32px);white-space:nowrap;box-shadow:0 14px 40px -18px rgba(20,22,30,.5)}
html.b-m1 .b-toast>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
html.b-m1 .b-toast .b-toast-undo{background:none;color:inherit;height:auto;padding:4px 8px;text-decoration:underline;text-underline-offset:3px;font-weight:600}
@media (max-width:860px){html.b-m1 .b-toast{bottom:calc(92px + env(safe-area-inset-bottom));left:16px;right:16px;transform:none;justify-content:space-between}}
/* ---------- HQ 22 round 3 ---------- */
/* with numbers on the board the set-up card is not a second action (desk and phone); the Overview strip's selected tab is the
   title, so the work head does not say "Overview" again (its line stays) */
html.b-m1:has(#main .k-dash:not(.k-empty) .k-kt) .ob-banner{display:none}
/* chat cards: no mono codes beside the names (AKONT, OPSVL: the name says it) */
html.b-m1 #agThread .code.m1c-code.m1c-code.m1c-code{display:none}
@media (max-width:860px){
  /* one suggestion chip on the phone; none behind an open sheet (only an onboarding question's choices stay, above the sheet) */
  /* the home under an open sheet: the starters only (no greeting with nothing under it, no agent name above a hidden message) */
  /* HQ 22 r4g / HQ 23: under an open sheet the home is the greeting (one short line), the starters that fit and the agent's
     connected line, as on the desk; no author line over a hidden message, no fan (it is the sheet's job now) */
  html.b-m1.b-m1-sheet.b-m1-home .m1-hi{font-size:24px;line-height:1.2;margin:0}
  html.b-m1.b-m1-sheet.b-m1-home .m1-amsg .m1-result{display:none}   /* the sender row stays, as on Home (HQ 26) */
  html.b-m1.b-m1-sheet.b-m1-home .m1-amsg :is(.k-ab,.m1k-ab)>p{margin:0}   /* the agent's line whole (never «hasta el 20…» behind the sheet) */
  html.b-m1.b-m1-sheet:has(#main>section[data-view][data-view]:not([hidden]) .m1m.m1m) #m1Hero :is(.k-starters,.m1k-starters).m1-starters{visibility:visible}
  /* the certificates guide on the phone: the pane's intro folds so step 1 is in view */
  html.b-m1:not(.m1-chrome) .k-m1s .k-m1s-intro{display:none}
}
/* HQ 22 #18 / #21: a canvas inside the M1 work sheet keeps no phone bottom padding of its own (bureo-ds gives .b-ceo 220 px for
   the classic layout's dock); the sheet's one gutter is enough */
@media (max-width:860px){html.b-m1 #app .b-ceo,html.b-m1 #app [class*="b-ceo"]{padding-bottom:0}}
/* one suggestion chip on the phone (HQ 22 r4; the desk keeps its row: signup's chips are its choices) */
@media (max-width:860px){html.b-m1 #agChips button:nth-child(n+2){display:none}}
/* the sheet ends on a whole block now (snapSheet): Money's own bottom fade would only dim that block's last line (HQ 22 r4e, HQ 23) */
html.b-m1 #app .m1m::after{display:none}
/* HQ 23 (ES invoicing p3, shell side): codes on one line; an e-mail breaks after its @ only; the confirm card's labels on one
   line (the value column takes the rest); older answers' black buttons quiet (one black pill per view) */
html.b-m1 .m1-nb{white-space:nowrap}
html.b-m1 .m1-mail{overflow-wrap:normal;word-break:normal}
html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-kv,.m1k-kv)>span{white-space:nowrap}
html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-kv,.m1k-kv)>b{min-width:0;overflow-wrap:normal;word-break:normal}
/* an e-mail (or any value that would not fit beside its label) goes under its label, whole */
html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-kv,.m1k-kv)>b:has(.m1-mail){grid-column:1/-1;text-align:left;margin-top:-2px}
html.b-m1 #agThread .ag-btn.lime.m1-quiet.m1-quiet,html.b-m1 #agThread :is(.k-btn,.m1k-btn):is(.k-pri,.m1c-pri).m1-quiet.m1-quiet.m1-quiet{background:none;border:1px solid var(--k-line-strong);color:var(--k-text)}
/* the confirm card's "to" rows (Cliente / Se envía a): the label on one line; an e-mail goes under its label, whole */
html.b-m1 :is(.k-cc,.m1k-cc) li>span:first-child{white-space:nowrap}
html.b-m1 :is(.k-cc,.m1k-cc) li:has(>b .m1-mail){display:flex;flex-direction:column;align-items:flex-start;gap:2px}
html.b-m1 :is(.k-cc,.m1k-cc) li:has(>b .m1-mail)>b{text-align:left}
/* S74: the confirm card on the phone takes the room it needs (its last row never clipped at the buttons, S6); the work head's
   title may take two lines on the phone, its code whole on one (S4: never "2026-R-…") */
@media (max-width:860px){
  html.b-m1 .agent .b-confirm-dock{max-height:calc(100% - 96px)}
  html.b-m1 #m1WorkHead .k-wt>b{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:1.25}
}
/* HQ 25 at 16 px: the phone starters are one line each, the title only (a subtitle would clip, and every locale shows the same
   rows); the work head's grey line ends with "…" before the expand / close buttons */
html.b-m1 #m1WorkHead .k-wt{min-width:0;overflow:hidden}
html.b-m1 #m1WorkHead .k-wt>small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the toast never blocks what is under it: only its own button takes the tap */
html.b-m1 #bToast{pointer-events:none}html.b-m1 #bToast button,html.b-m1 #bToast a{pointer-events:auto}
/* HQ 26 (S75 review, shell side): a starter row never clips its grey line without "…" (the row and its line both truncate, in
   the narrow chat column and the Money container too), and no starter loses its line while the others keep theirs; phone bars
   stay bars (radius capped, no ovals); the greeting orb is the same on every screen */
html.b-m1 .m1-stc{min-width:0;overflow:hidden}
html.b-m1 .m1-stc>b{flex:none}
@media (max-width:860px){html.b-m1 .k-cbars .k-bx{border-radius:min(5px,25%)}}
html.b-m1:has(#main>section[data-view][data-view]:not([hidden]) .m1m.m1m) .m1-orb.m1-orb{filter:none;opacity:1}
/* HQ 26 + App fix 1: on the phone and in a narrow chat column every starter keeps its grey line, whole: the row is the icon tile
   beside two lines, the title (one line) over its grey line (it wraps, never "Desde un presupu…"); the same rows in every locale */
@media (max-width:860px){
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:1px;align-items:center;align-content:center}
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>:is(.k-sti,.m1k-sti){grid-column:1;grid-row:1/span 2}
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>b{grid-column:2;grid-row:1;align-self:end;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>small{grid-column:2;grid-row:2;align-self:start;display:block;min-width:0;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35}
}
@container (max-width:620px){
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:1px;align-items:center;align-content:center}
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>:is(.k-sti,.m1k-sti){grid-column:1;grid-row:1/span 2}
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>b{grid-column:2;grid-row:1;align-self:end;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>small{grid-column:2;grid-row:2;align-self:start;display:block;min-width:0;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35}
}

/* HQ 26 onb #4 (S75 icon rule): the setup checklist rows carry the starter's icon tile (m1-chat.js), in place of the ○ / ✓ dot */
html.b-m1 .ob-quest li:has(>.m1-qsti){grid-template-columns:36px 1fr auto;column-gap:12px;padding:8px 12px 8px 8px}
html.b-m1 .ob-quest li>.m1-qsti{grid-row:1}
html.b-m1 .ob-quest li:has(>.m1-qsti)>.q-dot{display:none}
html.b-m1 .ob-quest li.done>.m1-qsti{color:var(--k-ok-ink,#16A34A)}
@media (max-width:420px){html.b-m1 .ob-quest li:has(>.m1-qsti){grid-template-columns:36px 1fr}}
/* S74: a phone's viewport carries the 112.5 % (scaleViewport); the desk zoom never doubles it (a tablet in landscape) */
html.b-m1.m1-vscale{--k-zoom:1;zoom:1}
/* HQ 27 r6 #3 / Growth (S74): the fan is as tall as its front card's content (no fixed 216 px with an empty band), the cards behind
   follow its height, and it keeps 16 px clear above the chip row, so "Open →" and the card's foot are never on the clip line */
/* S10 / NF r7 #4 (S74): the full-height phone sheet (⤢) covers the chat, so the chat keeps no room for it (the sheet padding pushed
   the composer off the screen: a blank 76 px band under the sheet); the composer stays in its place under the sheet */
@media (max-width:860px){html.b-m1.b-m1-wide.b-m1-sheet #m1Hero{padding-bottom:0}html.b-m1.b-m1-wide.b-m1-sheet #agThread::after{display:none}html.b-m1 #m1Hero{overflow:hidden}}
/* the confirm card on a phone: What (the long table) takes the card's full width under its name, so "Še na poti" stays one
   line; Why, To and Then stay beside their names as on a desk; the buttons on the left; the whole card above the composer
   (the dock may grow, the answer above it scrolls away) */
@media (max-width:860px){
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts)>dt:first-of-type{grid-column:1/-1;padding:10px 16px 0}
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts)>dd:first-of-type{grid-column:1/-1;padding:4px 16px 10px}
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts)>dt:not(:first-of-type){padding:8px 0 8px 16px}
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-parts,.m1k-parts)>dd:not(:first-of-type){padding:8px 16px 8px 12px}
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-kv,.m1k-kv) span{white-space:nowrap}
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-act,.m1k-act){justify-content:flex-start;padding:10px 16px}
  html.b-m1 :is(.k-cc,.m1k-cc) :is(.k-act,.m1k-act) :is(.k-who,.m1k-who){margin-left:0;flex-basis:100%}
}
/* ---------- App fix 1 (shell) ---------- */
/* the phone menu drawer is a solid surface: the kit's .k-m1 root (background:none, above) left it see-through, the chat, the sheet
   and the page head's ☰ / Bureo showing through its items */
@media (max-width:860px){html.b-m1 .m1-side.k-m1{background:var(--k-work)}}
/* the profile menu is never clipped at the sidebar's edge: the sidebar lets it out while it is open, and it is as wide as its rows
   (a language or a long example client's name stays on one line, its chevron whole) */
html.b-m1 .m1-side:has(.m1-menu:not([hidden])){overflow:visible}
html.b-m1 .m1-menu{width:max-content;min-width:max(100%,260px);max-width:min(340px,calc(100vw - 24px))}
@media (max-width:860px){html.b-m1 .m1-menu{width:auto;min-width:0;left:0;right:0;max-width:none}}
/* one scrollbar in the menu: the area list stays whole (chat-sync.js let it scroll too, a second bar beside the history's); the
   history takes the room left and scrolls */
html.b-m1 #m1Side .m1-areas{flex:none;overflow:visible;min-height:0}
html.b-m1 #m1Side .m1-hist{flex:0 1 auto;min-height:0}
@media (max-width:860px){html.b-m1.b-m1-sheet #m1Hero{-webkit-mask-image:none;mask-image:none}}   /* under an open sheet the home needs no bottom fade (the sheet covers it): its mask drew black wedges at the sheet's rounded corners */
html.b-m1.m1-tight #m1Hero .m1-orb{display:none}   /* App fix 1: a desk home taller than its column drops the orb (fitHome), the fan whole above the chip */
html.b-m1 .m1-back{border:0;cursor:pointer;color:var(--k-text);padding:0}html.b-m1 .m1-back:hover{background:var(--ka-card)}
/* App fix 1: Settings' section tabs on the phone: tighter pills so the four fit (es «Certificados» was cut at the edge), and when a
   language still runs on, the same edge fade as every other tab strip says there is more */
@media (max-width:860px){
  html.b-m1 .k-m1s-tabs button{padding-left:9px;padding-right:9px}
  html.b-m1 .k-m1s-tabs.m1-ovf::after{content:"";position:sticky;right:-4px;flex:none;width:32px;margin-left:-32px;align-self:stretch;pointer-events:none;background:linear-gradient(to right,transparent,var(--k-work) 70%)}
}
/* App fix 1 (money audit): on the desk a toast sits above the composer, never over it (bureo-ds puts it 28 px from the bottom) */
@media (min-width:861px){html.b-m1 .b-toast{bottom:104px}}
@media (max-width:860px){html.b-m1:not(.b-m1-sheet) #m1Hero{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}}   /* slice 1: a home taller than the phone scrolls (the fan and its "Open" reachable), never clipped at the chip */
/* slice 1: the phone sheet's bottom is the top of the bar above the composer (dockSheet measures it: --m1-dock), in every state; a
   half sheet is never a sliver: at least ~45 % of the screen, unless the chat's waiting question needs the room (--m1-sheetcap) */
@media (max-width:860px){
  html.b-m1 #app.app,html.b-m1.b-m1-sheet.m1-sheetchips:not(.b-m1-wide) #app.app,html.b-m1.b-m1-wide.b-m1-sheet #app.app{bottom:var(--m1-dock,calc(76px + env(safe-area-inset-bottom)))}
  html.b-m1 .m1-scrim{bottom:var(--m1-dock,calc(76px + env(safe-area-inset-bottom)))}
  html.b-m1:not(.b-m1-wide) #app.app{min-height:min(45dvh,var(--m1-sheetcap,100dvh))}
  html.b-m1.b-m1-wide.b-m1-sheet #app.app{height:calc(100dvh - var(--m1-dock,76px) - env(safe-area-inset-top) - 8px)}
}

/* ================= polish (HQ review of prod e61a5674, docs/ux/m1-system.md rules 4–5, Declutter 2/5/7) ================= */
/* (c) one lime per screen: the status colours step back at the token level, so every screen follows. Status dots are muted (a sage
   "done", a grey "needs a look", warn stays the one warm colour), no blue anywhere (info = ink grey); text inks keep AA on cards in
   both themes (ok-ink 5.9:1 on #FFF, 7.4:1 on the dark card; info-ink 10:1) */
html.b-m1{--k-ok:#8FB09B;--k-ok-ink:#3F6E52;--k-ok-soft:#EEF3EF;--k-info:#6B7076;--k-info-ink:#3A3F45;--k-info-soft:#EEEFF2}
html.b-m1[data-theme="dark"]{--k-ok:#5F8A70;--k-ok-ink:#8FB9A0;--k-ok-soft:#1C2420;--k-info:#9A9FA6;--k-info-ink:#C9CDD2;--k-info-soft:#24252A}
/* (e) type at size A: body 16 px (the kit's md was 15), labels ≥ 14 px (xs was 13); captions (eyebrows, badges, axis) stay 12, the floor */
html.b-m1{--k-t-xs:14px;--k-t-md:16px}
html.b-m1 #m1Side{--k-t-md:15px}   /* the sidebar is chrome, not body: it keeps its 15 px rows so the history list still fits */
html.b-m1 .k-spill,html.b-m1 .k-lgd{font-size:var(--k-t-xs)}
/* (d) declutter, rule 5 "whitespace instead of lines": a status pill is a soft dot pill without its ring; list rows and the small
   tables are apart by space, not rules (a total keeps the one rule above it, like a sum on paper) */
html.b-m1 .k-spill{border-color:transparent}
html.b-m1 .k-du{border-top-color:transparent;padding-top:8px;padding-bottom:8px}
html.b-m1 .k-du .k-spill:not(.k-warn):not(:is(.k-lime,.m1k-lime)){background:none;padding-left:0;padding-right:0}   /* in a list only a row that needs you keeps its soft pill; the rest read as a dot and a word */
html.b-m1 .k-mini2 td,html.b-m1 .k-mini2 th{border-bottom-color:transparent;padding-top:7px;padding-bottom:7px}
html.b-m1 .k-mini2 tr.k-tt td{border-top:1px solid var(--ka-soft)}
/* the phone / narrow-column starter rows stay 44–52 px with the 14 px grey line (S75): title and line set tight (1.25), the tile
   (36 px) and the 44 px tap minimum unchanged */
@media (max-width:860px){html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>b,html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>small{line-height:1.25}}
@container (max-width:620px){html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>b,html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>small{line-height:1.25}}

/* ================= polish slice 3 (SI-3 review) ================= */
/* (1) the fan card's head (es «Pendiente» + its chip): a gap that never closes, the chip keeps its size and the label gives way;
   when both do not fit the chip goes under the label, never over it */
html.b-m1 .k-fc .k-ft{gap:8px;flex-wrap:wrap;row-gap:4px;min-width:0}
html.b-m1 .k-fc .k-ft>span:not(:is(.k-tag,.m1k-tag)){min-width:0;white-space:nowrap}
html.b-m1 .k-fc .k-ft>:is(.k-tag,.m1k-tag){flex:none;white-space:nowrap;margin-left:auto}
/* (2) a starter's grey line is always whole, at every width (desk cards, the narrow column's rows, the phone rows): it wraps, no
   line clamp, no ellipsis */
html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc)>small,html.b-m1 :is(.k-stc,.m1k-stc) small{display:block;-webkit-line-clamp:unset;overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:break-word}
html.b-m1 #m1Hero .m1-stc:is(.k-stc,.m1k-stc){overflow:visible}
/* (3) phone section labels (sidebar eyebrows, history heads) ≥ 13 CSS px at size A */
@media (max-width:860px){html.b-m1 :is(.k-eyebrow,.m1k-eyebrow),html.b-m1 :is(.k-mh,.m1k-mh){font-size:13px}}
/* (4) owner, slice 3, variant A ("the biggest title"): every work panel / phone sheet has ONE big page title at the hero's scale,
   light like the big numerals, its grey line smaller under it; no small icon + title in the corner. Desk: the controls (back,
   export, expand, close) on a slim row on top, the title across the panel, the tabs under it, then the view (its summary row first).
   Phone: the title beside expand / close (one row, so the sheet still shows its content), the tabs on their own row under the title
   and its grey line. The title wraps (never an ellipsis); the grey line may end in "…" on the phone only */
html.b-m1 .m1-whead{flex-wrap:wrap;align-items:center;row-gap:0}
html.b-m1 .m1-whead>.k-ibc:not(.k-ibc~.k-ibc){margin-left:auto}
html.b-m1 #m1WorkHead .m1-wtitle{order:1;flex:1 0 100%;min-width:0;overflow:visible;padding:2px 4px 8px}
html.b-m1 #m1WorkHead .m1-wtitle>b{display:block;font-size:40px;font-weight:300;letter-spacing:-.03em;line-height:1.1;color:var(--k-text);white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:break-word;-webkit-line-clamp:unset}
html.b-m1 #m1WorkHead .m1-wtitle>small{display:block;margin-top:6px;font-size:var(--k-t-sm);color:var(--k-text-2);white-space:normal;overflow:visible;text-overflow:clip}
html.b-m1 #m1WorkHead .m1-tnav{order:2;flex:1 0 100%;margin:0 0 2px}
@media (max-width:860px){
  html.b-m1 #m1WorkHead .m1-wtitle{order:0;flex:1 1 0;padding:0 2px 0 4px}
  html.b-m1 .m1-whead>.k-ibc:not(.k-ibc~.k-ibc){margin-left:0}
  html.b-m1 #m1WorkHead .m1-wtitle>b{font-size:28px;line-height:1.02;display:block;-webkit-line-clamp:unset}
  html.b-m1 #m1WorkHead .m1-wtitle>small{margin-top:1px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html.b-m1 #m1WorkHead .m1-tnav{order:9;margin:2px 0 0 2px}
}
/* (5) the dark phone sheet's top-corner wedge (SI-3, es / dej / dark / sheet open): the grabber is a sticky, square, filled child at
   the very top of the rounded scroller, and a composited sticky child is not always clipped to the scroller's rounded corners, so
   its square corners showed outside the sheet's curve. The grabber now carries the sheet's own top radius (inherited), so nothing
   square sits in the corners whatever the compositor does */
@media (max-width:860px){html.b-m1 #app>.m1-grab{border-top-left-radius:inherit;border-top-right-radius:inherit;background-clip:padding-box}}

/* ================= polish slice 3b (HQ prod review 775bd48d + SI-3 #2) ================= */
/* #2: the phone composer's placeholder is whole at 390 px («Recite, kaj naj naredim…»): tighter gaps between the 44 px buttons and
   the field, the placeholder at 15 px (the typed text stays 16 px: no iOS zoom) */
@media (max-width:860px){
  html.b-m1 #agForm.k-pillc{gap:2px}
  html.b-m1 #agForm #agInput{padding-left:2px;padding-right:2px}
  html.b-m1 #agForm #agInput::placeholder{font-size:15px}
}
/* #4: the work head's grey line wraps on the phone too (never «ni v sist…», «303 · Lucía M…») */
@media (max-width:860px){html.b-m1 #m1WorkHead .m1-wtitle>small{white-space:normal;overflow:visible;text-overflow:clip}}
/* #9: the greeting's two lines sit together («Buenas noches, / Lucía» had a 24 px hole: line-height 1.6 on 40 px) */
html.b-m1 #m1Hero .m1-hi{line-height:1.12;text-wrap:balance}
/* the desk keeps the greeting on ONE line (Agents lane review: «Buenas noches, Lucía» broke in the narrow column beside an open
   panel): there it steps down to 32 px and does not balance; only a phone wraps it */
@media (min-width:861px){
  html.b-m1 #m1Hero .m1-hi{text-wrap:wrap}
  @container (max-width:620px){html.b-m1 #m1Hero .m1-hi{font-size:32px;letter-spacing:-.02em}}
}
/* #6: beside an open panel the home scrolls above the suggestion chip: its bottom fades instead of a hard cut under the chip */
@media (min-width:861px){html.b-m1:not(.b-m1-workoff) #m1Hero{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent)}}
/* SI-3 #2: in dark a plain (ghost) button reads on its card: a lighter surface and an edge of about 3:1 against the card */
/* ghost buttons (Cancel, Clear) stay bare text in both themes (Till 1 UI review: a link in light, a filled pill in dark) */
html.b-m1[data-theme="dark"] #app :is(.k-btn,.m1k-btn):not(:is(.k-pri,.m1c-pri)):not(:is(.k-lnk,.m1k-lnk)):not(.k-ghost),html.b-m1[data-theme="dark"] #app :is(.k-btn,.m1k-btn):not(:is(.k-pri,.m1c-pri)):not(:is(.k-lnk,.m1k-lnk)):not(.k-ghost):hover{background:#2C2D33;border-color:rgba(255,255,255,.38);color:var(--k-text)}
/* m1-chrome (the classic suites' flag-on run: the classic page, its own title and top bar with the bell, inside the M1 panel) keeps
   the compact one-row work head: a big title there pushed the classic bar's bell under the notifications panel (.bn-panel top 136 px),
   so the bell could not close it (app.wiring). Product M1 (no m1-chrome) keeps the big title */
html.b-m1.m1-chrome #m1WorkHead{flex-wrap:nowrap}
html.b-m1.m1-chrome #m1WorkHead .m1-wtitle{order:0;flex:1 1 0;padding:0}
html.b-m1.m1-chrome #m1WorkHead .m1-wtitle>b{font-size:var(--k-t-sm);font-weight:500;letter-spacing:0;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.b-m1.m1-chrome #m1WorkHead .m1-wtitle>small{margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.b-m1.m1-chrome #m1WorkHead .m1-tnav{order:1;flex:none;margin:0}
html.b-m1.m1-chrome #m1WorkHead>.k-ibc{order:2}
html.b-m1.m1-chrome .m1-whead>.k-ibc:not(.k-ibc~.k-ibc){margin-left:0}
/* every phone tab strip (the board's k-ptabs: Resumen · Ventas · Efectivo · Impuestos …, the work head's tabs) fades at its right
   edge while it scrolls, whether or not shell-m1.js has marked it m1-ovf yet (a repaint could leave «Impuest…» cut with no fade):
   a scroll-driven fade, inactive (so invisible) when the strip fits, gone at the strip's end */
@keyframes m1-edgefade{0%{opacity:1}92%{opacity:1}100%{opacity:0}}
@media (max-width:860px){
  html.b-m1 .k-ptabs,html.b-m1 .m1-whead .m1-tnav{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
  html.b-m1 .k-ptabs>button,html.b-m1 .m1-whead .m1-tnav>button{flex:none;white-space:nowrap}
  html.b-m1 .k-ptabs::after,html.b-m1 .m1-whead .m1-tnav::after{content:"";position:sticky;right:-4px;flex:none;width:32px;margin-left:-32px;align-self:stretch;pointer-events:none;border-radius:0 999px 999px 0;opacity:0;animation:m1-edgefade linear both;animation-timeline:scroll(nearest inline)}
  html.b-m1 .k-ptabs::after{background:linear-gradient(to right,transparent,var(--ka-card) 70%)}
  html.b-m1 .m1-whead .m1-tnav::after{background:linear-gradient(to right,transparent,var(--k-work) 70%)}
}
/* a canvas's own page head whose title the big work head carries (shell-m1.js paintWorkHead, data-m1lift): its title block hides,
   its actions (and the numbers under it) stay */
html.b-m1:not(.m1-chrome) .b-acct-head[data-m1lift]>div:first-child{display:none}
html.b-m1:not(.m1-chrome) .b-acct-head[data-m1lift]:not(:has(>:not(div:first-child))){display:none}
/* phone, a sheet open over the home: the chat sits on the sheet, as a chat does (its last line right above the sheet's top),
   instead of hanging under the bar with a dead gap down to the sheet (Agents lane review, sl / en) */
@media (max-width:860px){html.b-m1.b-m1-sheet.b-m1-home:not(.b-m1-wide) #m1Hero{display:flex;flex-direction:column;justify-content:flex-end}html.b-m1.b-m1-sheet.b-m1-home:not(.b-m1-wide) #m1Hero>:is(.k-tcol,.m1k-tcol){padding-bottom:4px}}

/* composer files (HQ 40): files dragged over the composer */
html.b-m1 .ag-compose.ag-drop{outline:2px dashed var(--k-text-3);outline-offset:3px}
/* (6) Bank (HQ 41): on the phone, content showed through the 4 px between the sheet's grabber and the work head (the grabber's
   margin). The gap is now the grabber's own opaque padding, and the head sticks right under it: one solid head from handle to title */
@media (max-width:860px){html.b-m1 #app>.m1-grab{height:32px;padding-bottom:4px;margin-bottom:0}html.b-m1 .m1-whead{top:32px}}
/* (7) a chip the thread already shows is not drawn again in the chip row (shell-m1.js paintSug marks it m1-dup) */
html.b-m1 #agChips button.m1-dup{display:none}
/* (8) a gateway card head repeating the big title (shell-m1.js paintWorkHead marks it data-m1dup) */
html.b-m1:not(.m1-chrome) #main h2[data-m1dup]{display:none}
/* (9) the composer's + menu (with Dokumenti: Upload a file · From Docs), above the composer, from its left edge */
html.b-m1 .m1-attmenu{min-width:220px;z-index:30}

/* Settings › Accessibility: «Reduce motion» (m1-calm: no animation or smooth scroll, whatever the system says) and «More contrast»
   (m1-hc: the grey text and the lines one step darker / lighter; text stays ≥ 4.5:1 on every surface) */
html.m1-calm *,html.m1-calm *::before,html.m1-calm *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
html.b-m1.m1-hc:root{--k-text-2:#3A3E44;--k-text-3:#45494F;--k-line:#B9BDC3;--k-line-strong:#8E939A}
html.b-m1.m1-hc[data-theme="dark"]:root{--k-text-2:#D6D9DE;--k-text-3:#C3C7CD;--k-line:#4A4A52;--k-line-strong:#6A6A74}
.m1-acc-card .seg{margin-top:10px}.m1-acc-card .m1-acc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.m1-acc-card .m1-acc-row small{display:block;color:var(--k-text-3)}
/* the search field's clear ×: the neutral grey of the text, in both themes (Chrome drew it blue in light; Till 1 UI review) */
html.b-m1 input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:14px;height:14px;margin-left:6px;cursor:pointer;background:var(--k-text-3);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center/14px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center/14px no-repeat}
html.b-m1 input[type="search"]::-webkit-search-cancel-button:hover{background:var(--k-text)}
/* the sidebar's sections (PODROČJA, DANES, VČERAJ …): one equal, clear gap above each label (owner 14.10), desk and phone drawer */
html.b-m1{--m1-sec-gap:24px}
html.b-m1 #m1Side :is(.k-mh,.m1k-mh){padding-top:var(--m1-sec-gap)}
/* owner 14.10 (HQ 43): the night brief is a list, every item at once (Summary V2 hybrid rows), no deck with cards hidden behind
   the front one: title, date and amount, one primary action and «Odpri» per row; under it «Uredi vse · N» (only when safe), Copy and
   the labelled feedback (feedback only). Light and dark from the kit's tokens */
html.b-m1 .m1-blist{margin-top:12px;display:flex;flex-direction:column;gap:8px;max-width:640px;container-type:inline-size}
html.b-m1 .m1-blist>[role=list]{display:flex;flex-direction:column;border-radius:16px;background:var(--ka-card);box-shadow:0 0 0 1px var(--k-line),0 8px 24px -16px rgba(20,22,30,.35);overflow:hidden}
/* a row: title and amount on top, the date (and where) under the title, the actions under the amount; a wide column puts the
   actions on the title's line, a narrow one (the phone, the desk's chat column) on a line of their own */
html.b-m1 .m1-brow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"t a x" "m a x";align-items:center;gap:3px 14px;padding:10px 12px 10px 14px;cursor:pointer;color:var(--k-text);text-align:left}
html.b-m1 .m1-brow+.m1-brow{border-top:1px solid var(--k-line)}
html.b-m1 .m1-brow:hover{background:color-mix(in srgb,var(--k-text) 4%,transparent)}
html.b-m1 .m1-bt{grid-area:t;min-width:0;font-size:var(--k-t-sm);font-weight:600;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
html.b-m1 .m1-bmeta{grid-area:m;display:flex;gap:6px;align-items:center;min-width:0;font-size:var(--k-t-xs);color:var(--k-text-3)}
html.b-m1 .m1-bmeta:empty{display:none}
html.b-m1 .m1-bmeta :is(.k-tag,.m1k-tag){background:none;color:var(--k-text-3);padding:0;font-size:inherit;font-weight:400;white-space:nowrap}   /* «rok čez N dni» / «še N dni»: grey text like the approved thread, no chip (HQ29) */
/* a missed legal deadline (Gate 149 f35cd8a2: «oddaja zamujena 20. 10.»): the due tag in red ink (the kit's .kv-st--stop), no fill */
html.b-m1 :is(.k-tag,.m1k-tag).m1-err,html.b-m1 .m1-bmeta :is(.k-tag,.m1k-tag).m1-err{background:none;color:var(--bk-err-ink,var(--bk-err,#C0392B));padding-left:0;padding-right:0}
html.b-m1 .m1-bsub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.b-m1 .m1-bamt{grid-area:a;font-size:var(--k-t-sm);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
html.b-m1 .m1-bacts{grid-area:x;display:flex;gap:4px;align-items:center;justify-content:flex-end}
@container (max-width:520px){html.b-m1 .m1-brow{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t a" "m m" "x x";row-gap:4px}
  html.b-m1 .m1-bamt{align-self:start}
  html.b-m1 .m1-bacts{justify-content:flex-start;margin-top:2px}
  html.b-m1 .m1-bacts>.m1-open:first-child:not(.m1-bact){margin-left:-12px}}   /* a lone «Odpri» lines up with the title */
html.b-m1 .m1-bacts button{border:0;border-radius:999px;padding:6px 12px;min-height:32px;font:inherit;font-size:var(--k-t-xs);font-weight:500;white-space:nowrap;cursor:pointer;background:none;color:var(--k-text-2)}
html.b-m1 .m1-bacts button:hover{color:var(--k-text);background:color-mix(in srgb,var(--k-text) 6%,transparent)}
/* the brief's «Podpiši» / «Oddajva skupaj»: the chat column's quiet outline (HQ27/HQ28), never a black fill */
html.b-m1 .m1-bacts .m1-bact{background:transparent;color:var(--k-text);box-shadow:inset 0 0 0 1px var(--k-line-strong)}
html.b-m1 .m1-bacts .m1-bact:hover{background:var(--ka-soft);color:var(--k-text);box-shadow:inset 0 0 0 1px var(--k-text-3)}
html.b-m1 .m1-bmore{align-self:flex-start;border:0;background:none;padding:2px 4px;font:inherit;font-size:var(--k-t-xs);color:var(--k-text-2);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
html.b-m1 .m1-bfoot{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:var(--k-t-xs);color:var(--k-text-3)}
html.b-m1 .m1-bsec{display:inline-flex;align-items:center;gap:2px;margin-left:auto}   /* Copy and the feedback stay together; they wrap under «Uredi vse» as one */
html.b-m1 .m1-bfoot button{display:inline-flex;align-items:center;gap:5px;border:0;background:none;color:var(--k-text-2);padding:6px 9px;min-height:32px;border-radius:999px;font:inherit;cursor:pointer}
html.b-m1 .m1-bfoot button:hover{color:var(--k-text);background:color-mix(in srgb,var(--k-text) 6%,transparent)}
html.b-m1 .m1-bfoot button svg{width:14px;height:14px;flex:none}
html.b-m1 .m1-bfoot button[aria-pressed=true]{background:var(--ka-chip);color:var(--ka-chip-ink)}
html.b-m1 .m1-bfoot .m1-ball,html.b-m1 .m1-bfoot .m1-ball:hover{background:var(--k-accent);color:var(--k-accent-ink);font-weight:600;padding:7px 14px}
html.b-m1 .m1-bfb{display:inline-flex;align-items:center;gap:2px}
/* the collapsed sidebar's name pill (shell-m1.js tipInit): the kit's surface, a pill, centred on the icon, 8 px to its right */
.m1-tip{position:fixed;z-index:3000;left:0;top:0;pointer-events:none;background:var(--k-surface,#fff);color:var(--k-text,#0B0B0C);border-radius:999px;padding:6px 12px;
  font:500 13px/1.2 var(--k-font,inherit);white-space:nowrap;box-shadow:0 0 0 1px var(--k-line,rgba(0,0,0,.08)),0 8px 24px -10px rgba(20,22,30,.45);opacity:0;transform:translate(-6px,-50%);transition:opacity .12s ease,transform .12s ease}
.m1-tip.on{opacity:1;transform:translate(0,-50%)}
@media (prefers-reduced-motion:reduce){.m1-tip{transition:none;transform:translate(0,-50%)}}
html.m1-calm .m1-tip{transition:none;transform:translate(0,-50%)}
/* the collapsed menu's count (Čaka na vas, Dokumenti): inside its row, so the scroll area's top edge never clips it */
html.b-m1 .k-nav-off #m1Side :is(.k-mi,.m1k-mi) .k-badge{top:2px;right:4px}
html.b-m1 .k-nav-off #m1Side :is(.k-mi,.m1k-mi){position:relative}
/* the work head's tabs (Izkazi, Banka, a doc's views): underline tabs (owner 17.10), no filled pill. Quiet text, the current one
   ink with a 2 px ink underline on the head's hairline, an optional count after the word. Lime stays off: the tab is not a «needs you». */
html.b-m1 .m1-whead .m1-tnav{gap:2px;align-items:stretch}
html.b-m1:not(.m1-chrome) .m1-whead .m1-tnav{box-shadow:inset 0 -1px 0 var(--k-line)}
html.b-m1 .m1-whead .m1-tnav>button{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:0;background:none;color:var(--k-text-2);font-weight:500}
html.b-m1 .m1-whead .m1-tnav>button:hover{color:var(--k-text)}
html.b-m1 .m1-whead .m1-tnav>button[aria-current]{background:none;color:var(--k-text);box-shadow:inset 0 -2px 0 var(--k-text)}
html.b-m1 .m1-whead .m1-tnav>button[aria-current]::before{content:none}
html.b-m1 .m1-whead .m1-tnav>button>em{font-style:normal;font-size:12px;font-weight:400;font-variant-numeric:tabular-nums;color:var(--k-text-3)}
/* confirm-first sheets (the gateway's #gwCfOk and every .btn.lime primary): the ONE black primary, white on a dark OS (owner: lime =
   the accent only), as the agent's .ag-btn.lime above */
html.b-m1 .btn.lime{background:var(--k-text);border-color:var(--k-text);color:var(--ka-card)}
html.b-m1 .btn.lime:hover:not(:disabled){background:var(--k-text-2);border-color:var(--k-text-2)}
/* the chat column never fills a button (HQ27, owner one black per view: the pane owns the primary). Every primary there (the confirm
   card's «Potrdi», «Podpiši», «Podpiši vse», «Oddajva skupaj», «Plačaj →», a kit contrast / ink button in a chat card) is the quiet
   outline: ink text on a line-strong hairline, the main one a touch heavier. No black fill, no lime, light and dark. One exception
   (VGATE-38 21.10): the question card's «Naprej» / «Pošlji» (.kv-ask-f) stays the kit's one small black pill. */
html.b-m1 :is(.agent,#m1Hero,#bDock) :is(.btn.lime,.ag-btn.lime,:is(.k-btn,.m1k-btn):is(.k-pri,.m1c-pri),.b-btn--primary,.calm-btn--contrast,.kv-act--ink:not(.kv-ask-f>*),.kv-cta),
html.b-m1 :is(.agent,#m1Hero,#bDock) :is(.k-cc,.m1k-cc) :is(.k-btn,.m1k-btn):is(.k-pri,.m1c-pri){background:transparent;border:1px solid var(--k-line-strong);color:var(--k-text);font-weight:500;box-shadow:none}
html.b-m1 :is(.agent,#m1Hero,#bDock) :is(.btn.lime,.ag-btn.lime,:is(.k-btn,.m1k-btn):is(.k-pri,.m1c-pri),.b-btn--primary,.calm-btn--contrast,.kv-act--ink:not(.kv-ask-f>*),.kv-cta):hover:not(:disabled){background:var(--ka-soft);border-color:var(--k-text-3);color:var(--k-text)}
/* the work pane's signed head (HQ28, Gate 53): the current nav item («Izdelki ▾»), the open page tab («Pregled ✕») and the avatar are
   line / grey, never an ink fill or lime ink; light and dark (beats bureo-ds :root[data-theme=dark] :is(...)) */
html.b-m1 .app>.top .nav button[aria-current="page"],html.b-m1 .b-strip .b-tab.b-tab.b-tab[aria-current="page"]{background:transparent;color:var(--k-text);border-color:var(--k-line-strong);box-shadow:inset 0 0 0 1px var(--k-line-strong)}
html.b-m1 .app>.top .avatar.avatar{background:var(--ka-soft);color:var(--k-text);box-shadow:inset 0 0 0 1px var(--k-line)}
/* the toasts (kit .calm-toasts, the gateway's .gw-toast, the shell's .b-toast) centre on the work pane at the desk (HQ28, VAR26i); shell-m1.js
   sets --m1-pane-cx / --m1-pane-w, and without a pane (work off, phone) they stay centred on the window */
@media (min-width:861px){html.b-m1 :is(.calm-toasts,.gw-toast,.b-toast){left:var(--m1-pane-cx,50%);width:max-content;max-width:calc(var(--m1-pane-w,100vw) - 32px)}}
/* a phone: the toasts drop in under the top bar, so they never cover the half sheet's SmartPanel action or the composer (HQ28) */
@media (max-width:860px){html.b-m1 :is(.calm-toasts,.gw-toast,.b-toast),html.b-m1 .calm-toasts:has(.calm-toast--act){top:calc(64px + env(safe-area-inset-top));bottom:auto}
  html.b-m1 .gw-toast{width:max-content;max-width:calc(100vw - 32px)}}
/* a phone: the work head's tabs fade their own edge where more tabs hide (a mask, so it reads on any sheet ground; HQ28, VAR26i) */
@media (max-width:860px){
  html.b-m1 .m1-whead .m1-tnav.m1-tnav::after{content:none}
  html.b-m1 .m1-whead .m1-tnav.m1-ovf:not(.m1-ovf-end){-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)}
}
/* UX1 X3 / row 10: a 44 px invisible hit area around the shell's icon buttons (menu toggle, chat-head chip, composer, work head's ← ⤢ ✕)
   on every screen size, and on a phone around the pills too (the look stays 28–36 px). :where() keeps position:relative at zero
   specificity, so a button its own rule places absolute stays absolute (as the kit's .calm-btn::after, kit.css) */
:where(html.b-m1 .k-tgl,html.b-m1 :is(.k-ichip,.m1k-ichip),html.b-m1 .ag-ic,html.b-m1 .k-wki,html.b-m1 .k-ibc){position:relative}
html.b-m1 .k-tgl::after,html.b-m1 :is(.k-ichip,.m1k-ichip)::after,html.b-m1 .ag-ic::after,html.b-m1 .k-wki::after,html.b-m1 .k-ibc::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
  :where(html.b-m1 :is(.k-btn,.m1k-btn),html.b-m1 .si2-b,html.b-m1 :is(.k-sugc,.m1c-sugc),html.b-m1 .gw-chip){position:relative}
  html.b-m1 :is(.k-btn,.m1k-btn)::after,html.b-m1 .si2-b::after,html.b-m1 :is(.k-sugc,.m1c-sugc)::after,html.b-m1 .gw-chip::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
}
/* UX1 X3: the screen's main action rides a sticky footer at the sheet's bottom while the real one sits below the fold (shell-v2
   phone priBar: a copy that presses the real button) */
  html.b-m1 #m1PriBar{position:sticky;bottom:0;z-index:3;display:flex;padding:10px 16px;margin-top:8px;background:var(--k-work,var(--ka-card));box-shadow:0 -10px 18px -14px rgba(20,22,30,.35)}
  html.b-m1 #m1PriBar[hidden]{display:none}
}
@media (min-width:861px){html.b-m1 #m1PriBar{display:none}}
