/* Scoped, framework-independent reference components. Import tokens.css first. */
.tw-scope { color: var(--tw-ink); background: var(--tw-paper);
  font: 400 var(--tw-font-body)/var(--tw-leading-body) var(--tw-body);
  font-synthesis: none; -webkit-font-smoothing: antialiased; }
.tw-scope *, .tw-scope *::before, .tw-scope *::after { box-sizing: border-box; }
.tw-scope button, .tw-scope input, .tw-scope textarea, .tw-scope select { font: inherit; }
.tw-scope a { color: inherit; text-underline-offset: 3px; }
.tw-scope :is(a, button, input, textarea, select, summary):focus-visible {
  outline: 2px solid var(--tw-focus); outline-offset: 5px; }
.tw-scope ::selection { color: var(--tw-paper); background: var(--tw-ink); }
.tw-shell { width: min(100%, var(--tw-max-width)); margin-inline: auto; padding-inline: var(--tw-gutter); }
.tw-heading { margin: 0; font: 400 var(--tw-type-section)/1.3 var(--tw-body); }
.tw-heading strong, .tw-card h3 { font-family: var(--tw-display); font-weight: 700; }
.tw-hero-heading { font-size: var(--tw-type-hero); line-height: 1.4634; letter-spacing: -.35px; }
.tw-button { display: inline-flex; align-items: center; justify-content: center;
  gap: 12px; min-height: var(--tw-control-height); min-width: 44px;
  padding: var(--tw-control-padding); border: 0; border-radius: var(--tw-radius-control);
  background: var(--tw-ink); color: var(--tw-paper) !important; box-shadow: var(--tw-shadow);
  text-decoration: none; cursor: pointer; line-height: 1.5;
  transition: transform var(--tw-duration), background var(--tw-duration); }
.tw-button:hover:not(:disabled):not([aria-disabled='true']) { transform: translateY(var(--tw-hover-lift)); }
.tw-button:not(.tw-button--secondary):not(.tw-button--outline):hover:not(:disabled):not([aria-disabled='true']) { background: var(--tw-hover); }
.tw-button:active:not(:disabled) { transform: translateY(0); }
.tw-button--secondary { background: var(--tw-paper); color: var(--tw-ink) !important; }
.tw-button--secondary:hover:not(:disabled):not([aria-disabled='true']) { background: #ffffff35; }
.tw-button--outline { background: transparent; color: var(--tw-ink) !important; border: 1px solid var(--tw-line); box-shadow: none; }
.tw-button--outline:hover:not(:disabled):not([aria-disabled='true']) { background: #ffffff35; }
.tw-button:disabled, .tw-button[aria-disabled='true'] { opacity: .65; cursor: not-allowed; transform: none; }
.tw-button[aria-busy='true'] { cursor: wait; }
.tw-button[aria-busy='true']::before { content: ''; width: 16px; height: 16px;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
  animation: tw-spin .8s linear infinite; }
.tw-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: underline; }
.tw-field { display: grid; gap: 8px; }
.tw-field label { font-size: 14px; line-height: 1.5; }
.tw-input { width: 100%; min-height: var(--tw-control-height); padding: 17px 25px;
  border: 1px solid transparent; border-radius: var(--tw-radius-control);
  box-shadow: var(--tw-shadow); background: var(--tw-paper); color: var(--tw-ink); }
textarea.tw-input { min-height: 184px; padding-top: 28px; line-height: 26px; resize: vertical; }
.tw-input::placeholder { color: var(--tw-placeholder); opacity: 1; }
.tw-input[aria-invalid='true'] { border-color: var(--tw-danger); }
.tw-help { margin: 0; color: var(--tw-muted); font-size: 14px; line-height: 1.5; }
.tw-error { color: var(--tw-danger); }
.tw-check { display: flex; align-items: center; gap: 12px; min-height: 44px; }
.tw-check input { width: 20px; height: 20px; accent-color: var(--tw-ink); }
.tw-card { overflow: hidden; border-radius: var(--tw-radius-card); box-shadow: var(--tw-shadow); }
.tw-card img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; }
.tw-card__body { padding: 10px 24px 32px; }
.tw-card h3 { margin: 0 0 14px; font-size: var(--tw-type-card); line-height: 1.3; }
.tw-card p { margin: 0; }
.tw-accordion { border-radius: var(--tw-radius-control); box-shadow: var(--tw-shadow); }
.tw-accordion summary { display: flex; align-items: center; justify-content: space-between;
  gap: 16px; min-height: 82px; padding: 20px 25px; cursor: pointer;
  border-radius: inherit; font: 700 23px/1.3 var(--tw-display); list-style: none; }
.tw-accordion summary::-webkit-details-marker { display: none; }
.tw-accordion summary::after { content: '+'; font: 400 24px var(--tw-body); }
.tw-accordion[open] summary::after { content: '-'; }
.tw-accordion p { margin: 0; padding: 0 25px 25px; }
.tw-alert { display: flex; align-items: start; gap: 12px; padding: 16px 20px;
  border-radius: var(--tw-radius-control); color: var(--tw-success); background: var(--tw-success-soft); }
.tw-alert--error { color: var(--tw-danger); background: var(--tw-danger-soft); }
[data-tw-theme='product'] .tw-button--secondary { background: var(--tw-accent-soft); color: var(--tw-accent-strong) !important; border: 1px solid #c7d7c6; }
[data-tw-theme='product'] .tw-button--secondary:hover:not(:disabled):not([aria-disabled='true']) {
  background: var(--tw-accent-strong); color: var(--tw-paper) !important; border-color: var(--tw-accent-strong); }
[data-tw-theme='product'] .tw-input { background: var(--tw-white); border-color: var(--tw-line); }
[data-tw-theme='product'] .tw-card { background: var(--tw-surface); border: 1px solid var(--tw-line); }
@keyframes tw-spin { to { transform: rotate(360deg); } }
@media (max-width: 600px) {
  .tw-input { padding-inline: 18px; }
  .tw-accordion summary { min-height: 72px; font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .tw-scope *, .tw-scope *::before, .tw-scope *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
