:root{--navy:#10233f;--ink:#172b46;--muted:#748298;--edge:#e4eaf3;--bg:#f5f7fb;--card:#fff;--blue:#3369e8;--blue-weak:#eff4ff;--green:#167e63;--green-weak:#e7f6ef;--amber:#b87810;--amber-weak:#fff4df;--red:#bf4b4b;--red-weak:#fff1f1;--radius:18px;--shadow:0 3px 20px rgba(30,54,86,.035);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-size:14px}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}a{color:var(--blue)}.hidden{display:none!important}.layout{display:flex;min-height:100vh}.sidebar{width:254px;background:var(--navy);color:#eff5ff;min-height:100vh;position:sticky;top:0;flex-shrink:0;display:flex;flex-direction:column;padding:28px 16px}.brand{display:flex;gap:11px;align-items:center;margin:0 8px 52px}.brand b{font-size:18px;letter-spacing:-.4px}.brand small{font-size:10px;color:#9caec7;display:block;margin-top:3px;text-transform:uppercase;letter-spacing:1px}.brand-mark{display:flex;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0;background:linear-gradient(145deg,#5588fc,#3254cc);border-radius:12px;color:white;font-weight:800;letter-spacing:-2px;font-size:20px;box-shadow:0 5px 14px #071b3752}.brand-mark span{color:#adc6ff}.brand-mark.large{width:56px;height:56px;font-size:27px;margin:auto}.side-label{color:#7185a4;font-weight:800;letter-spacing:1.3px;font-size:10px;margin:0 14px 16px}.sidebar nav{display:grid;gap:5px}.nav-button{border:0;color:#b0c0da;padding:12px 15px;text-align:left;display:flex;align-items:center;gap:13px;background:transparent;border-radius:11px;font-weight:550}.nav-button.active{background:#294263;color:white}.nav-button:hover{background:#263d5a;color:white}.nav-icon{font-size:18px;width:21px;text-align:center;font-weight:500}.sidebar-bottom{margin-top:auto;border-top:1px solid #28415e;padding-top:20px;margin-left:7px;margin-right:7px}.connection-mini{font-size:12px;color:#a8bad2;display:flex;gap:7px;align-items:center;line-height:1.5}.logout-btn{border:0;background:none;color:#afc0da;padding:16px 0 0}.main-column{flex:1;min-width:0}.topbar{height:100px;background:#fff;border-bottom:1px solid var(--edge);display:flex;justify-content:space-between;align-items:center;padding:0 42px}.top-title h1{margin:0;font-size:23px;letter-spacing:-.7px}.top-title p{margin:5px 0 0;font-size:12px;color:var(--muted)}.top-actions{display:flex;gap:11px;align-items:center}.sync-indicator{border:1px solid var(--edge);border-radius:30px;padding:10px 15px;background:#fff;color:var(--muted);font-size:12px;font-weight:650}.sync-indicator.offline{background:var(--amber-weak);color:var(--amber)}.sync-indicator.pending{background:var(--blue-weak);color:var(--blue)}.sync-indicator.problem{background:var(--red-weak);color:var(--red)}.icon-button{background:var(--navy);color:white;width:40px;height:40px;border:0;border-radius:12px;font-size:25px;line-height:1}.page-content{max-width:1400px;padding:31px 42px 64px;margin:auto}.eyebrow{font-size:11px;font-weight:850;color:var(--muted);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:12px}.section-title{font-size:18px;letter-spacing:-.5px;margin:0}.page-header{display:flex;align-items:center;justify-content:space-between;margin:3px 0 21px;gap:12px}.page-header p{color:var(--muted);font-size:12px;margin:6px 0 0}.btn{border:1px solid var(--edge);background:#fff;color:var(--ink);padding:11px 17px;border-radius:10px;font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn.primary{background:var(--blue);color:white;border-color:var(--blue)}.btn.dark{background:var(--navy);color:white;border-color:var(--navy)}.btn.danger{color:var(--red);border-color:#f2d1d1}.btn.ghost{background:#f4f7fc;border:0}.btn.small{padding:7px 11px;font-size:11px}.btn.full{width:100%}.btn:hover:not(:disabled){filter:brightness(.97)}.button-row{display:flex;gap:8px;flex-wrap:wrap}.dashboard-top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px}.metric{background:var(--card);border:1px solid var(--edge);border-radius:var(--radius);padding:19px;min-height:113px;box-shadow:var(--shadow)}.metric .metric-label{display:flex;gap:8px;align-items:center;color:var(--muted);font-weight:600;font-size:12px}.metric .metric-value{font-size:27px;font-weight:800;letter-spacing:-1.2px;margin-top:13px}.metric .metric-note{color:var(--muted);font-size:11px;margin-top:4px}.metric .accent{font-size:17px}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:18px}.card{background:white;border:1px solid var(--edge);border-radius:var(--radius);box-shadow:var(--shadow);padding:23px;margin-bottom:18px;min-width:0}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:9px}.card-header h2{margin:0;font-size:16px;letter-spacing:-.3px}.card-header p{font-size:12px;color:var(--muted);margin:4px 0 0}.clock-card{background:linear-gradient(126deg,#172f52,#0f2340);color:white;min-height:235px;padding:26px}.clock-card .clock-top{display:flex;justify-content:space-between;align-items:center;color:#c2d4ec}.clock-card .clock-display{font-size:52px;letter-spacing:-2px;font-weight:750;font-variant-numeric:tabular-nums;margin:18px 0 6px}.clock-card .clock-sub{font-size:12px;color:#b0c5dd;margin-bottom:23px}.clock-card .btn{background:#fff;color:#173253;border:0}.clock-card .btn.soft{background:#35516f;color:white}.clock-card .btn.emergency{background:#e5b95e;color:#172435}.pill{border-radius:100px;padding:6px 10px;font-weight:700;display:inline-block;font-size:11px;white-space:nowrap}.pill.green{color:var(--green);background:var(--green-weak)}.pill.amber{color:var(--amber);background:var(--amber-weak)}.pill.blue{color:var(--blue);background:var(--blue-weak)}.pill.grey{color:#667487;background:#edf0f5}.pill.red{color:var(--red);background:var(--red-weak)}.dot{width:8px;height:8px;display:inline-block;border-radius:50%;background:#16b585;margin-right:5px}.entry-row{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid #f0f3f7}.entry-row:first-of-type{padding-top:0}.entry-row:last-child{border-bottom:0}.entry-icon{width:36px;height:36px;border-radius:11px;background:#eff4ff;display:flex;align-items:center;justify-content:center;color:var(--blue);font-size:17px;flex-shrink:0}.entry-text{flex:1;min-width:0}.entry-text strong{font-size:13px;display:block;overflow-wrap:anywhere}.entry-text small{display:block;color:var(--muted);margin-top:4px;font-size:11px}.entry-time{font-weight:750;font-variant-numeric:tabular-nums;font-size:12px;text-align:right}.entry-actions{display:flex;align-items:center;gap:4px}.mini-icon{border:0;background:none;color:#90a0b3;padding:5px;border-radius:5px}.mini-icon:hover{background:#f0f3f8;color:var(--blue)}.empty{padding:25px;text-align:center;border:1px dashed #dce3ed;border-radius:12px;color:var(--muted);font-size:12px;line-height:1.7}.empty .empty-big{font-size:30px;margin-bottom:9px}.mini-list{display:grid;gap:8px}.mini-alert{padding:12px 14px;border-radius:10px;background:#fff7e8;color:#9e6b17;font-size:12px;display:flex;gap:10px;align-items:center}.mini-alert.info{background:#edf3ff;color:#33599f}.mini-alert.success{background:#eaf8f0;color:#187454}.list-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.date-input,select,input,textarea{max-width:100%;padding:10px 11px;border-radius:10px;border:1px solid #d8e1ec;color:var(--ink);background:white;outline:none;font-size:13px}.date-input:focus,select:focus,input:focus,textarea:focus{border-color:#7697ee;box-shadow:0 0 0 3px #3369e81a}textarea{width:100%;min-height:100px;resize:vertical;line-height:1.5}.grow{flex:1}.table-wrap{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;text-align:left}.data-table th{font-size:10px;color:#93a0ae;letter-spacing:.7px;text-transform:uppercase;padding:12px;border-bottom:1px solid var(--edge);white-space:nowrap}.data-table td{border-bottom:1px solid #edf0f5;padding:12px;font-size:12px;vertical-align:middle}.data-table tr:last-child td{border:0}.data-table .muted{color:var(--muted)}.data-table td .strong{display:block;font-weight:750}.week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}.day-card{border:1px solid var(--edge);border-radius:13px;padding:12px;min-height:190px;background:#fff}.day-card.today{border-color:#97b1fa;background:#f8faff}.day-head{font-size:12px;font-weight:800}.day-date{font-size:11px;color:var(--muted);margin-top:3px}.day-label{font-size:11px;color:#63748c;line-height:1.5;margin-top:15px;white-space:pre-wrap;overflow-wrap:anywhere}.day-card .btn{margin-top:13px}.note-card{border:1px solid var(--edge);padding:15px;border-radius:12px;white-space:pre-wrap;margin-bottom:10px;background:#fff}.note-card .tiny-header{display:flex;justify-content:space-between;margin-bottom:9px}.note-card p{line-height:1.6;font-size:12px;margin:0}.text-muted{color:var(--muted)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.form-stack{display:grid;gap:14px}label{display:grid;gap:6px;font-size:12px;font-weight:700;color:#4c5d73}label input,label select,label textarea{width:100%;font-weight:400}.field-wide{grid-column:1 / -1}.dialog-backdrop{position:fixed;inset:0;background:#13223dbd;backdrop-filter:blur(4px);z-index:20;display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}.dialog{width:min(620px,100%);max-height:min(92vh,980px);overflow:auto;background:white;border-radius:20px;box-shadow:0 24px 90px #0a183b62}.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--edge)}.dialog-head h2{margin:0;font-size:19px}.dialog-body{padding:22px 24px}.dialog-footer{border-top:1px solid var(--edge);padding:17px 24px;display:flex;justify-content:flex-end;gap:10px}.dialog .dismiss{border:0;background:#f0f3f7;border-radius:8px;width:34px;height:34px;font-size:23px}.help{font-size:11px;color:var(--muted);line-height:1.5}.warning{font-size:12px;color:var(--amber);line-height:1.6}.checkline{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500}.checkline input{width:auto}.detail-box{background:#f7f9fc;border-radius:11px;padding:15px;line-height:1.6;font-size:12px}.dashboard-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.quick{border:1px solid var(--edge);background:#fff;border-radius:12px;text-align:center;padding:13px 6px;font-weight:700;font-size:12px}.quick span{display:block;font-size:22px;margin-bottom:7px}.quick:hover{background:#f5f8ff;border-color:#b8caff}.period-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.bar-grid{display:flex;align-items:end;height:145px;gap:12px;border-bottom:1px solid var(--edge);padding-top:10px}.bar-group{flex:1;display:flex;align-items:end;justify-content:center;gap:4px;height:100%}.bar{background:#9cb9fb;border-radius:5px 5px 0 0;min-height:2px;flex:1;max-width:35px}.bar.travel{background:#f3c57c}.bar-labels{display:flex;justify-content:space-around;margin-top:9px;color:var(--muted);font-size:10px}.legend{display:flex;gap:14px;font-size:11px;color:var(--muted);margin:15px 0}.legend i{display:inline-block;width:9px;height:9px;background:#9cb9fb;border-radius:2px;margin-right:5px}.legend i.travel{background:#f3c57c}.separator{border:0;border-top:1px solid var(--edge);margin:15px 0}.toast{border-radius:12px;background:var(--navy);color:#fff;padding:12px 17px;box-shadow:0 6px 22px #0d1c3755;font-size:12px;max-width:340px}#toast-root{position:fixed;bottom:18px;right:18px;z-index:50;display:grid;gap:10px}.login-screen{background:radial-gradient(ellipse at 20% 15%,#1e4273,#101f38 70%);height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{background:#fff;width:min(420px,100%);border-radius:24px;padding:35px;box-shadow:0 25px 80px #06172e80;text-align:center}.login-card h1{margin:15px 0 7px;font-size:27px}.login-card>p{font-size:13px;color:var(--muted);line-height:1.7}.login-card form{text-align:left;margin-top:25px}.login-card .subtle{margin-top:20px}.small{font-size:11px!important}.error-line{color:var(--red);font-size:12px;margin-top:12px}.mobile-nav{display:none}.info-row{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid var(--edge);font-size:12px}.info-row:last-child{border:0}.info-row>span{color:var(--muted)}.info-row strong{text-align:right}.section-spacer{margin-top:24px}.summary-pair{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.summary-pair .pill{margin-right:4px}.fileinput-note{font-size:10px;color:var(--muted)}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.text-right{text-align:right}@media(max-width:1250px){.dashboard-top{grid-template-columns:repeat(2,minmax(0,1fr))}.week-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:900px){.sidebar{width:70px;padding:20px 9px}.brand{margin:0 0 42px;justify-content:center}.brand>div:last-child,.side-label,.nav-button .nav-name,.sidebar-bottom{display:none}.nav-button{justify-content:center;padding:12px}.nav-button .nav-icon{font-size:22px}.topbar{padding:0 24px}.page-content{padding:23px 24px 55px}.dashboard-grid{grid-template-columns:1fr}}@media(max-width:650px){.layout{display:block}.sidebar{display:none}.topbar{height:80px;padding:0 17px}.top-title h1{font-size:19px}.top-title p{font-size:11px}.top-actions{gap:6px}.sync-indicator{padding:8px 10px;font-size:10px}.icon-button{width:34px;height:34px;font-size:20px}.page-content{padding:18px 14px 104px}.dashboard-top{gap:9px}.metric{min-height:100px;padding:15px;border-radius:14px}.metric .metric-label{font-size:10px}.metric .metric-value{font-size:23px}.metric .metric-note{font-size:10px}.dashboard-grid{gap:0}.card{padding:17px;margin-bottom:12px;border-radius:15px}.clock-card .clock-display{font-size:45px}.clock-card{min-height:220px;padding:19px}.dashboard-quick{gap:6px}.quick{padding:13px 4px;font-size:11px}.quick span{font-size:21px}.week-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.day-card{min-height:145px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--edge);height:calc(68px + env(safe-area-inset-bottom));padding:4px 8px env(safe-area-inset-bottom);z-index:10;justify-content:space-around;box-shadow:0 -5px 25px #1228470d}.mobile-tab{border:0;background:transparent;min-width:48px;color:#8492a6;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:10px;gap:3px;font-weight:700}.mobile-tab .nav-icon{font-size:21px}.mobile-tab.active{color:var(--blue)}#toast-root{bottom:83px;right:12px;left:12px}.toast{max-width:100%}.form-grid{grid-template-columns:1fr}.field-wide{grid-column:auto}.dialog-backdrop{align-items:flex-end;padding:0}.dialog{width:100%;max-height:94vh;border-radius:20px 20px 0 0;padding-bottom:env(safe-area-inset-bottom)}.dialog-head{padding:18px}.dialog-body{padding:18px}.dialog-footer{padding:15px 18px}.page-header{align-items:start}.page-header .btn{font-size:11px;padding:9px}.card-header h2{font-size:15px}}@media(max-width:360px){.dashboard-top{grid-template-columns:1fr 1fr}.metric{padding:12px}.metric .metric-value{font-size:21px}.clock-card .clock-display{font-size:38px}}


/* --- Working Time 0.2.1: appearance settings --- */
.theme-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:14px}
.theme-choice{border:1px solid var(--edge);border-radius:11px;background:var(--card);color:var(--ink);padding:13px 8px;font-size:13px;font-weight:700;cursor:pointer;min-width:0;display:flex;align-items:center;justify-content:center;gap:7px}
.theme-choice[aria-pressed="true"]{border-color:var(--blue);background:var(--blue-weak);color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}
.theme-choice:hover{border-color:var(--blue)}
.theme-choice:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.theme-description{color:var(--muted);font-size:12px;line-height:1.55}
@media(max-width:360px){.theme-choice{font-size:11px;padding:11px 3px;gap:3px}}

:root[data-theme="dark"]{
 --navy:#111e33; --ink:#e9f1ff; --muted:#a1b1c9; --edge:#32435b;
 --bg:#0b1423; --card:#17263a; --blue:#8eb0ff; --blue-weak:#213b61;
 --green:#78dbb7; --green-weak:#153e36; --amber:#f2c36c; --amber-weak:#42341f;
 --red:#ff9ca2; --red-weak:#462b36; --shadow:0 3px 20px rgba(0,0,0,.12);
 color-scheme:dark;
}
:root[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .metric,
:root[data-theme="dark"] .btn:not(.primary):not(.dark):not(.ghost),
:root[data-theme="dark"] .sync-indicator:not(.offline):not(.pending):not(.problem),
:root[data-theme="dark"] .day-card,
:root[data-theme="dark"] .note-card,
:root[data-theme="dark"] .quick,
:root[data-theme="dark"] .dialog,
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .mobile-nav {background:var(--card);color:var(--ink)}
:root[data-theme="dark"] .btn.dark{background:#2d4260;border-color:#2d4260;color:#fff}
:root[data-theme="dark"] .btn.ghost{background:#25364d;color:var(--ink)}
:root[data-theme="dark"] .btn.danger{color:var(--red);border-color:#784052}
:root[data-theme="dark"] .btn.primary{background:#426de2;border-color:#426de2;color:#fff}
:root[data-theme="dark"] .btn:hover:not(:disabled){filter:brightness(1.12)}
:root[data-theme="dark"] .sync-indicator.offline{background:var(--amber-weak);color:var(--amber)}
:root[data-theme="dark"] .sync-indicator.pending{background:var(--blue-weak);color:var(--blue)}
:root[data-theme="dark"] .sync-indicator.problem{background:var(--red-weak);color:var(--red)}
:root[data-theme="dark"] .icon-button{background:#34517d;color:white}
:root[data-theme="dark"] .sidebar{background:#0d1b2e}
:root[data-theme="dark"] .nav-button.active{background:#29476b;color:white}
:root[data-theme="dark"] .nav-button:hover{background:#213952;color:white}
:root[data-theme="dark"] .clock-card{background:linear-gradient(125deg,#1b3960,#132641);color:#fff;border-color:#385374}
:root[data-theme="dark"] .clock-card .btn:not(.soft):not(.emergency){background:#e5edfc;color:#152a44}
:root[data-theme="dark"] .clock-card .btn.soft{background:#395575;color:#fff}
:root[data-theme="dark"] .clock-card .btn.emergency{background:#e5b95e;color:#172435}
:root[data-theme="dark"] .pill.grey{background:#29384d;color:#adbed7}
:root[data-theme="dark"] .entry-row{border-color:var(--edge)}
:root[data-theme="dark"] .entry-icon{background:var(--blue-weak);color:var(--blue)}
:root[data-theme="dark"] .mini-icon{color:#afc0d5}
:root[data-theme="dark"] .mini-icon:hover{background:#293e5b;color:var(--blue)}
:root[data-theme="dark"] .empty{border-color:#455774;color:var(--muted)}
:root[data-theme="dark"] .data-table th{color:#afbdd2}
:root[data-theme="dark"] .data-table td{border-color:var(--edge)}
:root[data-theme="dark"] .day-card.today{background:#1d3355;border-color:#6589cc}
:root[data-theme="dark"] .day-label{color:#b4c4da}
:root[data-theme="dark"] .date-input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea{background:#111f32;color:var(--ink);border-color:#4b5f7b}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder{color:#9eb0c7}
:root[data-theme="dark"] label{color:#c9d6e8}
:root[data-theme="dark"] input:focus,
:root[data-theme="dark"] textarea:focus,
:root[data-theme="dark"] select:focus{border-color:#8eb0ff;box-shadow:0 0 0 3px #8eb0ff35}
:root[data-theme="dark"] .detail-box{background:#1d3047}
:root[data-theme="dark"] .dialog-backdrop{background:rgba(0,5,15,.8)}
:root[data-theme="dark"] .dialog .dismiss{background:#314259;color:var(--ink)}
:root[data-theme="dark"] .mini-alert{background:#40331c;color:#f5cf86}
:root[data-theme="dark"] .mini-alert.info{background:#1c3658;color:#b0cbff}
:root[data-theme="dark"] .mini-alert.success{background:#173d33;color:#a0e6c5}
:root[data-theme="dark"] .quick:hover{background:#243c5b;border-color:#759bdb}
:root[data-theme="dark"] .bar{background:#688cde}
:root[data-theme="dark"] .bar.travel{background:#c8a15a}
:root[data-theme="dark"] .legend i{background:#688cde}
:root[data-theme="dark"] .legend i.travel{background:#c8a15a}
:root[data-theme="dark"] .login-screen{background:radial-gradient(ellipse at 20% 15%,#182f4d,#091522 70%)}
:root[data-theme="dark"] .login-card{box-shadow:0 25px 80px #02071080}
:root[data-theme="dark"] .toast{background:#2e4563;color:#fff}
:root[data-theme="dark"] .mobile-tab{color:#a4b4ca}
:root[data-theme="dark"] .mobile-tab.active{color:#9cbbff}
:root[data-theme="dark"] .week-complete{background:#183b33!important;color:#88e2b9!important}
:root[data-theme="dark"] .week-incomplete{background:#293950!important;color:#9baec5!important}