
*,*::before,*::after{box-sizing:border-box}
html{margin:0;padding:0;color:#0e0807;background:#ffffff}
body{margin:0;padding:0;background:#ffffff;color:#0e0807}
body{font-family:'Sora',sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
:where(.home-page main) a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
.home-page main a:focus-visible,.home-page main button:focus-visible,.home-page main summary:focus-visible{outline:2px solid rgba(14,8,7,.45);outline-offset:4px;border-radius:12px}
.home-page{--bg:#ffffff;--ink:#0e0807;--blue:#2556b6;--sky:#adc8e6;--orange:#f36440;--hair:rgba(0,0,0,.08);--muted:rgba(14,8,7,.45);--serif:'Source Serif Pro','Source Serif 4',Georgia,serif;--sans:'Sora',sans-serif;background:var(--bg);color:var(--ink);min-height:100svh;overflow-x:clip;line-height:1.5}
.home-container{width:100%;max-width:1280px;margin:0 auto;padding-left:24px;padding-right:24px}
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .6s cubic-bezier(.14,1,.34,1),transform .6s cubic-bezier(.14,1,.34,1)}
[data-reveal].is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}[data-reveal]{opacity:1!important;transform:none!important}.hero-avatar{opacity:1!important;transform:scale(1)!important}}
/* Natural-height hero: content sits in the upper area (clear of the fixed nav),
   the preview follows right below with a small gap and peeks into the fold. */
.hero{position:relative;overflow:hidden;background:transparent;padding-top:48px;padding-bottom:32px}
.hero-canvas{position:relative;width:100%;max-width:1440px;margin:0 auto;aspect-ratio:1440/520;container-type:inline-size}
.hero-copy{position:absolute;left:6.94%;top:16%;width:86.12%;color:#0e0807;text-align:center;z-index:5}
.hero-title{margin:0;color:#0e0807;text-align:center}
.hero-title span{display:block;white-space:pre-line}
.hero-title-serif{font-family:var(--serif);font-weight:400;letter-spacing:-.03em;font-size:5.56cqw;line-height:1.12}
.hero-title-sans{font-family:var(--sans);font-weight:600;font-variation-settings:"wght" 600;letter-spacing:-.04em;font-size:5.97cqw;line-height:1.05}
.hero-subtitle{max-width:78ch;margin:26px auto 0;font-family:var(--serif);font-size:16px;line-height:1.25;letter-spacing:-.01em;color:#0e0807;text-wrap:balance}
.hero-avatars{position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translate(-50%,30px);z-index:1;overflow:visible}
.home-page.is-webapp .hero-avatars{display:none}
.hero-avatar-static{position:absolute;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:999px;object-fit:cover;filter:drop-shadow(0 14px 30px rgba(37,86,182,.18))}
@media(max-width:1200px){.hero-avatars{display:none}}
.hero-avatar{position:absolute;aspect-ratio:1;opacity:0;animation:fadeIn .6s both;will-change:transform}
.hero-avatar__spin{display:block;width:100%;height:100%;animation:heroSpin 26s linear infinite;will-change:transform}
.hero-avatar__spin svg{display:block;width:100%;height:100%;filter:drop-shadow(0 14px 30px rgba(37,86,182,.32))}
.hero-avatar--focus{z-index:3}
.hero-avatar--focus .hero-avatar__spin{animation:none}
.hero-avatar--focus .hero-avatar__spin svg{filter:drop-shadow(0 14px 30px rgba(243,100,64,.32))}
@keyframes fadeIn{to{opacity:1}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes heroSpin{to{transform:rotate(360deg)}}
@keyframes heroFlow{to{transform:rotate(360deg)}}
@keyframes heroOrange{0%{transform:translate(0,0) rotate(0deg)}25%{transform:translate(46px,-34px) rotate(90deg)}50%{transform:translate(-30px,40px) rotate(180deg)}75%{transform:translate(34px,26px) rotate(270deg)}100%{transform:translate(0,0) rotate(360deg)}}
.download-cluster{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:20px;margin-top:16px}
.primary-download{width:160px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;background:#121313;color:#fff;border-radius:9999px;padding:18px 22px 18px 20px;font-size:16px;line-height:20px;font-weight:500;font-variation-settings:"wght" 500;overflow:hidden;box-shadow:0 12px 30px 0 rgba(0,0,0,.30);transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.primary-download:hover{background:#000;transform:translateY(-2px);box-shadow:0 18px 40px 0 rgba(0,0,0,.38)}
.primary-download:active{transform:translateY(0);box-shadow:0 8px 20px 0 rgba(0,0,0,.30)}
.download-icon{width:19px;height:19px;flex:0 0 auto;fill:currentColor;filter:brightness(0)}
.primary-download .download-icon{filter:none;fill:#fff;transition:width .42s cubic-bezier(.14,1,.34,1),opacity .3s ease,margin .42s cubic-bezier(.14,1,.34,1),transform .42s cubic-bezier(.14,1,.34,1)}
.primary-download .download-icon--arrow{fill:none;stroke:currentColor}
.primary-download .download-icon:first-child{width:19px;opacity:1;margin-right:10px;transform:translateX(0)}
.primary-download .download-icon:last-child{width:0;opacity:0;margin-left:0;transform:translateX(8px)}
.primary-download:hover .download-icon:first-child{width:0;opacity:0;margin-right:0;transform:translateX(-8px)}
.primary-download:hover .download-icon:last-child{width:19px;opacity:1;margin-left:10px;transform:translateX(0)}
.primary-download-wrap{display:inline-flex}
.also-label{margin:0;font-family:var(--serif);font-size:16px;line-height:20px;color:rgba(14,8,7,.5)}
.platform-row{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
@media(max-width:699px){.platform-row{max-width:360px}}
.platform-pill{display:inline-flex;align-items:center;gap:10px;border-radius:16px;padding:14px 20px 14px 16px;font-size:14px;line-height:18px;color:#0e0807;border:.6px solid rgba(0,0,0,.12);font-weight:500;transition:background-color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1)}
.platform-pill .download-icon{filter:brightness(0);transition:filter .3s cubic-bezier(.4,0,.2,1)}
@media(hover:hover){.platform-pill:hover{background:var(--ink);border-color:var(--ink);color:#fff}.platform-pill:hover .download-icon{filter:brightness(0) invert(1)}}
.section{background:#f5f5f5;padding:80px 0}
#how-it-works{padding-top:160px}
#security{padding-bottom:160px}
.section-title{text-align:center;margin:0;color:#0e0807}
.section-title span{display:block;font-size:clamp(44px,5.5vw,80px);line-height:1.25}
.title-sans{font-family:var(--sans);font-weight:600;font-variation-settings:"wght" 600;letter-spacing:-.04em}
.title-serif{font-family:var(--serif);font-weight:400;letter-spacing:-.03em}
.usecases{background:#ffffff}
.usecases-inner{padding-top:80px;padding-bottom:160px;display:flex;flex-direction:column;align-items:center;gap:60px}
.usecases-title{margin:0;text-align:center;font-family:var(--serif);font-weight:400;font-size:40px;line-height:50px;letter-spacing:-.8px;color:#0e0807}
.usecases-title span{color:#0e0807}
.usecase-list{display:flex;flex-direction:column;gap:40px;width:100%;max-width:1280px}
.usecase-card{width:100%;max-width:1280px;display:flex;flex-direction:row;gap:40px;align-items:stretch}
.usecase-card--reverse{flex-direction:row-reverse}
.uc-heading{flex:1;min-width:0;padding:30px;display:flex;flex-direction:column;justify-content:center;gap:20px}
.uc-heading-top{display:flex;flex-direction:column;gap:40px}
.uc-eyebrow{font-family:var(--serif);font-size:16px;line-height:20px;font-weight:400;color:rgba(14,8,7,.5)}
.uc-heading h3{width:100%;max-width:460px;margin:0;font-family:var(--sans);font-size:40px;line-height:50px;font-weight:600;font-variation-settings:"wght" 600;letter-spacing:-.8px;color:#0e0807}
.uc-desc{margin:0;max-width:460px;font-family:var(--serif);font-size:16px;line-height:20px;font-weight:400;color:#0e0807}
.uc-steps{display:flex;flex-direction:column;gap:16px}
.uc-step{display:flex;align-items:center;gap:10px}
.uc-step strong{width:24px;height:24px;border-radius:999px;flex:0 0 auto;background:#d8d8d8;color:#000;display:flex;align-items:center;justify-content:center;font-size:12px;font-family:var(--sans);font-weight:400;line-height:15px}
.uc-step strong.active{background:#000;color:#fff}
.uc-step span{font-family:var(--serif);font-size:16px;line-height:20px;color:rgba(0,0,0,.45);font-weight:400}
.uc-step span.active{color:#000}
.uc-persona{align-items:center;gap:12px;font-family:var(--serif);font-size:14px;line-height:17.5px;color:#000}
.uc-persona img{width:40px;height:40px;border-radius:999px;flex:0 0 auto}
.uc-persona-desktop{display:flex}.uc-persona-mobile{display:none}
.uc-example-box{flex-shrink:0;width:645px;max-width:100%}
.uc-demo-img{display:block;width:100%;height:auto}
.uc-invest-stack{position:absolute;left:60px;top:80px;width:525px;height:385px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.uc-dots{background:#bac78d;border-radius:18px;padding:16px 14px;display:flex;align-items:center;gap:10px}
.uc-dots span{width:4px;height:4px;border-radius:999px;background:rgba(0,0,0,.45)}
.uc-model-row{display:flex;align-items:center;z-index:2}
.uc-model-logo{width:32px;height:32px;border-radius:999px;margin-right:-4px;border:1.5px solid #fff;background:#fff;object-fit:cover}
.uc-chat-window{position:absolute;left:60px;top:30px;width:525px;height:435px;border-radius:24px;background:#f5f5f5;border:.6px solid rgba(0,0,0,.12);box-shadow:0 15px 40px rgba(0,0,0,.05);display:flex;flex-direction:column;overflow:hidden}
.uc-chat-head{height:50px;flex:0 0 auto;border-bottom:.6px solid rgba(0,0,0,.12);padding:16px 20px;display:flex;align-items:center;gap:5.82px}
.uc-chat-head span{font-family:var(--sans);font-size:14px;font-weight:500;line-height:17.6px;color:#000}
.uc-chat-head em{font-style:normal;font-family:var(--sans);font-size:12px;font-weight:400;line-height:15.1px;color:#000}
.uc-chat-body{flex:1}
.uc-user-bubble{position:absolute;left:385px;top:95px;background:#000;border-radius:24px 24px 0 24px;padding:16px}
.uc-user-bubble span{font-family:var(--sans);font-size:14px;line-height:19.6px;color:#fff;white-space:nowrap}
.uc-agent-stack{position:absolute;left:24px;top:150px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.uc-msg-card{border-radius:0 24px 24px 24px;padding:16px;display:flex;flex-direction:column;gap:12px}
.uc-agent-label{display:flex;align-items:center;gap:2px;font-family:var(--sans);font-size:11px;line-height:13.9px}
.uc-agent-label svg{flex:0 0 auto}
.uc-market-card{width:337px;background:#fff;border-radius:24px;box-shadow:0 7px 20px rgba(0,0,0,.06);padding:16px;display:flex;flex-direction:column;gap:12px}
.uc-stock-card{display:flex;flex-direction:column;gap:10px;border-radius:16px;background:#fff}
.uc-stock-meta{display:flex;justify-content:space-between;align-items:flex-start}
.uc-stock-meta div{display:flex;flex-direction:column;gap:2px}
.uc-stock-meta div:last-child{align-items:flex-end}
.uc-stock-meta strong{font-family:var(--sans);font-size:14px;font-weight:700;line-height:18px;color:#0e0807}
.uc-stock-meta span{font-family:var(--sans);font-size:11px;font-weight:400;line-height:13.9px;color:#0e0807}
.uc-stock-meta div:last-child span{color:#bac78d}
.uc-stock-chart{height:73px;border-radius:8px;background:#fff1ee;overflow:hidden;position:relative}
.uc-keyframes{display:flex;align-items:center;gap:6px}
.uc-keyframes span{width:80px;height:30px;border-radius:8px;background:#f7f7f7;padding:10px;display:flex;align-items:flex-end;font-family:var(--sans);font-size:9px;line-height:11.3px;color:#000}
.uc-keyframes span.first{border:1px solid rgba(0,0,0,.12)}
.uc-keyframes span.dark{background:rgba(255,255,255,.08);color:rgba(255,255,255,.5);border:0}
.uc-keyframes span.dark.first{border:1px solid rgba(255,255,255,.7);color:#fff}
.uc-keyframes em{font-style:normal;font-family:var(--sans);font-size:9px;line-height:11.3px;color:#000}
.uc-keyframes em.dark{color:rgba(255,255,255,.5)}
.uc-visual-card{position:absolute;left:290px;top:159px;width:321px;background:#000;border-radius:0 24px 24px 24px;box-shadow:0 7px 20px rgba(0,0,0,.06);padding:16px;display:flex;flex-direction:column;gap:12px}
@media(max-width:1024px){.usecase-card{flex-direction:column;gap:32px;align-items:stretch}.usecase-card--reverse{flex-direction:column}.uc-example-box{width:100%}}
@media(max-width:767px){.hero{background:linear-gradient(180deg,#2556B6 0%,#2556B6 28%,#5f82c8 50%,#a9c1e5 66%,#ffffff 84%)}.hero-avatars{display:none}.hero-canvas{aspect-ratio:auto;min-height:0;padding:148px 24px 0}.hero-copy{position:relative;left:auto;top:auto;width:100%;max-width:520px;margin:0 auto}.hero-title-serif{font-size:36px;line-height:1}.hero-title-sans{font-size:40px;line-height:1}.hero-subtitle{max-width:none;margin-top:24px;font-size:14px;line-height:1.3}.download-cluster{margin-top:40px}.uc-heading{padding:0}.uc-heading h3{font-size:34px;line-height:42px}}
.collab-grid,.security-grid{display:grid;grid-template-columns:1fr;gap:40px;margin-top:60px}
@media(min-width:900px){.collab-grid{grid-template-columns:repeat(3,1fr)}.security-grid{grid-template-columns:repeat(2,1fr)}}
.collab-card,.security-card{background:#fff;border-radius:32px;padding:40px;display:flex;flex-direction:column;gap:40px}
.collab-card img{height:56px;width:auto;align-self:flex-start}
.collab-card h3,.security-card h3{margin:0;font-family:var(--sans);font-size:20px;line-height:25px;font-weight:600;font-variation-settings:"wght" 600}
.collab-card p,.security-card p{margin:0;font-family:var(--serif);font-size:20px;line-height:25.06px}
.collab-card>div:last-child,.security-card>div:last-child{display:flex;flex-direction:column;gap:16px}
.models{display:flex;flex-direction:column;align-items:center;gap:40px;text-align:center}
.models h2{margin:0;font-family:var(--serif);font-size:40px;line-height:50px;font-weight:400;letter-spacing:-.02em}
.models p{margin:16px 0 0;font-family:var(--serif);font-size:16px;line-height:20px}
.models-board{position:relative;width:100%;max-width:1280px;min-height:480px;background:#F36440;border-radius:32px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:48px;padding:72px 0}
.models-board::before{content:"";position:absolute;inset:0;background:var(--models-pattern) center/cover no-repeat;z-index:0;pointer-events:none}
.models-group{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:16px}
.models-group-label{font-family:var(--serif);font-size:16px;line-height:20px;font-weight:400;color:rgba(14,8,7,.5)}
.model-chips{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px;max-width:950px}
.model-chip{display:inline-flex;align-items:center;gap:10px;background:#fff;border:.6px solid rgba(0,0,0,.12);border-radius:16px;padding:14px 20px 14px 16px;font-family:var(--sans);font-size:14px;line-height:18px;font-weight:500;color:#0e0807;white-space:nowrap}
.model-chip__logo{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 auto}
.model-chip__logo svg{width:20px;height:20px;display:block}
.features{padding:80px 0;background:#f5f5f5}
.feature-title{margin:0 0 60px;text-align:center;font-size:clamp(44px,5.5vw,80px);line-height:1.08;letter-spacing:-.03em;color:#0e0807}
.feature-title .title-sans{display:block;font-family:var(--sans);font-weight:600}
.feature-title .title-serif{display:block;font-family:var(--serif);font-weight:400}
.feature-grid{display:grid;grid-template-columns:1fr;gap:40px}
@media(min-width:768px){.feature-grid{grid-template-columns:repeat(2,1fr)}}
.feature-card{position:relative;border-radius:32px;overflow:hidden;display:flex;flex-direction:column}
.feature-text{padding:40px 40px 0;flex:0 0 auto}
.feature-text h3{margin:0 0 10px;font-family:var(--sans);font-size:20px;line-height:25px;font-weight:600;font-variation-settings:"wght" 600;color:#0e0807}
.feature-text p{margin:0;max-width:540px;font-family:var(--serif);font-size:16px;line-height:20px;color:#0e0807;font-weight:400}
.feature-shot{position:relative;overflow:hidden;display:flex;justify-content:center;padding:40px}
.feature-shot-img{width:436px;max-width:100%;height:auto;display:block;border-radius:14px;filter:drop-shadow(0 12px 30px rgba(0,0,0,.16));transform:translateY(42%);transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
@media(prefers-reduced-motion:reduce){.feature-shot-img{transition:none;transform:translateY(0)}}
.feature-card.is-shown .feature-shot-img{transform:translateY(0)}
.feature-grid .feature-card:nth-child(1).is-shown .feature-shot-img{transition-delay:.3s}
.feature-grid .feature-card:nth-child(2).is-shown .feature-shot-img{transition-delay:.42s}
.feature-grid .feature-card:nth-child(3).is-shown .feature-shot-img{transition-delay:.54s}
.feature-grid .feature-card:nth-child(4).is-shown .feature-shot-img{transition-delay:.66s}
.security-title{margin:0;text-align:center;font-family:var(--serif);font-weight:400;font-size:40px;line-height:50px;letter-spacing:-.8px;color:#0e0807}
.security-card{gap:40px;padding:clamp(28px,6vw,50px)}.security-card img{width:56px;height:56px}
@media(min-width:1024px){#security.section{padding-left:148px;padding-right:148px}}
.final-cta{position:relative;background:#2556B6;color:#0e0807;padding:160px 0 0;text-align:center;overflow:hidden}
.final-cta-inner{display:flex;flex-direction:column;align-items:center;gap:60px;padding-bottom:40px}
.final-cta h2{margin:0;font-family:var(--sans);font-weight:600;font-variation-settings:"wght" 600;font-size:40px;line-height:50px;letter-spacing:-.8px;color:#0e0807}
.final-cta p{margin:10px 0 0;font-family:var(--serif);font-size:16px;line-height:20px;color:#0e0807}
.final-cta-shot{width:100%;max-width:960px;height:auto;display:block;margin-top:8px;border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.18);transform:scale(.9);transition:transform .9s cubic-bezier(.16,1,.3,1)}
.final-cta-shot.is-shown{transform:scale(1)}
@media(prefers-reduced-motion:reduce){.final-cta-shot{transition:none;transform:scale(1)}}
.final-cta .final-cta-also{margin:0;font-family:var(--serif);font-size:16px;line-height:20px;color:rgba(14,8,7,.5)}
.final-actions{display:grid;grid-template-columns:repeat(2,200px);gap:20px}
.final-actions a{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:9999px;padding:18px 22px;font-family:var(--sans);font-size:16px;line-height:20px;font-weight:500;font-variation-settings:"wght" 500;border:1px solid rgba(14,8,7,.4)}
.final-actions a:first-child{background:#121313;color:#fff;border-color:#121313}
@media(max-width:520px){.final-actions{grid-template-columns:1fr;width:100%;max-width:260px}.feature-text{padding:32px 28px 10px}.feature-demo-area{padding:28px}.feature-team-grid{gap:6px}.feature-team-agent{padding:12px 6px}}

/* ── Hero interactive product preview ─────────────────────────────────────── */
.product-preview{padding:16px 0 48px}
.product-preview-frame{width:100%;max-width:1120px;margin:0 auto;transform-origin:center center;will-change:transform;transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.product-preview-mobile{display:none}
@media(max-width:767px){.product-preview-frame{display:none}.product-preview-mobile{display:block;width:100%;max-width:360px;height:auto;margin:0 auto;border-radius:22px}}
/* Homalto keeps the live, branded product demonstration on mobile. */
@media(max-width:767px){
  .product-preview-mobile{display:none!important}
  .product-preview-frame{display:block!important;transform:none!important}
  .product-preview-app{border-radius:16px}
  html.seo-menu-open #content{visibility:hidden}
}

/* Tablet: switch to the compact navigation before the desktop links collide. */
@media(min-width:768px) and (max-width:1100px){
  .seo-nav-links{display:none!important}
  .seo-nav-actions{margin-left:auto!important}
  .seo-nav-actions .seo-nav-pill-solid{display:none!important}
  .seo-menu-button{display:inline-flex!important;background:#f0f0f2;border-radius:9999px;margin-left:12px}
  .seo-mobile-menu{display:block!important}
  html.seo-menu-open #content{visibility:hidden}
  .hero-canvas{aspect-ratio:auto;min-height:440px}
  .hero-copy{top:15%;width:84%;left:8%}
  .hero-subtitle{max-width:740px}
  .download-cluster{margin-top:24px}
}

@media(min-width:1101px) and (max-width:1279px){
  .hero-canvas{aspect-ratio:auto;min-height:440px}
  .hero-copy{top:15%;width:84%;left:8%}
  .hero-subtitle{max-width:740px}
  .download-cluster{margin-top:24px}
}
.product-preview.is-pinned .product-preview-sticky{position:sticky;top:84px;height:100svh;display:flex;align-items:flex-start}
/* pre-pin (first screen) peek: frame at 90% at the top of its stage — unchanged.
   When pinned, JS drives transform to translateY-center + scale(1). */
.product-preview.is-pinned .product-preview-frame{transform:scale(.9)}
.product-preview-app{container-type:inline-size;width:100%;aspect-ratio:3/2;display:grid;grid-template-columns:4.25em 18em minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden;border:1px solid rgba(0,0,0,.16);border-radius:1.9em;background:#fff;box-shadow:0 28px 80px rgba(14,8,7,.12),0 6px 18px rgba(14,8,7,.06);color:#171717;text-align:left;font-family:'Sora',sans-serif;font-size:clamp(7px,1.35cqw,14px);line-height:1.35}
.product-preview-app button{font:inherit}
.pp-rail{min-height:0;height:100%;display:flex;flex-direction:column;align-items:center;gap:.9em;padding:1.9em .55em 1.4em;border-right:1px solid rgba(0,0,0,.06);background:#f5f5f5}
.pp-rail-spacer{flex:1 1 auto}
.pp-user-avatar,.pp-avatar{width:2.25em;height:2.25em;border-radius:999px;object-fit:cover;flex:0 0 auto}
.pp-user-avatar{margin-bottom:.5em}
.pp-avatar.is-agent{background:#f2f4f8}
.pp-avatar--brandlogo{background:#fff;object-fit:contain;padding:.26em;border:1px solid rgba(0,0,0,.06)}
.pp-rail-button,.pp-icon-button{display:inline-flex;align-items:center;justify-content:center;border:0;color:rgba(0,0,0,.45);background:transparent}
.pp-rail-button{position:relative;width:2.35em;height:2.35em;border-radius:999px;cursor:pointer}
.pp-rail-button svg,.pp-icon-button svg{width:1.28em;height:1.28em}
.pp-rail-button.is-active{color:#171717;background:#fff}
.pp-rail-invite{position:relative;width:2.35em;height:2.35em;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:rgba(0,0,0,.45)}
.pp-rail-invite svg{width:1.28em;height:1.28em}
.pp-room-list{min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;border-right:1px solid rgba(0,0,0,.06);background:#fff}
.pp-room-head{height:4em;display:flex;align-items:center;justify-content:space-between;gap:1em;padding:0 1em 0 1.1em}
.pp-room-head h2{margin:0;font-size:1.18em;font-weight:600;color:#171717}
.pp-room-actions,.pp-chat-actions{display:flex;align-items:center;gap:.35em}
.pp-icon-button{width:2.15em;height:2.15em;border-radius:999px}
.pp-icon-bolt svg{width:1.08em;height:1.08em}
.pp-search{margin:0 .9em .75em;height:2.45em;display:flex;align-items:center;gap:.55em;padding:0 .8em;border-radius:999px;color:rgba(23,23,23,.34);background:rgba(0,0,0,.035);font-size:.86em}
.pp-search svg{width:1.12em;height:1.12em}
.pp-rooms{min-height:0;flex:1 1 auto;display:flex;flex-direction:column;gap:.1em;padding:0 .55em .55em;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.pp-room{min-width:0;width:100%;display:flex;align-items:center;gap:.6em;min-height:3.85em;border:0;border-radius:.86em;padding:.5em .6em;background:transparent;text-align:left;color:#171717;font:inherit;cursor:pointer}
.pp-room:hover{background:rgba(0,0,0,.03)}
.pp-room.is-active{background:#fff;box-shadow:0 6px 18px rgba(37,86,182,.18),0 1px 3px rgba(0,0,0,.06)}
.pp-room-avatar{position:relative;flex:0 0 auto;width:2.55em;height:2.55em}
.pp-room-avatar img{width:2.55em;height:2.55em;border-radius:999px;object-fit:cover}
.pp-room-avatar img.is-square{border-radius:999px}
.pp-room-unread{position:absolute;top:-.2em;right:-.2em;height:1.25em;min-width:1.25em;display:inline-flex;align-items:center;justify-content:center;padding:0 .32em;border-radius:999px;background:#f5334f;color:#fff;font-size:.62em;font-weight:600;line-height:1}
.pp-room-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:.14em}
.pp-room-line{display:flex;align-items:center;gap:.3em}
.pp-room-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9em;font-weight:500}
.pp-room-lightning{flex:0 0 auto;display:inline-flex;color:#171717}
.pp-room-lightning svg{width:.85em;height:.85em}
.pp-room-time{flex:0 0 auto;margin-left:auto;font-size:.72em;color:rgba(0,0,0,.45)}
.pp-room-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.76em;color:rgba(0,0,0,.45)}
.pp-main{min-width:0;min-height:0;height:100%;position:relative;display:flex;flex-direction:column;background:#fff}
.pp-chat-header{height:4em;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:1em;padding:0 1em;border-bottom:1px solid rgba(0,0,0,.06)}
.pp-chat-title{min-width:0;display:none;align-items:center;gap:.35em}
.pp-chat-title.is-active{display:flex}
.pp-chat-title strong{min-width:0;max-width:24em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.02em;font-weight:600}
.pp-chat-title span{flex:0 0 auto;font-size:.75em;color:rgba(23,23,23,.45)}
.pp-message-list{min-height:0;flex:1 1 auto;display:none;flex-direction:column;gap:1.05em;padding:1.15em 1.15em 1.35em;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.18) transparent}
.pp-message-list.is-active{display:flex}
.pp-empty{margin:auto;color:rgba(0,0,0,.4);font-size:.9em}
.pp-message{max-width:92%;display:flex;align-items:flex-start;gap:.7em;align-self:flex-start}
.pp-message.is-own{max-width:78%;align-self:flex-end}
.pp-message-stack{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:.4em}
.pp-message.is-own .pp-message-stack{align-items:flex-end}
.pp-sender{display:inline-flex;align-items:center;gap:.28em;padding:0 .2em;font-size:.8em;font-weight:500;color:#171717}
.pp-sender svg{width:.9em;height:.9em;color:#e8590c}
.pp-time-divider{align-self:center;color:rgba(0,0,0,.4);font-size:.78em;padding:.15em 0}
.pp-system-divider{align-self:center;padding:.2em 0}
.pp-system-divider span{display:inline-block;border-radius:999px;padding:.3em .85em;background:rgba(0,0,0,.05);color:rgba(0,0,0,.5);font-size:.76em}
.pp-bubble{max-width:34em;display:flex;flex-direction:column;gap:.35em;padding:.85em 1em;border-radius:1em;background:rgba(0,0,0,.04);color:#171717;font-size:.92em;line-height:1.5}
.pp-message.is-own .pp-bubble{background:rgba(59,130,246,.12)}
.pp-bubble-text{display:block}
.pp-line{display:block}
.pp-line-gap{display:block;height:.55em}
.pp-bubble-list{margin:.1em 0;padding-left:1.3em;display:flex;flex-direction:column;gap:.25em;list-style:square}
.pp-bubble-list li{padding-left:.15em}
.pp-mention{color:#007aff}
.pp-card{width:min(33em,100%);overflow:hidden;border:1px solid rgba(0,0,0,.06);border-radius:1.15em;background:#fff;box-shadow:0 16px 32px -1px rgba(0,0,0,.1)}
.pp-card-head{display:flex;align-items:center;justify-content:space-between;gap:1em;padding:.75em .9em .5em}
.pp-card-caption{min-width:0;font-size:.88em;font-weight:500;color:#171717;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-card-tools{flex:0 0 auto;display:inline-flex;align-items:center;gap:.5em;color:rgba(0,0,0,.4)}
.pp-card-tool{display:inline-flex}
.pp-card-tool svg{width:1.05em;height:1.05em}
.pp-card-badge{display:inline-flex;align-items:center;padding:.1em .45em;border-radius:999px;background:#ffd15c;color:#171717;font-size:.7em;font-weight:700;line-height:1.4}
.pp-report-body{margin:.1em .7em .8em;border-radius:.9em;background:#fbfaf7;padding:1em}
.pp-report-body.is-cream{background:#faf6f0}
.pp-report-tabs{display:flex;flex-wrap:nowrap;gap:.75em;overflow:hidden;margin-bottom:.85em;padding-bottom:.55em;border-bottom:1px solid rgba(0,0,0,.08);font-size:.64em;color:rgba(0,0,0,.4)}
.pp-report-tab{flex:0 0 auto;white-space:nowrap}
.pp-report-tab.is-brand{font-weight:700;color:#171717}
.pp-report-tab.is-active{color:#e8590c;font-weight:600}
.pp-report-kicker{display:block;color:#e8590c;font-size:.62em;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.pp-report-title{display:block;margin-top:.35em;font-size:1.35em;font-weight:700;color:#171717;letter-spacing:-.01em;line-height:1.15}
.pp-report-subtitle{margin:.45em 0 0;color:rgba(0,0,0,.6);font-size:.8em;line-height:1.4}
.pp-report-meta{margin:.35em 0 0;color:rgba(0,0,0,.4);font-size:.66em}
.pp-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6em;margin-top:1em}
.pp-metric{border-radius:.7em;background:#fff;border:1px solid rgba(0,0,0,.06);padding:.75em .55em;text-align:center}
.pp-metric strong{display:block;font-size:1.2em;font-weight:700;color:#171717}
.pp-metric strong.is-accent{color:#e8590c}
.pp-metric span{display:block;margin-top:.3em;color:rgba(0,0,0,.45);font-size:.58em;line-height:1.3}
.pp-board-body{margin:.1em .7em .85em;border-radius:.9em;background:#f7f7f8;padding:.9em}
.pp-board-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1em}
.pp-board-titles{min-width:0;display:flex;flex-direction:column;gap:.18em}
.pp-board-kicker{color:rgba(0,0,0,.42);font-size:.6em;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.pp-board-title{font-size:1.1em;font-weight:700;color:#171717}
.pp-board-meta{color:rgba(0,0,0,.42);font-size:.64em;line-height:1.4}
.pp-board-big{flex:0 0 auto;font-size:1.3em;font-weight:700;color:#171717}
.pp-board-big.is-green{color:#17a06a}
.pp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5em;margin-top:.85em}
.pp-stat{border-radius:.7em;padding:.7em;color:#fff}
.pp-stat strong{display:block;font-size:1.02em;font-weight:700}
.pp-stat span{display:block;margin-top:.25em;font-size:.56em;opacity:.92;line-height:1.3}
.pp-stat.is-blue{background:#2f6df6}
.pp-stat.is-red{background:#f2543d}
.pp-stat.is-purple{background:#7c5cff}
.pp-stat.is-green{background:#17a06a}
.pp-board-section{margin-top:.85em;border-top:1px solid rgba(0,0,0,.07);padding-top:.75em}
.pp-board-section-label{display:block;color:#171717;font-size:.64em;font-weight:700;border-left:2px solid rgba(0,0,0,.35);padding-left:.45em;margin-bottom:.45em}
.pp-board-section-title{margin:0;font-size:.8em;font-weight:600;color:#171717;line-height:1.4}
.pp-board-section-body{margin:.5em 0 0;color:rgba(0,0,0,.58);font-size:.7em;line-height:1.5}
.pp-tags{display:flex;flex-wrap:wrap;gap:.35em;margin-top:.5em}
.pp-tag{border-radius:.45em;padding:.15em .45em;font-size:.62em;font-weight:600;line-height:1.4}
.pp-tag.is-green{background:rgba(23,160,106,.14);color:#15805a}
.pp-tag.is-red{background:rgba(242,84,61,.14);color:#c23a24}
.pp-tag.is-neutral{background:rgba(0,0,0,.06);color:rgba(0,0,0,.55)}
.pp-bars{display:flex;flex-direction:column;gap:.55em;margin:.2em 0 .4em}
.pp-bar-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.25em .5em;font-size:.72em}
.pp-bar-label{min-width:0;color:#171717;font-weight:500}
.pp-bar-value{color:#c23a24;font-weight:700;text-align:right}
.pp-bar-track{grid-column:1/-1;height:.5em;border-radius:999px;background:rgba(242,84,61,.12);overflow:hidden}
.pp-bar-fill{display:block;height:100%;border-radius:999px;background:#f2543d}
.pp-armed-block{margin-top:.35em}
.pp-armed{display:flex;align-items:center;justify-content:space-between;gap:.7em;border-radius:.65em;background:rgba(23,160,106,.08);border:1px solid rgba(23,160,106,.22);padding:.55em .7em}
.pp-armed-copy{min-width:0;display:flex;flex-direction:column;gap:.15em}
.pp-armed-copy strong{font-size:.76em;font-weight:600;color:#15805a}
.pp-armed-copy span{font-size:.66em;color:rgba(0,0,0,.55);line-height:1.4}
.pp-armed-badge{flex:0 0 auto;border-radius:.4em;padding:.15em .45em;background:#17a06a;color:#fff;font-size:.58em;font-weight:700}
.pp-ticket-body{margin:.1em .7em .85em;border-radius:.9em;background:#f7f7f8;padding:.9em}
.pp-ticket-kicker-row{display:flex;align-items:center;justify-content:space-between;gap:.7em;margin-bottom:.65em}
.pp-ticket-kicker{color:rgba(0,0,0,.5);font-size:.62em;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.pp-ticket-tag{flex:0 0 auto;border-radius:.4em;padding:.12em .45em;background:rgba(242,84,61,.14);color:#c23a24;font-size:.6em;font-weight:700}
.pp-ticket-highlight{display:flex;gap:.6em;align-items:flex-start;border-radius:.65em;background:rgba(23,160,106,.08);border:1px solid rgba(23,160,106,.2);padding:.65em .7em}
.pp-ticket-delta{flex:0 0 auto;color:#15805a;font-size:.82em;font-weight:700}
.pp-ticket-highlight p{margin:0;color:rgba(0,0,0,.6);font-size:.72em;line-height:1.45}
.pp-ticket-rows{margin:.7em 0 0}
.pp-ticket-row{display:flex;align-items:center;justify-content:space-between;gap:1em;padding:.5em 0;border-top:1px solid rgba(0,0,0,.06);font-size:.76em}
.pp-ticket-row:first-child{border-top:0}
.pp-ticket-row dt{color:rgba(0,0,0,.5)}
.pp-ticket-row dd{margin:0;font-weight:600;color:#171717}
.pp-ticket-row dd.is-green{color:#17a06a}
.pp-composer{height:4em;flex:0 0 auto;display:flex;align-items:center;gap:.6em;padding:.7em 1em;border-top:1px solid rgba(0,0,0,.06);background:#fff}
.pp-composer-plus{width:2.5em;height:2.5em;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#f5f5f5;color:rgba(23,23,23,.55)}
.pp-composer-plus svg{width:1.3em;height:1.3em}
/* height 2.98em × own font-size .84em ≈ 2.5em base → matches the 2.5em send/attach buttons */
.pp-composer span[data-composer-text]{flex:1;min-width:0;height:2.98em;display:flex;align-items:center;border-radius:999px;padding:0 1.3em;background:#f5f5f5;color:rgba(0,0,0,.3);font-size:.84em}
.pp-composer-send{width:2.5em;height:2.5em;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#f5f5f5;color:#171717}
.pp-composer-send svg{width:1.14em;height:1.14em}
@media(max-width:560px){.product-preview-app{grid-template-columns:3.4em minmax(0,1fr);font-size:clamp(9px,3.1cqw,13px)}.pp-room-list{display:none}}
