/* Product finish: a single identity, quiet controls and clear navigation. */
:root { --product-lavender:#c8a7fa; }
.skip-link { position:fixed; top:12px; left:16px; z-index:100; padding:12px 18px; border-radius:6px; background:#d0b0ff; color:#160e22; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
#main-content:focus { outline:none; }
button,summary { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:2px solid #d0b0ff; outline-offset:5px; }
.topbar { height:88px; padding-inline:4.5%; gap:28px; background:#0a090f; }
.wordmark { gap:13px; font-size:25px; letter-spacing:-.9px; flex-shrink:0; }
.foundry-mark { display:block; width:36px; height:36px; flex-shrink:0; stroke:none!important; fill:none; overflow:visible; }
.wordmark>span { font-weight:800; }
.main-nav { gap:30px; margin-left:auto; }
.nav-item { font-family:var(--sans); font-size:13px; padding:14px 0; color:#a8a0b6; }
.nav-item.active { color:#d3bfed; }
.header-actions { display:flex; align-items:center; gap:22px; }
.local-badge { font-size:9px; border:0; padding:0; color:#ada0bd; letter-spacing:1px; }
.local-badge>span { box-shadow:none; }
.header-actions .button { padding:10px 18px; min-height:40px; font-size:12px; border-color:#665379; background:#21182e; color:#e2cffb; }
.button { border-radius:6px; font-family:var(--sans); font-size:13px; font-weight:600; padding:14px 22px; gap:10px; }
.primary { background:#bb94f2; border-color:#c7a8f5; box-shadow:inset 0 1px 0 #f1ddff33; color:#1c112b; }
.primary:hover { background:#cfaffb; box-shadow:none; transform:translateY(-1px); }
.primary:active { transform:translateY(0); }
.secondary { border-color:#51435e; background:#17121f; color:#cfbfdf; }
.secondary:hover { border-color:#9a7eb4; background:#231a2e; }
.text-button { font-family:var(--sans); font-size:13px; color:#bcadcc; gap:8px; }
.text-button:hover { color:#e8d7fa; }
.line { box-shadow:none; background:#bd9ce8; }
.eyebrow { color:#bca8cf; letter-spacing:1.7px; font-size:10px; }
.hero { min-height:625px; background:radial-gradient(ellipse at 77% 50%,#3c245014,transparent 62%); }
.hero-copy { padding-top:65px; padding-bottom:50px; }
.hero h1 { font-size:clamp(75px,7.4vw,118px); line-height:.96; letter-spacing:-1.5px; margin:28px 0; }
.hero h1 span { color:#c4a2ef; }
.hero-copy>p { color:#b4a9c1; font-size:16px; line-height:1.7; }
.hero-actions { margin-top:29px; gap:25px; }
.hero-actions .button { padding:15px 23px; min-height:48px; }
.hero-note { margin-top:25px; display:flex; align-items:center; color:#95889f; font-size:10px; gap:9px; }
.note-check { color:#b699d1; }
.note-rule { height:11px; background:#47394f; margin-inline:4px; }
.art-orbit { opacity:.45; }
.art-panel { border-color:#5a466c; box-shadow:3px 4px 0 #15101e,4px 5px 0 #473455,10px 18px 35px #0005; }
.art-swap { transform:rotate(-3deg); }
.art-agent { transform:rotate(0); }
.art-rewards { transform:rotate(3deg); }
.mini-cta,.thumb-button { background:#b991ed; color:#241333; border-color:#d4b1ff55; justify-content:center; font-weight:500; }
.mini-command { font-size:8px; }
.mini-switch,.thumb-direction { height:12px; margin:0; display:flex; align-items:center; justify-content:center; }
.mini-switch:after,.thumb-direction:after { content:""; width:1px; height:8px; background:#785b93; }
.mini-tabs>span:not(.mini-demo) { display:none; }
.mini-prompt { justify-content:flex-start; }
.art-bottom { color:#9782aa; }
.art-version { line-height:1.65; }
.journey-strip { background:#100d17; }
.journey-strip>div { justify-content:flex-start; gap:18px; }
.journey-strip p { font-size:13px; }
.journey-strip small { font-size:11px; color:#9d8daf; }
.catalog { padding-top:80px; padding-bottom:65px; }
.section-intro h2 { font-size:clamp(46px,4.4vw,64px); }
.section-intro>p { color:#a99ab9; }
.module-card { border-radius:8px; border-color:#3d304b; }
.swap-card { background:linear-gradient(145deg,#201529,#100d17 65%); border-color:#806099; box-shadow:inset 0 1px 0 #b88ac127; }
.future-card { background:#100d16; border-color:#332a3f; }
.module-card h3 { font-size:32px; }
.module-card>p { color:#b7a5c8; line-height:1.7; }
.feature-chips>span { border-color:#3c2d49; color:#bda4d1; background:#19111f; }
.module-card .button { min-height:46px; font-size:12px; font-family:var(--sans); }
.future-card .button { background:transparent; border-color:#493650; color:#bca4ce; }
.card-meta { letter-spacing:.5px; }
.status.available { color:#cfabea; }
.status.planned { color:#a597b0; }
.catalog-preview { border-color:#4a355a; border-radius:6px; }
.thumb-caption { color:#a78ab9; }
.story-detail { padding-left:14px; border-left:2px solid #826298; }
.story-step .button { margin-top:24px; align-self:flex-start; }
.build-story { border-top:1px solid #2e2238; }
.story-intro h2 { font-size:clamp(57px,5.4vw,78px); }
.story-browser-top { justify-content:space-between; }
.story-browser-top>span { flex:1; text-align:center; }
.story-widget .thumb-button { color:#1a1026; }
.story-stage-footer { color:#a18aad; }
.product-faq { padding:85px 6%; border-top:1px solid #34263f; display:grid; grid-template-columns:.9fr 1.1fr; gap:10%; max-width:1640px; margin:auto; }
.product-faq h2 { font:700 58px/.99 var(--display); letter-spacing:-.8px; margin:24px 0 20px; color:#e3d5ef; }
.product-faq>div>p { font-size:14px; line-height:1.8; color:#9f90b0; }
.faq-items { border-top:1px solid #44324f; }
.faq-items details { border-bottom:1px solid #44324f; }
.faq-items summary { list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:24px 0; font-size:15px; color:#d9c8e7; cursor:pointer; line-height:1.5; }
.faq-items summary::-webkit-details-marker { display:none; }
.faq-items summary:after { content:"+"; color:#b493ce; font-size:21px; font-weight:300; flex-shrink:0; }
.faq-items details[open] summary:after { content:"−"; }
.faq-items details p { color:#ae99bf; font-size:13px; line-height:1.9; margin:0 24px 23px 0; }
.closing-cta { margin:0 4.5% 76px; padding:45px; display:flex; gap:30px; align-items:center; position:relative; border:1px solid #624776; border-radius:10px; background:linear-gradient(110deg,#261a35,#160f21); }
.closing-mark .foundry-mark { width:67px; height:67px; }
.closing-cta h2 { font:700 45px/1.1 var(--display); margin:14px 0 9px; letter-spacing:-.5px; }
.closing-cta p { color:#ad98bf; font-size:13px; }
.closing-cta .button { margin-left:auto; }
.closing-cta .eyebrow { font-size:9px; letter-spacing:1.5px; }
.footer { padding:27px 4.5%; color:#a28eaf; font-size:10px; background:#0b0810; gap:24px; }
.footer .footer-brand { display:flex; align-items:center; gap:8px; color:#d9c9e8; font:800 16px var(--sans); }
.footer-brand .foundry-mark { width:23px; height:23px; }
.footer>div { display:flex; align-items:center; gap:24px; }
.footer button { color:#baa3ca; font-size:11px; }
.footer-separator { padding-inline:10px; color:#685471; }
.footer-sandbox { font-size:9px; color:#8d789f; }
/* Studio controls share the site's quieter visual language. */
.studio-heading { padding-top:34px; padding-bottom:28px; }
.studio-heading h1 { color:#ecddf7; }
.studio-heading>p { color:#ab99bb; }
.stepper { background:#130d1c; }
.stepper>button { font-family:var(--sans); font-size:12px; }
.stepper>button.current { box-shadow:none; background:#31213f; border-color:#8e6ba5; }
.step-number { font-family:var(--mono); }
.selected-module { background:#241930; box-shadow:none; border-color:#76538f; }
.selected-icon svg { width:21px; height:21px; }
.editor-label { font-size:10px; letter-spacing:1.3px; }
.editor-panel label { color:#c6b3d6; }
.editor-panel input:not([type="range"]):not([type="color"]):not([type="file"]) { border-radius:6px; border-color:#5b436b; background:#100b17; }
.draft-tools { margin-top:25px; padding-top:22px; border-top:1px solid #43304e; }
.draft-tools strong { font-size:12px; font-weight:500; color:#d7c2e6; }
.draft-tools p { font-size:11px; line-height:1.65; color:#9f84b1; margin-top:5px; }
.draft-tools>div:last-of-type { display:flex; gap:8px; margin-top:15px; }
.draft-tools .button { flex:1; font-size:11px; padding:10px 6px; min-height:39px; }
.browser-chrome { justify-content:space-between; }
.preview-address { margin-inline:auto; }
.reverse-row { height:16px; }
.reverse-button { width:auto; min-width:54px; height:26px; padding:2px 9px; font:9px var(--sans); border-width:3px; border-radius:5px; background:var(--brand-panel); }
.reverse-button:hover { transform:none; color:#f0e5fc; }
.token-selector svg { width:10px; height:10px; stroke-width:2; }
.slippage-button { gap:7px; }
.slippage-button svg { width:13px; }
.swap-action { font-size:13px; }
.brand-headline .brand-kicker { letter-spacing:1.5px; }
.brand-powered { font-size:8px; }
.full-preview-bar .button { font-size:12px; }
.review-amounts>.review-receive-label { font:10px var(--mono); padding:17px 0 10px; color:#a68ab8; text-transform:uppercase; letter-spacing:1px; }
.modal-shell { padding:34px; }
.modal-shell h2 { font-size:40px; }
.modal-shell>.button,.modal-shell .button { font-size:12px; }
.review-details b { overflow-wrap:anywhere; }
@media(min-width:1500px) { .hero-copy { padding-left:10%; } .hero { min-height:680px; } .hero-actions { margin-top:35px; } .closing-cta { max-width:1450px; margin-inline:auto; } }
@media(max-width:1100px) { .topbar { gap:20px; } .header-actions { gap:16px; } .main-nav { gap:20px; } .hero h1 { font-size:82px; } .hero-actions { gap:17px; } .hero-actions .button { font-size:12px; padding:14px 17px; } .hero-copy>p { font-size:14px; } .hero-note { font-size:8px; } .hero { min-height:590px; } .module-card .button { font-size:11px; } .module-card h3 { font-size:28px; } .closing-cta { padding:32px; gap:25px; } .closing-cta h2 { font-size:37px; } .closing-mark .foundry-mark { width:52px; height:52px; } }
@media(max-width:850px) { .header-actions .local-badge { display:none; } .topbar { padding-inline:4%; gap:18px; } .wordmark { font-size:22px; gap:9px; } .wordmark .foundry-mark { width:30px; height:30px; } .main-nav { gap:18px; } .nav-item { font-size:12px; } .header-actions .button { font-size:11px; padding:10px 13px; } .hero h1 { font-size:70px; } .hero-copy { padding-top:47px; } .hero-actions { flex-wrap:wrap; gap:10px 18px; } .hero-note { flex-wrap:wrap; line-height:1.6; } .hero { min-height:555px; } .journey-strip>div { gap:10px; } .journey-strip p { font-size:11px; } .journey-strip small { font-size:9px; } .catalog { padding-top:55px; } .product-faq { gap:6%; } .product-faq h2 { font-size:48px; } .closing-mark { display:none; } .closing-cta .button { font-size:12px; padding:14px 18px; } .footer { font-size:9px; gap:15px; } .footer-sandbox { display:none; } }
@media(min-width:601px) and (max-width:900px) { .studio-layout { grid-template-columns:300px minmax(0,1fr); } .preview-canvas { padding-inline:14px; } .preview-toolbar { justify-content:center; } .preview-toolbar>span { width:100%; justify-content:center; } .preview-bottom { flex-direction:column; align-items:flex-start; gap:16px; } .brand-headline h2 { font-size:24px; } .brand-app .swap-widget { padding:12px; max-width:calc(100% - 20px); } .amount-row .amount-input,.receive-output { font-size:21px; } .token-selector { padding:4px; gap:2px; } .token-selector select { width:47px; } }
@media(max-width:600px) { .topbar { height:auto; min-height:110px; flex-wrap:wrap; padding:16px 6% 0; gap:0; } .wordmark { font-size:23px; } .wordmark .foundry-mark { width:30px; height:30px; } .header-actions { margin-left:auto; } .header-actions .button { font-size:11px; min-height:36px; padding:9px 13px; } .main-nav { display:flex; order:3; width:100%; justify-content:space-between; margin:9px 0 0; gap:22px; border-top:1px solid #2a2033; } .nav-item { padding:13px 0; font-size:11px; } .hero { min-height:0; } .hero-copy { padding:37px 6% 25px; } .hero h1 { font-size:74px; letter-spacing:-1.3px; line-height:.96; margin:25px 0; } .hero-copy>p { font-size:14px; line-height:1.75; } .eyebrow { font-size:9px; letter-spacing:1.3px; } .hero-actions { flex-wrap:nowrap; gap:20px; margin-top:25px; } .hero-actions .button { font-size:12px; padding:13px 17px; } .hero-actions .text-button { font-size:12px; } .hero-note { font-size:9px; gap:7px; margin-top:20px; } .module-art { margin-top:0; } .journey-strip>div { gap:15px; } .journey-strip p { font-size:13px; } .journey-strip small { font-size:11px; } .section-intro h2 { font-size:47px; } .module-card h3 { font-size:34px; } .module-card .button { font-size:12px; } .module-card>p { font-size:13px; } .card-meta { font-size:8px; letter-spacing:0; } .status { font-size:9px; } .catalog { padding-top:46px; padding-bottom:45px; } .story-intro h2 { font-size:58px; } .story-step .button { margin-top:22px; } .product-faq { padding:50px 6%; display:block; } .product-faq h2 { font-size:50px; } .product-faq>div>p { font-size:13px; } .faq-items { margin-top:30px; } .faq-items summary { font-size:14px; padding:21px 0; } .faq-items details p { font-size:13px; margin-right:8px; } .closing-cta { margin:0 6% 48px; padding:30px 25px; flex-direction:column; align-items:flex-start; gap:24px; } .closing-cta h2 { font-size:39px; } .closing-cta p { font-size:12px; line-height:1.7; } .closing-cta .button { margin:0; width:100%; } .footer { flex-wrap:wrap; padding:24px 6%; row-gap:17px; } .footer>span { order:3; width:100%; font-size:9px; } .footer>div { margin-left:auto; } .footer .footer-brand { font-size:15px; } .footer-brand .foundry-mark { width:23px; height:23px; } .footer button { font-size:11px; } .studio-heading h1 { font-size:58px; } .stepper { justify-content:space-between; padding-inline:5%; } .stepper>button { max-width:none; font-size:10px; gap:7px; } .stepper>button.current { padding:8px; } .draft-tools { margin-top:21px; } .draft-tools .button { font-size:12px; min-height:42px; } .preview-toolbar .text-button { font-size:11px; } .preview-bottom .button { font-size:11px; } .full-preview-bar .button { font-size:10px; padding:10px; } .full-preview-bar .text-button { font-size:11px; } .modal-shell { padding:28px 24px; } .modal-shell h2 { font-size:37px; } .review-amounts>div { font-size:22px; } }
@media(max-width:360px) { .hero h1 { font-size:66px; } .hero-actions { gap:14px; } .hero-actions .button { font-size:11px; padding-inline:13px; } .hero-actions .text-button { font-size:11px; } .stepper>button { font-size:9px; gap:5px; } }
@media(prefers-reduced-motion:reduce) { .primary:hover { transform:none; } }
html[data-reduced-motion="true"] .primary:hover { transform:none; }
/* Robinhood Chain is the destination; the current product remains a sandbox. */
.hero-token-link { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin-top:19px; font:11px/1.6 var(--sans); color:#b9a5cb; text-align:left; }
.hero-token-link>span { padding:3px 7px; border:1px solid #684e7d; border-radius:4px; color:#dcc1f7; font:11px var(--mono); }
.hero-token-link:hover { color:#e2cdf4; }
.token-section { display:grid; grid-template-columns:1.15fr .85fr; gap:46px 8%; padding:82px 6% 58px; border-top:1px solid #3e2d4c; background:linear-gradient(115deg,#17101f,#0d0a12 70%); scroll-margin-top:24px; }
.token-intro h2 { margin:26px 0 25px; color:#ecddf7; font:700 clamp(54px,5.2vw,78px)/1.02 var(--display); letter-spacing:-1px; }
.token-intro h2 span { color:#c6a3ed; }
.token-intro>p { max-width:520px; font-size:16px; line-height:1.8; color:#bba9c9; }
.token-status { display:flex; flex-wrap:wrap; gap:10px 13px; align-items:center; margin-top:27px; font-size:12px; color:#a995ba; }
.token-status>span { color:#d1b1ee; border:1px solid #69507f; padding:7px 9px; border-radius:4px; font:10px var(--mono); }
.token-card { align-self:start; border:1px solid #76548e; border-radius:10px; padding:30px; background:linear-gradient(150deg,#2e1f3e,#16101f 80%); }
.token-card-top { display:flex; align-items:center; justify-content:space-between; gap:16px; color:#baa1cf; font:10px var(--mono); letter-spacing:1px; }
.token-card-top .foundry-mark { width:42px; height:42px; }
.token-symbol { font:700 90px/1 var(--display); color:#d8b5f5; margin:29px 0 28px; letter-spacing:-1px; }
.token-symbol>span { display:block; margin-top:9px; color:#ba9ecf; font:15px var(--sans); letter-spacing:0; }
.token-facts { margin:0; }
.token-facts>div { display:flex; justify-content:space-between; gap:16px; border-top:1px solid #493456; padding:14px 0; font-size:13px; }
.token-facts dt { color:#ab96bb; }
.token-facts dd { margin:0; color:#e1cfee; text-align:right; }
.token-card-bottom { margin-top:14px; color:#a38ab6; font:10px var(--mono); letter-spacing:1.3px; }
.token-uses { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #50365e; padding-top:28px; gap:35px; }
.token-uses article>span { color:#b999d1; font:10px var(--mono); letter-spacing:.6px; }
.token-uses h3 { margin:17px 0 12px; color:#e3d1ef; font:700 33px var(--display); }
.token-uses p { font-size:14px; line-height:1.8; color:#b5a0c4; }
.token-footnote { grid-column:1/-1; max-width:950px; margin:0; font-size:12px; line-height:1.85; color:#9984aa; }
.brand-powered>small { display:block; margin-top:9px; font:10px/1.5 var(--sans); letter-spacing:0; color:#ac91bd; }
@media(max-width:800px) { .token-section { gap:32px; padding-block:55px 40px; } .token-card { padding:23px; } .token-uses { gap:23px; } .token-facts>div { flex-direction:column; gap:7px; } .token-facts dd { text-align:left; } }
@media(max-width:600px) { .token-section { grid-template-columns:1fr; } .token-intro h2 { font-size:56px; } .token-intro>p { font-size:15px; } .token-card { padding:27px; } .token-facts>div { flex-direction:row; } .token-facts dd { text-align:right; } .token-uses { grid-template-columns:1fr; gap:27px; } .token-uses h3 { margin-top:12px; } .hero-token-link { font-size:10px; } .token-footnote { font-size:12px; } }
/* Final alignment after removing icon-only affordances. */
.button.full { justify-content:center; }
.hero-note .note-rule { width:1px; height:11px; flex-shrink:0; }
.coin.wbtc { background:#655078; color:#e6d5f8; }
@media(max-width:600px) { .main-nav .nav-item { display:block; } .footer>span { display:block; } }

.main-nav .nav-item { display:block; }
@media(max-width:600px) { .footer>span:nth-child(2) { display:block; } }
/* Custom brand images stay local, retain their proportions and keep transparency. */
.image-upload-control { margin-top:13px; }
.image-upload-actions { display:flex; align-items:center; gap:17px; margin-top:12px; }
.image-upload-actions .button { flex:1; min-height:40px; font-size:12px; padding:10px 14px; border-style:dashed; background:#17101f; }
.image-upload-actions .button:disabled { opacity:.55; cursor:wait; }
.image-upload-hint { margin:10px 0 0; color:#a68cb6; font-size:10px; line-height:1.7; }
.image-upload-message { margin-top:8px; color:#c9a5e6; font-size:11px; line-height:1.6; overflow-wrap:anywhere; }
.image-upload-message:empty { display:none; }
.image-upload-message.is-error { color:#f0accb; }
.custom-mark-card { display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:10px; border:1px solid #614575; border-radius:6px; background:#140d1d; }
.custom-mark-card.selected { background:#2a1c39; border-color:#bb92e3; }
.custom-mark-thumbnail { width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0; padding:5px; border-radius:4px; background:repeating-conic-gradient(#362743 0% 25%,#251b30 0% 50%) 0 0/12px 12px; }
.custom-mark-thumbnail img { display:block; max-width:100%; max-height:100%; object-fit:contain; }
.custom-mark-card>span:nth-child(2) { min-width:0; flex:1; }
.custom-mark-card strong { display:block; font-size:11px; color:#e2c7f6; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.custom-mark-card small { display:block; font-size:10px; color:#ab8bbe; margin-top:5px; }
.custom-mark-check { color:#d2a7f2; opacity:0; font-size:13px; }
.custom-mark-card.selected .custom-mark-check { opacity:1; }
.brand-logo.has-image { display:flex; align-items:center; justify-content:center; width:35px; height:35px; font-size:0; flex-shrink:0; padding:0; background:none; border:0; }
.brand-logo.has-image img { width:100%; height:100%; object-fit:contain; display:block; }
.story-brandbar>span.has-image { display:flex; width:26px; height:26px; flex-shrink:0; align-items:center; justify-content:center; }
.story-brandbar>span.has-image img { width:100%; height:100%; object-fit:contain; }
.result-brand>span.has-image { width:38px; height:38px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.result-brand>span.has-image img { width:100%; height:100%; object-fit:contain; }
@media(max-width:600px) { .image-upload-actions .button { min-height:44px; font-size:13px; } .image-upload-hint { font-size:11px; } .custom-mark-card strong { font-size:12px; } .custom-mark-card small { font-size:11px; } .brand-logo.has-image { width:32px; height:32px; } }
.release-section{padding:80px 6%;border-top:1px solid #34253e;display:grid;grid-template-columns:1fr 1.15fr;gap:9%;scroll-margin-top:30px}.release-section h2{font:700 clamp(42px,5vw,64px)/1.05 var(--display);margin:25px 0}.release-section h2 span{color:#baa1d2}.release-section>div>p{color:#b09cbe;font-size:14px;line-height:1.8}.release-card{border:1px solid #604775;border-radius:12px;padding:28px;background:#121018}.release-meta{display:flex;justify-content:space-between;gap:16px;color:#bea5d3;font:10px/1.7 var(--mono)}.release-card h3{font:600 28px/1.25 var(--sans);margin:25px 0 20px;color:#e5d4f2}.release-card ul{padding-left:19px;color:#c4b0d3;font-size:14px;line-height:1.9}.release-card li{margin:12px 0}.release-note{font-size:12px;line-height:1.8;color:#a993b9;margin:22px 0}.release-card .button{margin-top:5px}.reward-ring strong{font-size:22px}.thumb-ring small{font-size:6px}
@media(max-width:700px){.release-section{grid-template-columns:1fr;gap:28px;padding:50px 6%}.release-card{padding:22px}.release-card h3{font-size:25px}.release-card ul{font-size:13px}.release-meta{font-size:9px}}