@font-face { font-family:Manrope; src:url('/assets/manrope.woff2') format('woff2'); font-weight:200 800; font-style:normal; font-display:swap; }
@font-face { font-family:'Cormorant Garamond'; src:url('/assets/cormorant-garamond-medium.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Cormorant Garamond'; src:url('/assets/cormorant-garamond-medium-italic.woff2') format('woff2'); font-weight:500; font-style:italic; font-display:swap; }
:root { --ease:cubic-bezier(.16,1,.3,1); font-family:Manrope,'Segoe UI',sans-serif; font-synthesis:none; scroll-padding-top:28px; }
* { box-sizing:border-box; }
body { margin:0; }
[hidden] { display:none!important; }
button { font:inherit; cursor:pointer; }
a { color:inherit; text-decoration:none; }
a,button { touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
button,a { transition:background 180ms var(--ease),color 180ms var(--ease); }
button:active,.button:active { transform:scale(.98); }
button:disabled { opacity:.55; cursor:default; }
a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--focus); outline-offset:5px; }
h1,h2,h3,p { margin:0; }
h1,h2 { text-wrap:balance; }
p { text-wrap:pretty; }
img { display:block; max-width:100%; }
svg { display:block; }
.icon-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.icon { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.wrap { width:min(1224px,calc(100% - 96px)); margin-inline:auto; }
.skip-link { position:fixed; top:-100px; left:20px; z-index:30; background:var(--action); color:var(--action-text); padding:15px 20px; border-radius:9px; }
.skip-link:focus { top:12px; }
.brand { display:inline-flex; align-items:center; gap:12px; font-size:20px; font-weight:750; letter-spacing:-.025em; }
.brand img { object-fit:contain; filter:var(--logo-filter); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:50px; padding:14px 23px; font-size:14px; font-weight:700; border-radius:9px; }
.button .icon { width:18px; height:18px; }
.button-dark { background:var(--action); color:var(--action-text); }
.button-dark:hover { background:var(--action-hover); }
.button-light { background:#191919; color:#fff; }
.button-light:hover { background:#383838; }
.text-link { display:inline-flex; align-items:center; gap:10px; min-height:44px; font-size:12px; font-weight:650; }
.text-link .icon { width:16px; height:16px; }
.text-link:hover,a:hover { text-underline-offset:5px; }
.text-link:hover { text-decoration:underline; }
.avatar { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#424b47; color:#f0f3f1; font-size:13px; flex-shrink:0; }
.chat-heading { display:flex; align-items:center; gap:11px; height:58px; padding:12px 22px; background:#262828; border-bottom:1px solid #343737; }
.chat-heading strong { display:block; font-size:13px; font-weight:600; }
.chat-heading small { display:block; color:#bec3c0; font-size:11px; margin-top:3px; }
.message { width:fit-content; max-width:78%; border-radius:0 8px 8px 8px; background:#29312d; padding:9px 12px; color:#f2f4f2; font-size:13px; line-height:1.5; }
.message time { display:block; font-size:11px; text-align:right; color:#c3cac5; margin-top:3px; }
.message.sent { align-self:flex-end; background:#394a41; border-radius:8px 0 8px 8px; }
.demo-photo { position:relative; aspect-ratio:1; background-image:url('/assets/example-photos.png'); background-size:200% auto; background-repeat:no-repeat; background-color:#2a2c2b; overflow:hidden; }
.photo-lake { background-position:left top; }
.photo-coast { background-position:right top; }
.media-badge { position:absolute; left:8px; top:8px; z-index:2; background:#171717d9; color:#ff8e8e; border-radius:4px; padding:3px 6px; font:500 11px/1.4 'Segoe UI',sans-serif; }
.deleted-badge { color:#f4e3bd; }
.demo-photo time { position:absolute; bottom:8px; right:8px; font-size:11px; color:#fff; padding:2px 4px; background:#171717bc; border-radius:3px; }
summary { display:flex; justify-content:space-between; align-items:center; gap:20px; cursor:pointer; list-style:none; font-size:14px; font-weight:600; line-height:1.5; padding:21px 0; }
summary::-webkit-details-marker { display:none; }
summary .icon { width:17px; height:17px; color:var(--muted); transition:transform 180ms var(--ease); }
details[open]>summary .icon { transform:rotate(180deg); }
details { border-bottom:1px solid var(--line); }
details p { color:var(--muted); font-size:14px; line-height:1.85; padding-bottom:21px; max-width:70ch; }
details p+p { margin-top:-8px; }
.toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:20; display:flex; gap:12px; align-items:center; max-width:calc(100% - 32px); width:max-content; padding:17px 20px; border-radius:12px; background:var(--surface-raised); color:var(--text); box-shadow:0 9px 30px #0004; font-size:13px; }
.toast button { display:grid; place-items:center; background:transparent; border:0; color:inherit; min-width:36px; min-height:36px; }
@media(max-width:1100px) { .wrap { width:calc(100% - 64px); } }
@media(max-width:720px) { .wrap { width:calc(100% - 40px); } .button { padding-inline:17px; font-size:12px; } .toast { font-size:12px; } }
@media(max-width:370px) { .wrap { width:calc(100% - 32px); } }
@media(prefers-reduced-motion:reduce) { :root { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } button:active,.button:active { transform:none; } }
