@import url("../lib/plus-jakarta-sans/font.css");

/* Auth */
.auth-layout { display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); min-height:100vh; min-height:100dvh; }
.auth-panel { display:flex; flex-direction:column; justify-content:space-between; gap:32px; padding:48px; margin:24px; border-radius:var(--radius-panel); }
.auth-panel .brand { color:#fff; padding:0; font-size:24px; }
.auth-panel .brand-mark { width:44px; height:44px; background:rgb(255 255 255 / 12%); }
.auth-brand-content { max-width:480px; }
.auth-brand-content h2 { font-size:44px; line-height:1.2; margin-bottom:24px; overflow-wrap:anywhere; }
.auth-brand-content p,.auth-panel small { color:#dcefe2; }
.auth-benefits { list-style:none; padding:0; margin:32px 0 0; display:grid; gap:20px; }
.auth-benefits li { display:flex; align-items:flex-start; gap:12px; }
.auth-benefits .bi { color:#bce0c9; font-size:20px; flex-shrink:0; }
.auth-main { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; padding:100px 32px 48px; position:relative; background:var(--page-bg); }
.auth-top { position:absolute; top:24px; right:32px; display:flex; align-items:center; gap:10px; }
.auth-form { width:100%; max-width:480px; padding:32px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow); animation:auth-fade-up 360ms ease both; overflow-wrap:anywhere; }
.auth-form h1 { font-size:32px; }
.auth-form .form-text { display:block; color:var(--muted); }
.auth-form .btn-primary { min-height:46px; }
.auth-form .form-check { padding-top:4px; padding-bottom:4px; }
.auth-form hr { border-color:var(--border); opacity:1; }
.auth-security { max-width:520px; }
@keyframes auth-fade-up { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media(max-width:991px) {
  .auth-layout { grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr; }
  .auth-panel { margin:12px 12px 0; padding:24px; border-radius:var(--radius-panel); gap:16px; }
  .auth-panel .brand { font-size:22px; }
  .auth-brand-content { max-width:none; }
  .auth-brand-content h2 { font-size:28px; margin-bottom:12px; }
  .auth-brand-content p { margin:0; }
  .auth-benefits,.auth-panel>small { display:none; }
  .auth-main { justify-content:flex-start; padding:88px 16px 32px; }
  .auth-top { right:24px; top:20px; }
  .auth-form { padding:24px; }
  .auth-form h1 { font-size:28px; }
}
@media(prefers-reduced-motion:reduce) { .auth-form { animation:none; } .auth-page *, .auth-page *::before, .auth-page *::after { transition:none!important; animation:none!important; } }
:root {
  --green-50:#eff8f2; --green-100:#dcefe2; --green-200:#bce0c9; --green-300:#91d0ad; --green-400:#6cc497; --green-500:#359963; --green-600:#1f7a4a; --green-700:#1b5e3a; --green-800:#14532d; --green-900:#0f3d25; --green-950:#082719;
  --neutral-0:#fff; --neutral-50:#f7f7f7; --neutral-100:#f2f3f2; --neutral-200:#e3e7e4; --neutral-300:#cbd2cd; --neutral-400:#9ca79f; --neutral-500:#67736b; --neutral-600:#526057; --neutral-700:#39483e; --neutral-800:#27362c; --neutral-900:#18241d;
  --page-bg:#f2f3f2; --panel-bg:#f7f7f7; --surface:#fff; --input-bg:#f3f4f3; --text:#18241d; --muted:#67736b; --border:#e3e7e4; --control-border:#7a8a7f;
  --primary:#0f3d25; --primary-hover:#14532d; --primary-active:#082719; --on-primary:#fff; --tint:#eff8f2; --tint-text:#14532d;
  --success-bg:#edf8f0; --success-text:#205b35; --warning-bg:#fff4d9; --warning-text:#795209; --danger-bg:#ffedef; --danger-text:#a22e46; --info-bg:#eaf2fc; --info-text:#285b8b; --amber:#e0a325;
  --radius-panel:24px; --radius-card:20px; --radius-input:12px; --radius-pill:999px; --shadow:0 3px 14px rgb(24 36 29 / 3%); --shadow-hover:0 8px 22px rgb(24 36 29 / 8%);
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px;
  --font-sans:"Plus Jakarta Sans","Avenir Next",Avenir,"Trebuchet MS",sans-serif;
  --bs-body-font-family:var(--font-sans); --bs-body-color:var(--text); --bs-body-bg:var(--page-bg); --bs-primary-rgb:15,61,37; --bs-success-rgb:31,122,74;
}
[data-theme="dark"] {
  color-scheme:dark; --page-bg:#0b1510; --panel-bg:#111e17; --surface:#18271f; --input-bg:#203228; --text:#f0f5f1; --muted:#afbeb3; --border:#33483b; --control-border:#789482;
  --primary:#91d0ad; --primary-hover:#bce0c9; --primary-active:#6cc497; --on-primary:#082719; --tint:#223c2b; --tint-text:#bce0c9;
  --success-bg:#203c2a; --success-text:#bce0c9; --warning-bg:#3f341b; --warning-text:#f5d58b; --danger-bg:#40242b; --danger-text:#ffb7c5; --info-bg:#203348; --info-text:#b9d9fa;
  --shadow:0 3px 14px rgb(0 0 0 / 12%); --shadow-hover:0 8px 22px rgb(0 0 0 / 24%);
}
body { margin:0; background:var(--page-bg); color:var(--text); font-family:var(--font-sans); font-size:14px; line-height:1.6; letter-spacing:0; }
a { color:var(--tint-text); text-decoration:none; } a:hover { color:var(--primary-hover); }
h1 { font-size:32px; font-weight:700; line-height:1.25; } h2,h4 { font-size:18px; font-weight:700; } h3,h5 { font-size:16px; font-weight:700; }
small,.small { font-size:12px; } .text-muted { color:var(--muted)!important; } .text-primary { color:var(--primary)!important; }
:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.skip-link { position:fixed; left:16px; top:-80px; z-index:2000; background:var(--surface); padding:12px; } .skip-link:focus { top:12px; }
.app-shell { display:grid; grid-template-columns:220px minmax(0,1fr); gap:24px; padding:20px; max-width:1800px; margin:auto; }
.app-shell.public-shell { grid-template-columns:minmax(0,1fr); max-width:1400px; }
.app-sidebar { background:var(--surface); border-radius:var(--radius-panel); padding:26px 16px 18px; position:sticky; top:20px; height:calc(100dvh - 40px); overflow:auto; display:flex; flex-direction:column; }
.brand { display:flex; align-items:center; gap:9px; color:var(--text); font-size:17px; font-weight:700; padding:0 6px 24px; }
.brand-mark { background:var(--green-700); color:#fff; width:34px; height:34px; display:grid; place-items:center; border-radius:11px; font-size:20px; flex-shrink:0; }
.nav-label { font-size:10px; color:var(--muted); margin:14px 12px 8px; font-weight:700; text-transform:uppercase; }
.app-sidebar .nav { gap:3px; } .nav-link { color:var(--muted); border-radius:10px; padding:9px 12px; transition:background 180ms,color 180ms; min-height:44px; }
.app-sidebar .nav-link { display:flex; align-items:center; gap:11px; overflow-wrap:anywhere; }
.nav-link .bi { font-size:18px; flex-shrink:0; } .nav-link:hover { background:var(--input-bg); color:var(--text); } .nav-link.active { color:var(--text); font-weight:700; position:relative; }
.app-sidebar .nav-link.active:before { content:""; width:4px; background:var(--primary); position:absolute; top:10px; bottom:10px; left:-16px; border-radius:0 4px 4px 0; }
.sidebar-bottom { margin-top:auto; padding-top:20px; } .sidebar-download { padding:18px; border-radius:18px; } .sidebar-download h2 { font-size:15px; margin:10px 0 4px; } .sidebar-download p { color:#dcefe2; font-size:12px; }
.forest-surface,.card.forest-surface { color:#fff; background:repeating-radial-gradient(ellipse at 110% 120%,transparent 0 22px,rgb(188 224 201 / 8%) 23px 24px,transparent 25px 45px),linear-gradient(120deg,#0f3d25,#1b5e3a); }
.forest-surface .text-muted { color:#dcefe2!important; } .forest-surface a { color:#fff; } .forest-surface .btn-outline-secondary { color:#18241d; background:#fff; border-color:#91d0ad; }
.app-column { min-width:0; } .app-header { min-height:60px; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.header-page { color:var(--muted); font-weight:600; } .header-actions { display:flex; align-items:center; gap:10px; }
.avatar { background:#f7dfcc; color:#68442e; border-radius:50%; width:42px; height:42px; display:grid; place-items:center; font-weight:700; flex-shrink:0; }
.identity { line-height:1.4; min-width:0; overflow-wrap:anywhere; } .identity strong { display:block; } .identity small { color:var(--muted); }
.app-content { padding:28px; border-radius:var(--radius-panel); background:var(--panel-bg); min-height:calc(100dvh - 160px); }
.app-content>.container,.app-content>.container-fluid { max-width:100%; padding:0; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:25px; } .page-heading p { color:var(--muted); margin:6px 0 0; } .page-actions { display:flex; gap:10px; flex-wrap:wrap; }
.btn { border-radius:var(--radius-pill); padding:10px 18px; font-size:13px; font-weight:600; line-height:1.5; min-height:44px; display:inline-flex; justify-content:center; align-items:center; gap:7px; white-space:normal; transition:background 180ms,color 180ms,transform 180ms,box-shadow 180ms; }
.btn:hover { transform:translateY(-2px); box-shadow:var(--shadow-hover); } .btn:active { transform:none; }
.btn-primary,.btn-success { color:var(--on-primary); background:var(--primary); border-color:var(--primary); }
.btn-primary:hover,.btn-success:hover,.btn-primary:focus,.btn-success:focus { background:var(--primary-hover); color:var(--on-primary); border-color:var(--primary-hover); }
.btn-primary:active,.btn-success:active { background:var(--primary-active); color:var(--on-primary); border-color:var(--primary-active); }
.btn-outline-secondary,.btn-outline-primary,.btn-secondary,.btn-light { color:var(--text); background:var(--surface); border-color:var(--control-border); }
.btn-outline-secondary:hover,.btn-outline-primary:hover,.btn-secondary:hover,.btn-light:hover { background:var(--tint); color:var(--tint-text); border-color:var(--primary); }
.btn-danger { background:var(--danger-text); color:var(--surface); border-color:var(--danger-text); }
.btn-warning { background:var(--warning-bg); color:var(--warning-text); border-color:var(--warning-text); }
.btn-info { background:var(--info-bg); color:var(--info-text); border-color:var(--info-text); }
.btn-outline-success { color:var(--success-text); border-color:var(--success-text); } .btn-outline-danger { color:var(--danger-text); border-color:var(--danger-text); }
.btn-outline-warning { color:var(--warning-text); border-color:var(--warning-text); } .btn-outline-info { color:var(--info-text); border-color:var(--info-text); }
.btn-danger:hover,.btn-outline-danger:hover { background:var(--danger-bg); color:var(--danger-text); border-color:var(--danger-text); }
.btn-warning:hover,.btn-outline-warning:hover { background:var(--warning-bg); color:var(--warning-text); border-color:var(--warning-text); }
.btn-info:hover,.btn-outline-info:hover { background:var(--info-bg); color:var(--info-text); border-color:var(--info-text); }
.btn-outline-success:hover { background:var(--success-bg); color:var(--success-text); border-color:var(--success-text); }
.btn:disabled,.btn.disabled { opacity:.5; transform:none; box-shadow:none; } .btn-sm { padding:6px 12px; min-height:34px; }
.btn-icon { width:44px; height:44px; padding:0; flex-shrink:0; border:0; background:var(--surface); color:var(--text); border-radius:50%; } .btn-icon .bi { font-size:18px; }
.card { border:1px solid var(--border); border-radius:var(--radius-card); background:var(--surface); color:var(--text); box-shadow:var(--shadow); transition:transform 180ms,box-shadow 180ms; }
.card:hover { transform:translateY(-2px); box-shadow:var(--shadow-hover); } .card-body { padding:22px; } .card-header,.card-footer { background:transparent; border-color:var(--border); padding:18px 22px; }
.card-header:first-child { border-radius:var(--radius-card) var(--radius-card) 0 0; }
.stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-bottom:22px; } .stat-title { display:flex; justify-content:space-between; align-items:center; gap:5px; }
.stat-number { font-size:36px; font-weight:700; margin:12px 0 4px; line-height:1.2; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; } .stat-number small { font-size:17px; font-weight:400; }
.stat-duration { font-size:24px; } .trend { color:var(--muted); font-size:11px; margin:10px 0 0; } .forest-surface .trend { color:#dcefe2; }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:20px; margin-bottom:22px; }
.panel-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; } .panel-heading h2 { margin:0; }
.segmented { display:inline-flex; flex-wrap:wrap; border-radius:999px; padding:4px; background:var(--input-bg); gap:2px; } .segmented .btn { padding:5px 12px; min-height:34px; border:0; background:transparent; color:var(--muted); } .segmented .btn.active { background:var(--primary); color:var(--on-primary); }
.bar-chart { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); align-items:end; height:210px; gap:18px; padding:12px 10px 0; background:repeating-linear-gradient(to top,transparent 0 49px,var(--border) 50px,transparent 51px); }
.bar-column { height:100%; min-width:0; display:flex; flex-direction:column; justify-content:end; align-items:center; gap:8px; } .bar { width:min(100%,42px); height:var(--bar-height); border-radius:999px; background:var(--green-600); min-height:2px; } .bar-column span { font-size:11px; color:var(--muted); }
.chart-note { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:17px; color:var(--muted); font-size:12px; }
.donut-layout { display:flex; gap:24px; align-items:center; justify-content:center; flex-wrap:wrap; min-height:220px; } .donut { width:164px; height:164px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; }
.donut-center { width:126px; height:126px; border-radius:50%; background:var(--surface); display:flex; flex-direction:column; align-items:center; justify-content:center; } .donut-center strong { font-size:24px; }
.legend { list-style:none; padding:0; margin:0; font-size:12px; max-width:100%; } .legend li { margin:9px 0; display:flex; align-items:center; gap:8px; overflow-wrap:anywhere; } .legend strong { margin-left:auto; }
.color-dot { width:9px; height:9px; border-radius:50%; background:var(--project-color,var(--green-800)); display:inline-block; flex-shrink:0; } .project-name { display:flex; align-items:center; gap:9px; }
.timer { font-family:ui-monospace,"SFMono-Regular",Consolas,monospace; font-variant-numeric:tabular-nums; font-size:40px; line-height:1.3; margin:18px 0; overflow-wrap:anywhere; } .timer-controls { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.badge { border-radius:999px; padding:6px 10px; font-weight:500; white-space:normal; line-height:1.3; }
.badge-success,.alert-success,.badge.bg-success { color:var(--success-text)!important; background:var(--success-bg)!important; }
.badge-warning,.alert-warning,.badge.bg-warning { color:var(--warning-text)!important; background:var(--warning-bg)!important; }
.badge-danger,.alert-danger,.badge.bg-danger { color:var(--danger-text)!important; background:var(--danger-bg)!important; }
.badge-info,.alert-info,.badge.bg-info { color:var(--info-text)!important; background:var(--info-bg)!important; }
.badge-tag,.badge.bg-primary { color:var(--tint-text)!important; background:var(--tint)!important; }
.badge.bg-secondary,.badge.bg-light,.badge.bg-dark { color:var(--text)!important; background:var(--input-bg)!important; }
.bg-primary { background-color:var(--primary)!important; color:var(--on-primary); } .bg-success { background-color:var(--success-text)!important; }
.bg-warning { background-color:var(--warning-bg)!important; color:var(--warning-text); } .bg-info { background-color:var(--info-bg)!important; color:var(--info-text); }
.bg-danger { background-color:var(--danger-text)!important; } .bg-secondary { background-color:var(--muted)!important; } .bg-light,.bg-white { background-color:var(--surface)!important; } .bg-dark { background-color:var(--green-950)!important; }
[data-theme="dark"] .card.text-white:not(.forest-surface),[data-theme="dark"] .card-header.text-white { color:var(--text)!important; background-color:var(--surface)!important; }
.table { color:var(--text); --bs-table-bg:transparent; --bs-table-striped-bg:var(--panel-bg); --bs-table-striped-color:var(--text); --bs-table-hover-bg:var(--input-bg); --bs-table-hover-color:var(--text); border-color:var(--border); }
.table>:not(caption)>*>* { border-color:var(--border); padding:15px 14px; vertical-align:middle; } .table thead { color:var(--muted); font-size:12px; } .table th { font-weight:600; } .table caption { color:var(--muted); }
.table-warning { --bs-table-bg:var(--warning-bg); --bs-table-striped-bg:var(--warning-bg); --bs-table-hover-bg:var(--warning-bg); color:var(--warning-text); }
.table-responsive { overflow:auto; } .table-responsive .table { min-width:620px; }
.progress { height:7px; background:var(--input-bg); border-radius:999px; overflow:hidden; } .progress-bar { background:var(--green-600); border-radius:999px; animation:progress-in 650ms 150ms both; transform-origin:left; }
.form-control,.form-select { border-radius:var(--radius-input); background-color:var(--input-bg); border:1px solid var(--control-border); color:var(--text); padding:11px 14px; min-height:46px; font-size:14px; }
.form-control::placeholder { color:var(--muted); } .form-control:focus,.form-select:focus { color:var(--text); background-color:var(--input-bg); border-color:var(--primary); box-shadow:0 0 0 3px var(--tint); outline:2px solid var(--primary); outline-offset:1px; }
.form-control:disabled,.form-select:disabled { opacity:.6; background:var(--input-bg); } .form-control[readonly] { background:var(--input-bg); color:var(--text); opacity:1; }
.form-control.is-invalid { border-color:var(--danger-text); } .invalid-feedback,.text-danger { color:var(--danger-text)!important; } .form-label { font-weight:600; margin-bottom:8px; }
.form-check-input { background-color:var(--surface); border-color:var(--control-border); } .form-check-input:checked { background-color:var(--primary); border-color:var(--primary); } .form-check-input:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--tint); }
.input-group-text { background:var(--input-bg); color:var(--text); border-color:var(--control-border); border-radius:var(--radius-input); }
.alert { border:1px solid currentColor; border-radius:12px; font-size:13px; padding:12px 16px; } .alert-secondary,.alert-light,.alert-dark { color:var(--text); background:var(--input-bg); } .alert-primary { color:var(--tint-text); background:var(--tint); }
.dropdown-menu { background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-hover); padding:8px; } .dropdown-item { color:var(--text); border-radius:7px; padding:9px 12px; }
.dropdown-item:hover,.dropdown-item:focus,.dropdown-item.active { background:var(--tint); color:var(--tint-text); } .dropdown-divider { border-color:var(--border); }
.modal-content { border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:20px; } .modal-header,.modal-footer { border-color:var(--border); } .modal-backdrop { background:#082719; }
.list-group-item { background:var(--surface); color:var(--text); border-color:var(--border); } .list-group-item.active { background:var(--primary); border-color:var(--primary); color:var(--on-primary); } .list-group-item-action:hover { background:var(--tint); color:var(--tint-text); }
.page-link { background:var(--surface); color:var(--tint-text); border-color:var(--border); } .page-link:hover { background:var(--tint); color:var(--text); border-color:var(--border); } .page-item.active .page-link { background:var(--primary); border-color:var(--primary); color:var(--on-primary); } .page-item.disabled .page-link { background:var(--input-bg); color:var(--muted); border-color:var(--border); }
.nav-tabs { border-color:var(--border); } .nav-tabs .nav-link.active { background:var(--surface); color:var(--primary); border-color:var(--border); } .nav-pills .nav-link.active { background:var(--primary); color:var(--on-primary); }
.accordion-item,.accordion-button { background:var(--surface); color:var(--text); border-color:var(--border); } .accordion-button:not(.collapsed) { background:var(--tint); color:var(--tint-text); } .accordion-button:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--tint); }
[data-theme="dark"] .btn-close,[data-theme="dark"] .accordion-button::after { filter:invert(1) grayscale(100%); }
[data-theme="dark"] .form-select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23afbeb3' viewBox='0 0 16 16'%3E%3Cpath d='m2 5 6 6 6-6'/%3E%3C/svg%3E"); }
.app-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:20px 4px 0; color:var(--muted); font-size:11px; }
.public-navigation { display:flex; gap:16px; flex-wrap:wrap; }
[hidden] { display:none!important; }
.stagger-1 { --delay:50ms; } .stagger-2 { --delay:100ms; } .stagger-3 { --delay:150ms; } .stagger-4 { --delay:200ms; } .stagger-5 { --delay:250ms; }
.dashboard-grid>* { min-width:0; }
.dashboard-empty { min-height:220px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--muted); }
.dashboard-empty .bi { font-size:40px; color:var(--primary); } .dashboard-empty p { margin:0; }
.legend { flex:1; min-width:160px; } .legend li strong { white-space:nowrap; padding-left:12px; }
.timer-card .timer { margin:12px 0; } .timer-card .timer-details h5 { line-height:1.6; }
.timer-controls .btn-icon { background:rgb(255 255 255 / 14%); color:#fff; border:1px solid #91d0ad; }
.timer-controls .btn-icon.stop { background:#fff; color:var(--green-900); }
.stat-title { min-height:44px; align-items:flex-start; font-weight:500; }
.public-shell .app-header { flex-wrap:wrap; }
.mobile-only { display:none; } .reveal { opacity:1; animation:fade-up .35s ease both; animation-delay:var(--delay,0ms); }
.time-entry-toolbar>* { min-width:0; max-width:100%; }
.time-entry-filters { max-width:100%; }
.time-entry-filters>div { min-width:0; }
.timetable-container { max-width:100%; }
.project-chip { display:inline-flex; align-items:center; gap:8px; max-width:100%; padding:5px 10px; border-radius:var(--radius-pill); background:var(--input-bg); color:var(--text); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.project-chip-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:var(--project-color,var(--neutral-400)); }
.running-card { border:0; border-radius:20px; }
.running-card:hover { transform:none; }
.running-card-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; margin-bottom:20px; }
.running-card-details { flex:1 1 180px; min-width:0; }
.tracking-label { display:flex; align-items:center; gap:8px; color:#dcefe2; font-size:13px; margin:0 0 12px; }
.tracking-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:var(--green-400); animation:tracking-pulse 2s ease-in-out infinite; }
.is-on-break .tracking-dot { background:var(--amber); animation:none; }
.running-card .project-chip { color:#fff; background:rgb(255 255 255 / 12%); font-size:14px; }
.tracking-meta { display:block; color:#dcefe2; font-size:12px; margin:10px 0 0; }
.running-card-clock { min-width:0; max-width:100%; text-align:right; }
.tracking-timer { display:block; color:#fff; font-size:44px; font-weight:600; font-variant-numeric:tabular-nums; line-height:1.3; overflow-wrap:anywhere; }
.tracking-break-timer { color:#f5d58b; font-variant-numeric:tabular-nums; }
.tracking-description { overflow-wrap:anywhere; margin:0 0 16px; }
.tracking-comment .input-group { flex-wrap:nowrap; }
.tracking-comment .form-control { background:rgb(255 255 255 / 10%); color:#fff; border-color:rgb(255 255 255 / 45%); resize:vertical; min-width:0; }
.tracking-comment .form-control::placeholder { color:#dcefe2; }
.tracking-comment .form-control:focus { background:rgb(255 255 255 / 16%); border-color:#bce0c9; outline-color:#bce0c9; box-shadow:none; }
.tracking-comment .tracking-save { border-radius:0 12px 12px 0; color:#fff; background:rgb(255 255 255 / 16%); border:1px solid rgb(255 255 255 / 45%); flex-shrink:0; transform:none; }
.tracking-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:10px; margin-top:18px; }
.tracking-action-secondary { background:rgb(255 255 255 / 10%); color:#fff; border-color:rgb(255 255 255 / 60%); }
.tracking-action-primary { background:#fff; color:var(--green-900); border-color:#fff; }
.tracking-action-secondary:hover,.tracking-save:hover { color:#fff; background:rgb(255 255 255 / 22%); border-color:#fff; }
.tracking-action-primary:hover { color:var(--green-900); background:#dcefe2; border-color:#dcefe2; }
.running-card :focus-visible { outline-color:#bce0c9; }
.table .running-entry-row { --bs-table-bg:var(--tint); --bs-table-striped-bg:var(--tint); --bs-table-accent-bg:var(--tint); color:var(--text); }
.running-status { display:inline-flex; align-items:center; gap:6px; background:var(--success-bg); color:var(--success-text); border-radius:var(--radius-pill); padding:4px 9px; font-size:12px; white-space:nowrap; }
.running-status::before { content:""; width:6px; height:6px; background:var(--green-500); border-radius:50%; }
.entry-actions { display:flex; flex-wrap:wrap; gap:6px; }
.entry-actions form { margin:0; }
.entry-actions .btn { min-height:34px; }
@keyframes tracking-pulse { 50% { opacity:.45; } }
.company-area h1,.company-area h2,.company-area h5 { overflow-wrap:anywhere; }
.company-stats .card { height:100%; }
.company-stat-icon { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; border-radius:10px; }
.company-icon-neutral,.company-status-offline { background:var(--input-bg); color:var(--text); }
.card.company-stat-hero { background:var(--green-900); color:#fff; }
.company-stat-hero .company-stat-icon { background:var(--green-800); color:#fff; }
.company-stat-hero small { color:var(--green-100); }
.company-icon-button { width:34px; padding:6px; }
.company-area .entry-actions { align-items:center; }
.company-area code { color:var(--tint-text); overflow-wrap:anywhere; }
.company-area .page-heading>div { min-width:0; }
.company-area .font-monospace { font-family:ui-monospace,"SFMono-Regular",Consolas,monospace; font-size:.9rem; }
.company-area .card-header { color:var(--text); }
.company-area .card-header>.d-flex { flex-wrap:wrap; gap:12px; }
.company-area .card-body,.company-area .alert { overflow-wrap:anywhere; }
.company-area .form-text { color:var(--muted); }
.company-area .page-actions { justify-content:flex-end; }
@media(max-width:575px) { .running-card-heading { align-items:flex-start; gap:12px; } .running-card-clock { text-align:left; width:100%; } .tracking-timer { font-size:40px; } .tracking-actions { flex-direction:column; } .tracking-actions form,.tracking-actions .btn { width:100%; } }
@media(max-width:575px) { .time-entry-filters { width:100%; } .time-entry-filters>div { flex:1 1 100%; } .time-entry-filters .form-control { width:100%; min-width:0; } }
@keyframes fade-up { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } } @keyframes progress-in { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@media(min-width:992px) { .app-sidebar.offcanvas { visibility:visible; transform:none; position:sticky; z-index:auto; border:0; width:auto; } .app-sidebar .offcanvas-header { display:none; } }
@media(max-width:1199px) { .stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .identity { display:none; } .dashboard-grid { grid-template-columns:minmax(0,1fr); } }
@media(max-width:991px) { .app-shell { display:block; padding:16px; } .app-sidebar { position:fixed; top:0; height:100dvh; border-radius:0 24px 24px 0; width:280px!important; padding:22px 18px; } .app-sidebar .offcanvas-header { padding:0 0 12px; } .mobile-only { display:inline-flex; } .app-header { margin-bottom:16px; } .app-content { padding:24px; } }
@media(max-width:575px) { .app-shell { padding:10px; } .app-header { gap:8px; } .header-page { display:none; } .header-actions { gap:6px; margin-left:auto; } .header-language { padding:8px 12px; } .app-content { padding:20px 16px; border-radius:20px; } .page-heading { align-items:flex-start; flex-direction:column; gap:16px; } h1 { font-size:28px; } .page-actions { width:100%; } .stat-grid { gap:12px; } .card-body { padding:18px; } .stat-number { font-size:28px; } .stat-duration { font-size:20px; } .dashboard-grid { grid-template-columns:1fr; } .bar-chart { gap:8px; height:180px; } .panel-heading { flex-wrap:wrap; } .timer { font-size:36px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } .reveal { opacity:1; transform:none; } .card:hover,.btn:hover { transform:none; } }