123.stk-shell {4 flex: 1;5 min-height: 0;6 position: relative;7 overflow: hidden;8 padding: 10px 12px 10px;9 background: var(--peach-bg);10}1112.stk-mast {13 display: flex;14 align-items: center;15 justify-content: space-between;16 gap: 10px;17 padding: 0 0 8px;18}1920.stk-back {21 width: 28px;22 height: 28px;23 display: inline-flex;24 align-items: center;25 justify-content: center;26 flex: 0 0 auto;27 border: 1px solid var(--peach-border);28 border-radius: 999px;29 background: color-mix(in srgb, var(--peach-t0) 4%, transparent);30 color: var(--peach-t1);31 cursor: pointer;32}3334.stk-back:hover {35 color: var(--peach-t0);36 border-color: color-mix(in srgb, var(--peach-accent) 34%, transparent);37 background: color-mix(in srgb, var(--peach-accent) 10%, transparent);38}3940.stk-mast-title {41 flex: 1;42 font-family: var(--font-display);43 font-style: italic;44 font-weight: 400;45 font-size: 22px;46 line-height: 1;47 color: var(--peach-t0);48}4950.stk-mast-meta {51 font-family: var(--font-mono);52 font-size: 9px;53 letter-spacing: 0.22em;54 text-transform: uppercase;55 color: var(--peach-t2);56}5758.stk-deck {59 position: relative;60 height: min(462px, calc(100% - 36px));61 min-height: 462px;62 margin-top: 0;63 overflow: hidden;64}6566.stk-deck.is-focused {67 overflow: visible;68}6970.stk-card {71 position: absolute;72 left: 0;73 right: 0;74 border-radius: var(--stack-card-radius);75 padding: 18px 18px 16px;76 overflow: hidden;77 cursor: pointer;78 transition:79 transform 380ms var(--stack-spring),80 height 380ms var(--stack-spring),81 box-shadow 280ms ease,82 opacity 220ms ease;83 box-shadow:84 0 1px 0 color-mix(in srgb, var(--peach-t0) 5%, transparent) inset,85 0 8px 20px rgba(0, 0, 0, 0.25);86 border: 1px solid color-mix(in srgb, var(--peach-t0) 6%, transparent);87 will-change: transform;88}8990.stk-card::after {91 content: "";92 position: absolute;93 inset: 0;94 border-radius: inherit;95 pointer-events: none;96 background:97 radial-gradient(98 120% 80% at 0% 0%,99 color-mix(in srgb, #fff 12%, transparent),100 transparent 50%101 );102}103104.stk-card.is-active {105 box-shadow:106 0 1px 0 color-mix(in srgb, var(--peach-t0) 8%, transparent) inset,107 0 18px 36px rgba(0, 0, 0, 0.42);108 cursor: default;109}110111.stk-card.is-focused {112 cursor: default;113}114115.stk-card.is-tab:hover {116 transform: translateY(calc(var(--stk-card-top) - 7px));117 box-shadow:118 0 1px 0 color-mix(in srgb, var(--peach-t0) 7%, transparent) inset,119 0 16px 32px rgba(0, 0, 0, 0.42),120 0 0 28px color-mix(in srgb, currentColor 28%, transparent);121 transition:122 transform 90ms ease-out,123 box-shadow 90ms ease-out;124}125126.stk-card.is-concealed {127 opacity: 0;128 pointer-events: none;129}130131.stk-card-top {132 display: flex;133 justify-content: space-between;134 align-items: center;135 margin-bottom: 12px;136 position: relative;137 z-index: 1;138}139140.stk-card-num {141 font-family: var(--font-mono);142 font-size: 8.5px;143 letter-spacing: 0.26em;144 text-transform: uppercase;145 opacity: 0.7;146}147148.stk-card-icon {149 opacity: 0.85;150}151152.stk-card-title {153 position: relative;154 z-index: 1;155 margin: 6px 0 0;156 font-family: var(--font-display);157 font-style: italic;158 font-weight: 400;159 font-size: 26px;160 line-height: 1.2;161}162163.stk-card-lede {164 position: relative;165 z-index: 1;166 margin: 4px 0 0;167 font-family: var(--font-display);168 font-style: italic;169 font-size: 12.5px;170 line-height: 1.4;171 opacity: 0.72;172}173174.stk-card-body {175 position: relative;176 z-index: 1;177 height: calc(100% - 76px);178 margin-top: 14px;179 overflow-y: auto;180 overflow-x: hidden;181 opacity: 0;182 scrollbar-width: thin;183 scrollbar-color: color-mix(in srgb, currentColor 28%, transparent) transparent;184 transition: opacity 200ms 100ms ease;185}186187.stk-card.is-active .stk-card-body {188 opacity: 1;189}190191.stk-card.is-tab .stk-card-top {192 display: none;193}194195.stk-card.is-tab {196 padding: 10px 16px 8px;197}198199.stk-card.is-tab .stk-card-title {200 font-size: 19px;201 line-height: 1;202 white-space: nowrap;203 overflow: hidden;204 text-overflow: ellipsis;205}206207.stk-card.is-tab .stk-card-lede,208.stk-card.is-tab .stk-card-body {209 display: none;210}211212.stk-card *:focus-visible {213 outline: 1px solid currentColor;214 outline-offset: 2px;215}216217.stk-tray-handle {218 position: absolute;219 left: 50%;220 bottom: 8px;221 z-index: 120;222 transform: translateX(-50%);223 height: 30px;224 min-width: 112px;225 display: inline-flex;226 align-items: center;227 justify-content: center;228 border: 1px solid color-mix(in srgb, var(--peach-accent) 32%, transparent);229 border-radius: 999px;230 background:231 linear-gradient(180deg, color-mix(in srgb, var(--peach-bg) 88%, transparent), color-mix(in srgb, var(--peach-bg) 72%, transparent)),232 color-mix(in srgb, var(--peach-accent) 10%, transparent);233 color: var(--peach-t1);234 font-family: var(--font-mono);235 font-size: 9px;236 letter-spacing: 0.2em;237 text-transform: uppercase;238 box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);239 cursor: pointer;240}241242.stk-tray-handle::before {243 content: "";244 position: absolute;245 top: 5px;246 width: 26px;247 height: 2px;248 border-radius: 999px;249 background: color-mix(in srgb, currentColor 45%, transparent);250}251252.stk-tray-handle span {253 transform: translateY(4px);254}255256.stk-row {257 display: flex;258 align-items: center;259 justify-content: space-between;260 gap: 12px;261 padding: 10px 0;262 border-bottom: 1px solid color-mix(in srgb, currentColor 12%, transparent);263}264265.stk-row:last-child {266 border-bottom: none;267}268269.stk-row-name {270 font-size: 13px;271}272273.stk-row-sub {274 margin-top: 2px;275 font-family: var(--font-display);276 font-style: italic;277 font-size: 11px;278 opacity: 0.7;279}280281.stk-pill {282 display: inline-flex;283 align-items: center;284 justify-content: center;285 min-height: 24px;286 padding: 3px 10px;287 font-family: var(--font-mono);288 font-size: 10px;289 letter-spacing: 0.08em;290 text-transform: lowercase;291 background: transparent;292 color: currentColor;293 border: 1px solid color-mix(in srgb, currentColor 35%, transparent);294 border-radius: 999px;295 cursor: pointer;296 transition: background 140ms ease, border-color 140ms ease;297}298299.stk-pill:hover,300.stk-pill.is-accent {301 background: color-mix(in srgb, currentColor 18%, transparent);302 border-color: color-mix(in srgb, currentColor 55%, transparent);303}304305.stk-pip {306 display: inline-block;307 width: 18px;308 height: 18px;309 border-radius: 50%;310 background: rgba(0, 0, 0, 0.18);311 border: 1px solid color-mix(in srgb, currentColor 24%, transparent);312}313314.stk-pip.is-on {315 background: var(--peach-health-ok);316 box-shadow: 0 0 6px color-mix(in srgb, var(--peach-health-ok) 55%, transparent);317}318319.stk-sync-actions,320.stk-fb-chips,321.stk-inline-actions {322 display: flex;323 flex-wrap: wrap;324 gap: 6px;325}326327.stk-key {328 font-family: var(--font-mono);329 font-size: 10px;330 letter-spacing: 0.06em;331 padding: 2px 7px;332 border: 1px solid color-mix(in srgb, currentColor 32%, transparent);333 border-radius: 4px;334 background: color-mix(in srgb, currentColor 6%, transparent);335}336337.stk-pro-headline {338 padding: 6px 0 14px;339 border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent);340}341342.stk-pro-title,343.stk-pro-price {344 font-family: var(--font-display);345 font-style: italic;346 line-height: 1;347}348349.stk-pro-title {350 font-size: 22px;351}352353.stk-pro-price {354 font-size: 28px;355}356357.stk-pro-meta {358 margin-top: 4px;359 font-family: var(--font-mono);360 font-size: 9.5px;361 letter-spacing: 0.18em;362 text-transform: uppercase;363 opacity: 0.7;364}365366.stk-card .peach-settings-body {367 display: block;368 flex: none;369 min-height: 0;370 overflow: visible;371 padding: 0;372 background: transparent;373}374375.stk-card .peach-settings-group {376 margin: 0;377 padding: 0;378 border: 0;379 border-radius: 0;380 background: transparent;381 box-shadow: none;382 backdrop-filter: none;383 -webkit-backdrop-filter: none;384}385386.stk-card .peach-settings-group + .peach-settings-group {387 margin-top: 0;388}389390.stk-card .peach-settings-sub-label,391.stk-card .peach-settings-label {392 margin: 12px 0 4px;393 color: color-mix(in srgb, currentColor 58%, transparent);394}395396.stk-card .peach-settings-sub-label:first-child,397.stk-card .peach-settings-label:first-child {398 margin-top: 0;399}400401.stk-card .peach-settings-row,402.stk-card .peach-shortcut-row,403.stk-card .peach-history-row {404 border-bottom: 1px solid color-mix(in srgb, currentColor 12%, transparent);405 color: currentColor;406}407408.stk-card .peach-settings-row--meta,409.stk-card .peach-settings-value,410.stk-card .peach-hint,411.stk-card .peach-settings-hint,412.stk-card .peach-feedback-meta,413.stk-card .peach-feedback-anon,414.stk-card .peach-feedback-intro,415.stk-card .peach-history-sub,416.stk-card .peach-history-footer,417.stk-card .peach-danger-card-copy {418 color: color-mix(in srgb, currentColor 70%, transparent);419}420421.stk-card .peach-toggle {422 --peach-accent: currentColor;423 border-color: color-mix(in srgb, currentColor 32%, transparent);424 background: color-mix(in srgb, currentColor 8%, transparent);425}426427.stk-card .peach-toggle.is-on {428 background: color-mix(in srgb, currentColor 28%, transparent);429 border-color: color-mix(in srgb, currentColor 50%, transparent);430}431432.stk-card .peach-toggle-knob {433 background: color-mix(in srgb, currentColor 58%, transparent);434}435436.stk-card .peach-toggle.is-on .peach-toggle-knob {437 background: currentColor;438}439440.stk-card .peach-btn--subtle,441.stk-card .peach-btn--ghost,442.stk-card .peach-btn--accent,443.stk-card .peach-shortcut-chip,444.stk-card .peach-shortcut-reset,445.stk-card .peach-feedback-chip,446.stk-card .peach-settings-license-copy,447.stk-card .peach-settings-license-toggle {448 color: currentColor;449 border-color: color-mix(in srgb, currentColor 28%, transparent);450 background: color-mix(in srgb, currentColor 8%, transparent);451}452453.stk-card .peach-btn--subtle:hover,454.stk-card .peach-btn--ghost:hover,455.stk-card .peach-btn--accent:hover,456.stk-card .peach-shortcut-chip:hover,457.stk-card .peach-feedback-chip:hover,458.stk-card .peach-feedback-chip.is-active {459 background: color-mix(in srgb, currentColor 16%, transparent);460}461462.stk-card .peach-settings-input,463.stk-card .peach-settings-select,464.stk-card .peach-pro-key-inline-input,465.stk-card .peach-feedback-textarea {466 color: currentColor;467 border-color: color-mix(in srgb, currentColor 22%, transparent);468 background: rgba(0, 0, 0, 0.18);469}470471.stk-card .peach-settings-input::placeholder,472.stk-card .peach-pro-key-inline-input::placeholder,473.stk-card .peach-feedback-textarea::placeholder {474 color: color-mix(in srgb, currentColor 42%, transparent);475}476477.stk-card .peach-accent-picker {478 justify-content: flex-end;479 max-width: 160px;480}481482.stk-card .peach-accent-swatch {483 width: 20px;484 height: 20px;485}486487.stk-card .peach-accent-swatch.is-active {488 border-color: currentColor;489}490491.stk-card .peach-history-list {492 border-color: color-mix(in srgb, currentColor 18%, transparent);493}494495.stk-card .peach-danger-card {496 background: rgba(0, 0, 0, 0.18);497 border-color: color-mix(in srgb, currentColor 20%, transparent);498}499500.stk-card .peach-pro-upgrade,501.stk-card .peach-pro-active,502.stk-card .peach-pro-active-hero,503.stk-card .peach-pro-grid-item {504 background: transparent;505 border-color: color-mix(in srgb, currentColor 14%, transparent);506 box-shadow: none;507}508509.stk-card .peach-pro-grid {510 gap: 6px;511}512513.stk-card .peach-pro-grid-item {514 padding: 7px 0;515}516517.stk-card .peach-pro-headline,518.stk-card .peach-pro-active-title {519 color: currentColor;520}521522.stk-card .peach-feedback-textarea {523 min-height: 116px;524}525526.light .stk-shell,527[data-theme="light"] .stk-shell {528 background: var(--peach-bg);529}530531.light .stk-card,532[data-theme="light"] .stk-card {533 box-shadow:534 0 1px 0 color-mix(in srgb, var(--peach-t0) 5%, transparent) inset,535 0 8px 20px rgba(78, 56, 36, 0.18);536}537538.light .stk-card.is-active,539[data-theme="light"] .stk-card.is-active {540 box-shadow:541 0 1px 0 color-mix(in srgb, var(--peach-t0) 8%, transparent) inset,542 0 18px 36px rgba(78, 56, 36, 0.35);543}544545:root[data-native="true"] {546 --stack-tab-h: 64px;547 --stack-tab-overlap: 16px;548}549550:root[data-native="true"] .stk-deck {551 height: calc(100dvh - 126px);552 min-height: 520px;553}554555[data-motion="reduce"] .stk-card,556[data-motion="reduce"] .stk-card-body {557 transition: none !important;558}