/* Agenda-inspired open timeline. Concept tokens: warm paper, ink, muted terracotta. */
:root{--paper:#faf9f6;--ink:#292a26;--muted:#807e77;--line:#e7e4dd;--accent:#a66250;--gutter:24px;--page:680px;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
body{min-height:100dvh}button{min-height:44px;transition:background .16s,color .16s; -webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:active{background:#eae5dc}header{max-width:var(--page);padding:40px var(--gutter) 12px;display:grid;grid-template-columns:1fr auto;gap:0 12px;align-items:center}header>div:first-child{display:contents}header small{grid-column:1;grid-row:1;font-size:13px;letter-spacing:3px;font-weight:600;color:var(--accent)}header h1{grid-column:1/-1;grid-row:2;font-size:28px;font-weight:600;letter-spacing:-.8px;line-height:1.3;margin:22px 0 8px}header p{grid-column:1/-1;grid-row:3;margin:0;color:var(--muted);font-size:14px;line-height:1.6}header>div:last-child{grid-column:2;grid-row:1;display:flex;flex-wrap:nowrap;max-width:none;gap:2px}header button{font-size:12px;white-space:nowrap;padding:8px 7px;color:var(--accent);border-radius:8px}.account-status{max-width:var(--page);padding:0 var(--gutter) 22px;font-size:12px;color:var(--muted);line-height:1.6}main{max-width:var(--page);padding:0 var(--gutter) 310px}#timeline{border-top:1px solid var(--line)}.entry{grid-template-columns:52px minmax(0,1fr) auto;gap:14px;align-items:center;min-height:90px;margin:0;padding:20px 0;border-bottom:1px solid var(--line)}.record-times{font-size:15px;line-height:1.5;gap:2px;text-align:left;padding:0;color:var(--ink);letter-spacing:-.3px}.record-content{min-height:48px;padding:2px 0 2px 16px;border-left-width:3px;gap:4px;align-self:center}.record-content .name{font-size:17px;line-height:1.5;font-weight:500}.record-note{font-size:13px;line-height:1.6;color:var(--muted)}.record-meta{min-height:44px;gap:0;max-width:120px}.record-meta .duration{font-size:11px;line-height:1.5;color:#68665e;white-space:normal;text-align:right;max-width:78px}.entry .delete{font-size:18px;color:#918d83;min-width:28px;min-height:44px;padding:4px}.record-content:hover{background:#f0ede6}#pending{display:grid;grid-template-columns:66px minmax(0,1fr) auto;align-items:center;gap:0;margin:0;border-left:0;border-bottom:1px solid var(--line);padding:22px 0}#pending small{font-size:12px;letter-spacing:0;color:var(--muted)}#pending p{font-size:15px;margin:0;line-height:1.6;font-variant-numeric:tabular-nums}#pending .time{font-size:11px;color:#68665e;text-align:right}.footnote{font-size:12px;color:var(--muted);line-height:1.7;margin:22px 0}.gap-row{border-color:#d4cec2;border-radius:8px;margin:14px 0;font-size:12px;line-height:1.6;color:#817562}#hint{font-size:12px;color:#77736b;background:#faf9f6e6;margin:0 0 12px;padding:6px 12px}#handle{width:64px;height:64px;border:2px solid #bd8875;background:#faf9f6e6;box-shadow:0 4px 20px #6d543014}#handle span{width:34px;height:34px;border:0;background:#ebe7e0;border-radius:50%}#click-select{color:#77736b;font-size:12px;padding:10px 18px}body.choosing #handle{background:#faf9f6bf}body.choosing #handle span{background:#e4dfd4aa}dialog{padding:24px;border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 70px #55473020;max-height:88dvh}dialog::backdrop{background:#302d2638}.dialoghead{gap:16px}.dialoghead h2{font-size:21px;font-weight:600;margin:0;line-height:1.5}.dialoghead>button{font-size:14px;color:var(--accent)}dialog p{color:#767167}dialog h3{font-size:16px;font-weight:550}.stats-tabs{margin:20px 0;padding:4px}.stats-tabs button{min-height:40px}.stats-nav input{min-height:44px;font-size:14px}#stats-summary strong{font-size:32px;letter-spacing:-.7px}.category input[type=text]{font-size:15px;min-height:44px}.category input[type=color]{height:36px;width:36px}.category button{min-width:30px}.save-note,#auth-submit{border-radius:8px;font-weight:500}textarea,input,select{outline-offset:2px}.empty{padding:40px 0;max-width:360px}.empty strong{font-size:23px;color:var(--ink);margin-bottom:8px}.empty>div{font-size:14px;color:var(--muted)}
@media(min-width:768px){header{padding-top:56px}header button{font-size:13px;padding:8px 12px}.entry{min-height:100px;grid-template-columns:64px minmax(0,1fr) auto;gap:20px}.record-times{font-size:16px}.record-content .name{font-size:18px}.record-meta .duration{max-width:none;font-size:12px}.record-meta{max-width:none;gap:8px}#pending{grid-template-columns:84px minmax(0,1fr) auto}.account-status{padding-bottom:26px}}
@media(max-width:360px){:root{--gutter:16px}header{gap:0 4px}header button{font-size:11px;padding:8px 5px}header small{font-size:12px;letter-spacing:1px}.entry{gap:10px;grid-template-columns:46px minmax(0,1fr) auto}.record-content{padding-left:11px}.record-content .name{font-size:16px}.record-meta .duration{max-width:55px}#pending{grid-template-columns:56px minmax(0,1fr) auto}#pending p{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* Compact brand stays readable beside the three local-mode actions. */
header small{letter-spacing:1px;white-space:nowrap}

/* Keep only the gesture handle visible, with no instructional captions. */
#hint,#click-select{display:none!important}
