:root { --ink:#153932; --ink-soft:#547069; --paper:#f4f5ef; --surface:#fffefa; --line:#dce3dc; --mist:#e9efe8; --coral:#ef755b; --sun:#f0bb4a; --blue:#b8dde2; --purple:#d9cbec; --radius:18px; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope, sans-serif; }
button, input, select, textarea { font:inherit; } button { cursor:pointer; } button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline:3px solid #8ec5bb; outline-offset:2px; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:246px 1fr; }
.sidebar { color:#edf4ed; background:#163f38; padding:26px 20px; display:flex; flex-direction:column; min-height:100vh; position:sticky; top:0; height:100vh; }
.brand { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; font-weight:700; letter-spacing:-.04em; padding-left:4px; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border:1px solid #70958a; border-radius:13px; font-family:Manrope,"Segoe UI",sans-serif; font-size:12px; font-weight:850; letter-spacing:-.08em; }
.nav { display:grid; gap:6px; margin-top:70px; }.nav-item { color:#c5d6ca; text-align:left; border:0; border-radius:10px; background:transparent; padding:12px 13px; font-weight:600; }.nav-item span { display:inline-block; width:27px; color:#9dc4b0; font-size:18px; }.nav-item:hover,.nav-item.active { color:white; background:#2a554c; }.nav-item.active span { color:#f1bb4d; }
.sidebar-bottom { margin-top:auto; padding:16px 4px 3px; color:#9db8ac; font-size:11px; line-height:1.65; }.sidebar-bottom p { margin:22px 0 0; }.sync-status { display:flex; gap:7px; align-items:center; border:0; padding:0; color:#9db8ac; background:transparent; font-size:11px; text-align:left; }.sync-status:hover { color:#fff; }.sync-status i { width:7px; height:7px; background:#8dd09b; border-radius:50%; }.sync-status[data-state="syncing"] i { background:#f1bb4b; }.sync-status[data-state="offline"] i { background:#ef755b; }
main { max-width:1320px; width:100%; margin:auto; padding:0 5.5vw 56px; }.topbar { min-height:100px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }.date-block { display:grid; gap:2px; color:var(--ink-soft); font-size:12px; }.date-block strong { color:var(--ink); font-size:13px; }.topbar-actions { display:flex; align-items:center; gap:15px; }.icon-button,.avatar,.mobile-menu { border:0; background:transparent; color:var(--ink); }.icon-button { font-size:22px; }.avatar { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#e1d4c4; font-size:12px; font-weight:800; }.mobile-menu { display:none; font-size:21px; }
.view { display:none; }.view.active { display:block; animation:appear .3s ease both; } @keyframes appear { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:22px; padding:52px 0 29px; }.eyebrow { margin:0 0 9px; color:#698078; font:500 10px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; } h1,h2,h3,p { margin-top:0; } h1 { margin-bottom:0; font-size:clamp(38px,4vw,58px); line-height:1.02; letter-spacing:-.07em; } h1 em { font-family:"Playfair Display",serif; font-weight:600; letter-spacing:-.06em; }.primary-button,.secondary-button { border:0; border-radius:8px; padding:12px 17px; font-size:13px; font-weight:800; }.primary-button { color:#fff; background:var(--ink); box-shadow:0 4px 0 #0d2d26; }.primary-button:hover { background:#235248; }.secondary-button { background:#e8ede7; color:var(--ink); }
.capture { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:15px; padding:13px 14px 13px 19px; border:1px solid #ced9d0; border-radius:11px; background:#fbfcf9; }.capture label { color:#789087; font:500 10px "DM Mono",monospace; text-transform:uppercase; }.capture input { min-width:0; border:0; background:transparent; color:var(--ink); outline:0; font-size:14px; }.capture input::placeholder { color:#a1b0a7; }.capture button { display:grid; place-items:center; width:34px; height:34px; border:0; border-radius:8px; color:#fff; background:var(--coral); font-size:20px; }
.planning-capture { grid-template-columns:auto 1fr 105px auto; }.planning-capture select { border:0; border-left:1px solid var(--line); padding:4px 8px; color:#48685e; background:transparent; font-size:12px; }.plan-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:25px; }.plan-card { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:116px; padding:19px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }.plan-card > div > span { color:#7c9389; font:10px "DM Mono",monospace; text-transform:uppercase; }.plan-card h2 { max-width:340px; margin:13px 0 0; font:600 18px/1.13 "Playfair Display",serif; letter-spacing:-.04em; }.plan-actions { display:grid; justify-items:end; gap:9px; }.plan-card label { display:grid; justify-items:center; gap:5px; color:#567268; font-size:10px; white-space:nowrap; }.plan-card input { width:18px; height:18px; accent-color:#367461; }.plan-card.done { opacity:.62; }.plan-card.done h2 { text-decoration:line-through; }.idea-capture { display:grid; gap:12px; padding:18px; border-radius:var(--radius); background:#e6d7c3; }.idea-capture textarea { min-height:105px; resize:vertical; border:0; color:var(--ink); background:#fff8ef99; padding:13px; border-radius:8px; font-size:14px; }.idea-capture .primary-button { justify-self:end; box-shadow:none; }.idea-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:25px; }.idea-card { display:flex; flex-direction:column; min-height:150px; padding:19px; border-radius:var(--radius); background:#dfeceb; }.idea-card:nth-child(3n+2) { background:#e8deef; }.idea-card:nth-child(3n) { background:#f4e4b7; }.idea-card p { margin:0; font:600 18px/1.2 "Playfair Display",serif; letter-spacing:-.03em; }.idea-card footer { display:flex; justify-content:space-between; gap:10px; align-items:center; margin-top:auto; padding-top:16px; }.idea-card footer span { color:#688078; font:10px "DM Mono",monospace; }.idea-actions { display:flex; align-items:center; gap:9px; }.idea-card .idea-actions > button { border:0; padding:0; color:#236552; background:transparent; font-size:10px; font-weight:800; }
.income-form { display:grid; grid-template-columns:minmax(0,1fr) minmax(130px,.4fr) minmax(145px,.45fr) auto; gap:11px; padding:17px; border-radius:var(--radius); background:#dcebe0; }.income-form label { display:grid; gap:6px; color:#5e776d; font-size:10px; font-weight:800; }.income-form input { min-width:0; border:1px solid #bfd1c3; border-radius:8px; padding:10px 11px; color:var(--ink); background:#fffefa; font-size:14px; }.income-form .primary-button { align-self:end; box-shadow:none; }.income-totals { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; }.income-totals article { padding:19px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }.income-totals span,.income-totals small { display:block; color:#6f877e; font:10px "DM Mono",monospace; }.income-totals span { text-transform:uppercase; }.income-totals strong { display:block; margin:11px 0 5px; font:600 30px/1 "Playfair Display",serif; letter-spacing:-.05em; }.income-year { margin-top:25px; padding:20px; border-radius:var(--radius); background:#1d5549; color:#fff; }.income-year .section-title h2 { color:#fff; }.income-year .section-title span { color:#b5cec2; }.income-bars { display:flex; align-items:flex-end; gap:8px; height:145px; margin-top:20px; }.income-bar { display:grid; grid-template-rows:1fr auto; align-items:end; flex:1; height:100%; min-width:0; position:relative; }.income-bar i { display:block; min-height:3px; border-radius:4px 4px 0 0; background:#8bc2a7; }.income-bar:nth-child(8) i { background:#f0bb4b; }.income-bar small { padding-top:7px; color:#b6d0c3; text-align:center; font:8px "DM Mono",monospace; }.income-bar-value { position:absolute; bottom:calc(var(--bar, 0) + 21px); display:none; }.income-history { margin-top:27px; max-width:720px; }.income-history .section-title { padding-bottom:5px; border-bottom:2px solid var(--ink); }.income-entry { display:grid; grid-template-columns:1fr auto auto; gap:13px; align-items:center; padding:15px 4px; border-bottom:1px solid var(--line); }.income-entry span { font-size:13px; font-weight:700; }.income-entry span small { display:block; margin-top:4px; color:#7b9289; font:10px "DM Mono",monospace; font-weight:400; }.income-entry strong { font:500 14px "DM Mono",monospace; }
.today-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(270px,.78fr); gap:24px; margin-top:36px; }.tasks-panel { border-top:2px solid var(--ink); padding-top:16px; }.section-title { display:flex; align-items:center; justify-content:space-between; gap:10px; }.section-title h2 { margin:0; font-size:16px; letter-spacing:-.04em; }.section-title span { color:#758b82; font:10px "DM Mono",monospace; }.task-list { margin-top:13px; }.task { display:grid; grid-template-columns:28px minmax(0,1fr) auto auto; gap:11px; align-items:center; padding:15px 0; border-bottom:1px solid var(--line); }.task-check { width:19px; height:19px; margin:0; appearance:none; border:1.5px solid #a9bcb0; border-radius:50%; }.task-check:checked { background:var(--ink); border-color:var(--ink); box-shadow:inset 0 0 0 4px var(--surface); }.task-title { display:flex; align-items:center; min-width:0; gap:7px; padding:0; border:0; color:var(--ink); background:transparent; text-align:left; font-size:14px; font-weight:700; }.task-title > span { margin-left:auto; color:#709086; font-size:16px; }.task-title .subtask-count { padding:2px 5px; border-radius:5px; color:#70887f; background:#e9efea; font:9px "DM Mono",monospace; }.task-block.completed .task-title { color:#8b9a94; text-decoration:line-through; }.task-meta { justify-self:end; color:#779087; font:10px "DM Mono",monospace; }.task-meta::before { content:""; display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:var(--meta-color); }.entry-actions { display:flex; align-items:center; gap:3px; }.entry-actions button { width:23px; height:23px; padding:0; border:0; border-radius:5px; color:#5d766c; background:transparent; font-size:13px; }.entry-actions button:hover { background:#e6eee7; color:#1b5849; }.entry-actions .delete-button:hover { color:#ba4f3b; background:#f9e3dd; }.subtasks { margin:0 0 9px 29px; padding:3px 0 12px 14px; border-left:1px solid #cad8cf; }.subtask-list { display:grid; gap:8px; padding:7px 0; }.subtask { display:flex; align-items:center; gap:8px; color:#4a665d; font-size:11px; }.subtask input { width:14px; height:14px; accent-color:#3e7b6a; }.subtask.done span { color:#899993; text-decoration:line-through; }.no-subtasks { margin:7px 0; color:#84978f; font-size:11px; }.subtask-form { display:flex; gap:7px; margin-top:7px; }.subtask-form input { min-width:0; flex:1; border:0; border-bottom:1px solid #b7c9be; padding:6px 0; color:var(--ink); background:transparent; font-size:11px; }.subtask-form button { border:0; padding:6px 8px; border-radius:5px; color:#246151; background:#e2eee5; font-size:10px; font-weight:800; }.text-button { border:0; padding:12px 0 0; color:#55746a; background:transparent; font-size:12px; font-weight:700; }.text-button span { padding-left:4px; }
.task-group-label { color:#82968e; font:500 9px "DM Mono",monospace; letter-spacing:.09em; text-transform:uppercase; padding:4px 0 3px; }.done-heading { display:flex; align-items:center; justify-content:space-between; padding:28px 0 2px; color:#2c6457; font-size:12px; font-weight:800; }.done-heading::before { content:"✓"; display:grid; place-items:center; width:19px; height:19px; margin-right:8px; border-radius:50%; color:#fff; background:#478274; font-size:11px; }.done-heading span { margin-right:auto; }.done-heading small { color:#81938d; font:10px "DM Mono",monospace; font-weight:400; }
.day-aside { display:grid; gap:19px; }.focus-card { padding:24px; min-height:185px; position:relative; overflow:hidden; color:#163f38; border-radius:var(--radius); background:#e6d7c3; }.focus-card::after { content:""; position:absolute; width:118px; height:118px; right:-42px; bottom:-48px; border:19px solid #c2a57e; border-radius:50%; }.focus-card h3 { margin:16px 0 6px; font:600 23px/1.1 "Playfair Display",serif; letter-spacing:-.04em; }.focus-card > p:not(.eyebrow) { color:#6c675c; font-size:11px; }.focus-card button { position:relative; z-index:1; margin-top:6px; border:0; padding:0; background:transparent; color:#215046; font-size:11px; font-weight:800; }.focus-card button span { margin-left:9px; font-size:16px; }.rhythm-card { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); padding:19px; }.habit-list { margin-top:13px; display:grid; gap:12px; }.habit { display:grid; grid-template-columns:8px 1fr auto; gap:9px; align-items:center; font-size:12px; font-weight:700; }.habit i { width:8px; height:8px; border-radius:50%; background:#ccd7ce; }.habit.done i { background:#efb945; }.habit button { border:0; color:#70857c; background:transparent; font:10px "DM Mono",monospace; }.habit.done button { color:#2e7765; }
.areas-strip { margin-top:47px; }.area-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:15px; }.area-card { min-width:0; padding:16px 14px; display:grid; grid-template-columns:29px 1fr auto; gap:8px; align-items:center; border-radius:12px; }.area-card b { display:block; font-size:11px; }.area-card p { margin:4px 0 0; overflow:hidden; color:#5e746b; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.area-card strong { font:500 15px "DM Mono",monospace; }.area-icon { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#fff9; font:12px "DM Mono",monospace; }.health { background:#d6e9db; }.english { background:var(--purple); }.money { background:#f6e1ad; }.books { background:var(--blue); }
.project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.project { min-height:290px; padding:21px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }.project.top { background:#d7e9df; border:0; }.project-card-top { display:flex; justify-content:space-between; align-items:center; }.project .tag { width:max-content; padding:5px 8px; border-radius:30px; background:#fff9; font:9px "DM Mono",monospace; }.project h2 { margin:22px 0 8px; font:700 21px/1.1 "Playfair Display",serif; letter-spacing:-.04em; }.project p { color:#60766d; font-size:11px; }.project-today { display:grid; gap:5px; min-height:50px; margin:10px 0 15px; padding:9px 10px; border-left:2px solid #5b927f; background:#eef4ef96; }.project-today span { color:#487265; font:500 9px "DM Mono",monospace; letter-spacing:.04em; text-transform:uppercase; }.project-today b { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.project-today small { color:#5f786f; font-size:10px; }.project-today.quiet { display:flex; align-items:center; border-color:#cbd9d0; background:#f4f6f2; }.project-today.quiet span { color:#84978f; text-transform:none; letter-spacing:0; font-family:Manrope,sans-serif; }.project footer { display:flex; justify-content:space-between; align-items:center; margin-top:auto; font:10px "DM Mono",monospace; color:#58756b; }.progress { width:62%; height:5px; overflow:hidden; background:#e1e8e0; border-radius:5px; }.progress i { display:block; height:100%; background:#387463; border-radius:5px; }.project-open,.back-button { width:max-content; border:0; padding:10px 0 0; color:#286757; background:transparent; font-size:11px; font-weight:800; }.back-button { margin-top:35px; }.project-detail-heading { padding-top:18px; }.project-description { max-width:520px; margin:14px 0 0; color:#61776e; font-size:13px; }.project-summary { display:flex; gap:10px; flex-wrap:wrap; margin:0 0 28px; }.project-summary span { padding:10px 13px; border-radius:8px; background:#e5eee7; color:#547067; font-size:11px; }.project-summary b { margin-right:4px; color:var(--ink); font-size:14px; }.project-work { max-width:760px; padding:21px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }.project-work h2 { margin:0 0 15px; font-size:18px; letter-spacing:-.04em; }.project-task-form { display:flex; gap:9px; margin-bottom:18px; }.project-task-form input { min-width:0; flex:1; border:1px solid #c7d5ca; border-radius:8px; padding:10px 12px; color:var(--ink); background:#fbfcf9; font-size:12px; }.project-task-form .primary-button { padding:9px 13px; box-shadow:none; }.project-task-list .task-block:last-child .task { border-bottom:0; }
.areas-dashboard { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.area-detail { min-height:162px; padding:23px; border-radius:var(--radius); }.area-detail h2 { margin:19px 0 7px; font-size:22px; letter-spacing:-.05em; }.area-detail p { margin:0; color:#557269; font-size:12px; }.area-detail strong { float:right; font:500 24px "DM Mono",monospace; }.area-detail button { margin-top:15px; border:0; background:transparent; padding:0; color:#1b574a; font-size:11px; font-weight:800; }
.review-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:20px; }.review-main,.reflection { padding:28px; border-radius:var(--radius); }.review-main { color:#fff; background:#1e554a; }.review-main p { color:#b8d0c4; font-size:12px; }.review-main strong { display:block; font:600 84px/.95 "Playfair Display",serif; letter-spacing:-.08em; }.review-main span { color:#b8d0c4; font-size:12px; }.week-bars { height:105px; display:flex; align-items:flex-end; gap:9px; margin-top:25px; }.week-bars i { flex:1; min-width:5px; background:#75a996; border-radius:4px 4px 0 0; }.week-bars i:nth-child(6) { background:#f1bb4b; }.review-main small { word-spacing:8px; color:#a4c2b5; font:8px "DM Mono",monospace; }.reflection { background:#e5d6c4; }.reflection h2 { max-width:390px; margin:20px 0; font:600 25px/1.1 "Playfair Display",serif; letter-spacing:-.04em; }.reflection textarea { width:100%; height:85px; resize:vertical; border:1px solid #c7ad91; border-radius:8px; padding:12px; background:#fff8ef99; color:var(--ink); font-size:12px; }.reflection .primary-button { display:block; margin-top:15px; }
dialog { width:min(460px,calc(100% - 32px)); max-height:90dvh; overflow:auto; border:0; border-radius:20px; padding:0; color:var(--ink); background:var(--surface); box-shadow:0 22px 70px #173a3352; } dialog::backdrop { background:#11342bb3; backdrop-filter:blur(3px); } dialog form { display:grid; padding:26px; } .dialog-title { display:flex; align-items:center; justify-content:space-between; padding-bottom:17px; border-bottom:1px solid var(--line); }.dialog-title h2 { margin:0; font:600 24px/1.05 "Playfair Display",serif; letter-spacing:-.04em; }.close { display:grid; place-items:center; width:31px; height:31px; border:0; border-radius:50%; color:#5d726a; background:#edf2eb; font-size:24px; line-height:1; }.close:hover { color:#9e3f30; background:#fae4df; }.dialog-title + label,.dialog-title + .dialog-copy { margin-top:21px; } dialog form label { display:grid; gap:7px; margin-bottom:16px; color:#5f746c; font:700 10px "DM Mono",monospace; letter-spacing:.04em; text-transform:uppercase; } dialog form label small { color:#84958e; font:400 9px "DM Mono",monospace; text-transform:none; } dialog form input,dialog form select { width:100%; border:1px solid #c8d6cb; border-radius:9px; padding:12px; color:var(--ink); background:#fbfcf8; font:500 13px Manrope,sans-serif; } dialog form input::placeholder { color:#9baea4; } dialog form input:focus,dialog form select:focus { border-color:#4e8b78; outline:3px solid #cde4d9; }.dialog-copy { margin-bottom:20px; color:#657b73; font-size:13px; line-height:1.5; }.sync-error { min-height:18px; margin:0; color:#b34a37; font-size:11px; }.sync-backup { display:flex; gap:12px; align-items:center; margin:0 0 14px; padding:0 0 16px; border-bottom:1px solid var(--line); }.sync-backup button,.sync-backup label { border:0; padding:0; color:#4b7468; background:transparent; font:700 10px Manrope,sans-serif; text-transform:none; letter-spacing:0; cursor:pointer; }.sync-backup label { margin:0; }.sync-backup input { display:none; }.dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:10px; padding-top:17px; border-top:1px solid var(--line); }.dialog-actions .primary-button { box-shadow:none; }.toast { position:fixed; right:25px; bottom:25px; z-index:5; padding:12px 16px; color:white; border-radius:8px; background:#17483f; font-size:12px; opacity:0; transform:translateY(10px); pointer-events:none; transition:.2s; }.toast.show { opacity:1; transform:none; }
.form-reminder-field { display:grid; gap:7px; margin-bottom:16px; color:#5f746c; font:700 10px "DM Mono",monospace; letter-spacing:.04em; text-transform:uppercase; }.form-reminder-field small { color:#84958e; font:400 9px "DM Mono",monospace; text-transform:none; }.income-form .form-reminder-field { align-content:start; color:#5e776d; letter-spacing:0; }.swipe-reminder { min-width:0; }.swipe-reminder > input { display:none; }.swipe-reminder-trigger { width:100%; min-height:44px; border:1px solid #b9cfc1; border-radius:9px; padding:10px 12px; color:#245a4e; background:#fbfcf8; text-align:left; font-size:14px; font-weight:800; }.swipe-reminder-trigger::after { content:"⌄"; float:right; color:#6f8d80; font-size:16px; line-height:.7; }.swipe-reminder-clear { margin:7px 0 0; border:0; padding:0; color:#7a8f86; background:transparent; font-size:11px; font-weight:700; }.swipe-reminder-wheels { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; margin-top:9px; padding:8px; border:1px solid #c8d8cc; border-radius:12px; background:#f2f7f1; }.swipe-reminder-wheels > div { min-width:0; text-align:center; }.swipe-reminder-wheels > div > span { display:block; margin-bottom:3px; color:#71867d; font:9px "DM Mono",monospace; text-transform:uppercase; }.swipe-wheel { height:102px; overflow-y:auto; overscroll-behavior:contain; scroll-snap-type:y mandatory; scrollbar-width:none; touch-action:pan-y; }.swipe-wheel::-webkit-scrollbar { display:none; }.swipe-wheel i,.swipe-wheel button { display:block; width:100%; height:34px; border:0; padding:0; background:transparent; scroll-snap-align:center; }.swipe-wheel button { color:#789087; font:700 14px "DM Mono",monospace; }.swipe-wheel button.is-selected { color:#173f37; background:#d6e9dc; border-radius:7px; font-weight:900; }.planning-capture .swipe-reminder-trigger { min-height:32px; padding:7px 9px; border:0; border-left:1px solid var(--line); border-radius:0; background:transparent; font-size:11px; }.planning-capture .swipe-reminder-wheels { position:absolute; z-index:4; width:min(430px,calc(100vw - 44px)); margin-top:5px; box-shadow:0 12px 25px #163f3826; }.planning-capture .swipe-reminder { position:relative; }.swipe-reminder.compact .swipe-reminder-clear { position:absolute; right:0; top:-22px; }.swipe-reminder.compact[data-active="true"] .swipe-reminder-trigger { color:#1c594b; background:#e3f0e5; }
.section-lead { max-width:560px; margin:13px 0 0; color:#647b72; font-size:13px; line-height:1.55; }.tax-reserve { display:flex; justify-content:space-between; align-items:center; gap:18px; margin:18px 0; padding:18px 20px; border-radius:var(--radius); color:#654d29; background:#f3e3bc; }.tax-reserve span { display:block; font:10px "DM Mono",monospace; text-transform:uppercase; }.tax-reserve strong { display:block; margin-top:3px; font:600 27px "Playfair Display",serif; }.tax-reserve p { margin:4px 0 0; color:#81693e; font-size:10px; }.walk-panel,.word-card,.word-form { border-radius:var(--radius); background:var(--surface); }.walk-panel { max-width:560px; padding:30px; text-align:center; border:1px solid var(--line); }.walk-state { color:#618076; font:10px "DM Mono",monospace; text-transform:uppercase; }.walk-panel > strong { display:block; margin:15px 0 0; font:600 78px/.9 "Playfair Display",serif; letter-spacing:-.08em; }.walk-panel > small { color:#778b82; font:11px "DM Mono",monospace; }.walk-metrics { display:flex; justify-content:center; gap:28px; margin:25px 0; }.walk-metrics span { display:grid; gap:3px; color:#789087; font-size:10px; }.walk-metrics b { color:var(--ink); font:500 18px "DM Mono",monospace; }.walk-panel > p { margin:15px 0 0; color:#80928b; font-size:10px; }.word-card { max-width:600px; padding:29px; color:#173f37; background:#d9eadf; }.word-card > span { color:#527268; font:10px "DM Mono",monospace; text-transform:uppercase; }.word-card strong { display:block; margin-top:23px; font:600 44px/1 "Playfair Display",serif; letter-spacing:-.06em; }.word-card p { margin:8px 0 23px; color:#4e7067; font-size:15px; }.word-card > div { display:flex; gap:9px; }.word-form { display:grid; grid-template-columns:1fr 1fr 120px auto; gap:12px; align-items:end; max-width:920px; margin-top:18px; padding:18px; border:1px solid var(--line); }.word-form label { display:grid; gap:6px; color:#647970; font:700 9px "DM Mono",monospace; text-transform:uppercase; }.word-form input,.word-form select { border:1px solid #c7d5ca; border-radius:7px; padding:10px; color:var(--ink); background:#fbfcf9; font:12px Manrope,sans-serif; }.control-nav { color:#315e54; }.command-grid,.device-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }.command-card,.device-card,.ai-console,.command-history,.automation-card,.security-note { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }.command-card { min-height:204px; padding:20px; display:flex; flex-direction:column; }.command-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:9px; color:#275f51; background:#dfede3; font:16px "DM Mono",monospace; }.command-card h2,.device-card h2 { margin:18px 0 7px; font-size:18px; letter-spacing:-.04em; }.command-card p,.device-card p { margin:0; color:#61776e; font-size:11px; line-height:1.5; }.command-card .primary-button { align-self:flex-start; margin-top:auto; padding:9px 12px; box-shadow:none; }.command-history { margin-top:20px; padding:20px; }.log-entry { display:grid; grid-template-columns:11px minmax(0,1fr) auto; align-items:start; gap:10px; padding:13px 0; border-bottom:1px solid var(--line); }.log-entry:last-child { border-bottom:0; }.status-dot { display:block; width:8px; height:8px; margin-top:5px; border-radius:50%; background:#c5d2ca; }.status-dot.ok { background:#3c8870; box-shadow:0 0 0 3px #dbeee2; }.status-dot.waiting { background:#dda63d; box-shadow:0 0 0 3px #f7eacb; }.log-entry b { font-size:11px; }.log-entry p { margin:3px 0 0; color:#6c8178; font-size:10px; }.log-entry time { color:#84968e; font:9px "DM Mono",monospace; white-space:nowrap; }.ai-console { padding:22px; }.ai-status { display:flex; gap:11px; align-items:flex-start; padding-bottom:17px; border-bottom:1px solid var(--line); }.ai-status b { font-size:12px; }.ai-status p { margin:3px 0 0; color:#6c8178; font-size:11px; }.ai-console form { margin-top:16px; }.ai-console textarea { width:100%; min-height:118px; resize:vertical; border:1px solid #c7d5ca; border-radius:10px; padding:13px; color:var(--ink); background:#fbfcf9; font:13px Manrope,sans-serif; }.ai-console form > div { display:flex; justify-content:space-between; align-items:end; gap:12px; margin-top:12px; }.ai-console label,.automation-form label { display:grid; gap:6px; color:#647970; font:700 9px "DM Mono",monospace; letter-spacing:.04em; text-transform:uppercase; }.ai-console select,.automation-form select { border:1px solid #c7d5ca; border-radius:7px; padding:8px 10px; color:var(--ink); background:#fbfcf9; font:11px Manrope,sans-serif; }.device-card { min-height:154px; padding:19px; }.device-top { display:flex; justify-content:space-between; align-items:center; color:#678078; font:9px "DM Mono",monospace; text-transform:uppercase; }.device-top .status-dot { margin:0; }.device-card footer { margin-top:18px; color:#487166; font-size:10px; font-weight:800; }.device-card.off { background:#f2eee9; }.security-note { display:flex; gap:14px; align-items:flex-start; margin-top:20px; padding:18px 20px; background:#f0e6da; border-color:#e5d2bd; }.security-note > span { display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:50%; color:#805f38; background:#fff7ed; }.security-note b { font-size:12px; }.security-note p { margin:4px 0 0; color:#766552; font-size:11px; line-height:1.5; }.automation-form { display:grid; grid-template-columns:1fr 1fr auto; gap:12px; align-items:end; padding:18px; border-radius:var(--radius); background:#e7efe9; }.automation-list { display:grid; gap:10px; margin-top:16px; }.automation-card { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:17px 19px; }.automation-card span { color:#6b8379; font:9px "DM Mono",monospace; text-transform:uppercase; }.automation-card h2 { margin:5px 0 0; font-size:14px; }.switch { display:flex; align-items:center; gap:8px; color:#6c8078; font-size:10px; font-weight:800; white-space:nowrap; }.switch input { position:absolute; opacity:0; }.switch i { width:30px; height:17px; position:relative; border-radius:20px; background:#c8d5cc; }.switch i::after { content:""; position:absolute; top:3px; left:3px; width:11px; height:11px; border-radius:50%; background:#fff; transition:.2s; }.switch input:checked + i { background:#438773; }.switch input:checked + i::after { transform:translateX(13px); }
body.focus-mode .sidebar, body.focus-mode .capture, body.focus-mode .areas-strip, body.focus-mode .day-aside, body.focus-mode .page-heading > .primary-button { display:none; } body.focus-mode .app-shell { display:block; } body.focus-mode main { max-width:750px; padding-top:8vh; } body.focus-mode .today-grid { display:block; } body.focus-mode .tasks-panel { border-top:0; } body.focus-mode::before { content:"Режим фокуса"; position:fixed; z-index:5; top:18px; right:22px; color:#698078; font:10px "DM Mono",monospace; }
@media (max-width:850px) { .app-shell { display:block; }.sidebar { display:none; position:fixed; z-index:10; width:260px; }.sidebar.open { display:flex; }.mobile-menu { display:block; }.topbar { min-height:75px; }.date-block { margin-right:auto; margin-left:15px; }.page-heading { padding:36px 0 23px; }.today-grid { grid-template-columns:1fr; }.day-aside { grid-template-columns:1fr 1fr; }.area-cards { grid-template-columns:repeat(2,1fr); }.project-grid,.command-grid,.device-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) { main { padding:0 19px 38px; }.page-heading { align-items:flex-start; }.page-heading .primary-button { padding:10px; font-size:0; }.page-heading .primary-button::after { content:"+"; font-size:20px; }.capture { grid-template-columns:1fr auto; gap:10px; }.capture label { display:none; }.planning-capture { grid-template-columns:1fr auto; }.planning-capture select { grid-column:1; border:0; padding:4px 0; }.income-form { grid-template-columns:1fr; }.income-form .primary-button { justify-self:start; font-size:12px; }.income-form .primary-button::after { content:none; }.income-totals { grid-template-columns:1fr; }.income-bars { gap:4px; }.income-bar small { font-size:7px; transform:rotate(-36deg); transform-origin:top center; }.day-aside { grid-template-columns:1fr; }.area-cards,.project-grid,.command-grid,.device-grid,.areas-dashboard,.review-grid,.plan-grid,.idea-list,.word-form { grid-template-columns:1fr; }.automation-form { grid-template-columns:1fr; }.ai-console form > div { align-items:stretch; flex-direction:column; }.log-entry { grid-template-columns:11px minmax(0,1fr); }.log-entry time { grid-column:2; }.area-card { padding:14px; }.review-main strong { font-size:70px; }.task { grid-template-columns:27px minmax(0,1fr) auto; }.task-meta { grid-column:2; justify-self:start; }.focus-card { min-height:165px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; transition-duration:.01ms!important; } }

/* Reminder controls are deliberately arranged in full-width rows, never five cramped columns. */
.swipe-reminder-wheels { display:grid; grid-template-columns:1fr; gap:13px; }
.swipe-wheel-row { display:grid; gap:9px; }
.swipe-wheel-date,.swipe-wheel-time { grid-template-columns:1fr; }
.swipe-wheel-row > div { min-width:0; text-align:center; }
.swipe-wheel-row > div > span { display:block; margin-bottom:5px; color:#526f65; font:700 11px "DM Mono",monospace; text-transform:uppercase; }
.swipe-wheel { height:116px; }
.swipe-wheel i,.swipe-wheel button { height:38px; }
.swipe-wheel button { font-size:17px; }
.income-form .form-reminder-field { grid-column:1 / -1; }