@font-face { font-family: Nunito; src: url('assets/nunito.ttf') format('truetype'); font-weight: 200 1000; font-display: swap; }
@font-face { font-family: Rounded; src: url('assets/rounded.ttf') format('truetype'); font-weight: 700; font-display: swap; }
:root {
  color-scheme: dark;
  --background: #060708;
  --surface: #0b1621;
  --raised: #0b1d2c;
  --text: #f7f8fa;
  --secondary: #9caaba;
  --blue: #3390ec;
  --border: rgba(111,143,170,.16);
  --ease-out: cubic-bezier(.23,1,.32,1);
  --ease-drawer: cubic-bezier(.32,.72,0,1);
  font: 100%/1.5 Nunito, system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--background); color: var(--text); -webkit-font-smoothing: antialiased; }
body.modal-open { overflow: hidden; }
button, input { font: inherit; }
button, a { touch-action: manipulation; }
button { cursor: pointer; user-select: none; -webkit-user-select: none; }
button:disabled { cursor: wait; opacity: .55; }
a { color: inherit; text-decoration: none; }
h1, h2, p { margin: 0; }
h1, h2 { text-wrap: balance; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid #7fc0ff; outline-offset: 4px; }
[hidden] { display: none !important; }
.shop { width: min(100%, 660px); margin-inline: auto; padding: calc(24px + env(safe-area-inset-top,0px)) max(22px,env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left)); }
.header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.wordmark { font-size: 25px; font-weight: 900; letter-spacing: -.9px; }
.wordmark span { color: var(--blue); }
.support-button { display: flex; align-items: center; gap: 7px; background: #0d1218; color: var(--secondary); border: 1px solid var(--border); border-radius: 100px; padding: 10px 13px; font-size: 12px; font-weight: 700; min-height: 42px; }
svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.intro { text-align: center; padding: 17px 0 34px; }
.logo-scene { position: relative; width: 220px; height: 153px; margin: 0 auto 8px; display: grid; place-items: center; }
.logo-halo { position: absolute; inset: 2px; background: radial-gradient(ellipse,#3390ec24,transparent 65%); animation: halo-arrive 1000ms var(--ease-out) both; }
.logo-orbit { position: absolute; width: 132px; height: 132px; border: 1px solid #3390ec26; border-top-color: #3390ec65; border-right-color: #3390ec40; border-radius: 50%; animation: orbit-turn 16s linear infinite; }
.logo-orbit::after { content: ''; position: absolute; top: 14px; right: 14px; width: 4px; height: 4px; border-radius: 50%; background: #71b8fa; box-shadow: 0 0 7px #3390ec66; }
.logo-object { position: relative; width: 90px; height: 90px; transform: perspective(450px) rotateY(0deg) rotate(-10deg); filter: drop-shadow(0 12px 20px #0008); animation: logo-arrive 1000ms var(--ease-out) both; }
.logo-object img { display: block; width: 100%; height: 100%; }
.logo-rotor { position: relative; width: 100%; height: 100%; animation: logo-sway 6s cubic-bezier(.77,0,.175,1) 1s infinite; }
.page-hidden .logo-rotor,.page-hidden .logo-orbit,.page-hidden .particle { animation-play-state: paused; }
.round-button svg,.buy svg,.primary svg { width: 18px; height: 18px; stroke-width: 2; }
.particle { position: absolute; width: 7px; height: 7px; background: #71b8fa; clip-path: polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%); animation: star-twinkle 3.2s ease-in-out infinite; }
.p2 { animation-delay: -1.2s; }.p3 { animation-delay: -2.1s; }
.p1 { top: 42px; left: 32px; }.p2 { right: 23px; top: 93px; opacity: .55; }.p3 { bottom: 19px; left: 67px; opacity: .3; }
.intro h1 { font-family: Rounded,Nunito,sans-serif; font-size: clamp(1.6rem,4.8vw,2rem); font-weight: 700; line-height: 1.2; letter-spacing: -.025em; }
.intro>p { max-width: 450px; margin: 12px auto 0; font-size: .9rem; line-height: 1.7; color: var(--secondary); }
.delivery-note { display: inline-flex; align-items: center; gap: 5px; font-size: .68rem; color: #8497a9; margin-top: 17px; }
.delivery-note svg { width: 13px; height: 13px; color: var(--blue); }
.delivery-note img { flex-shrink: 0; }
.intro h1 { animation: copy-arrive 450ms 120ms var(--ease-out) both; }
.intro>p { animation: copy-arrive 450ms 170ms var(--ease-out) both; }
.delivery-note { animation: copy-arrive 450ms 220ms var(--ease-out) both; }
.catalog-header { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 15px; }
.sale-banner { display: flex; align-items: center; gap: 13px; padding: 17px 18px; margin-bottom: 25px; border: 1px solid #3390ec35; border-radius: 19px; background: linear-gradient(110deg,#0b1d2c,#0b1621); }
.sale-icon { flex-shrink: 0; width: 39px; height: 39px; display: grid; place-items: center; border-radius: 13px; background: #3390ec1a; color: #71b9ff; font-size: 23px; font-weight: 850; }
.sale-banner>div { min-width: 0; flex: 1; }.sale-banner strong { font-size: 1rem; font-weight: 850; }.sale-banner p { color: var(--secondary); font-size: .72rem; margin-top: 3px; }
.sale-label { font-size: .62rem; color: #71b9ff; padding: 5px 9px; background: #3390ec12; border-radius: 100px; }
@media(max-width:420px) { .sale-label { display: none; } }
.catalog-header h2 { font-size: 1rem; font-weight: 800; }
.catalog-header>span { color: #82909e; font-size: .66rem; }
.segmented { display: flex; position: relative; gap: 4px; padding: 4px; background: #0c121a; border: 1px solid #ffffff05; border-radius: 15px; margin-bottom: 14px; }
.segmented button { position: relative; min-width: 0; flex: 1 1 0; min-height: 42px; padding: 9px 12px; border: 0; border-radius: 11px; background: transparent; color: var(--secondary); font-size: .83rem; font-weight: 750; overflow-wrap: anywhere; z-index: 1; }
.segmented button[aria-pressed=true] { color: #80bfff; }
.tab-indicator { position: absolute; left: 4px; top: 4px; bottom: 4px; border-radius: 11px; background: #3390ec1a; border: 1px solid #3390ec20; pointer-events: none; transition: transform 200ms var(--ease-out); }
.products { display: grid; gap: 12px; }
.product { position: relative; min-width: 0; padding: 22px; background: var(--surface); border: 1px solid var(--border); border-radius: 22px; }
.product.featured { background: linear-gradient(120deg,#0b1d2c,var(--surface)); border-color: #3390ec55; }
.product-top { display: flex; gap: 18px; align-items: flex-start; }
.product-copy { min-width: 0; flex: 1; }
.product-title { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.product h2 { font-size: 1.2rem; font-weight: 850; line-height: 1.3; letter-spacing: -.02em; overflow-wrap: anywhere; }
.badge { color: #71b9ff; font-size: .6rem; font-weight: 800; padding: 3px 8px; border-radius: 100px; background: #3390ec16; max-width: 100%; overflow-wrap: anywhere; }
.subtitle { font-size: .79rem; color: var(--secondary); margin-top: 5px; overflow-wrap: anywhere; }
.volume { display: inline-flex; align-items: center; gap: 5px; color: #c8d8e8; font-size: .82rem; font-weight: 800; padding-top: 2px; max-width: 100%; overflow-wrap: anywhere; }
.volume img { flex-shrink: 0; }
.features { list-style: none; padding: 0; margin: 18px 0 20px; display: grid; gap: 7px; }
.features li { display: flex; align-items: flex-start; gap: 8px; color: #b6c4d2; font-size: .8rem; overflow-wrap: anywhere; }
.features img { flex-shrink: 0; margin-top: 2px; }
.card-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding-top: 16px; border-top: 1px solid #8ca5bd12; }
.price-wrap { min-width: 0; flex: 1 1 145px; }
.price { font-size: 1.5rem; line-height: 1.25; font-weight: 850; letter-spacing: -.03em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.old-price { color: var(--secondary); font-size: .7rem; text-decoration: line-through; display: block; }
.price-hint { font-size: .62rem; color: #82909e; margin-top: 3px; }
.buy { padding: 12px 21px; border: 1px solid #79beff30; border-radius: 13px; color: #fff; background: var(--blue); min-height: 46px; font-size: .82rem; font-weight: 800; display: flex; align-items: center; gap: 19px; flex-shrink: 0; box-shadow: inset 0 1px 0 #ffffff22; }
.buy span { font-size: 17px; }
.primary { width: 100%; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 15px 20px; min-height: 52px; border: 1px solid #79beff30; border-radius: 15px; color: #fff; background: var(--blue); font-weight: 800; font-size: .92rem; box-shadow: inset 0 1px 0 #ffffff22; }
button { transition: transform 160ms var(--ease-out); }
button:active:not(:disabled) { transform: scale(.97); transition-duration: 100ms; }
.trial { display: flex; align-items: center; gap: 14px; border: 1px dashed #253340; background: #0a1016; padding: 18px; border-radius: 20px; margin-top: 17px; }
.trial-info { flex-shrink: 0; }
.trial-guide { display: block; padding: 22px; border-style: solid; border-color: var(--border); background: var(--surface); border-radius: 22px; margin-top: 24px; }
.trial-guide h2 { font-size: 1.15rem; font-weight: 850; letter-spacing: -.02em; }.trial-guide .trial-lead { margin-top: 12px; font-size: .79rem; line-height: 1.75; color: var(--secondary); }
.trial-steps { list-style: none; counter-reset: trial; display: grid; gap: 18px; padding: 0; margin: 24px 0 0; }.trial-steps>li { counter-increment: trial; display: flex; align-items: flex-start; gap: 12px; font-size: .79rem; line-height: 1.75; color: #b6c4d2; }.trial-steps>li::before { content: counter(trial); display: grid; place-items: center; width: 25px; height: 25px; flex-shrink: 0; border: 1px solid #3390ec25; border-radius: 9px; color: #80bfff; background: #3390ec12; font-size: .69rem; font-weight: 850; margin-top: 2px; }.trial-steps>li>div { min-width: 0; }
.copy-chip { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 5px 9px; border: 1px solid #3390ec30; border-radius: 9px; color: #a2d2ff; background: #3390ec0d; font-size: .76rem; font-weight: 750; vertical-align: baseline; overflow-wrap: anywhere; }.copy-chip svg { width: 13px; height: 13px; }.copy-chip[data-copied] { border-color: #7bdfb250; color: #7bdfb2; }.trial-replies { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }.trial-replies .copy-chip { min-height: 36px; }
.trial-download { display: inline-flex; align-items: center; gap: 4px; color: #80bfff; text-decoration: underline; text-underline-offset: 3px; }.trial-download svg { width: 14px; height: 14px; }.trial-guide .trial-copy-status { color: #829eb9; font-size: .68rem; min-height: 22px; margin: 17px 0 12px; }.trial-guide .trial-support-note { color: var(--secondary); font-size: .68rem; line-height: 1.65; margin-top: 13px; }
@media(max-width:540px) { .trial.trial-guide { padding: 18px; }.trial-steps { gap: 16px; }.trial-steps>li { gap: 10px; } }
@media(hover:hover) and (pointer:fine) { .copy-chip:hover { border-color: #3390ec65; }.trial-download:hover { color: #b5dcff; } }
.trial-copy { min-width: 0; flex: 1; }.trial h2 { font-size: .85rem; font-weight: 800; }.trial p { font-size: .7rem; color: var(--secondary); margin-top: 4px; }
.round-button { width: 40px; min-height: 40px; padding: 0; border: 1px solid var(--border); border-radius: 50%; display: grid; place-items: center; background: #121b25; color: #a8bdd0; font-size: 20px; flex-shrink: 0; }
footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 7px; margin-top: 27px; padding: 0 3px; font-size: .63rem; color: #768494; }
dialog { color: var(--text); background: #0b0d0f; border: 1px solid #ffffff12; border-radius: 28px; padding: 24px; width: min(440px,calc(100% - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 25px 80px #0008,inset 0 1px 0 #ffffff08; opacity: 0; transform: scale(.96); transition: opacity 220ms var(--ease-out),transform 250ms var(--ease-out); transform-origin: center; }
dialog.is-visible { opacity: 1; transform: scale(1); }dialog.is-closing { transition-duration: 160ms; }
dialog::backdrop { background: #060708aa; backdrop-filter: blur(8px); }
.sheet-grip { display: none; }
.sheet-header { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.sheet-header>span { font-size: .7rem; color: #82909e; }.close { margin-left: auto; }
.selected-product { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 7px 15px; border-radius: 13px; padding: 12px 15px; background: #0b1621; margin-bottom: 22px; font-size: .8rem; font-weight: 800; }
.selected-product span { min-width: 0; overflow-wrap: anywhere; }.selected-product strong { font-variant-numeric: tabular-nums; overflow-wrap: anywhere; color: #78baff; }
dialog h2 { font-size: 1.35rem; line-height: 1.25; font-weight: 850; letter-spacing: -.02em; overflow-wrap: anywhere; }
.sheet-description { color: var(--secondary); font-size: .82rem; margin-top: 8px; margin-bottom: 23px; }
fieldset { padding: 0; margin: 0 0 20px; border: 0; min-width: 0; display: grid; gap: 10px; }
.payment { position: relative; display: flex; align-items: center; gap: 13px; padding: 15px; border: 1px solid #ffffff0d; border-radius: 17px; background: #11161d; cursor: pointer; touch-action: manipulation; }
.payment:has(input:checked) { border-color: #3390ec70; background: #0b1d2c; }
.payment:focus-within { outline: 2px solid #7fc0ff; outline-offset: 3px; }
.payment input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.payment-icon { display: block; width: 42px; height: 42px; flex-shrink: 0; object-fit: contain; }.crypto { border-radius: 50%; }.stars { border-radius: 0; }
.payment-copy { min-width: 0; flex: 1; }.payment-copy strong { font-size: .9rem; }.payment-copy small { display: block; color: var(--secondary); font-size: .7rem; margin-top: 2px; }
.payment-name { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 7px; }.commission-badge { padding: 2px 6px; border-radius: 7px; border: 1px solid #3390ec25; background: #3390ec0d; color: #80bfff; font-size: .59rem; font-weight: 800; white-space: nowrap; }.payment-breakdown { color: var(--secondary); font-size: .72rem; line-height: 1.6; margin: -10px 0 18px; }.payment-breakdown:empty { display: none; }
.radio-dot { width: 20px; height: 20px; border: 2px solid #3d4b5a; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center; }.radio-dot::after { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--blue); opacity: 0; transform: scale(.5); transition: opacity 160ms var(--ease-out),transform 160ms var(--ease-out); }.payment input:checked~.radio-dot { border-color: var(--blue); }.payment input:checked~.radio-dot::after { opacity: 1; transform: scale(1); }
.field-label { font-size: .8rem; font-weight: 750; }
.input-wrap { display: flex; align-items: center; gap: 8px; border: 1px solid #253441; background: #0b1621; border-radius: 14px; margin-top: 9px; padding-left: 16px; }.input-wrap:focus-within { border-color: var(--blue); }.input-wrap>span { color: #609ad0; }
input[type=text] { min-width: 0; width: 100%; padding: 15px 14px 15px 0; color: var(--text); border: 0; background: transparent; font-size: 16px; border-radius: 14px; }input::placeholder { color: #718498; }
.input-wrap:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px #3390ec12; }
.input-wrap input:focus-visible { outline: none; }
.field-hint { color: var(--secondary); font-size: .7rem; margin-top: 8px; margin-bottom: 22px; }.error { color: #ffb8a8; font-size: .76rem; margin: 9px 0 17px; }.error:empty { display: none; }
.view { min-width: 0; }
.invoice-view { min-width: 0; }
.invoice-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 22px; }
.invoice-method { display: inline-flex; align-items: center; gap: 8px; color: #c8d8e8; font-size: .75rem; font-weight: 750; }.invoice-method img { flex-shrink: 0; }
.invoice-state { flex-shrink: 0; padding: 4px 9px; border-radius: 100px; background: #3390ec12; color: #80bfff; font-size: .65rem; font-weight: 800; }
.invoice-description { color: var(--secondary); font-size: .82rem; line-height: 1.65; margin-top: 9px; max-width: 34ch; text-wrap: pretty; }
.invoice-receipt { padding: 20px; margin-top: 22px; border: 1px solid var(--border); border-radius: 20px; background: linear-gradient(120deg,var(--raised),var(--surface)); }
.invoice-product { font-size: .8rem; font-weight: 750; color: #c8d8e8; overflow-wrap: anywhere; }
.invoice-total { display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px; margin-top: 5px; line-height: 1.15; }.invoice-total strong { font-size: clamp(2rem,8vw,2.6rem); font-weight: 850; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }.invoice-total>span { font-size: .94rem; font-weight: 750; color: #80bfff; }
.invoice-recipient { color: var(--secondary); font-size: .72rem; margin-top: 8px; overflow-wrap: anywhere; }
.invoice-countdown { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 12px; margin-top: 18px; padding-top: 14px; border-top: 1px solid #8ca5bd12; }
.invoice-countdown>span { display: inline-flex; align-items: center; gap: 6px; color: var(--secondary); font-size: .72rem; }.invoice-countdown svg { width: 15px; height: 15px; color: #829eb9; }.invoice-countdown>strong { color: #c8d8e8; font-size: .88rem; font-weight: 800; font-variant-numeric: tabular-nums; }.invoice-countdown.is-urgent>strong { color: #f0c59a; }
.invoice-status-wrap { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 48px; padding: 12px 0; }
.invoice-status-dot { width: 5px; height: 5px; flex-shrink: 0; border-radius: 50%; background: #71b8fa; }.invoice-status { font-size: .71rem; line-height: 1.5; color: var(--secondary); text-align: center; text-wrap: pretty; }
.invoice-footnote { font-size: .67rem; color: #82909e; line-height: 1.6; margin-top: 9px; text-wrap: pretty; }
.invoice-view[data-status=paid] .invoice-state { background: #7bdfb214; color: #7bdfb2; }.invoice-view[data-status=paid] .invoice-status-dot { background: #7bdfb2; }.invoice-view[data-status=paid] .invoice-status { color: #7bdfb2; }.invoice-view[data-status=expired] .invoice-state { color: #f0c59a; background: #f0c59a12; }
#invoice-pay { transition: transform 160ms var(--ease-out); }#invoice-pay:active { transform: scale(.97); transition-duration: 100ms; }
.invoice-dock { position: fixed; z-index: 2; bottom: calc(14px + env(safe-area-inset-bottom,0px)); left: 0; right: 0; width: min(440px,100%); padding-inline: max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right)); margin-inline: auto; }
.resume-invoice { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 66px; padding: 12px 16px; color: var(--text); background: #0b1621f5; border: 1px solid #3390ec35; border-radius: 19px; box-shadow: 0 8px 30px #0006,inset 0 1px 0 #ffffff06; text-align: left; }
.resume-symbol { display: grid; place-items: center; width: 34px; height: 34px; flex-shrink: 0; background: #3390ec14; border-radius: 11px; color: #80bfff; }.resume-symbol svg { width: 17px; height: 17px; }.resume-copy { display: grid; gap: 2px; min-width: 0; flex: 1; }.resume-copy strong { font-size: .78rem; font-weight: 800; }.resume-copy>span { font-size: .66rem; color: var(--secondary); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }.resume-invoice>svg { width: 16px; height: 16px; color: #80bfff; }
body:has(.invoice-dock:not([hidden])) .shop { padding-bottom: calc(108px + env(safe-area-inset-bottom,0px)); }
dialog #invoice-title:focus { outline: none; }
@media(hover:hover) and (pointer:fine) { .resume-invoice:hover { border-color: #3390ec65; } }
@media(prefers-reduced-motion:reduce) { #invoice-pay { transition: none; }#invoice-pay:active { transform: none; } }
html.keyboard #invoice-pay { transition: none; }html.keyboard #invoice-pay:active { transform: none; }
@media(prefers-contrast:more) { .invoice-receipt,.resume-invoice { border-color: #71859b; }.invoice-footnote { color: var(--secondary); } }
@media(max-width:350px) { .invoice-heading { gap: 8px; }.invoice-method { font-size: .7rem; }.invoice-receipt { padding: 16px; } }
.busy::after { content: ''; border: 2px solid #ffffff40; border-top-color: #fff; width: 15px; height: 15px; border-radius: 50%; animation: spin 600ms linear infinite; }.busy>svg { display: none; }
.message-close { float: right; }.message-symbol { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 17px; background: #3390ec14; color: #6ab5ff; font-size: 26px; margin-bottom: 21px; }#message-copy { color: var(--secondary); font-size: .88rem; line-height: 1.65; margin: 12px 0 25px; overflow-wrap: anywhere; }
.empty { text-align: center; border: 1px dashed var(--border); padding: 34px 24px; border-radius: 20px; color: var(--secondary); font-size: .85rem; }.empty button { margin-top: 15px; }
.more-button { display: block; width: 100%; min-height: 44px; margin-top: 13px; background: #0b1621; color: #72b8fa; border: 1px solid var(--border); border-radius: 14px; font-size: .8rem; }
.skip { position: fixed; z-index: 10; top: 10px; left: 10px; padding: 10px 16px; background: var(--blue); border-radius: 10px; transform: translateY(-150%); }.skip:focus { transform: translateY(0); }.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }.no-script { padding: 20px; text-align: center; }
html.keyboard button,html.keyboard .tab-indicator,html.keyboard .radio-dot::after,html.keyboard dialog { transition: none !important; }
html.keyboard button:active { transform: none; }
@media(hover:hover) and (pointer:fine) { .support-button:hover,.round-button:hover { color: #e3f0fc; border-color: #3390ec55; }.buy:hover,.primary:hover { background: #429cf4; }.segmented button:hover { color: #d3e7f9; }.payment:hover { border-color: #3390ec55; }.wordmark:hover { color: #9dccff; } }
@media(max-width:540px) {
  .shop { padding-inline: max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right)); padding-top: calc(18px + env(safe-area-inset-top,0px)); }
  .intro { padding-top: 9px; padding-bottom: 29px; }.intro>p { font-size: .84rem; }.intro h1 { font-size: 1.65rem; }.logo-scene { height: 135px; margin-bottom: 7px; }.logo-object { width: 78px; height: 78px; }
  .product { padding: 18px; border-radius: 20px; }.product-top { gap: 12px; }.product h2 { font-size: 1.1rem; }.subtitle { font-size: .75rem; }.volume { font-size: .73rem; }.features { margin-top: 16px; gap: 6px; }.features li { font-size: .75rem; }.card-bottom { padding-top: 14px; }.buy { padding-inline: 19px; }.price { font-size: 1.4rem; }
  dialog { width: 100%; max-width: 100%; max-height: calc(100dvh - env(safe-area-inset-top,0px) - 12px); margin: auto 0 0; border-radius: 27px 27px 0 0; padding: 12px 22px calc(24px + env(safe-area-inset-bottom,0px)); transform: translateY(100%); transition: transform 280ms var(--ease-drawer),opacity 200ms var(--ease-out); }dialog.is-visible { transform: translateY(0); }.sheet-grip { display: block; width: 32px; height: 4px; margin: 0 auto 14px; border-radius: 10px; background: #ffffff22; }.sheet-header { margin-bottom: 17px; }.trial { padding: 16px; gap: 11px; }footer { font-size: .59rem; }
}
@media(max-width:350px) { .intro h1 { font-size: 1.45rem; }.product-top { flex-wrap: wrap; }.volume { margin-top: 0; }.product-copy { flex-basis: 100%; }.trial p { font-size: .65rem; }.desktop-break { display: none; } }
@media(prefers-reduced-motion:reduce) { .logo-object,.logo-halo,.logo-orbit,.particle,.intro h1,.intro>p,.delivery-note { animation: none; }button { transition: none; }button:active:not(:disabled) { transform: none; }dialog,dialog.is-visible { transform: none; transition: opacity 150ms var(--ease-out); }.tab-indicator { transition: none; }.radio-dot::after { transition: opacity 120ms var(--ease-out); transform: none; }.busy::after { animation: none; } }
@media(prefers-reduced-transparency:reduce) { dialog::backdrop { background: #060708ed; backdrop-filter: none; } }
@media(prefers-contrast:more) { .product,.segmented,.trial,.payment,dialog { border-color: #71859b; } }
@keyframes logo-arrive { from { opacity: 0; transform: translateY(10px) rotate(-15deg) scale(.94); } to { opacity: 1; transform: translateY(0) rotate(-10deg) scale(1); } }
@keyframes halo-arrive { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: scale(1); } }
@keyframes orbit-arrive { from { opacity: 0; transform: rotate(-50deg) scale(.85); } to { opacity: 1; transform: rotate(-23deg) scale(1); } }
@keyframes particle-arrive { from { opacity: 0; transform: translateY(12px); } to { transform: translateY(0); } }
@keyframes copy-arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes logo-sway { 0%,100% { transform: translateY(0) rotate(0deg); } 30% { transform: translateY(-4px) rotate(3deg); } 70% { transform: translateY(3px) rotate(-3deg); } }
@keyframes orbit-turn { from { transform: rotate(-23deg); } to { transform: rotate(337deg); } }
@keyframes star-twinkle { 0%,100% { opacity: .25; } 50% { opacity: .85; } }
@media(prefers-reduced-motion:reduce) { .logo-rotor,.logo-orbit,.particle { animation: none; } }
