.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 1.5rem; height: 1.5rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.icon-disc { display: inline-grid; place-items: center; flex: 0 0 auto; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--site-stone); color: var(--site-leaf); }
.icon-disc .icon { width: 1.25rem; height: 1.25rem; }


.opening { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: clamp(34rem, 66svh, 48rem); color: var(--site-on-night); }
.opening-photo { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.opening-photo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--art-position, center); }

.opening-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(8 16 34 / 38%), transparent 24%), linear-gradient(100deg, rgb(8 16 34 / var(--scrim-a, 58%)) 0%, rgb(8 16 34 / var(--scrim-b, 30%)) 46%, rgb(8 16 34 / 4%) 74%), linear-gradient(0deg, rgb(8 16 34 / 34%), transparent 46%); }
.opening-inner { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; gap: var(--s-8); padding-block: calc(var(--header-h) + var(--s-7)) var(--s-7); }
.opening-copy { max-width: 42rem; }
.opening .display { margin-top: var(--s-5); color: var(--site-on-night); max-width: 15ch; }
.opening .lead { margin-top: var(--s-5); color: rgb(251 248 242 / 92%); }
.opening .actions { margin-top: var(--s-6); }
.opening-card { justify-self: end; width: min(100%, 23rem); }
@media (max-width: 56em) {
  .opening-inner { grid-template-columns: minmax(0, 1fr); gap: var(--s-7); }
  .opening-card { justify-self: start; }
}
@media (max-width: 40em) {
  .opening { min-height: 0; }
  .opening-photo::after { background: linear-gradient(0deg, rgb(8 16 34 / 76%) 0%, rgb(8 16 34 / 52%) 55%, rgb(8 16 34 / 40%) 100%); }
  .opening-card { display: none; }
}
@media (forced-colors: active) { .opening-photo { display: none; } }


.pcard { display: grid; gap: var(--s-4); text-align: left; }
.pcard-head { display: flex; align-items: center; gap: var(--s-3); }
.card .pcard-title { font-weight: 600; line-height: 1.35; color: var(--site-ink); }
.card .pcard-sub { font-size: var(--t-small); line-height: 1.45; color: var(--site-muted); }
.card .pcard-body { color: var(--site-ink); }
.pcard-rows { display: grid; gap: var(--s-2); }
.card .pcard-row { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-radius: var(--r-card); background: var(--site-stone); line-height: 1.4; color: var(--site-ink); }
.pcard-row .icon { width: 1.125rem; height: 1.125rem; color: var(--site-leaf); }
.pcard-row > span:not(.chip, .value) { min-width: 0; flex: 1; }
.pcard-row small { display: block; font-size: var(--t-small); color: var(--site-muted); }
.pcard-row .value { flex: 0 0 auto; font-weight: 600; font-variant-numeric: tabular-nums; }
.card .pcard-quote { padding: var(--s-3) var(--s-4); border-radius: var(--r-card); background: var(--site-stone); color: var(--site-ink); }
.pcard-mark { padding-inline: var(--s-1); border-radius: 2px; background: var(--site-waiting-bg); color: var(--site-ink); font-weight: 600; }
.pcard-divider { height: 1px; background: var(--site-line); }

.pcard-button { justify-self: start; display: inline-flex; align-items: center; gap: var(--s-2); padding: var(--s-2) var(--s-4); border-radius: var(--r-pill); background: var(--site-blossom); color: var(--site-ink); font-size: var(--t-small); font-weight: 600; }
.pcard-button .icon { width: 1rem; height: 1rem; }
.card .date-large { font: 600 var(--t-h2)/1.1 var(--site-sans); color: var(--site-ink); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.card .qa-question { display: flex; align-items: center; gap: var(--s-3); font-size: var(--t-small); color: var(--site-muted); }
.qa-question .icon { width: 1.125rem; height: 1.125rem; color: var(--site-leaf); }


.chips { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.chip { display: inline-flex; align-items: center; gap: var(--s-1); padding: var(--s-1) var(--s-3); border-radius: var(--r-pill); background: var(--site-stone); color: var(--site-ink); font-size: var(--t-small); font-weight: 600; line-height: 1.3; white-space: nowrap; }
.pcard-row .chip { background: var(--site-paper); }
.chip .icon { width: 1rem; height: 1rem; }
.pcard-row .chip-ok, .chip-ok { background: var(--site-done-bg); color: var(--site-done); }
.pcard-row .chip-board, .chip-board { background: var(--site-board-bg); color: var(--site-board); }
.pcard-row .chip-wait, .chip-wait { background: var(--site-waiting-bg); color: var(--site-waiting); }
.pcard-row .chip-info, .chip-info { background: var(--site-info-bg); color: var(--site-info); }
.on-night .card .text-link { color: var(--site-rose); }


.checklist { display: grid; gap: var(--s-4); counter-reset: step; }
.checklist li { counter-increment: step; display: flex; align-items: flex-start; gap: var(--s-4); color: var(--site-ink); }
.checklist li::before { content: counter(step); flex: 0 0 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: var(--site-stone); color: var(--site-leaf); font-weight: 600; font-size: var(--t-small); }
.timeline li { display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: var(--s-4); padding-block: var(--s-4); border-bottom: 1px solid var(--site-line); color: var(--site-ink); }
.timeline li:first-child { padding-top: 0; }
.timeline li:last-child { padding-bottom: 0; border-bottom: 0; }
.timeline-day { font-weight: 600; }


.chapters { display: grid; gap: var(--s-10); }
.chapter { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-8); align-items: center; }
.chapter:nth-child(even) { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.chapter:nth-child(even) .chapter-copy { order: 2; }
.chapter-copy { max-width: 32rem; }
.chapter-kicker { display: block; margin-bottom: var(--s-3); font-size: var(--t-small); font-weight: 600; color: var(--site-ink); }
.chapter-copy p { margin-top: var(--s-4); max-width: 64ch; text-wrap: pretty; }

.chapter-visual { min-width: 0; padding: var(--s-8) var(--s-7); border-radius: var(--r-media); background: var(--site-stone); }
.chapter-visual > .pcard, .visual-pair { max-width: 30rem; margin-inline: auto; }
.visual-pair { display: grid; gap: var(--s-4); }
.chapter-visual:has(> .visual-photo) { padding: 0; background: none; }
.visual-photo { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; gap: var(--s-8); min-height: 28rem; padding: var(--s-6); border-radius: var(--r-media); background: var(--site-stone); }
.visual-photo img { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; }
.visual-photo .button-glass { align-self: flex-start; text-align: left; }
.visual-photo .pcard { margin-top: auto; width: min(100%, 22rem); }
.chapter-wide { grid-template-columns: minmax(0, 1fr); gap: var(--s-7); }
.chapter-wide .chapter-copy { max-width: 44rem; }


.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); }
.choice { display: grid; align-content: start; justify-items: start; gap: var(--s-4); padding: var(--s-6); border-radius: var(--r-card); background: var(--site-stone); }
.choice .icon-disc { background: var(--site-paper); }
.choice p { max-width: 64ch; }
.choice-facts { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.choice-facts li { padding: var(--s-1) var(--s-3); border-radius: var(--r-pill); background: var(--site-paper); color: var(--site-ink); font-size: var(--t-small); font-weight: 600; }

@media (max-width: 56em) {
  .chapters { gap: var(--s-9); }
  .chapter, .chapter:nth-child(even) { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .chapter:nth-child(even) .chapter-copy { order: 0; }
  .choice-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 40em) {
  .chapters { gap: var(--s-8); }
  .chapter-visual { padding: var(--s-5) var(--s-4); }
  .visual-photo { min-height: 22rem; padding: var(--s-4); gap: var(--s-6); }
  .visual-photo .pcard { width: 100%; }
  .visual-photo:not(:has(.button-glass)) { padding-top: var(--s-10); }
  .choice { padding: var(--s-5); }
}


.with-board-inner { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--s-8); align-items: start; }
.with-board ul { border-top: 1px solid var(--site-line); }
.with-board li { display: flex; align-items: flex-start; gap: var(--s-4); padding-block: var(--s-5); border-bottom: 1px solid var(--site-line); color: var(--site-ink); }
.with-board li .icon { width: 1.25rem; height: 1.25rem; margin-top: var(--s-1); color: var(--site-leaf); }
@media (max-width: 56em) { .with-board-inner { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); } }


.next-inner { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--s-8); align-items: start; }
.next-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-7) var(--s-5); }
.next-card { display: grid; align-content: start; gap: var(--s-3); }
.next-card > div { display: grid; gap: var(--s-2); }
.next-card img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--r-media); background: var(--site-stone); }
.next-card h3 { display: inline-flex; align-items: center; gap: var(--s-2); margin-top: var(--s-2); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: .3em; transition: text-decoration-color var(--m-fast); }
.next-card h3 svg { width: 1.125rem; height: 1.125rem; transition: translate var(--m-fast) var(--ease); }
.next-card:hover h3 { text-decoration-color: currentColor; }
.next-card:hover h3 svg { translate: 3px 0; }
.on-night .next-card p { color: var(--site-on-night-muted); }
@media (max-width: 56em) { .next-inner { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); } }
@media (max-width: 36em) { .next-grid { grid-template-columns: minmax(0, 1fr); } }


.invite-inner { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--s-6) var(--s-8); }
.invite h2 { max-width: 18ch; }
.invite .lead { margin-top: var(--s-4); color: var(--site-on-night-muted); }
.invite .actions { margin-top: 0; }


.plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.plan { padding: var(--s-6); border-radius: var(--r-card); background: var(--site-paper); box-shadow: var(--shadow-lift); color: var(--site-muted); }
.plan-price { margin-top: var(--s-4); }
.plan-price span { display: block; font: 600 var(--t-h2)/1.1 var(--site-sans); color: var(--site-ink); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.plan-vat { margin-top: var(--s-1); font-size: var(--t-small); }
.plan-included { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--s-5) var(--s-8); align-items: start; margin-top: var(--s-5); padding: var(--s-6); border-radius: var(--r-card); background: var(--site-paper); }
.plan-included ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3) var(--s-5); }
.plan-included li { display: flex; align-items: flex-start; gap: var(--s-3); color: var(--site-ink); }
.plan-included li .icon { width: 1.25rem; height: 1.25rem; margin-top: var(--s-1); color: var(--site-leaf); }
.plan-other { margin-top: var(--s-6); }
@media (max-width: 56em) {
  .plan-grid, .plan-included { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 40em) {
  .plan-included ul { grid-template-columns: minmax(0, 1fr); }
  .plan, .plan-included { padding: var(--s-5); }
}


.feature-head .chapter-kicker { margin-bottom: var(--s-3); }
.feature-head p { margin-top: var(--s-4); max-width: 64ch; }
.table-wrap { overflow-x: auto; border-radius: var(--r-card); background: var(--site-paper); box-shadow: var(--shadow-lift); }
.provider-table { width: 100%; border-collapse: collapse; }
.provider-table th, .provider-table td { padding: var(--s-4) var(--s-5); border-bottom: 1px solid var(--site-line); text-align: left; color: var(--site-ink); }
.provider-table thead th { font-size: var(--t-small); font-weight: 600; color: var(--site-muted); }
.provider-table tbody th { font-weight: 600; }
.provider-table tbody tr:last-child > * { border-bottom: 0; }
@media (max-width: 40em) { .provider-table th, .provider-table td { padding: var(--s-3); } }


.story-inner { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s-8); align-items: start; }
.story .story-lead { color: var(--site-ink); max-width: 44ch; }
.story-text { max-width: 64ch; }
.principle-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-7) var(--s-5); }
.principle { display: grid; align-content: start; justify-items: start; gap: var(--s-3); }
.principle .icon-disc { margin-bottom: var(--s-2); background: var(--site-paper); }
.who-text { display: grid; gap: var(--s-4); max-width: 64ch; }
.who-text .lead { color: var(--site-ink); }
.founder-input { max-width: 44rem; padding: var(--s-5) var(--s-6); border-radius: var(--r-card); background: var(--site-stone); color: var(--site-ink); }
.founder-input strong { display: block; margin-bottom: var(--s-1); font-weight: 600; }
.contact-inner { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s-8); align-items: center; }
.contact-art img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-media); }
.contact-line { display: flex; align-items: center; gap: var(--s-3); color: var(--site-ink); }
.contact-line + .contact-line { margin-top: var(--s-3); }
.contact-line .icon { width: 1.25rem; height: 1.25rem; color: var(--site-leaf); }
@media (max-width: 56em) {
  .story-inner, .contact-inner { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .principle-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 36em) { .principle-grid { grid-template-columns: minmax(0, 1fr); } }


.legal-head { padding-top: calc(var(--header-h) + var(--s-9)); padding-bottom: var(--s-7); }
.legal-head .display { max-width: 18ch; font-size: clamp(2.5rem, 7vw, 4.5rem); overflow-wrap: break-word; }
.legal-head .legal-meta { color: var(--site-on-night-muted); }
.legal-head .lead { max-width: 52ch; margin-top: var(--s-4); }
.legal-meta { margin-top: var(--s-4); font-size: var(--t-small); }
.legal-body { max-width: 44rem; padding-bottom: var(--s-9); color: var(--site-ink); }
.legal-body > * + * { margin-top: var(--s-4); }
.legal-body h2 { margin-top: var(--s-8); font-size: var(--t-h3); }
.legal-body ul { padding-left: 1.25em; }
.legal-body li + li { margin-top: var(--s-2); }
.legal-body .founder-input { margin-top: var(--s-6); }
.legal-body .table-wrap { margin-top: var(--s-5); }
.legal-nav { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); margin-top: var(--s-8); padding-top: var(--s-5); border-top: 1px solid var(--site-line); font-size: var(--t-small); }
.legal-nav a[aria-current="page"] { color: var(--site-muted); text-decoration: none; }
.legal-page { padding-top: var(--s-8); }



.opening .opening-link { margin-top: var(--s-4); }


.try-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.try-pick { display: grid; grid-template-rows: auto auto 1fr auto; align-content: start; gap: var(--s-3); padding: var(--s-5); border: 0; border-radius: var(--r-card); background: var(--site-stone); color: var(--site-ink); text-align: left; transition: background var(--m-fast) var(--ease), box-shadow var(--m-fast) var(--ease), transform var(--m-fast) var(--ease); }
.try-pick:hover { transform: translateY(-1px); box-shadow: var(--shadow-lift); }
.try-pick[aria-pressed="true"] { background: var(--site-paper); box-shadow: var(--shadow-lift), 0 0 0 1px var(--site-line); }
.try-pick .icon-disc { background: var(--site-paper); }
.try-pick[aria-pressed="true"] .icon-disc { background: var(--site-stone); }
.try-pick-from { display: flex; align-items: center; gap: var(--s-3); font-weight: 600; line-height: 1.35; }
.try-pick-from small { display: block; font-size: var(--t-small); font-weight: 400; color: var(--site-muted); }
.try-pick-subject { margin-top: var(--s-2); font: 600 var(--t-h3)/1.3 var(--site-sans); letter-spacing: -.005em; }
.try-pick-preview { color: var(--site-muted); text-wrap: pretty; }
.try-pick-mark { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 1.5rem; font-size: var(--t-small); font-weight: 600; color: var(--site-leaf); visibility: hidden; }
.try-pick-mark .icon { width: 1rem; height: 1rem; }
.try-pick[aria-pressed="true"] .try-pick-mark { visibility: visible; }


.try-note { display: flex; align-items: flex-start; gap: var(--s-3); max-width: 64ch; margin-top: var(--s-5); font-size: var(--t-small); line-height: 1.45; }
.try-note .icon { width: 1.125rem; height: 1.125rem; margin-top: .0625rem; color: var(--site-leaf); }


.try-stage { margin-top: var(--s-7); padding: var(--s-7); border-radius: var(--r-media); background: var(--site-stone); scroll-margin-top: calc(var(--header-h) + var(--s-4)); }
.try-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.try-steps li { display: flex; align-items: center; gap: var(--s-4); color: var(--site-ink); opacity: .45; transition: opacity var(--m-base) var(--ease); }
.try-step-number { display: grid; place-items: center; flex: 0 0 auto; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--site-paper); box-shadow: inset 0 0 0 1px var(--site-line); font-weight: 600; color: var(--site-leaf); transition: background var(--m-base) var(--ease), color var(--m-base) var(--ease), box-shadow var(--m-base) var(--ease); }
.try-step-title { font: 600 var(--t-h3)/1.3 var(--site-sans); letter-spacing: -.005em; }
.try-steps li[data-state] { opacity: 1; }
.try-steps li[data-state] .try-step-number { background: var(--site-leaf); color: var(--site-paper); box-shadow: none; }
.try-steps li[data-state="current"] .try-step-number { box-shadow: 0 0 0 .375rem rgb(24 76 58 / 10%); }

.try-idle { display: flex; align-items: center; justify-content: center; gap: var(--s-3); min-height: 12rem; margin-top: var(--s-6); border-radius: var(--r-card); background: rgb(255 255 255 / 55%); color: var(--site-muted); }
.try-idle .icon { width: 1.25rem; height: 1.25rem; rotate: -90deg; color: var(--site-leaf); }
.try-stage:not([data-step="idle"]) .try-idle { display: none; }

.try-board { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s-5); align-items: stretch; }
.try-stage:not([data-step="idle"]) .try-board { margin-top: var(--s-6); }
.try-col { display: grid; align-content: start; gap: var(--s-5); }
.try-email .pcard-body { text-wrap: pretty; }


.try-cases { padding: 0; overflow: hidden; }
.try-cases-head { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-4) var(--s-5); border-bottom: 1px solid var(--site-line); font-weight: 600; color: var(--site-ink); }
.try-cases-head img { width: 1.25rem; height: 1.25rem; }
.try-cases-count { margin-left: auto; font-size: var(--t-small); font-weight: 500; color: var(--site-muted); }
.try-cases ul { display: grid; padding: var(--s-2); }
.try-case { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--s-3); row-gap: .125rem; padding: var(--s-3) var(--s-4); border-radius: var(--r-card); transition: background var(--m-base) var(--ease); }
.try-case + .try-case { box-shadow: 0 -1px 0 var(--site-line); }
.try-case.is-target + .try-case { box-shadow: none; }
.try-case-name { font-weight: 600; color: var(--site-ink); }
.try-case-meta { font-size: var(--t-small); color: var(--site-muted); }
.try-case-status { grid-column: 1 / -1; display: flex; }
.try-case.is-target { background: var(--site-board-bg); }
.try-stage[data-step="3"] .try-case.is-target { background: var(--site-done-bg); }


.try-stage .st-filed, .try-stage .st-ready, .try-stage .st-sent { display: none; }
.try-stage:is([data-step="0"], [data-step="1"]) .st-filed { display: inline-flex; }
.try-stage[data-step="2"] .st-ready { display: inline-flex; }
.try-stage[data-step="3"] .st-sent { display: inline-flex; }


.try-reply { display: grid; }
.try-preparing { display: flex; align-items: center; justify-content: center; gap: var(--s-3); min-height: 14rem; color: var(--site-muted); }
.try-dots { display: inline-flex; gap: .25rem; }
.try-dots i { width: .375rem; height: .375rem; border-radius: 50%; background: var(--site-leaf); opacity: .3; }
@media (prefers-reduced-motion: no-preference) {
  .try-dots i { animation: try-dot 1.2s var(--ease) infinite; }
  .try-dots i:nth-child(2) { animation-delay: .2s; }
  .try-dots i:nth-child(3) { animation-delay: .4s; }
}
@keyframes try-dot { 40% { opacity: 1; } }
.try-reply-body { display: none; }
.try-stage:is([data-step="2"], [data-step="3"]) .try-preparing { display: none; }
.try-stage:is([data-step="2"], [data-step="3"]) .try-reply-body { display: grid; align-content: start; }
.try-reply-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: var(--s-4); row-gap: .125rem; padding-bottom: var(--s-4); border-bottom: 1px solid var(--site-line); }
.try-reply-case { font-size: var(--t-small); color: var(--site-muted); }
.try-reply-head .status { grid-area: 1 / 2; white-space: nowrap; }
.try-reply-to { grid-column: 1 / -1; font-weight: 600; color: var(--site-ink); }
.try-label { display: block; margin-top: var(--s-4); margin-bottom: var(--s-2); font-size: var(--t-small); color: var(--site-muted); }
.try-reply-text { display: grid; gap: var(--s-3); max-width: 64ch; }
.card .try-reply-text p { color: var(--site-ink); }
.try-reply-foot { display: grid; justify-items: end; margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--site-line); }
.try-approve, .try-sent { grid-area: 1 / 1; }

.try-approve { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 2.75rem; padding: .625rem 1.25rem; border: 0; border-radius: var(--r-pill); background: var(--site-blossom); color: var(--site-ink); font-weight: 640; font-size: var(--t-small); box-shadow: 0 .375rem 1rem rgb(147 66 96 / 25%); transition: transform var(--m-fast) var(--ease), box-shadow var(--m-fast) var(--ease); }
.try-approve:hover { transform: translateY(-1px); box-shadow: 0 .5rem 1.25rem rgb(147 66 96 / 32%); }
.try-approve .icon, .try-sent .icon { width: 1.125rem; height: 1.125rem; }
.try-stage[data-pressing] .try-approve { transform: scale(.96); box-shadow: 0 .125rem .25rem rgb(147 66 96 / 25%); }
.card .try-sent { display: none; align-items: center; gap: var(--s-2); min-height: 2.75rem; color: var(--site-done); font-weight: 600; }
.try-stage[data-step="3"] .try-approve { display: none; }
.try-stage[data-step="3"] .try-sent { display: inline-flex; }


.try-next { grid-column: 1 / -1; display: none; align-items: flex-start; gap: var(--s-4); }
.try-next:focus { outline: none; }
.try-next > div { display: grid; gap: var(--s-1); }
.card .try-next-text { max-width: 64ch; color: var(--site-ink); }
.try-stage[data-step="3"] .try-next { display: flex; }


@media (prefers-reduced-motion: no-preference) {
  .try-email, .try-cases, .try-reply { transition: opacity var(--m-base) var(--ease), transform var(--m-base) var(--ease); }
  .try-stage[data-step="0"] :is(.try-email, .try-cases, .try-reply) { opacity: 0; transform: translateY(12px); transition: none; }
  .try-stage[data-step="1"] .try-cases { transition-delay: 500ms; }
  .try-stage[data-step="1"] .try-reply { transition-delay: 1000ms; }
  .try-stage[data-step="1"] .try-case.is-target { animation: try-file var(--m-base) var(--ease) 700ms both; }
  .try-stage[data-step="2"] .try-reply-body { animation: try-rise var(--m-base) var(--ease) both; }
  .try-stage[data-step="3"] .try-next { animation: try-rise var(--m-base) var(--ease) 250ms both; }
}
@keyframes try-rise { from { opacity: 0; transform: translateY(12px); } }
@keyframes try-file { from { opacity: 0; transform: translateY(-12px); } }


.try-controls { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-5); }
.try-controls[hidden] { display: none; }
.try-control { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 2.75rem; padding: .375rem 1rem; border: 1px solid var(--site-line); border-radius: var(--r-pill); background: var(--site-paper); font-size: var(--t-small); font-weight: 600; color: var(--site-ink); transition: border-color var(--m-fast) var(--ease); }
.try-control:hover { border-color: var(--site-muted); }
.try-control svg { width: 1rem; height: 1rem; }

@media (max-width: 64em) {
  .try-picker { grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
  .try-pick { grid-template-rows: none; gap: var(--s-2); }
  
  .try-pick-mark { display: none; }
  .try-pick[aria-pressed="true"] .try-pick-mark { display: inline-flex; }
  .try-pick-subject { margin-top: var(--s-1); }
}
@media (max-width: 56em) {
  .try-board { grid-template-columns: minmax(0, 1fr); }
  .try-preparing { min-height: 8rem; }
}
@media (max-width: 40em) {
  .try-stage { padding: var(--s-5) var(--s-4); }
  .try-steps { grid-template-columns: minmax(0, 1fr); gap: var(--s-3); }
  .try-step-number { width: 2rem; height: 2rem; font-size: var(--t-small); }
  .try-idle { min-height: 8rem; padding: var(--s-4); text-align: center; }
  .try-reply-foot { justify-items: stretch; }
  .try-approve { justify-content: center; }
  .try-next { flex-direction: column; gap: var(--s-3); }
}