:root {
  --paper: #f4f1ea;
  --surface: #fbfaf6;
  --surface-strong: #ffffff;
  --ink: #222520;
  --muted: #777970;
  --line: #dedbd2;
  --accent: #d85a3a;
  --accent-dark: #b8442a;
  --sage: #657b65;
  --blue: #577487;
  --yellow: #d8a94b;
  --shadow: 0 18px 60px rgba(39, 36, 29, .10);
  --radius: 18px;
}

[data-theme="ocean"] { --paper:#edf4f4; --surface:#f7fbfb; --surface-strong:#fff; --ink:#18343b; --muted:#698087; --line:#d4e2e2; --accent:#287b8d; --accent-dark:#176676; --sage:#4d6d8a; --blue:#557e96; --yellow:#c79a49; }
[data-theme="forest"] { --paper:#f0f2e9; --surface:#f8f9f3; --surface-strong:#fff; --ink:#263329; --muted:#748077; --line:#d9dfd2; --accent:#3f7457; --accent-dark:#2e6044; --sage:#71845d; --blue:#627c78; --yellow:#b68a48; }
[data-theme="violet"] { --paper:#f4f0f7; --surface:#faf8fc; --surface-strong:#fff; --ink:#302b38; --muted:#7d7487; --line:#e0d8e6; --accent:#7158a5; --accent-dark:#5c438f; --sage:#a05d76; --blue:#6576a7; --yellow:#c4964e; }
[data-theme="graphite"] { --paper:#eef0f1; --surface:#f8f9f9; --surface-strong:#fff; --ink:#242a2d; --muted:#737c80; --line:#d9dddf; --accent:#3c4348; --accent-dark:#272d31; --sage:#66766f; --blue:#5c7482; --yellow:#b06c4f; }

* { box-sizing: border-box; }
html { background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif; min-height: 100vh; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid rgba(216,90,58,.22); outline-offset: 2px; }
.hidden { display: none !important; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 250px 1fr; }
.sidebar { position: sticky; top: 0; height: 100vh; height: 100dvh; border-right: 1px solid var(--line); padding: 28px 18px 20px; display: flex; flex-direction: column; background: rgba(251,250,246,.78); backdrop-filter: blur(18px); z-index: 20; }
.sidebar-scrim { display:none; position:fixed; inset:0; z-index:19; border:0; background:rgba(29,28,24,.28); backdrop-filter:blur(2px); }
.brand { display: flex; align-items: center; gap: 12px; padding: 0 8px 18px; }
.brand-mark { display: grid; place-items: center; width: 40px; height: 40px; color: white; background: var(--accent); border-radius: 13px 13px 13px 4px; font-family: Georgia, serif; font-size: 20px; box-shadow: 0 8px 24px rgba(216,90,58,.24); }
.brand strong, .brand span { display: block; }
.brand strong { font-family: Georgia, "Songti SC", serif; font-size: 20px; letter-spacing: .08em; }
.brand span { color: var(--muted); font-size: 11px; margin-top: 2px; }
.nav { display: grid; gap: 5px; }
.nav-section-title{padding-top:2px}.nav-section-title button{font-size:10px;letter-spacing:0;padding:3px 7px;border:1px solid var(--line);border-radius:7px}.nav.compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 12px;padding:3px 5px}.nav.compact .nav-item{position:relative;display:flex;width:78px;height:78px;justify-self:center;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:9px;border:1px solid rgba(255,255,255,.82);border-radius:50%;color:#4f544e;text-align:center;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,255,255,.48));box-shadow:0 8px 22px rgba(45,42,35,.075),inset 0 1px 0 rgba(255,255,255,.9);font-size:10px;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.nav.compact .nav-icon{display:block;line-height:1;font-size:17px}.nav.compact .nav-label{display:block;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:600;letter-spacing:.01em}.nav.compact .nav-item:hover{color:var(--accent-dark);transform:translateY(-2px);box-shadow:0 12px 27px rgba(45,42,35,.11),inset 0 1px 0 rgba(255,255,255,.95)}.nav.compact .nav-item.active{color:white;border-color:rgba(255,255,255,.28);background:linear-gradient(145deg,var(--accent),var(--accent-dark));box-shadow:0 11px 25px rgba(216,90,58,.25),inset 0 1px 0 rgba(255,255,255,.25)}.nav.compact .nav-item b{position:absolute;top:-2px;right:-1px;display:grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border:2px solid var(--surface);border-radius:12px;color:var(--accent-dark);background:var(--surface-strong);box-shadow:0 4px 10px rgba(0,0,0,.12);font-size:8px}.nav.compact .nav-item.active b{color:var(--accent-dark);background:white}
.nav-item { width: 100%; border: 0; background: transparent; border-radius: 11px; padding: 11px 12px; display: grid; grid-template-columns: 22px 1fr auto; gap: 7px; align-items: center; text-align: left; cursor: pointer; color: #595c54; transition: .18s ease; }
.nav-item:hover { background: rgba(255,255,255,.7); color: var(--ink); }
.nav-item.active { color: var(--accent-dark); background: #eee4da; font-weight: 650; }
.nav-item b { font-size: 11px; min-width: 22px; text-align: center; padding: 2px 6px; background: rgba(0,0,0,.05); border-radius: 10px; }
.nav .nav-item b { color: #fff; background: #ff3b30; box-shadow: 0 3px 8px rgba(255,59,48,.25); }
.nav.compact .nav-item b,
.nav.compact .nav-item.active b { color: #fff; background: #ff3b30; box-shadow: 0 4px 10px rgba(255,59,48,.3); }
.sidebar-section { margin-top: 16px; min-height: 120px; flex:1; display:flex; flex-direction:column; overflow:hidden; }
.section-title { padding: 0 10px 8px; display: flex; align-items: center; justify-content: space-between; text-transform: uppercase; letter-spacing: .12em; font-size: 10px; color: var(--muted); }
.section-title button { border: 0; background: none; cursor: pointer; font-size: 18px; color: var(--muted); }
.list-nav { display: grid; align-content:start; gap: 2px; min-height:0; flex:1; overflow-x:hidden; overflow-y:auto; scrollbar-gutter:stable; }
.list-item { display: flex; align-items: center; gap: 9px; min-width:0; padding: 9px 11px; cursor: pointer; border-radius: 9px; font-size: 13px; }
.list-item:hover { background: rgba(255,255,255,.65); }
.list-item.active { color:var(--accent-dark); background:rgba(216,90,58,.1); font-weight:650; }
.list-dot { width: 8px; height: 8px; flex:0 0 8px; border-radius: 50%; }
.list-item>span { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.list-item em { flex:0 0 auto; margin-left: auto; min-width:20px; text-align:right; font-style: normal; color: var(--muted); font-size: 11px; }
.sidebar-bottom { margin-top: auto; border-top: 1px solid var(--line); padding-top: 14px; display: grid; }
.plain-button { border: 0; background: transparent; text-align: left; padding: 8px 10px; color: var(--muted); font-size: 12px; cursor: pointer; border-radius: 8px; }
.plain-button:hover { color: var(--ink); background: rgba(255,255,255,.7); }
.import-label input { display: none; }

.main { min-width: 0; }
.topbar { height: 88px; display: flex; align-items: center; gap: 20px; justify-content: space-between; padding: 0 clamp(24px,4vw,62px); border-bottom: 1px solid rgba(222,219,210,.65); }
.date-block span, .date-block strong { display: block; }
.date-block span { font-size: 11px; letter-spacing: .1em; color: var(--muted); text-transform: uppercase; }
.date-block strong { margin-top: 3px; font-family: Georgia, "Songti SC", serif; font-size: 21px; font-weight: 600; }
.top-actions { display: flex; gap: 10px; align-items: center; }
.primary-button, .secondary-button, .danger-button, .search-button, .icon-button { border: 0; cursor: pointer; border-radius: 10px; }
.primary-button { padding: 10px 16px; color: white; background: var(--accent); box-shadow: 0 7px 18px rgba(216,90,58,.20); }
.primary-button:hover { background: var(--accent-dark); }
.secondary-button { padding: 10px 16px; background: #ebe8df; }
.danger-button { padding: 10px 16px; background: #f7dfda; color: #a53b2b; }
.icon-button { width: 36px; height: 36px; background: transparent; font-size: 20px; }
.settings-button { min-width: 116px; height: 38px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: rgba(255,255,255,.72); box-shadow: 0 3px 12px rgba(45,42,35,.05); cursor: pointer; }
.settings-button span { font-size: 16px; line-height: 1; }
.settings-button strong { font-size: 11px; font-weight: 650; white-space: nowrap; }
.settings-button:hover { color: var(--accent-dark); background: var(--surface-strong); }
.search-button { min-width: 190px; display: flex; gap: 8px; align-items: center; padding: 9px 10px; background: rgba(255,255,255,.62); border: 1px solid var(--line); color: var(--muted); text-align: left; }
.search-button span { flex: 1; }
kbd { padding: 1px 6px; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 5px; background: var(--surface); font-size: 11px; }
.menu-button { display: none; }
.view-root { padding: 38px clamp(24px,4vw,62px) 70px; max-width: 1500px; margin: auto; }

.view-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.eyebrow { display: block; color: var(--accent); text-transform: uppercase; font-size: 10px; letter-spacing: .16em; font-weight: 750; margin-bottom: 7px; }
.view-heading h1 { margin: 0; font-family: Georgia, "Songti SC", serif; font-size: clamp(32px,4vw,52px); font-weight: 500; letter-spacing: -.03em; }
.view-heading p { margin: 8px 0 0; color: var(--muted); max-width: 580px; }
.progress-ring { --p: 0; width: 76px; height: 76px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--accent) calc(var(--p)*1%), #dedbd2 0); position: relative; }
.progress-ring::before { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: var(--paper); }
.progress-ring span { position: relative; font-family: Georgia, serif; font-size: 18px; }

.today-grid { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(280px,.55fr); gap: 22px; align-items: start; }
.panel { background: rgba(255,255,255,.58); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 32px rgba(40,35,25,.035); overflow: hidden; }
.panel-head { padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.panel-head h2 { margin: 0; font-size: 14px; letter-spacing: .02em; }
.panel-head span { color: var(--muted); font-size: 12px; }
.task-list { min-height: 90px; }
.task-row { display: grid; grid-template-columns: 26px 1fr auto; gap: 12px; padding: 15px 20px; align-items: start; border-bottom: 1px solid rgba(222,219,210,.7); transition: .18s ease; cursor: pointer; }
.task-row:last-child { border-bottom: 0; }
.task-row:hover { background: rgba(255,255,255,.76); }
.task-check { margin-top: 2px; width: 19px; height: 19px; border-radius: 7px; border: 1.5px solid #aaa9a1; background: transparent; cursor: pointer; position: relative; }
.task-check.checked { border-color: var(--sage); background: var(--sage); }
.task-check.checked::after { content: "✓"; color: white; position: absolute; font-size: 12px; left: 3px; top: -1px; }
.task-content strong { display: block; font-size: 14px; font-weight: 590; line-height: 1.4; }
.task-content strong.done { color: #9a9b94; text-decoration: line-through; }
.task-meta { margin-top: 6px; display: flex; gap: 9px; align-items: center; flex-wrap: wrap; color: var(--muted); font-size: 11px; }
.tag { padding: 2px 7px; border-radius: 10px; background: #ece9df; }
.rollover-tag { padding:2px 7px; border-radius:10px; color:var(--accent-dark); background:rgba(216,90,58,.1); }
.priority-line { width: 3px; min-height: 42px; border-radius: 5px; background: transparent; }
.priority-high { background: #cb4938; }.priority-medium { background: var(--yellow); }.priority-low { background: var(--blue); }
.task-actions { display: flex; align-items: center; gap: 8px; }
.focus-mini { border: 1px solid var(--line); color: var(--muted); background: transparent; border-radius: 8px; padding: 5px 8px; cursor: pointer; font-size: 11px; }
.empty-state { padding: 38px 20px; text-align: center; color: var(--muted); }
.empty-state strong { display: block; color: var(--ink); margin-bottom: 5px; }
.agenda-note { padding: 20px; background: var(--ink); color: white; border-radius: var(--radius); min-height: 180px; position: relative; overflow: hidden; }
.agenda-note::after { content: ""; width: 130px; height: 130px; position: absolute; right: -45px; bottom: -58px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; box-shadow: 0 0 0 25px rgba(255,255,255,.03), 0 0 0 50px rgba(255,255,255,.025); }
.agenda-note span { font-size: 10px; color: #c8c8c0; text-transform: uppercase; letter-spacing: .14em; }
.agenda-note h3 { font-family: Georgia, "Songti SC", serif; font-size: 23px; font-weight: 500; margin: 12px 0 8px; }
.agenda-note p { color: #c8c8c0; font-size: 12px; line-height: 1.7; max-width: 240px; }
.metric-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin-top: 14px; }
.metric-card { padding: 16px; background: rgba(255,255,255,.62); border: 1px solid var(--line); border-radius: 14px; }
.metric-card span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.metric-card strong { display: block; margin-top: 7px; font-family: Georgia, serif; font-size: 25px; font-weight: 500; }

.board { display: grid; grid-template-columns: repeat(3,minmax(250px,1fr)); gap: 16px; align-items: start; overflow-x: auto; padding-bottom: 10px; }
.board-column { min-width: 270px; background: rgba(255,255,255,.38); border: 1px solid var(--line); border-radius: 16px; }
.board-head { padding: 16px; display: flex; justify-content: space-between; font-size: 12px; font-weight: 650; }
.board-head b { color: var(--muted); }
.board-body { min-height: 180px; padding: 0 10px 12px; }
.task-card { background: var(--surface-strong); border: 1px solid rgba(222,219,210,.8); border-radius: 12px; padding: 14px; margin-bottom: 9px; box-shadow: 0 6px 18px rgba(30,25,20,.04); cursor: grab; }
.task-card:active { cursor: grabbing; }.task-card.dragging { opacity: .42; }.board-body.drag-over { background: rgba(216,90,58,.06); border-radius: 10px; }
.task-card h3 { margin: 5px 0 12px; font-size: 13px; font-weight: 590; }
.card-top, .card-bottom { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: 10px; }
.card-list { display: flex; align-items: center; gap: 5px; }

.calendar-toolbar { display: flex; gap: 8px; align-items: center; }
.calendar-title { min-width: 130px; text-align: center; font-family: Georgia, serif; font-size: 18px; }
.calendar-grid { display: grid; grid-template-columns: repeat(7,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: var(--line); gap: 1px; }
.weekday { padding: 10px; background: var(--paper); color: var(--muted); font-size: 10px; text-align: center; text-transform: uppercase; }
.calendar-day { min-height: 120px; background: var(--surface); padding: 9px; cursor: pointer; }
.calendar-day.other { color: #aaa; background: #f6f4ee; }.calendar-day.today .day-number { background: var(--accent); color: white; }
.day-number { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; font-size: 11px; }
.day-tasks { margin-top: 5px; display: grid; gap: 4px; }
.day-task { padding: 4px 6px; border-left: 2px solid var(--sage); border-radius: 3px; background: #ebece5; font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.focus-layout { display: grid; grid-template-columns: minmax(300px,.85fr) minmax(280px,1.15fr); gap: 24px; }
.timer-card { padding: 34px; text-align: center; background: var(--ink); color: white; border-radius: 28px; box-shadow: var(--shadow); }
.timer-mode { color: #c7c7bf; font-size: 11px; letter-spacing: .13em; text-transform: uppercase; }
.timer-display { margin: 30px 0 22px; font: 500 clamp(64px,9vw,110px)/1 Georgia, serif; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.timer-task { color: #c7c7bf; min-height: 21px; }.timer-task small { display:block; margin-top:7px; color:rgba(255,255,255,.45); font-size:10px; }
.timer-actions { margin-top: 28px; display: flex; justify-content: center; gap: 12px; }
.timer-actions button { border: 1px solid rgba(255,255,255,.2); background: transparent; color: white; border-radius: 50%; width: 52px; height: 52px; cursor: pointer; }
.timer-actions .timer-main { width: 72px; height: 72px; background: var(--accent); border: 0; font-size: 22px; }
.focus-list { padding: 24px; }
.focus-list h2 { font-family: Georgia, serif; font-size: 25px; font-weight: 500; margin: 0 0 18px; }
.focus-option { display: flex; gap: 11px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.focus-option input { accent-color: var(--accent); }
.manual-log-panel{margin-top:18px}.manual-log-row{display:grid;grid-template-columns:1fr auto auto;gap:15px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--line)}.manual-log-row:last-child{border-bottom:0}.manual-log-row strong,.manual-log-row span{display:block}.manual-log-row strong{font-size:12px}.manual-log-row span{margin-top:3px;color:var(--muted);font-size:9px}.manual-log-row>b{font:500 14px Georgia,serif}.delete-log{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:16px}.delete-log:hover{color:#a53b2b}

.habit-grid { display: grid; gap: 12px; }
.habit-row { display: grid; grid-template-columns: 1fr repeat(7,42px) 70px; gap: 8px; align-items: center; padding: 15px 18px; background: rgba(255,255,255,.55); border: 1px solid var(--line); border-radius: 14px; }
.habit-name strong, .habit-name span { display: block; }.habit-name span { color: var(--muted); font-size: 10px; margin-top: 3px; }
.habit-day { text-align: center; }.habit-day small { display: block; color: var(--muted); font-size: 8px; margin-bottom: 5px; }.habit-check { width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); cursor: pointer; }.habit-check.done { color: white; background: var(--sage); border-color: var(--sage); }
.streak { text-align: right; font-family: Georgia, serif; color: var(--accent); }

.insight-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }
.insight-card { padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.56); }
.insight-card span { color: var(--muted); font-size: 11px; }.insight-card strong { display: block; margin-top: 10px; font: 500 36px Georgia, serif; }.insight-card em { font-style: normal; color: var(--sage); font-size: 11px; }
.chart-panel { margin-top: 18px; padding: 24px; }.chart-panel h2 { margin: 0 0 22px; font-family: Georgia, serif; font-weight: 500; }
.bar-chart { height: 220px; display: grid; grid-template-columns: repeat(7,1fr); gap: 16px; align-items: end; border-bottom: 1px solid var(--line); }
.bar-wrap { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 7px; }
.bar { width: min(44px,70%); min-height: 4px; border-radius: 8px 8px 2px 2px; background: var(--sage); transition: height .4s ease; }.bar-wrap span { color: var(--muted); font-size: 10px; }
.review-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:18px; margin-top:18px; align-items:stretch; }.review-grid .chart-panel { margin-top:0; }
.progress-panel { padding-bottom:8px; }.progress-row { display:grid; grid-template-columns:145px 1fr 42px; align-items:center; gap:14px; padding:13px 18px; border-bottom:1px solid var(--line); }.progress-row:last-child{border-bottom:0}.progress-row strong,.progress-row span{display:block}.progress-row strong{font-size:11px}.progress-row span{margin-top:3px;color:var(--muted);font-size:9px}.progress-row>b{text-align:right;font:500 13px Georgia,serif}.progress-track,.focus-stat-track{height:6px;overflow:hidden;border-radius:6px;background:var(--line)}.progress-track i,.focus-stat-track i{display:block;height:100%;border-radius:inherit;background:var(--accent)}
.focus-breakdown { margin-top:18px; padding-bottom:8px; }.focus-stat { display:grid; grid-template-columns:minmax(170px,.4fr) 1fr; align-items:center; gap:20px; padding:14px 20px; border-bottom:1px solid var(--line); }.focus-stat:last-child{border-bottom:0}.focus-stat strong,.focus-stat span{display:block}.focus-stat strong{font-size:12px}.focus-stat span{margin-top:3px;color:var(--muted);font-size:10px}.focus-stat-track i{background:var(--sage)}

.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(29,28,24,.43); backdrop-filter: blur(7px); }
.modal { width: min(650px,100%); max-height: 92vh; overflow: auto; padding: 26px; background: var(--surface); border-radius: 22px; box-shadow: var(--shadow); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 22px; }.modal-head h2 { margin: 0; font-family: Georgia, "Songti SC", serif; font-weight: 500; font-size: 27px; }
.task-form label { display: grid; gap: 7px; margin-bottom: 15px; color: var(--muted); font-size: 11px; }
.task-form input, .task-form textarea, .task-form select, .project-form input, .project-form textarea, .project-form select, .search-input-wrap input { width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: 10px 11px; background: white; color: var(--ink); }
.task-form textarea { resize: vertical; }.form-grid { display: grid; grid-template-columns: repeat(2,1fr); column-gap: 14px; }.modal-actions { display: flex; align-items: center; gap: 8px; }.modal-actions span { flex: 1; }
.project-form label { display:grid; gap:7px; margin-bottom:15px; color:var(--muted); font-size:11px; }.project-form label small{font-size:9px;line-height:1.5;color:var(--muted)}.project-form textarea{resize:vertical}.project-form input[type="color"]{height:41px;padding:5px;cursor:pointer}
.batch-form label,.manual-time-form label{display:grid;gap:7px;margin-bottom:15px;color:var(--muted);font-size:11px}.batch-form textarea,.manual-time-form input,.manual-time-form select,.batch-form input,.batch-form select{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 11px;background:white;color:var(--ink)}.batch-form textarea{resize:vertical}.batch-form label>small{color:var(--muted);font-size:9px}
.weekday-field { margin:0 0 18px; padding:14px; border:1px solid var(--line); border-radius:12px; }.weekday-field legend { padding:0 5px; color:var(--muted); font-size:10px; }.weekday-field>small{display:block;margin-top:10px;color:var(--muted);font-size:9px;line-height:1.5}.weekday-picker{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.weekday-picker label{margin:0}.weekday-picker input{position:absolute;opacity:0;pointer-events:none}.weekday-picker span{display:grid;place-items:center;height:34px;border:1px solid var(--line);border-radius:9px;background:white;cursor:pointer}.weekday-picker input:checked+span{color:white;background:var(--accent);border-color:var(--accent)}
.repeat-tag,.project-tag{padding:2px 7px;border-radius:10px;background:rgba(87,116,135,.1);color:var(--blue)}

.project-grid { display:grid; grid-template-columns:repeat(3,minmax(240px,1fr)); gap:16px; }.project-card { padding:20px; border:1px solid var(--line); border-radius:17px; background:rgba(255,255,255,.6); cursor:pointer; transition:.2s ease; }.project-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.project-card-top{display:flex;justify-content:space-between;align-items:center}.project-color{width:11px;height:11px;border-radius:50%}.project-state{color:var(--muted);font-size:9px}.project-card h2{margin:18px 0 7px;font:500 23px Georgia,"Songti SC",serif}.project-card p{height:38px;margin:0;color:var(--muted);font-size:11px;line-height:1.7;overflow:hidden}.project-progress{margin-top:22px}.project-progress-head{display:flex;justify-content:space-between;margin-bottom:8px;font-size:10px}.project-progress-track{height:7px;border-radius:7px;background:var(--line);overflow:hidden}.project-progress-track i{display:block;height:100%;border-radius:inherit}.project-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:17px}.project-metrics div{padding:9px;border-radius:9px;background:rgba(0,0,0,.025)}.project-metrics span,.project-metrics strong{display:block}.project-metrics span{color:var(--muted);font-size:8px}.project-metrics strong{margin-top:3px;font:500 15px Georgia,serif}.project-detail-head{display:flex;gap:15px;align-items:center;margin-bottom:20px}.back-button{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:8px 11px;cursor:pointer}.project-summary{display:grid;grid-template-columns:1.3fr repeat(3,.4fr);gap:12px;margin-bottom:18px}.project-summary>div{padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.55)}.project-summary span,.project-summary strong{display:block}.project-summary span{color:var(--muted);font-size:9px}.project-summary strong{margin-top:7px;font:500 23px Georgia,serif}.project-summary .wide strong{font-family:inherit;font-size:13px}.project-empty{grid-column:1/-1}
.project-period-mini{margin-top:14px;padding:10px 11px;border-radius:10px;background:rgba(0,0,0,.025)}.project-period-mini span,.project-period-mini strong{display:block}.project-period-mini span{margin-bottom:4px;color:var(--muted);font-size:8px}.project-period-mini strong{font-size:10px;line-height:1.5}.project-state.running{padding:4px 8px;border-radius:10px;color:var(--sage);background:rgba(101,123,101,.11)}.project-cycle-panel{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center;margin-bottom:14px;padding:17px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.56)}.project-cycle-panel>div span,.project-cycle-panel>div strong,.project-cycle-panel>div small{display:block}.project-cycle-panel>div span{color:var(--muted);font-size:9px}.project-cycle-panel>div strong{margin-top:5px;font-size:12px}.project-cycle-panel>div small{margin-top:4px;color:var(--sage);font-size:9px}.project-cycle-button{min-width:110px}.project-ended{padding:8px 12px;border-radius:10px;color:var(--sage);background:rgba(101,123,101,.1);font-size:10px;font-weight:650}
.search-modal { padding: 0; align-self: start; margin-top: 10vh; }.search-input-wrap { display: grid; grid-template-columns: 24px 1fr 36px; gap: 8px; align-items: center; padding: 15px; border-bottom: 1px solid var(--line); }.search-input-wrap input { border: 0; padding: 8px 0; background: transparent; font-size: 17px; }.search-results { max-height: 55vh; overflow: auto; }.search-result { padding: 13px 20px; border-bottom: 1px solid var(--line); cursor: pointer; }.search-result:hover { background: white; }.search-result strong { display: block; font-size: 13px; }.search-result span { color: var(--muted); font-size: 10px; }
.toast { position: fixed; z-index: 200; bottom: 26px; left: 50%; transform: translate(-50%,20px); opacity: 0; pointer-events: none; color: white; background: var(--ink); padding: 10px 16px; border-radius: 10px; font-size: 12px; transition: .25s ease; }.toast.show { opacity: 1; transform: translate(-50%,0); }

.settings-modal { width: min(760px,100%); }
.admin-label{display:inline-block;margin-bottom:7px;padding:4px 8px;border-radius:10px;color:var(--accent-dark);background:rgba(216,90,58,.1);font-size:9px;font-weight:700;letter-spacing:.08em}.non-admin-notice{margin-top:18px;padding:13px 15px;border:1px solid var(--line);border-radius:11px;color:var(--muted);background:rgba(0,0,0,.025);font-size:11px;line-height:1.7}
.settings-tabs{display:flex;gap:5px;margin:-5px 0 22px;padding:4px;border-radius:11px;background:rgba(0,0,0,.04)}.settings-tabs button{flex:1;border:0;border-radius:8px;padding:9px;background:transparent;color:var(--muted);cursor:pointer;font-size:12px}.settings-tabs button.active{background:var(--surface-strong);color:var(--ink);box-shadow:0 3px 10px rgba(0,0,0,.05)}.settings-pane>h3,.settings-form h3,.user-list-wrap h3{margin:0 0 6px;font:500 20px Georgia,"Songti SC",serif}.settings-pane>p,.settings-form>p{margin:0 0 18px;color:var(--muted);font-size:11px;line-height:1.6}.settings-actions{display:flex;gap:10px;flex-wrap:wrap;padding:22px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.45)}.settings-form{padding:19px 0;border-bottom:1px solid var(--line)}.settings-form label{display:grid;gap:6px;margin-bottom:12px;color:var(--muted);font-size:10px}.settings-form input{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:white;color:var(--ink)}.form-message{min-height:18px;color:var(--accent-dark);font-size:10px}.account-summary{padding:13px 15px;border-radius:12px;background:rgba(0,0,0,.035)}.account-summary span,.account-summary strong,.account-summary small{display:block}.account-summary span{color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.1em}.account-summary strong{margin-top:4px;font-size:15px}.account-summary small{margin-top:3px;color:var(--sage);font-size:9px}.admin-panel{border-top:1px solid var(--line);margin-top:18px}.user-list-wrap{padding-top:18px}.user-list{display:grid;gap:6px}.user-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.45)}.user-row strong,.user-row span{display:block}.user-row strong{font-size:12px}.user-row span{margin-top:2px;color:var(--muted);font-size:9px}.user-role{padding:3px 7px;border-radius:9px;color:var(--sage);background:rgba(101,123,101,.1);font-size:9px}.account-danger{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}.account-danger strong,.account-danger span{display:block}.account-danger strong{font-size:12px}.account-danger span{margin-top:3px;color:var(--muted);font-size:9px}
.theme-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; }
.theme-card { border: 1px solid var(--line); background: var(--surface-strong); padding: 14px 10px; border-radius: 13px; cursor: pointer; text-align: left; }
.theme-card:hover, .theme-card.active { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.theme-card i { display: flex; gap: 4px; margin-bottom: 13px; }.theme-card i b { width: 19px; height: 19px; border-radius: 50%; border: 1px solid rgba(0,0,0,.06); }.theme-card strong, .theme-card span { display:block; }.theme-card strong { font-size: 13px; }.theme-card span { margin-top: 3px; color: var(--muted); font-size: 9px; }

.auth-screen { position:fixed; inset:0; z-index:300; display:grid; grid-template-columns:minmax(340px,.9fr) minmax(440px,1.1fr); background:var(--paper); }
.auth-screen.ready { display:none; }
.auth-visual { position:relative; overflow:hidden; display:flex; flex-direction:column; padding:45px clamp(35px,6vw,80px); color:white; background:var(--ink); }
.auth-brand { display:flex; align-items:center; gap:12px; font:600 24px Georgia,"Songti SC",serif; letter-spacing:.08em; }
.auth-quote { position:relative; z-index:2; margin:auto 0; }.auth-quote>span { color:rgba(255,255,255,.55); font-size:10px; letter-spacing:.2em; }.auth-quote h1 { font:500 clamp(42px,5vw,70px)/1.15 Georgia,"Songti SC",serif; letter-spacing:-.04em; margin:17px 0 20px; }.auth-quote p { color:rgba(255,255,255,.6); line-height:1.8; max-width:420px; }
.auth-rings { position:absolute; width:420px; height:420px; right:-170px; bottom:-155px; border:1px solid rgba(255,255,255,.15); border-radius:50%; box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.02),0 0 0 165px rgba(255,255,255,.015); }
.auth-panel { display:grid; place-items:center; padding:30px; }.auth-card { width:min(410px,100%); }.auth-card h2 { font:500 36px Georgia,"Songti SC",serif; margin:0 0 8px; }.auth-card>p { color:var(--muted); font-size:13px; margin:0 0 30px; }.auth-card label { display:grid; gap:8px; margin-bottom:16px; color:var(--muted); font-size:11px; }.auth-card input { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--surface-strong); }.auth-submit { width:100%; margin-top:4px; padding:13px; }.auth-switch { text-align:center; margin-top:22px; color:var(--muted); font-size:12px; }.auth-switch button { border:0; background:transparent; color:var(--accent); cursor:pointer; }.auth-error { min-height:20px; color:#b8442a; font-size:11px; }
.sync-dot { display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:var(--sage); }

@media (max-width: 950px) {
  .app-shell { grid-template-columns: 1fr; }.sidebar { position: fixed; left: 0; transform: translateX(-105%); width:min(310px,86vw); transition:.25s ease; box-shadow: var(--shadow); }.sidebar.open { transform: translateX(0); }.sidebar.open+.sidebar-scrim{display:block}.menu-button { display: block; }.topbar { padding-left: 18px; }.date-block { margin-right: auto; }.today-grid, .focus-layout, .review-grid { grid-template-columns: 1fr; }.insight-grid { grid-template-columns: 1fr 1fr; }.project-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}.project-summary{grid-template-columns:repeat(3,1fr)}.project-summary .wide{grid-column:1/-1}
}
@media (max-width: 420px) {
  .topbar { padding-left:10px; padding-right:10px; }.topbar .date-block { display:none; }.top-actions{margin-left:auto;gap:5px}.menu-button,.search-button,.settings-button{width:34px;min-width:34px}.settings-button{padding:0}.settings-button strong{display:none}.top-actions>#quickAddBtn{width:36px;height:36px;padding:0;font-size:0;border-radius:50%}.top-actions>#quickAddBtn::after{content:'＋';font-size:19px}.task-row{grid-template-columns:25px minmax(0,1fr) auto;padding:13px 12px;gap:8px}.task-actions .focus-mini{padding:5px 6px;font-size:10px}.view-heading p{font-size:12px}.calendar-title{min-width:100px;font-size:15px}
}
@media (max-width: 650px) {
  .topbar { height: 76px; padding-right: 14px; gap: 7px; }.date-block span { display: none; }.date-block strong { font-size: 16px; }.search-button { min-width: 40px; width: 40px; }.search-button span, .search-button kbd { display: none; }.settings-button { width:34px; }.primary-button { padding: 10px 12px; }.view-root { padding: 26px 14px 55px; }.view-heading { align-items: flex-start; }.view-heading h1 { font-size: 34px; }.progress-ring { width: 60px; height: 60px; }.board { grid-template-columns: repeat(3,280px); }.calendar-day { min-height: 78px; padding: 4px; }.weekday { padding: 7px 2px; }.day-task { font-size: 0; width: 7px; height: 7px; border: 0; padding: 0; border-radius: 50%; background: var(--sage); display: inline-block; }.day-tasks { display: flex; flex-wrap: wrap; }.habit-row { grid-template-columns: 1fr repeat(7,28px); padding: 13px 10px; gap: 3px; }.habit-check { width: 23px; height: 23px; }.streak { grid-column: 1/-1; font-size: 11px; }.insight-grid { grid-template-columns: 1fr; }.form-grid { grid-template-columns: 1fr; }.modal { padding: 20px; }.metric-grid { grid-template-columns: 1fr 1fr; }.theme-grid { grid-template-columns:repeat(2,1fr); }
  .auth-screen { grid-template-columns:1fr; overflow:auto; }.auth-visual { min-height:220px; padding:26px; }.auth-brand { font-size:20px; }.auth-quote { margin:35px 0 10px; }.auth-quote h1 { font-size:36px; margin:10px 0; }.auth-quote p { font-size:11px; margin:0; }.auth-rings { width:260px; height:260px; }.auth-panel { padding:34px 22px; place-items:start center; }.auth-card h2 { font-size:30px; }.progress-row{grid-template-columns:110px 1fr 36px;padding:12px 10px;gap:8px}.focus-stat{grid-template-columns:1fr;gap:8px}.project-grid{grid-template-columns:1fr}.project-summary{grid-template-columns:1fr 1fr}.project-summary .wide{grid-column:1/-1}.project-cycle-panel{grid-template-columns:1fr}.project-cycle-button{width:100%}.weekday-picker{gap:4px}.weekday-picker span{height:31px}.manual-log-row{grid-template-columns:minmax(0,1fr) auto auto;padding:11px 12px;gap:8px}
}