:root{
  --bg:#f8fbf1;
  --panel:#fbfdf7;
  --ink:#17271a;
  --muted:#6b766b;
  --line:#dbe3d7;
  --accent:#769e6d;
  --accent-soft:#dce8d5;
  --hour-height:72px;
  --time-col:58px;
  --radius:18px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color-scheme: light;
}

/* Ensure overlays and dialogs using the HTML hidden attribute are truly hidden. */
[hidden]{display:none!important}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.app-shell{height:100dvh;display:flex;flex-direction:column;background:var(--bg);overflow:hidden}
.topbar{height:64px;display:grid;grid-template-columns:48px 1fr 84px;align-items:center;padding:8px 12px;border-bottom:1px solid var(--line);background:rgba(248,251,241,.96);backdrop-filter:blur(8px);z-index:60}
.icon-btn{border:0;background:transparent;color:var(--ink);font-size:34px;line-height:1;border-radius:12px;min-width:44px;min-height:44px}
.icon-btn:hover{background:var(--accent-soft)}
.week-title{border:0;background:transparent;color:var(--ink);font-weight:650;font-size:16px;text-align:center}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:4px}
.sync-dot{width:10px;height:10px;border-radius:50%;background:#c2c8c0;box-shadow:0 0 0 3px rgba(0,0,0,.03)}
.sync-dot.online{background:#70a46d}.sync-dot.offline{background:#c46e63}
.calendar-wrap{flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable}
.calendar{display:grid;grid-template-columns:var(--time-col) minmax(0,1fr);grid-template-rows:56px auto;width:100%;min-width:0;background:var(--panel)}
.corner{position:sticky;left:0;top:0;background:var(--panel);z-index:8;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.day-heads{position:sticky;top:0;z-index:7;display:grid;grid-template-columns:repeat(7,1fr);background:var(--panel);border-bottom:1px solid var(--line)}
.day-head{display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;border-top:5px solid #fff;border-right:1px solid var(--line);font-size:14px;gap:2px;overflow:hidden}
.day-head.has-items{border-top-color:#8f91cc}
.day-head.today{background:#eef5e9}.day-name{font-weight:600}.day-date{font-size:16px}
.time-labels{position:sticky;left:0;z-index:6;background:var(--panel);border-right:1px solid var(--line)}
.time-label{height:var(--hour-height);padding:8px 8px 0 0;text-align:right;color:#304534;font-size:14px;border-bottom:1px solid var(--line)}
.grid{position:relative;display:grid;grid-template-columns:repeat(7,1fr);height:calc(var(--hour-height) * 18);background:var(--panel)}
.day-col{position:relative;border-right:1px solid var(--line);background-image:linear-gradient(to bottom, transparent calc(var(--hour-height) - 1px), var(--line) calc(var(--hour-height) - 1px), var(--line) var(--hour-height));background-size:100% var(--hour-height)}
.day-col.today{background-color:#fbfdf5}
.slot-layer{position:absolute;inset:0}
.event{--event-gap:4px;--overlap-index:0;--overlap-count:1;position:absolute;left:calc((100% / var(--overlap-count)) * var(--overlap-index) + var(--event-gap));width:calc(100% / var(--overlap-count) - (var(--event-gap) * 2));right:auto;border:0;border-radius:5px;padding:5px 6px;text-align:left;color:#1b2230;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.10);font-size:12px;line-height:1.15;min-height:20px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.event:hover{filter:brightness(.98)}
.event-title{display:block;font-weight:650;overflow:hidden;text-overflow:ellipsis}.event-time{display:block;font-size:10px;opacity:.72;margin-top:2px}
.fab{position:fixed;right:20px;bottom:22px;width:58px;height:58px;border-radius:50%;border:0;background:var(--accent);color:white;font-size:32px;box-shadow:0 8px 24px rgba(36,61,34,.22);z-index:20}
.overlay{position:fixed;inset:0;background:var(--bg);z-index:100}
.editor{height:100%;display:flex;flex-direction:column;background:var(--bg)}
.editor-head{height:64px;display:grid;grid-template-columns:86px 1fr 86px;align-items:center;border-bottom:1px solid var(--line);padding:0 10px;background:var(--panel)}
.editor-head h1{font-size:18px;text-align:center;margin:0}.text-btn,.save-btn{border:0;background:transparent;min-height:44px;border-radius:10px}.save-btn{color:#446e42;font-weight:700}.text-btn{color:#536153}.editor-body{width:min(760px,100%);margin:0 auto;padding:20px 16px 48px;overflow:auto}.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}.field span{font-size:13px;font-weight:650;color:#506054}.field small{color:var(--muted);font-size:12px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field input,.field select,.field textarea{width:100%;border:1px solid #cfd9cc;border-radius:12px;background:white;color:var(--ink);padding:12px 13px;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:#88aa7d;box-shadow:0 0 0 3px rgba(118,158,109,.16)}.field textarea{resize:vertical;min-height:180px}.delete-btn{width:100%;border:1px solid #d4a39f;background:#fff8f7;color:#9d3c35;border-radius:12px;padding:13px;font-weight:650;margin-top:14px}
@media (max-width:760px){:root{--time-col:44px;--hour-height:72px}.topbar{height:58px}.editor-head{height:58px}.two-col{grid-template-columns:1fr 1fr}.fab{bottom:18px;right:16px}.day-head{font-size:11px}.day-date{font-size:14px}.time-label{font-size:11px;padding-right:5px}.event{--event-gap:1px;padding:3px 2px;font-size:10px;border-radius:4px}.event-time{font-size:8px}}
@media (max-width:430px){:root{--time-col:40px}.editor-body{padding:16px 14px 36px}.two-col{grid-template-columns:1fr}.notes-field textarea{min-height:220px}.day-head{font-size:10px}.day-date{font-size:13px}.event{font-size:9px;line-height:1.05}.event-time{display:none}}

.menu-btn{font-size:27px;font-weight:700;letter-spacing:1px}
.settings-screen{height:100%;display:flex;flex-direction:column;background:var(--bg)}
.settings-head{flex:0 0 auto}
.settings-body{display:flex;flex-direction:column;gap:16px}
.settings-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px}
.settings-card h2{font-size:17px;margin:0 0 8px;color:var(--ink)}
.settings-card p{margin:0 0 16px;color:#576458;font-size:14px;line-height:1.5}
.settings-card p:last-child{margin-bottom:0}
.primary-action,.secondary-action{width:100%;border-radius:12px;padding:13px 15px;font-weight:700;font-size:15px}
.primary-action{border:0;background:var(--accent);color:white}
.secondary-action{border:1px solid #b9c9b5;background:#fff;color:#365338}
.status-text{min-height:20px;margin-top:12px!important;font-size:13px!important}
.status-text.error{color:#9d3c35}.status-text.success{color:#446e42}
.compact-card{margin-bottom:24px}
.event.task-event{border-left:4px solid rgba(30,45,34,.42);padding-left:5px}
.event-type{display:inline-block;margin-right:3px;font-weight:800;opacity:.65}

/* Authentication */
.auth-overlay{z-index:300;display:flex;align-items:center;justify-content:center;padding:20px}
.login-screen{width:min(100%,420px)}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 18px 60px rgba(40,55,40,.12)}
.login-card h1{margin:0 0 8px;font-size:26px;color:var(--ink)}
.login-card>p{margin:0 0 20px;color:#576458;line-height:1.5}
.login-card .primary-action{width:100%;margin-top:8px}
.settings-card .field{margin:12px 0}


/* Week chooser */
.week-nav-wrap{position:relative;min-width:0;text-align:center}
.week-popover{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:min(300px,calc(100vw - 28px));padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 40px rgba(35,48,35,.16);z-index:50;text-align:left}
.week-popover .secondary-action,.week-popover .primary-action{margin:0}
.week-date-field{margin:12px 0}
.week-title{width:100%}

/* Category editor */
.settings-card-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.settings-card-title-row>div{min-width:0;flex:1}
.small-action{flex:0 0 auto;border:1px solid #b9c9b5;background:#fff;color:#365338;border-radius:10px;padding:8px 10px;font-weight:700;font-size:13px}
.category-list{display:flex;flex-direction:column;gap:10px}
.category-row{display:grid;grid-template-columns:minmax(120px,1fr) 74px 74px auto;gap:10px;align-items:end;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.category-row .field{margin:0}
.category-row .field span{font-size:11px}
.category-row input[type="color"]{height:44px;padding:4px;cursor:pointer}
.category-row-actions{display:flex;gap:6px;align-items:center;padding-bottom:1px}
.category-save,.category-delete{border-radius:9px;min-height:42px;padding:0 10px;font-weight:700}
.category-save{border:1px solid #b9c9b5;background:#f9fcf7;color:#365338}
.category-delete{border:1px solid #e0b8b4;background:#fff8f7;color:#9d3c35}
@media (max-width:620px){.category-row{grid-template-columns:1fr 64px 64px}.category-row-actions{grid-column:1/-1}.category-save,.category-delete{flex:1}.settings-card-title-row{align-items:center}}