:root {
  --bg:#f5f4f0; --surface:#fff; --text:#171717; --muted:#747474;
  --line:#deddd8; --strong:#111; --soft:#ecebe6; --radius:18px;
}
*{box-sizing:border-box}[hidden]{display:none!important} html{background:var(--bg)}
body{margin:0;color:var(--text);background:var(--bg);font-family:Arial,Helvetica,sans-serif}
button,input,textarea,select{font:inherit}button{color:inherit}
.shell{width:min(760px,100%);min-height:100vh;margin:0 auto;padding:28px 22px 110px}
.topbar,.composerHead{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.topActions{display:flex;gap:8px}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--muted)}
h1{margin:4px 0 0;font-size:clamp(34px,8vw,52px);line-height:1;letter-spacing:-.045em}
h2{margin:4px 0 0;letter-spacing:-.025em}
.iconButton{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-size:22px}.accountButton{font-size:14px;font-weight:800}
.syncBar{margin-top:18px;padding:8px 11px;border-radius:10px;background:var(--soft);font-size:12px;color:var(--muted)}.syncBar.error{background:#f5e6e3;color:#8b3225}.syncBar.ok{background:#e9efe7;color:#3b6336}
.migrationBar{margin-top:18px;padding:12px 14px;border:1px solid var(--line);border-radius:13px;background:var(--surface);display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:14px}.migrationBar button{border:0;border-radius:9px;background:var(--strong);color:#fff;padding:8px 10px;cursor:pointer;font-weight:700}
.dateRow{display:flex;gap:10px;margin-top:34px;align-items:center}.dateButton,.dateInput{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:10px 12px}.dateButton{cursor:pointer;font-weight:700}.dayTitle{margin:24px 0 18px;font-size:18px}
.emptyState{margin-top:26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px}.emptyState p{margin:0 0 8px;font-weight:800;font-size:18px}.emptyState span,.searchHint,.smallHint{color:var(--muted);font-size:14px;line-height:1.5}
.timeline{border-top:1px solid var(--line)}.event{position:relative;display:grid;grid-template-columns:54px 1fr 34px;gap:14px;padding:20px 0;border-bottom:1px solid var(--line)}.eventTime{font-size:13px;color:var(--muted);padding-top:4px;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.eventMeta{display:flex;gap:6px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em}.eventBody h3{margin:7px 0 5px;font-size:17px}.eventBody p{margin:6px 0 0;font-size:16px;line-height:1.55;white-space:pre-wrap}.deleteButton{border:0;background:transparent;opacity:.28;cursor:pointer;align-self:start;padding:5px}.deleteButton:hover{opacity:1}.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.chip{background:var(--strong);color:#fff;padding:5px 8px;border-radius:999px;font-size:12px}.chip.quiet{background:var(--soft);color:var(--text)}
.searchBox{margin-top:34px;display:flex;gap:10px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}.searchBox input{width:100%;border:0;outline:0;background:transparent;font-size:17px}.searchBox button{border:0;background:transparent;font-size:22px;cursor:pointer}.searchHint{padding:10px 3px 16px}.results{display:grid;gap:10px}.resultCard{text-align:left;width:100%;border:1px solid var(--line);background:var(--surface);padding:16px;border-radius:15px;cursor:pointer}.resultCard strong{display:block;margin:4px 0}.resultCard p{margin:5px 0 0;color:#3a3a3a;line-height:1.45}.resultDate{color:var(--muted);font-size:12px}
.fab{position:fixed;right:max(22px,calc((100vw - 760px)/2 + 22px));bottom:24px;width:62px;height:62px;border:0;border-radius:50%;background:var(--strong);color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px rgba(0,0,0,.18);cursor:pointer;font-size:32px}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.3);padding:18px;display:flex;align-items:flex-end;justify-content:center;z-index:10}.overlay[hidden]{display:none}.authOverlay{align-items:center;background:var(--bg)}.composer{width:min(680px,100%);max-height:92vh;overflow:auto;background:var(--surface);border-radius:24px 24px 18px 18px;padding:22px;box-shadow:0 25px 70px rgba(0,0,0,.26)}.authCard{width:min(460px,100%);border-radius:24px;box-shadow:none;border:1px solid var(--line);padding:28px}.authCard h2{font-size:30px;margin-top:6px}.authIntro{color:#444;line-height:1.5;margin:12px 0 20px}.authCard label{display:block;margin-top:12px;font-size:13px;font-weight:700}.authCard label input{margin-top:6px}.setupNotice{padding:16px;border-radius:13px;background:var(--soft);line-height:1.45}.setupNotice p{margin:7px 0 0}.setupNotice code{font-size:12px}.authMessage{min-height:24px;margin-top:10px}.accountCard{width:min(420px,100%)}.accountEmail{margin:26px 0 8px}.composer textarea,.composer input,.composer select,.authCard input{width:100%;border:1px solid var(--line);border-radius:12px;background:#fafafa;padding:12px;outline:0}.composer textarea{margin-top:22px;resize:vertical;line-height:1.5;font-size:16px}.composer label{display:block;margin-top:14px;font-size:13px;font-weight:700}.composer label input,.composer label select{margin-top:6px;font-weight:400}.optional{color:var(--muted);font-weight:400}.formGrid{display:grid;grid-template-columns:1.4fr 1fr;gap:10px}.voiceButton{margin-top:10px;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:10px 13px;cursor:pointer}.voiceButton.active{background:var(--strong);color:#fff}.smallHint{min-height:20px;margin-top:4px}.primaryButton,.secondaryButton{width:100%;border-radius:13px;padding:14px 16px;font-weight:800;margin-top:14px;cursor:pointer}.primaryButton{border:0;background:var(--strong);color:#fff}.primaryButton:disabled{opacity:.35;cursor:not-allowed}.secondaryButton{border:1px solid var(--line);background:var(--surface)}.dangerButton{margin-top:14px}
@media(max-width:560px){.shell{padding:22px 16px 100px}.event{grid-template-columns:46px 1fr 28px;gap:10px}.formGrid{grid-template-columns:1fr}.overlay{padding:0}.composer{border-radius:24px 24px 0 0}.authOverlay{padding:16px;align-items:center}.authCard{border-radius:24px}.fab{right:18px;bottom:18px}}

.authPage{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:var(--bg);
}
.authPage[hidden]{display:none!important}
#appShell[hidden]{display:none!important}

.quickCapture{
  margin-top:18px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
}
.quickCapture textarea{
  width:100%;
  resize:vertical;
  min-height:84px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-size:16px;
  line-height:1.5;
}
.quickCaptureFooter{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-top:8px;
  border-top:1px solid var(--soft);
}
.quickHint{
  color:var(--muted);
  font-size:12px;
}
.quickSave{
  border:0;
  border-radius:10px;
  background:var(--strong);
  color:#fff;
  padding:9px 13px;
  font-weight:800;
  cursor:pointer;
}
.quickSave:disabled{
  opacity:.32;
  cursor:default;
}

.eventAttachments{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:8px;
  margin-top:12px;
}
.eventImageLink{
  display:block;
  border-radius:12px;
  overflow:hidden;
  background:var(--soft);
  border:1px solid var(--line);
}
.eventImage{
  display:block;
  width:100%;
  max-height:320px;
  object-fit:contain;
  background:#fff;
}
.imageUnavailable{
  padding:12px;
  border-radius:10px;
  background:var(--soft);
  color:var(--muted);
  font-size:12px;
}

.accountMenu{
  position:relative;
}
.accountMenu summary{
  list-style:none;
}
.accountMenu summary::-webkit-details-marker{
  display:none;
}
.accountPanel{
  position:absolute;
  z-index:30;
  top:52px;
  right:0;
  width:min(390px,calc(100vw - 32px));
  max-height:calc(100vh - 90px);
  overflow:auto;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.18);
}
.accountPanel h3{
  margin:4px 0 0;
}
.accountPanel .accountEmail{
  margin:8px 0 4px;
  color:var(--muted);
  font-size:13px;
}

.reflectContent{
  margin-top:6px;
  font-size:16px;
  line-height:1.55;
}
.reflectLead{
  margin-bottom:5px;
  white-space:pre-wrap;
}
.reflectNestedLine{
  display:grid;
  grid-template-columns:16px minmax(0,1fr);
  gap:4px;
  margin-left:calc(var(--reflect-depth) * 18px);
  margin-top:4px;
}
.reflectBullet{
  text-align:center;
  color:var(--muted);
}

.eventActions{
  position:relative;
  align-self:start;
}
.eventActions summary{
  list-style:none;
}
.eventActions summary::-webkit-details-marker{
  display:none;
}
.eventMenuButton{
  border:0;
  background:transparent;
  opacity:.22;
  cursor:pointer;
  padding:2px 3px 6px;
  font-size:17px;
  line-height:1;
  letter-spacing:1px;
  user-select:none;
}
.eventActions[open] .eventMenuButton,
.eventMenuButton:hover{
  opacity:.72;
}
.eventMenu{
  position:absolute;
  z-index:20;
  right:0;
  top:24px;
  min-width:132px;
  padding:6px;
  border:1px solid var(--line);
  border-radius:11px;
  background:var(--surface);
  box-shadow:0 10px 28px rgba(0,0,0,.14);
}
.eventMenu button{
  display:block;
  width:100%;
  border:0;
  border-radius:8px;
  background:transparent;
  padding:9px 10px;
  text-align:left;
  cursor:pointer;
  font-size:14px;
}
.eventMenu button:hover{
  background:var(--soft);
}
.eventMenu .dangerMenuItem{
  color:#9a3328;
}
.editOverlay{
  align-items:center;
  z-index:50;
}
.editCard{
  width:min(640px,100%);
  background:var(--surface);
  border-radius:20px;
  padding:22px;
  box-shadow:0 24px 70px rgba(0,0,0,.25);
}
.editCard textarea{
  width:100%;
  min-height:220px;
  margin-top:20px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fafafa;
  padding:13px;
  outline:0;
  resize:vertical;
  line-height:1.5;
}
.editActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.brandRow{display:flex;align-items:center;gap:8px;min-width:0}
.workspaceToggle{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:999px;background:var(--surface);padding:3px 7px;color:var(--muted);font:inherit;font-size:9px;font-weight:800;letter-spacing:.02em;cursor:pointer}
.workspaceToggle.private{background:#eeeDE8;color:var(--text)}
.iconButton{position:relative}
.tasksDueBadge{position:absolute;right:-3px;top:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--strong);color:#fff;font-size:9px;font-weight:900;line-height:16px;text-align:center;border:2px solid var(--bg)}
.iconButton.active .tasksDueBadge{background:#fff;color:var(--strong);border-color:var(--strong)}
@media(max-width:820px){
  .brandRow{gap:6px}
  .workspaceToggle{font-size:8px;padding:2px 6px}
}


.accountAppLink{
  display:block;
  box-sizing:border-box;
  text-align:center;
  text-decoration:none;
  color:var(--text);
}
