/* EazyReader Launch 2.0 exploration. Brand tokens from tokens.css (mirrors proto/app.css). */
:root{
  --night:#141413; /* = --ui-ink, used for ink pills and card text */ --night-2:var(--ui-panel); --night-line:var(--ui-line);
  --paper:#f3f1ea; --paper-2:#faf9f5; --body:#31312f; --on-night:var(--ui-ink); --on-night-2:var(--body); --on-night-3:var(--ui-ink-2);
  --blue:#2f4fa8; --teal:#1f6f6b; --green:#2f6b3a; --plum:#8a4476; --red:#a8322d; --gold:#c4920a;
  /* card fills: the app's own room/highlight tints (proto/app.css --hl-*), sepia page for PDFs */
  --c-blue:var(--hl-sky,#dde3f3); --c-teal:var(--hl-mist,#d3e6e6); --c-green:var(--hl-sage,#dce8d4); --c-plum:var(--hl-rose,#efdbe8); --c-red:#f4ecd8; --c-gold:var(--hl-honey,#f3e3a6);
  --hl-honey:#f3e3a6; --hl-sage:#dce8d4; --hl-mist:#d3e6e6; --hl-rose:#efdbe8; --hl-sky:#dde3f3;
  --radius-card:22px; --ink:#141413;
  --h1-pdf:#bdbbb4; /* fading PDF. visual metaphor */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ui-bg);color:var(--on-night);font:400 16px/1.55 var(--shell);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block}
a{color:inherit}
code{font-family:var(--mono);font-size:.9em;background:var(--ui-hover);padding:.1em .35em;border-radius:6px}
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--gutter)}
.center{text-align:center}
.skip{position:absolute;left:-999px;top:8px;background:var(--paper);color:var(--ink);padding:8px 12px;border-radius:8px;z-index:99}
.skip:focus{left:8px}
.local-status{margin:0;padding:6px 12px;text-align:center;font-size:12px;color:var(--ui-ink-2);background:var(--ui-panel);border-bottom:1px solid var(--ui-line-soft)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:8px}
i[class^="d-"],i[class*=" d-"]{display:inline-block;width:8px;height:8px;border-radius:50%;flex:none}
.d-blue{background:var(--blue)}.d-teal{background:var(--teal)}.d-green{background:var(--green)}.d-plum{background:var(--plum)}.d-red{background:var(--red)}.d-gold{background:var(--gold)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px/1 var(--shell);padding:13px 22px;border-radius:999px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-sm{font-size:13.5px;padding:10px 16px}
.btn-ink{background:var(--night);color:var(--paper)}
.btn-ink:hover{background:#2b2a27}
.btn-paper{background:var(--ui-ink);color:var(--paper)}
.btn-paper:hover{background:#2b2a27}
.btn-ghost{background:transparent;color:var(--night);border-color:rgba(20,20,19,.3)}
.btn-ghost-d{background:var(--ui-panel);color:var(--ui-ink);border-color:var(--ui-line-strong)}
.btn-ghost-d:hover{background:var(--ui-hover)}

/* Nav */
.nav{position:sticky;top:0;z-index:20;background:rgba(243,241,234,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent}
.nav-in{max-width:1280px;margin:0 auto;padding:14px var(--gutter);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;min-width:0}
.wordmark{font-weight:700;font-size:17px;letter-spacing:-.01em}
.brand-rule{color:var(--on-night-3);font-weight:300}
.brand-tagline{color:var(--on-night-3);font-size:14.5px;font-weight:500;overflow:hidden;text-overflow:ellipsis}
.nav-pill{display:flex;gap:2px;padding:4px;border:1px solid var(--night-line);border-radius:999px;background:var(--ui-panel)}
.nav-pill a{text-decoration:none;font-size:13.5px;font-weight:500;color:var(--on-night-2);padding:7px 14px;border-radius:999px}
.nav-pill a:hover{color:var(--ui-ink);background:var(--ui-hover)}
.nav-cta{display:flex;gap:8px;justify-content:flex-end}

/* Hero */
.hero{position:relative;padding:var(--space-16) 0 0;overflow:visible}
.grid-bg{position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(20,20,18,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(20,20,18,.045) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%)}
.hero-in{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center}
.badge{display:inline-flex;align-items:center;gap:10px;margin:0 0 26px;padding:7px 14px 7px 10px;border-radius:999px;border:1px solid var(--night-line);background:var(--ui-panel);font-size:13px;font-weight:600;color:var(--ui-ink-2)}
.badge .dots{display:inline-flex;gap:4px}
.badge .dots i{width:7px;height:7px;opacity:.25;animation:badge-fade 2.4s ease-in-out infinite}
.badge .dots i:nth-child(2){animation-delay:.2s}.badge .dots i:nth-child(3){animation-delay:.4s}.badge .dots i:nth-child(4){animation-delay:.6s}.badge .dots i:nth-child(5){animation-delay:.8s}.badge .dots i:nth-child(6){animation-delay:1s}
@keyframes badge-fade{0%,70%,100%{opacity:.25}35%{opacity:1}}
@media (prefers-reduced-motion:reduce){.badge .dots i{animation:none;opacity:1}}
.badge-sep{color:var(--on-night-3)}
h1{font:800 clamp(40px,6.2vw,80px)/1.16 var(--shell);letter-spacing:-.035em;margin:0 auto;max-width:none;line-height:calc(1em + 14px);text-align:center}
/* Markdown color cycle: word steps the badge dots. Underline stays gold #c4920a on every pass.
   Underline lives on the wrap so the wipe mask cannot clip the overhang past the n.
   Vertical: 6px below the typographic baseline (x-height bottom), not below the descender/overflow box.
   Line-height is .98em + 6px so the rule has clear air above line 2's cap height at 1280 and 390.
   Horizontal: flush with the M ink (Figtree 800 left sidebearing .068em); 8px past the final n.
   Thickness .07em. Wipe mask is a hard edge (0 feather). */
@property --md-cut{syntax:"<number>";inherits:false;initial-value:0}
.h1-line1,.h1-line2{display:block;}
.h1-md-wrap{position:relative;display:inline-block;white-space:nowrap;vertical-align:bottom;overflow:visible;--md-word:#2f4fa8;--md-line:#c4920a}
.h1-md{color:var(--md-word,#2f4fa8);--md-word:#2f4fa8;--md-cut:0;position:relative;display:inline-block;white-space:nowrap;vertical-align:bottom;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,transparent calc((var(--md-cut) - 1) * 100%),#000 calc((var(--md-cut) - 1) * 100%),#000 calc(var(--md-cut) * 100%),transparent calc(var(--md-cut) * 100%));
  mask-image:linear-gradient(to bottom,transparent 0,transparent calc((var(--md-cut) - 1) * 100%),#000 calc((var(--md-cut) - 1) * 100%),#000 calc(var(--md-cut) * 100%),transparent calc(var(--md-cut) * 100%));
  -webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  animation:md-wipe 4.8s ease-in-out infinite}
.h1-md-wrap::after{content:"";position:absolute;left:.068em;right:auto;width:calc(100% - .068em + 8px);top:calc((1lh - 1.2em) / 2 + .95em + 6px);bottom:auto;margin-top:0;height:.07em;border-radius:99px;background:var(--gold,#c4920a);opacity:.9;transform:scaleX(0);transform-origin:left;animation:md-line 4.8s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes md-wipe{
  0%{--md-cut:0}
  25%{--md-cut:1}
  75%{--md-cut:1}
  100%{--md-cut:2}
}
@keyframes md-line{
  0%,25%{transform:scaleX(0);opacity:.9}
  41.666%,75%{transform:scaleX(1);opacity:.9}
  100%{transform:scaleX(1);opacity:0}
}
/* Variant B (html.md-dots-on, from ?dots): gold thinking-wave at the end of the underline.
   Dots stay put (no scale or bounce); only opacity waves. Hidden by default and for reduced motion. */
.md-think{display:inline-flex;position:absolute;left:calc(100% + 16px);right:auto;top:calc((1lh - 1.2em) / 2 + .95em + 6px + .035em - 6px);margin-top:0;transform:none;align-items:center;gap:10px;height:12px;pointer-events:none;color:var(--gold,#c4920a);z-index:1}
html.md-dots-off .md-think{display:none}
.md-think i{width:12px;height:12px;border-radius:50%;background:var(--gold,#c4920a);opacity:.2;animation:ai-dot-pulse 1.2s ease-in-out infinite;transform:none}
.md-think i:nth-child(2){animation-delay:.4s}
.md-think i:nth-child(3){animation-delay:.8s}
@keyframes ai-dot-pulse{0%,100%{opacity:.2;transform:none}50%{opacity:1;transform:none}}
.h1-pdf{color:var(--h1-pdf);white-space:nowrap}
.lead{font-size:var(--text-lead);color:var(--ui-soft);max-width:620px;margin:14px auto 0}
.fine{font-size:var(--text-sm);color:var(--ui-muted);margin:var(--space-4) 0 0}
.fine sup,.tile sup,.spec sup,.plan sup,.faq sup{font-size:.7em;color:inherit}

/* split button (openbot download treatment) */
.split{position:relative;display:inline-flex;border-radius:999px;background:var(--ui-ink);color:var(--paper);box-shadow:0 12px 30px -14px var(--ui-shadow),0 0 0 5px var(--ui-hover)}
.split button{font:600 16px/1 var(--shell);background:none;border:0;color:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:10px}
.split-main{padding:16px 22px 16px 24px;border-radius:999px 0 0 999px}
.split-more{padding:0 16px;border-left:1px solid rgba(243,241,234,.22)!important;border-radius:0 999px 999px 0}
.split button:hover{background:rgba(243,241,234,.1)}
.split-menu button{color:var(--ui-ink)}
.split-menu button:hover{background:var(--ui-hover)}
.split-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);min-width:300px;background:var(--paper-2);border-radius:16px;padding:6px;box-shadow:0 24px 60px -20px var(--ui-shadow),0 0 0 1px var(--ui-line-soft);z-index:5;text-align:left}
.split-menu button{width:100%;padding:11px 12px;border-radius:10px;font-size:14px;gap:10px}
.split-menu small{margin-left:auto;font-size:12px;color:var(--ui-muted);font-weight:500}

/* Demo window — flat, 1:1 with proto/app.css + c13-reader.css and the installed build.
   Type tokens cited in comments. No 3D transform. Tabs are static; only the EazyReader+ view is shown. */
.demo-wrap.wrap{position:relative;margin-top:64px;margin-bottom:0;max-width:1080px;padding:52px 0 0}
.win{margin:0;background:var(--ui-bg);color:var(--ui-ink);border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--ui-line),0 28px 64px -28px rgba(20,20,18,.28);transform:none;animation:win-in .8s .15s cubic-bezier(.2,.8,.2,1) both}
@keyframes win-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.win-shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:580px;--bar-h:28px;--nav-hang:11px;--nav-text:20px;--side-w:248px}
.side{position:relative;display:flex;flex-direction:column;min-height:0;background:var(--ui-bg);border-right:1px solid rgba(20,20,19,.08);padding:0;font-family:var(--shell);color:var(--ui-ink)}
.side-head{flex:0 0 var(--bar-h);height:var(--bar-h);position:relative;box-sizing:border-box}
.side-head::before{content:"";position:absolute;left:8px;top:14px;width:52px;height:12px;transform:translateY(-50%);pointer-events:none;background:
  radial-gradient(circle closest-side at 6px 6px,#ff5f57 96%,transparent 100%),
  radial-gradient(circle closest-side at 26px 6px,#febc2e 96%,transparent 100%),
  radial-gradient(circle closest-side at 46px 6px,#28c840 96%,transparent 100%)}
.side-search{flex:0 0 auto;padding:8px 0 4px}
.search-quiet{margin:0 8px;padding:0 8px 0 2px;display:flex;align-items:center;gap:6px;border:0;background:rgba(20,20,19,.04);border-radius:var(--radius-md);min-height:32px;font:400 12px var(--shell);color:var(--ui-muted)}
.search-quiet svg{flex:0 0 14px;margin-left:6px;color:var(--ui-muted)}
.side-scroll{flex:1 1 auto;min-height:0;overflow:hidden;padding:0 0 8px}
.sec-row{position:relative;height:22px;margin:16px 0 4px}
.sec-row.recent{margin:14px 0 4px}
.sec-row.unfiled{margin-top:14px}
.recent-row{position:relative;margin:0;height:28px;padding:0 12px 0 20px;display:flex;align-items:center;font:400 12.5px/1 var(--shell);color:var(--ui-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recent-row.active{color:var(--ui-ink);font-weight:500}
.recent-row.active::before{content:"";position:absolute;left:10px;top:6px;bottom:6px;width:2px;background:var(--ui-ink);border-radius:1px}
.sec{position:absolute;left:20px;right:36px;margin:0;font-size:10px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--ui-muted);line-height:22px;font-family:var(--shell)}
.sec-add{position:absolute;left:212px;top:0;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:400;color:var(--ui-muted);line-height:1}
.room-row{position:relative;display:flex;align-items:center;height:28px;margin:0;padding:0 34px 0 20px;font-size:var(--text-sm);font-weight:500;color:var(--ui-ink);font-family:var(--shell);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room-row.closed{font-weight:400;color:var(--ui-soft)}
.room-dot{position:absolute;left:8px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;padding:0;background:#b0aea5}
.room-row .chev{position:absolute;left:212px;top:50%;margin-top:-11px;width:22px;height:22px;color:var(--ui-muted);display:block}
.room-card{position:relative;margin:0 10px 0 4px;padding:2px 0 6px;background:var(--ui-panel);border-radius:var(--radius-lg)}
.room-card .room-row{padding-left:16px}
.room-card .room-dot{left:4px}
.room-card .chev{left:208px}
.coll-row{position:relative;margin:0;height:28px;padding:0 34px 0 24px;display:flex;align-items:center;font:500 12.5px/1 var(--shell);color:var(--ui-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.coll-row .chev{position:absolute;left:208px;top:50%;margin-top:-11px;width:22px;height:22px;color:var(--ui-muted);display:block}
.nest-doc{position:relative;margin:0;height:28px;padding:0 12px 0 46px;display:flex;align-items:center;font:400 12px/1 var(--shell);color:var(--ui-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unfiled-doc{margin:0;height:28px;padding:0 12px 0 20px;display:flex;align-items:center;font:400 12.5px/1 var(--shell);color:var(--ui-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-foot{flex:0 0 auto;padding:8px 0 8px;border-top:1px solid var(--ui-border)}
.nav-pin{position:relative;margin:0;height:28px;padding:0 12px 0 20px;display:flex;align-items:center;box-sizing:border-box;font:400 12px/28px var(--shell);font-weight:400;color:var(--ui-muted);letter-spacing:0}
.nav-pin .pin-ico{position:absolute;left:5px;top:8px;width:12px;height:12px;margin:0;color:var(--ui-muted);flex:none;display:block;overflow:visible}
.nav-pin span{font:inherit;font-weight:inherit;color:inherit;line-height:inherit}
.win-main{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--ui-bg)}
.win-bar{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;height:var(--bar-h);padding:0 48px;background:var(--ui-bg);white-space:nowrap}
.crumb{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);font-weight:400;color:var(--ui-muted);line-height:16px;font-family:var(--shell);min-width:0}
.fname-quiet{font-size:var(--text-sm);font-weight:450;color:var(--ui-ink-2);line-height:16px;font-family:var(--shell)}
.unfiled-pill{display:inline-flex;align-items:center;height:20px;padding:0 7px;box-sizing:border-box;border-radius:var(--radius-pill);border:1px solid var(--ui-line-soft);background:rgba(250,249,245,.7);font:450 11px/1 var(--shell);color:var(--ui-muted);flex:none}
.add-room-btn{display:inline-flex;align-items:center;height:20px;padding:0 8px;box-sizing:border-box;border-radius:var(--radius-xs);border:1px solid var(--ui-line);background:rgba(250,249,245,.9);font:450 11px/1 var(--shell);color:var(--ui-ink-2);flex:none}
.tb-spacer{flex:1}
.accent-inline-dots{display:flex;align-items:center;gap:10px;height:10px}
.accent-inline-dots i{width:10px;height:10px;border-radius:50%;padding:0;box-shadow:inset 0 0 0 1px var(--ui-line-strong);flex:0 0 10px}
.tb-divider{display:inline-block;width:1px;height:14px;background:var(--ui-divider);flex:0 0 1px;margin:0}
.ai-btn{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:var(--radius-xs);font:450 12px/1 var(--shell);color:var(--ui-muted)}
.ai-btn .spark{width:10.9px;height:11px;color:var(--clay);flex:none}
.pane{flex:1;min-height:0;padding:8px 28px 0;display:flex;flex-direction:column;align-items:center;background:var(--ui-bg);overflow:hidden}
.modes-above{position:relative;display:flex;align-items:stretch;justify-content:center;gap:28px;margin:0 0 16px;padding:0;width:100%;max-width:46rem}
.modes-above .mode{appearance:none;background:none;border:0;position:relative;padding:4px 0 0;font:400 12.5px/1 var(--shell);color:var(--ui-muted);cursor:pointer}
.modes-above .mode.active{color:var(--ui-ink);font-weight:500}
.modes-above .mode.active::after{content:"";position:absolute;left:0;width:100%;height:1.5px;background:var(--ui-ink);top:calc(4px + 0.8em + 6px)}
.has-mode-ink .modes-above .mode.active::after{content:none}
.mode-ink{position:absolute;left:0;width:0;height:1.5px;background:var(--ui-ink);top:calc(4px + 0.8em + 6px);pointer-events:none;transition:left .4s ease,width .4s ease}
.er-stage{position:relative;width:100%;max-width:46rem;flex:1;min-height:0;background:var(--ui-panel);border:1px solid #e8e6dc;border-bottom:0;border-radius:10px 10px 0 0;box-shadow:0 1px 2px rgba(20,20,18,.03);overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 28px),transparent 100%)}
.win .er-page.er-view{position:absolute;inset:0;width:auto;max-width:none;flex:none;margin:0;border:0;border-radius:0;box-shadow:none;background:transparent;opacity:0;visibility:hidden;pointer-events:none;z-index:0;transition:opacity .35s ease}
.win .er-page.er-view.is-on{opacity:1;visibility:visible;pointer-events:auto;z-index:1}
/* Reader type: exact tokens from proto/c13-reader.css (with later overrides) and proto/app.css.
   Citations are in previews/mockup-typesheet-tokens.txt. Unscaled; mockup is ~1:1 at 1080. */
.win .er-page{width:100%;max-width:46rem;flex:1;background:var(--ui-panel);border:1px solid #e8e6dc;border-bottom:0;border-radius:10px 10px 0 0;padding:2.75rem 4rem 4rem;box-shadow:0 1px 2px rgba(20,20,18,.03);
  color:var(--ui-ink);font-family:"Newsreader","Source Serif Pro",Georgia,serif;font-size:18px;line-height:1.555;font-optical-sizing:auto;font-feature-settings:"liga" 1,"kern" 1,"onum" 1,"calt" 1;font-variant-numeric:oldstyle-nums proportional-nums;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.win .er-page .kicker{margin:0 0 1.15rem;font-family:"Figtree","Helvetica Neue",sans-serif;font-size:.6875rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;font-variant-caps:all-small-caps;color:var(--accent,#8a4476);line-height:1}
.win .er-page,.win .er-page h1,.win .er-page h2,.win .er-page h3,.win .er-page p{text-align:left}
.win .er-page h1{font-family:"Newsreader",Georgia,serif;font-weight:500;font-size:2.75rem;line-height:1.08;letter-spacing:-.02em;margin:0 0 1.35rem;max-width:38rem;color:var(--ui-ink);text-wrap:pretty;text-align:left}
.win .er-page h2{font-family:"Figtree","Helvetica Neue",sans-serif;font-weight:500;font-size:17.5px;line-height:1.27;letter-spacing:-.01em;margin:2rem 0 .75rem;max-width:38rem;color:var(--ui-ink);text-transform:none;font-variant-caps:normal;text-wrap:balance}
.win .er-page h3{font-family:"Figtree","Helvetica Neue",sans-serif;font-weight:500;font-size:15.5px;line-height:1.33;letter-spacing:0;margin:1.95rem 0 .55rem;max-width:38rem;color:var(--ui-ink);text-transform:none;font-variant-caps:normal}
.win .er-page p{max-width:38rem;margin:0 0 1.75rem;color:#3d3d3a}
.win .er-page a{color:#5c2a4f;text-decoration:none;border-bottom:1px solid rgba(138,68,118,.32)}
.win .er-page a:hover{border-bottom-color:#5c2a4f;color:#5c2a4f}
.win .er-page strong{font-weight:600;color:var(--ui-ink)}
.win .er-page em{font-style:italic}
.win .er-page ul,.win .er-page ol{max-width:38rem;margin:0 0 1.75rem;padding-left:1.2rem;color:#3d3d3a}
.win .er-page li{margin:.32rem 0;padding-left:.15rem;color:#3d3d3a}
.win .er-page li::marker{color:var(--accent,#8a4476)}
.win .er-page ol{font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"tnum" 1,"lnum" 1,"onum" 0}
.win .er-page ol>li::marker{font-family:"Figtree","Helvetica Neue",sans-serif;font-size:.76em;font-weight:500;color:#5c2a4f}
.win .er-page blockquote{max-width:38rem;margin:2.15rem 0;padding:1.25rem 1.5rem 1.3rem 1.4rem;background:#f0eee6;border-left:2.5px solid #8a4476;font-style:italic;color:var(--ui-ink);font-size:1.1rem;line-height:1.48;border-radius:0 2px 2px 0}
.win .er-page blockquote p{margin:0;color:var(--ui-ink)}
.win .er-page blockquote p::before{content:"“";font-style:normal;font-weight:500;color:#8a4476;margin-right:.08em;font-size:1.12em;line-height:0}
.win .er-page code{font-family:"DM Mono",ui-monospace,monospace;font-size:13px;font-weight:400;background:#f3eee4;color:var(--ui-ink);border:none;border-radius:3px;padding:.12em .34em .1em;font-feature-settings:"tnum" 1,"liga" 0;font-variant-numeric:tabular-nums lining-nums}
.win .er-page pre{max-width:38.5rem;margin:1.55rem 0 1.75rem;padding:1.3rem 1.4rem;background:#1c1b19;color:#f5f4ef;border-radius:4px;overflow-x:auto;font-size:.8125rem;line-height:1.65;font-family:"DM Mono",ui-monospace,monospace;font-feature-settings:"tnum" 1,"liga" 0,"calt" 1;border:1px solid #121110}
.win .er-page pre code{background:transparent;padding:0;color:inherit;font-size:1em;border:none;font-weight:400}
.win .er-page hr{border:0;height:0;border-top:1px solid rgba(20,20,18,.10);margin:2.4rem 0;max-width:38rem}
/* Preview typography: proto/app.css .er-page.preview (plain standard markdown). */
.win .er-page.preview{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.65;color:#222;font-optical-sizing:auto;font-feature-settings:normal;font-variant-numeric:normal}
.win .er-page.preview .kicker{display:none}
.win .er-page.preview h1{font-family:inherit;font-size:2rem;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin:0 0 .8rem;color:#111;text-wrap:pretty;text-align:left}
.win .er-page.preview h2{font-family:inherit;font-size:1.35rem;font-weight:650;letter-spacing:0;line-height:1.3;margin:1.6rem 0 .6rem;color:#111;text-transform:none;font-variant-caps:normal}
.win .er-page.preview h3{font-family:inherit;font-size:1.1rem;font-weight:600;letter-spacing:0;line-height:1.35;margin:1.25rem 0 .45rem;color:#111;text-transform:none;font-variant-caps:normal}
.win .er-page.preview p,.win .er-page.preview li{font-size:16px;line-height:1.65;color:#333;letter-spacing:normal;max-width:38rem}
.win .er-page.preview strong{font-weight:650;color:#111}
.win .er-page.preview em{font-style:italic}
.win .er-page.preview a{color:#111;border-bottom:1px solid #ccc}
.win .er-page.preview code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:#f3f3f3;color:#111;padding:.1em .35em;border-radius:3px}
.win .er-page.preview pre{background:#f6f6f6;color:#111;border:1px solid #e5e5e5;border-radius:6px;padding:1rem;font-family:ui-monospace,Menlo,monospace;margin:1rem 0;max-width:38rem}
.win .er-page.preview pre code{background:transparent;padding:0;color:inherit;font-size:1em}
.win .er-page.preview blockquote{background:#f7f7f7;border-left:3px solid #ccc;font-style:italic;padding:.75rem 1rem;margin:1rem 0;border-radius:0;font-size:inherit;line-height:inherit;color:#333}
.win .er-page.preview blockquote p{margin:0;color:#333}
.win .er-page.preview blockquote p::before{content:none}
.win .er-page.preview hr{border:0;border-top:1px solid #e5e5e5;margin:1.6rem 0}
.win .er-page.preview li::marker{color:#333}
.win .er-page.preview ol>li::marker{font-family:inherit;font-size:inherit;font-weight:inherit;color:#333}
/* Source typography: proto/app.css .er-page.source, raw markdown (app.js sets textContent). */
.win .er-page.source{font-family:"DM Mono",ui-monospace,monospace;font-size:13px;line-height:1.55;color:var(--ui-ink);background:var(--ui-panel);font-optical-sizing:auto;font-feature-settings:normal;font-variant-numeric:normal;white-space:normal}
.win .er-page.source .source-md{margin:0;padding:0;border:0;background:transparent;font:inherit;color:var(--ui-ink);white-space:pre-wrap;overflow:visible;max-width:none}
/* Stickers stay inside the wrap, below the 28px chrome, and never extend past the window edge. */
.sticker{position:absolute;z-index:3;font:700 13.5px/1 var(--shell);padding:10px 14px;border-radius:999px;color:var(--night);box-shadow:0 0 0 1px var(--ui-line-soft),0 10px 24px -12px var(--ui-shadow);animation:bob 5s ease-in-out infinite;pointer-events:none}
.sticker b{font-weight:800}
.st-1{background:var(--c-red);right:-52px;left:auto;top:548px;bottom:auto;transform:rotate(-3deg);--r:-3deg}
.st-2{background:var(--c-teal);left:-16px;right:auto;top:4px;bottom:auto;transform:rotate(-4deg);--r:-4deg;animation-delay:-1.5s}
.st-3{background:var(--c-gold);right:16px;left:auto;top:96px;transform:rotate(6deg);--r:6deg;animation-delay:-3s}
@keyframes bob{0%,100%{transform:translateY(0) rotate(var(--r))}50%{transform:translateY(-8px) rotate(var(--r))}}

/* marquee */
.marquee{position:relative;display:flex;align-items:center;border-top:1px solid var(--ui-line-soft);border-bottom:1px solid var(--ui-line-soft);background:var(--ui-panel);overflow:hidden;padding:13.6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mq-track{display:flex;align-items:center;gap:11.9px;width:max-content;flex:none;animation:mq 40s linear infinite}
.mq-track span{font:400 11.9px/1 var(--mono);color:var(--ui-ink-2);padding:7.65px 11.9px;border:1px solid var(--ui-line);background:var(--ui-bg);border-radius:999px;display:inline-flex;align-items:center;gap:6.8px;white-space:nowrap;flex:none}
.mq-track span::before{content:"";width:5.95px;height:5.95px;border-radius:50%;background:var(--teal);flex:none}
.mq-track span.pdf::before{background:var(--red)}
@keyframes mq{to{transform:translateX(-50%)}}

/* sections */
.section{padding:40px 0;position:relative}
.eyebrow{font:600 var(--text-2xs)/1 var(--shell);letter-spacing:.1em;text-transform:uppercase;color:var(--clay);margin:0 0 var(--space-2)}
#features .eyebrow{margin-bottom:var(--space-2)}

h2{font:600 clamp(28px,3.4vw,40px)/1.1 var(--shell);letter-spacing:-.02em;margin:0 0 var(--space-8);max-width:20ch}
.sec-head h2{margin-left:auto;margin-right:auto;margin-bottom:16px}
.sec-head{margin-bottom:48px}
.sec-lead{color:var(--on-night-2);font-size:18px;margin:0 auto;max-width:46ch}

/* bento */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tile{position:relative;border-radius:var(--radius-card);padding:26px 26px 24px;color:var(--night);display:flex;flex-direction:column;min-height:300px;overflow:hidden}
.tile h3{font:700 22px/1.15 var(--shell);letter-spacing:-.02em;margin:auto 0 8px}
.tile p{margin:0;font-size:15px;line-height:1.5;color:rgba(20,20,19,.78)}
.tile p mark{background:linear-gradient(transparent 12%,rgba(255,255,255,.75) 12%,rgba(255,255,255,.75) 92%,transparent 92%);padding:0 2px;border-radius:3px;color:inherit;font:inherit}
.tile .tag{align-self:flex-start;margin-top:16px;font:600 12px/1 var(--shell);padding:7px 10px;border-radius:999px;background:rgba(20,20,19,.08)}
.tile .tag-plus{background:var(--night);color:var(--paper)}
.t-wide{grid-column:span 2}
.t-blue{background:var(--c-blue)}.t-teal{background:var(--c-teal)}.t-green{background:var(--c-green)}.t-plum{background:var(--c-plum)}.t-red{background:var(--c-red)}.t-gold{background:var(--c-gold)}
.tile-art{margin-bottom:22px}
.views-art{display:flex;gap:10px;flex-wrap:wrap}
.va{font:600 15px/1 var(--shell);padding:12px 18px;border-radius:999px;background:rgba(250,249,245,.7)}
.va-1{background:var(--night);color:var(--paper)}
.va-2{font-family:var(--serif);font-weight:500;font-size:17px}
.va-3{font-family:var(--mono);font-weight:400}
.rooms-art{background:rgba(250,249,245,.75);border-radius:12px;padding:10px 12px;font-size:13.5px}
.rooms-art p{margin:0;padding:4px 0;display:flex;align-items:center;gap:9px;color:var(--night);font-size:13.5px}
.rooms-art .sub{padding-left:17px;color:var(--ui-soft)}
.pdf-art{display:flex;align-items:center;gap:14px}
.pdf-file{font:700 13px/1 var(--mono);background:var(--red);color:#fff;color:var(--paper);padding:22px 14px;border-radius:8px}
.pdf-arrow{font-size:22px}
.pdf-page{display:flex;flex-direction:column;gap:7px;background:var(--paper-2);border-radius:8px;padding:14px;width:110px}
.pdf-page b{height:9px;width:70%;background:var(--night);border-radius:3px}
.pdf-page i{height:5px;background:rgba(20,20,19,.25);border-radius:3px}.pdf-page i.s{width:60%}
.hl-art p{font:400 19px/1.5 var(--serif);color:var(--night)}
.hl-art mark{background:linear-gradient(transparent 12%,rgba(255,255,255,.75) 12%,rgba(255,255,255,.75) 92%,transparent 92%);padding:0 2px;border-radius:3px}
.ver-art{background:rgba(250,249,245,.75);border-radius:12px;padding:8px 12px}
.ver-art p{display:flex;align-items:center;gap:9px;margin:0;padding:5px 0;font-size:13.5px;color:var(--night)}
.ver-art i{width:7px;height:7px;border-radius:50%;background:var(--green)}
.ver-art span{margin-left:auto;color:var(--ui-soft);font-size:12.5px}
.ai-art{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.ai-chip{font:600 12px/1 var(--shell);background:var(--blue);color:#fff;padding:7px 10px;border-radius:999px}
.ai-art p{background:rgba(250,249,245,.8);border-radius:14px 14px 14px 4px;padding:11px 14px;font-size:14px;color:var(--night)}

/* download cards */
.dl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dl{border-radius:var(--radius-card);padding:30px 28px 26px;color:var(--night);display:flex;flex-direction:column;transition:transform .25s ease}
.dl:hover{transform:translateY(-4px)}
.dl-ic{width:58px;height:58px;color:var(--night)}
.dl-plus{display:flex;align-items:center;justify-content:center;font:800 64px/1 var(--shell);letter-spacing:-.04em}
.dl-status{margin:52px 0 6px;font:600 12px/1 var(--shell);letter-spacing:.1em;text-transform:uppercase;color:rgba(20,20,19,.66)}
.dl h3{font:700 clamp(26px,2.6vw,34px)/1.05 var(--shell);letter-spacing:-.03em;margin:0 0 20px}
.spec{margin:0 0 22px;border-top:1px solid rgba(20,20,19,.14)}
.spec div{display:grid;grid-template-columns:76px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid rgba(20,20,19,.14);font-size:14px}
.spec dt{color:rgba(20,20,19,.62)}
.spec dd{margin:0;font-weight:500}
.spec dd b{font-weight:800}
.dl .btn{align-self:flex-start;margin-top:auto}
.dl-note{margin:12px 0 0;font-size:12.5px;color:rgba(20,20,19,.68)}
.wl-flag{display:inline-flex;align-items:center;gap:6px;font:600 12px/1.3 var(--shell)!important}
.wl-flag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red);flex:none}
.dl-wide{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr 1.2fr;grid-template-rows:auto auto auto 1fr;column-gap:36px;align-items:start}
.dl-wide .dl-ic{grid-row:1/5}
.dl-wide .dl-status{margin-top:4px;grid-column:2}
.dl-wide h3{grid-column:2;font-size:clamp(22px,2.2vw,30px)}
.dl-wide .dl-desc{grid-column:2;margin:0;color:rgba(20,20,19,.78)}
.dl-wide .steps{grid-column:3;grid-row:1/4}
.dl-wide .dl-actions{grid-column:3;display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px}
.dl-wide .dl-actions .btn{margin:0}
.dl-wide .dl-actions .dl-note{margin:0}
.steps{list-style:none;margin:0;padding:0;border-top:1px solid rgba(20,20,19,.14)}
.steps li{display:flex;gap:16px;align-items:baseline;padding:12px 0;border-bottom:1px solid rgba(20,20,19,.14);font-size:15px;font-weight:500}
.steps span{font:400 12.5px/1 var(--mono);color:rgba(20,20,19,.6)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.plan{position:relative;background:var(--ui-panel);border:1px solid var(--ui-line);box-shadow:var(--shadow-card);border-radius:var(--radius-card);padding:30px 28px;display:flex;flex-direction:column}
.plan-free{background:var(--c-plum);border:0}
.plan-ent{background:var(--c-blue);border:0}
.plan-ent .price{letter-spacing:-.03em}
.plan h3{font:700 15px/1.2 var(--shell);letter-spacing:.01em;margin:0 0 14px;color:var(--on-night-2)}
.plan .plus{color:var(--clay);font-weight:800}
.price{font:800 54px/1 var(--shell);letter-spacing:-.04em;margin:0 0 22px}
.price b{font-size:22px;letter-spacing:-.01em;font-weight:800;margin-left:2px;text-transform:none;vertical-align:baseline}
.price-sm{font-size:40px}
.plan ul{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px;color:var(--on-night-2);font-size:15px}
.plan li{position:relative;padding-left:26px}
.plan li::before{content:"";position:absolute;left:0;top:0;width:16px;height:16px;margin-top:3px;border-radius:50%;background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2 7 10.5l4.5-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.plan .btn{margin-top:auto;align-self:flex-start}
.plan .btn-ghost{color:var(--ui-ink);border-color:var(--ui-line-hover)}
.plan .wl-flag{margin:12px 0 0;color:var(--on-night-3)}
.plan-hi{background:var(--c-gold);color:var(--night);border:0;transform:none;box-shadow:0 0 0 1px rgba(196,146,10,.25),0 30px 70px -30px rgba(122,88,0,.35)}
.plan-hi h3,.plan-hi ul{color:rgba(20,20,19,.8)}
.plan-hi .plus{color:var(--plum)}
.plan-hi li::before{background-color:var(--night)}
.plan-hi .btn-ink{background:var(--night);color:var(--paper)}
.plan-hi .wl-flag{color:rgba(20,20,19,.72)}
.plan-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}
.plan-head h3{margin:0}
.ribbon{position:static;top:auto;right:auto;margin:0;font:600 11px/1 var(--shell);letter-spacing:.02em;text-transform:none;background:var(--plum);color:#fff;padding:5px 9px;border-radius:999px;transform:none;flex:none}

/* faq */
.faq-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:start}
.faq-grid h2{margin-bottom:12px}
.faq-grid .sec-lead{margin:0}
.faq details{border-bottom:1px solid var(--night-line);padding:4px 0}
.faq details:first-child{border-top:1px solid var(--night-line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font:600 17px/1.3 var(--shell);padding:18px 0}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 24px/1 var(--shell);color:var(--clay);transition:transform .25s ease}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 20px;color:var(--on-night-2);max-width:56ch}
.faq a{color:var(--clay-deep)}

/* final cta — v2 closer, on V3 warm paper */
.cta-band{position:relative;margin:0;padding:110px 0;text-align:center;overflow:hidden;border-top:1px solid var(--ui-line-soft);background:var(--ui-bg)}
.cta-band .grid-bg{-webkit-mask-image:radial-gradient(ellipse 50% 70% at 50% 50%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 50% 70% at 50% 50%,#000 20%,transparent 75%)}
.cta-in{position:relative;display:flex;flex-direction:column;align-items:center}
.cta-logo{width:99px;height:66px;margin-bottom:28px;animation:breathe 4s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.06)}}
.cta-band h2{font:800 clamp(36px,5vw,64px)/1.04 var(--shell);letter-spacing:-.04em;margin:0 0 30px;max-width:none;text-align:center}
.cta-row{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center;margin-top:var(--space-8)}
.cta-band .cta-row{margin-top:0}

/* footer */
.foot{border-top:1px solid var(--ui-line);padding:30px 0 34px;background:var(--ui-panel)}
.foot-in{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot nav{display:flex;gap:20px;font-size:14px}
.foot nav a{text-decoration:none;color:var(--on-night-2)}
.foot nav a:hover{color:var(--on-night)}
.foot-legal{margin-top:18px}
.foot-req{margin:0;font-size:12.5px;color:var(--on-night-3)}

/* dialogs */
.sheet{border:0;padding:0;background:transparent;max-width:min(440px,calc(100vw - 32px))}
.sheet::backdrop{background:rgba(20,20,18,.32);backdrop-filter:blur(4px)}
.sheet-card{position:relative;background:var(--paper-2);color:var(--night);border-radius:20px;padding:28px;display:grid;gap:14px}
.sheet-card h2{font-size:24px;margin:0;max-width:none}
.sheet-card p{margin:0;color:var(--ui-soft);font-size:14.5px}
.sheet-card label{display:grid;gap:6px;font-size:13.5px;font-weight:600}
.sheet-card input{font:400 15px var(--shell);padding:11px 12px;border-radius:10px;border:1px solid var(--ui-line-strong);background:#fff}
.sheet-card .btn{justify-self:start}
.sheet-card .wl-flag{color:var(--ui-soft)}
.sheet-card select{font:400 15px var(--shell);padding:11px 12px;border-radius:10px;border:1px solid var(--ui-line-strong);background:#fff;color:var(--night)}
.sheet-card .opt{color:var(--ui-soft);font-weight:400}
.sheet-card .check{display:flex;align-items:flex-start;gap:8px;font-weight:400;color:var(--ui-soft)}
.sheet-card .check input{margin-top:3px;width:auto;padding:0;border:0;border-radius:0;background:transparent;accent-color:var(--night)}
.sheet-card .check a{color:var(--night);text-decoration:underline;text-underline-offset:2px}
.sheet-card .check a:hover{color:var(--clay-deep)}
.sheet-card .check[aria-invalid="true"]{color:var(--clay)}
.sheet-card .privacy{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);color:var(--ui-muted)}
.form-msg.err{color:var(--clay)}
.form-msg.ok{color:var(--clay-deep)}
.sheet-x{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;border:0;background:var(--ui-hover);font-size:20px;cursor:pointer}
.form-msg:empty{display:none}

/* reveal */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.js .reveal.in{opacity:1;transform:none}
.plan-hi.reveal.in{transform:none}

/* responsive */
@media (max-width:1080px){
  .nav-in{grid-template-columns:1fr auto}
  .nav-pill{display:none}
  .bento,.dl-grid,.plans{grid-template-columns:1fr 1fr}
  .dl-wide{grid-template-columns:auto 1fr;}
  .dl-wide .steps,.dl-wide .dl-actions{grid-column:1/-1;grid-row:auto;margin-top:20px}
  .dl-wide .dl-ic{grid-row:1/4}
  .plans .plan:last-child{grid-column:1/-1}
  .sticker{display:none}
}
@media (max-width:720px){
  .nav-wl{display:none}
  .brand-tagline{font-size:13px}
  .wordmark{font-size:16px}
  .bento,.dl-grid,.plans,.faq-grid{grid-template-columns:1fr}
  .t-wide,.dl-wide,.plans .plan:last-child{grid-column:auto}
  .dl-wide{display:flex}
  .faq-grid{gap:24px}
  .hero{padding-top:56px}
  .win-shell{grid-template-columns:1fr;min-height:360px}
  .side{display:none}
  .win-bar{padding-left:80px;position:relative}
  .win-bar::before{content:"";position:absolute;left:8px;top:14px;width:52px;height:12px;transform:translateY(-50%);pointer-events:none;background:
    radial-gradient(circle closest-side at 6px 6px,#ff5f57 96%,transparent 100%),
    radial-gradient(circle closest-side at 26px 6px,#febc2e 96%,transparent 100%),
    radial-gradient(circle closest-side at 46px 6px,#28c840 96%,transparent 100%)}
  .accent-inline-dots,.tb-divider,.add-room-btn{display:none}
  .win-bar{padding-left:80px;padding-right:12px}
  .pane{padding:8px 12px 0}
  .modes-above{gap:18px;margin-bottom:12px}
  .win .er-page{padding:1.5rem 1.4rem 2rem;border-radius:8px 8px 0 0}
  .section{padding-top:40px}
  .plan-hi{transform:none}.plan-hi.reveal.in{transform:none}
  .tile{min-height:0}
  .tile h3{margin-top:0}
  .dl-status{margin-top:28px}
}
@media (max-width:420px){
  .brand{gap:7px}
  .brand img{width:24px;height:16px}
  .wordmark{font-size:15px}
  .brand-tagline{font-size:12px}
  .nav-cta{display:none}
  .nav-in{grid-template-columns:1fr}
  .split-main{padding:15px 16px 15px 18px;font-size:15px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
  .win{animation:none;transform:none;opacity:1}
  .sticker{animation:none}
  .h1-md{color:var(--clay)!important;--md-word:var(--clay);--md-cut:1;-webkit-mask-image:none!important;mask-image:none!important;animation:none!important}
  .h1-md-wrap::after{background:var(--gold)!important;transform:scaleX(1)!important;opacity:.9!important;animation:none!important}
  .md-think,.md-think i{display:none!important;animation:none!important}
  .mode-ink{transition:none!important}
  .win .er-page.er-view{transition:none!important}
}

section[id]{scroll-margin-top:84px}
.brand-rule{color:var(--ui-faint)}.brand-tagline{color:var(--ui-ink-2)}

/* Sticker drag-edit: only when html.edit-stickers is set from ?edit or #edit. Live page is unchanged. */
html.edit-stickers .hero{overflow:visible}
html.edit-stickers .sticker{display:block;pointer-events:auto;animation:none!important;cursor:grab;outline:1px dashed rgba(20,20,19,.55);outline-offset:6px;user-select:none;-webkit-user-select:none;touch-action:none;z-index:20}
html.edit-stickers .sticker.is-dragging{cursor:grabbing;z-index:22}
.sticker-edit-panel{position:fixed;left:16px;bottom:16px;z-index:1000;width:300px;background:var(--ui-panel,#faf9f5);color:var(--ui-ink,#141413);border:1px solid rgba(20,20,19,.14);border-radius:14px;box-shadow:0 16px 40px -18px rgba(20,20,19,.45);padding:12px 14px 14px;font:400 12px/1.35 var(--shell,system-ui);letter-spacing:0}
.sticker-edit-panel h2{margin:0 0 2px;font:650 13px/1.2 var(--shell,system-ui);letter-spacing:0;color:var(--ui-ink,#141413);text-transform:none}
.sticker-edit-panel .hint{margin:0 0 10px;color:var(--ui-muted,#87867f);font-size:11px}
.sticker-edit-panel .st-row{display:grid;gap:4px;padding:8px 0;border-top:1px solid rgba(20,20,19,.08)}
.sticker-edit-panel .st-name{font-weight:600;font-size:12px}
.sticker-edit-panel .st-vals{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-variant-numeric:tabular-nums;color:var(--ui-ink-2,#3d3d3a)}
.sticker-edit-panel .st-vals code{font:400 11.5px/1 var(--mono,ui-monospace,Menlo,monospace);background:rgba(20,20,19,.05);padding:3px 6px;border-radius:6px}
.sticker-edit-panel .st-rotbtns{display:inline-flex;gap:4px;margin-left:auto}
.sticker-edit-panel .st-rotbtns button,.sticker-edit-panel .st-copy{appearance:none;border:1px solid rgba(20,20,19,.16);background:#fff;color:var(--ui-ink,#141413);border-radius:8px;font:600 12px/1 var(--shell,system-ui);cursor:pointer}
.sticker-edit-panel .st-rotbtns button{width:26px;height:26px;padding:0}
.sticker-edit-panel .st-rotbtns button:hover,.sticker-edit-panel .st-copy:hover{background:rgba(20,20,19,.05)}
.sticker-edit-panel .st-copy{margin-top:10px;width:100%;padding:9px 12px;border-radius:10px;background:var(--ui-ink,#141413);color:#faf9f5;border-color:var(--ui-ink,#141413)}
.sticker-edit-panel .st-copy:hover{background:#2a2a28;color:#faf9f5}
.sticker-edit-panel .st-status{margin:8px 0 0;min-height:1.3em;font-size:11px;color:var(--ui-muted,#87867f)}
.sticker-edit-panel .st-css{display:none;margin:8px 0 0;width:100%;min-height:72px;box-sizing:border-box;font:400 11px/1.4 var(--mono,ui-monospace,Menlo,monospace);padding:8px;border-radius:8px;border:1px solid rgba(20,20,19,.14);background:#fff;color:var(--ui-ink,#141413);resize:vertical}
.sticker-edit-panel .st-css.is-on{display:block}


/* ===== Launch 3.0: v1 structure + nav, plus v1 sections grafted onto the v2 card system. */

/* Nav matches v1: logo left, links centered, CTA right. Transparent until scroll. */
.nav{position:sticky;top:0;z-index:20;background:transparent;border-bottom:1px solid transparent;transition:background .2s,border-color .2s,backdrop-filter .2s;padding-top:env(safe-area-inset-top)}
.nav.is-scrolled{background:color-mix(in srgb, var(--ui-bg) 82%, transparent);-webkit-backdrop-filter:saturate(1.2) blur(12px);backdrop-filter:saturate(1.2) blur(12px);border-bottom-color:var(--ui-line-soft)}
.nav-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:60px;width:100%;max-width:none;margin:0;padding:0 40px;box-sizing:border-box;position:relative;gap:0}
.brand{display:inline-flex;align-items:center;gap:var(--space-2);text-decoration:none;height:28px;grid-column:1;grid-row:1;justify-self:start;z-index:2;min-width:0}
.brand img{height:19px;width:auto}
.wordmark{font-weight:600;font-size:15px;letter-spacing:-.005em;line-height:1;color:var(--ui-ink)}
.brand-rule{color:var(--ui-faint);font-weight:400;font-size:15px;line-height:1}
.brand-tagline{font-weight:400;font-size:var(--text-md);line-height:1;color:var(--ui-muted);letter-spacing:-.005em;white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:var(--space-6);margin:0;height:28px;grid-column:1/-1;grid-row:1;justify-self:center;z-index:1}
.nav-links a{display:inline-flex;align-items:center;height:28px;text-decoration:none;font-size:14px;line-height:1;font-weight:500;color:var(--ui-soft);padding:0}
.nav-links a:hover{color:var(--ui-ink);background:none}
.nav-cta{display:flex;align-items:center;gap:var(--space-2);height:28px;grid-column:3;grid-row:1;justify-self:end;z-index:2}
.nav-cta .btn{gap:6px}
.nav-cta .btn-sm{height:28px;padding:0 12px;font-size:13px}
.nav-cta .ic{flex:0 0 auto;width:13px;height:13px}
.lbl-short{display:none}
.nav-menu{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:0;border-radius:var(--radius-md);background:none;color:var(--ui-ink);cursor:pointer}
.nav-menu:hover{background:var(--ui-hover)}
.nav-pill{display:none}

/* Hero type is already set above. Keep the badge, but quieter. */
.hero-in{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center}
.hero .btn-ink{height:44px;padding:0 20px;font-weight:500;font-size:15px}
h2.center{margin-inline:auto;text-align:center}
h3{margin:0 0 var(--space-2);font-size:var(--text-h3);font-weight:600;letter-spacing:-.01em}
p{margin:0}
.lead-sm{font-size:17px;color:var(--ui-soft);max-width:44ch}
.plan-planned-label{font-size:var(--text-2xs);font-weight:600;line-height:1.3;color:var(--ui-muted)}
.ref-soon{margin:0 0 var(--space-2);color:var(--clay)}

/* Before / after (v1) */
.before-after{padding-top:var(--space-12)}
.ba{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-6);align-items:center}
.ba figure{margin:0}
.ba figcaption{font-size:var(--text-xs);font-weight:500;color:var(--ui-muted);margin-bottom:var(--space-2);text-transform:uppercase;letter-spacing:.08em}
.ba img{border-radius:var(--radius-md);border:1px solid var(--ui-line);box-shadow:var(--shadow-card);width:100%;height:auto}
.ba-arrow{color:var(--ui-faint)}

/* How it works loop (v1 format, tinted icon wells for a little life) */
.loop{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);counter-reset:s}
.loop li{position:relative;padding:var(--space-6);border-radius:var(--radius-lg);background:var(--ui-panel);border:1px solid var(--ui-line-soft)}
.loop li::after{content:"";position:absolute;right:calc(-1 * var(--space-6));top:42px;width:var(--space-6);height:1px;background:var(--ui-divider)}
.loop li:last-child::after{display:none}
.loop p{color:var(--ui-soft);font-size:15px}
.loop-ic{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin-bottom:var(--space-4);border-radius:var(--radius-md);font-size:18px}
.loop li:nth-child(1) .loop-ic{background:var(--c-plum);color:var(--plum)}
.loop li:nth-child(2) .loop-ic{background:var(--c-teal);color:var(--teal)}
.loop li:nth-child(3) .loop-ic{background:var(--c-gold);color:#8a6a08}
.loop li:nth-child(4) .loop-ic{background:var(--c-green);color:var(--green)}
.loop-ic svg{width:18px;height:18px}

/* Referral (v1) */
.ref{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-12);align-items:start}
.ref-simple{grid-template-columns:1fr}
#referral{padding-top:var(--space-16);padding-bottom:var(--space-16)}

/* Enterprise early-access band: v1 copy, v2 room tint instead of a dark card */
.ent-band{display:grid;grid-template-columns:1.4fr .8fr;gap:var(--space-12);align-items:center;padding:var(--space-10,40px) var(--space-10,40px);border-radius:var(--radius-card);background:var(--c-blue)}
.ent-list{margin:var(--space-6) 0 var(--space-8);padding:0;list-style:none;display:grid;gap:8px;color:var(--ui-soft)}
.ent-list li{padding-left:1.1em;position:relative}
.ent-list li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.ent-card{padding:var(--space-8);border-radius:var(--radius-lg);background:var(--ui-panel);color:var(--ui-ink);box-shadow:var(--shadow-card);border:1px solid var(--ui-line-soft)}
.ent-card-kicker{font-size:var(--text-2xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin:0 0 var(--space-3)}
.ent-card-title{margin:0;font:600 22px/1.25 var(--shell);letter-spacing:-.02em;color:var(--ui-ink)}
.ent-card-note{margin-top:var(--space-3);font-size:var(--text-sm);color:var(--ui-muted)}
.ent-band .wl-flag{margin-top:12px}

/* FAQ stays a simple v1 stack, with the quieter plus marker from v2 */
.faq{max-width:760px}
#faq h2{margin-bottom:var(--space-6)}
.faq details{border-bottom:1px solid var(--ui-line-soft);padding:4px 0}
.faq details:first-child{border-top:1px solid var(--ui-line-soft)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font:600 17px/1.3 var(--shell);padding:18px 0}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 24px/1 var(--shell);color:var(--clay);transition:transform .25s ease}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 20px;color:var(--ui-soft);max-width:56ch;font-size:15px}
.faq a{color:var(--clay-deep)}

/* Footer feedback control */
.foot-feedback{appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;background:none;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
.foot-feedback:hover{color:var(--ui-ink)}
.fb-note{margin:0;font-size:14px;line-height:1.45;color:var(--ui-soft)}
#fbSend[disabled]{opacity:.45;cursor:not-allowed}
#fbMessage{min-height:120px;font:400 15px var(--shell);padding:11px 12px;border-radius:10px;border:1px solid var(--ui-line-strong);background:#fff;resize:vertical}
.req{color:var(--ui-soft);font-weight:400}


/* Demo wrap: a little more air under the fine print, like v1's screenshot spacing. */
.demo-wrap.wrap{margin-top:28px}

@media (max-width:1240px){
  .nav-in{display:flex;align-items:center;padding:0 var(--gutter);grid-template-columns:none}
  .brand,.nav-cta{grid-column:auto;grid-row:auto;justify-self:auto;z-index:auto;height:36px}
  .nav-cta{margin-left:auto;height:36px}
  .lbl-long{display:none}
  .lbl-short{display:inline}
  .nav-menu{display:inline-flex}
  .nav-links{display:none;position:absolute;top:calc(60px + env(safe-area-inset-top,0px));left:0;right:0;flex-direction:column;align-items:stretch;gap:0;margin:0;padding:var(--space-2) var(--gutter) var(--space-4);background:var(--ui-panel);border-bottom:1px solid var(--ui-line-soft);box-shadow:0 12px 24px -12px var(--ui-shadow);justify-self:stretch;height:auto;z-index:6}
  .nav-links.is-open{display:flex}
  .nav-links a{height:40px}
}
@media (max-width:900px){
  .loop{grid-template-columns:repeat(2,1fr)}
  .loop li::after{display:none}
  .ba{grid-template-columns:1fr;gap:var(--space-4)}
  .ba-arrow{justify-self:center;transform:rotate(90deg)}
  .ent-band{grid-template-columns:1fr;gap:var(--space-8);padding:var(--space-8)}
}
@media (max-width:720px){
  .loop,.plans,.dl-grid,.bento{grid-template-columns:1fr}
  .hero{padding-top:var(--space-12)}
  .section{padding:32px 0}
  .cta-band{padding:var(--space-16) 0}
}
@media (max-width:560px){
  .nav .brand-rule,.nav .brand-tagline{display:none}
}

@media (prefers-reduced-motion:reduce){
  .md-think,.md-think i{display:none!important;animation:none!important}
}

.hero .lead code{padding:0;margin:0;background:none;border-radius:0;font-size:.92em}
.h1-line1{position:relative;z-index:1}
/* Stickers: keep them on the window chrome, off the tab row and page type. */
.st-1{background:var(--c-red);right:-40px;left:auto;top:auto;bottom:36px;transform:rotate(-3deg);--r:-3deg}
.st-2{background:var(--c-teal);left:-28px;right:auto;top:-18px;bottom:auto;transform:rotate(-4deg);--r:-4deg;animation-delay:-1.5s}
.st-3{background:var(--c-gold);right:-44px;left:auto;top:210px;bottom:auto;transform:rotate(6deg);--r:6deg;animation-delay:-3s}

.dl h3{font-size:clamp(22px,2.2vw,30px);white-space:nowrap}
@media (max-width:900px){.dl h3{white-space:normal}}

.demo-wrap.wrap{overflow:visible}
.hero,.demo-wrap,.win{overflow:visible}
.foot-legal{margin-top:22px;display:flex;justify-content:space-between;align-items:baseline;gap:8px 24px;flex-wrap:wrap}
.foot-legal p{margin:0;font-size:12.5px;color:var(--on-night-3)}
.foot-legal{margin-top:12px}
/* Monotone cards, option 1 (Chad, Nov 13): download cards only; pricing row keeps original colors */
.dl{background:var(--ui-panel)!important;border:1px solid var(--ui-line)!important;box-shadow:none!important;color:var(--ui-ink)}
.dl:hover{transform:none}
.dl{transition:border-color .2s ease,box-shadow .2s ease}
.dl:hover{box-shadow:0 0 0 1px var(--plum)!important;border-color:var(--plum)!important}
.dl-ic,.dl-plus{color:var(--night)}
.dl-grid .dl.is-os{border-color:var(--plum)!important;box-shadow:0 0 0 1px var(--plum),0 24px 60px -34px rgba(138,68,118,.45)!important}

/* Mac + Windows free reader, EazyReader+ inline waitlist (Chad, Nov 13) */
.cta-os{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);width:min(100%,440px);margin-inline:auto}
.btn-os{width:100%}
.btn-os .ic{flex:0 0 auto}
.cta-band .cta-row{align-items:center}
.cta-band .btn-os{min-width:212px}
.nav-cta .os-ic{display:inline-flex}
.plan-ctas{margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.plan .plan-ctas .btn{margin:0;align-self:stretch;width:100%}
.plan-ctas .ic{width:13px;height:13px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.wl-inline{margin-top:auto;display:grid;gap:10px}
.wl-inline[hidden],.wl-done[hidden]{display:none}
.wl-label{display:block;padding:0;font:600 12px/1 var(--shell);letter-spacing:.1em;text-transform:uppercase;color:rgba(20,20,19,.66);margin:0 0 8px}
.seg{border:0;margin:0;padding:0;min-width:0}
.seg-row{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:999px;background:rgba(250,249,245,.7);border:1px solid rgba(20,20,19,.16)}
.seg-opt{position:relative;display:block;cursor:pointer}
.seg-opt input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.seg-opt span{display:flex;align-items:center;justify-content:center;height:30px;border-radius:999px;font:600 13.5px/1 var(--shell);color:rgba(20,20,19,.7);transition:background .15s ease,color .15s ease}
.seg-opt input:checked+span{background:var(--night);color:var(--paper)}
.seg-opt input:focus-visible+span{outline:2px solid var(--plum);outline-offset:2px}
.wl-row{display:flex;gap:8px;flex-wrap:wrap}
.wl-row input{flex:1 1 150px;min-width:0;height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(20,20,19,.22);background:#fff;font:400 15px var(--shell);color:var(--night)}
.wl-row input:focus{outline:2px solid var(--plum);outline-offset:1px;border-color:transparent}
.wl-row input[aria-invalid="true"]{border-color:var(--clay)}
.plan .wl-row .btn{margin:0;align-self:auto;height:40px;flex:0 0 auto}
.wl-msg{margin:0;font-size:13px;font-weight:600;color:var(--clay-deep)}
.wl-msg:empty{display:none}
.wl-done{margin-top:auto;display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:rgba(250,249,245,.82);border:1px solid rgba(20,20,19,.12);color:var(--night);font-size:15px;line-height:1.4;outline:none}
.wl-done:focus-visible{box-shadow:0 0 0 2px var(--plum)}
.wl-check{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--night);color:var(--paper);margin-top:1px}
.foot-win{white-space:nowrap}
@media (max-width:420px){
  .cta-os{grid-template-columns:1fr;width:100%}
  .cta-band .btn-os{min-width:0;width:100%}
}
.dl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.dl h3{font-size:clamp(22px,2.1vw,26px)}
@media (max-width:1080px){.dl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.dl-grid{grid-template-columns:minmax(0,1fr)}}
.wl-inline.is-done .wl-row,.wl-inline.is-done .wl-msg{display:none}
.wl-inline.is-done .seg-opt,.wl-inline.is-done .seg-opt input{cursor:default}
.wl-inline.is-done .seg-opt input:not(:checked)+span{color:rgba(20,20,19,.45)}
.wl-inline+.wl-done{margin-top:10px}
