/* WorkLog 0.2 · monochrome / iOS-inspired visual refresh.
   Presentation only: API, D1, authentication and payment logic are unchanged. */
:root{color-scheme:dark;--bg:#090a0c;--paper:#1c1c1f;--ink:#f5f5f7;--ink2:#d5d5db;--muted:#92929b;--stroke:#323237;--nav:#0b0c0f;--navmuted:#999aa4;--mint:#4c81ff;--mintdark:#b3c6ff;--mintwash:#1b2842;--bluewash:#22242a;--amber:#f8c568;--amberbg:#362d1c;--red:#ff8186;--redbg:#3b2024;--shadow:none;--accent:#4c81ff}
html{background:var(--bg)}body{background:var(--bg)}
.brand-symbol{background:#171a22;color:#fff;border:1px solid #373a43;border-radius:13px;letter-spacing:-4px;font-size:21px}
.brand-symbol:before{content:'WL';font-weight:850;letter-spacing:-3px}.brand-symbol{font-size:0!important}
.brand-symbol:before{font-size:21px}
.sidebar{background:#0c0d11;border-right:1px solid #26262b}
.brand small,.navgroup{color:#777985}.navlink{color:#a3a4ae;font-weight:550}.navlink:hover,.navlink:focus-visible{background:#212329;color:#fff}.navlink.active{color:#fff;background:#242630}.navlink.active svg{color:var(--accent)}
.navbottom{border-color:#282a2e}.avatar{background:#282c35;color:#fff}.logout{color:#c9c9d0;border-color:#36373d}
.topbar{background:#111215;border-color:#27282c}.breadcrumb,.online-indicator{color:#a5a5b0}.top-avatar{background:#292b31;border-color:#36383f;color:#fff}
.dot{background:#4bcb95;box-shadow:none}.dot.offline{background:#eda865;box-shadow:none}
.content{max-width:1450px}.eyebrow{color:#9b9ca5;letter-spacing:1.8px}.page-head h2{letter-spacing:-1.1px;font-weight:750}.lead{color:#9c9ca6}
.btn{background:#24252b;color:#f6f6f8;border-color:#393a43;box-shadow:none;border-radius:12px;transition:background .15s ease,border-color .15s ease}
.btn:hover{background:#30313a;border-color:#53545e;transform:none}.btn.primary,.btn.mint{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover,.btn.mint:hover{background:#6594ff;border-color:#6594ff}.btn.ghost{background:transparent}
.stat,.panel{background:#1b1c20;border:1px solid #303136;border-radius:21px;box-shadow:none}.stat{min-height:148px}.stat-title,.panel-head p{color:#adadb7}.stat-icon{background:#2a2b31;color:#d8d9dd;border-radius:11px}.stat strong{font-weight:750;font-variant-numeric:tabular-nums}.stat small{color:#94949d}
.panel-head h3{font-weight:750}.panel-link{color:#83a9ff}.panel-link:hover{color:#b2c8ff}
.table th{color:#9fa0a9;border-color:#34353b}.table td{color:#c6c6cf;border-color:#303137}.table td strong,.money{color:#fff}.table tbody tr:hover{background:#25262b}.cell-sub{color:#a4a4ad}
.status{background:#303137;color:#c4c5cc}.status.paid,.status.active{background:#26362f;color:#9cdec0}.status.pending,.status.partial{background:#39301f;color:#f6d28d}.status.overdue,.status.paused{background:#41262b;color:#ffa4a7}.status.unbilled,.status.completed{background:#303137;color:#c4c5cc}
.empty{color:#9798a3}.empty strong{color:#eeeef2}.empty svg{color:#797b86}.list-item{border-color:#34353b}.item-label small,.small-note{color:#a2a2ad}.callout{background:#222329;border:1px solid #373840;color:#c5c6d0}.callout strong{color:#f5f5f7}.meter{background:#34353a}.meter>div{background:#81858e}
.chip{background:#25262b;border-color:#393940;color:#d3d4dd}.chip.selected{background:#e8e8ed;border-color:#e8e8ed;color:#111216}
.control{background:#292a30;border-color:#41424a;color:#f8f8fa;border-radius:12px;font-size:16px}.control::placeholder{color:#888994}.control:focus{border-color:#769dff;box-shadow:0 0 0 3px #4c81ff30}.control:disabled{background:#222329;color:#999aa5}.field label{color:#ceced7}.checkline input,.inline-checkbox{accent-color:var(--accent)}
.modal-backdrop{background:#000b;backdrop-filter:blur(8px)}.modal{background:#1d1e23;border:1px solid #3b3c44;color:#f6f6fa;box-shadow:0 30px 100px #000b;border-radius:24px}.iconbutton{background:#303138;color:#eee}.hint{background:#292a30;color:#bdbdc8}.timer-card{background:#1b1c20;border:1px solid #393940}.timer-card small{color:#a5a7af}.timer-card .btn{background:var(--accent);border-color:var(--accent);color:#fff}
.login{background:#0c0d10}.login-left{background:#121318;border-right:1px solid #292a30}.login-left p{color:#b2b2bc}.login-left h1 em{color:#93b0ff}.login-left footer{color:#777985}.login-btn{background:var(--accent);color:#fff}.login-btn:hover{background:#6594ff}.login-btn.secondary{background:#2b2d34;color:#fff}.feature{color:#c6c6cf}.feature svg{color:#9a9ca4}.offline-banner{background:#39301f;color:#ffd69b}
#toast .toast-message{background:#34353c;color:#fff;box-shadow:0 12px 40px #0008}#toast .toast-message.error{background:#682d35}
.pill-info{background:#303137;color:#b5b6c0}.mobile-more{background:#23242a;border-color:#363740}.mobile-more button{background:#23242a;color:#fff}.mobile-more button:hover{background:#353640}
/* A compact, meaningful first action instead of decorative graphs. */
.mobile-hero{display:none}
@media(max-width:750px){
  .topbar{background:#090a0c;border-bottom:0;height:56px;padding:0 20px}.breadcrumb{font-size:11px;color:#92939b}.breadcrumb b{color:#d6d7df}.topright{gap:10px}.online-indicator{font-size:0}.dot{width:7px;height:7px}.top-avatar{background:#22242a;border-color:#3b3d45}
  .content{padding:16px 17px calc(108px + env(safe-area-inset-bottom))}.page-head{gap:13px;margin-bottom:20px}.page-head h2{font-size:29px;line-height:1.12;letter-spacing:-.8px}.page-head .eyebrow{font-size:10px;margin-bottom:9px}.page-head .lead{font-size:13px;line-height:1.55}
  .page-actions{width:100%}.page-actions>.btn.primary{width:100%;min-height:49px;font-size:14px}
  .mobile-hero{display:flex;background:var(--accent);color:#fff;border-radius:15px;border:0;width:100%;padding:16px 18px;align-items:center;justify-content:center;gap:10px;font-size:15px;font-weight:750;margin-bottom:19px}.mobile-hero svg{height:20px;width:20px}
  .stats{gap:11px;margin-bottom:16px}.stat{border-radius:19px;padding:17px 15px;min-height:131px}.stat-top{align-items:start}.stat-title{font-size:12px;line-height:1.35}.stat-icon{width:30px;height:30px;background:#292a2f}.stat strong{font-size:23px;margin-top:22px;letter-spacing:-.7px;overflow-wrap:anywhere}.stat small{font-size:10px;line-height:1.4;display:block;margin-top:4px}
  .panel{border-radius:20px;padding:19px 17px;margin-bottom:15px}.panel-head h3{font-size:15px}.panel-head p{line-height:1.45}.grid-2{gap:0}
  .mobile-nav{background:#131418ec;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:#33343c;box-shadow:0 -10px 30px #0005;padding:11px 7px calc(9px + env(safe-area-inset-bottom))}.mobile-link{color:#9697a2;gap:6px;font-size:10px;min-width:52px}.mobile-link.active{color:#81a9ff}.mobile-link svg{height:22px;width:22px}.mobile-more{bottom:calc(75px + env(safe-area-inset-bottom));right:14px}
  .modal-backdrop{padding:0;align-items:end}.modal{width:100%;max-height:92dvh;border-radius:24px 24px 0 0;padding:25px 20px calc(25px + env(safe-area-inset-bottom));border-bottom:0}.form-foot{position:sticky;bottom:-25px;background:#1d1e23;padding:13px 0 8px}
  .login-left{min-height:230px}.login-left h1{font-size:38px}.login-right{padding:30px 22px 55px}.login-box h2{font-size:30px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* WorkLog v0.3.1: exact supplied logo, mint brand support, mobile overflow containment. */
:root { --accent:#4F7CFF; --brand-mint:#74EAC4; --mint:#74EAC4; --brand-grey:#98989F; }
html,body,#app,.shell,.main,.content { max-width:100%; min-width:0; }
/* The grid child must be allowed to shrink below its wide table min-content size. */
.grid-2 { grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); }
.grid-2 > *, .stats > *, .panel, .panel-head, .panel-head > div { min-width:0; }
.table-wrap { width:100%; max-width:100%; min-width:0; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
.panel .table { width:100%; }
.content { width:100%; }
/* Brand mark is used in desktop navigation, login and loading states. */
.brand-symbol { background: #0A0A0B url('/icon-192.png') center/cover no-repeat !important; border:0; border-radius:13px; padding:0; color:transparent; font-size:0!important; letter-spacing:0; overflow:hidden; flex-shrink:0; }
.brand-symbol::before { display:none!important; content:none!important; }
/* Mint is a supporting brand accent, not a replacement for blue primary actions. */
.eyebrow { color:var(--brand-mint); }
.panel-link { color:var(--brand-mint); }
.panel-link:hover { color:#A2F2DB; }
.dot { background:var(--brand-mint); }
.status.paid, .status.active { color:#A2F2DB; background:#213A34; }
.btn.primary,.btn.mint,.mobile-hero,.login-btn { background:#4F7CFF; border-color:#4F7CFF; }
.btn.primary:hover,.btn.mint:hover,.login-btn:hover { background:#668EFF; border-color:#668EFF; }
.navlink.active svg { color:#4F7CFF; }
@media(max-width:1100px) { .grid-2 { grid-template-columns:minmax(0,1fr); } }
@media(max-width:750px) {
  html, body { width:100%; overflow-x:clip; }
  .shell,.main,.content { width:100%; min-width:0; }
  .content { overflow-x:clip; }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stat { min-width:0; }
  .stat strong { overflow-wrap:anywhere; word-break:normal; }
  .grid-2 { display:grid; grid-template-columns:minmax(0,1fr); }
  .panel { min-width:0; max-width:100%; overflow:hidden; }
  .panel-head { flex-wrap:wrap; }
  .table-wrap { overflow-x:auto; touch-action:pan-x pan-y; }
  /* Brand mark beside the Workspace breadcrumb in the mobile top bar. */
  .topbar .breadcrumb { display:flex; align-items:center; gap:8px; min-width:0; }
  .topbar .breadcrumb::before { content:''; display:block; flex:0 0 29px; height:29px; border-radius:8px; background:#0A0A0B url('/icon-192.png') center/cover no-repeat; }
  .mobile-link.active { color:#4F7CFF; }
}

/* WorkLog v0.3.2: floating dock; only the dock floats, not document content. */
@media(max-width:750px){
 .mobile-nav{position:fixed!important;left:14px!important;right:14px!important;bottom:calc(12px + env(safe-area-inset-bottom))!important;width:auto!important;max-width:520px!important;margin:0 auto!important;padding:9px 7px!important;border:1px solid #38383A!important;border-radius:25px!important;background:rgba(28,28,30,.95)!important;box-shadow:0 10px 35px #000b!important;z-index:15!important;justify-content:space-around;}
 .mobile-link{flex:1;min-width:0!important;border-radius:15px;}
 .mobile-link.active{color:#4F7CFF!important;background:#2C2C2E;}
 .mobile-more{bottom:calc(90px + env(safe-area-inset-bottom))!important;right:18px!important;max-width:calc(100vw - 36px);border-radius:18px!important;z-index:16!important;}
 .content{padding-bottom:calc(135px + env(safe-area-inset-bottom))!important;}
 .table-wrap{max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;}
 .panel,.grid-2,.main,.content{min-width:0;max-width:100%;}
}
.btn.danger{color:#ff9296;border-color:#64353c;background:#301e23}
.btn.danger:hover{background:#47242a}

/* v0.3.3: Archive controls and narrow-screen safety. */
.toolbar {display:flex; flex-wrap:wrap; align-items:center; gap:10px; min-width:0;}
.toolbar .control {max-width:100%; min-width:0;}
.row-actions {display:flex; gap:6px; align-items:center; flex-wrap:nowrap;}
@media(max-width:750px) {
 .toolbar .control {flex:1 1 180px;}
 .toolbar .btn {flex:0 0 auto;}
 .table-wrap {max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain;}
 .panel {min-width:0; overflow:hidden;}
}

/* WorkLog v0.3.4 account-privacy panel */
.account-privacy{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:16px 0 20px;padding:20px;background:var(--surface,#1C1C1E);border:1px solid var(--border,#38383A);border-radius:18px;min-width:0;overflow-wrap:anywhere}
.account-privacy h3,.account-privacy p{flex-basis:100%;margin:0}
.account-privacy p{color:var(--text-secondary,#98989F);line-height:1.55}
.account-privacy .btn{max-width:100%;white-space:normal;text-align:center}
@media(max-width:600px){.account-privacy{padding:16px}.account-privacy .btn{width:100%;justify-content:center}}