.app-shell { width: min(100%,1100px); }
.header-actions { display:flex; align-items:center; gap:14px; }
#user-label { font-size:13px; color:var(--muted); }
.app-footer { padding:26px; color:var(--muted); font-size:12px; text-align:center; }
.app-footer span { margin:0 8px; }
.hero { padding:22px 24px; }
.hero-lead { font-size:15px; }
.section-title h2,.overline { font-size:12px; }
.task-copy p { font-size:16px; line-height:1.55; }
.task-copy small,.helper,.notice,.meeting-note { font-size:13px; }
.task-copy .due { color:var(--danger); font-weight:600; }
.task-copy .result { margin-top:8px; font-size:14px; color:var(--muted); }
.status,.meeting-kind { font-size:12px; }
.task { padding:16px 12px; }
.task.completed .task-copy .result { text-decoration:none; }
.task.completed .task-copy p { color:var(--muted); }
.work-grid { display:grid; gap:22px; margin-top:22px; }
.work-grid > section { min-width:0; }
.work-grid .section-title { margin-top:0; }
.toolbar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:16px; }
.toolbar label { margin:0; min-width:160px; }
.toolbar label select { margin:0; }
.empty,.profile-card p,.booking-info p { font-size:14px; }
.empty strong { font-size:16px; }
.login-card { display:grid; gap:24px; align-items:center; padding:24px; }
.login-copy h1 { margin:12px 0 16px; }
.login-copy p { max-width:58ch; color:var(--muted); line-height:1.7; }
.login-copy .button { margin-top:22px; }
.login-copy form { max-width:440px; }
.login-copy input { width:100%; box-sizing:border-box; }
.password-field { margin-bottom:16px; }
.password-field > label { margin-bottom:6px; }
.password-entry { display:flex; gap:8px; align-items:stretch; }
.password-entry input { flex:1; min-width:0; min-height:46px; margin:0; padding:12px; border:1px solid #d4d6c8; border-radius:12px; background:#fff; color:var(--ink); font-size:14px; }
.password-visibility { flex:none; min-width:88px; min-height:44px; padding:8px 12px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--olive-dark); font:inherit; font-size:13px; cursor:pointer; }
.password-visibility:focus-visible { outline:2px solid var(--olive-dark); outline-offset:2px; }
.login-copy .text-button { margin-top:16px; display:block; }
.login-art { background:var(--sage); border-radius:22px; padding:20px; text-align:center; }
.login-art img { width:130px; height:130px; border-radius:50%; object-fit:cover; object-position:center 30%; }
.login-art strong { display:block; font:24px Georgia,serif; margin:18px 0 8px; }
.login-art p { color:var(--muted); font-size:14px; }
.demo-controls { border:1px dashed #a0a88f; border-radius:18px; padding:16px; margin:22px 24px; }
.demo-controls p { margin-bottom:12px; font-size:13px; color:var(--muted); }
.demo-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.pair-code { font-size:28px; font-weight:700; letter-spacing:.16em; margin:18px 0; color:var(--olive-dark); }
.private-events { list-style:none; padding:0; margin:0; }
.private-events li { padding:16px; border:1px solid var(--line); border-radius:16px; background:var(--paper); margin-bottom:10px; overflow-wrap:anywhere; }
.private-events small { display:block; margin-top:5px; color:var(--muted); }
.form-columns { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.nav-item { font-size:11px; }
.booking-details { font-size:13px; }
.slot { font-size:14px; font-weight:500; line-height:1.4; padding:10px; }
.slot b { display:block; font-size:17px; }
.check-button:disabled { opacity:1; }
.button:disabled { opacity:.7; }
.entry-cards { display:grid; gap:18px; margin-top:22px; }
.entry-card { padding:22px; border:1px solid var(--line); border-radius:22px; background:var(--paper); }
.entry-card h2 { font:24px Georgia,serif; margin-bottom:12px; }
.entry-card p { font-size:15px; line-height:1.65; color:var(--muted); margin-bottom:20px; }
.first-info p { margin:16px 0; line-height:1.65; }
.first-info .button { margin-top:12px; }
@media(min-width:760px) {
  body[data-mode="site"] .app-shell { padding-bottom:0; }
  body[data-mode="site"] .bottom-nav { position:static; transform:none; width:calc(100% - 48px); margin:0 24px; border-radius:16px; box-shadow:none; order:0; }
  body[data-mode="site"] .app-shell { display:flex; flex-direction:column; }
  body[data-mode="site"] .brand-header { order:-2; }
  body[data-mode="site"] .preview-label { order:-3; }
  body[data-mode="site"] .bottom-nav { order:-1; }
  body[data-mode="site"] .nav-item { flex-direction:row; gap:8px; font-size:14px; }
  .work-grid { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); }
  .login-card { grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr); padding:40px; }
  .calendar-layout { grid-template-columns:350px minmax(0,1fr); }
}
body[data-mode="app"] .app-shell { width:min(100%,520px); }
body[data-mode="app"] .work-grid { grid-template-columns:1fr; }
body[data-mode="app"] #user-label { display:none; }
@media(max-width:420px) {
  .login-card { padding:20px 18px; }
  .login-art { padding:18px; }
  #user-label { display:none; }
  .form-columns { grid-template-columns:1fr; gap:0; }
  .slots { grid-template-columns:1fr 1fr; }
}