@font-face {
  font-family: Manrope;
  src: url('./assets/manrope.ttf') format('truetype');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SN Pro';
  src: url('./assets/fonts/sn-pro-variable.woff2') format('woff2');
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Echat Rounded CN';
  src: url('./assets/fonts/echat-rounded-cn-400.woff2?v=6f4634e09a83') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-9FFF, U+F900-FAFF, U+FF00-FFEF;
}
@font-face {
  font-family: 'Echat Rounded CN';
  src: url('./assets/fonts/echat-rounded-cn-500.woff2?v=254d4af43fd8') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-9FFF, U+F900-FAFF, U+FF00-FFEF;
}
@font-face {
  font-family: 'Echat Rounded CN';
  src: url('./assets/fonts/echat-rounded-cn-700.woff2?v=20b346f97945') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+2E80-9FFF, U+F900-FAFF, U+FF00-FFEF;
}
:root {
  color-scheme: light;
  --font-ui: 'SN Pro','Echat Rounded CN','PingFang SC','Microsoft YaHei',sans-serif;
  --font-brand: Manrope,sans-serif;
  --paper: #f6f7f3;
  --surface: #fff;
  --ink: #20251f;
  --muted: #60675e;
  --rule: #d6dcd1;
  --green: #c5ed83;
  --ground: #c5ed83;
  --dark: #19241d;
  --dark-muted: #b8c3b0;
  --focus: #4a772d;
  --error: #a32d26;
  --gutter: clamp(22px,5.5vw,88px);
  --ease: cubic-bezier(.16,1,.3,1);
  font-synthesis: none;
}
html[data-theme=dark] {
  color-scheme: dark;
  --paper: #171e17;
  --surface: #252e24;
  --ink: #f1f4e9;
  --muted: #b8c1b1;
  --rule: #3b4937;
  --focus: #c5ed83;
  --error: #ffb4a8;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.65 var(--font-ui); -webkit-font-smoothing:antialiased; }
body:has(dialog[open]) { overflow:hidden; }
::selection { background:var(--green); color:var(--dark); }
::-webkit-scrollbar { width:8px; }
::-webkit-scrollbar-thumb { background:#819174; border:2px solid var(--paper); border-radius:8px; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
button,a,summary { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--focus); outline-offset:5px; }
button:disabled { cursor:not-allowed; opacity:.55; }
img { display:block; max-width:100%; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-weight:600; line-height:1.16; letter-spacing:-.025em; text-wrap:balance; }
p { text-wrap:pretty; }
.shell { width:min(100% - var(--gutter)*2,1320px); margin-inline:auto; }
.icon { width:20px; height:20px; flex:0 0 20px; }
html[data-theme=dark] .icon { filter:invert(1); }
.skip-link { position:fixed; top:-80px; left:20px; z-index:100; background:var(--green); color:var(--dark); padding:12px 20px; }
.skip-link:focus { top:12px; }

/* A conversational hyphen is the E-chat signature at every scale. */
.wordmark,.brand-stage { font-family:var(--font-brand); }
.site-header { position:sticky; top:0; z-index:20; height:80px; background:var(--dark); pointer-events:none; }
.site-header.scrolled { background:transparent; }
.nav-wrap { position:relative; top:16px; display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }
.nav-wrap>* { pointer-events:auto; }
.wordmark { display:inline-flex; align-items:baseline; font-size:31px; font-weight:750; letter-spacing:-.04em; line-height:1; white-space:nowrap; }
.brand-period { color:var(--green); }
.site-header .wordmark { padding:15px 19px 14px; background:var(--dark); color:#f6f7f3; border-radius:16px; }
.nav-dock { position:relative; width:420px; color:var(--ink); }
.nav-toolbar { display:flex; align-items:center; gap:8px; padding:8px; background:var(--paper); border-radius:16px; }
.site-header.scrolled .nav-toolbar,.navigation-panel { box-shadow:0 22px 65px #1725110b; }
.menu-button { display:flex; align-items:center; justify-content:space-between; gap:28px; min-height:44px; padding:0 16px; flex:1; border:0; border-radius:10px; color:inherit; background:transparent; font-size:15px; font-weight:550; }
.menu-glyph { position:relative; width:20px; height:20px; flex:0 0 20px; }
.menu-glyph i { position:absolute; left:0; top:6px; width:20px; height:2px; background:currentColor; border-radius:2px; transition:transform .28s var(--ease),width .28s var(--ease); }
.menu-glyph i+i { top:12px; left:auto; right:0; width:13px; }
.menu-button:hover .menu-glyph i+i { width:20px; }
.menu-button[aria-expanded=true] .menu-glyph i { transform:translateY(3px) rotate(45deg); }
.menu-button[aria-expanded=true] .menu-glyph i+i { width:20px; transform:translateY(-3px) rotate(-45deg); }
.menu-button:hover,.language-button:hover { background:var(--rule); }
.menu-button:active,.language-button:active,.nav-cta:active,.nav-panel-cta:active { transform:scale(.98); }
.nav-cta,.nav-panel-cta { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:44px; padding:0 16px; background:var(--green); color:var(--dark); border-radius:10px; font-size:13px; font-weight:600; }
.nav-cta img,.nav-panel-cta img { width:18px; height:18px; transition:transform .25s var(--ease); }
.nav-cta:hover img,.nav-panel-cta:hover img { transform:translateY(3px); }
.nav-cta:hover,.nav-panel-cta:hover { background:#e4ffc0; }
.navigation-panel { position:absolute; top:calc(100% + 8px); right:0; width:100%; padding:16px 24px 12px; border-radius:16px; background:var(--paper); transform-origin:top right; max-height:calc(100dvh - 108px); overflow:auto; overscroll-behavior:contain; }
.navigation-links { display:grid; }
.navigation-links>a { position:relative; display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:92px; padding:20px 0; border-bottom:1px solid var(--rule); font-size:34px; line-height:1.18; letter-spacing:-.025em; font-weight:500; }
.navigation-links>a>span { transition:transform .25s var(--ease); }
.navigation-links .feature-icon { width:24px; height:24px; color:var(--muted); transition:transform .25s var(--ease),color .25s; }
.navigation-links>a:hover>span { transform:translateX(5px); }
.navigation-links>a:hover .feature-icon { transform:translateX(4px); color:var(--ink); }
.navigation-links>a[aria-current=location] { color:var(--focus); }
.navigation-links>a[aria-current=location] .feature-icon { color:var(--focus); transform:rotate(-45deg); }
.nav-panel-cta { display:none; margin-top:20px; min-height:52px; }
.navigation-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:14px; }
.navigation-platforms { font-size:12px; color:var(--muted); }
.navigation-tools { display:flex; gap:2px; }
.language-button { border:0; background:transparent; color:inherit; font-size:12px; font-weight:650; min-width:44px; min-height:44px; padding:0 8px; border-radius:10px; transition:background .2s; }
.icon-button { border:0; background:transparent; color:inherit; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; transition:background .2s; }
.icon-button img { width:19px; height:19px; }
html[data-theme=dark] .site-header .icon-button img { filter:invert(1); }
.icon-button:hover { background:#85987825; }
.image-dialog .icon-button:hover { background:var(--rule); }
html[data-theme=dark] .image-dialog .icon-button img { filter:invert(1); }
.button { --button-bg:var(--ink); --button-ink:var(--paper); min-height:56px; border:0; display:inline-flex; align-items:center; justify-content:center; gap:25px; padding:15px 22px; color:var(--button-ink); background:var(--button-bg); border-radius:5px; font-size:14px; font-weight:650; position:relative; overflow:hidden; isolation:isolate; transition:transform .25s var(--ease),color .25s; }
.button:before { content:''; position:absolute; inset:0; background:var(--green); transform:translateY(102%); z-index:-1; transition:transform .35s var(--ease); }
.button:hover:before { transform:translateY(0); }
.button:hover { color:#20251f; }
.button:active { transform:scale(.98); }
.button .icon { filter:invert(1); transition:transform .3s var(--ease),filter .2s; }
.button:hover .icon { transform:translate(3px,-3px); filter:none; }
.button[href^="#"]:hover .icon { transform:translateY(3px); }
html[data-theme=dark] .button .icon { filter:none; }
.text-link { display:inline-flex; align-items:center; gap:14px; min-height:44px; font-size:13px; font-weight:600; }
.text-link .icon { transition:transform .3s var(--ease); }
.text-link:hover .icon { transform:translateY(4px); }

/* One authored entrance: separate letterforms meet through the conversational hyphen. */
.hero { overflow:hidden; background:var(--dark); color:#f6f7f3; padding:18px 0 32px; }
.brand-stage { font-size:clamp(120px,24.9vw,390px); line-height:.91; font-weight:650; letter-spacing:-.04em; display:flex; align-items:center; padding:0 0 12px; white-space:nowrap; user-select:none; }
.brand-e { animation:letter-connect-left .8s var(--ease) both; }
.brand-chat { animation:letter-connect-right .8s var(--ease) both; }
.brand-dot { color:var(--green); align-self:flex-end; margin-left:-.035em; animation:brand-punctuation .8s var(--ease) both; }
.brand-connector { position:relative; width:.54em; height:.17em; margin:.1em .075em 0 .07em; display:flex; align-items:center; justify-content:center; gap:.033em; flex-shrink:0; border-radius:.035em .035em .035em 0; background:var(--green); transform-origin:center; animation:connection-open .8s var(--ease) backwards; transition:transform .45s var(--ease),border-radius .45s var(--ease); }
.brand-connector:after { content:''; position:absolute; left:0; bottom:-.046em; border-top:.052em solid var(--green); border-right:.06em solid transparent; }
.brand-connector i { width:.027em; height:.027em; background:var(--dark); border-radius:50%; opacity:0; transform:scale(.2); transition:opacity .25s,transform .35s var(--ease); }
.brand-stage:hover .brand-connector { transform:rotate(-5deg) scaleY(1.12); }
.brand-stage:hover .brand-connector i { opacity:1; transform:scale(1); }
.brand-stage:hover .brand-connector i:nth-child(2) { transition-delay:50ms; }
.brand-stage:hover .brand-connector i:nth-child(3) { transition-delay:100ms; }
.hero-heading { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:start; margin-top:28px; }
h1 { font-size:clamp(36px,4.1vw,60px); line-height:1.23; font-weight:500; letter-spacing:-.025em; }
h1>span { display:block; }
.hero-line-two { color:var(--green); }
.hero-aside { max-width:460px; justify-self:end; }
.hero-aside>p:first-child { color:#c8d0c3; font-size:15px; line-height:1.85; max-width:430px; }
.hero-actions { display:flex; gap:26px; align-items:center; margin-top:22px; flex-wrap:wrap; }
.hero-actions .button { --button-bg:var(--green); --button-ink:#20251f; }
.hero-actions .button:before,.button-lime:before { background:#e4ffc0; }
.hero-actions .button .icon { filter:none; }
.hero .text-link .icon { filter:invert(1); }
.hero-platforms { margin-top:20px; display:flex; align-items:center; gap:17px; color:#bac5b1; font-size:12px; }
.hero-platforms span+span:before { content:'/'; margin-right:17px; color:#72816b; }
.hero :focus-visible,.site-header .wordmark:focus-visible { outline-color:var(--green); }
.site-header .nav-cta:focus-visible,.site-header .nav-panel-cta:focus-visible { outline-color:#4a772d; outline-offset:-4px; }
.navigation-panel :focus-visible { outline-offset:2px; }
.product-section { position:relative; background:var(--dark); isolation:isolate; padding-bottom:28px; overflow:hidden; }
.product-ground { position:absolute; inset:18% 0 0; background:var(--ground); z-index:-1; }
.product-figure { max-width:1180px; }
.product-scene { perspective:1600px; transform:translateY(var(--scene-y,0px)); }
.product-image-button { width:100%; display:block; padding:0; border:0; background:transparent; position:relative; cursor:zoom-in; transform:rotateX(var(--scene-angle,0deg)); transform-origin:center 70%; }
.product-image { width:100%; height:auto; aspect-ratio:1670/1150; object-fit:contain; }
.expand-image { position:absolute; top:4%; right:2.5%; background:#20251f; color:#fff; width:50px; height:50px; border-radius:50%; display:flex; align-items:center; justify-content:center; gap:9px; transition:transform .3s var(--ease),background .3s; }
.expand-image>.icon { width:19px; height:19px; filter:invert(1); }
.expand-image>span { position:absolute; right:62px; white-space:nowrap; font-size:12px; font-weight:500; background:#20251f; padding:8px 12px; border-radius:4px; opacity:0; transform:translateX(5px); transition:opacity .2s,transform .2s; }
.product-image-button:hover .expand-image,.product-image-button:focus-visible .expand-image { transform:rotate(5deg) scale(1.06); background:#37482c; }
.product-image-button:hover .expand-image>span,.product-image-button:focus-visible .expand-image>span { opacity:1; transform:none; }

/* E-chat conversation stories: real media, working demonstrations, open typography. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none!important}
.feature-icon{width:22px;height:22px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.section-space{padding:clamp(88px,9vw,132px) 0}
.section-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:90px;align-items:end}
.section-heading h2,.message-story h2,.foundation-copy h2{font-size:clamp(36px,4.8vw,68px);line-height:1.2}
.section-heading h2 span,.chapter-heading h2 span,.message-story h2 span,.foundation-copy h2 span{display:block}
.muted-line{color:var(--muted)}
.section-heading>p,.chapter-heading>p{color:var(--muted);font-size:16px;line-height:1.9;max-width:42ch}
.capability-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;margin-top:48px}
.capability-links>a{position:relative;border-top:1px solid var(--rule);padding:23px 30px 23px 0}
.capability-links>a>span{font-size:21px;font-weight:600}
.capability-links p{font-size:14px;color:var(--muted);margin-top:7px}
.capability-links .feature-icon{position:absolute;right:0;top:28px;transition:transform .25s var(--ease)}
.capability-links>a:hover .feature-icon{transform:translateX(5px)}
.chapter-heading{display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:90px;margin-bottom:38px}
.chapter-heading h2{font-size:clamp(34px,4.3vw,60px);line-height:1.22}
.call-stage{background:var(--green);color:var(--dark);padding:22px;border-radius:16px;overflow:hidden}
.call-topline{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 4px 20px;font-size:13px;font-weight:600}
.call-topline>span:first-child{display:flex;align-items:center;gap:10px}
.connection-mark{width:20px;height:12px;background:var(--dark);border-radius:3px 3px 3px 0;position:relative}
.connection-mark:after{content:'';position:absolute;top:100%;left:0;border-top:4px solid var(--dark);border-right:5px solid transparent}
.call-composition{height:440px;position:relative;display:grid;grid-template-columns:1.55fr 1fr;gap:16px}
.call-person{position:relative;min-width:0;border-radius:10px;overflow:hidden;background:var(--dark)}
.call-person video{display:block;width:100%;height:100%;object-fit:cover}
.person-tag{position:absolute;bottom:14px;left:14px;color:#fff;background:#19241ddd;padding:4px 12px;border-radius:5px;font-size:12px}
.screen-demo{display:none;position:relative;border-radius:10px;overflow:hidden}
.desktop-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shared-note{position:absolute;inset:10% 9%;background:#f6f7f3;color:#20251f;padding:28px 32px;border-radius:10px;box-shadow:0 16px 35px #071a2b40}
.note-title{font-size:12px;letter-spacing:.03em;color:#60675e}
.shared-note h3{font-size:clamp(21px,2.1vw,30px);margin:25px 0 20px}
.shared-note>p{font-size:14px;margin-top:14px}
.note-task{display:flex;align-items:center;gap:9px}
.note-task .feature-icon{width:18px;height:18px;color:#4a772d}
.note-rule{height:1px;background:#d6dcd1;margin:22px 0 12px}
.shared-note>span:last-child{font-size:13px;color:#60675e}
.call-stage.sharing .call-composition{grid-template-columns:minmax(0,1fr) 24%;grid-template-rows:1fr 1fr}
.call-stage.sharing .screen-demo{display:block;grid-column:1;grid-row:1/3;animation:screen-enter .45s var(--ease)}
.call-stage.sharing .call-alice{grid-column:2;grid-row:1}
.call-stage.sharing .call-bob{grid-column:2;grid-row:2}
.call-controls{display:flex;align-items:center;gap:10px;margin-top:20px;flex-wrap:wrap}
.demo-control{min-height:46px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid #19241d55;background:transparent;color:var(--dark);border-radius:6px;font-size:13px;transition:background .2s,color .2s,transform .2s}
.demo-control:hover{background:#e4ffc0}
.demo-control[aria-pressed=true]{background:var(--dark);color:var(--green);border-color:var(--dark)}
.demo-control:active{transform:scale(.97)}
.call-stage :focus-visible,.voice-feature :focus-visible,.theme-feature :focus-visible,.location-map :focus-visible{outline:3px solid #4a772d;outline-offset:4px}
.theme-feature[data-demo-mode=dark] :focus-visible{outline-color:#c5ed83}
.call-caption{margin-left:auto;font-size:12px;padding:0 5px}
.message-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:85px;align-items:center}
.message-story>p{font-size:15px;line-height:1.95;color:var(--muted);margin-top:25px;max-width:38ch}
.message-features{display:flex;flex-wrap:wrap;gap:0 25px;margin-top:32px;max-width:280px}
.message-features span{font-size:13px;padding:10px 0;border-bottom:1px solid var(--rule)}
.conversation-demo{background:var(--surface);border-radius:16px;box-shadow:0 22px 65px #1725110b;overflow:hidden;min-width:0}
.room-heading{display:flex;gap:13px;align-items:center;padding:22px 28px;border-bottom:1px solid var(--rule)}
.room-symbol{background:var(--green);color:#20251f;border-radius:10px;width:43px;height:43px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.room-symbol .feature-icon{width:25px;height:25px}
.room-heading>div{display:grid;gap:3px;min-width:0}
.room-heading strong{font-size:15px;font-weight:650}
.room-heading>div>span{font-size:12px;color:var(--muted)}
.room-heading>.feature-icon{margin-left:auto;color:var(--muted);width:18px}
.demo-messages{padding:26px 28px 24px}
.chat-meta{display:flex;align-items:center;gap:9px;font-size:13px;margin-bottom:11px}
.chat-meta img{border-radius:50%;width:30px;height:30px}
.chat-meta time{margin-left:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.message-bubble{position:relative;background:var(--paper);padding:20px 50px 20px 20px;border-radius:0 12px 12px 12px;min-height:68px}
.message-bubble p{font-size:15px;overflow-wrap:anywhere;line-height:1.8}
.edit-message{position:absolute;right:5px;top:12px;display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:var(--muted);border-radius:6px}
.edit-message:hover{color:var(--ink);background:var(--rule)}
.edit-message .feature-icon{width:17px;height:17px}
#edited-label{font-size:12px;color:var(--muted);display:block;margin-top:5px}
#message-editor{margin-top:12px;padding:15px;background:var(--paper);border-radius:10px}
#message-editor label{font-size:12px;font-weight:600;display:block;margin-bottom:8px}
#message-input{display:block;width:100%;font:inherit;font-size:14px;line-height:1.7;resize:vertical;border:1px solid var(--rule);background:var(--surface);color:var(--ink);border-radius:5px;padding:12px;caret-color:var(--focus)}
#message-input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
#message-editor>div{display:flex;justify-content:flex-end;gap:12px;margin-top:12px}
.edit-error{color:#a13024;font-size:12px;margin-top:8px}
.quiet-control{border:0;background:transparent;color:inherit;font-size:12px;min-height:44px;padding:8px 10px;text-decoration:underline;text-underline-offset:4px}
.small-action{border:0;background:var(--green);color:#20251f;min-height:44px;font-size:12px;font-weight:600;padding:9px 16px;border-radius:5px}
.thread-toggle{display:flex;align-items:center;gap:9px;min-height:46px;background:transparent;border:0;color:var(--focus);font-size:12px;padding:10px 2px}
.thread-toggle .feature-icon{width:17px;height:17px}
.thread-arrow{transition:transform .25s var(--ease)}
.thread-toggle[aria-expanded=true] .thread-arrow{transform:rotate(90deg)}
.thread-replies{padding:12px 16px;background:var(--paper);border-radius:8px;animation:detail-enter .25s var(--ease)}
.thread-replies p{display:grid;grid-template-columns:40px 1fr;gap:8px;font-size:12px;line-height:1.8}
.thread-replies p+p{margin-top:9px}
.thread-replies strong{font-weight:600}
.thread-replies span{color:var(--muted)}
.second-message{margin-top:22px}
.file-message{display:flex;gap:13px;align-items:center;background:var(--paper);padding:18px;border-radius:0 12px 12px 12px}
.file-message>.feature-icon{width:29px;height:29px;color:var(--focus)}
.file-message>div{display:grid;gap:4px;min-width:0}
.file-message strong{font-size:14px;font-weight:600;overflow-wrap:anywhere}
.file-message div span{font-size:12px;color:var(--muted)}
.file-extension{font-size:12px;color:var(--muted);margin-left:auto}
.message-reactions{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-top:10px}
#reaction{display:flex;align-items:center;gap:7px;min-height:44px;min-width:60px;justify-content:center;background:var(--paper);border:1px solid var(--rule);color:var(--ink);border-radius:7px;font-size:12px;transition:background .2s}
#reaction .feature-icon{width:17px;height:17px}
#reaction[aria-pressed=true]{background:var(--green);color:#20251f;border-color:var(--green)}
#reaction[aria-pressed=true] .feature-icon{animation:acknowledge .3s var(--ease)}
.read-receipts summary{display:flex;align-items:center;gap:8px;min-height:44px;list-style:none;cursor:pointer;font-size:12px;color:var(--muted)}
.facepile{display:flex;padding-left:7px}
.facepile img{width:24px;height:24px;border-radius:50%;margin-left:-7px;border:2px solid var(--surface)}
.read-receipts p{font-size:12px;color:var(--muted);max-width:150px;margin-top:5px}
.message-demo-foot{display:flex;align-items:center;gap:10px;padding:17px 28px;border-top:1px solid var(--rule);color:var(--muted);font-size:12px}
.message-demo-foot .feature-icon{width:16px;height:16px}
.everyday-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:24px;margin-top:46px}
.feature-tile{border-radius:16px;overflow:hidden;min-width:0}
.feature-title{display:flex;align-items:baseline;gap:18px;justify-content:space-between}
.feature-title h3{font-size:24px;line-height:1.4}
.feature-title>span{font-size:12px;white-space:nowrap;color:var(--muted)}
.poll-feature{background:var(--surface);padding:34px}
.poll-demo{margin:28px 0 0;padding:0;border:0;min-width:0}
.poll-demo legend{font-size:14px;font-weight:600;margin-bottom:18px;padding:0}
.poll-option{position:relative;display:grid;grid-template-columns:20px 1fr;gap:8px 12px;padding:14px 0;cursor:pointer}
.poll-option input{accent-color:var(--focus);width:18px;height:18px;margin:2px 0 0;cursor:pointer}
.poll-option input:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
.poll-option-main{display:flex;justify-content:space-between;align-items:center;font-size:14px;gap:15px}
.poll-count{font-variant-numeric:tabular-nums;font-size:12px;color:var(--muted)}
.poll-track{height:5px;grid-column:2;background:var(--rule);border-radius:3px;overflow:hidden}
.poll-track>span{display:block;height:100%;background:var(--focus);width:100%;transform:scaleX(var(--vote-share));transform-origin:left;transition:transform .55s var(--ease);border-radius:3px}
.poll-option:has(input:checked) .poll-option-main{font-weight:650}
.poll-footer{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:8px;font-size:12px;color:var(--muted);margin-top:12px}
.theme-feature{grid-column:2;grid-row:1/3;position:relative;background:#e5eadc;color:#20251f;padding:34px 34px 0;display:flex;flex-direction:column;align-items:stretch;min-height:630px;transition:background .4s,color .4s}
.theme-feature .feature-title{display:block}
.theme-feature .feature-title>span{display:block;margin-top:7px;color:#60675e}
.theme-switch{align-self:flex-start;display:flex;gap:4px;padding:4px;background:#d4ddc8;border-radius:7px;margin-top:22px}
.theme-switch button{display:flex;align-items:center;gap:7px;min-height:44px;padding:7px 13px;background:transparent;border:0;border-radius:5px;color:#35412d;font-size:12px;transition:background .25s,color .25s}
.theme-switch button[aria-pressed=true]{background:#fff;color:#20251f}
.theme-switch .feature-icon{width:17px;height:17px}
.phone-composition{position:relative;flex:1;min-height:350px;margin-top:30px;overflow:hidden}
.phone-composition img{position:absolute;left:50%;top:0;transform:translateX(-50%);width:min(100%,310px);max-width:none;height:auto;transition:opacity .4s var(--ease),transform .5s var(--ease)}
.phone-dark{opacity:0;transform:translate(-50%,14px)!important}
.theme-feature[data-demo-mode=dark]{background:#293c2d;color:#f6f7f3}
.theme-feature[data-demo-mode=dark] .feature-title>span{color:#bac7b3}
.theme-feature[data-demo-mode=dark] .phone-light{opacity:0;transform:translate(-50%,14px)}
.theme-feature[data-demo-mode=dark] .phone-dark{opacity:1;transform:translate(-50%,0)!important}
.theme-feature>p{position:relative;background:inherit;padding:18px 0;font-size:12px;text-align:center}
.voice-feature{background:#e5eadc;color:#20251f;padding:34px}
.voice-feature .feature-title>span{color:#60675e}
.voice-player{display:flex;align-items:center;gap:14px;margin-top:35px;background:#f6f7f3;padding:17px;border-radius:12px;min-width:0}
.round-control{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:50%;border:0;background:#20251f;color:#f6f7f3;transition:background .2s,transform .2s}
.round-control:hover{background:#4a772d;transform:scale(1.04)}
.round-control .feature-icon{width:21px;height:21px}
.voice-wave{height:42px;flex:1;position:relative;overflow:hidden;background:#9baba0;mask:url('./assets/features/waveform.svg') center/100% 100% no-repeat}
.voice-progress{position:absolute;inset:0;background:#20251f;transform:scaleX(var(--voice-progress,0));transform-origin:left}
.voice-player time{font-size:12px;font-variant-numeric:tabular-nums;color:#47543f}
.voice-mic{width:19px;height:19px;color:#60675e}
.voice-hint{font-size:12px;color:#60675e;margin-top:16px}
.location-feature{grid-column:1/-1;display:grid;grid-template-columns:.85fr 1.15fr;background:var(--surface);min-height:285px}
.location-copy{padding:40px}
.location-copy h3{font-size:30px;line-height:1.35}
.location-copy p{font-size:14px;color:var(--muted);margin-top:16px}
.location-copy>span{display:block;font-size:12px;color:var(--muted);margin-top:24px}
.location-map{position:relative;min-height:285px;overflow:hidden;background:#e5e3d0}
.location-map>img{position:absolute;inset:-5%;width:110%;height:110%;max-width:none;object-fit:cover;transition:transform .65s var(--ease)}
.location-map:has([aria-expanded=true])>img{transform:scale(1.1)}
#location-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;border:0;background:#20251f;color:var(--green);display:grid;place-items:center;box-shadow:0 12px 24px #19241d25;transition:background .2s}
#location-pin .feature-icon{width:29px;height:29px}
#location-pin:hover{background:#4a772d}
#location-note{position:absolute;bottom:calc(50% + 48px);left:50%;transform:translateX(-50%);width:max-content;max-width:90%;background:#20251f;color:#f6f7f3;border-radius:8px;padding:13px 17px}
#location-note strong{display:block;font-size:13px;font-weight:600}
#location-note span{display:block;font-size:12px;color:#bac7b3;margin-top:4px}
.foundation-section{display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center}
.foundation-visual{aspect-ratio:1.1;overflow:hidden;border-radius:16px;background:#e2ece2}
.foundation-visual img{width:100%;height:100%;object-fit:cover}
.foundation-copy h2{font-size:clamp(34px,3.5vw,50px)}
.foundation-copy>p{font-size:15px;line-height:1.9;color:var(--muted);margin-top:22px}
.foundation-links{display:flex;gap:30px;margin-top:25px}
.foundation-links a{display:inline-flex;gap:15px;align-items:center;min-height:44px;border-bottom:1px solid var(--rule);font-size:18px;font-weight:600}
.foundation-links .feature-icon{width:19px;height:19px;transition:transform .2s}
.foundation-links a:hover .feature-icon{transform:rotate(-45deg)}
.foundation-copy>.access-note{font-size:12px;max-width:43ch}
.download-section{background:var(--dark);color:#f0f4e8;padding:100px 0 70px}
.download-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:50px}
.download-heading h2{font-size:clamp(40px,4.5vw,64px);line-height:1.2}
.download-heading h2>span{display:block}
.green-text{color:var(--green)}
.download-heading p{color:var(--dark-muted);font-size:15px;line-height:1.9}
.download-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.device-option{padding:24px;background:#253327;border-radius:12px;display:flex;align-items:flex-start;flex-direction:column;min-width:0}
.device-icon{width:34px;height:34px;filter:invert(1);margin-bottom:26px}
.device-option h3{font-size:28px;font-weight:550}
.device-option>p{font-size:14px;line-height:1.9;color:#bdcbb7;margin-top:14px;flex:1}
.device-state{display:block;margin:32px 0 16px;font-size:12px;color:#bdcbb7}
.device-option>.button{width:100%;min-height:48px;padding:14px 12px;gap:12px;font-size:13px}
.device-option .button{--button-bg:#f0f4e8;--button-ink:#19241d}
.device-option .button .icon{filter:none}
.device-option-pending>.button{margin-top:32px}
.device-option .button:disabled{opacity:1;background:#334437;color:#bdcbb7;transform:none}
.device-option .button:disabled:before{display:none}
.download-section :focus-visible,.closing :focus-visible{outline-color:var(--green)}
.download-section:target .download-heading{animation:destination-enter .45s var(--ease)}
.quiet-control:active,.small-action:active,.theme-switch button:active{transform:scale(.97)}
.small-action:hover{background:#e4ffc0}
.thread-toggle:hover span,.read-receipts summary:hover>span:last-child{text-decoration:underline;text-underline-offset:4px}
.faq-list summary:hover,.faq-list summary:focus-visible{color:var(--focus)}
@keyframes destination-enter{from{opacity:.6;transform:translateY(10px)}to{opacity:1;transform:none}}
.button-lime{--button-bg:var(--green);--button-ink:#20251f}
.button-lime .icon{filter:none!important}
.faq-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:85px}
.faq-section>h2{font-size:clamp(32px,3.2vw,46px);line-height:1.3}
.faq-list{border-top:1px solid var(--rule)}
.faq-list details{border-bottom:1px solid var(--rule)}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:24px 0;font-size:14px;font-weight:600;list-style:none;cursor:pointer}
.faq-list summary .icon{width:18px;height:18px;flex-basis:18px;transition:transform .3s var(--ease)}
.faq-list details[open] summary .icon{transform:rotate(45deg)}
summary::-webkit-details-marker{display:none}
.faq-list details>p{color:var(--muted);font-size:14px;line-height:1.95;padding:0 24px 26px 0}
details[open]>p{animation:detail-enter .3s var(--ease)}
.closing{background:var(--dark);color:#f6f7f3;text-align:center;padding:100px 0}
.closing h2{font-size:clamp(40px,6.5vw,92px);line-height:1.15}
.closing .button{margin-top:38px}
.closing p{color:#b8c3b0;font-size:13px;margin-top:22px}
.footer{display:flex;align-items:center;gap:30px;padding:35px 0;flex-wrap:wrap}
.footer .wordmark{font-size:30px}
.footer .brand-period{color:var(--focus)}
.footer-copy{color:var(--muted);font-size:12px}
.footer>div{display:flex;align-items:center;gap:28px;margin-left:auto;font-size:12px}
.footer a:not(.wordmark){min-height:44px;display:inline-flex;align-items:center}
.footer>div>span{color:var(--muted)}
html[data-theme=dark] .edit-error{color:#ffb4a8}
html[lang=en] .feature-title h3{font-size:22px}
@keyframes screen-enter{from{opacity:.5;clip-path:inset(0 8% 0 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes acknowledge{from{transform:rotate(-15deg) scale(.8)}to{transform:none}}
@media(max-width:1200px){
  .download-options{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1100px){
  .section-heading,.chapter-heading{gap:50px}.message-section,.foundation-section,.faq-section{gap:50px}
  .call-composition{height:380px}.call-caption{display:none}.shared-note{padding:22px}
  .feature-title{display:block}.feature-title>span{display:block;margin-top:7px}
  .voice-feature,.poll-feature,.theme-feature{padding:28px}.theme-feature{padding-bottom:0}
  .device-option{padding:25px}.download-options{gap:16px}
}
@media(max-width:800px){
  .section-space{padding:80px 0}.section-heading,.chapter-heading{grid-template-columns:1fr;gap:23px}
  .section-heading h2,.message-story h2,.foundation-copy h2,.chapter-heading h2{font-size:42px}
  .section-heading>p,.chapter-heading>p{font-size:15px;max-width:48ch}
  .capability-links{gap:20px;margin-top:38px}.capability-links>a>span{font-size:17px}.capability-links p{font-size:12px}
  .call-composition{height:330px;grid-template-columns:1.3fr 1fr}.call-stage{padding:15px}.call-topline{font-size:12px}
  .call-stage.sharing .call-composition{grid-template-columns:minmax(0,1fr) 26%}.shared-note{inset:7%;padding:18px}.shared-note h3{font-size:20px;margin:15px 0}.note-title{font-size:12px}.shared-note>p{font-size:12px;margin-top:10px}.note-rule{margin:15px 0 8px}
  .call-controls{margin-top:15px}.demo-control{font-size:12px;padding:10px 12px}.demo-control .feature-icon{width:18px;height:18px}
  .message-section{grid-template-columns:1fr;gap:32px}.message-story>p{max-width:55ch}.message-features{max-width:none;margin-top:18px;gap:0 24px}
  .conversation-demo{width:100%;max-width:600px}.message-story h2>span{display:inline}
  .everyday-grid{gap:18px;grid-template-columns:1fr 1fr}.poll-feature,.voice-feature,.theme-feature{padding:24px}.theme-feature{padding-bottom:0}
  .feature-title h3,html[lang=en] .feature-title h3{font-size:22px}.voice-player{gap:8px;padding:12px}.voice-mic{display:none}
  .theme-feature{min-height:640px}.phone-composition{min-height:360px}.phone-composition img{width:280px}
  .location-copy{padding:28px}.location-copy h3{font-size:25px}.location-copy p{font-size:13px}
  .foundation-section{gap:32px}.foundation-copy h2{font-size:32px}.foundation-copy>p{font-size:14px}.foundation-visual{aspect-ratio:.8}
  .foundation-links{gap:22px}.foundation-links a{font-size:16px}
  .download-section{padding:75px 0 45px}.download-heading{display:block}.download-heading h2{font-size:45px}.download-heading p{margin-top:22px}
  .download-options{grid-template-columns:1fr;gap:16px}.device-option{display:grid;grid-template-columns:44px 1fr auto;column-gap:20px;padding:25px;align-items:center}.device-icon{grid-row:1/3;margin:0;width:28px;height:28px}.device-option h3{font-size:25px}.device-option>p{grid-column:2;font-size:13px;margin-top:8px}.device-state{grid-column:3;grid-row:1;margin:0;font-size:12px}.device-option>.button{grid-column:3;grid-row:2;min-width:135px;width:auto;margin-top:14px}.device-option>.button{padding:12px;gap:10px}
  .faq-section{grid-template-columns:1fr;gap:35px}.faq-section>h2{font-size:38px}
  .closing{padding:75px 0}.closing h2{font-size:50px}
  .footer{gap:20px;padding:28px 0}.footer-copy{margin-left:auto}.footer>div{width:100%;margin:0;gap:25px}.footer>div>span{margin-left:auto}
}
@media(max-width:600px){
  .capability-links{grid-template-columns:1fr;gap:0;margin-top:28px}.capability-links>a{padding:16px 30px 16px 0}.capability-links>a>span{font-size:19px}.capability-links p{font-size:13px;margin-top:3px}.capability-links .feature-icon{top:28px}
  .call-composition{height:390px;display:block}.call-alice{width:100%;height:100%}.call-bob{position:absolute;right:12px;bottom:12px;width:30%;height:35%;border:3px solid var(--green);border-radius:9px}.call-bob .person-tag{left:5px;bottom:5px;padding:2px 6px;font-size:12px}
  .call-stage.sharing .call-composition{height:390px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr) 86px;gap:10px}.call-stage.sharing .screen-demo{grid-column:1/-1;grid-row:1}.call-stage.sharing .call-alice{grid-column:1;grid-row:2}.call-stage.sharing .call-bob{position:relative;inset:auto;grid-column:2;grid-row:2;width:100%;height:100%;border:0}.call-stage.sharing .person-tag{left:8px;bottom:6px;padding:2px 7px;font-size:12px}
  .shared-note{inset:12px;padding:14px}.shared-note h3{font-size:18px;margin:11px 0}.shared-note>p{font-size:12px;margin-top:6px}.note-rule{margin:10px 0 5px}.shared-note>span:last-child{font-size:12px}
  .call-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}.demo-control{font-size:12px;gap:6px;padding:10px 6px;min-height:62px}
  .chapter-heading{margin-bottom:28px}
  .message-story h2>span{display:block}.room-heading{padding:20px}.demo-messages{padding:23px 20px}.message-demo-foot{padding:16px 20px;line-height:1.7}.message-bubble{padding-left:16px}.message-bubble p{font-size:14px}.file-message{padding:15px;gap:10px}
  #message-input{font-size:16px}
  .everyday-grid{grid-template-columns:1fr;margin-top:32px;gap:18px}.theme-feature{grid-column:1;grid-row:auto;min-height:490px;order:3}.poll-feature{order:1}.voice-feature{order:2}.location-feature{order:4;grid-column:1;grid-template-columns:1fr}.feature-title{display:flex;align-items:baseline}.feature-title h3,html[lang=en] .feature-title h3{font-size:22px;max-width:13ch}.feature-title>span{font-size:12px;margin-top:0}.poll-demo{margin-top:24px}.theme-feature .feature-title{display:flex}.theme-feature .feature-title>span{margin-top:0}.phone-composition{min-height:310px}.phone-composition img{width:265px}.theme-feature>p{padding:16px 0}.voice-player{padding:16px;gap:14px}.voice-mic{display:block}.voice-hint{line-height:1.8}.location-copy{padding:28px}.location-map{min-height:250px}
  .foundation-section{grid-template-columns:1fr;gap:34px}.foundation-visual{aspect-ratio:1.4}.foundation-copy h2{font-size:38px}
  .device-option{grid-template-columns:32px 1fr;gap:0 13px;padding:20px}.device-icon{grid-row:1;width:26px;height:26px}.device-option h3{font-size:24px}.device-option>p{display:none}.device-state{grid-column:1/-1;grid-row:auto;margin:14px 0 10px;font-size:12px}.device-option>.button{grid-column:1/-1;grid-row:auto;width:100%;margin:0}
  .device-option-pending>.button{margin-top:14px}
  .download-section{padding:56px 0 40px}.download-heading h2{font-size:35px}.download-heading p{font-size:14px;margin-top:16px}.download-heading{margin-bottom:24px}.download-options{gap:12px}
}
@media(max-width:450px){
  .section-heading h2,.message-story h2,.chapter-heading h2{font-size:35px}.section-heading>p,.chapter-heading>p{font-size:14px}.section-space{padding:70px 0}
  .call-stage{padding:12px}.call-topline{margin:2px 3px 14px}.call-topline>span:first-child{gap:8px}
  .poll-feature,.voice-feature,.theme-feature{padding:24px 20px}.theme-feature{padding-bottom:0}.message-features{gap:0 18px}.message-features span{font-size:12px}
  .feature-title h3,html[lang=en] .feature-title h3{font-size:21px}.file-extension{display:none}.file-message strong{font-size:13px}
  .faq-section>h2{font-size:32px}.faq-list summary{padding:23px 0}
  .closing h2{font-size:38px}.footer-copy{font-size:12px;max-width:160px;text-align:right}.footer>div{gap:17px;font-size:12px}
}

/* Invitation form follows the page palette and native dialog focus behavior. */
.download-dialog{width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:clamp(24px,5vw,40px);border:0;border-radius:16px;background:var(--paper);color:var(--ink);overflow:auto;box-shadow:0 24px 80px #0004}
.download-dialog[open]{animation:dialog-enter .26s var(--ease)}
.download-dialog::backdrop{background:#101a12b8}
.download-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px;font-size:14px;color:var(--muted)}
.download-dialog-top .icon-button{flex-shrink:0;background:var(--surface);color:var(--ink)}
.download-dialog-top .icon-button:hover{background:var(--rule)}
.download-dialog h2{font-size:clamp(28px,5vw,36px);line-height:1.15;max-width:14ch}
.download-dialog>p{margin-top:16px;color:var(--muted);font-size:16px;line-height:1.65}
#download-form{display:flex;flex-direction:column;align-items:stretch;margin-top:28px}
#download-form label{font-size:14px;font-weight:600;margin-bottom:8px}
#invite-code{width:100%;min-width:0;min-height:54px;padding:12px 16px;font:18px/1.5 var(--font-ui);background:var(--surface);color:var(--ink);border:1px solid var(--muted);border-radius:8px;caret-color:var(--ink)}
#invite-code:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
#invite-code[aria-invalid=true]{border-color:var(--error)}
.invite-feedback{min-height:1.5em;margin:10px 0 20px;font-size:14px;line-height:1.5;color:var(--error)}
#verify-download{width:100%;min-height:54px}

/* Native dialog keeps focus, Escape, and backdrop behavior predictable. */
.image-dialog { background:var(--paper); color:var(--ink); width:min(1240px,95vw); max-height:94dvh; padding:16px 24px 23px; border:0; border-radius:12px; overflow:auto; box-shadow:0 24px 90px #0004; }
.image-dialog[open] { animation:dialog-enter .35s var(--ease); }
.image-dialog::backdrop { background:#101a12c9; }
.dialog-toolbar { display:flex; justify-content:space-between; align-items:center; padding-bottom:10px; font-size:14px; font-weight:650; }
.dialog-toolbar>span>span { color:var(--muted); font-weight:400; margin-left:8px; }
.dialog-image { width:100%; max-height:calc(90dvh - 115px); height:auto; object-fit:contain; }
@keyframes letter-connect-left { from{transform:translateX(-35px)} to{transform:none} }
@keyframes letter-connect-right { from{transform:translateX(35px)} to{transform:none} }
@keyframes connection-open { from{transform:scaleX(.35);opacity:.55} to{transform:scaleX(1);opacity:1} }
@keyframes brand-punctuation { from{transform:translateY(-20px);opacity:.35} to{transform:none;opacity:1} }
@keyframes detail-enter { from{opacity:.4;transform:translateY(-5px)} to{opacity:1;transform:none} }
@keyframes dialog-enter { from{opacity:.35;transform:translateY(15px) scale(.98)} to{opacity:1;transform:none} }

html[lang=en] h1{ font-size:clamp(32px,3.7vw,54px); }
@media(max-width:1100px){.hero-heading{gap:55px}
.hero-actions{gap:20px}
.hero-aside>p:first-child{font-size:14px}}
@media(max-width:800px){.site-header{height:72px}
.nav-wrap{top:12px;gap:12px}
.site-header .wordmark{font-size:26px;padding:13px 14px}
.nav-dock{width:auto}
.nav-toolbar{padding:4px}
.menu-button{font-size:14px;gap:24px;padding:0 14px}
.nav-cta{display:none}
.navigation-panel{width:min(420px,100vw - var(--gutter)*2);padding:12px 22px;max-height:calc(100dvh - 88px)}
.navigation-links>a{font-size:32px;min-height:88px}
.nav-panel-cta{display:flex}
.wordmark{font-size:28px}
.hero{padding:24px 0 38px}
.brand-stage{font-size:24.5vw;padding-bottom:7px}
.hero-heading{grid-template-columns:1fr;gap:23px;margin-top:33px}
.hero h1{font-size:clamp(34px,6.1vw,48px);line-height:1.24}
.hero h1>span{display:inline}
.hero h1>span+span:before{content:' ';white-space:pre}
.hero-aside{justify-self:start;max-width:550px}
.hero-aside>p:first-child{font-size:14px;max-width:480px}
.hero-actions{margin-top:20px}
.hero-platforms{margin-top:18px}
.product-figure{width:calc(100% - 30px)}
.product-ground{inset:20% 0 0}
.product-section{padding-bottom:23px}
.expand-image{width:44px;height:44px;top:3%;right:3%}
.expand-image>span{display:none}
.image-dialog{padding:12px 14px 18px}}
@media(max-width:450px){.hero-heading{margin-top:29px;gap:22px}
.navigation-links>a{font-size:clamp(24px,7.2vw,32px);min-height:80px}
.navigation-platforms{font-size:11px}
.hero h1,html[lang=en] .hero h1{font-size:33px}
.hero h1>span{display:block}
.hero h1>span+span:before{content:none}
.hero-actions{gap:20px}
.hero-actions .button{font-size:13px;padding:13px 18px;min-height:52px;gap:18px}
.hero-actions .text-link{font-size:12px}
.hero-platforms{gap:15px}
.hero-platforms span+span:before{margin-right:15px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .product-scene,.product-image-button{transform:none!important}
  .brand-stage:hover .brand-connector{transform:none}
}
.mini-connector{display:inline-block;width:.36em;height:.16em;background:var(--green);border-radius:.04em .04em .04em 0;margin:0 .07em;position:relative;bottom:.17em}
.mini-connector:after{content:"";position:absolute;left:0;bottom:-.05em;border-top:.06em solid var(--green);border-right:.07em solid transparent}
.footer .mini-connector{background:var(--focus)}
.footer .mini-connector:after{border-top-color:var(--focus)}