:root {
  --navy: #0A192F;
  --navy-soft: #13243d;
  --cyan: #00D1FF;
  --cyan-soft: rgba(0, 209, 255, 0.11);
  --white: #ffffff;
  --slate-900: #0f172a;
  --slate-800: #1e293b;
  --slate-700: #334155;
  --slate-600: #475569;
  --slate-500: #64748b;
  --slate-400: #94a3b8;
  --slate-300: #cbd5e1;
  --slate-200: #e2e8f0;
  --slate-100: #f1f5f9;
  --slate-50: #f8fafc;
  --bg: #ffffff;
  --surface: rgba(255,255,255,0.94);
  --surface-soft: rgba(248,250,252,0.74);
  --text: var(--slate-900);
  --text-soft: var(--slate-600);
  --muted: var(--slate-500);
  --border: rgba(226,232,240,0.95);
  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 14px 34px rgba(15, 23, 42, 0.045);
  --shadow-button: 0 18px 44px rgba(10, 25, 47, 0.16);
  --max: 1280px;
  --topbar-height: 76px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #08111f;
    --surface: rgba(15,23,42,0.88);
    --surface-soft: rgba(15,23,42,0.66);
    --text: #f8fafc;
    --text-soft: #cbd5e1;
    --muted: #94a3b8;
    --border: rgba(148,163,184,0.20);
    --slate-50: #0b1424;
    --white: #0f172a;
    --navy: #f8fafc;
    --navy-soft: #e2e8f0;
    --shadow-card: 0 24px 70px rgba(0,0,0,0.22);
  }
}
:root[data-theme="dark"] {
  --bg: #08111f;
  --surface: rgba(15,23,42,0.88);
  --surface-soft: rgba(15,23,42,0.66);
  --text: #f8fafc;
  --text-soft: #cbd5e1;
  --muted: #94a3b8;
  --border: rgba(148,163,184,0.20);
  --slate-50: #0b1424;
  --white: #0f172a;
  --navy: #f8fafc;
  --navy-soft: #e2e8f0;
  --shadow-card: 0 24px 70px rgba(0,0,0,0.22);
}
*{box-sizing:border-box} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%} body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"Helvetica Neue",sans-serif;background:linear-gradient(180deg,var(--slate-50),var(--bg));color:var(--text);min-height:100vh;overflow-x:hidden} a{color:inherit;text-decoration:none} img,svg{display:block;max-width:100%} h1,h2,h3,p{margin-top:0}.container{width:min(100% - 32px,var(--max));margin-inline:auto}.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.84);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(226,232,240,0.86)}:root[data-theme="dark"] .topbar{background:rgba(8,17,31,0.84);border-bottom-color:rgba(148,163,184,0.18)}@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .topbar{background:rgba(8,17,31,0.84);border-bottom-color:rgba(148,163,184,0.18)}}.topbar-inner{height:var(--topbar-height);display:flex;align-items:center;justify-content:space-between;gap:24px}.topbar-left{display:flex;align-items:center;gap:22px;min-width:0}.brand{display:inline-flex;align-items:center;gap:12px;color:var(--navy);line-height:1;flex-shrink:0}.brand-logo{width:auto;height:32px;object-fit:contain;flex:0 0 auto}.brand-text{font-size:1.42rem;font-weight:780;letter-spacing:-.055em;white-space:nowrap}.brand-dot{color:var(--cyan)}.brand-divider{width:1px;height:32px;background:var(--border);display:inline-block}.brand-module{color:var(--muted);font-weight:850;text-transform:uppercase;letter-spacing:.22em;font-size:1.18rem;line-height:1}.topbar-right{display:flex;align-items:center;gap:10px}.app-shell{width:min(100% - 32px,var(--max));margin:0 auto;display:grid;grid-template-columns:220px minmax(0,1fr);gap:22px;padding:22px 0 42px;align-items:start}.sidebar{position:sticky;top:calc(var(--topbar-height) + 18px);background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:14px;box-shadow:var(--shadow-card);backdrop-filter:blur(10px)}.sidebar-title{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin:2px 8px 12px}.sidebar-nav{display:grid;gap:6px}.sidebar-nav a{display:flex;align-items:center;gap:8px;padding:11px 12px;border-radius:14px;color:var(--text-soft);font-size:.88rem;font-weight:700;transition:background 170ms,color 170ms,transform 170ms}.sidebar-nav a:hover{background:rgba(0,209,255,.08);color:var(--navy);transform:translateX(1px)}.sidebar-nav a.active{background:var(--navy);color:#fff;box-shadow:0 12px 30px rgba(10,25,47,.13)}.content{min-width:0}.page-head{margin-bottom:22px}.eyebrow{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;margin-bottom:13px;border-radius:999px;background:rgba(241,245,249,.86);border:1px solid rgba(226,232,240,.72);color:var(--muted);text-transform:uppercase;letter-spacing:.115em;font-size:.7rem;font-weight:760}.eyebrow::before{content:"";width:7px;height:7px;border-radius:999px;background:var(--cyan);box-shadow:0 0 0 4px rgba(0,209,255,.12)}h1{margin:0 0 8px;color:var(--navy);font-size:clamp(2rem,3.2vw,3.6rem);line-height:1.08;letter-spacing:-.052em;font-weight:720}h2{margin:0 0 10px;color:var(--navy);font-size:clamp(1.35rem,2vw,2rem);line-height:1.12;letter-spacing:-.035em;font-weight:720}h3{color:var(--navy);font-size:1.05rem;margin-bottom:10px}.lead,.page-subtitle,p{color:var(--text-soft);line-height:1.68}.card{background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:22px;box-shadow:var(--shadow-card);margin-bottom:18px;backdrop-filter:blur(10px)}.card:hover{border-color:rgba(0,209,255,.48)}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.stat{min-height:120px;padding:20px;border-radius:20px;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-card)}.stat-label{color:var(--muted);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.stat-value{margin-top:12px;color:var(--navy);font-size:1.65rem;font-weight:780;letter-spacing:-.04em}.muted{color:var(--muted);font-size:.9rem}.badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(241,245,249,.86);border:1px solid var(--border);color:var(--muted);font-size:.74rem;font-weight:700}label{display:block;margin-bottom:7px;color:var(--navy);font-size:.86rem;font-weight:730}input,select,textarea{width:100%;appearance:none;-webkit-appearance:none;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft);color:var(--text);font:inherit;font-size:.95rem;font-weight:500;padding:13px 14px;outline:none;transition:border-color 170ms,box-shadow 170ms,background 170ms;margin-bottom:14px}textarea{min-height:120px;resize:vertical;line-height:1.55}input:focus,select:focus,textarea:focus{background:var(--surface);border-color:rgba(0,209,255,.76);box-shadow:0 0 0 4px rgba(0,209,255,.11)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;cursor:pointer;line-height:1;font-weight:760;white-space:nowrap;transition:background 170ms,border-color 170ms,transform 170ms,box-shadow 170ms;padding:13px 18px;font-size:.9rem}.btn-primary,.btn{background:var(--navy);color:#fff;box-shadow:0 12px 30px rgba(10,25,47,.13)}.btn-primary:hover,.btn:hover{background:var(--navy-soft);transform:translateY(-1px);box-shadow:var(--shadow-button)}.btn-secondary{background:var(--surface);color:var(--text);box-shadow:none;border:1px solid var(--border)}.btn-danger{background:#dc2626;color:#fff}.btn-ghost{background:rgba(241,245,249,.8);color:var(--navy);border:1px solid var(--border);box-shadow:none}.theme-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--navy);padding:10px 14px;font-weight:760;cursor:pointer}.theme-toggle-icon{width:14px;height:14px;border-radius:999px;background:linear-gradient(135deg,var(--navy) 0 50%,var(--cyan) 50% 100%);box-shadow:0 0 0 4px rgba(0,209,255,.1)}.lang-switch{display:inline-flex;align-items:center;gap:4px;padding:4px;border:1px solid var(--border);border-radius:999px;background:var(--surface)}.lang-switch a{padding:7px 9px;border-radius:999px;color:var(--muted);font-size:.76rem;font-weight:800}.lang-switch a.active{background:var(--navy);color:#fff}.account-menu{position:relative}.account-button{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:6px 8px 6px 6px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text);box-shadow:var(--shadow-card);cursor:pointer;min-width:245px}.account-avatar{width:40px;height:40px;border-radius:999px;background:linear-gradient(135deg,var(--navy),#13243d);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:.95rem;flex:0 0 40px}.account-button-text{display:flex;flex-direction:column;align-items:flex-start;min-width:0;flex:1;line-height:1.08}.account-button-name{font-size:.9rem;font-weight:780;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}.account-button-role{margin-top:3px;font-size:.72rem;color:var(--muted);font-weight:730}.account-button-caret{font-size:.72rem;color:var(--muted);padding-right:8px}.account-dropdown{position:absolute;right:0;top:calc(100% + 12px);width:330px;max-width:min(92vw,330px);padding:18px;border-radius:22px;background:var(--surface);border:1px solid var(--border);box-shadow:0 24px 60px rgba(15,23,42,.16);display:none;z-index:1100}.account-dropdown.open{display:block}.account-dropdown-name{font-size:1rem;font-weight:780;color:var(--navy);margin:0 0 8px}.account-dropdown-meta{font-size:.86rem;color:var(--muted);line-height:1.45;margin:0 0 16px}.account-dropdown-separator{height:1px;background:var(--border);margin:0 0 14px}.account-dropdown-label{font-size:.72rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}.account-dropdown-links{display:grid;gap:8px}.account-dropdown-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;border-radius:14px;font-weight:740;font-size:.9rem;background:rgba(241,245,249,.8);color:var(--navy);border:1px solid var(--border)}.account-dropdown-link.logout{background:#fbeaea;color:#c12b1f;border-color:rgba(220,38,38,.15)}.table-wrap{width:100%;overflow-x:auto;border-radius:18px;border:1px solid var(--border)}table{width:100%;border-collapse:collapse;min-width:760px;background:var(--surface)}th,td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--border);color:var(--text-soft);font-size:.92rem}th{color:var(--navy);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;background:rgba(241,245,249,.56)}tr:last-child td{border-bottom:0}.alert{border-radius:16px;padding:14px 16px;margin-bottom:18px;border:1px solid var(--border);background:var(--surface);color:var(--text-soft)}.alert.success{border-color:rgba(34,197,94,.32);background:rgba(34,197,94,.08)}.alert.error{border-color:rgba(239,68,68,.32);background:rgba(239,68,68,.08)}.code-box{background:rgba(15,23,42,.06);border:1px solid var(--border);border-radius:16px;padding:14px;overflow:auto;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:.86rem}.import-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.import-summary .item{border:1px solid var(--border);border-radius:16px;padding:14px;background:var(--surface-soft)}.import-summary strong{display:block;color:var(--navy);font-size:1.35rem;margin-bottom:4px}.mobile-menu{display:none}@media(max-width:980px){.topbar-inner{height:auto;min-height:72px;padding:10px 0;flex-wrap:wrap}.brand-divider,.brand-module,.lang-switch{display:none}.account-button{min-width:0}.account-button-text{display:none}.app-shell{grid-template-columns:1fr}.sidebar{position:static}.sidebar-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.grid,.form-grid,.form-grid.three,.import-summary{grid-template-columns:1fr}}@media(max-width:640px){.container,.app-shell{width:min(100% - 24px,var(--max))}.brand-text{font-size:1.22rem}.theme-toggle-label{display:none}.sidebar-nav{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.card{padding:18px}}
.brand-pipe{color:var(--border-strong,#cbd5e1);font-size:1.75rem;font-weight:300;line-height:1;display:inline-flex;align-items:center;opacity:.9}.brand-module{letter-spacing:.06em;text-transform:none;color:var(--navy);font-weight:620;font-size:1.05rem}.login-shell{padding:88px 0 56px;display:grid;place-items:center}.login-card{max-width:760px;width:100%;text-align:center;padding:46px;border:1px solid var(--border);border-radius:30px;background:var(--surface);box-shadow:0 26px 80px rgba(15,23,42,.10)}.login-card h1{font-size:clamp(2.4rem,4.6vw,4.4rem)}.login-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}.login-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px;text-align:left}.login-feature{border:1px solid var(--border);border-radius:18px;padding:16px;background:var(--surface-soft)}.login-feature strong{display:block;color:var(--navy);margin-bottom:4px}.login-feature span{color:var(--muted);font-size:.86rem;line-height:1.45}.calendar-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.calendar-cell{min-height:128px;border:1px solid var(--border);border-radius:18px;background:var(--surface);padding:10px;box-shadow:var(--shadow-card)}.calendar-cell.muted-day{opacity:.45}.calendar-day{font-weight:800;color:var(--navy);margin-bottom:8px}.calendar-event{display:block;margin:5px 0;padding:5px 7px;border-radius:10px;background:rgba(0,209,255,.10);border:1px solid rgba(0,209,255,.22);font-size:.78rem;color:var(--text-soft);line-height:1.25}.calendar-event.free{background:rgba(34,197,94,.10);border-color:rgba(34,197,94,.24)}.calendar-event.absence{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.25)}.summary-list{display:grid;gap:10px}.summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--border);padding:10px 0}.summary-row:last-child{border-bottom:0}.dot{display:inline-block;width:10px;height:10px;border-radius:999px;margin-right:8px;vertical-align:middle}@media(max-width:760px){.login-features{grid-template-columns:1fr}.calendar-grid{grid-template-columns:1fr}.calendar-cell{min-height:auto}}
/* v5 restored product functions */
.stats-six{grid-template-columns:repeat(6,minmax(0,1fr))}.green{color:#16a34a!important}.red{color:#dc2626!important}.form-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1.1fr .9fr}.summary-list.compact .summary-row{padding:7px 0}.section-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.actions-cell{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.actions-cell form{margin:0}.btn.small,.small{padding:9px 12px;font-size:.78rem;border-radius:999px}.settings-list{display:grid;gap:10px;margin:10px 0 24px}.settings-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:end;padding:14px;border:1px solid var(--border);border-radius:18px;background:var(--surface-soft)}.settings-row.custom-row{grid-template-columns:.45fr 1fr}.settings-row.absence-row{grid-template-columns:repeat(5,minmax(0,1fr))}.settings-row.comp-row{grid-template-columns:.8fr .6fr .7fr 1.2fr}.settings-row.holiday-row{grid-template-columns:.35fr .6fr 1fr .45fr}.checkbox-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin:8px 0 24px}.check-card{border:1px solid var(--border);border-radius:14px;padding:10px 12px;background:var(--surface-soft);margin:0}.inline-check{display:flex;align-items:center;gap:8px;margin:0 0 14px}.inline-check input,.check-card input{width:auto;margin:0 6px 0 0}.hint{display:block;color:var(--muted);font-size:.75rem;margin-top:-8px}.calendar-weekdays>div{font-weight:800;text-align:center;color:var(--muted);padding-bottom:8px}.calendar-cell.today{outline:2px solid rgba(0,209,255,.55);box-shadow:0 0 0 5px rgba(0,209,255,.10)}.calendar-event.total{background:rgba(10,25,47,.07);border-color:rgba(10,25,47,.12);font-weight:800}.calendar-event.comp{background:rgba(124,58,237,.11);border-color:rgba(124,58,237,.25)}.calendar-legend{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px;color:var(--muted);font-weight:720}.legend-dot{display:inline-block;width:10px;height:10px;border-radius:999px;margin-right:6px}.legend-dot.work{background:var(--cyan)}.legend-dot.free{background:#22c55e}.legend-dot.absence{background:#f59e0b}.legend-dot.comp{background:#7c3aed}@media(max-width:1280px){.stats-six{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-row,.settings-row.absence-row,.settings-row.comp-row{grid-template-columns:repeat(2,minmax(0,1fr))}.checkbox-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.stats-six,.form-grid.four,.dashboard-grid,.settings-row,.settings-row.custom-row,.settings-row.absence-row,.settings-row.comp-row,.settings-row.holiday-row,.checkbox-grid{grid-template-columns:1fr}.section-title-row{display:block}.actions-cell{display:grid}}

/* v6 closer to old Time functionality inside Officia UI */
.brand-pipe{color:#cbd5e1!important;font-size:2rem!important;font-weight:300!important;margin:0 2px!important;opacity:1!important}.brand-module{text-transform:uppercase!important;letter-spacing:.18em!important;color:#64748b!important;font-weight:850!important;font-size:1.08rem!important}.old-top-grid{grid-template-columns:1fr 1fr 1fr}.compact-card h2{font-size:1.35rem}.button-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.button-row.right{justify-content:flex-end}.btn-success{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;cursor:pointer;line-height:1;font-weight:760;white-space:nowrap;padding:13px 18px;font-size:.9rem;background:#22c55e;color:#052e16}.empty-dashed{border:1px dashed var(--border);border-radius:16px;padding:14px;color:var(--muted);background:var(--surface-soft);margin-top:10px}.active-timer-box{border:1px solid rgba(34,197,94,.3);background:rgba(34,197,94,.08);border-radius:16px;padding:14px;margin-bottom:14px;display:grid;gap:3px}.active-timer-box strong{color:var(--navy)}.small-note{font-size:.82rem;margin-top:12px}.two-tight{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stats-four{grid-template-columns:repeat(4,minmax(0,1fr))}.old-stats .stat{min-height:96px}.old-stats .stat-value{font-size:1.35rem}.chart-grid{grid-template-columns:1fr 1fr}.bar-chart{height:280px;display:flex;align-items:end;gap:6px;border:1px solid var(--border);border-radius:18px;background:var(--surface-soft);padding:16px 12px 34px;position:relative}.bar{flex:1;display:flex;align-items:end;justify-content:center;height:100%;min-width:8px;position:relative}.bar span{width:100%;max-width:18px;min-height:3px;border-radius:8px 8px 0 0;background:linear-gradient(180deg,var(--cyan),#2563eb);display:block;box-shadow:0 8px 18px rgba(37,99,235,.22)}.bar em{position:absolute;bottom:-24px;font-style:normal;font-size:.68rem;color:var(--muted);transform:rotate(-45deg);transform-origin:center}.pie-wrap{display:grid;grid-template-columns:minmax(180px,300px) 1fr;gap:20px;align-items:center}.pie-chart{width:100%;height:auto;transform:rotate(-90deg)}.pie-bg{fill:none;stroke:rgba(148,163,184,.22);stroke-width:8}.pie-slice{fill:none;stroke-width:8;transition:opacity .2s}.pie-legend{display:grid;gap:8px;color:var(--text-soft);font-weight:700}.pie-legend span{display:flex;align-items:center;gap:8px}.pie-legend i{width:11px;height:11px;border-radius:999px;display:inline-block}.calendar-cell.selected{outline:2px solid var(--navy);box-shadow:0 0 0 5px rgba(10,25,47,.08)}.calendar-cell{color:inherit;text-decoration:none}.calendar-cell:hover{border-color:rgba(0,209,255,.7);transform:translateY(-1px)}@media(max-width:1180px){.old-top-grid,.chart-grid{grid-template-columns:1fr}.stats-four{grid-template-columns:repeat(2,minmax(0,1fr))}.pie-wrap{grid-template-columns:1fr}.pie-chart{max-width:320px;margin:auto}}@media(max-width:760px){.old-top-grid,.stats-four,.two-tight{grid-template-columns:1fr}.button-row.right{justify-content:flex-start}.bar-chart{overflow-x:auto}.bar{min-width:16px}}

/* v7 page separation and Officia naming */
.brand-pipe{color:#cbd5e1!important;font-size:1.95rem!important;font-weight:300!important;margin:0 4px!important;opacity:1!important;line-height:1!important}.brand-module{text-transform:none!important;letter-spacing:.02em!important;color:var(--navy)!important;font-weight:650!important;font-size:1.08rem!important}.time-entry-grid{grid-template-columns:1fr 1fr}.project-edit-list{display:grid;gap:12px}.project-edit-row{display:grid;grid-template-columns:1.2fr .35fr .45fr .35fr;gap:12px;align-items:end;padding:14px;border:1px solid var(--border);border-radius:18px;background:var(--surface-soft)}.bar{border:0;background:transparent;padding:0}.bar:hover{transform:none}.calendar-cell:hover{transform:none}.sidebar-nav a.active{box-shadow:0 12px 30px rgba(10,25,47,.13)}@media(max-width:1180px){.project-edit-row{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.time-entry-grid,.project-edit-row{grid-template-columns:1fr}.brand-pipe,.brand-module{display:inline-flex!important}}

/* v8 dark-mode contrast and page filter polish */
:root[data-theme="dark"] .sidebar-nav a.active {
  background: linear-gradient(135deg, rgba(0,209,255,.22), rgba(59,130,246,.18)) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(0,209,255,.45) !important;
  box-shadow: 0 14px 36px rgba(0,209,255,.10) !important;
}
:root[data-theme="dark"] .sidebar-nav a.active:hover { color:#fff!important; }
:root[data-theme="dark"] .btn-secondary,
:root[data-theme="dark"] .btn-ghost,
:root[data-theme="dark"] .account-dropdown-link {
  background: rgba(15,23,42,.86) !important;
  color: #e2e8f0 !important;
  border-color: rgba(148,163,184,.26) !important;
}
:root[data-theme="dark"] .btn-secondary:hover,
:root[data-theme="dark"] .btn-ghost:hover,
:root[data-theme="dark"] .account-dropdown-link:hover {
  background: rgba(30,41,59,.92) !important;
  color: #ffffff !important;
}
:root[data-theme="dark"] .btn,
:root[data-theme="dark"] .btn-primary {
  background: #00d1ff !important;
  color: #04111f !important;
  box-shadow: 0 14px 34px rgba(0,209,255,.15) !important;
}
:root[data-theme="dark"] .btn:hover,
:root[data-theme="dark"] .btn-primary:hover { background:#67e8f9!important;color:#04111f!important; }
:root[data-theme="dark"] button:disabled,
:root[data-theme="dark"] .btn:disabled,
:root[data-theme="dark"] input:disabled,
:root[data-theme="dark"] select:disabled {
  opacity: .55 !important;
  color: #94a3b8 !important;
  background: rgba(30,41,59,.62) !important;
  border-color: rgba(148,163,184,.18) !important;
}
:root[data-theme="dark"] .lang-switch a.active {
  background: #00d1ff !important;
  color: #04111f !important;
}
:root[data-theme="dark"] .theme-toggle {
  background: rgba(15,23,42,.86) !important;
  color: #f8fafc !important;
  border-color: rgba(148,163,184,.3) !important;
}
:root[data-theme="dark"] .theme-toggle:focus,
:root[data-theme="dark"] .account-button:focus,
:root[data-theme="dark"] .sidebar-nav a:focus,
:root[data-theme="dark"] .btn:focus,
:root[data-theme="dark"] button:focus {
  outline: 2px solid rgba(0,209,255,.8) !important;
  outline-offset: 2px !important;
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: #7b8799 !important; opacity: 1; }
.compact-filter label { margin-bottom: 0; }
.compact-filter input,.compact-filter select { margin-bottom: 0; }
.calendar-cell .calendar-event { word-break: break-word; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .sidebar-nav a.active {
    background: linear-gradient(135deg, rgba(0,209,255,.22), rgba(59,130,246,.18)) !important;
    color: #f8fafc !important;
    border: 1px solid rgba(0,209,255,.45) !important;
    box-shadow: 0 14px 36px rgba(0,209,255,.10) !important;
  }
  :root:not([data-theme="light"]) .btn-secondary,
  :root:not([data-theme="light"]) .btn-ghost,
  :root:not([data-theme="light"]) .account-dropdown-link {
    background: rgba(15,23,42,.86) !important;
    color: #e2e8f0 !important;
    border-color: rgba(148,163,184,.26) !important;
  }
  :root:not([data-theme="light"]) .btn,
  :root:not([data-theme="light"]) .btn-primary {
    background: #00d1ff !important;
    color: #04111f !important;
  }
  :root:not([data-theme="light"]) .lang-switch a.active {
    background: #00d1ff !important;
    color: #04111f !important;
  }
}

/* v9: chart axis and country holiday settings */
.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.info-box{border:1px solid var(--border);border-radius:16px;background:var(--surface-soft);color:var(--text-soft);padding:13px 14px;line-height:1.55;margin-bottom:14px}.info-box strong{color:var(--navy)}
.bar-chart-wrap{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;align-items:stretch}.bar-y-axis{height:280px;display:flex;flex-direction:column;justify-content:space-between;text-align:right;color:var(--muted);font-size:.78rem;font-weight:800;padding:11px 0 36px}.bar-chart{background-image:linear-gradient(to top, rgba(148,163,184,.18) 1px, transparent 1px);background-size:100% 50%}.bar-chart::before,.bar-chart::after{content:"";position:absolute;left:12px;right:12px;border-top:1px dashed rgba(148,163,184,.22);pointer-events:none}.bar-chart::before{top:50%}.bar-chart::after{top:16px}:root[data-theme="dark"] .info-box{background:rgba(15,23,42,.72);border-color:rgba(148,163,184,.22)}:root[data-theme="dark"] .bar-chart{background-color:rgba(15,23,42,.72)}@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .info-box{background:rgba(15,23,42,.72);border-color:rgba(148,163,184,.22)}:root:not([data-theme="light"]) .bar-chart{background-color:rgba(15,23,42,.72)}}@media(max-width:760px){.form-grid.two{grid-template-columns:1fr}.bar-chart-wrap{grid-template-columns:38px minmax(0,1fr)}}

/* v10: readable chart axis and real checkbox controls */
.axis-chart-v10{
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:12px;
  align-items:stretch;
}
.axis-chart-v10 .axis-labels-v10{
  height:300px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:flex-end;
  padding:16px 0 42px;
  color:var(--text-soft);
  font-size:.86rem;
  font-weight:850;
  line-height:1;
}
.axis-chart-v10 .axis-labels-v10 span{display:block;white-space:nowrap;}
.axis-chart-v10 .plot-v10{
  height:300px;
  position:relative;
  display:flex;
  align-items:end;
  gap:7px;
  border:1px solid var(--border);
  border-radius:18px;
  background:var(--surface-soft);
  padding:16px 12px 42px;
  overflow:hidden;
}
.axis-chart-v10 .plot-v10::before{
  content:"";
  position:absolute;
  inset:16px 12px 42px 12px;
  pointer-events:none;
  background:
    linear-gradient(to top, rgba(148,163,184,.28) 1px, transparent 1px),
    linear-gradient(to right, rgba(148,163,184,.16) 1px, transparent 1px);
  background-size:100% 50%, 8.333% 100%;
}
.axis-chart-v10 .plot-v10::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:42px;
  border-top:2px solid rgba(148,163,184,.34);
  pointer-events:none;
}
.axis-chart-v10 .bar{
  z-index:1;
  flex:1;
  display:flex;
  align-items:end;
  justify-content:center;
  height:100%;
  min-width:10px;
  position:relative;
}
.axis-chart-v10 .bar span{
  width:100%;
  max-width:22px;
  min-height:3px;
  border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,var(--cyan),#2563eb);
  display:block;
  box-shadow:0 8px 18px rgba(37,99,235,.22);
}
.axis-chart-v10 .bar em{
  position:absolute;
  bottom:-30px;
  font-style:normal;
  font-size:.72rem;
  color:var(--muted);
  transform:rotate(-45deg);
  transform-origin:center;
  white-space:nowrap;
}
.axis-chart-v10 .axis-title-v10{
  grid-column:2;
  margin:-4px 0 0 0;
  color:var(--muted);
  font-size:.78rem;
  font-weight:800;
  text-align:left;
}
.check-card,
.inline-check{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-height:48px;
  cursor:pointer;
  user-select:none;
}
.check-card input[type="checkbox"],
.inline-check input[type="checkbox"]{
  appearance:auto !important;
  -webkit-appearance:checkbox !important;
  width:20px !important;
  height:20px !important;
  min-width:20px !important;
  margin:0 !important;
  padding:0 !important;
  accent-color:var(--cyan);
  cursor:pointer;
  border-radius:4px;
}
.check-card span,
.inline-check span{font-weight:780;color:var(--text);}
.settings-row.holiday-row .inline-check{margin:0;align-self:center;}
.settings-row.holiday-row{align-items:center;}
.holiday-date-label{display:flex;flex-direction:column;gap:6px;margin-bottom:0;color:var(--text-soft);}
.holiday-date-label strong{color:var(--text);font-size:.92rem;}
:root[data-theme="dark"] .axis-chart-v10 .plot-v10{background:rgba(15,23,42,.72);}
:root[data-theme="dark"] .axis-chart-v10 .axis-labels-v10{color:#cbd5e1;}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .axis-chart-v10 .plot-v10{background:rgba(15,23,42,.72);}
  :root:not([data-theme="light"]) .axis-chart-v10 .axis-labels-v10{color:#cbd5e1;}
}
@media(max-width:760px){
  .axis-chart-v10{grid-template-columns:44px minmax(0,1fr);}
  .axis-chart-v10 .plot-v10{overflow-x:auto;}
  .axis-chart-v10 .bar{min-width:18px;}
}

/* v11: old-style hours chart: Y axis hours, X axis dates, visible grid */
.hours-chart-oldstyle{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:stretch!important;
  margin-top:12px!important;
}
.hours-y-axis{
  height:310px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  align-items:flex-end!important;
  padding:4px 0 54px!important;
  color:var(--text-soft)!important;
  font-size:.84rem!important;
  font-weight:850!important;
  line-height:1!important;
}
.hours-plot{
  height:310px!important;
  position:relative!important;
  border:1px solid var(--border)!important;
  border-radius:18px!important;
  background:var(--surface-soft)!important;
  overflow:hidden!important;
  padding:12px 12px 54px!important;
}
.hours-grid-lines{
  position:absolute!important;
  inset:12px 12px 54px 12px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  pointer-events:none!important;
  z-index:0!important;
}
.hours-grid-lines i{
  display:block!important;
  width:100%!important;
  border-top:1px solid rgba(100,116,139,.30)!important;
}
.hours-grid-lines::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:repeating-linear-gradient(to right, rgba(100,116,139,.18) 0, rgba(100,116,139,.18) 1px, transparent 1px, transparent 8.333%)!important;
  pointer-events:none!important;
}
.hours-bars{
  position:relative!important;
  z-index:1!important;
  height:100%!important;
  display:flex!important;
  align-items:end!important;
  gap:5px!important;
}
.hours-day{
  flex:1 1 0!important;
  min-width:12px!important;
  height:100%!important;
  position:relative!important;
  display:flex!important;
  align-items:end!important;
  justify-content:center!important;
}
.hours-bar-fill{
  display:block!important;
  width:100%!important;
  max-width:22px!important;
  min-height:3px!important;
  border-radius:4px 4px 0 0!important;
  background:linear-gradient(180deg,var(--cyan),#2563eb)!important;
  box-shadow:0 4px 10px rgba(37,99,235,.22)!important;
}
.hours-day em{
  position:absolute!important;
  left:50%!important;
  bottom:-42px!important;
  transform:translateX(-50%) rotate(-45deg)!important;
  transform-origin:center!important;
  color:var(--muted)!important;
  font-style:normal!important;
  font-size:.68rem!important;
  white-space:nowrap!important;
}
:root[data-theme="dark"] .hours-plot{background:rgba(15,23,42,.72)!important;}
:root[data-theme="dark"] .hours-grid-lines i{border-color:rgba(148,163,184,.25)!important;}
:root[data-theme="dark"] .hours-grid-lines::before{background:repeating-linear-gradient(to right, rgba(148,163,184,.14) 0, rgba(148,163,184,.14) 1px, transparent 1px, transparent 8.333%)!important;}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .hours-plot{background:rgba(15,23,42,.72)!important;}
  :root:not([data-theme="light"]) .hours-grid-lines i{border-color:rgba(148,163,184,.25)!important;}
  :root:not([data-theme="light"]) .hours-grid-lines::before{background:repeating-linear-gradient(to right, rgba(148,163,184,.14) 0, rgba(148,163,184,.14) 1px, transparent 1px, transparent 8.333%)!important;}
}
@media(max-width:760px){
  .hours-chart-oldstyle{grid-template-columns:42px minmax(0,1fr)!important;}
  .hours-plot{overflow-x:auto!important;}
  .hours-bars{min-width:680px!important;}
}


/* v12: Lionclaw-like mobile navigation, cleaner page heads and filtered chart period */
.mobile-nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface);
  color:var(--navy);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  padding:0;
  cursor:pointer;
  box-shadow:var(--shadow-card);
}
.mobile-nav-toggle span{width:20px;height:2px;border-radius:999px;background:currentColor;display:block;transition:transform .18s,opacity .18s;}
body.mobile-nav-open .mobile-nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.mobile-nav-open .mobile-nav-toggle span:nth-child(2){opacity:0}
body.mobile-nav-open .mobile-nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav-backdrop{display:none;position:fixed;inset:0;background:rgba(2,6,23,.42);backdrop-filter:blur(3px);z-index:75;}
body.mobile-nav-open .mobile-nav-backdrop{display:block;}
/* Entfernt die kleine eingekreiste TIME-Badge auf den Seiten. Header bleibt Officia | Time. */
.page-head .eyebrow{display:none!important;}
.page-head{margin-top:8px;}
.hours-plot{overflow-x:auto!important;}
.hours-bars{min-width:0!important;}
.hours-day{min-width:26px!important;}
.hours-grid-lines::before{background:repeating-linear-gradient(to right, rgba(100,116,139,.16) 0, rgba(100,116,139,.16) 1px, transparent 1px, transparent 44px)!important;}
:root[data-theme="dark"] .hours-grid-lines::before{background:repeating-linear-gradient(to right, rgba(148,163,184,.14) 0, rgba(148,163,184,.14) 1px, transparent 1px, transparent 44px)!important;}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .hours-grid-lines::before{background:repeating-linear-gradient(to right, rgba(148,163,184,.14) 0, rgba(148,163,184,.14) 1px, transparent 1px, transparent 44px)!important;}}
@media(max-width:900px){
  :root{--topbar-height:72px;}
  .container{width:min(100% - 24px,var(--max));}
  .mobile-nav-toggle{display:inline-flex;flex:0 0 44px;}
  .topbar-inner{gap:12px;}
  .topbar-left{gap:12px;}
  .brand-logo{height:28px;}
  .brand-text{font-size:1.22rem;}
  .brand-pipe{font-size:1.55rem!important;margin:0!important;}
  .brand-module{font-size:1rem!important;}
  .topbar-right{gap:7px;}
  .lang-switch{display:none;}
  .account-button{min-width:0;width:54px;padding:6px;}
  .account-button-text,.account-button-caret{display:none;}
  .account-avatar{width:40px;height:40px;}
  .app-shell{display:block;width:min(100% - 24px,var(--max));padding-top:18px;}
  .sidebar{
    position:fixed!important;
    top:88px!important;
    left:12px!important;
    bottom:12px!important;
    width:min(320px,calc(100vw - 24px))!important;
    z-index:90!important;
    transform:translateX(calc(-100% - 24px));
    transition:transform .22s ease;
    overflow:auto;
  }
  .sidebar.open{transform:translateX(0);}
  body.mobile-nav-open{overflow:hidden;}
  .content{width:100%;}
}
@media(max-width:760px){
  .hours-chart-oldstyle{grid-template-columns:42px minmax(0,1fr)!important;}
  .hours-bars{min-width:max-content!important;}
  .hours-day{min-width:38px!important;}
  .hours-day em{font-size:.64rem!important;}
}

/* Central Officia footer shared by all Officia products. Exact visual style copied from officia.ch public site. */
.footer { padding: 38px 0; border-top: 1px solid var(--slate-100, var(--theme-border-soft, rgba(15,23,42,.08))); color: var(--slate-500, var(--theme-muted, #607086)); font-size: 0.9rem; background: var(--white, var(--theme-surface, #fff)); }
.footer-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 28px; align-items: start; }
.footer-brand { display: inline-flex; margin-bottom: 10px; color: var(--navy, var(--theme-heading, #07152d)); font-size: 1.16rem; font-weight: 780; letter-spacing: -0.045em; text-decoration: none; }
.footer p { margin: 0 0 8px; line-height: 1.7; }
.footer-links { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 14px 22px; }
.footer a { color: inherit; text-decoration: none; }
.footer a:hover { color: var(--navy, var(--theme-heading, #07152d)); }
@media (max-width: 980px) { .footer-grid { grid-template-columns: 1fr; } .footer-links { justify-content: flex-start; } }
@media (max-width: 640px) { .footer { padding: 32px 0; } .footer-links { gap: 10px 16px; } }
