/* Adapted directly from BookTabs selected-preview.css FolderFloat. */
.today-demo .folder-float {
  --ff-w: 200px;
  --ff-h: 148px;
  --ff-r: 14px;
  --ff-tab: 14px;
  --ff-back: #3f3f46;
  --ff-front: #52525b;
  --ff-paper: #f5f5f5;
  --ff-item: #f5f5f5;
  --ff-item-ink: #18181b;
  --ff-label: #f5f5f5;
  --ff-spread: 180px;
  --ff-lift: 26px;
  --ff-angle: 34deg;
  --ff-rest: 16deg;
  --ff-open: 520ms;
  --ff-close: 312ms;
  --ff-stagger: 45ms;
  --ff-n: 6;
  --ff-spring: cubic-bezier(0.34, 1.57, 0.64, 1);
  --ff-ease-out: cubic-bezier(0.23, 1, 0.32, 1);

  position: relative;
  display: inline-block;
  width: var(--ff-w);
  padding-top: var(--ff-tab);
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
}

.today-demo .folder-float__folder {
  position: relative;
  width: var(--ff-w);
  height: var(--ff-h);
}

.today-demo .folder-float__back {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: var(--ff-r);
  background: var(--ff-back);
  transform: perspective(600px) rotateX(8deg);
  transform-origin: 50% 100%;
}

.today-demo .folder-float__back::before {
  content: '';
  position: absolute;
  top: calc(-1 * var(--ff-tab));
  left: 0;
  width: 42%;
  height: calc(var(--ff-tab) + var(--ff-r));
  border-radius: var(--ff-r) var(--ff-r) 0 0;
  background: inherit;
}

.today-demo .folder-float__paper {
  position: absolute;
  top: 10%;
  z-index: 1;
  right: 8%;
  left: 8%;
  height: 50%;
  border-radius: 6px;
  background: var(--ff-paper);
  opacity: 0;
  transform: translateY(10px);
  transition:
    transform var(--ff-close) var(--ff-ease-out),
    opacity var(--ff-close) ease;
}

.today-demo .folder-float__front {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 5px;
  height: 76%;
  padding: 14px 16px;
  box-sizing: border-box;
  border-radius: var(--ff-r);
  background: linear-gradient(180deg, color-mix(in srgb, var(--ff-front) 92%, var(--surface)), var(--ff-front) 60%);
  color: var(--ff-label);
  box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.28);
  transform: perspective(600px) rotateX(calc(-1 * var(--ff-rest)));
  transform-origin: 50% 100%;
  transition: transform var(--ff-open) var(--ff-ease-out);
}

.today-demo .folder-float__label {
  font-size: 13px;
  font-weight: 500;
}

.today-demo .folder-float__sub {
  font-size: 11px;
  opacity: 0.55;
}

.today-demo .folder-float__trigger {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 3;
  height: 76%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--ff-r);
  background: transparent;
  cursor: pointer;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.today-demo .folder-float[data-open] .folder-float__front {
  transform: perspective(600px) rotateX(calc(-1 * var(--ff-angle)));
}

.today-demo .folder-float[data-open] .folder-float__paper {
  opacity: 1;
  transform: translateY(0);
  transition:
    transform var(--ff-open) var(--ff-ease-out),
    opacity 200ms ease;
}

.today-demo .folder-float__items {
  position: absolute;
  top: var(--ff-tab);
  left: 50%;
  z-index: 1;
  width: 0;
  height: 0;
}

.today-demo .folder-float[data-open] .folder-float__items::before {
  content: '';
  position: absolute;
  top: calc(-1 * (var(--ff-lift) + 120px));
  left: calc(-1 * (var(--ff-spread) + 100px));
  width: calc(2 * var(--ff-spread) + 200px);
  height: calc(var(--ff-lift) + 120px);
}

.today-demo .folder-float__item {
  position: absolute;
  top: 0;
  left: 50%;
  margin: 0;
  padding: 0 14px;
  height: 34px;
  border: 0;
  border-radius: 17px;
  background: var(--ff-item);
  color: var(--ff-item-ink);
  font: inherit;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
  cursor: pointer;
  outline: none;
  opacity: 0;
  transform: translate(-50%, 44px) scale(0.6);
  transform-origin: 50% 50%;
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform var(--ff-close) var(--ff-ease-out) calc((var(--ff-n) - 1 - var(--i)) * var(--ff-stagger) * 0.5),
    opacity 160ms ease calc((var(--ff-n) - 1 - var(--i)) * var(--ff-stagger) * 0.5 + var(--ff-close) * 0.45),
    scale 160ms var(--ff-ease-out);
}

.today-demo .folder-float[data-open] .folder-float__item {
  opacity: 1;
  transform: translate(calc(-50% + var(--x)), var(--y)) rotate(var(--r)) scale(1);
  pointer-events: auto;
  transition:
    transform var(--ff-open) var(--ff-spring) calc(var(--i) * var(--ff-stagger)),
    opacity 160ms ease calc(var(--i) * var(--ff-stagger)),
    scale 160ms var(--ff-ease-out);
}

.today-demo .folder-float[data-live] .folder-float__item {
  cursor: grab;
  transition: scale 160ms var(--ff-ease-out);
}

.today-demo .folder-float__item[data-drag] {
  cursor: grabbing;
}

@media (hover: hover) and (pointer: fine) {
  .today-demo .folder-float[data-open] .folder-float__item:hover {
    scale: 1.05;
  }
}

.today-demo .folder-float[data-open] .folder-float__item:active {
  scale: 0.97;
}

.today-demo .folder-float__item[data-pop] {
  animation: folder-float-pop 320ms var(--ff-ease-out);
}

.today-demo .folder-float__drift {
  display: block;
  animation: folder-float-drift 3.2s ease-in-out infinite;
  animation-delay: calc(var(--i) * -0.7s);
  animation-play-state: paused;
}

.today-demo .folder-float[data-open] .folder-float__drift {
  animation-play-state: running;
}

.today-demo .folder-float[data-physics] .folder-float__drift,.today-demo .folder-float[data-live] .folder-float__drift {
  animation: none;
}

@keyframes folder-float-drift {
  0%,
  100% {
    translate: 0 0;
  }

  50% {
    translate: 0 -3px;
  }
}

@keyframes folder-float-pop {
  30% {
    scale: 1.1;
  }

  100% {
    scale: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .today-demo .folder-float__front,.today-demo .folder-float__paper {
    transition: opacity 200ms ease;
  }

  .today-demo .folder-float[data-open] .folder-float__front {
    transform: perspective(600px) rotateX(calc(-1 * var(--ff-rest)));
  }

  .today-demo .folder-float__paper {
    transform: none !important;
  }

  .today-demo .folder-float__item {
    transition: opacity 200ms ease;
  }

  .today-demo .folder-float[data-open] .folder-float__item {
    transition: opacity 200ms ease calc(var(--i) * var(--ff-stagger));
  }

  .today-demo .folder-float__drift {
    animation: none;
  }
}


.today-native-folders{position:absolute;left:50%;top:17%;width:44%;height:34%;background:#fff}
.today-native-folders .folder-float{position:absolute;--ff-w:100%;--ff-h:100%;--ff-back:#078cc1;--ff-front:#09a5e6;--ff-label:#082c3d;--ff-item:#fff;--ff-item-ink:#0b2938;--surface:#fff;--ff-spread:60px;width:65%;height:76%;padding-top:0}
.today-native-folders [data-kind=todo]{left:0;bottom:0;z-index:3}.today-native-folders [data-kind=inbox]{right:0;top:0;z-index:2}.today-native-folders .folder-float[data-open]{z-index:6}
.today-native-folders .folder-float__front{box-shadow:0 -4px 12px #0001;padding:16px 18px;gap:4px;font-size:14px}.today-native-folders .folder-float__label{font-size:18px;font-weight:700}.today-native-folders [data-kind=inbox] .folder-float__front{align-items:flex-end;text-align:right}.today-native-folders [data-kind=todo] .folder-float__back{filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000)}
.today-demo .folder-float__trigger:focus-visible,.today-demo .folder-float__item:focus-visible{outline:2px solid #08678c;outline-offset:3px}
.today-demo .folder-float__item{font-size:12px;padding:0 10px;text-align:center}.today-demo .folder-float:not([data-open]) .folder-float__item{visibility:hidden}.today-demo .folder-float__trigger{text-align:inherit}
.today-todo,.today-inbox,.today-file-count{display:none!important}
@media(max-width:650px){.today-native-folders{display:none}.today-app-canvas[data-pane=folders]{height:310px;overflow:visible;background:#fff}.today-app-canvas[data-pane=folders]>img{display:none}.today-app-canvas[data-pane=folders] .today-native-folders{display:block;left:0;top:110px;width:100%;height:190px}.today-native-folders .folder-float__label{font-size:16px}.today-native-folders .folder-float__front{font-size:12px;padding:12px}.today-demo .folder-float__item{font-size:11px}}
/* Notifications belong only to an explicit upload, never the resting board. */
.today-receipt{display:none}.today-demo[data-busy="inbox"] .today-receipt{display:flex}

/* Quiet material separation, preserving the approved Today composition. */
.hero-product{filter:drop-shadow(0 20px 32px #00304912)}
.today-demo{border-color:#b7cdda;box-shadow:0 2px 4px #00304906,0 18px 48px -28px #00304940;background:#f5f8fb}
.today-app-canvas{background:#f5f8fb}
.today-native-folders .folder-float__front{box-shadow:inset 0 1px 0 #ffffff5c,0 -4px 12px #00304918,0 12px 20px -14px #00304960}
.today-native-folders .folder-float__item{border:1px solid #d9e5ec;box-shadow:0 2px 4px #00304908,0 7px 16px -8px #00304940}
.today-basket{isolation:isolate}
.today-note{overflow:hidden;border-radius:4px}
.today-note:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 30%,#0ea5e914 45%,#0ea5e92b 50%,transparent 68%);transform:translateX(-100%)}
.today-basket[data-shimmer] .today-note:after{animation:today-note-sheen 1.1s ease-out 1}
@keyframes today-note-sheen{0%{opacity:0;transform:translateX(-100%)}20%,75%{opacity:1}100%{opacity:0;transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.today-note:after{display:none;animation:none!important}}
.today-basket{position:absolute;left:10.3%;top:59%;width:37%;height:22%;color:#082433;text-align:left}.today-note{min-height:44px;outline-offset:3px;cursor:text}.today-note:focus-visible{outline:2px solid #087ba8}.today-drop-demo{display:flex;justify-content:center;align-items:center;gap:10px;padding:10px 14px;flex-wrap:wrap}.today-drop-demo button{font:inherit;font-size:12px;padding:8px 12px;border:1px solid #bfd3df;border-radius:8px;background:#fff;color:#163b50;cursor:grab}.today-drop-demo small{font-size:10px;color:#526b7b}
.today-note{cursor:default}
.today-demo[data-stage=drop] [data-kind=inbox] .folder-float__paper{opacity:1;animation:none}
@keyframes today-example-file{from{opacity:0;transform:translate(-25px,-45px) rotate(-6deg)}40%{opacity:1}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.today-demo[data-stage=drop] [data-kind=inbox] .folder-float__paper{animation:none!important}}

/* Upload status floats within the existing demo viewport, never in layout. */
.today-demo{position:relative}
.today-receipt{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);margin:0;z-index:20;max-width:calc(100% - 32px);box-shadow:0 4px 10px #00304912,0 16px 32px -14px #00304955}
.today-native-folders .folder-float__front{box-shadow:inset 0 1px 0 #ffffff80,0 -5px 14px #00304920,0 14px 20px -10px #00304955}
.today-native-folders .folder-float__back{box-shadow:0 8px 16px -9px #00304955}
.today-app-canvas:before,.today-app-canvas:after{content:'';position:absolute;pointer-events:none;border:1px solid #bfd2de;border-radius:14px;box-shadow:0 3px 8px #00304909,0 10px 22px -14px #00304940}
.today-app-canvas:before{left:8.8%;top:16%;width:39.8%;height:34%}
.today-app-canvas:after{left:8.8%;top:51.7%;width:39.8%;height:33.2%}
@media(max-width:650px){.today-receipt{bottom:12px;width:max-content;max-width:calc(100% - 24px)}.today-app-canvas:before,.today-app-canvas:after{display:none}.today-app-canvas[data-pane=notes],.today-app-canvas[data-pane=focus],.today-app-canvas[data-pane=calendar]{border:1px solid #bfd2de;box-shadow:0 3px 8px #00304909,0 10px 22px -14px #00304940}}
/* Requested paper preview; fictional content, live-app parity unverified. */
.today-demo [data-kind=inbox] .folder-float__item{width:164px;height:146px;border-radius:7px;padding:13px;text-align:left;white-space:normal;background:linear-gradient(135deg,#fff,#f8fbfd);box-shadow:0 1px 2px #00304915,0 12px 22px -10px #00304955;--x:0px!important;--y:-96px!important;--r:-4deg!important}
.today-document{display:flex!important;flex-direction:column;gap:8px;line-height:1.35}.today-document small{font-size:8px;letter-spacing:.08em;color:#668191}.today-document strong{font-size:13px;color:#082433}.today-document>span{font-size:10px;color:#395a6d}.today-document i{display:block;height:2px;border-radius:2px;background:#dce6ec;width:90%}.today-document i+i{width:65%}.today-document em{font-size:8px;color:#607b8b;font-style:normal;border-top:1px solid #e1eaf0;padding-top:6px}
.today-calendar-depth{position:absolute;pointer-events:none;left:50%;top:51.7%;width:40%;height:33.2%;border:1px solid #b3cbd9;border-radius:14px;box-shadow:inset 0 1px 0 #fff,0 4px 10px #0030490d,0 12px 24px -13px #00304950}
.today-app-canvas:before,.today-app-canvas:after{border-color:#b3cbd9;box-shadow:inset 0 1px 0 #fff,0 4px 10px #0030490d,0 12px 24px -13px #00304950}
@media(max-width:650px){.today-calendar-depth{display:none}.today-demo [data-kind=inbox] .folder-float__item{width:148px;height:140px;--x:-20px!important;--y:-100px!important}.today-document{gap:7px}}
/* Document rendering follows historical daily-inbox.js thumbnail/sampleSVG. */
.today-demo [data-kind=inbox] .folder-float__item{width:132px;height:176px;padding:0;overflow:hidden}
.today-document{height:100%;gap:0}.today-document img{display:block;width:100%;height:100%;object-fit:contain;border-radius:6px;box-shadow:none!important}
@media(max-width:650px){.today-demo [data-kind=inbox] .folder-float__item{width:120px;height:160px}}
/* Front To-do folder stays flat; the rear Inbox retains its cast shadow. */
.today-native-folders [data-kind=todo] .folder-float__front{box-shadow:inset 0 1px 0 #ffffff80}
.today-native-folders [data-kind=todo] .folder-float__back{box-shadow:none}

/* Spread the existing cards into the unused desktop margins. */
.today-app-canvas>img.today-card-slice{display:none}
@media(min-width:651px){
.today-app-canvas{background:#fff}
.today-app-canvas>img:not(.today-card-slice){clip-path:inset(0 0 84% 0)}
.today-app-canvas>img.today-card-slice{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.today-card-attention{clip-path:inset(15.5% 51% 49.5% 8%);transform:translateX(-3%)}
.today-card-notes{clip-path:inset(51% 51% 14% 8%);transform:translate(-3%,3%)}
.today-card-calendar{clip-path:inset(51% 9% 14% 49.5%);transform:translate(3%,3%)}
.today-app-canvas:before{left:5.8%}
.today-app-canvas:after{left:5.8%;top:54.7%}
.today-calendar-depth{left:53%;top:54.7%}
.today-basket{left:7.3%;top:62%}
.today-native-folders{left:53%;width:43%}
.today-arrow-fix{left:55.45%;top:56.4%}
}
@media(min-width:651px){.today-app-canvas:before,.today-app-canvas:after{z-index:1}.today-basket{z-index:2}.today-native-folders{z-index:3}}

.today-drag-file{position:absolute;left:12%;top:28%;z-index:12;display:flex;align-items:flex-end;gap:8px;opacity:0;pointer-events:none}
.today-drag-file>svg{width:25px;height:32px;filter:drop-shadow(0 2px 3px #00304944)}
.today-pdf{display:flex;flex-direction:column;gap:9px;width:112px;padding:14px;border-radius:9px;background:#fff;border:1px solid #cbdce6;box-shadow:0 9px 24px #00304925;font-size:11px}
.today-pdf b{color:#b94448;font-size:14px}
.today-demo[data-stage=drag] .today-drag-file{animation:today-cursor-drag 2s cubic-bezier(.4,0,.2,1) both}
@keyframes today-cursor-drag{0%{opacity:0;left:12%;transform:translateY(20px) rotate(-5deg)}12%{opacity:1}75%{opacity:1;left:78%;transform:translate(-50%,-25px) rotate(2deg)}100%{opacity:0;left:78%;transform:translate(-50%,30px) scale(.7)}}
.today-receipt{box-sizing:border-box;width:540px;height:78px;min-height:78px;max-width:calc(100% - 24px);flex-wrap:nowrap}
.today-receipt-copy{flex:1}.today-receipt-copy [data-receipt]{height:30px}
.today-receipt-actions{flex:none;gap:7px}.today-receipt-actions:after{display:none!important}
.today-receipt-actions button{display:flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid #d5e2ea;border-radius:7px;background:#f7fafc;color:#365567;opacity:1;font-size:11px}
.today-receipt-actions svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.today-receipt-actions .today-markup{color:#086e98;background:#edf8fc;border-color:#b9dce9;position:relative;padding-bottom:12px}
.marker-colors{position:absolute;bottom:4px;left:28px;display:flex;gap:3px}.marker-colors i{width:8px;height:3px;border-radius:3px;background:#13a4de}.marker-colors i:nth-child(2){background:#e7b63f}.marker-colors i:nth-child(3){background:#df7288}
@media(max-width:650px){.today-drag-file{top:32%}.today-pdf{width:82px;padding:10px;font-size:9px}.today-receipt{height:100px;min-height:100px;display:none;gap:7px;padding:10px}.today-receipt-copy{min-width:0}.today-receipt-actions{flex-direction:column;border:0;padding-left:0;margin:0;gap:4px}.today-receipt-actions button{font-size:10px;padding:5px 7px}.today-receipt-actions .today-markup{padding-bottom:10px}}
@media(prefers-reduced-motion:reduce){.today-drag-file{display:none!important}}

/* App drop-zone treatment: 2px dashed border and accent hover fill. */
.today-demo:is([data-stage=drag],[data-stage=drop],[data-stage=link],[data-stage=filed],[data-stage=receipt-fade]) [data-kind=inbox]{z-index:8}
.today-demo[data-stage=drag] [data-kind=inbox] .folder-float__front{outline:2px dashed #d8f4ff;outline-offset:-10px;filter:brightness(1.12)}
.today-demo[data-stage=drag] .today-drag-file{animation-duration:3s}
@keyframes today-cursor-drag{0%{opacity:0;left:12%;transform:translateY(20px) rotate(-5deg)}10%{opacity:1}50%,84%{opacity:1;left:78%;transform:translate(-50%,-25px) rotate(2deg)}100%{opacity:0;left:78%;transform:translate(-50%,45px) scale(.5)}}
.today-demo[data-stage=receipt-fade] .today-receipt{opacity:0;transition:opacity .5s}
.today-attention-live{position:absolute;z-index:2;left:5.8%;top:16%;width:39.8%;height:34%;box-sizing:border-box;padding:18px;background:#fff;border:1px solid #bfd2de;border-radius:14px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;box-shadow:0 7px 20px -12px #00304955;font-size:13px}
.today-attention-live>strong{font-size:20px}.today-attention-live>small{font-size:10px;color:#567080}.today-call-action{display:flex;gap:7px;align-items:center;border:1px solid #a3d8f0;border-radius:8px;padding:8px 16px;background:#e9f7ff;position:relative;overflow:hidden;color:#075675}.today-call-action svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.today-demo[data-call=working] .today-call-action:after{content:'';position:absolute;inset:0;border-radius:8px;border:2px solid #0aa4e3;animation:today-call-edge 1s ease-in-out infinite}
@keyframes today-call-edge{0%,100%{clip-path:inset(0 0 75% 0)}50%{clip-path:inset(75% 0 0 0)}}
.today-demo[data-call=made] .today-call-action{background:#edf8f2;border-color:#a8d8bb;color:#246146}
.today-demo[data-call=next] .today-attention-live{animation:today-next-client .5s ease-out}
@keyframes today-next-client{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:650px){.today-attention-live{display:none}.today-app-canvas[data-pane=focus] .today-attention-live{display:flex;inset:0;width:100%;height:100%;padding:20px;gap:18px}.today-attention-live>strong{font-size:23px}}

.today-note{white-space:pre-line;font-size:clamp(10px,1.15vw,14px)}
.today-task-transfer{position:absolute;z-index:15;left:10%;top:65%;max-width:230px;padding:10px 14px;background:#fff;border:1px solid #a4d5eb;border-radius:30px;box-shadow:0 5px 16px #00304925;font-size:12px;color:#12384a;opacity:0;pointer-events:none}
.today-demo[data-transfer=flying] .today-task-transfer{animation:today-task-flight .9s cubic-bezier(.4,0,.2,1) both}
@keyframes today-task-flight{0%{opacity:1;left:10%;top:65%;transform:scale(1)}70%{opacity:1}100%{opacity:0;left:65%;top:39%;transform:scale(.65)}}
.today-demo[data-transfer=landed] [data-kind=todo]{animation:today-folder-settle .35s ease-out}
@keyframes today-folder-settle{0%,100%{transform:translateY(0)}40%{transform:translateY(3px) rotate(.6deg)}70%{transform:translateY(-1px)}}
@media(max-width:650px){.today-task-transfer{font-size:11px;max-width:180px}@keyframes today-task-flight{0%{opacity:1;left:5%;top:6%;transform:scale(1)}70%{opacity:1}100%{opacity:0;left:23%;top:65%;transform:scale(.65)}}}
@media(prefers-reduced-motion:reduce){.today-task-transfer{display:none!important}}

.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-copied]) .today-call-action{background:#edf8f2;border-color:#a8d8bb;color:#246146}
.today-demo[data-stage=draft-edit] .today-call-action{background:#fff;max-width:100%;font-weight:400;animation:today-note-sheen 1.1s ease-out}
.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-edit],[data-stage=draft-copied]) .today-call-action svg{display:none}
/* Hide the raster prototype's obsolete review controls in this automatic illustration. */
@media(min-width:651px){.today-card-notes{clip-path:inset(51% 51% 22% 8%)}.today-app-canvas:after{background:linear-gradient(to top,#fff 0 20%,transparent 20%);pointer-events:none}}
@media(max-width:650px){.today-app-canvas[data-pane=notes]:after{content:'';display:block;position:absolute;left:1px;right:1px;bottom:1px;height:65px;background:#fff;border:0;box-shadow:none;border-radius:0 0 12px 12px}}

.today-manual-scene{display:none;width:100%;font-size:12px;min-width:0}
.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-edit],[data-stage=draft-copied]) .today-manual-scene{display:block}
.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-edit],[data-stage=draft-copied]) .today-call-action{display:none}
.today-manual-scene>*{display:none}.today-demo[data-stage=follow-up] .today-outcome-row{display:flex;align-items:center;justify-content:space-between;padding:8px;background:#f1f7fa;border-radius:7px}.today-outcome-row span,.today-copy-control{padding:6px 9px;background:#e5f5fe;color:#08688e;border-radius:6px}
.today-demo[data-stage=follow-up][data-saved=true] .today-follow-chip{display:inline-block;margin-top:8px;padding:6px 9px;border:1px solid #badaca;background:#edf8f2;border-radius:20px;color:#286447;animation:today-next-client .35s ease-out}
.today-demo[data-stage=task-complete] .today-complete-row{display:flex;align-items:center;gap:8px;padding:10px 0}.today-check{width:17px;height:17px;border:1px solid #87b4c9;border-radius:5px;flex:none;text-align:center}.today-complete-row small{margin-left:auto;white-space:nowrap}
.today-demo[data-completed=true] .today-check{background:#168761;color:white;border-color:#168761}.today-demo[data-completed=true] .today-complete-row>span:nth-child(2){text-decoration:line-through;color:#67808b}
.today-demo:is([data-stage=draft-edit],[data-stage=draft-copied]) .today-message-box{display:block;min-height:36px;padding:8px;border:1px solid #b6cfdd;background:#f9fcfe;border-radius:7px;line-height:1.4}
.today-demo:is([data-stage=draft-edit],[data-stage=draft-copied]) .today-copy-control{display:table;margin-top:6px;margin-left:auto}.today-demo[data-stage=draft-copied] .today-copy-control{background:#e7f6ed;color:#216747}
.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-edit],[data-stage=draft-copied]) .today-attention-live{gap:7px}
/* Queue depth and bounded activity belong to the whole attention card. */
.today-attention-live{box-shadow:3px 3px 0 -1px #fff,3px 3px 0 0 #cadde7,6px 6px 0 -1px #f6fafc,6px 6px 0 0 #dce7ed,0 7px 20px -12px #00304955}
.today-demo[data-call=working] .today-call-action:after{display:none}
.today-demo[data-call=working] .today-attention-live:after{content:'';position:absolute;inset:-1px;pointer-events:none;border:2px solid #0aa4e3;border-radius:14px;animation:today-call-edge 1s ease-in-out 2}
@media(prefers-reduced-motion:reduce){.today-demo *, .today-demo *:before,.today-demo *:after{animation:none!important;transition:none!important}.today-drag-file,.today-task-transfer{display:none!important}}
.today-demo .folder-float__paper{opacity:1;background:#fff;transform:translateY(5px);box-shadow:0 -3px 0 -1px #e8f0f5}
.today-client-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:10px;color:#567080}.today-attention-live{gap:7px;padding:13px 16px}.today-attention-live>small:last-child{display:none}.today-demo[data-call=working] .today-attention-live:after{inset:0}.today-demo[data-call=next] .today-attention-live{animation:none}.today-outgoing-card{z-index:4!important}.today-outgoing-card[style*="z-index: 1"]{z-index:1!important}
.today-demo[data-transfer=flying] .today-task-transfer{animation:none}.today-task-inside{position:absolute;z-index:1;box-sizing:border-box;padding:10px 14px;background:white;border:1px solid #a4d5eb;border-radius:30px;font-size:12px;color:#12384a;line-height:1.3}.today-task-transfer{box-sizing:border-box;line-height:1.3}.today-demo[data-stage=drag] .today-drag-file{animation:none;opacity:1;transform:none}.today-pdf-inside{position:absolute;z-index:1;width:112px;box-sizing:border-box}
.today-tour-cover{position:absolute;z-index:2;left:82%;top:8%;width:11%;height:7%;background:white}.today-phone-header{position:relative}.today-phone-header:after{content:'';position:absolute;right:10px;bottom:8px;width:92px;height:48px;background:white}
.today-demo[data-stage=draft-edit] .today-copy-control{display:none}.today-demo[data-stage=draft-edit] .today-message-hint{display:block;font-size:10px;color:#547180;margin-bottom:4px}.today-demo[data-stage=draft-edit] .today-channel-row{display:flex;gap:12px;font-size:10px;margin-bottom:4px}.today-channel-row b{color:#087fae}.today-demo[data-stage=draft-edit] .today-message-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:5px}.today-message-actions span{background:#e5f5fe;color:#08688e;border-radius:5px;padding:4px 8px;font-size:10px}.today-message-actions .today-revert{display:none;background:transparent}.today-demo[data-message-state=proposed] .today-revert{display:block}.today-demo[data-message-state=remixing] .today-message-box{animation:none}.today-demo[data-stage=draft-edit] .today-attention-live{gap:4px}.today-demo[data-stage=draft-edit] .today-message-box{padding:5px;font-size:11px;min-height:0}.today-demo[data-message-state=sent] .today-message-box{animation:today-message-send .65s cubic-bezier(.2,.7,.3,1) both}@keyframes today-message-send{from{transform:none;opacity:1}to{transform:translate(35px,-75px) scale(.7) rotate(-5deg);opacity:0}}
.today-due-reminder{display:none;position:absolute;z-index:9;left:53%;top:28%;width:25%;align-items:center;gap:8px;padding:10px 12px;border:1px solid #bfd2de;border-radius:12px;background:white;color:#12384a;box-shadow:0 5px 16px #00304918;text-align:left;cursor:pointer;font:inherit;font-size:12px}.today-due-reminder small{display:block;font-size:10px;color:#75612d;margin-top:3px}.today-due-reminder svg{width:20px;height:20px;flex:none;fill:none;stroke:#a97818;stroke-width:1.7}.today-demo[data-reminder=due] .today-due-reminder{display:flex;animation:today-due-rise .6s ease-out both}.today-demo[data-reminder=due] .today-due-reminder svg{animation:today-bell .65s ease-in-out 2;transform-origin:50% 0}.today-reminder-popover{max-width:360px;width:calc(100% - 40px);margin:auto;border:1px solid #bfd2de;border-radius:16px;padding:24px;background:white;color:#12384a;box-shadow:0 20px 60px #00304930}.today-reminder-popover::backdrop{background:#00304930}.today-reminder-popover>button{float:right;border:0;background:transparent;font-size:24px;cursor:pointer}.today-reminder-popover h3{font-size:22px;margin:0 0 8px}.today-reminder-popover dt{font-weight:600;margin-top:16px}.today-reminder-popover dd{margin:4px 0;line-height:1.5}.today-reminder-popover small{display:block;margin-top:20px;color:#547180}@keyframes today-due-rise{from{transform:translateY(28px)}to{transform:none}}@keyframes today-bell{0%,100%{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}
@media(max-width:650px){.today-tour-cover{display:none}.today-app-canvas[data-pane=notes],.today-app-canvas[data-pane=focus],.today-app-canvas[data-pane=folders]{height:310px}.today-app-canvas[data-pane=notes] .today-basket{display:block;inset:0;width:100%;height:100%;box-sizing:border-box;padding:52px 18px 18px;background:white;border:1px solid #bfd2de;border-radius:14px;z-index:4}.today-app-canvas[data-pane=notes] .today-basket:before{content:'Thought Basket';position:absolute;top:18px;left:18px;font-size:14px;font-weight:600}.today-app-canvas[data-pane=notes] .today-note{position:static;display:block;width:auto;height:auto;margin:0;transform:none;font-size:13px;line-height:1.55}.today-due-reminder{display:none!important}.today-demo[data-reminder=due] .today-app-canvas[data-pane=folders] .today-due-reminder{display:flex!important;left:5%;top:42%;width:62%}}
@media(prefers-reduced-motion:reduce){.today-demo *{animation:none!important}}
.today-reminder-popover>button{position:absolute;top:12px;right:12px;left:auto;bottom:auto;width:32px;height:32px;padding:0;display:grid;place-items:center;float:none}.today-reminder-popover h3{padding-right:32px}
/* The calendar owns the dated reminder; To-do keeps its quiet folder silhouette. */
.today-due-reminder{left:55%;top:67%;width:35%;border-radius:9px;box-shadow:none;padding:10px;background:#edf7fc}.today-demo[data-reminder=due] .today-due-reminder{animation:none}.today-demo[data-reminder=due] .today-due-reminder svg{animation:today-bell .65s ease-in-out 2}
@media(max-width:650px){.today-demo[data-reminder=due] .today-app-canvas[data-pane=folders] .today-due-reminder{display:none!important}.today-demo[data-reminder=due] .today-app-canvas[data-pane=calendar] .today-due-reminder{display:flex!important;left:5%;top:65%;width:90%}.today-app-canvas[data-pane=calendar]{height:310px}}
.today-app-canvas .today-due-reminder{left:76%;top:61%;width:16%;height:auto!important;min-height:64px;background:#edf7fc!important;border:1px solid #bfd2de!important;padding:8px!important;opacity:1!important;font-size:11px;box-sizing:border-box;transform:none}.today-due-reminder small{font-size:9px}.today-due-reminder svg{width:16px;height:16px}
@media(max-width:650px){.today-demo[data-reminder=due] .today-app-canvas[data-pane=calendar] .today-due-reminder{left:5%;top:65%;width:90%}}
.today-agenda-cover{display:none;position:absolute;z-index:4;left:75.5%;top:60%;width:17%;height:23%;background:white}.today-demo[data-reminder=due] .today-agenda-cover{display:block}@media(max-width:650px){.today-agenda-cover{display:none!important}}

.today-date-word{color:#0879bb}.today-time-word{color:#ad5700}.today-demo[data-stage=draft-edit] .today-message-viewport{display:block;overflow:hidden;min-height:52px;border-radius:9px}.today-demo[data-stage=draft-edit] .today-message-box{display:block;transform:none;max-width:92%;margin-left:auto;background:#e4f3ff;border:0;border-radius:12px 12px 3px 12px;line-height:1.4;padding:7px 10px}.today-email-header{display:none}.today-demo[data-channel=email] .today-message-box{max-width:100%;background:#f7fafc;border:1px solid #cbdce6;border-radius:6px;margin-left:0}.today-demo[data-channel=email] .today-email-header{display:block;font-size:9px;color:#547180;border-bottom:1px solid #dce8ef;padding-bottom:4px;margin-bottom:4px}.today-demo[data-message-state=sent] .today-message-box{animation:today-message-up .6s cubic-bezier(.2,.7,.3,1) both}@keyframes today-message-up{from{transform:translateY(0);opacity:1}to{transform:translateY(-110%);opacity:1}}@media(prefers-reduced-motion:reduce){.today-demo[data-message-state=sent] .today-message-box{animation:none!important;visibility:hidden}}
.today-agenda-cover{top:56%;height:27%}.today-agenda-cover:before{content:'Thu, Nov 5';display:block;padding:5px 4px;font-size:10px;color:#547180}
.today-demo[data-stage=draft-edit][data-channel=email] .today-attention-live{padding-top:10px;padding-bottom:10px;gap:3px}.today-demo[data-channel=email] .today-message-hint,.today-demo[data-channel=email] .today-channel-row{display:none!important}

.today-selected-reminder-date{display:none;position:absolute;z-index:5;left:63.1%;top:67.35%;width:2.5%;height:3.8%;box-sizing:border-box;border:1px solid #078bc4;border-radius:5px;background:#e9f6fc;color:#08688e;font-size:9px;align-items:center;justify-content:center}.today-demo[data-reminder=due] .today-selected-reminder-date{display:flex}@media(max-width:650px){.today-selected-reminder-date{display:none!important}}

/* Clip only falling contents; keep folder tabs and hover previews free. */
.today-folder-drop-clip{position:absolute;inset:0;z-index:1;pointer-events:none;clip-path:inset(-160px -30px 5px -30px)}

/* Mobile demo chrome is rendered text, never a cropped desktop screenshot. */
@media(max-width:650px){
 .today-phone-header{height:58px;background:#fff;display:flex;align-items:center;padding:0 18px;border-bottom:1px solid #e1eaf0}
 .today-phone-header:before{content:'Today';font-size:21px;font-weight:750;letter-spacing:-.025em;color:#082433}
 .today-phone-selector{display:grid;grid-template-columns:1fr 1fr;gap:6px;overflow:visible;padding:12px}
 .today-phone-selector button{min-width:0;min-height:42px;font-size:12px;padding:8px 6px;background:#f3f7fa;border:1px solid transparent}
 .today-phone-selector button[aria-pressed=true]{background:#e6f4fc;border-color:#a6d7ed;color:#075b80;box-shadow:inset 0 1px 0 #fff}
 .today-app-canvas[data-pane=focus],.today-app-canvas[data-pane=notes]{background:#fff}
}

/* Useful call preparation fills the resting card; action scenes take its place. */
.today-call-context{width:100%;padding-top:10px;border-top:1px solid #dce7ed;font-size:12px;line-height:1.45}
.today-call-context>small{font-size:9px;letter-spacing:.07em;color:#597382;font-weight:650}
.today-call-context p{margin:6px 0 10px;color:#365568}
.today-call-context>div{display:flex;flex-direction:column;gap:3px;padding:8px 10px;background:#edf6fb;border-radius:7px}
.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-edit],[data-stage=draft-copied]) .today-call-context{display:none}
.today-person-mention{font-weight:750;color:#082f49;border-bottom:1px solid #8ecae6}
@media(max-width:650px){.today-app-canvas[data-pane=focus] .today-attention-live{gap:10px;padding:18px}.today-call-context{font-size:13px}.today-call-context>small{font-size:10px}.today-person-mention{font-weight:750}}

.today-call-context{padding-top:7px;font-size:11px;line-height:1.35}
.today-call-context p{margin:4px 0 6px}
.today-call-context>div{padding:5px 8px;gap:2px}
.today-call-context>div strong{font-size:11px}
.today-attention-live:has(.today-call-context){gap:6px}
@media(max-width:650px){.today-call-context{font-size:13px;padding-top:10px}.today-call-context p{margin:6px 0 10px}.today-call-context>div{padding:8px 10px}.today-call-context>div strong{font-size:12px}}
/* Keep the primary call action anchored beside the identity, with content contained. */
.today-attention-live{overflow:hidden;min-width:0}
.today-attention-live>.today-call-action{position:absolute;top:14px;right:14px;min-width:90px;min-height:46px;padding:10px 14px;box-sizing:border-box;justify-content:center;flex-shrink:0;background:#0aa4e3;color:#062d40;border-color:#0aa4e3;font-size:14px;font-weight:750;border-radius:10px}
.today-call-action svg{width:19px;height:19px;flex-shrink:0}
.today-attention-live>strong,.today-attention-live>small:first-child{max-width:calc(100% - 104px)}
.today-attention-live>.today-client-meta{padding-top:3px;width:100%;box-sizing:border-box}
.today-call-context{box-sizing:border-box;flex-shrink:0}
.today-demo:is([data-stage=follow-up],[data-stage=task-complete],[data-stage=draft-edit],[data-stage=draft-copied]) .today-attention-live>strong{max-width:100%}
@media(max-width:650px){.today-attention-live>.today-call-action{top:17px;right:17px;min-width:94px;min-height:50px}.today-app-canvas[data-pane=focus] .today-attention-live>strong{font-size:21px}.today-attention-live>.today-client-meta{margin-top:7px}}
@media(max-width:650px){
 .today-phone-selector{margin:12px 10px;padding:4px;gap:4px;border:1px solid #dbe7ee;border-radius:14px;background:#edf3f7;box-shadow:inset 0 1px 3px #12344706}
 .today-phone-selector button{min-height:38px;padding:8px 5px;border:1px solid transparent;border-radius:10px;background:transparent;color:#526e7d;font-size:11px;font-weight:550;line-height:1.2;transition:background .18s ease,color .18s ease,box-shadow .18s ease}
 .today-phone-selector button[aria-pressed=true]{background:#fff;border-color:#c8e4f2;color:#075675;font-weight:700;box-shadow:0 2px 5px #1234470d,inset 0 1px 0 #fff}
 .today-phone-selector button:focus-visible{outline:2px solid #0aa4e3;outline-offset:1px}
 .today-phone-selector button:hover{color:#075675;background:#ffffffa8}
}
/* Call lifecycle: neutral action, amber in progress, green completed. */
.today-attention-live>.today-call-action{background:#edf6fb;border-color:#b8d9e8;color:#075675;box-shadow:inset 0 1px 0 #fff}
.today-demo[data-call=working] .today-attention-live>.today-call-action{background:#fff1d6;border-color:#e6c37c;color:#80520b;box-shadow:0 0 0 3px #f6d89426}
.today-demo[data-call=working] .today-call-action svg{animation:today-call-pulse 1.2s ease-in-out infinite}
.today-demo[data-call=working] .today-attention-live:after{display:none}
.today-demo[data-call=made] .today-attention-live>.today-call-action{background:#e6f5ec;border-color:#acd6bb;color:#246146}
@keyframes today-call-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.65;transform:scale(.92)}}
@media(prefers-reduced-motion:reduce){.today-demo[data-call=working] .today-call-action svg{animation:none}}
/* A single aligned composer, with understated channel navigation. */
.today-demo[data-stage=draft-edit] .today-channel-row{gap:18px;border-bottom:1px solid #d9e6ee;margin:3px 0 8px;font-size:11px;align-items:center}
.today-channel-row>span,.today-channel-row>b{padding:5px 0 7px;position:relative}
.today-channel-row>b:after{content:'';height:2px;position:absolute;bottom:-1px;left:0;right:0;background:#0aa4e3;border-radius:2px}
.today-demo[data-stage=draft-edit] .today-message-box{max-width:100%;width:100%;box-sizing:border-box;margin:0;border-radius:8px;padding:8px 10px}
.today-demo[data-stage=draft-edit] .today-message-viewport{min-height:0}
.today-demo[data-stage=draft-edit] .today-message-actions{margin-top:7px;align-items:center}
.today-message-actions span{border:1px solid #c6dfec;background:#f5fafc}
@media(max-width:650px){
 .today-demo[data-stage=draft-edit] .today-channel-row{font-size:13px;gap:24px;margin:6px 0 12px}
 .today-demo[data-stage=draft-edit] .today-message-box{font-size:13px;padding:12px;line-height:1.5}
 .today-demo[data-stage=draft-edit] .today-message-actions{margin-top:10px}
 .today-demo[data-stage=draft-edit] .today-message-actions span{font-size:12px;padding:8px 12px}
}

/* Feathered local backdrop keeps the upload receipt crisp without dimming the app. */
.today-receipt-backdrop{position:absolute;pointer-events:none;z-index:19;left:50%;bottom:-16px;transform:translateX(-50%);width:604px;max-width:100%;height:142px;opacity:0;background:rgba(255,255,255,.6);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);mask-image:radial-gradient(ellipse at center,#000 45%,transparent 73%);-webkit-mask-image:radial-gradient(ellipse at center,#000 45%,transparent 73%);transition:opacity .24s ease}
.today-demo[data-busy=inbox] .today-receipt-backdrop{opacity:1}
.today-demo[data-stage=receipt-fade] .today-receipt-backdrop{opacity:0}
.today-demo[data-busy=inbox] .today-receipt{background:#fff;animation:none;box-shadow:0 4px 10px #00304910,0 14px 30px -12px #00304938}
@media(max-width:650px){.today-receipt-backdrop{bottom:-16px;width:calc(100% + 24px);max-width:none;height:156px}}
@media(prefers-reduced-motion:reduce){.today-receipt-backdrop{transition:none}}

.today-demo{overflow:visible}
.today-browser-bar{position:absolute;z-index:8;top:0;left:0;right:0;height:7.3%;min-height:30px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-radius:14px 14px 0 0;border-bottom:1px solid #dce7ee;background:#f4f8fb;color:#628091;font-size:11px;letter-spacing:.02em}
.today-browser-dots{position:absolute;left:16px;color:#b6ccd8;font-size:13px;letter-spacing:3px}
.today-attention-live{overflow:auto;scrollbar-width:thin}
.today-demo[data-stage=draft-edit] .today-attention-live{gap:3px}
.today-demo[data-stage=draft-edit] .today-client-meta{padding-top:0}
.today-demo[data-stage=draft-edit] .today-channel-row{margin:0 0 5px}
.today-demo[data-stage=draft-edit] .today-message-actions{margin-top:4px}
.today-demo[data-stage=draft-edit] .today-message-box{padding:6px 9px}
@media(max-width:650px){.today-browser-bar{display:none}.today-phone-header{height:40px!important;background:#f4f8fb!important;border-radius:14px 14px 0 0}.today-phone-header:before{content:'● ● ●';font-size:11px;letter-spacing:3px;color:#b6ccd8}.today-phone-header:after{content:'booktabs.io / today';position:static;margin:auto;width:auto;height:auto;background:transparent;color:#628091;font-size:11px}.today-app-canvas[data-pane=focus]{height:350px!important}.today-demo[data-stage=draft-edit] .today-message-box{padding:12px}.today-demo[data-stage=draft-edit] .today-channel-row{margin:6px 0 10px}}

.today-browser-logo{display:inline-flex;align-items:center;gap:6px}.today-browser-logo .wordmark{font-size:16px!important}.today-browser-logo .glyph-swap{width:28px!important;height:22px!important}.today-phone-header .today-browser-logo{position:absolute;left:50%;transform:translateX(-50%)}.today-phone-header:after{display:none!important}

/* Match the screenshot's card header inset; scale the overlay with its canvas. */
.today-time-word{white-space:nowrap}
@media(min-width:651px){
 .today-app-canvas{container-type:inline-size}
 .today-attention-live{padding:1.25cqw 2.05cqw;gap:.45cqw!important;overflow:hidden}
 .today-attention-live>small:first-child{font-size:1.15cqw;font-weight:500;line-height:1.3;letter-spacing:0;color:#243d49}
 .today-attention-live>strong{font-size:2.15cqw;line-height:1.2;margin:0}
 .today-attention-live>.today-client-meta{font-size:1.05cqw;line-height:1.35;padding:0;margin:0;gap:.3cqw 1cqw}
 .today-attention-live>.today-call-action{top:1.25cqw;right:1.5cqw;min-width:8cqw;min-height:4.3cqw;padding:.7cqw 1cqw;font-size:1.4cqw}
 .today-attention-live>.today-call-action svg{width:1.8cqw;height:1.8cqw}
 .today-attention-live>strong,.today-attention-live>small:first-child{max-width:calc(100% - 8.5cqw)}
 .today-call-context{font-size:1.15cqw;line-height:1.3;padding-top:.6cqw}
 .today-call-context>small{font-size:.85cqw;line-height:1.2}
 .today-call-context p{margin:.35cqw 0 .45cqw}
 .today-call-context>div{padding:.4cqw .7cqw;gap:.15cqw}
 .today-call-context>div strong{font-size:1cqw}
 .today-demo[data-stage=draft-edit] .today-channel-row{font-size:1.05cqw;gap:1.8cqw;margin:0 0 .3cqw}
 .today-channel-row>span,.today-channel-row>b{padding:.25cqw 0 .4cqw}
 .today-demo[data-stage=draft-edit] .today-message-hint{font-size:1cqw;margin:0}
 .today-demo[data-stage=draft-edit] .today-message-box{font-size:1.1cqw;padding:.5cqw .8cqw;line-height:1.35}
 .today-demo[data-stage=draft-edit] .today-message-actions{margin-top:.3cqw}
 .today-demo[data-stage=draft-edit] .today-message-actions span{font-size:1cqw;padding:.3cqw .7cqw}
}
@media(max-width:650px){
 .today-attention-live>small:first-child{font-size:14px;font-weight:600;line-height:1.3;letter-spacing:0;color:#243d49}
 .today-attention-live>.today-client-meta{margin-top:0}
}

/* Readable demo typography with concise labels and an inline delivery state. */
.today-basket-heading{position:absolute;z-index:3;left:8%;top:56.4%;width:22%;padding:2px 0;background:#fff;color:#243d49;font-size:1.5cqw;font-weight:600;line-height:1.3}
.today-demo[data-channel=email] .today-channel-row{display:flex!important}
.today-demo[data-message-state=sent] .today-channel-row:after{content:'Marked sent';margin-left:auto;color:#246146;font-size:inherit;font-weight:600}
.today-demo[data-message-state=sent] .today-message-actions{visibility:hidden}
@media(min-width:651px){
 .today-attention-live>small:first-child{font-size:1.5cqw;font-weight:600}
 .today-attention-live>strong{font-size:2.4cqw}
 .today-attention-live>.today-client-meta{font-size:1.2cqw}
 .today-call-context{font-size:1.4cqw}
 .today-call-context>small{font-size:1.1cqw;letter-spacing:0}
 .today-call-context>div strong{font-size:1.2cqw}
 .today-demo[data-stage=draft-edit] .today-channel-row{font-size:1.3cqw}
 .today-demo[data-stage=draft-edit] .today-message-hint{font-size:1.2cqw}
 .today-demo[data-stage=draft-edit] .today-message-box{font-size:1.4cqw}
 .today-demo[data-stage=draft-edit] .today-message-actions span{font-size:1.2cqw}
}
@media(max-width:650px){.today-basket-heading{display:none}.today-app-canvas[data-pane=notes] .today-basket:before{font-size:14px}.today-demo[data-message-state=sent] .today-channel-row:after{font-size:12px}}

/* ReUI c-avatar-25 bordered count pill, adapted to this HTML illustration. */
.today-team{position:absolute;right:14px;display:inline-flex;align-items:center;gap:6px;padding:3px 7px 3px 3px;border:1px solid #cbdce6;border-radius:999px;background:#fff;box-shadow:0 2px 4px #08243308;letter-spacing:0}
.today-team-faces{display:flex;padding-left:0}
.today-team-avatar{display:block;width:26px;height:26px;border:2px solid #fff;border-radius:50%;overflow:hidden;background:#dcebf3;box-sizing:border-box}
.today-team-avatar+.today-team-avatar{margin-left:-6px}
.today-team-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.today-team-count{font-size:11px;font-weight:600;color:#466273}
@media(max-width:650px){.today-phone-header .today-team{right:8px;gap:3px;padding:2px 4px 2px 2px}.today-team-avatar{width:19px;height:19px}.today-team-avatar+.today-team-avatar{margin-left:-8px}.today-team-count{font-size:9px}.today-phone-header .today-browser-logo .wordmark{font-size:14px!important}.today-phone-header .today-browser-logo{gap:3px}}

/* Compact upload status below the folders, using ReUI's status-message pattern. */
.today-upload-progress{position:absolute;top:calc(100% + 10px);right:0;width:65%;height:36px;opacity:0;pointer-events:none;transition:opacity .2s ease;color:#36586b;font-size:11px;line-height:16px}
.today-upload-label{display:flex;justify-content:space-between;gap:8px;white-space:nowrap}
.today-upload-label>span:first-child{font-weight:600;color:#173d50}
.today-upload-track{height:4px;margin-top:6px;border-radius:99px;background:#deedf4;overflow:hidden}
.today-upload-track>span{display:block;width:0;height:100%;border-radius:inherit;background:#09a5e6;transition:width 1.3s ease,background .3s ease}
.today-demo:is([data-stage=drop],[data-stage=link],[data-stage=filed]) .today-upload-progress{opacity:1}
.today-demo[data-stage=drop] .today-upload-track>span{width:42%}
.today-demo[data-stage=link] .today-upload-track>span{width:78%}
.today-demo[data-stage=filed] .today-upload-track>span{width:100%;background:#27866a}
.today-demo[data-busy=inbox] .today-receipt,.today-demo[data-busy=inbox] .today-receipt-backdrop{display:none}
@media(max-width:650px){.today-app-canvas[data-pane=folders]{height:360px}.today-upload-progress{width:65%;font-size:10px}}
@media(prefers-reduced-motion:reduce){.today-upload-progress,.today-upload-track>span{transition:none}}
@media(min-width:651px){.today-native-folders{height:30%}}

/* Lift the open document above the entire demo, including its browser chrome. */
.today-native-folders:has(.folder-float[data-open]){z-index:30}
.today-demo .folder-float[data-open] .folder-float__items{z-index:20}
.today-demo .folder-float[data-open]{z-index:31}
.today-app-canvas:has(.folder-float[data-open]){overflow:visible}
/* Team is part of the chrome grid, not an overlaid badge. */
.today-browser-bar{display:grid;grid-template-columns:1fr auto 1fr;padding:0 16px;gap:12px}
.today-browser-dots{position:static;grid-column:1;grid-row:1;justify-self:start}
.today-browser-logo{grid-column:2;grid-row:1}
.today-team{position:static;grid-column:3;grid-row:1;justify-self:end;padding:0;border:0;background:transparent;box-shadow:none;gap:7px}
.today-team-avatar{position:relative;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease;transform-origin:center bottom}
.today-team-avatar:hover{z-index:3;transform:translateY(-5px) rotate(-4deg) scale(1.12);box-shadow:0 5px 9px #12384a24}
.today-team-avatar:nth-child(even):hover{transform:translateY(-5px) rotate(4deg) scale(1.12)}
@media(max-width:650px){
 .today-browser-bar{display:none}
 .today-phone-header{display:grid!important;grid-template-columns:1fr auto 1fr;gap:6px;padding:0 10px!important}
 .today-phone-header:before{grid-column:1;grid-row:1;font-size:8px;letter-spacing:1px}
 .today-phone-header .today-browser-logo{position:static;transform:none;grid-column:2;grid-row:1}
 .today-phone-header .today-team{position:static;padding:0;gap:3px}
}
@media(prefers-reduced-motion:reduce){.today-team-avatar{transition:none}.today-team-avatar:hover{transform:none}}

/* Upload status follows the Inbox holder itself, not the two-folder group. */
.today-native-folders [data-kind=inbox] .today-upload-progress{top:calc(100% + 6px);left:4%;right:auto;width:92%;height:28px;font-size:10px;line-height:14px}
.today-upload-track{margin-top:4px;height:3px}
@media(max-width:650px){.today-native-folders [data-kind=inbox] .today-upload-progress{top:calc(100% + 6px);font-size:9px}}

/* Readable card type and a compact reminder anchored to the calendar corner. */
@media(min-width:651px){
 .today-basket-heading,.today-attention-live>small:first-child{font-size:1.65cqw}
 .today-note{font-size:1.6cqw;line-height:1.45}
 .today-attention-live>strong{font-size:2.6cqw}
 .today-call-context{font-size:1.5cqw;line-height:1.3}
 .today-demo[data-stage=draft-edit] .today-message-box{font-size:1.5cqw}
 .today-app-canvas .today-due-reminder{left:auto;right:7.7%;top:57%;width:14.5%;min-height:0;padding:7px!important;gap:6px;font-size:11px;align-items:flex-start}
 .today-due-reminder small{font-size:9px;line-height:1.35}
}
@media(max-width:650px){
 .today-attention-live>small:first-child,.today-app-canvas[data-pane=notes] .today-basket:before{font-size:16px}
 .today-app-canvas[data-pane=notes] .today-note{font-size:15px;line-height:1.5}
 .today-demo[data-reminder=due] .today-app-canvas[data-pane=calendar] .today-due-reminder{left:auto;right:12px;top:12px;width:142px;min-height:0;gap:6px;font-size:12px}
}

/* Give the enlarged writing a real, bounded card rather than a raster edge. */
@media(min-width:651px){
 .today-card-notes,.today-basket-heading{display:none!important}
 .today-app-canvas:after{display:none}
 .today-basket{left:5.8%;top:55%;width:40%;height:38%;box-sizing:border-box;padding:4.6cqw 1.8cqw 1.8cqw;background:#fff;border:1px solid #b3cbd9;border-radius:16px;box-shadow:0 8px 20px -12px #00304955;overflow:hidden}
 .today-basket:before{content:'Thought Basket';position:absolute;left:1.8cqw;top:1.4cqw;font-size:1.65cqw;font-weight:600;color:#243d49}
 .today-basket .today-note{position:static;width:100%;height:100%;min-height:0;margin:0;transform:none;overflow:auto;scrollbar-width:thin;font-size:1.6cqw;line-height:1.4}
 .today-attention-live{height:36%}
 .today-calendar-depth{height:38%}
}
@media(max-width:650px){
 .today-app-canvas[data-pane=notes]{height:360px!important}
 .today-app-canvas[data-pane=notes]:after{display:none}
 .today-app-canvas[data-pane=notes] .today-note{height:100%;overflow:auto;box-sizing:border-box;scrollbar-width:thin}
}
/* A separate paper slip emerges from Inbox to carry upload status. */
.today-native-folders [data-kind=inbox] .today-upload-progress{top:8%;left:8%;width:84%;height:70px;padding:12px;box-sizing:border-box;background:#fff;border:1px solid #c9dce7;border-radius:7px;z-index:25;box-shadow:0 5px 14px #12384a18;transform:translateY(20px);transition:opacity .2s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.today-demo:is([data-stage=drop],[data-stage=link],[data-stage=filed]) .today-upload-progress{transform:translateY(-70%)}
.today-upload-label{gap:5px;font-size:10px;line-height:15px}
.today-upload-label>span:last-child{font-size:9px}
.today-upload-track{margin-top:10px;height:4px}
.today-native-folders:has(.today-upload-progress){overflow:visible}
@media(prefers-reduced-motion:reduce){.today-native-folders [data-kind=inbox] .today-upload-progress{transition:none}}
@media(min-width:651px){.today-basket{height:39.5%}.today-basket .today-note{line-height:1.35}.today-calendar-depth{height:39.5%}}
/* Keep the calendar date heading clear and remove completed steps from drafting. */
@media(min-width:651px){.today-app-canvas .today-due-reminder{top:61.5%}}
.today-demo[data-stage=draft-edit] .today-outcome-row,.today-demo[data-stage=draft-edit] .today-follow-chip,.today-demo[data-stage=draft-edit] .today-complete-row{display:none}
@media(max-width:650px){.today-demo[data-reminder=due] .today-app-canvas[data-pane=calendar] .today-due-reminder{top:48px}}
.today-demo[data-stage=draft-edit] .today-call-context{display:none}
@media(min-width:651px){.today-demo[data-stage=draft-edit] .today-client-meta{display:none}.today-demo[data-stage=draft-edit] .today-message-hint{display:none!important}}
@media(min-width:651px){.today-demo[data-stage=draft-edit] .today-attention-live{padding-bottom:4px}.today-demo[data-stage=draft-edit] .today-message-actions{margin-top:0}}