
  :root{
    --bg:#FBF6E8;
    --surface:#FFFFFF;
    --surface-2:#FFF7E4;
    --border:#EADFBB;
    --ink:#241A0E;
    --ink-2:#6E5C3E;
    --ink-muted:#A0916F;
    --accent:#F0B429;
    --accent-ink:#332000;
    --accent-strong:#D99400;
    --lime:#6F9F2E;
    --lime-strong:#587E20;
    --tier-kicsi:#2F86AD;
    --tier-kozepes:#5B9A32;
    --tier-nagy:#D97A24;
    --tier-extra:#B23E6C;
    --status-tervezett:#B8892A;
    --status-megerositve:#3E8F5B;
    --status-lezarva:#8A8272;
    --danger:#B23A30;
    --shadow:rgba(36,26,14,0.10);
    /* Könyvelés — kategória-színek (2026-09-07, Ján kérésére: a kiadás-kategóriák
       megkülönböztetéséhez). Fix sorrend, kategória-kulcs szerint hozzárendelve
       (lásd financeCategoryColorVar() az app.js-ben), nem index szerint cyclizálva. */
    --fin-1:#2a78d6;
    --fin-2:#eb6834;
    --fin-3:#1baf7a;
    --fin-4:#eda100;
    --fin-5:#e87ba4;
    --fin-6:#008300;
    --fin-7:#4a3aa7;
    --fin-8:#e34948;
    --fin-9:#0891b2;
    --fin-10:#9d174d;
    color-scheme: light;
    background:var(--bg);
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#161109;
      --surface:#211A0F;
      --surface-2:#291F13;
      --border:#3B2F1B;
      --ink:#F5ECD8;
      --ink-2:#CBB98F;
      --ink-muted:#8C7F63;
      --accent:#F3C230;
      --accent-ink:#241A00;
      --accent-strong:#FFD966;
      --lime:#93C752;
      --lime-strong:#7BB13B;
      --tier-kicsi:#5FB4D8;
      --tier-kozepes:#83C558;
      --tier-nagy:#F0A857;
      --tier-extra:#E187AE;
      --status-tervezett:#E0B75B;
      --status-megerositve:#67C08A;
      --status-lezarva:#A69C86;
      --danger:#E2857C;
      --shadow:rgba(0,0,0,0.45);
      --fin-1:#3987e5;
      --fin-2:#d95926;
      --fin-3:#199e70;
      --fin-4:#c98500;
      --fin-5:#d55181;
      --fin-6:#008300;
      --fin-7:#9085e9;
      --fin-8:#e66767;
      --fin-9:#1a9cae;
      --fin-10:#c2418a;
      color-scheme: dark;
    }
  }
  :root[data-theme="dark"]{
    --bg:#161109;
    --surface:#211A0F;
    --surface-2:#291F13;
    --border:#3B2F1B;
    --ink:#F5ECD8;
    --ink-2:#CBB98F;
    --ink-muted:#8C7F63;
    --accent:#F3C230;
    --accent-ink:#241A00;
    --accent-strong:#FFD966;
    --lime:#93C752;
    --lime-strong:#7BB13B;
    --tier-kicsi:#5FB4D8;
    --tier-kozepes:#83C558;
    --tier-nagy:#F0A857;
    --tier-extra:#E187AE;
    --status-tervezett:#E0B75B;
    --status-megerositve:#67C08A;
    --status-lezarva:#A69C86;
    --danger:#E2857C;
    --shadow:rgba(0,0,0,0.45);
    --fin-1:#3987e5;
    --fin-2:#d95926;
    --fin-3:#199e70;
    --fin-4:#c98500;
    --fin-5:#d55181;
    --fin-6:#008300;
    --fin-7:#9085e9;
    --fin-8:#e66767;
    --fin-9:#1a9cae;
    --fin-10:#c2418a;
    color-scheme: dark;
  }
  *,*::before,*::after{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
    font-size:15px;
    line-height:1.45;
    min-height:100dvh;
    -webkit-font-smoothing:antialiased;
  }
  /* A Fredoka (dekoratív, kerekded betűtípus) egyes magyar hosszú kettős-ékezetes
     karaktereket (ő, ű) furcsán/hibásan jelenít meg — ezért csak olyan RÖVID, FIX
     feliratoknál használjuk (márkanév, szerepkör-választó gombok), amikről tudjuk,
     hogy nem tartalmaznak ő/ű betűt. A fültabok (.tab-btn) korábban is itt voltak,
     de a "Teendők" felirat pont ő-t tartalmaz, ezért furcsán jelent meg (Ján
     visszajelzése, 2026-09-08) — a fültabok ezért átkerültek a Manrope-ot használó
     szabályhoz lentebb, hogy bármilyen jövőbeli magyar felirat is biztonságosan
     megjelenjen. A tényleges tartalmi címsorok (h1/h2/h3) is bármilyen magyar
     szöveget tartalmazhatnak (pl. "Közelgő", "Következő", "Időjárás"), ezért azok is
     a jól működő Manrope-ot kapják.  */
  .brand,.big-choice h2{font-family:'Fredoka',ui-rounded,'Manrope',sans-serif;}
  .tab-btn{font-family:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;}
  h1,h2,h3{font-family:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;font-weight:800;}
  h1,h2,h3{text-wrap:balance;margin:0 0 .3em;color:var(--ink);}
  a{color:inherit;}
  button{font-family:inherit;}
  .num{font-variant-numeric:tabular-nums;}
  img{max-width:100%;}
  #app{min-height:100dvh;}

  /* ---------- landing / gate screens ---------- */
  .center-screen{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:2rem 1.25rem;}
  .panel{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:2rem 1.75rem;max-width:440px;width:100%;box-shadow:0 12px 30px var(--shadow);}
  .brandmark{display:flex;align-items:center;gap:.6rem;justify-content:center;margin-bottom:1.1rem;}
  .brandmark svg{width:38px;height:38px;flex:none;}
  .brandmark .brand{font-size:1.5rem;font-weight:700;letter-spacing:.2px;}
  .subtle{color:var(--ink-2);font-size:.92rem;}
  .center-screen p.subtle{text-align:center;margin-top:0;}
  .choice-grid{display:grid;gap:.75rem;margin-top:1.4rem;}
  .big-choice{border:1.5px solid var(--border);background:var(--surface-2);border-radius:14px;padding:1rem 1.1rem;text-align:left;cursor:pointer;display:flex;gap:.85rem;align-items:center;transition:border-color .15s,transform .1s;}
  .big-choice:hover{border-color:var(--accent);}
  .big-choice:active{transform:scale(.99);}
  .big-choice .ico{font-size:1.6rem;flex:none;width:2.2rem;text-align:center;}
  .big-choice h2{font-size:1.05rem;margin:0 0 .15rem;}
  .big-choice p{margin:0;font-size:.85rem;color:var(--ink-2);}
  .worker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem;margin-top:1.2rem;}
  .worker-pick{border:1.5px solid var(--border);background:var(--surface-2);border-radius:12px;padding:.85rem .6rem;text-align:center;cursor:pointer;font-weight:600;font-size:.92rem;}
  .worker-pick:hover{border-color:var(--lime);}
  .field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1rem;}
  .field label{font-size:.82rem;font-weight:600;color:var(--ink-2);}
  input,select,textarea{
    font:inherit;padding:.6rem .7rem;border-radius:10px;border:1.5px solid var(--border);
    background:var(--surface);color:var(--ink);width:100%;
  }
  input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent);}
  textarea{resize:vertical;min-height:4.2em;}
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-weight:700;border:none;border-radius:10px;padding:.65rem 1.1rem;cursor:pointer;font-size:.92rem;background:var(--accent);color:var(--accent-ink);transition:filter .15s;}
  .btn:hover{filter:brightness(1.06);}
  .btn:active{filter:brightness(.96);}
  .btn:disabled{opacity:.55;cursor:default;}
  .btn.ghost{background:transparent;color:var(--ink-2);border:1.5px solid var(--border);}
  .btn.ghost:hover{border-color:var(--ink-2);color:var(--ink);}
  .btn.danger{background:transparent;color:var(--danger);border:1.5px solid var(--danger);}
  .btn.small{padding:.4rem .7rem;font-size:.8rem;}
  .btn.block{width:100%;}
  .link-btn{background:none;border:none;color:var(--ink-2);text-decoration:underline;cursor:pointer;font:inherit;padding:0;white-space:nowrap;}
  .err-msg{color:var(--danger);font-size:.85rem;margin-top:.5rem;min-height:1.1em;}

  /* ---------- shell layout ---------- */
  .shell{display:flex;min-height:100dvh;}
  .sidebar{width:230px;flex:none;background:var(--surface);border-right:1px solid var(--border);padding:1.3rem 1rem;display:flex;flex-direction:column;gap:1.4rem;}
  .sidebar .brandmark{justify-content:flex-start;margin-bottom:0;}
  .sidebar .brand{font-size:1.15rem;}
  .sidebar .sub{font-size:.72rem;color:var(--ink-muted);margin-top:-.35rem;padding-left:2.9rem;}
  nav.tabs{display:flex;flex-direction:column;gap:.25rem;}
  .tab-btn{display:flex;align-items:center;gap:.6rem;padding:.6rem .75rem;border-radius:10px;border:none;background:none;color:var(--ink-2);font-size:.95rem;font-weight:600;cursor:pointer;text-align:left;}
  .tab-btn .ico{width:1.3rem;text-align:center;}
  .tab-btn:hover{background:var(--surface-2);color:var(--ink);}
  .tab-btn.active{background:var(--accent);color:var(--accent-ink);}
  .sidebar-foot{margin-top:auto;display:flex;flex-direction:column;gap:.5rem;}
  .app-version{font-size:.68rem;color:var(--ink-muted);opacity:.6;padding-left:.2rem;user-select:text;}
  .app-version-mobile{display:none;}
  @media (max-width:860px){ .app-version-mobile{display:inline;flex:none;padding-left:0;} }
  .main{flex:1;min-width:0;padding:1.6rem 1.8rem 3rem;}
  .topbar-mobile{display:none;}
  .mobile-tabs{display:none;}
  .content-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.3rem;}
  .content-head h1{font-size:1.4rem;}
  .content-head .subtle{margin-top:.15rem;}
  .banner{border-radius:12px;padding:.75rem 1rem;margin-bottom:1.1rem;font-size:.88rem;display:flex;gap:.6rem;align-items:flex-start;}
  .banner.info{background:var(--surface-2);border:1px solid var(--border);color:var(--ink-2);}
  .banner.warn{background:#F6E4C6;border:1px solid var(--status-tervezett);color:#5A4210;}
  :root[data-theme="dark"] .banner.warn, @media (prefers-color-scheme:dark){.banner.warn{background:#3A2E12;color:#F0D89A;}}
  .banner.err{background:#F7DDD9;border:1px solid var(--danger);color:#6B241C;}

  @media (max-width:860px){
    .shell{flex-direction:column;}
    .sidebar{display:none;}
    .topbar-mobile{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.9rem 1rem;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:5;}
    .topbar-mobile .brandmark{margin:0;}
    .topbar-mobile .brandmark .brand{font-size:1.05rem;}
    .topbar-mobile svg{width:28px;height:28px;}
    .mobile-tabs{display:flex;gap:.3rem;overflow-x:auto;padding:.6rem 1rem 0;background:var(--surface);border-bottom:1px solid var(--border);}
    .mobile-tabs .tab-btn{white-space:nowrap;}
    .main{padding:1.1rem 1rem 3rem;}
  }

  /* ---------- filters / chips ---------- */
  .chip-row{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1.1rem;}
  .chip{border:1.5px solid var(--border);background:var(--surface);color:var(--ink-2);border-radius:999px;padding:.35rem .8rem;font-size:.82rem;font-weight:600;cursor:pointer;}
  .chip.active{background:var(--ink);color:var(--bg);border-color:var(--ink);}
  .tag{display:inline-flex;align-items:center;gap:.3rem;border-radius:999px;padding:.2rem .6rem;font-size:.72rem;font-weight:700;letter-spacing:.2px;}
  .tag-dot{width:.5rem;height:.5rem;border-radius:50%;flex:none;}
  .tag.tier-kicsi{background:color-mix(in srgb, var(--tier-kicsi) 18%, transparent);color:var(--tier-kicsi);}
  .tag.tier-kozepes{background:color-mix(in srgb, var(--tier-kozepes) 18%, transparent);color:var(--tier-kozepes);}
  .tag.tier-nagy{background:color-mix(in srgb, var(--tier-nagy) 18%, transparent);color:var(--tier-nagy);}
  .tag.tier-extra{background:color-mix(in srgb, var(--tier-extra) 18%, transparent);color:var(--tier-extra);}
  .tag.status-tervezett{background:color-mix(in srgb, var(--status-tervezett) 18%, transparent);color:var(--status-tervezett);}
  .tag.status-megerositve{background:color-mix(in srgb, var(--status-megerositve) 18%, transparent);color:var(--status-megerositve);}
  .tag.status-lezarva{background:color-mix(in srgb, var(--status-lezarva) 22%, transparent);color:var(--status-lezarva);}
  .tag.example{background:color-mix(in srgb, var(--accent) 25%, transparent);color:var(--accent-strong);}
  .tag.offtag{background:color-mix(in srgb, var(--danger) 16%, transparent);color:var(--danger);}

  /* ---------- calendar ---------- */
  .cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:.6rem;flex-wrap:wrap;}
  .cal-head h2{font-size:1.1rem;margin:0;text-transform:capitalize;}
  .cal-nav{display:flex;gap:.4rem;}
  .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.4rem;margin-bottom:1.2rem;}
  .cal-dow{text-align:center;font-size:.72rem;font-weight:700;color:var(--ink-muted);text-transform:uppercase;padding-bottom:.2rem;}
  .cal-cell{background:var(--surface);border:1.5px solid var(--border);border-radius:10px;padding:.4rem;min-height:76px;cursor:pointer;display:flex;flex-direction:column;gap:.25rem;}
  .cal-cell.outside{opacity:.35;}
  .cal-cell.today{border-color:var(--accent);}
  .cal-cell.selected{border-color:var(--lime);background:var(--surface-2);}
  .cal-cell .dn{font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums;}
  .cal-dots{display:none;gap:.25rem;flex-wrap:wrap;align-items:center;}
  .cal-dot{width:.42rem;height:.42rem;border-radius:50%;flex:none;}
  .cal-dots .cal-more{font-size:.58rem;}
  .cal-off{font-size:.62rem;color:var(--danger);font-weight:700;}
  @media(max-width:700px){ .cal-cell{min-height:52px;padding:.3rem;} .cal-cell .dn{font-size:.7rem;} }
  .cal-detail{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:1rem 1.1rem;margin-bottom:1rem;}
  .off-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.6rem .8rem;margin-bottom:.5rem;}
  .off-row .who{font-weight:700;flex:1;min-width:120px;}
  .off-row .range{font-size:.82rem;color:var(--ink-2);}
  .off-row .why{font-size:.82rem;color:var(--ink-muted);font-style:italic;}

  /* ---------- event cards ---------- */
  .event-grid{display:grid;gap:.85rem;}
  .event-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:1.05rem 1.15rem;display:flex;gap:1rem;align-items:flex-start;flex-wrap:wrap;}
  .event-date{flex:none;width:64px;text-align:center;background:var(--surface-2);border-radius:12px;padding:.5rem .3rem;}
  .event-date .d{font-size:1.35rem;font-weight:700;font-family:'Fredoka';line-height:1;}
  .event-date .m{font-size:.68rem;color:var(--ink-2);text-transform:uppercase;letter-spacing:.4px;}
  .event-date .wd{font-size:.68rem;color:var(--ink-muted);}
  .event-main{flex:1;min-width:220px;}
  .event-main h3{font-size:1.02rem;margin:0 0 .25rem;}
  .event-meta{display:flex;gap:.9rem;flex-wrap:wrap;color:var(--ink-2);font-size:.82rem;margin:.35rem 0;}
  .event-meta span{display:inline-flex;align-items:center;gap:.3rem;}
  .event-tags{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.4rem;}
  .avatars-label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-muted);margin-top:.55rem;margin-bottom:.3rem;}
  .avatars{display:flex;flex-wrap:wrap;gap:.35rem;}
  .avatar{background:var(--surface-2);border:1.5px solid var(--accent);border-radius:999px;padding:.24rem .75rem;font-size:.82rem;font-weight:700;color:var(--ink);}
  .event-actions{display:flex;gap:.4rem;flex:none;align-self:flex-start;}
  .event-note{font-size:.82rem;color:var(--ink-2);margin-top:.4rem;background:var(--surface-2);border-radius:8px;padding:.4rem .6rem;}
  .contact-note{font-size:.74rem;color:var(--ink-muted);margin-top:.5rem;padding:0;background:none;}
  .tag.multiday{background:color-mix(in srgb, var(--lime) 18%, transparent);color:var(--lime-strong);}

  /* ---------- Beosztás-tervező rács (kattintható áttekintő tábla) ---------- */
  .roster-wrap{overflow:auto;max-height:72vh;border:1px solid var(--border);border-radius:14px;background:var(--surface);}
  .roster-grid{border-collapse:separate;border-spacing:0;width:100%;}
  .roster-grid thead th{position:sticky;top:0;background:var(--surface-2);z-index:2;border-bottom:1.5px solid var(--border);padding:.5rem .6rem;font-size:.78rem;color:var(--ink-2);text-align:center;white-space:nowrap;}
  .roster-corner{position:sticky;left:0;top:0;z-index:3;text-align:left !important;min-width:11rem;}
  .roster-wname{min-width:5.2rem;}
  .roster-wname-main{font-weight:700;}
  .roster-whours{margin-top:.15rem;font-size:.66rem;font-weight:500;color:var(--ink-muted);white-space:nowrap;}
  .roster-rowhead{position:sticky;left:0;background:var(--surface);z-index:1;border-right:1.5px solid var(--border);border-bottom:1px solid var(--border);padding:.5rem .6rem;min-width:11rem;vertical-align:top;}
  .roster-grid td{border-bottom:1px solid var(--border);padding:.3rem;text-align:center;vertical-align:middle;}
  .roster-date{font-weight:700;font-size:.86rem;}
  .roster-evtitle{font-size:.86rem;margin:.1rem 0;}
  .roster-evmeta{display:flex;align-items:center;gap:.4rem;font-size:.76rem;flex-wrap:wrap;}
  .roster-understaffed{color:var(--danger);font-weight:700;}
  .roster-cell{width:2.4rem;height:2.1rem;border-radius:8px;border:1.5px solid var(--border);background:var(--surface-2);cursor:pointer;font-size:1rem;font-weight:800;color:var(--ink-muted);transition:filter .1s,transform .05s;}
  .roster-cell:hover{filter:brightness(0.95);transform:scale(1.05);}
  .roster-cell.assigned{background:var(--accent);border-color:var(--accent-strong);color:var(--accent-ink);}
  .roster-cell.roster-warn{background:color-mix(in srgb, var(--danger) 14%, var(--surface-2));border-color:var(--danger);color:var(--danger);}
  /* Egy eseményhez tartozó (esetleg több napos) sorok váltakozó, halvány háttérrel
     csoportosítva, hogy sok hasonló sor esetén is jól látszódjon, mely napok tartoznak
     ugyanahhoz a rendezvényhez (Ján visszajelzése, 2026-09-08). */
  .roster-grid tr.roster-evgroup-1 .roster-rowhead{background:color-mix(in srgb, var(--accent) 16%, var(--surface));}
  .roster-grid tr.roster-evgroup-1 td{background:color-mix(in srgb, var(--accent) 10%, var(--surface));}
  .roster-grid tr.roster-evgroup-start .roster-rowhead,
  .roster-grid tr.roster-evgroup-start td{border-top:2px solid var(--border);}
  .day-block{border-top:1px dashed var(--border);margin-top:.6rem;padding-top:.55rem;}
  .day-block:first-child{border-top:none;margin-top:0;padding-top:0;}
  .day-block-label{font-weight:800;font-size:.85rem;margin-bottom:.25rem;color:var(--ink);}
  .empty-state{text-align:center;padding:3rem 1rem;color:var(--ink-muted);}
  .empty-state .ico{font-size:2.2rem;margin-bottom:.5rem;}

  /* ---------- modal ---------- */
  .modal-backdrop{position:fixed;inset:0;background:rgba(20,14,6,.45);display:flex;align-items:flex-start;justify-content:center;padding:2.2rem 1rem;overflow-y:auto;z-index:20;}
  .modal{background:var(--surface);border-radius:18px;max-width:560px;width:100%;padding:1.6rem 1.6rem 1.4rem;box-shadow:0 20px 50px var(--shadow);}
  .modal h2{font-size:1.15rem;}
  .modal-close{float:right;background:none;border:none;font-size:1.3rem;color:var(--ink-muted);cursor:pointer;line-height:1;}
  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 .8rem;}
  @media(max-width:480px){.grid2{grid-template-columns:1fr;}}
  .assign-list{display:flex;flex-direction:column;gap:.2rem;max-height:400px;overflow-y:auto;border:1px solid var(--border);border-radius:12px;padding:.5rem;}
  .assign-row{display:flex;align-items:center;gap:.6rem;padding:.5rem .4rem;border-radius:8px;flex-wrap:wrap;border-bottom:1px solid var(--border);}
  .assign-row:last-child{border-bottom:none;}
  .assign-row:hover{background:var(--surface-2);}
  .assign-row .aname{flex:1;min-width:110px;font-weight:600;font-size:.9rem;}
  .assign-row input[type="checkbox"]{width:18px;height:18px;flex:none;}
  .wload-hint{font-size:.68rem;color:var(--ink-muted);font-weight:400;}
  .assign-row select{width:auto;padding:.3rem .4rem;font-size:.8rem;}
  .a-fields{display:flex;gap:.7rem;flex-wrap:wrap;width:100%;padding-left:1.6rem;align-items:center;}
  .mini{display:flex;flex-direction:column;font-size:.66rem;color:var(--ink-muted);gap:.15rem;text-transform:uppercase;letter-spacing:.3px;}
  .mini select,.mini input{padding:.25rem .4rem;font-size:.8rem;width:auto;text-transform:none;letter-spacing:0;}
  .mini input[type="text"]{width:8.5em;}
  .mini input[type="number"]{width:4.5em;}
  .assign-hours{font-family:'Fredoka';font-weight:600;font-size:1rem;color:var(--accent-strong);min-width:3.4em;}
  .conflict-warn{width:100%;padding-left:1.6rem;font-size:.76rem;color:var(--danger);}
  .modal-actions{display:flex;justify-content:space-between;gap:.6rem;margin-top:1.2rem;flex-wrap:wrap;}

  /* ---------- workers tab ---------- */
  .worker-table{display:flex;flex-direction:column;gap:.55rem;}
  .worker-row{display:flex;align-items:center;gap:.9rem;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.75rem 1rem;flex-wrap:wrap;}
  .worker-row .wname{font-weight:700;flex:1;min-width:160px;}
  .worker-row .wnote{color:var(--ink-2);font-size:.82rem;}
  .worker-row .rating{font-size:.8rem;color:var(--ink-muted);}
  .inactive-badge{background:var(--surface-2);color:var(--ink-muted);border-radius:999px;padding:.15rem .55rem;font-size:.72rem;}

  /* ---------- stats ---------- */
  .stat-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;margin-bottom:1.4rem;}
  .stat-tile{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.9rem 1rem;}
  .stat-tile .v{font-family:'Fredoka';font-size:1.55rem;font-weight:600;}
  .stat-tile .l{font-size:.78rem;color:var(--ink-2);margin-top:.1rem;}
  .series-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:1.1rem 1.2rem;margin-bottom:1rem;}
  .series-card h3{font-size:1rem;margin-bottom:.7rem;}
  .bar-row{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:.6rem;margin-bottom:.5rem;font-size:.82rem;}
  .bar-row .yr{color:var(--ink-2);font-weight:700;}
  .bar-track{background:var(--surface-2);border-radius:6px;height:11px;position:relative;overflow:hidden;}
  .bar-fill{background:var(--accent);height:100%;border-radius:6px;min-width:3px;}
  .cat-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;margin-right:.4rem;vertical-align:middle;flex:none;}
  .bar-val{font-weight:700;white-space:nowrap;}
  /* A kategória-nevek (pl. "Bérek (Bérszámfejtésből)") jóval hosszabbak, mint az
     eredeti .bar-row 44px-es, évszámokra méretezett első oszlopa volt — emiatt a
     sáv rárajzolódott/eltakarta a szöveget. A Könyvelés kategória-soraihoz ezért
     egy külön, egymás ALÁ rendezett elrendezés (címke fent, sáv+összeg alatta),
     ami bármilyen hosszúságú címkével működik, szűk mobil nézetben is. */
  .bar-row-cat{margin-bottom:.7rem;font-size:.82rem;}
  .bar-row-cat .cat-label{display:flex;align-items:center;color:var(--ink-2);font-weight:700;margin-bottom:.3rem;}
  .bar-row-cat .bar-line{display:flex;align-items:center;gap:.6rem;}
  .bar-row-cat .bar-track{flex:1;}
  /* Teendők — státusz szerinti szakasz-fejlécek (Új teendők / Folyamatban / Elvégzett),
     Ján kérésére (2026-09-07): egymás alatt, jól elkülönített csoportokban. */
  .task-group-head{font-size:.95rem;margin:1.3rem 0 .6rem;color:var(--ink-2);}
  .task-group-head:first-of-type{margin-top:0;}
  .tier-dist{display:flex;gap:.5rem;flex-wrap:wrap;}

  /* ---------- team view ---------- */
  .team-shell{max-width:640px;margin:0 auto;padding:1.4rem 1.1rem 3rem;}
  .team-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.2rem;}
  .team-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:1.1rem 1.2rem;margin-bottom:.9rem;}
  .team-card h3{font-size:1.05rem;}
  .team-card .event-meta{margin-top:.5rem;}
  .season-summary{background:var(--surface-2);border-radius:14px;padding:.9rem 1.1rem;margin-bottom:1.2rem;font-size:.88rem;color:var(--ink-2);}
  details.past-events{margin-top:1.4rem;}
  details.past-events summary{cursor:pointer;font-weight:700;color:var(--ink-2);font-size:.9rem;padding:.4rem 0;}

  /* ---------- calendar: names in cells ---------- */
  .cal-cell{min-height:92px;align-items:stretch;}
  .cal-chip{font-size:.62rem;font-weight:700;padding:.08rem .32rem;border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;}
  .cal-chips{display:flex;flex-direction:column;gap:.15rem;}
  .cal-more{font-size:.6rem;color:var(--ink-muted);}
  .cal-offnames{font-size:.62rem;color:var(--danger);font-weight:700;line-height:1.25;overflow:hidden;text-overflow:ellipsis;}
  @media(max-width:700px){ .cal-cell{min-height:60px;} .cal-chip{display:none;} .cal-dots{display:flex;} .cal-offnames{font-size:.58rem;} }

  /* ---------- self-report hours (team view) ---------- */
  .self-report{background:var(--surface-2);border-radius:10px;padding:.55rem .7rem;margin-top:.6rem;}
  .self-report .row{display:flex;gap:.5rem;flex-wrap:wrap;align-items:flex-end;}
  .self-report label{font-size:.72rem;color:var(--ink-2);font-weight:600;display:block;margin-bottom:.2rem;}
  .self-report input{padding:.4rem .5rem;font-size:.85rem;}
  .self-report .hint{font-size:.76rem;color:var(--ink-muted);margin-bottom:.4rem;}
  .suggest-hint{font-size:.76rem;color:var(--accent-strong);background:color-mix(in srgb, var(--accent) 14%, transparent);border-radius:8px;padding:.3rem .55rem;margin-top:.3rem;display:inline-block;}
  .suggest-hint button{background:none;border:none;color:inherit;text-decoration:underline;cursor:pointer;font:inherit;padding:0;margin-left:.3rem;}

  /* ---------- payroll tab ---------- */
  .payslip-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:1.05rem 1.2rem;margin-bottom:.85rem;display:flex;gap:1rem;flex-wrap:wrap;align-items:flex-start;}
  .payslip-main{flex:1;min-width:220px;}
  .payslip-main h3{font-size:1.02rem;margin:0 0 .2rem;}
  .payslip-total{font-family:'Fredoka';font-size:1.3rem;font-weight:600;color:var(--accent-strong);flex:none;text-align:right;}
  .payslip-total .l{font-family:'Manrope';font-size:.72rem;color:var(--ink-2);font-weight:600;}
  .payslip-actions{display:flex;gap:.4rem;flex:none;flex-wrap:wrap;justify-content:flex-end;}
  .paid-badge{display:inline-flex;align-items:center;gap:.3rem;border-radius:999px;padding:.15rem .6rem;font-size:.72rem;font-weight:700;}
  .paid-badge.yes{background:color-mix(in srgb, var(--status-megerositve) 20%, transparent);color:var(--status-megerositve);}
  .paid-badge.no{background:color-mix(in srgb, var(--status-tervezett) 20%, transparent);color:var(--status-tervezett);}
  .confirm-badge{font-size:.72rem;color:var(--lime-strong);font-weight:700;}
  .modal.wide{max-width:760px;}
  .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 .8rem;}
  @media(max-width:560px){.grid3{grid-template-columns:1fr;}}
  .shift-table{border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:.4rem;}
  .shift-row{display:grid;grid-template-columns:1.3fr 1fr .75fr .75fr .7fr 1fr .7fr auto;gap:.5rem;padding:.5rem .6rem;align-items:center;border-bottom:1px solid var(--border);font-size:.85rem;}
  .shift-row.head{background:var(--surface-2);font-weight:700;color:var(--ink-2);font-size:.68rem;text-transform:uppercase;letter-spacing:.3px;}
  .shift-row:last-child{border-bottom:none;}
  .shift-row input,.shift-row select{padding:.35rem .4rem;font-size:.83rem;}
  .shift-rate{color:var(--ink-2);font-size:.82rem;}
  .row-del{background:none;border:none;color:var(--danger);cursor:pointer;font-size:1rem;}
  .comp-row{display:grid;grid-template-columns:1fr .5fr auto;gap:.5rem;margin-bottom:.4rem;align-items:center;}
  .totals-box{background:var(--surface-2);border-radius:12px;padding:.9rem 1.1rem;margin-top:.6rem;}
  .totals-line{display:flex;justify-content:space-between;font-size:.88rem;padding:.2rem 0;}
  .totals-line.final{font-weight:800;font-size:1.05rem;border-top:1px dashed var(--border);margin-top:.4rem;padding-top:.5rem;color:var(--accent-strong);}
  .round-suggest{font-size:.8rem;color:var(--status-tervezett);margin-top:.3rem;cursor:pointer;background:none;border:none;font-family:inherit;text-decoration:underline;padding:0;}
  .loyalty-note{font-size:.78rem;color:var(--ink-2);background:var(--surface-2);border-radius:8px;padding:.4rem .6rem;margin-bottom:.6rem;}
  .loyalty-note.missing{background:color-mix(in srgb, var(--danger) 14%, transparent);color:var(--danger);}
  .pick-shift-list{display:flex;flex-direction:column;gap:.3rem;max-height:200px;overflow-y:auto;border:1px solid var(--border);border-radius:10px;padding:.4rem;margin-bottom:.6rem;}
  .pick-shift-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.35rem .5rem;border-radius:8px;font-size:.82rem;}
  .pick-shift-row:hover{background:var(--surface-2);}
  .wbank{font-size:.82rem;font-family:ui-monospace,'SFMono-Regular',Menlo,monospace;color:var(--ink-2);}
  .wbank.empty{color:var(--ink-muted);font-family:inherit;font-style:italic;}
  .payroll-worker-row{display:grid;grid-template-columns:1.3fr .7fr 1.5fr auto;gap:.7rem;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.75rem 1rem;margin-bottom:.5rem;}
  @media(max-width:760px){.payroll-worker-row{grid-template-columns:1fr 1fr;}}
  .transfer-box{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:1rem 1.1rem;margin-top:1rem;}
  .transfer-box textarea{font-family:ui-monospace,'SFMono-Regular',Menlo,monospace;font-size:.82rem;min-height:8em;}
  .confidential-note{background:color-mix(in srgb, var(--danger) 10%, transparent);border:1px solid var(--danger);color:var(--danger);border-radius:12px;padding:.7rem .9rem;font-size:.82rem;margin-bottom:1.1rem;line-height:1.4;}

  /* ---------- pay archive (team view) ---------- */
  .pin-note{font-size:.78rem;color:var(--ink-muted);margin-top:.6rem;}

  /* ---------- inventory tab ---------- */
  .inv-subnav{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1.2rem;}
  .inv-subnav button{border:1.5px solid var(--border);background:var(--surface);color:var(--ink-2);border-radius:10px;padding:.5rem .9rem;font-size:.86rem;font-weight:700;cursor:pointer;}
  .inv-subnav button.active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);}
  .inv-alert{background:color-mix(in srgb, var(--danger) 10%, transparent);border:1px solid var(--danger);color:var(--danger);border-radius:12px;padding:.8rem 1rem;margin-bottom:1.2rem;}
  .inv-alert h3{margin:0 0 .4rem;font-size:.92rem;color:var(--danger);}
  .inv-alert-list{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;}
  .inv-cat-h{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-muted);margin:1.3rem 0 .5rem;}
  .inv-cat-h:first-of-type{margin-top:0;}
  .inv-item-row{display:grid;grid-template-columns:1.5fr .9fr .7fr .7fr .9fr;gap:.6rem;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.65rem 1rem;margin-bottom:.4rem;}
  .inv-item-row.low{border-color:var(--danger);}
  .inv-item-row .iname{font-weight:700;}
  .inv-item-row .ipack{font-size:.76rem;color:var(--ink-muted);display:block;font-weight:400;}
  .inv-item-row input{padding:.35rem .4rem;font-size:.85rem;}
  .inv-stock-badge{font-size:.72rem;font-weight:700;padding:.15rem .5rem;border-radius:999px;white-space:nowrap;justify-self:start;}
  .inv-stock-badge.ok{background:color-mix(in srgb, var(--status-megerositve) 20%, transparent);color:var(--status-megerositve);}
  .inv-stock-badge.low{background:color-mix(in srgb, var(--danger) 18%, transparent);color:var(--danger);}
  .inv-stock-badge.off{background:var(--surface-2);color:var(--ink-muted);}
  .inv-item-row.alert-off{opacity:.7;}
  .alert-toggle{display:flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:400;color:var(--ink-muted);margin-top:.25rem;cursor:pointer;}
  .alert-toggle input{width:auto;flex:none;}
  @media(max-width:760px){.inv-item-row{grid-template-columns:1fr 1fr;}}
  .recipe-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.9rem 1.1rem;margin-bottom:.65rem;}
  .recipe-card h3{font-size:.98rem;margin:0 0 .3rem;display:flex;align-items:center;gap:.5rem;}
  .recipe-card .rprice{margin-left:auto;color:var(--accent-strong);font-family:'Fredoka';font-weight:600;}
  .recipe-ing{font-size:.82rem;color:var(--ink-2);}
  .recipe-cost{font-size:.78rem;color:var(--ink-muted);margin-top:.3rem;}
  .alc-badge{font-size:.68rem;font-weight:700;background:color-mix(in srgb, var(--tier-nagy) 20%, transparent);color:var(--tier-nagy);border-radius:999px;padding:.1rem .5rem;}
  .pack-cat{margin-bottom:1.1rem;}
  .pack-cat h3{font-size:.9rem;color:var(--ink-2);margin-bottom:.5rem;}
  .pack-item{display:flex;align-items:center;gap:.6rem;padding:.4rem .5rem;border-radius:8px;font-size:.9rem;}
  .pack-item:hover{background:var(--surface-2);}
  .pack-item input{width:18px;height:18px;}
  .pack-item.checked label{text-decoration:line-through;color:var(--ink-muted);}
  .pack-item button{margin-left:auto;}
  .pack-progress{background:var(--surface-2);border-radius:999px;height:8px;overflow:hidden;margin-bottom:1rem;}
  .pack-progress-fill{background:var(--lime);height:100%;border-radius:999px;}
  .cons-row{display:grid;grid-template-columns:1.6fr .6fr auto;gap:.6rem;align-items:center;padding:.4rem 0;border-bottom:1px solid var(--border);font-size:.88rem;}
  .cons-row:last-child{border-bottom:none;}
  .cons-row input{padding:.35rem .4rem;font-size:.85rem;width:100%;}
  .forecast-item{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr;gap:.6rem;padding:.4rem .2rem;border-bottom:1px solid var(--border);font-size:.85rem;align-items:center;}
  .forecast-item.head{font-weight:700;color:var(--ink-2);font-size:.7rem;text-transform:uppercase;letter-spacing:.3px;}
  .forecast-item .neg{color:var(--danger);font-weight:700;}
  .econ-table{border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-top:.6rem;}
  .econ-row{display:grid;grid-template-columns:1.6fr .9fr 1.1fr 1.1fr 1.1fr;gap:.6rem;padding:.5rem .7rem;border-bottom:1px solid var(--border);font-size:.83rem;align-items:center;}
  .econ-row:last-child{border-bottom:none;}
  .econ-row.head{background:var(--surface-2);font-weight:700;color:var(--ink-2);font-size:.68rem;text-transform:uppercase;letter-spacing:.3px;}
  /* Ján kérésére (2026-09-07): a Könyvelés tranzakció-listája eddig egybefolyt a
     drapp háttérrel — most a bevétel zöldes, a kiadás pirosas árnyalatot kap
     (halvány sor-alap + színes, félkövér összeg), jobb kontraszttal. */
  .econ-row-income{background:color-mix(in srgb, var(--status-megerositve) 10%, var(--surface));}
  .econ-row-expense{background:color-mix(in srgb, var(--danger) 7%, var(--surface));}
  .num-income{color:var(--status-megerositve);font-weight:700;}
  .num-expense{color:var(--danger);font-weight:700;}
  /* Ján kérésére (2026-09-08): a rendezvény-bevételből / bérszámfejtésből automatikusan
     számolt sorok (nem kézzel felvitt tételek) halvány szaggatott bal szegéllyel
     megkülönböztetve, hogy egyértelmű legyen — ezek nem itt szerkeszthetők. */
  .econ-row-auto{border-left:3px dashed var(--border);}
  .econ-row-auto:hover{border-left-color:var(--ink-2);}
  /* Könyvelés-lista szűrő/kereső sáv (Ján kérésére, 2026-09-08). */
  .finance-filterbar{display:flex;flex-wrap:wrap;gap:.7rem;align-items:flex-end;margin:.9rem 0 .3rem;padding:.7rem .8rem;background:var(--surface-2);border-radius:12px;}
  .finance-search{flex:1 1 16rem;min-width:12rem;padding:.5rem .7rem;border:1px solid var(--border);border-radius:8px;font-size:.85rem;background:var(--surface);color:var(--ink);}
  .finance-daterange{display:flex;gap:.5rem;align-items:flex-end;flex-wrap:wrap;}
  .finance-daterange label{display:flex;flex-direction:column;font-size:.66rem;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.3px;gap:.15rem;}
  .finance-daterange input{padding:.3rem .4rem;font-size:.8rem;}
  .search-hidden{display:none !important;}
  /* Automatikus/kézi biztonsági mentések listája (Ján kérésére, 2026-09-08). */
  .backup-list{border:1px solid var(--border);border-radius:10px;overflow:hidden;}
  .backup-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.5rem .7rem;font-size:.83rem;border-bottom:1px solid var(--border);}
  .backup-row:last-child{border-bottom:none;}
  .log-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.7rem .9rem;margin-bottom:.5rem;font-size:.86rem;}
  .log-card .lhead{display:flex;justify-content:space-between;gap:.6rem;flex-wrap:wrap;font-weight:700;}
  .neg{color:var(--danger);font-weight:700;}

  /* ---------- quantities: opening/closing per-event counts ---------- */
  .qty-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.8rem;}
  .qty-row{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.1fr;gap:.7rem;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.7rem 1rem;}
  .qname{font-weight:700;}
  .qunit{font-weight:400;color:var(--ink-muted);font-size:.78rem;margin-left:.35rem;}
  .qty-col{display:flex;flex-direction:column;gap:.25rem;}
  .qty-col label{font-size:.72rem;color:var(--ink-2);font-weight:600;}
  .qty-stepper{display:flex;align-items:stretch;gap:.3rem;}
  .qty-stepper input{text-align:center;padding:.5rem .3rem;min-width:0;flex:1;font-size:.95rem;}
  .qty-btn{flex:none;width:2.4rem;border:1.5px solid var(--border);background:var(--surface-2);color:var(--ink);border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;}
  .qty-btn:hover{border-color:var(--accent);}
  /* Az alternatív egység (karton/kg) mezőknél kisebb, kompaktabb +/- gombok — ezek
     mindig egy elsődleges qty-stepper vagy mező MELLETT, kiegészítőként jelennek meg. */
  .alt-stepper{max-width:9rem;}
  .alt-stepper .qty-btn{width:1.7rem;font-size:.95rem;padding:0;}
  .alt-stepper input{font-size:.88rem;padding:.4rem .2rem;}
  .qty-used{font-size:.85rem;color:var(--ink-2);text-align:right;}
  .qpack{font-size:.72rem;color:var(--ink-muted);font-weight:400;margin-top:.15rem;}
  .qkg{display:block;font-size:.72rem;color:var(--ink-muted);margin-top:.2rem;text-align:center;}
  .qty-secondary summary{cursor:pointer;font-weight:700;color:var(--ink-2);font-size:.88rem;padding:.5rem 0;}
  @media(max-width:820px){ .qty-row{grid-template-columns:1fr 1fr;} .qty-used{grid-column:1/-1;text-align:left;} }

  /* ---------- print payslip (off-screen render source for the PDF-image export) ---------- */
  #print-payslip{position:fixed;left:-10000px;top:0;width:640px;background:#ffffff;color:#1a1a1a;padding:2rem;font-family:Arial,Helvetica,sans-serif;}
  #print-payslip .print-title{font-family:'Fredoka',Arial,sans-serif;font-size:1.4rem;margin-bottom:.2rem;font-weight:800;}
  #print-payslip .print-row{display:flex;justify-content:space-between;padding:.25rem 0;border-bottom:1px solid #ddd;font-size:.95rem;}
  #print-payslip .print-table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.85rem;}
  #print-payslip .print-table th,#print-payslip .print-table td{border:1px solid #ccc;padding:.35rem .5rem;text-align:left;}
  #print-payslip .print-final{font-weight:800;font-size:1.2rem;margin-top:.8rem;}
  #print-payslip .sched-table td{vertical-align:top;}
  #print-payslip .sched-loc{color:#666;font-size:.75rem;}
  #print-payslip .fin-table{font-size:.72rem;}
  #print-payslip .fin-table th,#print-payslip .fin-table td{padding:.25rem .4rem;}
