/* Amable application workspace ------------------------------------------------ */
:root {
  --app-ink: #27382e;
  --app-muted: #667166;
  --app-line: #e3e7df;
  --app-paper: #f8f8f4;
  --app-surface: #ffffff;
  --app-soft: #edf2e9;
  --app-accent: var(--color-primary);
  --app-accent-hover: var(--color-primary-hover);
}

[hidden] { display: none !important; }

/* Shared navigation --------------------------------------------------------- */
.site-nav { border-bottom: 1px solid rgba(39,56,46,.1); background: rgba(255,255,255,.94); backdrop-filter: blur(14px); }
.site-nav__inner { width: min(100% - 2rem, 76rem); margin-inline: auto; }
.site-nav__brand { color: var(--app-ink); text-decoration: none; }
.site-nav__brand:hover { color: var(--app-ink); text-decoration: none; }
.site-nav__brand img { height: 2.25rem; }
.site-nav__brand .brand-wordmark { font-size: 1.85rem; }
.site-nav__links { gap: 2.25rem; }
.site-nav__links a { position: relative; color: #5c685f; font-size: .82rem; font-weight: 600; text-decoration: none; }
.site-nav__links a::after { content: ''; position: absolute; right: 0; bottom: -.55rem; left: 0; height: 1px; background: var(--app-accent); transform: scaleX(0); transition: transform .18s ease; }
.site-nav__links a:hover { color: var(--app-ink); }
.site-nav__links a:hover::after { transform: scaleX(1); }
.site-nav__signin { color: #4d584f; font-size: .82rem; font-weight: 650; text-decoration: none; }
.site-nav__signin:hover { color: var(--app-accent); }
.public-nav-cta.app-action { min-height: 42px; padding: .58rem 1rem; border-radius: .6rem; background: var(--app-accent); border-color: var(--app-accent); box-shadow: none; color: #fff; font-size: .8rem; font-weight: 700; }
.public-nav-cta.app-action:hover { background: var(--app-accent-hover); border-color: var(--app-accent-hover); box-shadow: 0 7px 16px rgba(135,53,45,.15); transform: translateY(-1px); }

/* Homepage photography arrives with a decorative white mat and green corner
   artwork baked into the square files. Crop into the usable photo area so the
   page's own rounded frames control the corners at every viewport size. */
.homepage-photo-frame { aspect-ratio: 1; background: #f5f5f1; }
.homepage-photo { transform: scale(1.28); transform-origin: center; }

/* Public marketing ---------------------------------------------------------- */
.marketing-page { background: #fbfaf6; color: var(--app-ink); }
.marketing-wrap { width: min(100% - 2rem, 76rem); margin-inline: auto; }
.marketing-kicker { color: var(--app-accent); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.marketing-hero { padding: clamp(3rem, 8vw, 7rem) 0; overflow: hidden; background: radial-gradient(circle at 84% 18%, #e7eee2 0, #fbfaf6 34rem); }
.marketing-hero__grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(27rem, 1.08fr); gap: clamp(2.5rem, 7vw, 6rem); align-items: center; }
.marketing-hero h1, .marketing-section h2, .marketing-showcase h2, .marketing-final h2 { font-family: var(--font-serif); font-weight: 600; letter-spacing: -.035em; line-height: 1.03; }
.marketing-hero h1 { margin: 1rem 0 1.5rem; max-width: 11ch; font-size: clamp(3.25rem, 6vw, 5.8rem); }
.marketing-hero h1 em { color: var(--app-accent); font-weight: 500; }
.marketing-lead { max-width: 40rem; color: #536057; font-size: clamp(1.05rem, 1.8vw, 1.25rem); line-height: 1.7; }
.marketing-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.marketing-cta { min-height: 50px; padding-inline: 1.3rem; }
.marketing-helper { margin-top: .8rem; color: var(--app-muted); font-size: .8rem; }
.product-window { position: relative; border: 1px solid #d9ded5; border-radius: 1.35rem; background: #fff; box-shadow: 0 35px 75px rgba(39,56,46,.16); overflow: hidden; transform: rotate(1deg); }
.product-window::before { content: ''; position: absolute; inset: auto -4rem -5rem auto; width: 14rem; height: 14rem; border-radius: 50%; background: #f1cbc3; filter: blur(1px); opacity: .45; }
.product-window__bar { position: relative; display: flex; align-items: center; gap: .36rem; height: 2.6rem; padding: 0 .9rem; border-bottom: 1px solid var(--app-line); background: #f3f4f0; }
.product-window__bar span { width: .52rem; height: .52rem; border-radius: 50%; background: #cad0c8; }
.product-window__bar strong { position: absolute; left: 50%; transform: translateX(-50%); color: #758078; font-size: .72rem; }
.product-window__body { position: relative; padding: clamp(1.25rem, 4vw, 2.4rem); }
.product-window__nav { display: flex; gap: 1.5rem; margin-bottom: 2rem; border-bottom: 1px solid var(--app-line); color: var(--app-muted); font-size: .78rem; font-weight: 600; }
.product-window__nav span { padding-bottom: .65rem; }
.product-window__nav .is-active { color: var(--app-accent); border-bottom: 2px solid var(--app-accent); }
.product-window__body h2 { margin: .5rem 0 1.35rem; font-family: var(--font-serif); font-size: clamp(1.7rem, 3vw, 2.35rem); font-weight: 600; }
.stay-essentials { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-bottom: .8rem; }
.stay-essentials div { padding: .85rem; border-radius: .75rem; background: var(--app-soft); }
.stay-essentials span, .stay-question span { display: block; margin-bottom: .2rem; color: var(--app-muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; }
.stay-essentials strong { display: block; overflow-wrap: anywhere; font-size: .86rem; }
.stay-topic-list { border: 1px solid var(--app-line); border-radius: .8rem; background: #fff; overflow: hidden; }
.stay-topic-list div { display: flex; justify-content: space-between; padding: .76rem .9rem; border-bottom: 1px solid var(--app-line); font-size: .82rem; font-weight: 600; }
.stay-topic-list div:last-child { border-bottom: 0; }
.stay-topic-list b { color: var(--app-accent); }
.stay-question { margin-top: .8rem; padding: .9rem; border-radius: .8rem; background: #fff6f2; }
.stay-question strong { color: var(--app-accent); font-size: .82rem; }
.hero-conversation { display: grid; gap: .65rem; }
.hero-message { width: fit-content; max-width: 88%; margin: 0; padding: .78rem .9rem; border-radius: .9rem; font-size: .82rem; line-height: 1.5; }
.hero-message--assistant { border: 1px solid var(--app-line); border-bottom-left-radius: .25rem; background: #fff; }
.hero-message--guest { justify-self: end; border-bottom-right-radius: .25rem; background: #dce7d6; }
.hero-task-link { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: center; margin-top: 1rem; padding: .8rem; border: 1px solid #ebc7c2; border-radius: .8rem; background: #fff6f2; }
.hero-task-link__icon { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--app-accent); color: #fff; font-size: .72rem; }
.hero-task-link small, .hero-task-link strong { display: block; }
.hero-task-link small { color: var(--app-muted); font-size: .61rem; letter-spacing: .04em; text-transform: uppercase; }
.hero-task-link strong { margin-top: .12rem; font-size: .78rem; }
.hero-task-link b { color: var(--app-accent); font-size: .66rem; white-space: nowrap; }
.marketing-proof { border-block: 1px solid var(--app-line); background: #fff; }
.marketing-proof__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.marketing-proof p { display: flex; flex-direction: column; gap: .2rem; margin: 0; padding: 1.5rem; border-right: 1px solid var(--app-line); }
.marketing-proof p:last-child { border-right: 0; }
.marketing-proof strong { font-family: var(--font-serif); font-size: 1.05rem; }
.marketing-proof span { color: var(--app-muted); font-size: .82rem; }
.marketing-section, .marketing-showcase { padding: clamp(4.5rem, 9vw, 7.5rem) 0; background: #fff; }
.marketing-section--soft, .marketing-showcase { background: #f2f3ed; }
.marketing-section__intro { max-width: 46rem; margin-bottom: 3rem; }
.marketing-section__intro h2, .marketing-showcase h2, .marketing-final h2 { margin: .7rem 0 1rem; font-size: clamp(2.45rem, 5vw, 4.2rem); }
.marketing-section__intro > p:last-child { color: var(--app-muted); font-size: 1.08rem; line-height: 1.65; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.feature-card { display: flex; flex-direction: column; min-height: 30rem; padding: 1.75rem; border: 1px solid var(--app-line); border-radius: 1.1rem; background: #fbfbf8; }
.feature-card--accent { background: var(--app-ink); color: #fff; }
.feature-card--accent h3 { color: #fff; }
.feature-card__number { margin-bottom: auto; color: #9aa29b; font: 600 .72rem/1 var(--font-sans); letter-spacing: .12em; }
.feature-card h3 { margin: 3rem 0 .8rem; font-family: var(--font-serif); font-size: 1.75rem; line-height: 1.15; }
.feature-card > p { color: var(--app-muted); line-height: 1.65; }
.feature-card--accent > p { color: #c7cec7; }
.feature-card ul { margin: 1.5rem 0 0; padding: 0; list-style: none; color: #536057; font-size: .86rem; }
.feature-card li { padding: .48rem 0; border-top: 1px solid var(--app-line); }
.mini-chat { margin-top: 1.5rem; display: grid; gap: .65rem; font-size: .78rem; }
.mini-chat p { width: fit-content; max-width: 90%; margin: 0; padding: .72rem .85rem; border-radius: .8rem; }
.mini-chat__guest { justify-self: end; background: #dce7d6; color: var(--app-ink); }
.mini-chat__assistant { background: #fff; color: var(--app-ink); }
.mini-chat__assistant span { display: block; margin-bottom: .3rem; color: var(--app-accent); font-size: .62rem; font-weight: 700; text-transform: uppercase; }
.mini-operation { display: grid; gap: .45rem; margin-top: 1.5rem; padding: 1rem; border: 1px solid #53665a; border-radius: .8rem; background: #31463a; }
.mini-operation span { color: #e7a49b; font-size: .66rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.mini-operation strong { font-family: var(--font-serif); font-size: 1.05rem; }
.mini-operation small { color: #aeb8b0; }
.marketing-showcase__grid { display: grid; grid-template-columns: minmax(19rem, .82fr) minmax(0, 1.18fr); gap: clamp(2rem, 7vw, 6rem); align-items: center; }
.marketing-photo { aspect-ratio: 4/3; border-radius: 1.25rem; overflow: hidden; box-shadow: 0 25px 55px rgba(39,56,46,.13); }
.marketing-photo img { width: 100%; height: 100%; object-fit: cover; }
.operations-preview { padding: 1rem; border: 1px solid #d7ddd4; border-radius: 1.2rem; background: #fff; box-shadow: 0 25px 55px rgba(39,56,46,.13); transform: rotate(-1deg); }
.operations-preview__head { display: grid; grid-template-columns: 1fr auto; gap: .15rem 1rem; align-items: center; padding: .35rem .35rem 1rem; }
.operations-preview__head span { grid-column: 1 / -1; color: var(--app-muted); font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; }
.operations-preview__head strong { font-family: var(--font-serif); font-size: 1.45rem; }
.operations-preview__head b { color: var(--app-accent); font-size: .7rem; }
.operations-preview__columns { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.operations-preview__columns > div { padding: .65rem; border-radius: .75rem; background: #f4f5f0; }
.operations-preview__columns > div > span { color: var(--app-muted); font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.operations-preview article { display: grid; gap: .28rem; margin-top: .55rem; padding: .75rem; border: 1px solid var(--app-line); border-radius: .65rem; background: #fff; }
.operations-preview article.is-highlighted { border-color: #e4ada6; box-shadow: inset 3px 0 var(--app-accent); }
.operations-preview article small { color: var(--app-accent); font-size: .58rem; font-weight: 700; text-transform: uppercase; }
.operations-preview article strong { font-size: .76rem; line-height: 1.35; }
.operations-preview article em { color: var(--app-muted); font-size: .58rem; font-style: normal; }
.topic-pills { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.8rem; }
.topic-pills span { padding: .55rem .8rem; border: 1px solid #d6dcd2; border-radius: 999px; background: rgba(255,255,255,.6); color: #465249; font-size: .78rem; font-weight: 600; }
.steps-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.steps-grid li { display: flex; gap: 1rem; padding: 1.5rem; border: 1px solid var(--app-line); border-radius: 1rem; background: #fff; }
.steps-grid > li > span { display: grid; place-items: center; flex: none; width: 2rem; height: 2rem; border-radius: 50%; background: var(--app-accent); color: #fff; font-weight: 700; }
.steps-grid h3 { margin: .15rem 0 .35rem; font-family: var(--font-serif); font-size: 1.25rem; }
.steps-grid p { margin: 0; color: var(--app-muted); font-size: .9rem; line-height: 1.6; }
.faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 8vw, 7rem); align-items: start; }
.faq-layout .marketing-section__intro { position: sticky; top: 7rem; }
.faq-list details { border-top: 1px solid var(--app-line); padding: 1.35rem 0; }
.faq-list details:last-child { border-bottom: 1px solid var(--app-line); }
.faq-list summary { cursor: pointer; list-style: none; color: var(--app-ink); font-family: var(--font-serif); font-size: 1.25rem; font-weight: 600; }
.faq-list summary::after { content: '+'; float: right; color: var(--app-accent); }
.faq-list details[open] summary::after { content: '−'; }
.faq-list p { max-width: 40rem; margin: .8rem 2rem 0 0; color: var(--app-muted); line-height: 1.65; }
.marketing-final { padding: clamp(4.5rem, 9vw, 7rem) 0; background: var(--app-ink); color: #fff; text-align: center; }
.marketing-final h2 { color: #fff; }
.marketing-final__inner { max-width: 48rem; }
.marketing-final__inner > p:not(.marketing-kicker):not(.marketing-helper) { margin: 0 auto 1.7rem; color: #c7cec7; font-size: 1.05rem; line-height: 1.7; }
.marketing-final .marketing-helper { color: #9eaaa1; }
.marketing-footer { padding: 2.5rem 0; border-top: 1px solid var(--app-line); background: #fff; }
.marketing-footer__inner { display: flex; justify-content: space-between; gap: 2rem; align-items: center; }
.marketing-footer .brand-wordmark { font-family: var(--font-serif); font-size: 1.75rem; font-weight: 700; }
.marketing-footer p { margin: .25rem 0 0; color: var(--app-muted); font-size: .8rem; }
.marketing-footer nav { display: flex; flex-wrap: wrap; gap: 1.2rem; color: var(--app-muted); font-size: .8rem; font-weight: 600; }

/* Authentication ----------------------------------------------------------- */
.auth-page { min-height: calc(100vh - 5rem); background: #fbfaf6; }
.auth-layout { display: grid; grid-template-columns: minmax(26rem, .92fr) minmax(32rem, 1.08fr); min-height: calc(100vh - 5rem); }
.auth-story { display: flex; flex-direction: column; padding: clamp(2rem, 5vw, 4.5rem); background: var(--app-ink); color: #fff; }
.auth-story .marketing-kicker { color: #e7a49b; }
.auth-back { color: #bdc7bf; font-size: .82rem; font-weight: 600; text-decoration: none; }
.auth-back:hover { color: #fff; }
.auth-back--dark { display: inline-block; margin-bottom: 2rem; color: var(--app-muted); }
.auth-back--dark:hover { color: var(--app-ink); }
.auth-story__content { width: min(100%, 34rem); margin-block: auto; }
.auth-story h1 { margin: .8rem 0 1.2rem; color: #fff; font-family: var(--font-serif); font-size: clamp(2.8rem, 5vw, 4.8rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.02; }
.auth-story__content > p:not(.marketing-kicker) { color: #c7cec7; font-size: 1.05rem; line-height: 1.7; }
.auth-story__note { margin: 2rem 0 0; color: #9eaaa1; font-size: .78rem; }
.auth-steps { display: grid; gap: 1rem; margin: 2.2rem 0 0; padding: 0; list-style: none; }
.auth-steps li { display: flex; gap: .85rem; padding-top: 1rem; border-top: 1px solid #4a5d50; }
.auth-steps > li > span { display: grid; place-items: center; flex: none; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--app-accent); font-size: .75rem; font-weight: 700; }
.auth-steps strong, .auth-steps small { display: block; }
.auth-steps small { margin-top: .2rem; color: #aeb8b0; line-height: 1.5; }
.auth-inbox-preview { display: grid; gap: .65rem; margin-top: 2rem; }
.auth-inbox-preview > div { padding: 1rem; border: 1px solid #4a5d50; border-radius: .8rem; background: #31463a; }
.auth-inbox-preview .status-chip { float: right; }
.auth-inbox-preview strong { display: block; font-family: var(--font-serif); font-size: 1.05rem; }
.auth-inbox-preview p { margin: .35rem 0 0; color: #b7c0b9; font-size: .78rem; }
.auth-form-panel { display: grid; place-items: center; padding: 2rem; }
.auth-form-card { width: min(100%, 28rem); }
.auth-mobile-brand { display: none; margin-bottom: 2rem; }
.auth-mobile-brand--always { display: block; }
.auth-mobile-brand .brand-wordmark { font-family: var(--font-serif); font-size: 2rem; font-weight: 700; }
.auth-form-card h1, .auth-form-card h2 { margin: .65rem 0 .65rem; color: var(--app-ink); font-family: var(--font-serif); font-size: clamp(2.3rem, 4vw, 3.4rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.05; }
.auth-intro { color: var(--app-muted); line-height: 1.6; }
.auth-form { display: grid; gap: 1.2rem; margin-top: 2rem; }
.auth-field label { display: block; margin-bottom: .45rem; color: var(--app-ink); font-size: .84rem; font-weight: 650; }
.auth-field > p { margin: .4rem 0 0; color: var(--app-muted); font-size: .72rem; line-height: 1.45; }
.auth-label-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.auth-label-row a, .auth-switch a, .auth-legal a { color: var(--app-accent); font-weight: 650; }
.auth-label-row a { font-size: .76rem; }
.auth-control { width: 100%; min-height: 52px; padding: .75rem .9rem; border: 1px solid #ccd3ca; border-radius: .65rem; background: #fff; color: var(--app-ink); font: inherit; font-size: 1rem; }
.auth-control:focus { outline: 3px solid rgba(167,66,55,.13); border-color: var(--app-accent); }
.auth-password { position: relative; }
.auth-password .auth-control { padding-right: 4rem; }
.auth-password button { position: absolute; top: 50%; right: .75rem; min-width: 2.75rem; min-height: 40px; transform: translateY(-50%); border: 0; background: transparent; color: var(--app-accent); font-size: .76rem; font-weight: 700; cursor: pointer; }
.auth-submit { width: 100%; min-height: 52px; }
.auth-switch { margin-top: 1.5rem; color: var(--app-muted); font-size: .86rem; text-align: center; }
.auth-legal { margin-top: 2rem; color: #879087; font-size: .68rem; line-height: 1.5; text-align: center; }
.auth-simple-page { min-height: calc(100vh - 5rem); display: grid; place-items: center; padding: 3rem 1rem; background: #f2f3ed; }
.auth-form-card--simple { padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--app-line); border-radius: 1.2rem; background: #fff; box-shadow: 0 20px 50px rgba(39,56,46,.08); }
#password-match-status:not(:empty) { margin-top: .5rem; color: #a32626; font-size: .78rem; }

.app-page { background: var(--app-paper); color: var(--app-ink); min-height: calc(100vh - 5rem); }
.app-wrap { width: min(100% - 2rem, 90rem); margin-inline: auto; padding-block: 2rem 3rem; }
.app-heading { font-family: var(--font-serif); font-weight: 600; color: var(--app-ink); line-height: 1.15; }
.app-kicker { color: var(--app-muted); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.app-muted { color: var(--app-muted); }
.app-surface { background: var(--app-surface); border: 1px solid var(--app-line); border-radius: 1rem; }
.app-action { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; padding: .65rem 1rem; border-radius: .65rem; border: 1px solid var(--app-line); background: var(--app-surface); color: var(--app-ink); font-weight: 600; text-decoration: none; }
.app-action:hover:not(:disabled) { border-color: #bdc7bd; background: #fbfcfa; color: var(--app-ink); text-decoration: none; }
.app-action--primary { background: var(--app-accent); border-color: var(--app-accent); color: #fff; }
.app-action--primary:hover { background: var(--app-accent-hover); border-color: var(--app-accent-hover); color: #fff; }
.bg-brand-600.text-white:hover { color: #fff; text-decoration: none; }
.app-action--secondary { background: var(--app-soft, #f5f8f6); border-color: var(--app-line); color: var(--app-ink); }
.app-action--secondary:hover { background: #eef3ef; }
.app-action:disabled, .app-action[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.app-action--quiet { border-color: transparent; background: transparent; color: var(--app-accent); }
.app-action--danger { color: #a32626; border-color: #efcaca; background: #fffafa; }

.host-nav-link { min-height: 44px; display: inline-flex; align-items: center; padding: .5rem .2rem; border-bottom: 2px solid transparent; color: #667166; font-size: .9rem; font-weight: 600; }
.host-nav-link:hover { color: var(--app-accent); text-decoration: none; }
.host-nav-link[aria-current="page"] { color: var(--app-accent); border-bottom-color: var(--app-accent); text-decoration: none; }

.workspace-tabs { display: flex; gap: .25rem; overflow-x: auto; padding: .4rem; border: 1px solid var(--app-line); border-radius: .8rem; background: var(--app-surface); }
.workspace-tabs .tab-button { min-height: 44px; border: 0 !important; border-radius: .55rem; padding: .65rem 1rem; }
.workspace-tabs .tab-button[aria-selected="true"] { color: var(--app-ink) !important; background: var(--app-soft); }

.conversation-row { position: relative; display: block; padding: 1.1rem 3rem 1.1rem 1.25rem; border: 1px solid var(--app-line); border-radius: .85rem; background: var(--app-surface); color: inherit; text-decoration: none; transition: border-color .15s ease, transform .15s ease; }
.conversation-row:hover { border-color: #bdc7bd; transform: translateY(-1px); }
.conversation-row__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.conversation-row__property { font-weight: 700; color: var(--app-ink); overflow-wrap: anywhere; }
.conversation-row__preview { color: var(--app-ink); margin-top: .35rem; line-height: 1.55; overflow-wrap: anywhere; white-space: pre-line; }
.conversation-row__meta { color: var(--app-muted); font-size: .75rem; margin-top: .75rem; }
.conversation-row__arrow { position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%); color: var(--app-accent); font-size: 1.1rem; }
.status-chip { flex: none; display: inline-flex; align-items: center; gap: .35rem; border-radius: 999px; padding: .3rem .6rem; background: var(--app-soft); color: var(--app-ink); font-size: .7rem; font-weight: 700; }
.status-chip--attention { background: #fce8e5; color: #8d3028; }
.inbox-filters { overflow: visible; }
.inbox-more { position: relative; margin-left: auto; }
.inbox-more summary { display: flex; align-items: center; list-style: none; cursor: pointer; }
.inbox-more summary::after { content: '⌄'; margin-left: .45rem; }
.inbox-more__menu { position: absolute; top: calc(100% + .45rem); right: 0; z-index: 5; min-width: 10rem; padding: .35rem; border: 1px solid var(--app-line); border-radius: .7rem; background: #fff; box-shadow: 0 14px 30px rgba(39,56,46,.12); }
.inbox-more__menu a { display: block; padding: .65rem .75rem; border-radius: .45rem; color: var(--app-muted); font-size: .82rem; font-weight: 600; }
.inbox-more__menu a:hover, .inbox-more__menu a[aria-current="page"] { background: var(--app-soft); color: var(--app-ink); }

.message-shell { width: min(100%, 46rem); margin-inline: auto; }
.message-bubble { width: fit-content; max-width: min(88%, 38rem); padding: .8rem 1rem; border-radius: 1rem; background: var(--app-surface); border: 1px solid var(--app-line); color: var(--app-ink); white-space: pre-wrap; overflow-wrap: anywhere; }
.message-bubble--out { margin-left: auto; background: var(--app-soft); border-color: var(--app-soft); }
.message-meta { color: var(--app-muted); font-size: .75rem; margin-top: .35rem; }
.conversation-work { margin-bottom: 1rem; padding: 1rem; border: 1px solid var(--app-line); border-radius: 1rem; background: #fff; }
.conversation-work__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.conversation-task-list { display: grid; gap: .5rem; margin-top: 1rem; }
.conversation-task-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .8rem; border: 1px solid var(--app-line); border-radius: .7rem; color: inherit; text-decoration: none; }
.conversation-task-row:hover { border-color: #bdc7bd; background: #fbfcfa; }
.conversation-task-row strong, .conversation-task-row small { display: block; }
.conversation-task-row small { margin-top: .2rem; color: var(--app-muted); font-size: .7rem; }
.conversation-task-create { margin-top: 1rem; border-top: 1px solid var(--app-line); padding-top: .9rem; }
.conversation-task-create summary { cursor: pointer; color: var(--app-accent); font-size: .82rem; font-weight: 700; }
.conversation-task-create form { display: grid; gap: .7rem; margin-top: .9rem; }
.conversation-task-create label, .task-create__form label { color: var(--app-ink); font-size: .76rem; font-weight: 700; }
.reply-composer { position: static; margin-bottom: 1rem; background: #fff; border: 1px solid var(--app-line); border-radius: 1rem; padding: 1rem; box-shadow: 0 12px 30px rgba(39,56,46,.08); }
.reply-composer textarea { min-height: 6rem; font-size: 1rem; }

.guide-editor-intro { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; flex-wrap: wrap; margin-bottom: 1rem; }
.guide-editor-note { border-left: 3px solid var(--app-accent); background: #fffaf7; padding: .8rem 1rem; border-radius: 0 .6rem .6rem 0; color: #594a43; font-size: .875rem; }
.guide-editor-main { min-width: 0; }
.section-card { border-color: var(--app-line) !important; }
.section-card:hover { border-color: #bdc7bd !important; }
.section-card.expanded { box-shadow: 0 10px 30px rgba(39,56,46,.08); }
.section-card .section-title-input, .section-card .section-content-input { font-size: 1rem; }
.section-type-label { display: inline-flex; border-radius: 999px; background: var(--app-soft); padding: .2rem .5rem; color: var(--app-muted); font-size: .7rem; font-weight: 600; }
.mobile-editor-back { display: none; margin: -.25rem 0 1rem; padding-inline: 0; }

.property-card { display: flex; flex-direction: column; border: 1px solid var(--app-line); box-shadow: 0 10px 28px rgba(39,56,46,.06); transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.property-card:hover { border-color: #c7cec5; box-shadow: 0 16px 35px rgba(39,56,46,.1); transform: translateY(-2px); }
.property-card__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-top: auto; }
.property-card__primary { grid-column: 1 / -1; justify-content: space-between; }
.property-card__activity { display: flex; flex-wrap: wrap; gap: .45rem 1rem; margin-top: .8rem; }
.property-card__conversation { align-self: flex-start; border: 0; background: transparent; color: var(--app-muted); font-size: .76rem; text-decoration: underline; cursor: pointer; }

.task-count-badge { display: inline-grid; place-items: center; min-width: 1.35rem; height: 1.35rem; padding-inline: .35rem; border-radius: 999px; background: var(--app-accent); color: #fff; font-size: .66rem; }
.task-workspace-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.5rem; }
.task-create { position: relative; flex: none; }
.task-create > summary { cursor: pointer; list-style: none; }
.task-create > summary::-webkit-details-marker { display: none; }
.task-create[open] > summary { background: var(--app-accent-hover); }
.task-create__form { position: absolute; top: calc(100% + .6rem); right: 0; z-index: 8; display: grid; gap: .7rem; width: min(26rem, calc(100vw - 4rem)); padding: 1rem; border: 1px solid var(--app-line); border-radius: .9rem; background: #fff; box-shadow: 0 18px 45px rgba(39,56,46,.15); }
.task-create__fields { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.task-create__fields > div { display: grid; gap: .35rem; }
.task-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-top: 1.5rem; }
.task-column { min-width: 0; padding: .75rem; border-radius: .85rem; background: #f4f5f0; }
.task-column__head { display: flex; justify-content: space-between; align-items: center; padding: .2rem .2rem .75rem; }
.task-column__head h3 { font-size: .78rem; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
.task-column__head span { display: grid; place-items: center; min-width: 1.4rem; height: 1.4rem; border-radius: 999px; background: #fff; color: var(--app-muted); font-size: .68rem; }
.task-column__list { display: grid; gap: .65rem; }
.task-card { min-width: 0; padding: .9rem; border: 1px solid var(--app-line); border-radius: .75rem; background: #fff; scroll-margin-top: 6rem; }
.task-card:target { border-color: var(--app-accent); box-shadow: 0 0 0 3px rgba(167,66,55,.12); }
.task-card__meta { display: flex; justify-content: space-between; gap: .5rem; color: var(--app-muted); font-size: .62rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.task-priority { color: #526056; }
.task-priority--high, .task-priority--urgent { color: #a33b31; }
.task-card h4 { margin: .65rem 0 .35rem; overflow-wrap: anywhere; font-family: var(--font-serif); font-size: 1.08rem; line-height: 1.25; }
.task-card > p { margin: 0 0 .65rem; color: var(--app-muted); font-size: .76rem; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.task-source { display: inline-block; margin-top: .25rem; color: var(--app-accent); font-size: .7rem; font-weight: 650; }
.task-source--manual { color: var(--app-muted); font-weight: 500; }
.task-status-form { display: grid; grid-template-columns: 1fr auto; gap: .45rem; margin-top: .8rem; padding-top: .7rem; border-top: 1px solid var(--app-line); }
.task-status-form .form-input { min-width: 0; }
.task-status-form .app-action { min-height: 40px; padding-inline: .7rem; font-size: .72rem; }
.task-empty { padding: 1rem .35rem; color: var(--app-muted); font-size: .76rem; text-align: center; }

.magic-page { min-height: 100vh; padding: 1rem; display: grid; place-items: center; background: var(--app-paper); color: var(--app-ink); font-family: var(--font-sans); }
.magic-card { width: min(100%, 32rem); background: var(--app-surface); border: 1px solid var(--app-line); border-radius: 1rem; overflow: hidden; box-shadow: 0 18px 45px rgba(39,56,46,.09); }
.magic-head, .magic-body { padding: 1.5rem; }
.magic-head { border-bottom: 1px solid var(--app-line); }
.magic-quote { margin: 1rem 0; padding: 1rem; background: var(--app-soft); border-radius: .75rem; font-size: 1.05rem; overflow-wrap: anywhere; }
.magic-card textarea { width: 100%; min-height: 8rem; padding: .8rem; border: 1px solid var(--app-line); border-radius: .65rem; font: inherit; font-size: 1rem; resize: vertical; }

@media (max-width: 767px) {
  .marketing-hero { padding: 3.2rem 0 4rem; background: radial-gradient(circle at 50% 62%, #e7eee2 0, #fbfaf6 28rem); }
  .marketing-hero__grid, .marketing-showcase__grid, .faq-layout { grid-template-columns: 1fr; }
  .marketing-hero h1 { font-size: clamp(3rem, 15vw, 4.4rem); }
  .product-window { margin-top: .5rem; transform: none; }
  .product-window__body { padding: 1.2rem; }
  .hero-task-link { grid-template-columns: auto 1fr; }
  .hero-task-link b { grid-column: 2; }
  .marketing-proof__grid { grid-template-columns: 1fr; }
  .marketing-proof p { border-right: 0; border-bottom: 1px solid var(--app-line); }
  .marketing-proof p:last-child { border-bottom: 0; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: auto; }
  .feature-card__number { margin-bottom: 3rem; }
  .steps-grid { grid-template-columns: 1fr; }
  .faq-layout .marketing-section__intro { position: static; }
  .marketing-footer__inner { align-items: flex-start; flex-direction: column; }
  .marketing-footer .brand-wordmark { display: inline; }
  .auth-layout { display: block; min-height: calc(100vh - 5rem); }
  .auth-story { display: none; }
  .auth-form-panel { min-height: calc(100vh - 5rem); padding: 2rem 1rem 3rem; }
  .auth-mobile-brand, .auth-mobile-brand .brand-wordmark { display: block; }
  .app-wrap { width: min(100% - 2rem, 90rem); padding-block: 1.4rem 2.5rem; }
  .conversation-row__top { display: block; }
  .conversation-row .status-chip { margin-top: .65rem; }
  .message-bubble { max-width: 94%; }
  .conversation-work__head { align-items: flex-start; flex-direction: column; }
  .reply-composer { bottom: .5rem; }
  .workspace-tabs { margin-inline: -1rem; border-inline: 0; border-radius: 0; padding-inline: 1rem; }
  .task-workspace-head { flex-direction: column; }
  .task-create { width: 100%; }
  .task-create > summary { width: 100%; }
  .task-create__form { position: static; width: 100%; margin-top: .6rem; box-shadow: none; }
  .task-board { grid-template-columns: 1fr; }
  .guide-availability, .guide-editor-toolbar { align-items: stretch; flex-direction: column; gap: .8rem; }
  .guide-availability__actions, .guide-editor-actions { display: flex; flex-wrap: wrap; }
  .guide-editor-actions > * { flex: 1 1 9rem; }
  .guide-editor-actions button { width: 100%; justify-content: center; }
  .guide-editor-main.is-editing .guide-editor-toolbar { display: none; }
  .guide-editor-main.is-editing #sections-list > .section-card:not(.expanded) { display: none; }
  .guide-editor-main.is-editing .section-card.expanded { margin-inline: -1rem; border-inline: 0 !important; border-radius: 0; box-shadow: none; }
  .guide-editor-main.is-editing .section-card.expanded > div:first-child { display: none; }
  .guide-editor-main.is-editing .mobile-editor-back { display: inline-flex; }
  #preview-panel.is-open { position: fixed; inset: 5rem 0 0; z-index: 40; width: 100%; padding: 1rem; background: var(--app-paper); overflow-y: auto; }
  #preview-panel.is-open > div { position: static; }
  #preview-panel.is-open iframe { min-height: calc(100vh - 10rem); }
  .magic-page { padding: 0; display: block; }
  .magic-card { min-height: 100vh; border: 0; border-radius: 0; }
}

@media (max-width: 639px) {
  .brand-wordmark { display: none; }
  .public-nav-cta { display: none !important; }
  .host-nav-actions { gap: .8rem; }
  .host-nav-actions.space-x-6 > :not([hidden]) ~ :not([hidden]) { margin-left: 0; }
  .host-nav-link, .host-nav-signout { white-space: nowrap; font-size: .78rem; }
  .site-nav__inner { width: min(100% - 1.5rem, 76rem); }
  .site-nav__brand img { height: 2rem; }
  .auth-mobile-brand .brand-wordmark, .marketing-footer .brand-wordmark { display: inline; }
  .operations-preview__columns, .task-create__fields { grid-template-columns: 1fr; }
  .operations-preview { transform: none; }
  .conversation-task-row { align-items: flex-start; flex-direction: column; }
}

/* The legacy design-system utilities load after Tailwind and otherwise cancel
   responsive variants such as md:flex-row. Restore the variants used by the
   application workspace at their intended breakpoints. */
@media (min-width: 640px) {
  .sm\:flex-row { flex-direction: row; }
  .sm\:w-64 { width: 16rem; }
}

@media (min-width: 768px) {
  .md\:flex { display: flex; }
  .md\:flex-row { flex-direction: row; }
  .md\:items-start { align-items: flex-start; }
  .md\:items-center { align-items: center; }
  .md\:justify-between { justify-content: space-between; }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .lg\:grid { display: grid; }
  .lg\:flex-row { flex-direction: row; }
  .lg\:items-start { align-items: flex-start; }
  .lg\:justify-start { justify-content: flex-start; }
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .conversation-row { transition: none; }
  .conversation-row:hover { transform: none; }
}

/* Keep the reported issue and response in normal flow, clear of the transcript. */
.conversation-issue, .conversation-response { padding: 1.25rem; margin-bottom: 1rem; border: 1px solid var(--app-line); border-radius: 1rem; }
.conversation-issue { background: #fff7f2; border-left: 4px solid var(--app-accent); }
.conversation-response { background: var(--app-soft); }
.conversation-issue__text { white-space: pre-wrap; overflow-wrap: anywhere; margin: .8rem 0; line-height: 1.6; }
.conversation-history { border-top: 1px solid var(--app-line); padding: 1rem 0; }
.conversation-history > summary { cursor: pointer; font-weight: 600; color: var(--app-ink); padding: .25rem 0; }
.conversation-history > summary:hover, .conversation-task-create > summary:hover { color: var(--app-accent); text-decoration: underline; }
.conversation-history > summary:focus-visible, .conversation-task-create > summary:focus-visible { outline: 2px solid var(--app-accent); outline-offset: 4px; }
.conversation-history[open] > summary { margin-bottom: 1rem; }

/* Guest support: the handoff and reply lead at every screen size. */
.inbox-heading { align-items: center; }
.conversation-row { padding: 1.15rem 1.25rem; }
.conversation-row__content { flex: 1; }
.conversation-row__property { font-size: .82rem; color: var(--app-muted); }
.conversation-row__label { margin-top: .8rem; font-size: .65rem; letter-spacing: .07em; text-transform: uppercase; font-weight: 700; color: var(--app-muted); }
.conversation-row__footer { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--app-line); }
.conversation-row__meta { margin: 0; }
.conversation-row__cta { flex: none; color: var(--app-accent); font-size: .8rem; font-weight: 700; }
.conversation-row__update { margin-top: .7rem; padding: .6rem .75rem; background: var(--app-soft); border-radius: .5rem; font-size: .82rem; overflow-wrap: anywhere; }
.conversation-row:focus-visible { outline: 3px solid var(--app-accent); outline-offset: 3px; }
.conversation-heading > div { min-width: 0; flex: 1; }
.conversation-heading .app-kicker { overflow-wrap: anywhere; }
.conversation-update { padding: 1rem; margin-bottom: 1rem; border: 1px solid var(--app-line); border-radius: .8rem; background: var(--app-soft); }
.conversation-task-row > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.conversation-task-create > summary, .conversation-history > summary { min-height: 44px; display: flex; align-items: center; gap: .5rem; }
.conversation-task-create > summary::before, .conversation-history > summary::before { content: '+'; }
.conversation-task-create[open] > summary::before, .conversation-history[open] > summary::before { content: '−'; }
.magic-quote { white-space: pre-wrap; }
@media (max-width: 767px) {
  .inbox-heading { gap: .75rem; margin-bottom: 1.2rem; }
  .inbox-heading .app-kicker { display: none; }
  .inbox-heading h1 { font-size: 2rem; }
  .inbox-heading .app-muted { font-size: .875rem; }
  .inbox-filters.workspace-tabs { margin-inline: 0; padding: .25rem; border: 1px solid var(--app-line); border-radius: .7rem; gap: 0; }
  .inbox-filters .tab-button { padding: .65rem .7rem; font-size: .8rem; white-space: nowrap; }
  .conversation-row { padding: 1rem; }
  .conversation-row__top { display: flex; flex-direction: column-reverse; gap: .5rem; }
  .conversation-row .status-chip { margin: 0; }
  .conversation-row__preview { font-size: .95rem; }
  .conversation-row__footer { align-items: flex-start; flex-direction: column; gap: .65rem; }
  .conversation-row__cta { align-self: flex-end; }
  .conversation-page .message-shell { width: calc(100% - 2rem); }
  .conversation-heading { margin-bottom: 1rem; gap: .65rem; }
  .conversation-heading h1 { font-size: 1.65rem; }
  .conversation-heading .status-chip { align-self: flex-start; }
  .conversation-issue, .conversation-response { padding: 1rem; border-radius: .8rem; }
  .conversation-page h2 { font-size: 1.3rem; }
  .conversation-issue__text { font-size: .95rem; line-height: 1.55; }
  .reply-composer { box-shadow: none; }
  #manager-reply-submit { width: 100%; min-height: 48px; }
  .conversation-task-row { flex-wrap: wrap; gap: .5rem; }
  .conversation-task-create .form-input, #tab-tasks .form-input { min-width: 0; width: 100%; font-size: 16px; }
  .task-card__meta, .task-source { font-size: .78rem; }
  .task-source { padding-block: .7rem; }
  .task-card > p { font-size: .9rem; }
  .task-status-form .app-action { min-height: 44px; font-size: .85rem; }
  .property-workspace .workspace-tabs { display: grid; grid-template-columns: 1fr 1fr; margin-inline: 0; padding: .25rem; border: 1px solid var(--app-line); border-radius: .7rem; }
  .property-workspace .workspace-tabs .tab-button { padding: .6rem .4rem; font-size: .8rem; }
  .property-workspace .workspace-tabs svg { display: none; }
  .property-workspace:has([data-tab="tasks"][aria-selected="true"]) .property-workspace-actions { display: none; }
  .property-workspace:has([data-tab="tasks"][aria-selected="true"]) .property-workspace-header { margin-bottom: 1rem; }
  .property-workspace:has([data-tab="tasks"][aria-selected="true"]) .property-workspace-identity { padding: 0; border: 0; background: transparent; box-shadow: none; }
  .property-workspace:has([data-tab="tasks"][aria-selected="true"]) .property-workspace-icon,
  .property-workspace:has([data-tab="tasks"][aria-selected="true"]) #property-guide-status { display: none; }
  .property-workspace:has([data-tab="tasks"][aria-selected="true"]) #property-name { font-family: var(--font-sans); font-size: 1rem; line-height: 1.45; overflow-wrap: anywhere; }
  .property-workspace .app-surface:has(> #tab-tasks:not(.hidden)) { padding: 1rem; }
  .task-workspace-head { gap: .8rem; }
  .task-workspace-head h2 { font-size: 1.6rem; }
  .task-workspace-head .app-kicker { display: none; }
  .task-workspace-head .app-muted { font-size: .875rem; }
  .task-board { margin-top: 1rem; }
}

/* Document import progress stays visible and readable at narrow widths. */
.guide-import-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: .75rem; row-gap: .25rem; align-items: center; }
.guide-import-form > label { grid-column: 1; grid-row: 1; }
.guide-import-form > input { grid-column: 1; grid-row: 2; min-width: 0; }
.guide-import-form > p { grid-column: 1; grid-row: 3; }
.guide-import-form > button { grid-column: 2; grid-row: 2; }
@media (max-width: 640px) {
  .guide-import-form { grid-template-columns: minmax(0, 1fr); }
  .guide-import-form > button { grid-column: 1; grid-row: 4; width: 100%; margin-top: .5rem; }
}
.guide-import-status { margin-top: 1rem; padding: 1.1rem; border: 1px solid #c9d8d0; border-radius: 12px; background: #f5f8f6; color: #304d40; }
.guide-import-heading { display: flex; align-items: center; gap: .6rem; }
.guide-import-file { margin-top: .35rem; font-size: .85rem; overflow-wrap: anywhere; color: #52645b; }
.guide-import-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .65rem; padding: 0; margin: 1rem 0; list-style: none; font-size: .8rem; }
.guide-import-steps li { border-top: 3px solid #dce3df; padding-top: .45rem; color: #65746c; }
.guide-import-steps li[data-step="current"] { border-color: #ad783b; color: #735022; font-weight: 700; }
.guide-import-steps li[data-step="done"] { border-color: #48735c; color: #304d40; }
.guide-import-status[data-state="failed"] { background: #fff8ef; border-color: #e1c59f; }
.guide-import-spinner { width: 1rem; height: 1rem; flex-shrink: 0; border: 2px solid #c9d8d0; border-top-color: #48735c; border-radius: 50%; animation: guide-import-spin 1s linear infinite; }
.guide-import-spinner[hidden] { display: none; }
@keyframes guide-import-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .guide-import-spinner { animation: none; } }
@media (max-width: 540px) { .guide-import-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.property-workspace-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.property-workspace-actions { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
@media (max-width: 640px) {
  .property-workspace-actions { width: 100%; }
  .property-workspace-actions > * { flex: 1 1 auto; justify-content: center; }
}