:root { color-scheme: light; --ink:#28314c; --muted:#687390; --line:#dbe0f1; --panel:rgba(255,255,255,.72); --panel-solid:#f9faff; --violet:#535d9d; --accent:#e9b95b; --shadow:0 20px 60px rgba(71,80,139,.13); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 79% 14%,#e9e8fa 0,#d6d9f2 38%,transparent 65%),linear-gradient(145deg,#e5eaf8,#bfc7e8 75%,#c5c7e1); }
body::before { content:"";position:fixed;inset:0;pointer-events:none; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed;opacity:.48; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #8f9ce4;outline-offset:2px; }
.hidden { display:none!important; }
.auth-screen { min-height:100vh;display:grid;place-items:center;padding:20px; }
.auth-card { width:min(440px,100%);padding:38px;border:1px solid #fff;border-radius:30px;background:var(--panel);box-shadow:var(--shadow);backdrop-filter:blur(25px); }
.auth-brand { text-align:center;margin-bottom:24px; }
.auth-brand img { width:75px;height:75px;border-radius:18px;box-shadow:0 12px 24px #6370a840; }
.auth-brand h1 { margin:10px 0 5px;font-size:31px;letter-spacing:.04em; }
.auth-brand p { margin:0;color:var(--muted); }
.auth-tabs { display:flex;background:#e6e9f6;border-radius:13px;padding:4px;margin-bottom:22px; }
.auth-tabs button { flex:1;border:0;background:transparent;border-radius:10px;padding:10px;color:var(--muted);font-weight:700; }
.auth-tabs button.active { background:#fff;color:var(--violet);box-shadow:0 3px 12px #7882ae30; }
label { display:block;font-size:13px;font-weight:700;color:#465273; }
input,select,textarea { width:100%;border:1px solid #cbd3e9;border-radius:12px;background:#fff;color:var(--ink);padding:11px 13px;margin-top:6px; }
textarea { min-height:92px;resize:vertical; }
input[type="checkbox"] { width:auto;margin:0;accent-color:var(--violet); }
.field { margin-bottom:14px; }
.field small { color:var(--muted);font-weight:400; }
.button { border:1px solid #d9def0;border-radius:11px;background:#fff;color:var(--ink);padding:9px 13px;font-weight:700;min-height:38px;box-shadow:0 3px 10px #6c79a316;transition:transform .16s,background .16s,box-shadow .16s; }
.button:hover:not(:disabled) { transform:translateY(-1px);background:#f8f8ff;box-shadow:0 6px 16px #6c79a323; }
.button.primary { color:#fff;background:#4f5a9b;border-color:#4f5a9b; }
.button.primary:hover:not(:disabled) { background:#414b8c; }
.button.soft { background:#eef0fa; }
.button.danger { color:#ae4c66;background:#fff5f7;border-color:#f5dce4; }
.button.gold { background:#fff4d9;border-color:#f6dfae;color:#775b23; }
.button.icon { width:36px;min-height:36px;padding:5px;text-align:center; }
.button.small { padding:5px 9px;min-height:30px;font-size:12px; }
.full { width:100%; }
.app-shell { display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh;position:relative; }
.sidebar { padding:18px 14px 22px;min-height:100vh;background:rgba(246,247,255,.64);border-right:1px solid #ffffffa3;backdrop-filter:blur(20px);display:flex;flex-direction:column;gap:18px; }
.side-brand { display:flex;align-items:center;gap:10px;padding:5px 7px;font-size:21px;font-weight:850;letter-spacing:.04em; }
.side-brand img { width:35px;height:35px;border-radius:9px; }
.side-heading { font-size:11px;font-weight:800;color:#7b85a1;letter-spacing:.13em;text-transform:uppercase;padding:0 9px;margin:0 0 7px; }
.side-group { min-height:0;overflow:auto; }
.side-item { display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:11px 12px;border:0;border-radius:11px;color:#59627c;background:transparent;font-weight:650; }
.side-item:hover,.side-item.active { background:#5d6ac3;color:white; }
.side-item .count { margin-left:auto;font-size:11px;opacity:.76; }
.side-item .symbol { width:21px;text-align:center;font-size:18px; }
.side-star { width:100%;text-align:left;border:0;background:transparent;padding:10px 11px;border-radius:10px;color:#35415c; }
.side-star.active { background:#075ed2;color:white; }
.side-star:hover:not(.active) { background:#e4e9f8; }
.side-star strong { display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.side-star small { display:block;opacity:.75;margin-top:2px; }
.side-bottom { margin-top:auto;padding:12px;border-top:1px solid #d7dded; }
.account-row { display:flex;align-items:center;gap:9px;font-size:13px;min-width:0; }
.account-row strong { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.avatar { display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:50%;background:#d5dcf9;color:#4b5693;font-weight:800; }
.account-row button { margin-left:auto;flex:none;white-space:nowrap;border:0;background:transparent;color:#65708f;font-size:12px; }
.workspace { min-width:0;padding:24px clamp(18px,3.4vw,55px) 60px; }
.topbar { display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:24px; }
.topnav { display:flex;gap:3px;align-items:center;background:#f9faffae;border:1px solid #fff;border-radius:100px;padding:4px;box-shadow:0 8px 24px #6d78a523; }
.topnav button { display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;border-radius:100px;color:#65708c;padding:9px 16px;font-size:13px;font-weight:750;white-space:nowrap; }
.topnav button.active { background:#e5e9f9;color:#354067; }
.topnav button:hover:not(.active) { background:#f1f2fa; }
.top-actions { display:flex;gap:8px; }
.page { max-width:1260px;margin:auto; }
.page-header { margin:0 0 18px; }
.eyebrow { color:#636b9d;font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase; }
.page-header h1 { margin:5px 0;font-size:clamp(25px,2.8vw,35px);letter-spacing:-.035em; }
.page-header p { margin:0;color:var(--muted);font-size:14px; }
.panel { background:var(--panel);border:1px solid #fffd;border-radius:18px;box-shadow:var(--shadow);padding:20px;backdrop-filter:blur(14px); }
.panel h2 { margin:0 0 14px;font-size:17px; }
.panel h3 { font-size:14px;margin:0 0 10px; }
.panel p { color:var(--muted);line-height:1.55; }
.grid { display:grid;gap:15px; }
.grid > * { min-width:0; }
.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.focus-layout { display:grid;gap:15px; }
.main-grid { display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.85fr);gap:15px; }
.data-columns { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:15px; }
.data-columns > .stack { min-width:0; }
.stack { display:grid;gap:15px;align-content:start; }
.hero { min-height:305px;display:grid;grid-template-columns:minmax(240px,.78fr) minmax(0,1fr);align-items:center;gap:16px;padding:20px 28px;overflow:hidden;position:relative; }
.hero::after { content:"✦";position:absolute;right:7%;top:8%;font-size:31px;color:#f6d987aa; }
.hero h1 { margin:3px 0 8px;font-size:clamp(24px,2.5vw,34px);line-height:1.16;overflow-wrap:anywhere; }
.hero p { margin:0 0 16px; }
.clock { width:min(258px,100%);aspect-ratio:1;margin:auto;border-radius:50%;border:14px solid #eef0fa;box-shadow:0 8px 30px #5865a326,inset 0 0 0 7px #c9cee5;position:relative;background:radial-gradient(circle at 50% 50%,#fcfbff,#edf0fa); }
.clock::before { content:"";position:absolute;inset:13px;border:3px solid #dce0f1;border-radius:50%; }
.clock .ticks { position:absolute;inset:0; }
.tick { position:absolute;inset:0;transform-origin:center center; }
.tick::before { content:"";position:absolute;left:calc(50% - 2px);top:11px;width:4px;height:14px;border-radius:4px;background:#afb5d4; }
.tick.major::before { height:19px;background:#4c598e; }
.clock .hand { position:absolute;width:5px;height:34%;background:#27355c;left:calc(50% - 2px);bottom:50%;border-radius:5px;transform-origin:bottom center;transform:rotate(28deg); }
.clock .center { position:absolute;width:19px;height:19px;border-radius:50%;background:#ffc751;left:calc(50% - 9.5px);top:calc(50% - 9.5px);box-shadow:0 0 20px #ffe09c; }
.clock .readout { position:absolute;top:66%;width:100%;text-align:center;font-weight:800;font-size:20px; }
.clock .phase { display:block;font-size:11px;color:#627091;margin-top:2px; }
.clock.focus { border-color:#f3eaf2;box-shadow:0 10px 38px #e9a7c855,inset 0 0 0 7px #e4b9d6;background:radial-gradient(circle,#fffafa,#faeafa); }
.clock.break { border-color:#e5f3fb;box-shadow:0 10px 38px #7ecbe455,inset 0 0 0 7px #a9d6e6;background:radial-gradient(circle,#fff,#dff5ff); }
.clock.paused { filter:saturate(.5); }
.button-row { display:flex;gap:8px;flex-wrap:wrap;align-items:center; }
.metric-row { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:13px 0; }
.hero .metric-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
.main-grid > .stack:last-child .metric-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
.metric { border:1px solid #eef0f8;border-radius:12px;background:#ffffff91;padding:10px; }
.metric strong { display:block;font-size:20px;color:#33416e; }
.metric span { color:var(--muted);font-size:11px; }
.subtle { color:var(--muted);font-size:12px; }
.status-chip { display:inline-block;padding:4px 8px;border-radius:100px;background:#eef0fa;color:#5f6b91;font-size:11px;font-weight:750; }
.status-chip.gold { background:#fff1cd;color:#91703b; }
.status-chip.red { background:#fce8ee;color:#a2536b; }
.list { display:grid;gap:8px; }
.item { border:1px solid #e9ecf6;background:#ffffff9e;border-radius:12px;padding:12px; }
.item.selected { border-color:#f1ca80;background:#fff7e8; }
.item-head { display:flex;align-items:center;gap:8px;justify-content:space-between; }
.item-title { font-weight:750;min-width:0;overflow-wrap:anywhere; }
.item-title .star { color:#efb841;margin-right:4px; }
.item-actions { display:flex;gap:4px;flex-wrap:wrap; }
.item p { margin:6px 0 0;font-size:12px; }
#assistant-clarify-form { margin-top:12px; }
.task-row { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px;padding:8px;border-radius:8px;background:#fff9; }
.task-row.completed,.task-row.skipped { opacity:.62; }
.task-row.completed .task-name,.task-row.skipped .task-name { text-decoration:line-through; }
.task-row .task-name { flex:1;font-size:13px; }
.task-row .task-duration { white-space:nowrap;color:#707b9c;font-size:11px;font-weight:750; }
.task-row.skipped .task-duration { white-space:normal;text-align:right; }
.task-row .item-actions { margin-left:5px; }
.task-row .button { box-shadow:none; }
.inline-form { display:flex;gap:8px;align-items:end;flex-wrap:wrap; }
.inline-form .field { flex:1;min-width:130px;margin:0; }
.empty { padding:24px;text-align:center;border:1px dashed #c9d0e7;border-radius:14px;color:var(--muted);background:#ffffff6c; }
.empty .emoji { font-size:29px;display:block;margin-bottom:5px; }
.section-heading { display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px; }
.section-heading h2 { margin:0; }
.disclosure { border-top:1px solid #e3e6f2;margin-top:12px;padding-top:12px; }
.disclosure summary { cursor:pointer;font-weight:750;color:#576493; }
.disclosure-body { display:grid;gap:12px;margin-top:12px; }
.goal-card { background:#ffffffb3;border:1px solid #fff;border-radius:16px;padding:18px;margin-bottom:14px; }
.goal-top { display:flex;justify-content:space-between;gap:10px;align-items:start; }
.goal-top h2 { margin:0 0 4px; }
.progress { background:#e6e9f4;border-radius:100px;height:8px;overflow:hidden;margin:12px 0; }
.progress span { display:block;height:100%;background:linear-gradient(90deg,#e9b963,#6f80c3);border-radius:inherit; }
.forecast { display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0;padding:10px;border-radius:10px;background:#f1f3fa; }
.target { margin-top:10px;border-left:3px solid #cbd2ed;padding:9px 0 9px 13px; }
.subtask { margin:7px 0 0 8px;padding:10px;background:#f5f6fd;border-radius:10px;display:flex;justify-content:space-between;gap:10px;align-items:center; }
.calendar { display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px; }
.calendar-scroll { overflow-x:auto;padding-bottom:14px; }
.calendar.long { width:max-content;grid-template-columns:none;grid-template-rows:repeat(7,16px);grid-auto-columns:16px;grid-auto-flow:column;gap:4px; }
.calendar.long .day { width:16px;height:16px;aspect-ratio:auto;font-size:0; }
.calendar.long .calendar-spacer { width:16px;height:16px; }
.archive-filter-row { display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-bottom:15px; }
.archive-filter-row > label:not(.archive-active-filter) { flex:1 1 165px;max-width:260px; }
.archive-active-filter { order:1;display:flex;align-items:center;gap:8px;min-height:43px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);white-space:nowrap; }
.archive-active-filter input { width:auto;margin:0; }
.interruption-range { display:block;max-width:240px;margin:2px 0 14px; }
.interruption-highlight { padding:12px 14px;margin:12px 0;border:1px solid var(--line);border-radius:13px;background:var(--panel-solid);font-size:13px;line-height:1.5; }
.interruption-breakdowns { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:16px;margin-top:16px; }
.interruption-breakdowns h3 { margin:0 0 10px; }
.interruption-reason,.interruption-task { min-width:0;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--panel-solid); }
.interruption-row-head,.interruption-task { display:flex;justify-content:space-between;align-items:start;gap:10px; }
.interruption-row-head > div,.interruption-task > div { min-width:0;overflow-wrap:anywhere; }
.interruption-row-head > strong,.interruption-task > strong { white-space:nowrap;color:var(--violet); }
.interruption-reason p,.interruption-task p { margin:3px 0 0;color:var(--muted);font-size:12px; }
.interruption-reason progress { width:100%;height:7px;margin-top:10px;border:0;border-radius:20px;overflow:hidden;accent-color:var(--violet);background:var(--line); }
.interruption-reason progress::-webkit-progress-bar { background:var(--line);border-radius:20px; }
.interruption-reason progress::-webkit-progress-value { background:var(--violet);border-radius:20px; }
.interruption-reason progress::-moz-progress-bar { background:var(--violet);border-radius:20px; }
.interruption-badges { display:flex;flex-wrap:wrap;gap:5px;margin-top:7px; }
.interruption-badges span { padding:3px 7px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-size:10px;font-weight:750; }
.interruption-empty { padding:12px;margin:0;border:1px dashed var(--line);border-radius:12px;background:var(--panel-solid); }
.review-badges { display:flex;flex-wrap:wrap;gap:7px;margin:12px 0; }
.review-badges > span { padding:7px 10px;border:1px solid var(--line);border-radius:99px;background:var(--panel-solid);font-size:12px;font-weight:750; }
.weekly-period { margin:0 0 8px; }
.weekly-guidance { margin:0 0 12px;line-height:1.5; }
.weekly-extra,.weekly-badges { display:flex;flex-wrap:wrap;gap:6px;margin:10px 0; }
.weekly-extra span,.weekly-badges span { padding:5px 8px;border:1px solid var(--line);border-radius:99px;background:var(--panel-solid);color:var(--muted);font-size:11px;font-weight:700; }
.weekly-top { padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel-solid);overflow-wrap:anywhere; }
.weekly-suggestion { display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--panel-solid); }
.weekly-suggestion-copy { flex:1 1 175px;min-width:0;overflow-wrap:anywhere; }
.weekly-suggestion-copy p { margin:3px 0 7px;font-size:12px; }
.weekly-suggestion .button { flex:none; }
.archive-summary { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px; }
.archive-summary .metric { padding:8px; }
.archive-summary .metric strong { font-size:17px; }
.archive-day-list { display:grid;gap:7px;max-height:285px;overflow:auto;padding:2px 4px 2px 0; }
.archive-day-row { display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid var(--line);border-radius:13px;background:var(--panel-solid); }
.archive-day-main { min-width:0; }
.archive-day-main > strong { font-size:13px; }
.archive-day-tasks { display:flex;flex-wrap:wrap;gap:5px;margin-top:6px; }
.archive-day-tasks > span { display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 7px;border-radius:99px;background:var(--panel);color:var(--muted);font-size:11px; }
.archive-day-total { display:grid;justify-items:end;gap:3px;flex:none;white-space:nowrap; }
.archive-day-total strong { color:var(--violet);font-size:13px; }
.archive-day-total small { color:var(--muted);font-size:11px; }
.month-scale { position:relative;height:20px;color:var(--muted);font-size:10px; }
.month-scale span { position:absolute;white-space:nowrap; }
.calendar .day { aspect-ratio:1.2;border:0;border-radius:5px;background:#e6e9f5;font-size:10px;color:#6d7898;display:grid;place-items:center; }
.calendar .day[data-level="1"] { background:#cad2f1; }.calendar .day[data-level="2"] { background:#9eaddf;color:#fff; }.calendar .day[data-level="3"] { background:#6d80c0;color:#fff; }.calendar .day[data-level="4"] { background:#43599d;color:#fff; }
.chart-bars { display:flex;align-items:end;gap:5px;height:105px;border-bottom:1px solid #cbd3e8;padding:4px; }
.chart-bars div { flex:1;min-width:5px;border-radius:4px 4px 0 0;background:linear-gradient(#f7cc76,#858bce); }
.table-wrap { overflow:auto; }
table { border-collapse:collapse;width:100%;font-size:12px; }
th,td { padding:9px;border-bottom:1px solid #e1e6f4;text-align:left;white-space:nowrap; }
th { color:#6a7594; }
.settings-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
.setting-row { display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid #e5e9f4;padding:10px 0; }
.setting-row select { max-width:150px;margin:0; }
.setting-row label { flex:1; }
@media (max-width:480px) {
  .sound-setting-row { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px; }
  .sound-setting-row label { grid-column:1/-1; }
  .sound-setting-row select { width:100%;max-width:none;min-width:0; }
  .sound-setting-row .button { white-space:nowrap; }
}
.modal-backdrop { position:fixed;inset:0;z-index:10;background:#26305280;display:grid;place-items:center;padding:16px;backdrop-filter:blur(7px); }
.modal { width:min(540px,100%);max-height:min(92vh,900px);overflow:auto;border-radius:22px;background:#f9faff;border:1px solid #fff;box-shadow:0 30px 90px #1c254767;padding:23px; }
.modal h2 { margin:0 0 16px; }
.modal-footer { display:flex;justify-content:flex-end;gap:8px;margin-top:18px; }
.form-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
.form-grid .field { margin:0; }
.form-grid .span { grid-column:1/-1; }
.message { padding:12px;border-radius:11px;background:#eef0fa;color:#556183;font-size:13px; }
.message.error { background:#fff0f3;color:#a3455b; }
#toast { position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);padding:10px 18px;border-radius:12px;background:#34416c;color:white;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s;z-index:30;font-size:13px; }
#toast.visible { transform:translate(-50%,0);opacity:1; }
body.dark { color-scheme:dark;--ink:#e9ecff;--muted:#b1b9d2;--line:#4b5579;--panel:#252d4be0;--panel-solid:#242b48;--shadow:0 20px 60px #0a102044;background:radial-gradient(circle at 70% 12%,#3f416d,#1a2441 68%,#182039); }
body.dark .sidebar { background:#1d2545cc;border-color:#ffffff20; }
body.dark .panel,body.dark .auth-card { border-color:#ffffff24; }
body.dark .item,body.dark .goal-card,body.dark .task-row,body.dark .subtask,body.dark .metric { background:#333d60;border-color:#ffffff18; }
body.dark .forecast { background:#3a4569; }
body.dark .empty { background:#303955;color:#c9d1e9;border-color:#657097; }
body.dark .metric strong { color:#f5f2ff; }
body.dark .side-item,body.dark .side-star,body.dark .side-heading,body.dark .topnav button,body.dark .task-duration { color:#c4cce4; }
body.dark .side-item.active,body.dark .side-star.active { color:#fff; }
body.dark label { color:#d8def3; }
body.dark .account-row button { color:#d0d6ea; }
body.dark .eyebrow { color:#b6c0ff; }
body.dark .status-chip { background:#485477;color:#f2f4ff; }
body.dark .status-chip.gold { background:#67593c;color:#ffe7ae; }
body.dark .status-chip.red { background:#704459;color:#ffe7ef; }
body.dark .calendar .day { background:#485375;color:#c9d2e9; }
body.dark .calendar .day[data-level="1"] { background:#6578ad;color:#fff; }
body.dark .calendar .day[data-level="2"] { background:#7e90c9;color:#fff; }
body.dark .calendar .day[data-level="3"] { background:#9aa9dc;color:#1e2b53; }
body.dark .calendar .day[data-level="4"] { background:#f0c974;color:#302d52; }
body.dark input,body.dark select,body.dark textarea,body.dark .button,body.dark .modal { background:#293250;color:#ecedff;border-color:#5a6488; }
body.dark .button.primary { background:#6773bc; }
body.dark .clock { color:#28314c; }
body.dark .topnav { background:#303858;border-color:#ffffff22; }
body.dark .topnav button.active { background:#586395;color:white; }
@media (max-width:1100px) { .main-grid { grid-template-columns:1fr; }.sidebar { width:205px; }.app-shell { grid-template-columns:205px minmax(0,1fr); }.topnav button { padding:8px 10px; } }
@media (max-width:760px) { .app-shell { display:block;padding-bottom:66px; }.sidebar { display:none; }.workspace { padding:14px 13px 45px; }.topbar { gap:6px;align-items:start; }.topnav { position:fixed;z-index:5;bottom:0;left:0;right:0;border-radius:14px 14px 0 0;justify-content:space-around;padding:5px 2px env(safe-area-inset-bottom);background:#f8f9ffed; }.topnav button { padding:7px 3px;min-width:54px;font-size:10px; }.topnav button .nav-icon { display:block;font-size:19px;margin-bottom:2px; }.top-actions { margin-left:auto; }.hero { grid-template-columns:1fr;padding:20px; }.hero .clock { width:205px; }.hero-content { text-align:center; }.hero-content .button-row { justify-content:center; }.two,.three,.settings-grid { grid-template-columns:1fr; }.metric-row { grid-template-columns:repeat(2,minmax(0,1fr)); }.form-grid { grid-template-columns:1fr; }.form-grid .span { grid-column:auto; }.goal-top { flex-direction:column; }.target .item-head { flex-wrap:wrap; }.subtask { display:block; }.subtask .item-actions { margin-top:8px; } }
@media (max-width:760px) { .archive-summary { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .topnav button { display:block; } }
@media (max-width:760px) {
  .task-row:has(> .task-name) { display:grid;grid-template-columns:minmax(0,1fr) auto; }
  .task-row > .task-name { grid-column:1 / -1;min-width:0; }
  .task-row > .task-name .subtle { display:block;margin-top:2px; }
  .task-row > .task-duration { grid-column:1; }
  .task-row > .item-actions { grid-column:2;margin-left:0; }
}