@charset "UTF-8";
/* ./styles.css */

:root{--bg:#f6f7f9;--surface:#fff;--surface-soft:#f8f9fc;--text:#20232b;--muted:#9095a2;--secondary:#737b8e;--border:#e8ebf1;--accent:#4467ee;--accent-soft:#f0f4ff;--shadow:0 12px 44px -24px #27345925;--serif:Georgia,"Times New Roman",serif;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--text);background:var(--bg);font-synthesis:none;scroll-behavior:smooth;color-scheme:light}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{color:inherit;cursor:pointer}button{border:0;background:none}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,a:focus-visible{outline:3px solid #7798ff;outline-offset:5px}input:focus-visible{outline:0;border-color:#7592ef;box-shadow:0 0 0 3px #4467ee0d}svg{width:100%;height:100%;display:block}h1,h2,h3,p{margin:0}::selection{background:#dde5ff}button,input{transition:background .2s,border-color .2s,box-shadow .2s,opacity .2s}button{letter-spacing:inherit}img,canvas{max-width:100%}.icon{display:inline-flex;width:18px;height:18px;flex:none;vertical-align:middle}.brand-icon{display:inline-flex;width:36px;height:36px;flex:none;color:var(--brand-color,currentColor)}.skip-link{position:fixed;top:-60px;left:20px;z-index:200;background:#fff;padding:12px;border-radius:10px}.skip-link:focus{top:10px}.shell{max-width:1264px;margin:0 auto;padding:0 32px}.site-header{height:100px;display:flex;align-items:center;justify-content:space-between;gap:25px}.wordmark{display:flex;align-items:center;gap:10px}.wordmark-symbol{width:33px;height:33px;padding:7px;background:var(--text);color:var(--bg);border-radius:10px;box-shadow:0 3px 6px #10172c10}.wordmark-name{font-size:20px;letter-spacing:-.9px;font-weight:760}.wordmark-name em{color:var(--muted);font-style:normal}.wordmark small{font-size:9px;letter-spacing:2px;font-weight:500;display:block;margin-top:1px;color:var(--secondary)}.header-nav{display:flex;align-items:center;background:#eceef2;border:1px solid #e6e8ed;padding:5px;border-radius:100px;gap:3px}.header-nav button{padding:10px 23px;font-size:12px;font-weight:550;white-space:nowrap;border-radius:100px;color:var(--secondary)}.header-nav button.active{background:var(--surface);color:var(--text);box-shadow:0 2px 6px #2b35550a}.header-actions{display:flex;align-items:center;gap:20px}.header-actions button{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--secondary)}.header-actions .theme-toggle{width:32px;height:32px;justify-content:center;border:1px solid var(--border);border-radius:50%}.header-actions .icon{width:16px;height:16px}.header-actions button:hover{color:var(--text)}.header-actions .locale{gap:5px;font-size:11px;color:var(--muted)}
.home-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:390px;padding:27px 0 33px;gap:30px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:2.3px;color:var(--secondary);font-weight:600}.eyebrow:before{content:"";width:21px;height:1px;background:currentColor;opacity:.5}.hero-copy h1{font-weight:600;font-size:52px;line-height:1.38;letter-spacing:-2.7px;margin:17px 0 17px}.hero-copy h1 span{color:#7c8496}.hero-copy>p{font-size:13px;color:var(--secondary);line-height:1.9}.hero-actions{display:flex;align-items:center;gap:19px;margin-top:28px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:11px;min-height:45px;padding:0 22px;border-radius:11px;font-size:12px;font-weight:550}.btn-primary{background:var(--text);color:var(--surface);box-shadow:0 3px 5px #14192a09}.btn-primary:not(:disabled):hover{background:#343b4c;transform:translateY(-1px)}.btn .icon{width:16px;height:16px}.btn-soft{border:1px solid var(--border);background:var(--surface)}.btn-quiet{color:var(--secondary);padding:0 3px}.btn-quiet:hover{color:var(--text)}.hero-note{display:flex;gap:19px;align-items:center;margin-top:26px;font-size:10px;color:var(--muted)}.hero-note span{display:flex;gap:5px;align-items:center}.hero-note .icon{width:13px;height:13px}.hero-art{height:348px;position:relative;isolation:isolate}.hero-art:before{content:"";position:absolute;inset:4% 7%;border-radius:50%;background:radial-gradient(ellipse,#dce4f355,transparent 65%);z-index:-1}.orbit-canvas{width:100%;height:100%;display:block}.floating-brand{position:absolute;width:55px;height:55px;display:flex;align-items:center;justify-content:center;background:linear-gradient(140deg,#fff,#f1f3f8);border:1px solid #fff;border-radius:16px;box-shadow:0 8px 27px #4b61851b,0 1px 2px #fff inset;animation:float 7s ease-in-out infinite}.floating-brand .brand-icon{width:28px;height:28px}.float-muse{left:18%;top:15%;transform:rotate(-12deg);color:#1767ff}.float-tg{right:11%;top:37%;color:#299ad7;animation-delay:-2s;transform:rotate(12deg)}.float-x{left:25%;bottom:14%;width:46px;height:46px;animation-delay:-4s;transform:rotate(-8deg)}.float-gemini{right:25%;bottom:12%;width:44px;height:44px;animation-delay:-1s}.art-caption{position:absolute;left:0;right:0;bottom:3px;text-align:center;font-size:8px;letter-spacing:3px;color:#9aa3b5}.orbit-label{position:absolute;right:6%;top:10%;font-size:8px;letter-spacing:1.6px;color:#9aa3b5;display:flex;align-items:center;gap:7px}.orbit-label i{width:5px;height:5px;background:#8c9ac4;border-radius:50%}.collection{padding-top:25px;scroll-margin-top:25px;border-top:1px solid var(--border)}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.section-heading h2{font-size:24px;font-weight:620;letter-spacing:-.8px;display:flex;align-items:center;gap:12px}.section-heading h2 span{font-size:10px;color:var(--muted);font-weight:450;letter-spacing:1px;align-self:center;border:1px solid var(--border);border-radius:50px;padding:3px 7px}.section-heading p{color:var(--secondary);font-size:11px;margin-top:7px}.search-box{width:216px;height:37px;position:relative}.search-box .icon{position:absolute;top:10px;left:12px;width:15px;height:15px;color:var(--muted);pointer-events:none}.search-box input{width:100%;height:100%;border:1px solid var(--border);background:var(--surface);border-radius:10px;padding:0 15px 0 35px;font-size:11px;color:var(--text)}input::placeholder{color:#a1a6b1}.collection-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:24px}.category-tabs{display:flex;gap:7px;flex-wrap:wrap}.category-tabs button{font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Inter,sans-serif;font-size:11px;font-weight:650;letter-spacing:-.1px;color:var(--secondary);padding:8px 15px;border-radius:8px;border:1px solid transparent;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased}.category-tabs button.active{background:var(--surface);color:var(--text);border-color:var(--border);box-shadow:0 2px 4px #26335203}.category-tabs button:hover{background:var(--surface)}.collection-count{color:var(--muted);font-size:10px;white-space:nowrap;display:flex;align-items:center;gap:7px}.status-dot{display:inline-block;width:5px;height:5px;background:#6c9c83;border-radius:50%;box-shadow:0 0 0 3px #6c9c830c}.product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}.product-card{display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:22px 19px 18px;min-height:207px;position:relative;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}.product-card:before{content:"";position:absolute;inset:0;opacity:0;background:radial-gradient(at 0 0,var(--brand-tint),transparent 70%);transition:opacity .25s;pointer-events:none}.product-card:hover{transform:translateY(-5px);border-color:#d7deed;box-shadow:0 13px 30px -15px #26355625}.product-card:hover:before{opacity:1}.card-top{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:21px}.card-brand{width:44px;height:44px;border-radius:13px;background:var(--brand-tint);display:flex;align-items:center;justify-content:center;color:var(--brand-color)}.card-brand .brand-icon{width:26px;height:26px}.card-tag{font-size:8px;letter-spacing:.1px;color:var(--secondary);background:var(--surface-soft);border:1px solid var(--border);padding:3px 6px;border-radius:5px}.product-card h3{position:relative;font-size:14px;font-weight:620;letter-spacing:-.4px;margin-bottom:7px;white-space:nowrap}.product-card .card-description{position:relative;color:var(--muted);font-size:10px;line-height:1.6}.card-bottom{position:relative;display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:auto;padding-top:24px}.card-price{font-size:17px;letter-spacing:-.8px;font-weight:570}.card-price small{font-size:10px;font-weight:450;letter-spacing:0;margin-right:2px}.card-price em{font-size:9px;font-weight:450;letter-spacing:0;color:var(--muted);font-style:normal;margin-left:4px}.card-bottom>.icon{width:15px;height:15px;color:#adb3c1;transition:transform .2s}.product-card:hover .card-bottom>.icon{transform:translateX(3px);color:var(--brand-color)}.no-results{grid-column:1/-1;min-height:200px;display:grid;place-content:center;text-align:center;color:var(--secondary);font-size:13px;gap:12px}.service-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding:28px 3px;margin-top:25px;border-bottom:1px solid var(--border)}.service-item{display:flex;gap:12px;align-items:center}.service-item>.icon{width:18px;height:18px;color:#747f94}.service-item strong{font-weight:500;font-size:11px;display:block;margin-bottom:4px}.service-item p{font-size:10px;color:var(--muted);line-height:1.6}.site-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:25px 0 30px;font-size:9px;color:var(--muted)}.footer-links{display:flex;gap:19px;align-items:center}.footer-links button{font-size:10px;color:var(--secondary);display:flex;gap:5px;align-items:center}.footer-links .icon{width:12px;height:12px}.demo-pill{font-size:8px;padding:3px 6px;border:1px solid var(--border);border-radius:5px;color:var(--muted)}.page-appear{animation:appear .4s ease both}.breadcrumb{display:flex;align-items:center;gap:9px;font-size:10px;color:var(--muted);padding-top:22px}.breadcrumb button{font-size:10px;color:var(--secondary);display:flex;align-items:center;gap:7px}.breadcrumb .icon{width:13px;height:13px}.breadcrumb .current{color:var(--text)}.breadcrumb .sep{opacity:.5}
.product-layout{display:grid;grid-template-columns:minmax(0,1fr) 416px;gap:90px;align-items:center;min-height:calc(100vh - 234px);padding:28px 0 65px}.product-stage{height:540px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;min-width:0}.stage-kicker{position:absolute;top:8%;font-size:10px;letter-spacing:2.6px;color:var(--muted)}.stage-art{width:100%;height:350px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}.stage-art:before{content:"";position:absolute;width:280px;height:280px;background:radial-gradient(ellipse,var(--product-tint),transparent 68%);border-radius:50%;filter:blur(10px)}.stage-art>.brand-icon{width:168px;height:168px;color:var(--product-color);position:relative;filter:drop-shadow(0 15px 25px color-mix(in srgb,var(--product-color) 16%,transparent));animation:logo-float 8s ease-in-out infinite}.stage-art .orbital-ring{position:absolute;width:350px;height:350px;border:1px solid color-mix(in srgb,var(--product-color) 9%,transparent);border-radius:50%;transform:rotateX(60deg) rotate(-23deg)}.stage-art .orbital-ring:after{content:"";position:absolute;width:7px;height:7px;background:var(--product-color);border-radius:50%;top:38px;right:44px;opacity:.5;box-shadow:0 0 12px var(--product-color)}.stage-caption{text-align:center;position:relative}.stage-caption h2{font-size:22px;font-weight:580;letter-spacing:-.7px}.stage-caption p{font-size:11px;color:var(--secondary);margin-top:10px}.stage-dots{display:flex;gap:5px;margin-top:27px;justify-content:center}.stage-dots span{width:4px;height:4px;background:#d8dce5;border-radius:5px}.stage-dots span.active{width:18px;background:#a5adc0}.product-mini-nav{display:flex;gap:13px;justify-content:center;margin-top:26px}.product-mini-nav button{width:32px;height:32px;padding:7px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--secondary);opacity:.6}.product-mini-nav button:hover,.product-mini-nav button.active{opacity:1;border-color:#b8c5ef}.product-mini-nav .brand-icon{width:100%;height:100%}.buy-panel{background:var(--surface);border:1px solid var(--border);border-radius:25px;padding:29px;box-shadow:var(--shadow);position:relative}.panel-tag{font-size:9px;letter-spacing:1.3px;color:var(--secondary);display:flex;align-items:center;gap:6px;margin-bottom:12px}.panel-tag .status-dot{width:4px;height:4px}.buy-panel h1{font-size:29px;font-weight:650;letter-spacing:-1.4px;line-height:1.3}.panel-subtitle{font-size:11px;color:var(--secondary);margin-top:8px;line-height:1.6}.field-heading{display:flex;align-items:center;justify-content:space-between;margin:24px 0 11px;font-size:11px;font-weight:550}.field-heading span{font-size:9px;color:var(--muted);font-weight:400}.variants{display:flex;flex-direction:column;gap:8px}.variant{border:1px solid var(--border);border-radius:11px;padding:12px 13px;display:flex;align-items:center;gap:10px;text-align:left;min-height:63px;background:var(--surface);position:relative}.variant:hover{border-color:#aebee9}.variant.selected{border-color:#8aa2f8;background:var(--accent-soft);box-shadow:0 0 0 1px #8aa2f814}.radio-dot{width:13px;height:13px;border:1px solid #d8dde8;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;color:#fff;background:var(--surface)}.selected>.radio-dot{background:var(--accent);border-color:var(--accent)}.radio-dot .icon{width:9px;height:9px;opacity:0}.selected>.radio-dot .icon{opacity:1}.variant-label{flex:1;min-width:0}.variant-name{font-size:11px;font-weight:550;display:flex;align-items:center;gap:6px;line-height:1.5}.variant-detail{display:block;font-size:9px;color:var(--muted);margin-top:3px}.recommend{font-size:8px;line-height:1.4;font-weight:450;padding:1px 5px;color:#5a75ce;background:#e3eaff;border-radius:4px}.variant-price{font-size:17px;font-weight:550;letter-spacing:-.7px;white-space:nowrap}.variant-price small{font-size:9px;font-weight:400;margin-right:2px}.quantity-row{display:flex;align-items:center;justify-content:space-between;margin:21px 0}.quantity-label{font-size:11px}.quantity-label small{display:block;font-size:9px;color:var(--muted);margin-top:6px}.quantity-control{display:flex;align-items:center;gap:5px;padding:4px;background:var(--surface-soft);border:1px solid var(--border);border-radius:10px}.quantity-control button{width:26px;height:26px;padding:6px;border-radius:6px;color:var(--secondary)}.quantity-control button:not(:disabled):hover{background:var(--surface);box-shadow:0 1px 4px #14213c09}.quantity-control .icon{width:14px;height:14px}.quantity-control output{width:24px;text-align:center;font-size:11px;font-weight:550}.form-field{margin-top:16px}.form-field>label{display:block;font-size:10px;font-weight:550;margin-bottom:9px}.input-wrap{position:relative}.input-wrap>.icon{position:absolute;left:13px;top:13px;width:15px;height:15px;color:#a6adbe}.text-input{display:block;border:1px solid var(--border);background:var(--surface-soft);border-radius:9px;width:100%;height:41px;padding:0 13px 0 37px;color:var(--text);font-size:11px}.text-input.plain{padding-left:13px}.text-input.invalid{border-color:#df9292}.input-help{display:block;font-size:9px;color:var(--muted);margin-top:7px;line-height:1.6}.field-error{font-size:10px;color:#cc5d5d;min-height:0;margin-top:5px}.field-error:empty{display:none}.payment-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.payment-option{display:flex;align-items:center;gap:9px;padding:11px;border:1px solid var(--border);border-radius:10px;text-align:left}.payment-option.selected{border-color:#8aa2f8;background:var(--accent-soft)}.payment-option .pay-mark{width:24px;height:25px;display:flex;align-items:center;justify-content:center;border-radius:7px;color:#fff;font-weight:600;font-size:17px;flex:none}.pay-mark.alipay{background:#1677ff}.pay-mark.usdt{background:#28a082}.pay-label{flex:1;font-size:11px}.pay-label small{display:block;font-size:8px;color:var(--muted);margin-top:4px}.payment-option>.radio-dot{width:11px;height:11px}.panel-total{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);margin-top:22px;padding-top:18px}.panel-total .total-label{color:var(--secondary);font-size:10px}.total-label small{display:block;font-size:8px;color:var(--muted);margin-top:5px}.total-price{font-size:25px;font-weight:570;letter-spacing:-1px}.total-price small{font-size:11px;letter-spacing:0;margin-right:2px}.btn-full{width:100%;margin-top:16px;min-height:45px}.panel-bottom-note{font-size:9px;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:5px;margin-top:12px}.panel-bottom-note .icon{width:11px;height:11px}.stage-orbit{height:395px;width:100%;position:relative}.stage-orbit .floating-brand{background:linear-gradient(140deg,#24262b,#13151a);border-color:#ffffff18;box-shadow:0 8px 18px #0004;color:#e7ebf5}.stage-orbit .float-x{width:62px;height:62px;left:13%;top:10%;bottom:auto}.stage-orbit .float-gemini{right:12%;bottom:18%;width:50px;height:50px}.stage-orbit .float-muse{left:19%;bottom:8%;top:auto;width:47px;height:47px}.dark-page{--bg:#08090c;--surface:#111318;--surface-soft:#171a21;--text:#f0f1f6;--muted:#717988;--secondary:#929bab;--border:#262a32;--accent:#7d9aff;--accent-soft:#1a2132;--shadow:0 18px 60px #0001;color-scheme:dark;background:var(--bg);color:var(--text);transition:background .45s,color .3s}.dark-page .header-nav{background:#12151a;border-color:var(--border)}.dark-page .header-nav button.active{background:#282c34}.dark-page .hero-copy h1 span{color:#8b96af}.dark-page .floating-brand{background:linear-gradient(140deg,#2d3443,#161b25);border-color:#4d597b38}.dark-page .card-tag{background:#1b2029}.dark-page .product-card .card-brand{background:color-mix(in srgb,var(--brand-color) 13%,#171a22)}.dark-page .product-card:before{background:radial-gradient(at 0 0,color-mix(in srgb,var(--brand-color) 10%,transparent),transparent 70%)}.dark-page .recommend{background:#2d3d67;color:#a9baff}.dark-page .hero-art:before{background:radial-gradient(ellipse,#15234860,transparent 65%)}.dark-page .btn-primary{color:#171b26}.dark-page .btn-primary:not(:disabled):hover{background:#d6dff5}.dark-page .product-stage .stage-art>.brand-icon{color:var(--product-color)}.dark-page .product-mini-nav button{color:#c1c9d9}.dark-page .toast{background:#eceff8;color:#191e2a}.dark-page .cloud-check{background:#171b22;border-color:#383e4a}.dark-page .qr-placeholder{background:#fff}.dark-page .dialog{box-shadow:0 25px 100px #0008}
.checkout-main{padding:48px 0 80px;min-height:calc(100vh - 190px)}.checkout-progress{display:flex;align-items:center;gap:17px;justify-content:center;margin-bottom:32px;font-size:10px;color:var(--muted)}.checkout-progress span{display:flex;align-items:center;gap:6px}.checkout-progress b{font-size:9px;font-weight:500;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--border);background:var(--surface)}.checkout-progress .active{color:var(--text)}.checkout-progress .active b{background:var(--text);color:var(--surface);border-color:var(--text)}.progress-line{height:1px;width:38px;background:var(--border)}.checkout-card{background:var(--surface);border:1px solid var(--border);border-radius:25px;padding:32px;box-shadow:var(--shadow)}.checkout-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:26px;gap:20px}.checkout-header h1{font-size:25px;letter-spacing:-.8px;font-weight:650}.checkout-header p{font-size:11px;color:var(--secondary);margin-top:9px}.link-button{color:var(--secondary);display:inline-flex;align-items:center;gap:6px;font-size:10px;padding:4px 0}.link-button .icon{width:14px;height:14px}.checkout-columns{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px}.notice-alert{border:1px solid #edcdbd;border-radius:11px;background:#fff9f5;padding:17px 18px;color:#b37650;margin-bottom:9px}.notice-alert strong{font-size:11px;font-weight:550;display:flex;align-items:center;gap:7px}.notice-alert .icon{width:14px;height:14px}.notice-alert p{font-size:10px;line-height:1.9;margin-top:7px}.dark-page .notice-alert{border-color:#70543e;background:#282017;color:#d9ac7b}.term-row{display:flex;gap:17px;padding:21px 0;border-bottom:1px solid var(--border)}.term-row:last-child{border-bottom:0}.term-no{font-size:9px;color:#9ca7bd;font-variant-numeric:tabular-nums;padding-top:2px}.term-row h3{font-size:12px;font-weight:550}.term-row p{font-size:11px;color:var(--secondary);line-height:1.9;margin-top:9px}.terms-contact{display:flex;gap:6px;font-size:10px;color:var(--secondary);margin-top:17px;align-items:center}.terms-contact .icon{width:13px;height:13px}.terms-contact button{color:var(--accent);font-size:10px;padding:0}.order-summary{padding:22px;background:var(--surface-soft);border:1px solid var(--border);border-radius:15px;align-self:start}.summary-title{display:flex;align-items:center;justify-content:space-between;gap:10px}.summary-title h2{font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px}.summary-title .brand-icon{width:23px;height:23px;color:var(--product-color)}.delivery-tag{font-size:8px;color:var(--secondary);padding:3px 5px;background:var(--surface);border:1px solid var(--border);border-radius:4px}.summary-variant{font-size:29px;letter-spacing:-1.2px;font-weight:550;margin-top:22px}.summary-detail{color:var(--secondary);font-size:10px;margin-top:7px;line-height:1.7}.summary-recipient{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:13px;margin-top:18px;overflow-wrap:anywhere}.summary-recipient small{font-size:9px;color:var(--secondary);display:block;margin-bottom:8px}.summary-recipient strong{font-size:17px;letter-spacing:2px;font-weight:550}.summary-rows{margin-top:18px;display:flex;flex-direction:column;gap:13px}.summary-row{display:flex;justify-content:space-between;gap:12px;line-height:1.6;font-size:10px}.summary-row dt{color:var(--secondary);flex:none}.summary-row dd{margin:0;text-align:right;overflow-wrap:anywhere;min-width:0}.summary-row.total{margin-top:6px;padding-top:16px;border-top:1px solid var(--border);align-items:center}.summary-row.total dd{font-size:24px;font-weight:550;letter-spacing:-1px}.summary-row.total dd small{font-size:11px;margin-right:2px}.checkout-bottom{margin-top:29px;padding-top:23px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:23px}.consent{font-size:10px;color:var(--secondary);display:flex;align-items:flex-start;gap:9px;line-height:1.7;cursor:pointer}.consent input{width:14px;height:14px;margin:1px 0 0;accent-color:var(--accent);flex:none;cursor:pointer}.consent small{display:block;font-size:9px;color:var(--muted);margin-top:7px}.checkout-submit{display:flex;align-items:center;gap:18px;flex:none}.checkout-submit>.btn{width:173px}.cloud-check{background:#fafafa;border:1px solid #e2e3e7;display:flex;align-items:center;gap:9px;min-height:53px;width:216px;padding:9px 12px;text-align:left;cursor:pointer;border-radius:5px}.cloud-check input{appearance:none;width:20px;height:20px;border:2px solid #babfc8;border-radius:3px;margin:0;cursor:pointer}.cloud-check input:checked{background:#42a76d;border-color:#42a76d}.cloud-check input:checked:after{content:'✓';display:block;color:white;line-height:16px;font-size:14px;text-align:center}.cloud-check>span{font-size:10px;flex:1}.cloud-check .cloud-brand{flex:none;text-align:center;font-size:7px;font-weight:650;letter-spacing:1px;color:var(--text)}.cloud-brand .icon{width:43px;height:23px;margin:auto}.cloud-brand small{font-size:6px;letter-spacing:.3px;font-weight:400;color:var(--muted);display:block;margin-top:2px}
.payment-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:65px;padding:10px 0 20px}.payment-center{text-align:center;max-width:370px;margin:0 auto;width:100%;padding:7px 0}.payment-center h2{font-size:17px;font-weight:550;margin-bottom:8px}.payment-center>p{font-size:10px;color:var(--secondary);line-height:1.8}.payment-amount{font-size:40px;letter-spacing:-1.9px;font-weight:550;margin:22px 0 15px}.payment-amount small{font-size:19px;letter-spacing:0;margin-right:5px}.qr-placeholder{width:176px;height:176px;border:10px solid #fff;margin:0 auto;box-shadow:0 0 0 1px var(--border);position:relative;border-radius:9px;overflow:hidden}.qr-placeholder svg{image-rendering:pixelated}.qr-demo{position:absolute;inset:0;display:grid;place-content:center;background:#ffffff27}.qr-demo__mark{display:grid;place-items:center;width:42px;height:42px;padding:5px;border:1px solid #a9c8eb88;border-radius:12px;background:linear-gradient(145deg,#253248,#111923);box-shadow:0 4px 12px #243b5b40,inset 0 1px 0 #ffffff2e}.qr-demo__mark svg{display:block;width:31px;height:31px}.demo-warning{font-size:10px!important;color:#b68454!important;margin-top:15px}.countdown{font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:6px;justify-content:center;font-size:10px;color:var(--secondary);margin-top:18px}.countdown .icon{width:13px;height:13px}.payment-center .btn{margin-top:20px;width:100%}.payment-center .link-button{margin-top:12px}.paid-check{width:58px;height:58px;background:#e9f6ee;color:#369165;border:1px solid #d5eadc;border-radius:50%;display:grid;place-items:center;margin:0 auto 20px}.paid-check .icon{width:25px;height:25px}.success-box{padding:25px 20px;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft);margin-top:21px;text-align:left}.success-box strong{font-size:11px;display:flex;align-items:center;gap:6px}.success-box p{font-size:10px;color:var(--secondary);line-height:1.9;margin-top:9px}.orders-page{min-height:calc(100vh - 200px);padding:50px 0 80px}.orders-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:20px}.orders-head h1{font-size:29px;font-weight:600;letter-spacing:-1px}.orders-head p{font-size:11px;color:var(--secondary);margin-top:10px}.order-list{display:flex;flex-direction:column;gap:13px}.order-item{border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:23px;display:flex;align-items:center;gap:18px}.order-item .card-brand{flex:none}.order-item-info{flex:1;min-width:0}.order-item-info h2{font-size:13px;font-weight:550;margin-bottom:6px}.order-item-info p{font-size:10px;color:var(--secondary);line-height:1.8;overflow-wrap:anywhere}.order-item-info small{font-size:9px;color:var(--muted)}.order-item-money{font-size:17px;font-weight:550;white-space:nowrap}.order-status{font-size:9px;padding:5px 8px;border-radius:5px;background:#edf5ee;color:#648a6c}.order-status.pending{background:#fff5e7;color:#b08c54}.order-status.expired{background:var(--surface-soft);color:var(--muted)}.empty-orders{padding:80px 20px;text-align:center;border:1px solid var(--border);border-radius:20px;background:var(--surface)}.empty-orders>.icon{width:35px;height:35px;color:#a1aabd;margin-bottom:20px}.empty-orders h2{font-size:17px;font-weight:550}.empty-orders p{font-size:11px;color:var(--secondary);margin:12px 0 25px}.not-found{min-height:70vh;display:grid;place-content:center;text-align:center;gap:15px}.not-found h1{font-size:50px}.not-found p{font-size:13px;color:var(--secondary)}.dialog-backdrop{position:fixed;inset:0;background:#181f3855;backdrop-filter:blur(8px);z-index:100;display:grid;place-items:center;padding:24px;animation:appear .2s}.dialog{width:100%;max-width:490px;border:1px solid var(--border);border-radius:23px;background:var(--surface);box-shadow:0 25px 100px #27335235;padding:32px;position:relative;max-height:85vh;overflow:auto}.dialog-close{position:absolute;right:19px;top:19px;width:28px;height:28px;padding:5px;color:var(--muted)}.dialog-eyebrow{font-size:9px;letter-spacing:2px;color:var(--muted);margin-bottom:12px}.dialog h2{font-size:24px;font-weight:600;letter-spacing:-.8px;margin-bottom:14px}.dialog>p{font-size:12px;line-height:1.9;color:var(--secondary)}.dialog ol{padding-left:19px;font-size:12px;color:var(--secondary);line-height:2}.dialog-note{margin-top:18px;padding:15px;background:var(--surface-soft);border:1px solid var(--border);border-radius:10px;font-size:11px;color:var(--secondary);line-height:1.9}.dialog .btn{margin-top:20px}.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:150;background:#252b37;color:#fff;padding:13px 21px;font-size:12px;border-radius:12px;box-shadow:0 6px 25px #17223d25;transition:.2s;max-width:calc(100vw - 40px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -8px}}@keyframes logo-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(2deg)}}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1800px){.shell{max-width:1370px}.home-hero{min-height:430px}.hero-copy h1{font-size:59px}.hero-art{height:390px}.product-card{min-height:220px;padding:24px 22px}.product-layout{gap:130px;grid-template-columns:minmax(0,1fr) 430px}.product-stage{height:620px}.stage-art{height:400px}.stage-art>.brand-icon{width:200px;height:200px}.stage-orbit{height:460px}}
@media(max-width:1120px){.shell{padding:0 28px}.header-nav button{padding:10px 17px}.header-actions{gap:13px}.header-actions .locale{display:none}.hero-copy h1{font-size:45px}.product-grid{grid-template-columns:repeat(4,1fr)}.product-card{padding:20px 17px;min-height:207px}.product-layout{gap:35px;grid-template-columns:minmax(0,1fr) 390px}.buy-panel{padding:25px}.checkout-columns{gap:28px;grid-template-columns:minmax(0,1fr) 285px}.checkout-card{padding:27px}.checkout-bottom{gap:18px}.checkout-submit{gap:12px}.checkout-submit>.btn{width:155px}.cloud-check{width:195px}.service-strip{gap:20px}}
@media(max-width:860px){.header-nav button{padding:9px 15px}.header-actions .orders-label{display:none}.site-header{height:86px}.hero-copy h1{font-size:39px}.home-hero{gap:0;min-height:340px}.hero-copy>p{font-size:12px}.hero-art{height:300px}.hero-note{gap:12px;font-size:9px}.hero-note span:last-child{display:none}.product-grid{grid-template-columns:repeat(3,1fr)}.product-layout{gap:22px;grid-template-columns:minmax(0,1fr) 350px}.stage-art>.brand-icon{width:130px;height:130px}.stage-art .orbital-ring{width:260px;height:260px}.buy-panel{padding:23px}.buy-panel h1{font-size:26px}.stage-caption h2{font-size:19px}.stage-caption p{font-size:10px}.product-mini-nav{gap:8px}.product-mini-nav button{width:27px;height:27px;padding:6px}.checkout-columns{grid-template-columns:minmax(0,1fr) 250px;gap:23px}.order-summary{padding:18px}.summary-variant{font-size:26px}.checkout-bottom{align-items:flex-start;flex-direction:column}.checkout-submit{width:100%;justify-content:space-between}.checkout-submit>.btn{width:190px}.payment-layout{gap:35px;grid-template-columns:minmax(0,1fr) 260px}.section-heading h2{font-size:22px}}
@media(max-width:640px){.shell{padding:0 20px}.site-header{height:77px;gap:10px}.wordmark-name{font-size:18px}.wordmark-symbol{width:30px;height:30px;border-radius:9px}.wordmark small{font-size:8px}.header-nav{display:none}.header-actions{gap:15px}.header-actions .orders-label{display:inline}.header-actions .theme-toggle{width:29px;height:29px}.header-actions button{font-size:10px}.home-hero{display:flex;flex-direction:column;align-items:stretch;padding:30px 0 25px;gap:0}.hero-copy{text-align:center;z-index:1}.eyebrow{justify-content:center;font-size:8px;letter-spacing:2px}.eyebrow:before{width:16px}.hero-copy h1{font-size:36px;line-height:1.4;letter-spacing:-1.8px;margin:14px 0 13px}.hero-copy>p{font-size:11px;line-height:1.9}.hero-actions{justify-content:center;gap:16px;margin-top:21px}.hero-actions .btn{min-height:41px;font-size:11px;padding:0 18px}.hero-note{justify-content:center;margin-top:19px;font-size:9px;gap:17px}.hero-art{height:250px;width:100%;max-width:430px;margin:-5px auto 0}.floating-brand{width:43px;height:43px;border-radius:12px}.floating-brand .brand-icon{width:24px;height:24px}.float-x{width:38px;height:38px}.float-gemini{width:34px;height:34px}.float-muse{left:15%}.float-tg{right:11%}.orbit-label{font-size:7px;top:14%;right:2%}.art-caption{font-size:7px;bottom:5px}.collection{padding-top:24px}.section-heading{align-items:flex-start;margin-bottom:18px;gap:12px}.section-heading h2{font-size:21px}.section-heading p{font-size:10px;max-width:180px;line-height:1.7}.search-box{width:135px;height:35px;margin-top:2px}.search-box input{font-size:10px}.collection-toolbar{margin-bottom:17px}.category-tabs{gap:3px;flex-wrap:nowrap;overflow:auto;scrollbar-width:none;margin-right:-20px;padding-right:20px;width:calc(100% + 20px)}.category-tabs button{padding:8px 11px;white-space:nowrap;font-size:10px}.collection-count{display:none}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.product-card{padding:17px 14px 15px;min-height:195px;border-radius:15px}.card-top{margin-bottom:19px}.card-brand{width:38px;height:38px;border-radius:11px}.card-brand .brand-icon{width:24px;height:24px}.card-tag{font-size:7px;padding:3px 4px}.product-card h3{font-size:12px;letter-spacing:-.3px}.product-card .card-description{font-size:9px}.card-price{font-size:17px}.card-bottom{padding-top:21px}.service-strip{grid-template-columns:1fr;gap:18px;padding:25px 2px;margin-top:20px}.service-item{gap:11px}.service-item strong{font-size:11px}.service-item p{font-size:10px}.site-footer{align-items:flex-start;flex-direction:column;gap:13px;padding:23px 0;font-size:9px}.footer-links{gap:17px;flex-wrap:wrap}.footer-links .demo-pill{font-size:7px}.breadcrumb{padding-top:13px;font-size:9px}.product-layout{display:flex;flex-direction:column;gap:0;padding:0 0 30px;min-height:auto}.product-stage{height:265px;width:100%}.stage-kicker{top:14px;font-size:8px;letter-spacing:2px}.stage-art{height:167px;margin-top:5px}.stage-art>.brand-icon{width:100px;height:100px}.stage-art:before{width:200px;height:200px}.stage-art .orbital-ring{width:220px;height:220px}.stage-caption h2{font-size:17px}.stage-caption p{font-size:10px;margin-top:6px}.stage-dots{display:none}.product-mini-nav{margin-top:15px;gap:11px}.product-mini-nav button{width:26px;height:26px;padding:5px;border-radius:8px}.buy-panel{width:100%;padding:24px;border-radius:21px;margin-top:10px}.buy-panel h1{font-size:28px}.variant{min-height:66px;padding:13px}.variant-name{font-size:12px}.variant-detail{font-size:10px}.variant-price{font-size:19px}.field-heading{font-size:12px}.quantity-label{font-size:12px}.quantity-control button{width:29px;height:29px}.text-input{height:45px;font-size:12px}.input-wrap>.icon{top:15px}.form-field>label{font-size:11px}.input-help{font-size:10px}.payment-option{padding:12px}.pay-label{font-size:12px}.pay-label small{font-size:9px}.btn-full{height:47px;font-size:12px}.panel-bottom-note{font-size:9px}.stage-orbit{height:210px;width:100%;margin-top:7px}.stage-orbit .float-x{width:42px;height:42px;left:21%;top:7%}.stage-orbit .float-muse{width:33px;height:33px;bottom:10%;left:24%}.stage-orbit .float-gemini{width:35px;height:35px;right:21%;bottom:15%}.stage-orbit .floating-brand .brand-icon{width:20px;height:20px}.dark-page .product-stage{height:290px}.dark-page .stage-kicker{top:14px}.checkout-main{padding:27px 0 35px}.checkout-progress{gap:10px;font-size:9px;margin-bottom:22px}.progress-line{width:20px}.checkout-card{padding:22px 20px;border-radius:20px}.checkout-header{margin-bottom:23px;gap:10px}.checkout-header h1{font-size:23px}.checkout-header p{font-size:10px;line-height:1.8}.checkout-header .link-button{font-size:9px;white-space:nowrap;padding-top:5px}.checkout-columns{display:flex;flex-direction:column;gap:25px}.notice-alert{padding:14px}.notice-alert p{font-size:10px}.term-row{gap:13px;padding:18px 0}.term-row h3{font-size:12px}.term-row p{font-size:11px}.order-summary{width:100%;padding:20px}.summary-variant{font-size:26px;margin-top:17px}.summary-rows{gap:11px}.summary-row{font-size:11px}.checkout-bottom{padding-top:20px;margin-top:24px;gap:20px}.consent{font-size:11px}.consent input{width:16px;height:16px;margin-top:2px}.consent small{font-size:9px}.checkout-submit{flex-direction:column;align-items:stretch;gap:15px}.checkout-submit>.btn{width:100%;height:47px}.cloud-check{width:100%;max-width:260px;align-self:center;min-height:57px}.cloud-check>span{font-size:11px}.payment-layout{display:flex;flex-direction:column;gap:28px;padding-bottom:0}.payment-center{max-width:300px}.payment-center>p{font-size:11px}.payment-amount{font-size:37px}.orders-page{padding:30px 0 45px}.orders-head h1{font-size:25px}.orders-head .btn{font-size:10px;padding:0 12px;min-height:36px}.orders-head p{font-size:10px}.order-item{padding:17px;gap:12px;flex-wrap:wrap}.order-item-info{flex-basis:calc(100% - 65px)}.order-item-money{margin-left:50px;flex:1}.order-item .link-button{font-size:10px}.dialog{padding:27px 24px}.dialog h2{font-size:22px}.dialog>p{font-size:11px}.toast{font-size:11px;bottom:20px;width:max-content}.empty-orders{padding:60px 20px}}
@media(max-width:360px){.shell{padding:0 15px}.header-actions{gap:9px}.product-card{padding:16px 11px}.card-tag{font-size:6px}.product-card h3{font-size:11px}.card-description{font-size:8px!important}.hero-copy h1{font-size:33px}.buy-panel{padding:20px}.search-box{width:118px}.section-heading h2{font-size:20px}.checkout-card{padding:20px 17px}.wordmark small{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.product-card:hover,.btn-primary:hover{transform:none}}

@media(min-width:861px){.product-card{aspect-ratio:1 / 1}}

/* Keep the mobile category chooser inside the viewport. Four columns fit
   ordinary phones; wider phones can show all five categories in one row. */
@media (max-width: 640px) {
  .category-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
  }
  .category-tabs button {
    min-width: 0;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 8px 4px;
    white-space: nowrap;
    font-size: 10px;
  }
  .category-tabs button span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .category-tabs button small {
    flex: none;
    font-size: 8px;
    line-height: 1.2;
    padding: 1px 4px;
  }
}

@media (min-width: 400px) and (max-width: 640px) {
  .category-tabs {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .category-tabs button {
    padding-inline: 3px;
    font-size: 9px;
  }
  .category-tabs button small {
    padding-inline: 3px;
  }
}

/* Category labels use the Windows UI face first so Chinese glyphs stay crisp
   in the local desktop and phone previews instead of falling back to a thin
   mixed system face. */
.category-tabs button,
.category-tabs button span,
.category-tabs button small {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

.category-tabs button {
  font-weight: 600;
  letter-spacing: 0;
}

.category-tabs button small {
  font-weight: 700;
}


/* The crawlable fallback is not an intermediate screen while the real store boots. */
html.storefront-booting .static-home-intro{visibility:hidden}

/* ./premium.css */
/* Dark collection / visual revision 02. */
.dark-page{--bg:#08090c;--surface:#121419;--surface-soft:#171a20;--text:#f0f1f4;--secondary:#939bad;--muted:#778093;--border:#262a33;--accent:#8ca8ff;--accent-soft:#1a2235;min-height:100vh}
.dark-page .site-header{height:105px}.dark-page .wordmark-name{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-1.05px}
.dark-page .wordmark-symbol{background:linear-gradient(145deg,#f6f7fa,#c8ccd5);box-shadow:inset 0 1px 0 #fff,0 2px 8px #0004;border-radius:10px;color:#14171d}
.dark-page .header-nav{background:linear-gradient(160deg,#191c22,#111318);border-color:#ffffff0c;box-shadow:inset 0 1px 0 #ffffff03;padding:5px}.dark-page .header-nav button.active{background:linear-gradient(150deg,#343941,#282c34);box-shadow:inset 0 1px 0 #ffffff09,0 2px 8px #0002;color:#f3f4f8}
.dark-page .header-actions button{color:#a7afbf}.dark-page .header-actions button:hover{color:#fff}
.home-hero{grid-template-columns:.93fr 1.07fr;gap:5px}.dark-page .home-hero{padding-top:24px;padding-bottom:36px;min-height:430px}
.dark-page .hero-copy h1{font-size:53px;font-weight:560;line-height:1.34;letter-spacing:-2.5px;margin:19px 0 20px}.dark-page .hero-copy h1 span{background:linear-gradient(110deg,#bfc5d3 5%,#7c879e 88%);-webkit-background-clip:text;background-clip:text;color:transparent}
.dark-page .hero-copy>p{color:#8993a6;line-height:1.95;font-size:12px}.dark-page .eyebrow{color:#8a94a9;font-size:9px;letter-spacing:2.7px}.dark-page .hero-actions{margin-top:27px}.dark-page .hero-actions .btn-primary{background:linear-gradient(150deg,#f7f8fa,#d8dce5);color:#1b202a;box-shadow:inset 0 1px 0 #fff,0 3px 15px #0003;border:1px solid #ffffff3b}.dark-page .hero-note{color:#737f94;gap:21px}
.hero-art{height:385px;position:relative}.hero-art:before{display:none}.orbit-canvas{background:transparent;mix-blend-mode:normal;mask-image:none;-webkit-mask-image:none;cursor:default}
body:not(.dark-page) .hero-art{background:transparent;border-radius:0;box-shadow:none}.hero-art .orbit-label{display:none}.art-caption{bottom:4px;font-size:7px;letter-spacing:3px;color:#778299}
.dark-page .floating-brand{background:linear-gradient(145deg,#2b303a 0%,#1b1f27 48%,#151920 100%);border:1px solid #c4d3f226;border-top-color:#dce7ff55;box-shadow:inset 0 1px 1px #ffffff15,0 9px 18px #0006,0 0 22px #769ad509;backdrop-filter:blur(8px);border-radius:14px}
.home-hero .floating-brand{animation:none}
.hero-art .floating-brand{width:46px;height:46px}.hero-art .floating-brand .brand-icon{width:25px;height:25px}.hero-art .float-muse{left:9%;top:13%;transform:perspective(300px) rotateY(12deg) rotateZ(-12deg);color:#4587ff}.hero-art .float-tg{right:3%;top:38%;transform:perspective(300px) rotateY(-16deg) rotateZ(12deg);color:#44b6ef}.hero-art .float-x{left:17%;bottom:13%;width:40px;height:40px;color:#d7dde9;transform:perspective(300px) rotateY(13deg) rotateZ(-10deg)}.hero-art .float-gemini{right:13%;bottom:12%;width:37px;height:37px;transform:perspective(300px) rotateY(-10deg) rotateZ(8deg)}.hero-art .float-gemini .brand-icon{width:23px;height:23px}
.dark-page .collection{border-top-color:#ffffff0a;padding-top:30px}.dark-page .section-heading h2{font-size:24px;font-weight:550;letter-spacing:-.8px}.dark-page .section-heading p{color:#818c9f;font-size:10px;margin-top:9px}.dark-page .section-heading h2 span{border-color:#ffffff14;color:#8b95a8}
.dark-page .category-tabs button{color:#8c96a9;font-size:10px;padding:9px 15px;border-radius:8px}.dark-page .category-tabs button.active{background:linear-gradient(150deg,#20242c,#171a20);border-color:#ffffff13;color:#e6eaf2;box-shadow:inset 0 1px 0 #ffffff04}.dark-page .category-tabs button:hover{color:#d6dce8;background:#181c23}.dark-page .search-box input{background:#12151a;border-color:#ffffff0e;color:#c0c8d8}.dark-page .search-box input::placeholder{color:#747f92}.dark-page .collection-count{color:#8791a4;font-size:9px}
.dark-page .product-grid{gap:16px}.dark-page .product-card{min-height:237px;border-radius:19px;padding:23px 22px 19px;background:linear-gradient(155deg,#1b1e25 0%,#14171d 45%,#101217 100%);border:1px solid #ffffff0b;border-top-color:#ffffff16;box-shadow:inset 0 1px 0 #ffffff04,0 2px 4px #0000000a;isolation:isolate;transition:transform .3s cubic-bezier(.2,.65,.3,1),box-shadow .3s,border-color .3s}
.dark-page .product-card:before{background:radial-gradient(ellipse 100% 75% at 8% 0%,color-mix(in srgb,var(--brand-color) 12%,transparent),transparent 80%);opacity:.28;z-index:-1}.dark-page .product-card:after{content:"";position:absolute;top:0;left:15%;right:15%;height:1px;background:linear-gradient(90deg,transparent,#e1eaff33,transparent);opacity:.6;transition:opacity .3s;pointer-events:none}
.dark-page .product-card:hover{transform:translateY(-5px);border-color:#8e9db137;border-top-color:#c6d5f04d;box-shadow:inset 0 1px 0 #ffffff06,0 18px 36px -20px #000d,0 0 22px -15px var(--brand-color)}.dark-page .product-card:hover:before{opacity:.8}.dark-page .product-card:hover:after{opacity:1}
.dark-page .card-top{margin-bottom:25px;align-items:flex-start}.dark-page .product-card .card-brand{width:49px;height:49px;border-radius:14px;position:relative;background:linear-gradient(145deg,#ffffff0c,#ffffff03);border:1px solid #ffffff0c;border-top-color:#ffffff1b;box-shadow:inset 0 1px 0 #ffffff05,0 4px 8px #0002;transition:transform .3s,box-shadow .3s}.dark-page .product-card .card-brand:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 30% 5%,var(--brand-color),transparent 90%);opacity:.11;border-radius:inherit;pointer-events:none}.dark-page .product-card .card-brand .brand-icon{width:27px;height:27px;position:relative;filter:drop-shadow(0 2px 6px color-mix(in srgb,var(--brand-color) 13%,transparent))}.dark-page .product-card:hover .card-brand{transform:translateY(-2px) rotate(-3deg);box-shadow:inset 0 1px 0 #ffffff08,0 6px 12px #0003}
.dark-page .product-card[data-product="muse"] .brand-icon,.dark-page .product-card[data-product="muse-token"] .brand-icon{color:#4683ff}.dark-page .product-card[data-product="telegram"] .brand-icon{color:#46b8eb}.dark-page .product-card[data-product="x"] .brand-icon{color:#eef1f6}.dark-page .product-card[data-product="apple"] .brand-icon{color:#cbd0da}.dark-page .product-card[data-product="chatgpt"] .brand-icon{color:#80bdab}.dark-page .product-card[data-product="claude"] .brand-icon{color:#dfac8f}.dark-page .product-card[data-product="youtube"] .brand-icon{color:#f16065}.dark-page .product-card[data-product="spotify"] .brand-icon{color:#57c37f}
.dark-page .card-tag{margin-top:3px;color:#98a3b7;background:#ffffff04;border-color:#ffffff08;padding:4px 7px;border-radius:5px;font-size:8px}.dark-page .product-card h3{font-size:14px;font-weight:560;letter-spacing:-.25px;color:#e7eaf1;margin-bottom:8px}.dark-page .product-card .card-description{font-size:10px;color:#8692a7;line-height:1.8;white-space:normal}.dark-page .card-bottom{border-top:1px solid #ffffff07;margin-top:23px;padding-top:17px}.dark-page .card-price{font-size:21px;letter-spacing:-.9px;font-weight:480;color:#e8ecf5;font-variant-numeric:tabular-nums}.dark-page .card-price small{font-size:10px;font-weight:450;color:#a3adbe;margin-right:3px}.dark-page .card-price em{font-size:8px;color:#788499;margin-left:5px}.dark-page .card-bottom>.icon{width:26px;height:26px;padding:6px;color:#a6b1c7;background:#ffffff04;border:1px solid #ffffff08;border-radius:50%;transition:background .2s,color .2s,transform .2s}.dark-page .product-card:hover .card-bottom>.icon{color:#e3ebff;background:#ffffff0b;transform:translateX(2px);border-color:#ffffff18}
.dark-page .buy-panel,.dark-page .checkout-card{background:linear-gradient(145deg,#191c23,#111419 70%);border:1px solid #ffffff0e;border-top-color:#ffffff19;box-shadow:inset 0 1px 0 #ffffff03,0 22px 75px -40px #000b}.dark-page .buy-panel h1{font-weight:560;color:#f0f1f6}.dark-page .variant{background:#15181e;border-color:#ffffff0b}.dark-page .variant.selected{background:linear-gradient(140deg,#24304b66,#1a2336);border-color:#89a5fd66;box-shadow:inset 0 1px 0 #bdd0ff08}.dark-page .variant-name{color:#dce2ed}.dark-page .variant-detail{color:#8390a5}.dark-page .variant-price{font-weight:480}.dark-page .text-input{background:#101319;border-color:#ffffff0c;color:#d8dfed}.dark-page .payment-option{background:#15181e;border-color:#ffffff0b}.dark-page .payment-option.selected{background:#1b2538;border-color:#89a5fd66}.dark-page .order-summary{background:linear-gradient(145deg,#20253088,#14181f);border-color:#ffffff0b}.dark-page .summary-recipient{background:#0f131a;border-color:#ffffff0b}.dark-page .cloud-check{background:#171a21;border-color:#ffffff12}.dark-page .cloud-brand{color:#d4d8e1}
.dark-page .product-mini-nav button[style*="#202229"]{color:#e4e9f2!important}.dark-page .product-mini-nav button[style*="#545762"]{color:#bac3d5!important}
.product-consent-row{display:flex;align-items:center;gap:3px;margin-top:21px;font-size:10px;color:var(--secondary)}.product-consent-row label{display:flex;align-items:center;gap:7px;cursor:pointer}.product-consent-row input{width:13px;height:13px;margin:0;accent-color:var(--accent);cursor:pointer}.product-consent-row button{font-size:10px;color:var(--accent);padding:0;text-decoration:underline;text-underline-offset:2px}.dark-page .product-consent-row{color:#8d99af}.product-consent-row~.panel-total{margin-top:20px}.product-terms-dialog .term-row{padding:16px 0}.product-terms-dialog .term-row p{font-size:11px}.product-terms-dialog .btn{width:100%}
@media(min-width:1800px){.dark-page .hero-copy h1{font-size:58px}.dark-page .home-hero{min-height:450px}.hero-art{height:410px}.dark-page .product-card{min-height:245px;padding:25px 23px 20px}}
@media(max-width:1120px){.dark-page .hero-copy h1{font-size:45px}.hero-art{height:350px}.dark-page .product-card{padding:21px 18px 17px;min-height:228px}.dark-page .card-top{margin-bottom:22px}}
@media(max-width:860px){.dark-page .hero-copy h1{font-size:39px}.hero-art{height:310px}.dark-page .home-hero{min-height:365px}.dark-page .hero-copy>p{font-size:11px}.hero-art .float-muse{left:4%;top:12%}.hero-art .float-tg{right:0%;top:38%}}
@media(max-width:640px){.dark-page .site-header{height:77px}.home-hero,.dark-page .home-hero{padding-top:14px;padding-bottom:20px;min-height:0}.home-hero .hero-copy h1{font-size:22px;font-weight:450;line-height:1.4;letter-spacing:-.7px;margin:9px 0 8px;white-space:nowrap}.home-hero .hero-copy h1 br{display:none}.home-hero .hero-copy h1 span{margin-left:.2em}.home-hero .hero-copy>p{font-size:10px;line-height:1.65;max-width:330px;margin:0 auto}.home-hero .hero-copy>p br{display:none}.home-hero .hero-actions{margin-top:13px;gap:13px}.home-hero .hero-actions .btn{min-height:38px;font-size:10px;padding:0 15px}.dark-page .eyebrow{font-size:7px}.home-hero .hero-note{font-size:8px;gap:15px;margin-top:11px}.hero-art{height:270px;max-width:450px;margin:6px auto 0}.hero-art .floating-brand{width:35px;height:35px;border-radius:11px}.hero-art .floating-brand .brand-icon{width:21px;height:21px}.hero-art .float-muse{left:8%;top:16%}.hero-art .float-tg{right:4%;top:40%}.hero-art .float-x{left:15%;bottom:14%;width:31px;height:31px}.hero-art .float-gemini{right:13%;bottom:13%;width:30px;height:30px}.art-caption{font-size:6px;bottom:6px;letter-spacing:2.6px}.dark-page .section-heading h2{font-size:21px}.dark-page .section-heading p{font-size:9px}.dark-page .category-tabs button{padding:8px 10px;font-size:9px}.dark-page .product-grid{gap:11px}.dark-page .product-card{padding:18px 14px 15px;border-radius:15px;min-height:222px}.dark-page .card-top{margin-bottom:22px;align-items:center}.dark-page .product-card .card-brand{width:42px;height:42px;border-radius:12px}.dark-page .product-card .card-brand .brand-icon{width:25px;height:25px}.dark-page .card-tag{font-size:6px;padding:3px 4px;margin:0}.dark-page .product-card h3{font-size:12px;font-weight:550;letter-spacing:-.25px}.dark-page .product-card .card-description{font-size:9px;line-height:1.7}.dark-page .card-bottom{margin-top:20px;padding-top:14px}.dark-page .card-price{font-size:19px}.dark-page .card-bottom>.icon{width:24px;height:24px;padding:5px}.product-consent-row{font-size:10px}.product-consent-row input{width:15px;height:15px}.dark-page .header-nav{display:none}}
@media(max-width:360px){.dark-page .product-card{padding:16px 11px 14px}.dark-page .card-tag{font-size:6px;padding:3px}.dark-page .product-card h3{font-size:11px}.dark-page .product-card .card-description{font-size:8px}}
@media(prefers-reduced-motion:reduce){.dark-page .product-card:hover,.dark-page .product-card:hover .card-brand{transform:none}}
.footer-links a{font-size:10px;color:var(--secondary);display:flex;gap:5px;align-items:center;text-decoration:none}.footer-links a:hover{color:var(--text)}
.dark-page .card-brand .brand-icon,.dark-page .floating-brand .brand-icon{filter:saturate(.55)}
.dark-page .card-brand svg path[fill="url(#gemini)"],.dark-page .floating-brand svg path[fill="url(#gemini)"]{fill:#a8b6e1}
.dark-page .card-brand svg path[fill="white"],.dark-page .card-brand svg g[stroke="white"]{fill:#161b23;stroke:#161b23}
.dark-page .card-brand svg path[fill="white"]{stroke:none}
.dark-page .card-brand svg g[stroke="white"]{fill:none}
.dark-page .pay-mark{box-shadow:inset 0 1px 0 #ffffff1c,0 2px 6px #0003;border:1px solid #ffffff13;background:linear-gradient(145deg,#2b3c58,#1c293e);color:#b0ccf4}
.dark-page .pay-mark.usdt{background:linear-gradient(145deg,#254039,#172d29);color:#99c4b1}
.dark-page .recommend{background:#28344d;color:#a9bff4}.dark-page .stage-art:before{opacity:.35}.dark-page .stage-art>.brand-icon{filter:saturate(.55) drop-shadow(0 0 25px #c0d3ff0a)}
.dark-page .summary-title .brand-icon{color:#bccbea}.dark-page .product-stage[aria-label="X Premium 产品展示"] .stage-caption{position:relative}
@media(max-width:640px){.shell.checkout-main{padding:27px 16px 35px}.shell.orders-page{padding:30px 20px 45px}.checkout-card{padding:22px 18px}.checkout-header{flex-wrap:wrap}.checkout-header>div{flex:1;min-width:190px}.payment-option{gap:7px;padding:11px 9px}.pay-label small{font-size:8px}.checkout-progress{font-size:8px;gap:8px}.progress-line{width:15px}.terms-contact{flex-wrap:wrap}.summary-title{flex-wrap:wrap}}

/* Mobile payment result pages use a calmer reading hierarchy. */
@media (max-width:640px) {
  .checkout-main:has(.payment-layout) .checkout-card { padding: 22px 18px 26px; }
  .checkout-main:has(.payment-layout) .checkout-header { align-items: flex-start; gap: 8px; margin-bottom: 22px; }
  .checkout-main:has(.payment-layout) .checkout-header > div { min-width: 0; flex: 1 1 auto; }
  .checkout-main:has(.payment-layout) .checkout-header h1 { font-size: 22px; line-height: 1.3; letter-spacing: -.7px; }
  .checkout-main:has(.payment-layout) .checkout-header p { margin-top: 7px; font-size: 11px; line-height: 1.65; }
  .checkout-main:has(.payment-layout) .checkout-header .link-button { flex: 0 0 auto; padding-top: 3px; font-size: 10px; }
  .checkout-main:has(.payment-layout) .payment-layout { gap: 24px; }
  .checkout-main:has(.payment-layout) .payment-center { padding: 0 2px; }
  .checkout-main:has(.payment-layout) .payment-center h2 { font-size: 18px; line-height: 1.35; margin-bottom: 8px; }
  .checkout-main:has(.payment-layout) .payment-center > p { font-size: 11px; line-height: 1.7; }
  .checkout-main:has(.payment-layout) .paid-check { width: 56px; height: 56px; margin-bottom: 16px; }
  .checkout-main:has(.payment-layout) .success-box { padding: 18px 16px; margin-top: 18px; border-radius: 13px; }
  .checkout-main:has(.payment-layout) .success-box strong { font-size: 11px; line-height: 1.5; }
  .checkout-main:has(.payment-layout) .success-box p { margin-top: 8px; font-size: 10px; line-height: 1.7; }
  .checkout-main:has(.payment-layout) .payment-center .btn { min-height: 44px; margin-top: 18px; font-size: 11px; }
  .checkout-main:has(.payment-layout) .payment-center .link-button { margin-top: 11px; font-size: 10px; }
}


/* The artwork has its own natural alpha edge, so the layout adds no picture mask. */
.orbit-canvas{background:transparent;mix-blend-mode:normal;mask-image:none;-webkit-mask-image:none;cursor:default}
@media(max-width:640px){.home-hero>.hero-art{height:250px;margin-top:0}.home-hero,.dark-page .home-hero{padding-bottom:12px}}

/* Short landscape phones keep the small headline and a complete first-screen artwork. */
@media(min-width:641px) and (max-width:960px) and (max-height:500px){
 body:has(.home-hero) .site-header{height:64px}
 .home-hero,.dark-page .home-hero{display:grid;grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);gap:12px;min-height:0;padding-top:8px;padding-bottom:10px}
 .home-hero .hero-copy h1{font-size:22px;font-weight:450;line-height:1.4;letter-spacing:-.7px;margin:9px 0 8px;white-space:nowrap}
 .home-hero .hero-copy h1 br{display:none}
 .home-hero .hero-copy h1 span{margin-left:.2em}
 .home-hero .hero-copy>p{font-size:10px;line-height:1.65;max-width:330px}
 .home-hero .hero-copy>p br{display:none}
 .home-hero .eyebrow{font-size:7px;letter-spacing:2px}
 .home-hero .hero-actions{margin-top:13px;gap:13px;flex-wrap:wrap}
 .home-hero .hero-actions .btn{min-height:38px;font-size:10px;padding:0 15px}
 .home-hero .hero-note{font-size:8px;gap:15px;margin-top:11px}
 .home-hero>.hero-art{width:100%;max-width:none;height:min(280px,calc(100svh - 98px));min-height:0;margin:0}
}



/* Homepage black-hole tiles use one shared frame so the four brands read as a set. */
.home-hero .hero-art .floating-brand,
.home-hero .hero-art .float-x,
.home-hero .hero-art .float-gemini {
  width: 46px;
  height: 46px;
}
.home-hero .hero-art .floating-brand .brand-icon {
  width: 25px;
  height: 25px;
}
@media (max-width: 640px) {
  .home-hero .hero-art .floating-brand,
  .home-hero .hero-art .float-x,
  .home-hero .hero-art .float-gemini {
    width: 35px;
    height: 35px;
  }
  .home-hero .hero-art .floating-brand .brand-icon {
    width: 21px;
    height: 21px;
  }
}

/* Keep the four homepage tiles visually identical after the size reset. */
.home-hero .hero-art .floating-brand {
  transform: rotate(-8deg);
}

/* ./intro.css */
html{scrollbar-gutter:stable}
html:has(body.dark-page){background:#08090c;color-scheme:dark}
.hero-art{transform-origin:50% 50%}
/* Keep the desktop nebula and its orbiting marks comfortably inside the page. */
@media (min-width:961px){.home-hero>.hero-art{left:clamp(-50px,-3vw,-24px)}}
.hero-art .floating-brand{animation:none;translate:none}
.arrival-layer{position:fixed;inset:0;z-index:180;pointer-events:none;overflow:hidden}
.arrival-layer *{pointer-events:none}
.arrival-veil{position:absolute;inset:0;background:#08090c}
.arrival-portal{position:absolute;transform-origin:50% 50%;will-change:transform,opacity}
.arrival-portal canvas{display:block;width:100%;height:100%}
.arrival-badges.hero-art{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;background:none;border:0;border-radius:0;box-shadow:none}
.arrival-badges.hero-art:before{display:none}
.hero-art .float-muse{left:23%;top:31%;color:#b5ccf2}
.hero-art .float-tg{right:3%;top:35%;color:#b5ccf2}
.hero-art .float-x{left:9%;bottom:19%;color:#b5ccf2}
.hero-art .float-gemini{right:14%;bottom:12%;color:#b5ccf2}
.arrival-signature{position:absolute;left:38px;top:30px;display:flex;align-items:center;gap:11px;color:#e3e7ef;letter-spacing:.5px;font:600 17px/1.2 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-shadow:0 2px 12px #0008}
.arrival-signature svg{width:30px;height:30px}.arrival-signature small{display:block;margin-top:4px;color:#8d98ab;font-size:6px;font-weight:450;letter-spacing:2px}
.arrival-caption{position:absolute;left:50%;bottom:48px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;white-space:nowrap;color:#d5deed;font-size:12px;letter-spacing:2.4px;text-shadow:0 2px 14px #000}
.arrival-caption small{color:#7b899f;font:450 7px/1.4 Inter,sans-serif;letter-spacing:3px}
@media(max-width:640px){.arrival-signature{top:24px;left:25px;font-size:15px}.arrival-signature svg{width:25px;height:25px}.arrival-caption{bottom:35px;font-size:10px;letter-spacing:1.8px}.arrival-caption small{font-size:6px}}
@media(max-height:500px){.arrival-signature{top:16px;left:24px;font-size:13px}.arrival-signature svg{width:23px;height:23px}.arrival-caption{bottom:18px;font-size:10px;gap:7px}.arrival-caption small{font-size:6px}}
.scene-replay{position:absolute;right:4px;bottom:2px;display:flex;align-items:center;gap:5px;font-size:8px;color:#737f96;padding:5px 7px;border:1px solid #a5c2f011;border-radius:6px;background:#0c101860;backdrop-filter:blur(5px);z-index:2;transition:color .2s,border-color .2s}
.scene-replay .icon{width:12px;height:12px}.scene-replay:hover{color:#d8e5fd;border-color:#bad1ff38}
body:not(.dark-page) .scene-replay{color:#a5b3cc;right:12px;bottom:10px}
@media(max-width:640px){.scene-replay{font-size:7px;right:1px;bottom:1px;padding:4px;gap:3px}.scene-replay .icon{width:10px;height:10px}}

/* Individual translate leaves the resting tilt and entrance transforms intact. */
@supports (translate:1px 1px) and selector(body:has(.arrival-layer)){
 .home-hero>.hero-art .floating-brand{--drift-x:3px;--drift-y:6px;--drift-sign:1;animation:nova-brand-drift 4.4s ease-in-out infinite}
 .home-hero>.hero-art .float-muse{animation-duration:4.4s;animation-delay:-.8s}
 .home-hero>.hero-art .float-tg{--drift-sign:-1;animation-duration:5.2s;animation-delay:-2.1s}
 .home-hero>.hero-art .float-x{animation-duration:3.9s;animation-delay:-1.5s}
 .home-hero>.hero-art .float-gemini{--drift-sign:-1;animation-duration:4.8s;animation-delay:-3.4s}
 body:has(.arrival-layer) .home-hero>.hero-art .floating-brand{animation-play-state:paused}
 @keyframes nova-brand-drift{0%,100%{translate:calc(var(--drift-x)*var(--drift-sign)*-.7) calc(var(--drift-y)*.8)}50%{translate:calc(var(--drift-x)*var(--drift-sign)) calc(var(--drift-y)*-1)}}
 @media(max-width:640px),(min-width:641px) and (max-width:960px) and (max-height:500px){.home-hero>.hero-art .floating-brand{--drift-x:2px;--drift-y:4px}}
 @media(prefers-reduced-motion:reduce){.home-hero>.hero-art .floating-brand{animation:none;translate:none}}
}
.arrival-badges .floating-brand{animation:none;translate:none;transform-origin:50% 50%;will-change:transform,opacity,filter}
.arrival-badges.hero-art .floating-brand{background:linear-gradient(145deg,#29364aea,#101823ed);border:1px solid #c5d6ef38;border-top-color:#e2ecff66;border-radius:25%;box-shadow:inset 0 1px 1px #ffffff12,0 10px 28px #0007;color:#c5d9f3;backdrop-filter:blur(8px)}
.arrival-badges.hero-art .floating-brand .brand-icon{width:54%;height:54%;color:#c5d9f3;filter:saturate(.4)}
.arrival-badges.hero-art .brand-icon svg path[fill^="url("]{fill:#b9cff1}
html:has(.arrival-layer--cinematic){color-scheme:dark;scrollbar-color:#444d5b #08090c}
.arrival-layer--cinematic .arrival-veil{background:radial-gradient(ellipse at 92% 49%,#121b2a 0,#090c12 40%,#06080c 85%)}
.cinematic-stars,.cinematic-sparks{position:absolute;inset:0;overflow:hidden}
.cinematic-star,.cinematic-spark{position:absolute;display:block;border-radius:50%;background:#daeaff;box-shadow:0 0 7px 2px #a9ceff55}
.cinematic-spark{width:3px;height:3px;box-shadow:0 0 9px 2px #9fc8ff88}
.arrival-layer--cinematic .arrival-icon:before{content:'';position:absolute;left:-70%;top:47%;width:80%;height:1px;background:linear-gradient(90deg,transparent,#c0dcff88);filter:blur(1px)}

/* Keep the storefront out of the first paint until the opening owns the frame. */
body.opening-pending #app { visibility: hidden; }


/* ./starlight-opening.css */
.starlight-opening{position:fixed;inset:0;z-index:180;overflow:hidden;pointer-events:none;background:transparent}
.starlight-opening *{pointer-events:none}
.starlight-backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 51% 48%,#131c29 0,#080b11 48%,#05070b 100%)}
.starlight-particles,.starlight-marks{position:absolute;inset:0;width:100%;height:100%}
.starlight-art{position:absolute;transform-origin:center;will-change:transform,opacity}
.starlight-image{display:block;width:100%;height:100%;object-fit:contain}
.starlight-material{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.starlight-glow{position:absolute;width:min(36vw,350px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#d5e9ff55 0,#98bdff24 18%,transparent 67%);filter:blur(18px)}
.starlight-ring{position:absolute;aspect-ratio:1;transform:translate(-50%,-50%);opacity:0;mix-blend-mode:screen}
.starlight-ring span{display:block;width:100%;height:100%;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg,#eaf6ffbb 18deg,transparent 43deg,transparent 172deg,#c9dcff99 201deg,transparent 229deg);-webkit-mask:radial-gradient(circle,transparent 57%,#000 62%,#000 65%,transparent 70%);mask:radial-gradient(circle,transparent 57%,#000 62%,#000 65%,transparent 70%);filter:blur(1px)}
.starlight-mark{position:absolute;left:0;top:0;width:clamp(44px,5vw,70px);height:clamp(44px,5vw,70px);display:grid;place-items:center;color:#d9e8f9;opacity:0;filter:drop-shadow(0 0 9px #a6cbff99);will-change:transform,opacity}
.starlight-mark svg{width:82%;height:82%;filter:saturate(.25)}
.starlight-mark svg path[fill^="url("]{fill:#d6e8ff}
html:has(.starlight-opening){scrollbar-color:#444d5b #08090c;color-scheme:dark}
@media(max-width:640px){.starlight-mark{width:46px;height:46px}.starlight-glow{width:42vw}}

/* ./reading-countdown.css */
.consent.reading-locked,.consent.reading-locked input{cursor:wait}
.consent.reading-locked input{opacity:.45}
.consent #reading-status{font-variant-numeric:tabular-nums}
.consent.reading-locked #reading-status{color:var(--accent)}
#checkout-submit{font-variant-numeric:tabular-nums}

/* ./brand.css */
/* The supplied transparent lockup is shown as one complete image. The
   intrinsic transparent padding is preserved, so the NOVA/O globe, blue edge
   light and SELECT mark are never cropped or rebuilt from separate pieces. */
/* Keep every inline brand wrapper optically centered, including marks with
   asymmetric shapes such as Apple, X and Gmail. */
.brand-icon { align-items: center; justify-content: center; }
.brand-icon > svg { display: block; margin: 0; }
.site-header .wordmark{display:inline-flex;flex:none;align-items:center;justify-content:center;width:190px;height:72px;padding:0;overflow:visible;border-radius:12px;background:transparent;box-shadow:none;transition:opacity .25s}
.site-header .wordmark:is(:hover,:focus-visible){background:transparent;box-shadow:none;opacity:.88}
.site-header .wordmark:focus-visible{outline:2px solid #82aaf2;outline-offset:3px}
.space-brand{display:block;position:relative;flex:none;width:100%;height:100%;overflow:visible;color:#263a58}
.dark-page .space-brand{color:#eef4ff}
.space-brand__lockup{position:absolute;display:block;left:50%;top:50%;width:100%;height:auto;max-width:none;transform:translate(-50%,-50%);user-select:none;-webkit-user-drag:none}
.space-brand__legacy{position:absolute;inset:0;visibility:hidden;pointer-events:none}
.space-brand__mark{display:block;flex:none;width:68px;height:42px;background:url('./assets/nova-official-mark.png') center / contain no-repeat;mask-image:radial-gradient(ellipse 52% 55% at center,#000 65%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 52% 55% at center,#000 65%,transparent 100%)}
.space-brand__name{display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;line-height:1;color:inherit}
.space-brand__word{display:block;position:relative;width:84px;height:17px;background:url('./assets/nova-official-word-dark.png') center / contain no-repeat}
body:not(.dark-page) .site-header .space-brand__word,body:not(.dark-page) .gravity-logo--arrival .space-brand__word{background-image:url('./assets/nova-official-word-light.png')}
.space-brand__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header .space-brand__name small{display:block;margin-top:4px;color:#52647e;font-size:7px;font-weight:600;letter-spacing:1.1px;line-height:1;white-space:nowrap}
.dark-page .site-header .space-brand__name small{color:#a8bad3}
@media(max-width:640px){.site-header .wordmark{width:164px;height:62px}.space-brand__mark{width:59px;height:38px}.space-brand__word{width:76px;height:15px}.site-header .space-brand__name small{font-size:6.5px;margin-top:4px}}
@media(prefers-reduced-motion:reduce){.site-header .wordmark{transition:none}}
/* A compact, recognizable orders action for both colour themes. */
.site-header .header-actions > button[data-action="orders"] {
  min-height: 36px;
  padding: 0 12px;
  gap: 7px;
  border: 1px solid #a8b9d22b;
  border-radius: 12px;
  background: linear-gradient(145deg, #202a39, #151c28);
  color: #e8effb;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  box-shadow: inset 0 1px 0 #ffffff0c, 0 4px 12px #0000001a;
  transition: background .25s, border-color .25s, color .25s, transform .25s, box-shadow .25s;
}
.site-header .header-actions > button[data-action="orders"] .icon {
  width: 15px;
  height: 15px;
  color: #b7cbea;
}
@media (hover:hover) {
  .site-header .header-actions > button[data-action="orders"]:hover {
    border-color: #a6c5ee70;
    background: linear-gradient(145deg, #2b394f, #1a2638);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: inset 0 1px 0 #ffffff17, 0 6px 16px #00000025;
  }
}
.site-header .header-actions > button[data-action="orders"]:active { transform: scale(.97); }
.site-header .header-actions > button[data-action="orders"]:focus-visible { outline: 2px solid #83abeb; outline-offset: 3px; }
body:not(.dark-page) .site-header .header-actions > button[data-action="orders"] {
  border-color: #cbd7e7;
  background: linear-gradient(145deg, #fff, #edf3fa);
  color: #34465f;
  box-shadow: inset 0 1px 0 #fff, 0 4px 12px #526b8b12;
}
body:not(.dark-page) .site-header .header-actions > button[data-action="orders"] .icon { color: #526f96; }
@media (hover:hover) {
  body:not(.dark-page) .site-header .header-actions > button[data-action="orders"]:hover {
    border-color: #91abd0;
    background: #f8fbff;
    color: #243d60;
    box-shadow: inset 0 1px 0 #fff, 0 6px 16px #526b8b20;
  }
}
@media (max-width:640px) {
  .site-header .header-actions > button[data-action="orders"] { min-height: 34px; padding: 0 9px; gap: 6px; border-radius: 11px; font-size: 10.5px; }
  .site-header .header-actions > button[data-action="orders"] .icon { width: 14px; height: 14px; }
}
@media (max-width:360px) {
  .site-header .header-actions > button[data-action="orders"] { padding: 0 7px; }
}
@media (prefers-reduced-motion:reduce) {
  .site-header .header-actions > button[data-action="orders"] { transition: none; }
  .site-header .header-actions > button[data-action="orders"]:is(:hover, :active) { transform: none; }
}
/* Keep the order name visible on tablet widths as well as phones. */
@media (min-width:641px) and (max-width:860px) {
  .site-header .header-actions .orders-label { display: inline; }
}
@media (min-width:641px) and (max-width:680px) {
  .site-header .header-actions > button[data-action="orders"] { padding: 0 7px; font-size: 11px; }
}

/* The supplied planet sits above the complete NOVA SELECT / 星选 artwork.
   Both original transparent images retain every pixel and their natural ratio. */
.site-header .wordmark { width: 136px; height: 100px; }
.site-header, .dark-page .site-header { height: 116px; }
.space-brand__planet, .space-brand__lockup {
  position: absolute;
  display: block;
  left: 50%;
  width: 100%;
  height: auto;
  max-width: none;
  transform: translateX(-50%);
  user-select: none;
  -webkit-user-drag: none;
}
.space-brand__planet { top: -16%; }
.space-brand__lockup { top: 31%; }
@media (max-width: 640px) {
  .site-header .wordmark {
    width: clamp(68px, 18.5vw, 78px);
    height: clamp(52px, 14.2vw, 60px);
  }
  .site-header, .dark-page .site-header { height: clamp(74px, 19vw, 82px); }
}

/* The planet drifts gently while the wordmark stays crisp and readable. */
@media (prefers-reduced-motion: no-preference) {
  .site-header .space-brand__planet { animation: nova-logo-drift 5.5s ease-in-out infinite; }
  @keyframes nova-logo-drift {
    0%, 100% { transform: translateX(-50%) translateY(0) rotate(-1deg); }
    50% { transform: translateX(-50%) translateY(-2px) rotate(1deg); }
  }
}
/* Soften the faint matte specks against the light theme while retaining the
   supplied artwork, including its black centre and blue edge light. */
body:not(.dark-page) .space-brand__planet {
  filter: url('./assets/nova-light-edge.svg#clean') brightness(1.08) saturate(.96);
}

/* A calm, legible wordmark supports the planet rather than repeating it. */
.space-brand .space-brand__lockup {
  top: 59%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  text-align: center;
  line-height: 1;
  color: #243b5b;
}
.space-brand__title {
  display: block;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .16em;
  padding-left: .16em;
}
.space-brand__subtitle {
  display: block;
  color: #567497;
  font-size: 7px;
  font-weight: 650;
  letter-spacing: .13em;
  white-space: nowrap;
}
.space-brand__subtitle i { font-style: normal; opacity: .65; padding: 0 .1em; }
body.dark-page .space-brand .space-brand__lockup { color: #e1ecfa; }
body.dark-page .space-brand__subtitle { color: #a9c2e0; }
@media (max-width: 640px) {
  .space-brand__title { font-size: clamp(12px, 3.4vw, 14px); }
  .space-brand__subtitle { font-size: clamp(4.4px, 1.2vw, 5.1px); }
}

/* ./orders-dialog.css */
.orders-dialog-backdrop{padding:20px;background:#15203642;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.orders-dialog #orders-lookup-form textarea{height:auto;min-height:92px;padding:12px 16px;resize:vertical}
.buy-panel textarea.text-input{height:auto;min-height:92px;padding:10px 13px;resize:vertical;font-family:inherit;line-height:1.6}
.orders-dialog{--orders-ink:#25282f;--orders-muted:#7e8a9e;--orders-line:#dce1eb;--orders-field:#fcfcff;color:var(--orders-ink);background:#fff;border:1px solid #e9ecf1;border-radius:24px;width:100%;max-width:440px;max-height:calc(100dvh - 40px);padding:34px 32px 28px;overflow:auto;box-shadow:0 24px 100px #26334d25}
.orders-dialog h2{margin:0;font-size:26px;font-weight:650;line-height:1.35;letter-spacing:-.8px}
.orders-dialog .dialog-close{top:17px;right:17px;display:grid;place-items:center;width:30px;height:30px;padding:6px;border:0;border-radius:50%;background:#f3f4f6;color:#8993a2}
.orders-dialog .dialog-close:hover{background:#e8ebf1;color:#3b4658}
#orders-lookup-form{margin-top:27px}
#orders-lookup-form label{display:block;color:var(--orders-muted);font-size:12px;line-height:1.5;margin:0 0 8px}
#orders-lookup-form :is(input,textarea){display:block;width:100%;min-width:0;height:47px;margin:0 0 15px;padding:0 16px;border:1px solid var(--orders-line);border-radius:11px;background:var(--orders-field);color:var(--orders-ink);font-family:inherit;font-size:13px;line-height:1.5;transition:border-color .15s,box-shadow .15s}
#orders-lookup-form :is(input,textarea)::placeholder{color:#a1aaba;opacity:1}
#orders-lookup-form :is(input,textarea):focus{outline:none;border-color:#8998b4;box-shadow:0 0 0 3px #7e95c514}
#orders-lookup-form :is(input,textarea)[aria-invalid=true]{border-color:#be6e70}
.orders-dialog .orders-token-help{margin:-6px 0 13px;color:#758094;font-size:11px;line-height:1.7}
.orders-dialog .orders-lookup-error{margin:0;color:#b94b53;font-size:11px;line-height:1.7}
.orders-lookup-error:not(:empty){padding-bottom:12px}
.orders-dialog .orders-query-button{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;min-height:47px;margin:0;border:1px solid #292c33;border-radius:11px;background:#292c33;color:#fff;font-size:12px;font-weight:550;box-shadow:0 2px 3px #2025360a}
.orders-dialog .orders-query-button:hover{background:#3a3f49;border-color:#3a3f49}
.orders-query-button .icon,.orders-recent-row .icon,.orders-all-button .icon{width:16px;height:16px;flex:none}
.orders-recent{margin-top:25px}
.orders-recent h3{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 9px;font-size:12px;line-height:1.6;font-weight:400;color:var(--orders-muted)}
.orders-recent h3 span{font-size:10px;color:#99a2b1}
.orders-recent-list{display:grid;gap:8px;max-height:300px;overflow:auto;scrollbar-width:thin}
.orders-recent-row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;width:100%;min-height:78px;padding:13px 15px;text-align:left;border:1px solid var(--orders-line);border-radius:11px;background:var(--orders-field);color:#596b88}
.orders-recent-row span{min-width:0;font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.orders-dialog .orders-recent-copy{display:grid;flex:1;gap:4px;min-width:0;font:inherit}
.orders-dialog .orders-recent-title{color:var(--orders-ink);font-family:inherit;font-size:14px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.orders-dialog .orders-recent-spec{color:var(--orders-muted);font-family:inherit;font-size:11px;line-height:1.55}
.orders-dialog .orders-recent-number{color:var(--orders-muted);font-size:10px;line-height:1.6;letter-spacing:.15px}
.orders-dialog .orders-recent-price{display:grid;flex:none;justify-items:end;gap:4px;max-width:96px;font:inherit;text-align:right}
.orders-dialog .orders-recent-price strong{color:var(--orders-ink);font-size:16px;line-height:1.5;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.orders-dialog .orders-recent-price small{color:var(--orders-muted);font-size:10px;line-height:1.5}
.orders-page .orders-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 16px;margin-bottom:24px}
.orders-page .orders-head h1{margin:0;font-size:clamp(25px,3vw,30px);line-height:1.4}
.orders-page .orders-head>p{grid-column:1/-1;margin:0;font-size:12px;line-height:1.8}
.orders-page .orders-head>.btn{min-height:40px;margin:0;padding:8px 14px;font-size:12px;white-space:nowrap}
.orders-recent-row:hover{border-color:#9cabc4;background:#f3f6fc}
.orders-empty-note{font-size:12px;line-height:1.7;color:var(--orders-muted);padding:14px 15px;border:1px dashed var(--orders-line);border-radius:11px}
.orders-dialog .orders-local-note{margin:14px 0 0;font-size:10px;line-height:1.7;color:var(--orders-muted)}
.orders-all-button{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:15px;padding:6px 0;color:#7486a5;font-size:11px;line-height:1.5}
.orders-all-button:hover{color:#3f5c8b}
.order-credential-card{margin-top:20px;padding-top:17px;border-top:1px solid var(--border)}
.order-credential-card strong{font-size:12px;font-weight:550;color:var(--text)}
.order-credential-card p,.order-credential-legacy{margin:7px 0 12px;color:var(--secondary);font-size:10px;line-height:1.8}
.order-credential-card .btn{width:100%;gap:9px;min-height:39px;margin-top:0;font-size:11px}
.order-credential-card .icon{width:15px;height:15px}
.dark-page .orders-dialog-backdrop{background:#03060b80}
.dark-page .orders-dialog{--orders-ink:#e6eaf2;--orders-muted:#8c98ad;--orders-line:#ffffff15;--orders-field:#141820;background:#1b1f28;border-color:#ffffff14;box-shadow:0 24px 100px #0007}
.dark-page .orders-dialog .dialog-close{background:#ffffff08;color:#909cb0}
.dark-page .orders-dialog .dialog-close:hover{background:#ffffff13;color:#e3e9f3}
.dark-page #orders-lookup-form :is(input,textarea)::placeholder{color:#69768b}
.dark-page .orders-dialog .orders-token-help{color:#8b97ac}
.dark-page .orders-dialog .orders-query-button{background:#e3e8f1;border-color:#e3e8f1;color:#202733}
.dark-page .orders-dialog .orders-query-button:hover{background:#fff;border-color:#fff}
.dark-page .orders-recent-row{color:#a7b6d0}
.dark-page .orders-recent-row:hover{background:#202938;border-color:#819cc344}
.dark-page .orders-dialog .orders-lookup-error{color:#f0a0a5}
.dark-page .orders-all-button{color:#a2b3d0}
.dark-page .orders-all-button:hover{color:#dce7fa}
@media(max-width:480px){.orders-dialog-backdrop{padding:16px}.orders-dialog{padding:29px 24px 23px;max-height:calc(100dvh - 32px);border-radius:22px}.orders-dialog h2{font-size:24px}#orders-lookup-form{margin-top:24px}#orders-lookup-form :is(input,textarea){font-size:16px;padding:0 13px}.orders-recent-row{padding:12px 13px}.orders-recent-row span{font-size:10px}}
@media(max-height:560px){.orders-dialog-backdrop{padding:12px}.orders-dialog{max-height:calc(100dvh - 24px);padding-top:25px;padding-bottom:20px}#orders-lookup-form{margin-top:18px}.orders-recent{margin-top:18px}.orders-recent-list{max-height:100px}}

/* ./token-product.css */
/* Scoped to Muse Token so the storefront and other product pages keep their layout. */
.token-product-page{--token-blue:#3d70f5;--token-field:#fbfcfe;--token-line:#dce2ed;--token-note:#8993a6}
.token-product-page .product-layout{grid-template-columns:minmax(0,1fr) minmax(0,430px);gap:65px;align-items:start;padding-top:24px;padding-bottom:48px}
.token-product-page .buy-panel{margin:0;padding:31px;border:1px solid #e7ebf2;border-radius:28px;background:#fff;box-shadow:0 12px 36px #263c6410}
.token-product-page .panel-tag{display:none}
.token-product-page .buy-panel h1{margin:0;font-size:35px;font-weight:650;letter-spacing:-1.3px;line-height:1.15;color:#25272d}
.token-product-page .panel-subtitle{margin:9px 0 24px;font-size:14px;line-height:1.6;color:#828c9e}
.token-product-page .field-heading{margin:20px 0 9px;font-size:12px;font-weight:550;color:#636f83}
.token-product-page #purchase-form>.field-heading:first-child{margin-top:0}
.token-product-page .field-heading>span{font-size:9px;color:#98a1b1;font-weight:400}
.token-product-page .variants{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.token-product-page .variant{display:grid;grid-template-columns:15px minmax(0,1fr);align-content:start;align-items:start;column-gap:8px;row-gap:7px;min-height:100px;margin:0;padding:13px 12px;border:1px solid var(--token-line);border-radius:13px;background:var(--token-field);text-align:left;box-shadow:none}
.token-product-page .variant.selected{border-color:#7e9cff;background:#f7f9ff;box-shadow:0 0 0 1px #dce5ff33}
.token-product-page .variant .radio-dot{width:15px;height:15px;margin-top:2px;border-color:#d6deed}
.token-product-page .variant.selected .radio-dot{color:#fff;background:var(--token-blue);border-color:var(--token-blue)}
.token-product-page .variant .radio-dot .icon{width:10px;height:10px}
.token-product-page .variant-label{display:block;min-width:0}
.token-product-page .variant-name{display:block;font-size:12px;font-weight:550;line-height:1.5;color:#2d3441;white-space:normal}
.token-product-page .recommend{display:inline-block;margin-left:4px;padding:1px 3px;border-radius:3px;font-size:7px;vertical-align:1px;white-space:nowrap}
.token-product-page .variant-detail{display:block;margin-top:4px;font-size:9px;line-height:1.5;color:#919bad}
.token-product-page .variant-price{grid-column:2;font-size:21px;font-weight:550;line-height:1.15;color:#2c3038;white-space:nowrap}
.token-product-page .variant-price small{font-size:11px;margin-right:2px}
.token-product-page .quantity-row{margin-top:19px;gap:14px;min-height:44px}
.token-product-page .quantity-label{font-size:12px;font-weight:550;color:#313744}
.token-product-page .quantity-label small{margin-top:4px;font-size:10px;line-height:1.5;font-weight:400;color:var(--token-note)}
.token-product-page .quantity-control{height:42px;gap:0;padding:3px;border:1px solid #e8ecf3;border-radius:11px;background:#f7f8fb;box-shadow:none}
.token-product-page .quantity-control button{display:grid;place-items:center;width:32px;height:34px;border-radius:8px;background:#fff;border:1px solid #e1e6f0;color:#65738a}
.token-product-page .quantity-control button:disabled{opacity:.35;background:transparent;border-color:transparent}
.token-product-page .quantity-control output{display:grid;place-items:center;min-width:34px;font-size:13px;font-weight:550;color:#394357}
.token-product-page .form-field{margin-top:19px}
.token-product-page .form-field>label{display:block;margin:0 0 8px;font-size:12px;font-weight:550;line-height:1.5;color:#2d3543}
.invite-code{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;min-width:0}
.invite-code>.invite-slot{display:block;min-width:0;width:100%;height:49px;padding:0;border:1px solid var(--token-line,#dce2ed);border-radius:10px;background:var(--token-field,#fbfcfe);color:var(--text);font:21px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;text-align:center;caret-color:var(--token-blue,#3d70f5);transition:border-color .15s,box-shadow .15s}
.invite-code>.invite-slot:focus{outline:0;border-color:#5c84ff;box-shadow:0 0 0 3px #537eff13}
.invite-code.invalid>.invite-slot{border-color:#c66f7a}
.invite-slot::selection{color:inherit;background:#4c7cff2b}
.token-product-page .input-help{display:block;margin-top:7px;font-size:10px;line-height:1.6;color:var(--token-note)}
.token-product-page .field-error{margin:6px 0 0;font-size:10px;line-height:1.6}
.token-product-page .field-error:empty{display:none}
.token-product-page .text-input{height:46px;border:1px solid var(--token-line);border-radius:11px;background:var(--token-field);color:#364056;font-size:13px;box-shadow:none}
.token-product-page .text-input::placeholder{color:#a1aaba}
.token-product-page .text-input:focus{outline:0;border-color:#7395fb;box-shadow:0 0 0 3px #537eff10}
.token-product-page .text-input.invalid{border-color:#c66f7a}
.token-product-page .input-wrap>.icon{top:15px;left:13px;width:16px;height:16px;color:#a4b0c4}
.token-product-page .payment-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:0}
.token-product-page .payment-option{gap:8px;min-width:0;min-height:61px;padding:11px 10px;border:1px solid var(--token-line);border-radius:12px;background:var(--token-field);box-shadow:none}
.token-product-page .payment-option.selected{border-color:#7e9cff;background:#f5f8ff;box-shadow:none}
.token-product-page .pay-mark{flex:none;width:27px;height:27px;border-radius:7px;font-size:20px;line-height:27px;background:#1680ff;color:#fff}
.token-product-page .pay-mark.usdt{background:#25a17f;color:#fff}
.token-product-page .pay-label{min-width:0;font-size:12px;line-height:1.4;color:#46556e}
.token-product-page .pay-label small{margin-top:3px;font-size:8px;line-height:1.5;color:#8b99af;white-space:normal}
.token-product-page .payment-option .radio-dot{flex:none;width:14px;height:14px;margin-left:auto;border-color:#d3ddeb}
.token-product-page .payment-option.selected .radio-dot{background:var(--token-blue);border-color:var(--token-blue);color:#fff}
.token-product-page .payment-option .radio-dot .icon{width:10px;height:10px}
.token-product-page .product-consent-row{margin-top:19px;gap:4px;font-size:10px;line-height:1.5;color:#7a869d}
.token-product-page .product-consent-row label{gap:6px}
.token-product-page .product-consent-row input{width:15px;height:15px;margin:0;accent-color:var(--token-blue)}
.token-product-page .product-consent-row button{font-size:10px;color:#356df4;text-decoration:underline;text-underline-offset:2px}
.token-product-page .panel-total{margin-top:20px;padding-top:18px;border-top:1px solid #e9edf4;align-items:center}
.token-product-page .total-label{font-size:12px;color:#7a879b}
.token-product-page .total-label small{margin-top:5px;font-size:9px;line-height:1.5;color:#97a1b2}
.token-product-page .total-price{font-size:27px;font-weight:600;letter-spacing:-.8px;color:#272d38}
.token-product-page .total-price small{font-size:13px;margin-right:3px;letter-spacing:0}
.token-product-page #product-submit{height:47px;min-height:47px;margin-top:17px;border-radius:11px;background:#292c33;color:#fff;font-size:12px;font-weight:550;box-shadow:0 2px 4px #26334d0a}
.token-product-page #product-submit:hover:not(:disabled){background:#3b414c}
.token-product-page #product-submit:disabled{opacity:.42}
.token-product-page .panel-bottom-note{display:none}
.dark-page .token-product-page{--token-field:#141820;--token-line:#ffffff16;--token-note:#7f8ba0;--token-blue:#648dff}
.dark-page .token-product-page .buy-panel{background:#1a1e27;border-color:#ffffff13;box-shadow:0 12px 40px #0003}
.dark-page .token-product-page .buy-panel h1{color:#f0f2f7}
.dark-page .token-product-page .panel-subtitle{color:#9aa5b8}
.dark-page .token-product-page .field-heading{color:#a2aec3}
.dark-page .token-product-page .variant{background:var(--token-field);border-color:var(--token-line)}
.dark-page .token-product-page .variant.selected,.dark-page .token-product-page .payment-option.selected{background:#22304b;border-color:#6789e4;box-shadow:none}
.dark-page .token-product-page .variant-name,.dark-page .token-product-page .variant-price,.dark-page .token-product-page .quantity-label,.dark-page .token-product-page .form-field>label,.dark-page .token-product-page .total-price{color:#e1e7f3}
.dark-page .token-product-page .variant-detail{color:#8594af}
.dark-page .token-product-page .quantity-control{background:#141820;border-color:#ffffff12}
.dark-page .token-product-page .quantity-control button{background:#242e3e;border-color:#ffffff14;color:#a7b9d7}
.dark-page .token-product-page .quantity-control button:disabled{background:transparent;border-color:transparent;opacity:.32}
.dark-page .token-product-page .quantity-control output,.dark-page .token-product-page .text-input{color:#d4deef}
.dark-page .token-product-page .payment-option{background:var(--token-field);border-color:var(--token-line)}
.dark-page .token-product-page .pay-label{color:#b6c4dc}
.dark-page .token-product-page .payment-option.selected{border-color:#6789e4;background:#22304b}
.dark-page .token-product-page .pay-mark{background:#2777c8;color:#e0edff;box-shadow:none;border:0}
.dark-page .token-product-page .pay-mark.usdt{background:#248b70;color:#e1fff1}
.dark-page .token-product-page .product-consent-row button{color:#8baaff}
.dark-page .token-product-page .panel-total{border-top-color:#ffffff12}
.dark-page .token-product-page #product-submit{background:#e5eaf3;color:#232c3b}
.dark-page .token-product-page #product-submit:hover:not(:disabled){background:#fff}
@media(max-width:1100px){.token-product-page .product-layout{grid-template-columns:minmax(0,1fr) minmax(0,410px);gap:30px}.token-product-page .buy-panel{padding:27px}}
@media(max-width:860px){.token-product-page .product-layout{display:flex;flex-direction:column;max-width:460px;margin:0 auto;padding-top:12px}.token-product-page .product-stage{display:flex;height:280px;min-height:0;margin-bottom:8px}.token-product-page .stage-art{height:160px}.token-product-page .stage-art>.brand-icon{width:112px;height:112px}.token-product-page .stage-art:before{width:210px;height:210px}.token-product-page .stage-art .orbital-ring{width:230px;height:230px}.token-product-page .stage-caption h2{font-size:19px}.token-product-page .stage-caption p{font-size:10px;margin-top:7px}.token-product-page .product-mini-nav{margin-top:14px}.token-product-page .buy-panel{width:100%;margin:0}}
@media(max-width:640px){.shell.token-product-page{padding-left:16px;padding-right:16px}.token-product-page .breadcrumb{padding-top:13px;margin-bottom:8px;font-size:9px}.token-product-page .product-layout{padding-top:10px;padding-bottom:30px}.token-product-page .buy-panel{padding:26px 23px;border-radius:25px}.token-product-page .buy-panel h1{font-size:31px;letter-spacing:-1px}.token-product-page .panel-subtitle{font-size:13px;margin-top:8px;margin-bottom:21px}.token-product-page .variant{min-height:96px;padding:12px 10px;column-gap:7px}.token-product-page .variant-name{font-size:11px}.token-product-page .variant-price{font-size:20px}.token-product-page .variant-detail{font-size:9px}.invite-code{gap:7px}.invite-code>.invite-slot{height:47px;border-radius:9px;font-size:21px}.token-product-page .text-input{font-size:16px}.token-product-page .payment-option{padding:10px 8px;gap:7px}.token-product-page .pay-mark{width:25px;height:25px;line-height:25px;font-size:19px}.token-product-page .pay-label{font-size:11px}.token-product-page .pay-label small{font-size:7px}.token-product-page .payment-option .radio-dot{width:13px;height:13px}.token-product-page .total-price{font-size:26px}}
@media(max-width:360px){.token-product-page .buy-panel{padding-left:18px;padding-right:18px}.token-product-page .variant{padding:11px 8px}.invite-code{gap:6px}}
@media(max-width:640px){
  /* Four mobile specifications use one consistent row height instead of
     letting the first row grow with its recommendation badge. */
  .token-product-page .variants { grid-auto-rows: 120px; }
  .token-product-page .variant { min-height: 120px; height: 120px; }
}

/* ./product-marquee.css */
/* A separate shelf preserves every existing hero/artwork dimension and position. */
.product-marquee-shelf{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;padding:4px 0 34px;min-width:0}
.product-marquee{grid-column:1;justify-self:center;width:min(980px,92vw);max-width:100%;min-width:0;display:grid;gap:13px;padding:3px 0;outline-offset:6px;border-radius:12px}
.product-marquee:focus-visible{outline:1px solid #9aaeca66}
.product-marquee__row{box-sizing:border-box;width:100%;height:44px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.product-marquee__track{display:flex;width:max-content;animation:product-marquee-scroll 48s linear infinite;will-change:transform}
.product-marquee__row--slow .product-marquee__track{animation-duration:63s;animation-delay:-21s;animation-direction:reverse}
.product-marquee__sequence{display:flex;align-items:center;flex:none;gap:12px;padding-right:12px}
.product-marquee__extra{display:contents}
.product-marquee__tile{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:12px;background:linear-gradient(145deg,#f2f4f8,#e3e8f0);border:1px solid #c8d1df;border-top-color:#fff;color:#647d9c;box-shadow:inset 0 1px 1px #fff8;transition:transform .25s ease}
.product-marquee__tile svg{display:block;width:25px;height:25px;flex:none}
.product-marquee__tile:hover{transform:translateY(-2px)}
@media (hover:hover) and (pointer:fine){
 .product-marquee__row:hover .product-marquee__track{animation-play-state:paused}
}
.product-marquee__row:has(:focus-visible) .product-marquee__track{animation-play-state:paused}
.dark-page .product-marquee__tile{background:linear-gradient(145deg,#252d39,#171c25 65%,#131821);border-color:#b6c9e527;border-top-color:#dce7ff4a;color:#b6c9e5;box-shadow:inset 0 1px 1px #ffffff0a,0 4px 12px #0003}
@keyframes product-marquee-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:640px){.product-marquee-shelf{grid-template-columns:minmax(0,1fr);padding-top:18px;padding-bottom:30px}.product-marquee{grid-column:1;width:min(340px,100%);gap:13px}.product-marquee__row{box-sizing:border-box;width:100%;height:40px}.product-marquee__tile{flex-basis:40px;width:40px;height:40px;border-radius:11px}.product-marquee__tile svg{width:23px;height:23px}.product-marquee__extra{display:none}.product-marquee__track{animation-duration:16s}.product-marquee__row--slow .product-marquee__track{animation-duration:21s;animation-delay:-7s}}
@media(min-width:641px) and (max-width:960px) and (max-height:500px){.product-marquee-shelf{grid-template-columns:.93fr 1.07fr;gap:12px;padding-top:14px;padding-bottom:26px}.product-marquee{grid-column:2;width:min(300px,100%)}.product-marquee__extra{display:none}.product-marquee__track{animation-duration:16s}.product-marquee__row--slow .product-marquee__track{animation-duration:21s;animation-delay:-7s}}
@media(prefers-reduced-motion:reduce){.product-marquee__track{animation:none;transform:none;will-change:auto}.product-marquee__tile{transition:none}.product-marquee__tile:hover{transform:none}}
.product-marquee{gap:7px}
.product-marquee__row{height:50px;padding:3px 0}
.product-marquee__tile{border-top-color:#d7dfe9}
.dark-page .product-marquee__tile{border-top-color:#dce7ff4a}
@media(max-width:640px){.product-marquee{gap:7px}.product-marquee__row{height:46px}}

/* A single, lightweight random hint keeps the moving product rail discoverable. */
.product-marquee__item { position: relative; }
.product-marquee__hint {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 8;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: max-content;
  max-width: 150px;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 48%, var(--border) 52%);
  border-radius: 9px;
  background: color-mix(in srgb, var(--surface) 91%, var(--accent) 9%);
  color: var(--text);
  box-shadow: 0 8px 20px color-mix(in srgb, var(--text) 14%, transparent), 0 0 16px color-mix(in srgb, var(--accent) 18%, transparent);
  pointer-events: none;
  font-family: inherit;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  transform: translate(-50%, -100%) translateY(6px);
  opacity: 0;
  animation: marquee-hint-pop-up 2.3s ease both;
}
.product-marquee__hint::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -5px;
  width: 8px;
  height: 8px;
  border-right: 1px solid color-mix(in srgb, var(--accent) 48%, var(--border) 52%);
  border-bottom: 1px solid color-mix(in srgb, var(--accent) 48%, var(--border) 52%);
  background: var(--surface);
  transform: translateX(-50%) rotate(45deg);
}
.product-marquee__hint strong { color: #f8fbff; font-size: 11px; font-weight: 750; line-height: 1.3; letter-spacing: .01em; white-space: nowrap; text-shadow: 0 1px 2px #0009; }
.product-marquee__hint small { color: #c7d8ff; font-size: 10px; font-weight: 600; line-height: 1.35; letter-spacing: .01em; white-space: nowrap; text-shadow: 0 1px 2px #0009; }
.product-marquee__hint--down { transform: translate(-50%, 0) translateY(-6px); animation-name: marquee-hint-pop-down; }
.product-marquee__hint--down::after { top: -5px; bottom: auto; border-right: 0; border-bottom: 0; border-left: 1px solid color-mix(in srgb, var(--accent) 48%, var(--border) 52%); border-top: 1px solid color-mix(in srgb, var(--accent) 48%, var(--border) 52%); transform: translateX(-50%) rotate(45deg); }
.product-marquee__tile.is-hinting { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent), 0 6px 16px color-mix(in srgb, var(--accent) 20%, transparent); }
body:has(.gravity-opening) .product-marquee__hint,
body:has(.arrival-layer) .product-marquee__hint,
body:has(.starlight-opening) .product-marquee__hint,
body:has(.video-opening) .product-marquee__hint,
body:has(.cinematic-intro) .product-marquee__hint { display: none !important; }
body:has(.gravity-opening) .product-marquee__tile.is-hinting,
body:has(.arrival-layer) .product-marquee__tile.is-hinting,
body:has(.starlight-opening) .product-marquee__tile.is-hinting,
body:has(.video-opening) .product-marquee__tile.is-hinting,
body:has(.cinematic-intro) .product-marquee__tile.is-hinting { border-color: inherit; box-shadow: none; }
@keyframes marquee-hint-pop-up {
  0%, 100% { opacity: 0; transform: translate(-50%, -100%) translateY(6px); }
  12%, 82% { opacity: 1; transform: translate(-50%, -100%) translateY(0); }
}
@keyframes marquee-hint-pop-down {
  0%, 100% { opacity: 0; transform: translate(-50%, 0) translateY(-6px); }
  12%, 82% { opacity: 1; transform: translate(-50%, 0) translateY(0); }
}
.dark-page .product-marquee__hint { border-color: #91aaff99; background: #182234fa; }
.dark-page .product-marquee__hint::after { border-color: #91aaff66; background: #182234; }
body:not(.dark-page) .product-marquee__hint {
  border-color: #8ea7c2;
  background: #fffffffa;
  color: #1f3852;
  box-shadow: 0 8px 20px rgba(49, 73, 103, .18), 0 0 16px rgba(72, 126, 190, .14);
}
body:not(.dark-page) .product-marquee__hint::after {
  border-color: #8ea7c2;
  background: #fff;
}
body:not(.dark-page) .product-marquee__hint strong {
  color: #1b334d;
  text-shadow: none;
}
body:not(.dark-page) .product-marquee__hint small {
  color: #3d5e7d;
  text-shadow: none;
}
@media (max-width: 640px) {
  .product-marquee__hint { padding: 5px 7px; border-radius: 8px; }
  .product-marquee__hint strong { font-size: 9px; }
  .product-marquee__hint small { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .product-marquee__hint { animation: none; }
}


/* ./checkout-progress-motion.css */
/* Calm progress transitions for checkout and payment steps. */
.checkout-progress span {
  position: relative;
  transition: color .28s ease, transform .35s cubic-bezier(.2,.75,.25,1), opacity .28s ease;
}
.checkout-progress span.active {
  animation: progress-step-in .42s cubic-bezier(.2,.8,.25,1) both;
}
.checkout-progress span.done { color: var(--secondary); }
.checkout-progress span b {
  position: relative;
  transition: background .28s ease, color .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.checkout-progress span.active b {
  animation: progress-dot-pop .46s cubic-bezier(.2,.85,.25,1) both;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--text) 10%, transparent);
}
.checkout-progress span.done b {
  color: var(--text);
  border-color: color-mix(in srgb, var(--text) 30%, var(--border));
}
.progress-line {
  position: relative;
  overflow: hidden;
  background: var(--border);
}
.progress-line::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 0;
  background: color-mix(in srgb, var(--text) 58%, var(--accent) 42%);
}
.progress-line.complete::after {
  animation: progress-line-fill .48s cubic-bezier(.2,.75,.25,1) both;
}
@keyframes progress-step-in {
  from { opacity: .45; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes progress-dot-pop {
  0% { transform: scale(.82); }
  65% { transform: scale(1.1); }
  100% { transform: scale(1); }
}
@keyframes progress-line-fill {
  from { width: 0; }
  to { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .checkout-progress span,
  .checkout-progress span.active,
  .checkout-progress span.active b,
  .progress-line.complete::after { animation: none; transition: none; }
  .progress-line.complete::after { width: 100%; }
}
/* Keep payment text on a stable raster layer; fade the page without translating
   the whole text block, which can make small type look doubled in the phone frame. */
.checkout-main.page-appear { animation: checkout-fade-in .28s ease both; }
@keyframes checkout-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ./phone-frame-content.css */
/* Keep scrolling available without reserving a desktop scrollbar column in
   the fixed-size phone preview. */
html.preview-phone,
html.preview-phone body { scrollbar-width: none; }
html.preview-phone::-webkit-scrollbar,
html.preview-phone body::-webkit-scrollbar { width: 0; height: 0; }

/* ./video-opening.css */
.video-opening{position:fixed;inset:0;z-index:180;overflow:hidden;pointer-events:none;background:#000;will-change:opacity}
html:has(.video-opening){color-scheme:dark;scrollbar-color:#444d5b #08090c}
.video-opening-film{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.video-opening-icons{position:absolute;inset:0;overflow:hidden}
.video-opening-icon{position:absolute;left:0;top:0;width:clamp(24px,3.4vw,52px);height:clamp(24px,3.4vw,52px);color:#e4efff;opacity:0;filter:drop-shadow(0 0 8px #a2c8ff77);will-change:transform,opacity}
.video-opening-icon svg{display:block;width:100%;height:100%}
.video-opening-icon svg path[fill^="url("]{fill:#dceaff}
@media(max-width:640px){.video-opening-icon{width:30px;height:30px}}

/* ./gravity-opening.css */
.gravity-opening{position:fixed;inset:0;z-index:180;overflow:hidden;pointer-events:none}
.gravity-backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 43%,#0b101b 0%,#05070c 53%,#020306 100%)}
.gravity-dust,.gravity-icons{position:absolute;inset:0;width:100%;height:100%}
.gravity-art{position:absolute;will-change:left,top,width,height,opacity}
.gravity-image,.gravity-material{position:absolute;inset:0;width:100%;height:100%;display:block}
.gravity-icon{color:#e7f2ff;box-sizing:border-box;padding:8px;border:1px solid #d7e7ff55;border-radius:13px;background:linear-gradient(145deg,#647b9b66,#222e4355);position:absolute;left:0;top:0;width:clamp(42px,4.5vw,62px);height:clamp(42px,4.5vw,62px);opacity:0;filter:drop-shadow(0 0 9px #b6d5ff80);will-change:transform,opacity}
.gravity-icon svg{width:100%;height:100%;filter:saturate(.4)}
.gravity-icon svg path[fill^="url("]{fill:#dceaff}
@media(max-width:640px){.gravity-icon{width:40px;height:40px}}

html:has(.gravity-opening){color-scheme:dark;scrollbar-color:#444d5b #08090c}
.gravity-home-copy{position:absolute;pointer-events:none;will-change:opacity}
.gravity-live-art{position:absolute;max-width:none;pointer-events:none;will-change:left,top,width,height;display:block}
.gravity-celestial{position:absolute;left:0;top:0;width:clamp(112px,11.8vw,166px);aspect-ratio:3/2;opacity:0;background-image:var(--opening-sprite,none);background-repeat:no-repeat;background-size:200% 200%;--celestial-mask:radial-gradient(ellipse 70% 70% at center,#000 48%,transparent 72%);mask-image:var(--celestial-mask);-webkit-mask-image:var(--celestial-mask);will-change:transform,opacity}
.gravity-celestial--black-hole{background-position:0 0}
.gravity-celestial--ringed-planet{background-position:100% 0;--celestial-mask:radial-gradient(ellipse 70% 70% at center,#000 48%,transparent 72%),radial-gradient(ellipse 12% 16% at 85% 81%,#000 35%,transparent 100%),radial-gradient(ellipse 7% 10% at 20% 38%,#000 30%,transparent 100%)}
.gravity-celestial--galaxy{background-position:0 100%;--celestial-mask:radial-gradient(ellipse 70% 70% at center,#000 48%,transparent 72%),radial-gradient(ellipse 11% 14% at 16% 65%,#000 25%,transparent 100%),radial-gradient(ellipse 11% 14% at 85% 24%,#000 25%,transparent 100%)}
.gravity-celestial--breaking-planet{background-position:100% 100%;filter:brightness(1.12);--celestial-mask:radial-gradient(ellipse 70% 70% at center,#000 48%,transparent 72%),radial-gradient(ellipse 9% 13% at 30% 14%,#000 25%,transparent 100%),radial-gradient(ellipse 10% 14% at 82% 30%,#000 25%,transparent 100%)}

/* Subtle internal light motion gives each opening subject its own living detail. */
.gravity-celestial{overflow:visible;isolation:isolate}
.gravity-celestial::before,.gravity-celestial::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;mix-blend-mode:screen;will-change:transform,opacity;}
.gravity-celestial--black-hole::before{
 inset:14% 4%;border-radius:50%;
 background:conic-gradient(from 18deg,transparent 0 46%,rgba(236,247,255,.72) 53%,rgba(167,211,255,.22) 61%,transparent 70% 100%);
 mask:radial-gradient(ellipse at center,transparent 0 39%,#000 46% 67%,transparent 77%);
 -webkit-mask:radial-gradient(ellipse at center,transparent 0 39%,#000 46% 67%,transparent 77%);
 opacity:.34;filter:blur(.7px);animation:celestial-disk-sweep 8.4s linear infinite;
}
.gravity-celestial--black-hole::after{
 inset:25% 12%;border-radius:50%;
 background:radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.14),transparent 58%);
 opacity:.38;filter:blur(3px);animation:celestial-breathe 4.8s ease-in-out infinite;
}
.gravity-celestial--ringed-planet::before{
 inset:8% 1%;border-radius:50%;
 background:linear-gradient(122deg,transparent 33%,rgba(229,244,255,.35) 48%,transparent 61%);
 mask:radial-gradient(ellipse at center,transparent 0 40%,#000 49% 68%,transparent 77%);
 -webkit-mask:radial-gradient(ellipse at center,transparent 0 40%,#000 49% 68%,transparent 77%);
 opacity:.3;filter:blur(1px);animation:celestial-sheen 7.7s ease-in-out infinite;
}
.gravity-celestial--galaxy::before{
 inset:5%;border-radius:50%;
 background:conic-gradient(from 12deg,transparent 0 23%,rgba(255,220,181,.38) 34%,transparent 46% 67%,rgba(137,191,255,.28) 78%,transparent 88%);
 mask:radial-gradient(ellipse at center,#000 18%,transparent 69%);
 -webkit-mask:radial-gradient(ellipse at center,#000 18%,transparent 69%);
 opacity:.3;filter:blur(1.2px);animation:celestial-galaxy-turn 14s linear infinite;
}
.gravity-celestial--breaking-planet::before{
 inset:8%;border-radius:50%;
 background:radial-gradient(circle at 74% 30%,rgba(255,243,214,.9) 0 2%,rgba(255,213,153,.34) 8%,transparent 24%),radial-gradient(circle at 33% 71%,rgba(178,218,255,.42) 0 2%,transparent 18%);
 opacity:.52;filter:blur(.5px);animation:celestial-glint 5.9s ease-in-out infinite;
}
@keyframes celestial-disk-sweep{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes celestial-galaxy-turn{from{transform:rotate(0deg) scale(.96)}50%{transform:rotate(180deg) scale(1.02)}to{transform:rotate(360deg) scale(.96)}}
@keyframes celestial-sheen{0%,100%{transform:translateX(-7%) rotate(-2deg);opacity:.14}50%{transform:translateX(7%) rotate(2deg);opacity:.42}}
@keyframes celestial-glint{0%,100%{transform:scale(.96);opacity:.22}42%{transform:scale(1.03);opacity:.62}70%{transform:scale(1);opacity:.34}}
@keyframes celestial-breathe{0%,100%{transform:scale(.96);opacity:.24}50%{transform:scale(1.04);opacity:.48}}
@media(max-width:640px){.gravity-celestial{width:clamp(105px,32vw,130px)}}

/* The real site mark joins the opening, then settles into the header. */
.gravity-logo{position:absolute;top:0;left:0;opacity:0;pointer-events:none;transform-origin:center;will-change:transform,opacity}
.gravity-logo .space-brand{color:#eef4ff}
.gravity-logo .space-brand__name small{display:block;margin-top:5px;color:#a8bad3;font-size:7px;font-weight:600;letter-spacing:1.2px;line-height:1;white-space:nowrap}
body:not(.dark-page) .gravity-logo--arrival .space-brand{color:#28374e;transition:color .45s ease}
body:not(.dark-page) .gravity-logo--arrival .space-brand__name small{color:#788ba7;transition:color .45s ease}
@media(max-width:640px){.gravity-logo .space-brand__name small{font-size:6.5px;margin-top:4px}}

@media(prefers-reduced-motion:reduce){.gravity-celestial::before,.gravity-celestial::after{animation:none!important}}


/* ./page-stars.css */
.page-starfield{position:fixed;inset:0;width:100%;height:100%;max-width:none;pointer-events:none;z-index:0;opacity:.85}
#app{position:relative;z-index:1}
#main:focus{outline:none}
body.dark-page .page-starfield{opacity:.95}
body:not(.dark-page) .page-starfield{opacity:.8}
@media(max-width:640px){.page-starfield{opacity:.72}body.dark-page .page-starfield{opacity:.88}}

/* ./product-interactions.css */
/* Dock magnification has its own vertical room, so enlarged icons stay intact. */
.product-marquee__row{height:88px;padding:22px 0;overflow:hidden}
.product-marquee__item{display:block;position:relative;flex:none;width:44px;height:44px}
.product-marquee__tile{padding:0;cursor:pointer;position:relative;transform-origin:50% 65%;transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s}
.product-marquee__item:has(.product-marquee__tile:hover),.product-marquee__item:has(.product-marquee__tile:focus-visible){z-index:5}
.product-marquee__tile:hover,.product-marquee__tile:focus-visible{transform:translateY(-3px) scale(1.65);border-color:#c9dcff99;box-shadow:0 9px 25px #0006,0 0 22px #9bbcff33;outline:none}
.product-marquee__item:has(+.product-marquee__item:hover)>.product-marquee__tile,.product-marquee__item:hover+.product-marquee__item>.product-marquee__tile{transform:translateY(-1px) scale(1.18)}
.product-marquee__tile:active{transform:scale(1.42);transition-duration:.1s}
.product-marquee{gap:0}
/* Floating, softly lit product cards inspired by Saad3092003 on Uiverse.io. */
.product-card{animation:nova-card-drift 3.8s ease-in-out infinite}
.dark-page .product-card{animation:nova-card-drift 3.8s ease-in-out infinite;box-shadow:0 0 22px -12px color-mix(in srgb,var(--brand-color) 40%,#dce7ff),inset 0 0 35px #e2edff04;transition:transform .45s cubic-bezier(.2,.75,.25,1),box-shadow .45s,border-color .4s}
.product-card:nth-child(3n+2){animation-delay:-1.25s}.product-card:nth-child(3n){animation-delay:-2.5s}
.dark-page .product-card:hover,.dark-page .product-card:focus-visible{transform:scale(1.018);border-color:#dce7ff44;box-shadow:0 0 38px -9px color-mix(in srgb,var(--brand-color) 35%,#c5d6ff),inset 0 0 42px #e6eeff0a,0 18px 32px -22px #000b;animation-play-state:paused}
.dark-page .product-card:active{transform:scale(.99)}
@keyframes nova-card-drift{0%,100%{translate:0 0}50%{translate:0 -8px}}
/* Physics-mounted cards use the JS position solver instead of the legacy CSS drift. */
.product-card__content{
  width:100%;
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
[data-card-physics="active"] .product-card,
[data-card-physics="active"] .product-card:is(:hover,:focus-visible,:active){
  animation:none !important;
  will-change:translate;
}
[data-card-physics="active"] .product-card.is-physics-paused{will-change:auto}
@media(max-width:640px){.product-marquee__row{height:72px;padding:16px 0}.product-marquee__item{width:40px;height:40px}.product-marquee__tile:hover,.product-marquee__tile:focus-visible{transform:translateY(-2px) scale(1.5)}.product-card,.dark-page .product-card{animation-duration:4.4s}}
body:not(.dark-page) .product-card{box-shadow:0 10px 25px -20px #304a6e40}
body:not(.dark-page) .product-card:is(:hover,:focus-visible){transform:scale(1.012);animation-play-state:paused;border-color:#b9c8de;box-shadow:0 13px 30px -15px #26355630}
@media(hover:none){.dark-page .product-card:hover:not(:focus-visible),body:not(.dark-page) .product-card:hover:not(:focus-visible){animation-play-state:running}}
@media(prefers-reduced-motion:reduce){.product-card{animation:none}.dark-page .product-card{transform:none}.product-marquee__tile{transition:none}}

/* Fade the homepage in without shifting every card by fractional pixels. */
.home-page.page-appear{transform:none!important}

/* Filtered cards retain their DOM and physics state. */
.product-grid > .product-card[hidden] { display: none !important; }

/* ./cosmic-actions.css */
/* Stable invitation hitbox; the plane keeps the supplied .8 second flight. */
.hero-actions .telegram-invite{--tg-unit:9px;position:relative;z-index:5;isolation:isolate;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:fit-content;height:44px;min-height:0;padding:0 15px;border:1px solid #a9c6eb30;border-radius:9px;background:linear-gradient(135deg,#1b2737,#141d2b);color:#dceaff;font-family:inherit;font-size:12px;font-weight:600;line-height:1;box-shadow:inset 0 1px 0 #d9e9ff0a;transition:background .3s,border-color .3s;transform:none;scale:1;animation:none}
.hero-actions .telegram-invite:is(:hover,:active,:focus-visible){padding:0 15px;scale:1;transform:none;border:1px solid #b7d2f64f;background:linear-gradient(135deg,#223149,#192536);box-shadow:inset 0 1px 0 #d9e9ff0f;outline:none}
.telegram-invite:before,.telegram-invite:after{content:none}
.telegram-invite>span{pointer-events:none}
.telegram-invite__plane{display:block;width:18px;height:18px;z-index:1;flex:none;color:#d7ecff;pointer-events:none}
.telegram-invite:is(:hover,:focus-visible) .telegram-invite__plane{animation:telegram-plane-launch .8s linear}
@keyframes telegram-plane-launch{0%{transform:rotate(0deg) translate(0,0) scale(1)}50%{transform:rotate(180deg) translate(calc(var(--tg-unit)*-4),calc(var(--tg-unit)*-2)) scale(1.4)}100%{transform:rotate(360deg) translate(0,0) scale(1)}}
/* A ringed planet with two satellites opposite each other. */
.cosmic-buy{position:relative;isolation:isolate;display:inline-block;flex:none;width:90px;height:34px;border:1px solid #afc9ef38;border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#2c3a52,#182231);box-shadow:inset 0 1px 0 #cce2ff15;color:#bdd9ff;transition:border-color .3s}
.cosmic-buy__planet{position:absolute;width:27px;height:27px;left:5px;top:2px;opacity:1;transform:none}
.cosmic-buy__label{position:absolute;left:38px;top:10px;font-size:11px;font-weight:550;line-height:1;white-space:nowrap;letter-spacing:.3px;color:#d6e6ff;opacity:1;transform:none}
.product-card:is(:hover,:focus-visible,:active) .cosmic-buy{border-color:#bbd6ff70}
.cosmic-buy__surface{transform-origin:20px 20px;animation:cosmic-planet-spin 10s linear infinite}
.cosmic-buy__orbit-light{filter:drop-shadow(0 0 1px #d9edff)}
.cosmic-buy__orbit-static{display:none}
@keyframes cosmic-planet-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(max-width:640px){.hero-actions .telegram-invite{--tg-unit:8px;height:38px;padding:0 12px;font-size:11px}.hero-actions .telegram-invite:is(:hover,:active,:focus-visible){padding:0 12px}.cosmic-buy{width:64px;height:30px}.cosmic-buy__planet{width:23px;height:23px;left:3px;top:3px}.cosmic-buy__label{left:30px;top:9px;font-size:10px}}
@media(max-width:360px){.cosmic-buy{width:55px}.cosmic-buy__planet{width:21px;height:21px;left:2px;top:4px}.cosmic-buy__label{left:26px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.telegram-invite__plane,.cosmic-buy__surface{animation:none!important}.cosmic-buy__orbit-light{display:none}.cosmic-buy__orbit-static{display:block}}

/* ./product-navigation.css */
.product-family-nav{position:relative;width:min(100%,410px);height:66px;margin:20px auto 0;flex:none;--family-tile:color-mix(in srgb,var(--family-color) 9%,#10141b)}
.family-nav__viewport{width:100%;height:100%;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 calc(50% - 39px),transparent calc(50% - 28px),transparent calc(50% + 28px),#000 calc(50% + 39px),#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 calc(50% - 39px),transparent calc(50% - 28px),transparent calc(50% + 28px),#000 calc(50% + 39px),#000 93%,transparent)}
.family-nav__track{height:100%;display:flex;align-items:center;width:max-content;animation:family-nav-left 30s linear infinite;will-change:transform}
.family-nav__sequence{display:flex;align-items:center;gap:11px;padding-right:11px;flex:none}
.family-nav__button{width:35px;height:35px;flex:none;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--family-color) 23%,transparent);border-top-color:color-mix(in srgb,var(--family-color) 38%,transparent);border-radius:11px;background:var(--family-tile);color:var(--family-color);padding:7px;transition:transform .25s,border-color .25s,background .3s}
.family-nav__button .brand-icon,.family-nav__button svg{width:100%;height:100%;display:block;color:inherit}
.family-nav__moving:focus-visible{transform:scale(1.14);border-color:var(--family-color);outline:none;background:color-mix(in srgb,var(--family-color) 18%,#10141b)}
.family-nav__viewport:has(.family-nav__moving:focus-visible) .family-nav__track{animation-play-state:paused}
.family-nav__current{position:absolute;left:50%;top:11px;translate:-50% 0;display:flex;align-items:center;flex-direction:column;gap:6px}
.family-nav__selected{width:44px;height:44px;padding:10px;border-radius:13px;border-color:color-mix(in srgb,var(--family-color) 65%,#cbd5e1);background:color-mix(in srgb,var(--family-color) 18%,#11161e);box-shadow:inset 0 1px 0 #ffffff0b,0 0 15px -7px var(--family-color)}
.family-nav__selected:focus-visible{transform:scale(1.06);outline:1px solid color-mix(in srgb,var(--family-color) 55%,#d8e7fa);outline-offset:3px}
.family-nav__indicator{width:4px;height:4px;border-radius:50%;background:var(--family-color);box-shadow:0 0 6px color-mix(in srgb,var(--family-color) 50%,transparent)}
.product-family-nav[data-family="x"]{--family-color:#94a3b8;--family-tile:color-mix(in srgb,var(--family-color) 11%,#10141b)}
.product-family-nav[data-family="x"] .family-nav__selected{background:color-mix(in srgb,var(--family-color) 20%,#11161e);border-color:#cbd5e188}
.product-family-nav[data-family="x"] .family-nav__indicator{background:#cbd5e1;box-shadow:0 0 6px #cbd5e180}
/* A touch tap can leave :hover/focus behind in Safari; only a mouse hover or
   an intentional keyboard focus may stop the moving rail. */
@media(hover:hover) and (pointer:fine){
 .family-nav__moving:hover{transform:scale(1.14);border-color:var(--family-color);outline:none;background:color-mix(in srgb,var(--family-color) 18%,#10141b)}
 .product-family-nav:has(.family-nav__moving:hover) .family-nav__track{animation-play-state:paused}
 .family-nav__selected:hover{transform:scale(1.06);outline:1px solid color-mix(in srgb,var(--family-color) 55%,#d8e7fa);outline-offset:3px}
 .product-family-nav[data-family="x"] .family-nav__moving:hover{background:color-mix(in srgb,var(--family-color) 18%,#10141b);border-color:#cbd5e1}
}
.page-back-nav{display:flex;align-items:center;gap:15px;min-height:42px;margin:12px 0 16px;min-width:0}
.page-back-button{display:inline-flex;align-items:center;gap:7px;flex:none;min-height:34px;padding:0 11px;border:1px solid var(--border);border-radius:10px;background:color-mix(in srgb,var(--surface) 80%,transparent);color:var(--secondary);font-size:10px;transition:background .2s,color .2s,border-color .2s}
.page-back-button:hover,.page-back-button:focus-visible{color:var(--text);background:var(--surface-soft);border-color:color-mix(in srgb,var(--secondary) 30%,transparent)}
.page-back-button .icon{width:14px;height:14px}
.page-back-trail{display:flex;gap:9px;align-items:center;font-size:9px;line-height:1.6;color:var(--muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.page-back-trail span{opacity:.5}
@keyframes family-nav-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(min-width:641px) and (min-height:560px){.product-layout>.product-stage{align-self:start;position:sticky;top:24px;height:min(540px,calc(100svh - 245px));min-height:340px}.product-stage>.stage-art,.product-stage>.stage-orbit{flex:1 1 auto;min-height:150px}.product-stage>.stage-caption{flex:none}}
@media(max-width:640px){.product-family-nav{width:min(315px,100%);height:65px;margin-top:15px}.family-nav__sequence{gap:10px;padding-right:10px}.family-nav__button{width:34px;height:34px;padding:7px}.family-nav__selected{width:43px;height:43px;padding:10px}.dark-page .product-stage,.product-stage{height:330px}.stage-art{flex-shrink:0}.stage-caption{flex:none}.page-back-nav{gap:10px;margin:8px 0 5px}.page-back-button{min-height:32px;padding:0 10px;font-size:10px}.page-back-trail{font-size:8px;gap:6px}}
@media(prefers-reduced-motion:reduce){.family-nav__track{animation:none}.family-nav__button{transition:none}}

/* Give the desktop product artwork a livelier, unhurried orbit. */
@keyframes product-art-drift {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-3deg); }
  33% { transform: translate3d(-7px, -16px, 0) rotate(2deg); }
  68% { transform: translate3d(8px, -4px, 0) rotate(5deg); }
}
@media (min-width: 641px) and (pointer: fine) {
  .product-stage .stage-art > .brand-icon {
    animation: product-art-drift 5.8s ease-in-out infinite;
    transition: scale .6s cubic-bezier(.2, .7, .2, 1);
  }
  @media (hover: hover) and (pointer: fine) {
    .product-stage .stage-art:hover > .brand-icon { scale: 1.12; }
  }
  .product-family-nav { width: min(100%, 450px); height: 90px; }
  .family-nav__viewport {
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 calc(50% - 49px), transparent calc(50% - 35px), transparent calc(50% + 35px), #000 calc(50% + 49px), #000 94%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 calc(50% - 49px), transparent calc(50% - 35px), transparent calc(50% + 35px), #000 calc(50% + 49px), #000 94%, transparent);
  }
  .family-nav__sequence { gap: 13px; padding-right: 13px; }
  .family-nav__button { width: 42px; height: 42px; }
  .family-nav__current { top: 19px; }
  .family-nav__selected { width: 52px; height: 52px; }
}
@media (min-width: 641px) and (pointer: fine) and (prefers-reduced-motion: reduce) {
  .product-stage .stage-art > .brand-icon { animation: none; transition: none; }
  .product-stage .stage-art:hover > .brand-icon { scale: 1; }
}
/* Mobile-friendly same-category directory: no endless icon ticker required. */
/* Keep native scrolling inside the modal; the shared lock guards Safari edges. */
#overlay-root .dialog-backdrop{overscroll-behavior:none}
#overlay-root :is(.dialog,.category-directory-grid,.terms-dialog-scroll,.orders-recent-list){overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.family-nav__catalog-trigger {
  position: absolute;
  left: calc(50% + 40px);
  top: 50%;
  translate: 0 -50%;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--family-color) 38%, var(--border) 62%);
  border-radius: 99px;
  background: color-mix(in srgb, var(--surface) 88%, var(--family-color) 12%);
  color: var(--secondary);
  font-size: 9px;
  font-weight: 600;
  white-space: nowrap;
  z-index: 3;
}
.family-nav__catalog-trigger small { color: var(--family-color); font-size: 8px; margin-left: 3px; }
.family-nav__catalog-trigger:hover,
.family-nav__catalog-trigger:focus-visible { border-color: var(--family-color); color: var(--text); outline: none; }
@media (min-width: 641px) {
  /* Desktop keeps the moving family icons; the extra directory pill is
     intentionally omitted to keep the product stage clean. */
  .family-nav__catalog-trigger { display: none; }
}
.category-directory-dialog { max-width: 560px; padding: 27px; }
.category-directory-dialog h2 { display: flex; align-items: baseline; gap: 8px; }
.category-directory-dialog h2 small { color: var(--muted); font-size: 11px; font-weight: 500; }
.category-directory-search { position: relative; margin-top: 18px; }
.category-directory-search .icon { position: absolute; left: 12px; top: 11px; width: 15px; height: 15px; color: var(--muted); }
.category-directory-search input { width: 100%; height: 38px; padding: 0 12px 0 34px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft); color: var(--text); font-size: 12px; }
.category-directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; max-height: min(58vh, 520px); overflow: auto; margin-top: 14px; padding: 2px; }
.category-directory-item { min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); color: var(--text); text-align: left; }
.category-directory-item:hover, .category-directory-item:focus-visible { border-color: var(--accent); background: var(--accent-soft); outline: none; }
.category-directory-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: var(--surface); color: var(--product-color, var(--accent)); }
.category-directory-icon .brand-icon { width: 22px; height: 22px; }
.category-directory-copy { min-width: 0; }
.category-directory-copy strong, .category-directory-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.category-directory-copy strong { font-size: 11px; font-weight: 650; }
.category-directory-copy small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.category-directory-price { color: var(--secondary); font-size: 10px; white-space: nowrap; }
.category-directory-item[hidden] { display: none; }
@media (max-width: 640px) {
  .product-family-nav { height: 65px; }
  /* Keep the family rail moving on phones; the selected item stays above it. */
  .family-nav__track { animation: family-nav-left 26s linear infinite; opacity: 1; will-change: transform; }
  .family-nav__current { top: 7px; z-index: 4; }
  .family-nav__selected { width: 48px; height: 48px; padding: 11px; border-radius: 14px; box-shadow: inset 0 1px 0 #ffffff16, 0 0 20px -6px var(--family-color); }
  .product-family-nav .family-nav__moving:focus-visible { z-index: 5; }
  .product-family-nav .family-nav__moving:focus-visible .icon-stack { transform: scale(1.16) rotate(-35deg) skew(20deg); }
  @media (hover: hover) and (pointer: fine) {
    .product-family-nav .family-nav__moving:hover { z-index: 5; }
    .product-family-nav .family-nav__moving:hover .icon-stack { transform: scale(1.16) rotate(-35deg) skew(20deg); }
  }
  .family-nav__catalog-trigger { left: 50%; top: 70px; translate: -50% 0; min-width: 132px; min-height: 40px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 0; border-color: color-mix(in srgb, var(--family-color) 52%, var(--border) 48%); background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 78%, var(--family-color) 22%), color-mix(in srgb, var(--surface) 94%, var(--family-color) 6%)); box-shadow: 0 8px 22px color-mix(in srgb, var(--family-color) 22%, transparent), inset 0 1px 0 #ffffff3a; font-size: 12.5px; font-weight: 700; letter-spacing: .03em; }
  .family-nav__catalog-trigger small { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; margin-left: 8px; border-radius: 999px; background: color-mix(in srgb, var(--family-color) 18%, var(--surface) 82%); color: var(--family-color); font-size: 12px; font-weight: 800; line-height: 1; }
  /* Keep the icon rail at its original height; reserve the button's own row below it without shifting the rail. */
  .dark-page .product-stage, .product-stage { height: 365px; margin-bottom:53px; }
  .product-stage .stage-art { height: 210px; }
  .product-stage .stage-art > .brand-icon { width: 100px; height: 100px; }
  .token-product-page .product-stage { height: 365px; margin-bottom:16px; }
  .category-directory-backdrop { align-items: end; }
  .category-directory-dialog { width: 100%; max-width: none; max-height: 76svh; padding: 22px 18px 18px; border-radius: 22px 22px 0 0; animation: directory-sheet-in .24s ease-out; }
  .category-directory-grid { max-height: 50svh; gap: 8px; }
  .category-directory-item { grid-template-columns: 30px minmax(0, 1fr); padding: 8px; }
  .category-directory-icon { width: 30px; height: 30px; }
  .category-directory-icon .brand-icon { width: 19px; height: 19px; }
  .category-directory-price { grid-column: 2; font-size: 9px; margin-top: -4px; }
}
@keyframes directory-sheet-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .category-directory-dialog { animation: none; } }
/* One-shot reveal for the mobile/desktop same-category directory. */
.category-directory-dialog {
  overflow: hidden;
  isolation: isolate;
}
.category-directory-dialog::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  left: 50%;
  top: 42%;
  translate: -50% -50%;
  border: 1px solid color-mix(in srgb, var(--accent) 46%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 0 8px color-mix(in srgb, var(--accent) 8%, transparent), 0 0 50px color-mix(in srgb, var(--accent) 20%, transparent);
  opacity: 0;
  pointer-events: none;
  animation: directory-star-ring .72s cubic-bezier(.16,.8,.22,1) .04s both;
  z-index: -1;
}
.category-directory-dialog::after {
  content: "";
  position: absolute;
  inset: -30%;
  background: linear-gradient(112deg, transparent 35%, color-mix(in srgb, var(--accent) 16%, transparent) 49%, transparent 62%);
  transform: translateX(-70%) rotate(8deg);
  pointer-events: none;
  animation: directory-sheen .85s ease-out .12s both;
  z-index: -1;
}
.category-directory-item {
  opacity: 0;
  transform: translateY(12px) scale(.96);
  animation: directory-card-in .34s cubic-bezier(.2,.8,.25,1) both;
}
.category-directory-item:nth-child(1) { animation-delay: .16s; }
.category-directory-item:nth-child(2) { animation-delay: .22s; }
.category-directory-item:nth-child(3) { animation-delay: .28s; }
.category-directory-item:nth-child(4) { animation-delay: .34s; }
.category-directory-item:nth-child(5) { animation-delay: .40s; }
.category-directory-item:nth-child(6) { animation-delay: .46s; }
.category-directory-item:nth-child(7) { animation-delay: .52s; }
.category-directory-item:nth-child(8) { animation-delay: .58s; }
@keyframes directory-star-ring {
  0% { opacity: 0; transform: scale(.35) rotate(-22deg); }
  35% { opacity: .85; }
  100% { opacity: 0; transform: scale(1.45) rotate(22deg); }
}
@keyframes directory-sheen {
  0% { transform: translateX(-70%) rotate(8deg); opacity: 0; }
  35% { opacity: 1; }
  100% { transform: translateX(70%) rotate(8deg); opacity: 0; }
}
@keyframes directory-card-in {
  0% { opacity: 0; transform: translateY(12px) scale(.96); filter: blur(3px); }
  65% { opacity: 1; transform: translateY(-2px) scale(1.015); filter: blur(0); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  .category-directory-dialog::before,
  .category-directory-dialog::after,
  .category-directory-item { animation: none; opacity: 1; transform: none; filter: none; }
}

/* The list owns scrolling. A viewport-sized list inside a shorter clipped
   dialog otherwise leaves its last rows outside the reachable scroll area. */
body .category-directory-backdrop {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
}
body .category-directory-backdrop .category-directory-dialog {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 0;
  max-height: calc(100vh - 48px);
  max-height: min(85dvh, calc(100dvh - 48px));
  overflow: hidden;
}
body .category-directory-dialog > :not(.category-directory-grid) { flex: 0 0 auto; }
body .category-directory-dialog > .category-directory-grid {
  flex: 0 1 auto;
  min-height: 0;
  height: auto;
  max-height: none;
  align-content: start;
  grid-auto-rows: max-content;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  padding-bottom: 12px;
  scroll-padding-block: 4px 12px;
}
@media (max-width: 640px) {
  body .category-directory-backdrop {
    align-items: flex-end;
    padding: max(12px, env(safe-area-inset-top, 0px)) 0 0;
  }
  body .category-directory-backdrop .category-directory-dialog {
    max-width: none;
    max-height: calc(100vh - 12px);
    max-height: min(76svh, calc(100dvh - max(12px, env(safe-area-inset-top, 0px))));
    padding: 22px max(18px, env(safe-area-inset-right, 0px)) calc(18px + env(safe-area-inset-bottom, 0px)) max(18px, env(safe-area-inset-left, 0px));
  }
  body .category-directory-dialog .category-directory-item {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    height: max-content;
  }
  body .category-directory-dialog .category-directory-copy strong { overflow-wrap: anywhere; }
  body .category-directory-dialog .category-directory-item .category-directory-price {
    grid-column: 2 !important;
    margin-top: 0 !important;
  }
}

/* Desktop header: one shared Apple-like glass pill glides between nav items. */
.header-nav {
  position: relative;
  isolation: isolate;
}
.header-nav__glass {
  position: absolute;
  top: 5px;
  left: var(--nav-glass-x, 5px);
  width: var(--nav-glass-width, 0px);
  height: calc(100% - 10px);
  border: 1px solid rgba(255, 255, 255, .58);
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .36));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82), 0 5px 14px rgba(57, 75, 105, .15);
  backdrop-filter: blur(14px) saturate(1.18);
  -webkit-backdrop-filter: blur(14px) saturate(1.18);
  opacity: 0;
  pointer-events: none;
  z-index: -1;
  transition: left .34s cubic-bezier(.2, .75, .2, 1), width .34s cubic-bezier(.2, .75, .2, 1), opacity .18s ease;
}
.header-nav__glass::after {
  content: "";
  position: absolute;
  inset: 1px 14% auto;
  height: 1px;
  border-radius: inherit;
  background: rgba(255, 255, 255, .9);
  opacity: .8;
}
.header-nav.nav-glass-ready .header-nav__glass { opacity: 1; }
.header-nav.nav-glass-instant .header-nav__glass { transition: none; }
.header-nav button {
  position: relative;
  z-index: 1;
  transition: color .22s ease, transform .22s ease;
}
.header-nav button.active {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text) !important;
}
.header-nav button:hover,
.header-nav button:focus-visible { color: var(--text); }
body.dark-page .header-nav__glass {
  border-color: rgba(171, 190, 220, .16);
  background: linear-gradient(145deg, rgba(43, 56, 76, .86), rgba(15, 21, 30, .96));
  box-shadow: inset 0 1px 0 rgba(205, 222, 246, .08), 0 7px 18px rgba(0, 0, 0, .34), 0 0 18px rgba(136, 169, 220, .06);
}
body.dark-page .header-nav__glass::after { background: rgba(205, 220, 240, .12); opacity: .55; }
@media (max-width: 640px) { .header-nav__glass { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .header-nav__glass { transition: none; }
  .header-nav button { transition: none; }
}

/* Same-category directory: larger, clearer cards with restrained glass depth. */
.category-directory-item {
  position: relative;
  min-height: 76px;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 12px;
  padding: 13px 14px;
  overflow: hidden;
  border-radius: 16px;
  border-color: color-mix(in srgb, var(--border) 70%, var(--accent) 30%);
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 92%, white 8%), color-mix(in srgb, var(--surface-soft) 86%, var(--accent) 14%));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .50), 0 8px 18px color-mix(in srgb, var(--text) 8%, transparent);
  transition: transform .28s cubic-bezier(.2, .75, .2, 1), border-color .24s ease, box-shadow .28s ease, background .24s ease;
}
.category-directory-item::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(112deg, transparent 24%, rgba(255, 255, 255, .25) 48%, transparent 72%);
  transform: translateX(-120%);
  transition: transform .52s cubic-bezier(.2, .7, .2, 1);
  pointer-events: none;
}
.category-directory-item:hover,
.category-directory-item:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border) 38%);
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 84%, white 16%), color-mix(in srgb, var(--accent-soft) 82%, var(--surface) 18%));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 14px 26px color-mix(in srgb, var(--accent) 18%, transparent);
  outline: none;
}
.category-directory-item:hover::before,
.category-directory-item:focus-visible::before { transform: translateX(120%); }
.category-directory-icon {
  position: relative;
  z-index: 1;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 88%, white 12%), color-mix(in srgb, var(--surface-soft) 78%, var(--product-color, var(--accent)) 22%));
  border: 1px solid color-mix(in srgb, var(--product-color, var(--accent)) 26%, var(--border) 74%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .64), 0 5px 12px color-mix(in srgb, var(--product-color, var(--accent)) 12%, transparent);
}
.category-directory-icon .brand-icon { width: 28px; height: 28px; }
.category-directory-copy,
.category-directory-price { position: relative; z-index: 1; }
.category-directory-copy strong { font-size: 13px; font-weight: 700; letter-spacing: -.15px; }
.category-directory-copy small { margin-top: 5px; font-size: 10px; line-height: 1.35; }
.category-directory-price { font-size: 13px; font-weight: 700; letter-spacing: -.2px; font-variant-numeric: tabular-nums; }
body.dark-page .category-directory-item {
  border-color: rgba(205, 220, 242, .16);
  background: linear-gradient(145deg, rgba(57, 70, 88, .82), rgba(25, 31, 42, .92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 10px 20px rgba(0, 0, 0, .24);
}
body.dark-page .category-directory-item:hover,
body.dark-page .category-directory-item:focus-visible {
  border-color: rgba(160, 188, 237, .55);
  background: linear-gradient(145deg, rgba(70, 87, 111, .92), rgba(30, 39, 54, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 16px 30px rgba(0, 0, 0, .34), 0 0 20px rgba(133, 167, 225, .12);
}
body.dark-page .category-directory-icon {
  background: linear-gradient(145deg, rgba(89, 109, 138, .55), rgba(28, 36, 49, .78));
  border-color: rgba(191, 213, 244, .22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 6px 14px rgba(0, 0, 0, .22);
}
/* Mobile same-category trigger: a compact glass control with a soft moving sheen. */
.family-nav__catalog-trigger {
  min-width: 142px;
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid color-mix(in srgb, var(--family-color) 48%, var(--border) 52%);
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 72%, var(--family-color) 28%), color-mix(in srgb, var(--surface-soft) 84%, var(--family-color) 16%));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 8px 20px color-mix(in srgb, var(--family-color) 18%, transparent);
  backdrop-filter: blur(12px) saturate(1.16);
  -webkit-backdrop-filter: blur(12px) saturate(1.16);
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  transition: transform .26s cubic-bezier(.2, .75, .2, 1), box-shadow .26s ease, border-color .22s ease;
}
.family-nav__catalog-trigger::before {
  content: "";
  position: absolute;
  top: 1px;
  bottom: 1px;
  left: -40%;
  width: 32%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
  transform: skewX(-18deg);
  transition: left .55s cubic-bezier(.2, .7, .2, 1);
  pointer-events: none;
}
.family-nav__catalog-trigger:hover,
.family-nav__catalog-trigger:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--family-color) 72%, white 28%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .64), 0 12px 25px color-mix(in srgb, var(--family-color) 26%, transparent);
  outline: none;
}
.family-nav__catalog-trigger:hover::before,
.family-nav__catalog-trigger:focus-visible::before { left: 118%; }
.family-nav__catalog-trigger small {
  display: inline-grid;
  place-items: center;
  min-width: 26px;
  height: 26px;
  margin-left: 7px;
  padding: 0 6px;
  border: 1px solid #9eb2cc;
  border-radius: 999px;
  background: #e6eef9;
  color: #1f3550;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}
body.dark-page .family-nav__catalog-trigger {
  border-color: color-mix(in srgb, var(--family-color) 58%, #8094b5 42%);
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 55%, var(--family-color) 45%), color-mix(in srgb, var(--surface-soft) 78%, var(--family-color) 22%));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 9px 22px rgba(0, 0, 0, .28), 0 0 20px color-mix(in srgb, var(--family-color) 15%, transparent);
}
body.dark-page .family-nav__catalog-trigger small {
  border-color: #8098b8;
  background: #2b3d55;
  color: #f2f6ff;
}
@media (max-width: 640px) {
  .category-directory-item {
    min-height: 62px;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
    border-radius: 14px;
  }
  .category-directory-icon { width: 38px; height: 38px; border-radius: 12px; }
  .category-directory-icon .brand-icon { width: 23px; height: 23px; }
  .category-directory-copy strong { font-size: 11px; }
  .category-directory-copy small { font-size: 9px; }
  .category-directory-price { grid-column: 2; margin-top: -5px; font-size: 11px; }
  .family-nav__catalog-trigger { min-width: 142px; }
}

/* Desktop category tabs share the same moving glass language as the header. */
@media (min-width: 641px) {
  .category-tabs {
    position: relative;
    isolation: isolate;
    align-items: center;
    flex-wrap: nowrap;
    width: max-content;
    max-width: 100%;
    overflow: hidden;
    padding: 5px;
    gap: 3px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--surface-soft) 92%, var(--text) 8%), color-mix(in srgb, var(--surface) 92%, var(--accent) 8%));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 5px 14px color-mix(in srgb, var(--text) 10%, transparent);
  }
  .category-tabs__glass {
    position: absolute;
    top: 5px;
    left: var(--category-glass-x, 0px);
    width: var(--category-glass-width, 0px);
    height: calc(100% - 10px);
    border: 1px solid rgba(255, 255, 255, .66);
    border-radius: 999px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .82), rgba(255, 255, 255, .38));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .86), 0 5px 14px rgba(57, 75, 105, .14);
    backdrop-filter: blur(13px) saturate(1.16);
    -webkit-backdrop-filter: blur(13px) saturate(1.16);
    opacity: 0;
    pointer-events: none;
    z-index: 0;
    will-change: left, width;
    transform: translateZ(0);
    transition: left .32s cubic-bezier(.2, .75, .2, 1), width .32s cubic-bezier(.2, .75, .2, 1), opacity .18s ease;
  }
  .category-tabs__glass::after {
    content: "";
    position: absolute;
    inset: 1px 15% auto;
    height: 1px;
    border-radius: inherit;
    background: rgba(255, 255, 255, .9);
  }
  .category-tabs.category-glass-ready .category-tabs__glass { opacity: 1; }
  .category-tabs.category-glass-instant .category-tabs__glass { transition: none; }
  .category-tabs button {
    position: relative;
    z-index: 1;
    transition: color .22s ease, transform .22s ease;
  }
  .category-tabs button.active {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: var(--text) !important;
  }
  body:not(.dark-page) .category-tabs {
    border-color: #d1dbe7;
    background: linear-gradient(145deg, #e9eef4, #dfe6ee);
    box-shadow: inset 0 1px 0 #ffffff, 0 4px 14px rgba(65, 87, 116, .08);
  }
  body.dark-page .category-tabs {
    border-color: #3a4758;
    background: linear-gradient(145deg, #1b2430, #111821);
    box-shadow: inset 0 1px 0 rgba(225, 237, 255, .07), 0 8px 20px rgba(0, 0, 0, .24);
  }
  body.dark-page .category-tabs__glass {
    border-color: rgba(171, 190, 220, .16);
    background: linear-gradient(145deg, rgba(43, 56, 76, .86), rgba(15, 21, 30, .96));
    box-shadow: inset 0 1px 0 rgba(205, 222, 246, .08), 0 7px 18px rgba(0, 0, 0, .34), 0 0 18px rgba(136, 169, 220, .06);
  }
  body.dark-page .category-tabs__glass::after { background: rgba(205, 220, 240, .12); opacity: .55; }
}
@media (max-width: 640px) { .category-tabs__glass { display: none; } }
@media (min-width: 641px) and (prefers-reduced-motion: reduce) {
  .category-tabs__glass { transition: none; }
}

/* ./loading.css */
.network-loading{position:fixed;inset:0;z-index:240;display:grid;place-content:center;justify-items:center;gap:22px;background:#080b11e8;backdrop-filter:blur(8px);color:#d2dceb;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s,visibility .24s}
.network-loading.is-visible{opacity:1;visibility:visible;pointer-events:auto}
.network-loading__filter{position:absolute;width:0;height:0;overflow:hidden}
.network-loading__liquid{font-size:12px;width:12em;height:3em;position:relative;overflow:hidden;border-bottom:3px solid #93b7e5;filter:url(#nova-loading-goo)}
.network-loading__liquid:before,.network-loading__liquid:after{content:"";position:absolute;border-radius:50%;will-change:transform}
.network-loading__liquid:before{width:22em;height:18em;background:#b8cff0;left:-2em;bottom:-18em;animation:nova-liquid-a 2s linear infinite}
.network-loading__liquid:after{width:16em;height:12em;background:#719bd4;left:-4em;bottom:-12em;animation:nova-liquid-b 2s linear infinite .75s}
.network-loading__label{font-size:12px;letter-spacing:2px;color:#aabbd2}
.network-loading__retry{padding:9px 18px;font-size:12px;border-radius:9px;border:1px solid #819abb55;background:#182233;color:#e0eaff;cursor:pointer}
.network-loading [hidden]{display:none}
@keyframes nova-liquid-a{from{transform:translateX(-10em) rotate(0)}to{transform:translateX(7em) rotate(180deg)}}
@keyframes nova-liquid-b{from{transform:translateX(-8em) rotate(0)}to{transform:translateX(8em) rotate(180deg)}}
@media(prefers-reduced-motion:reduce){.network-loading{transition:none}.network-loading__liquid:before,.network-loading__liquid:after{animation:none}.network-loading__liquid:before{bottom:-16em}}
.payment-wait-card{max-width:610px;min-height:460px;margin:30px auto 45px;display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center;padding:45px 28px;border:1px solid #c5d6ef1a;border-radius:24px;background:radial-gradient(ellipse at 50% 0,#25355066,transparent 70%),#10141be8;box-shadow:inset 0 1px 0 #ffffff09,0 25px 70px #0003}
.payment-wait-kicker{font-size:9px;letter-spacing:4px;color:#8091ac;margin:30px 0 14px}.payment-wait-card h1{font-size:25px;font-weight:500;letter-spacing:-.5px;color:#edf3ff}.payment-wait-status{font-size:12px;color:#8e9db4;line-height:1.8;margin-top:13px}.payment-wait-amount{font-size:37px;font-weight:450;color:#eef4ff;letter-spacing:-1px;margin-top:25px}.payment-wait-amount small{font-size:18px;margin-right:4px;color:#93a7c5}.payment-wait-product{font-size:11px;color:#a6b4cc;margin-top:8px}.payment-wait-note{font-size:10px;color:#718096;margin-top:21px}.payment-wait-card .link-button{font-size:11px;margin-top:24px;color:#aec5e9}
@media(max-width:640px){.payment-wait-card{margin:15px auto;min-height:410px;padding:35px 20px}.payment-wait-card h1{font-size:22px}}

/* ./app-tooltips.css */
/* ./icon-layers.css */
.product-marquee__tile,.dark-page .product-marquee__tile,.product-family-nav .family-nav__button,.product-family-nav[data-family="x"] .family-nav__button{padding:0;background:transparent;border-color:transparent;box-shadow:none;overflow:visible;transform:none}
.product-marquee__tile:is(:focus-visible,:active),.dark-page .product-marquee__tile:is(:focus-visible,:active),.product-family-nav .family-nav__button:focus-visible,.product-family-nav[data-family="x"] .family-nav__button:focus-visible{background:transparent;border-color:transparent;box-shadow:none;transform:none}
.icon-stack{position:relative;display:block;width:100%;height:100%;pointer-events:none;transform-origin:center;transition:transform .3s ease;--layer-step:3.5px}
.icon-stack__layer{position:absolute;inset:0;border:1px solid currentColor;border-radius:11px;opacity:0;transition:transform .3s ease,opacity .3s ease}
.icon-stack__front{display:grid;place-items:center;opacity:1;border-color:#c8d1df;border-top-color:#fff;background:linear-gradient(145deg,#f2f4f8,#e3e8f0);box-shadow:inset 0 1px 1px #fff8}
/* Every brand mark gets the same drawing box and optical center.  This keeps
   asymmetric marks such as Apple, X and Gmail aligned inside their tiles. */
:is(.product-marquee__tile,.family-nav__button) .icon-stack__front > svg,
:is(.product-marquee__tile,.family-nav__button) .icon-stack__front > .brand-icon {
  display: block;
  place-self: center;
  margin: 0;
  transform: none;
}
@media(min-width:641px){body:not(.dark-page) .product-marquee__tile .icon-stack__front{border-color:#b8c9dc;background:linear-gradient(145deg,#eef2f8,#e0e8f2);box-shadow:inset 0 1px 1px #ffffff55}}
.dark-page .product-marquee__tile .icon-stack__front{background:linear-gradient(145deg,#252d39,#171c25 65%,#131821);border-color:#b6c9e527;border-top-color:#dce7ff4a;box-shadow:inset 0 1px 1px #ffffff0a,0 4px 12px #0003}
.product-family-nav .icon-stack{--layer-step:2.25px}
.product-family-nav .icon-stack__front{background:var(--family-tile);border-color:color-mix(in srgb,var(--family-color) 23%,transparent);border-top-color:color-mix(in srgb,var(--family-color) 38%,transparent)}
.product-family-nav .family-nav__selected .icon-stack__front{border-color:color-mix(in srgb,var(--family-color) 65%,#cbd5e1);background:color-mix(in srgb,var(--family-color) 18%,#11161e);box-shadow:inset 0 1px 0 #ffffff0b,0 0 15px -7px var(--family-color)}
.product-family-nav[data-family="x"] .icon-stack__front{background:var(--family-tile);border-color:color-mix(in srgb,var(--family-color) 26%,transparent);border-top-color:color-mix(in srgb,var(--family-color) 42%,transparent)}
.product-family-nav[data-family="x"] .family-nav__selected .icon-stack__front{background:color-mix(in srgb,var(--family-color) 20%,#11161e);border-color:#cbd5e199;box-shadow:inset 0 1px 0 #ffffff14,0 0 16px -6px #cbd5e1}
.family-nav__button .icon-stack__front .brand-icon{width:58%;height:58%}
:is(.product-marquee__tile,.family-nav__button):focus-visible .icon-stack{transform:rotate(-35deg) skew(20deg)}
:is(.product-marquee__tile,.family-nav__button):focus-visible .icon-stack__layer:nth-child(1){opacity:.2}
:is(.product-marquee__tile,.family-nav__button):focus-visible .icon-stack__layer:nth-child(2){opacity:.4;transform:translate(var(--layer-step),calc(-1 * var(--layer-step)))}
:is(.product-marquee__tile,.family-nav__button):focus-visible .icon-stack__layer:nth-child(3){opacity:.6;transform:translate(calc(2 * var(--layer-step)),calc(-2 * var(--layer-step)))}
:is(.product-marquee__tile,.family-nav__button):focus-visible .icon-stack__layer:nth-child(4){opacity:.8;transform:translate(calc(3 * var(--layer-step)),calc(-3 * var(--layer-step)))}
:is(.product-marquee__tile,.family-nav__button):focus-visible .icon-stack__layer:nth-child(5){opacity:1;transform:translate(calc(4 * var(--layer-step)),calc(-4 * var(--layer-step)))}
@media(hover:hover) and (pointer:fine){
 .product-marquee__tile:hover,.dark-page .product-marquee__tile:hover,.product-family-nav .family-nav__button:hover,.product-family-nav[data-family="x"] .family-nav__button:hover{background:transparent;border-color:transparent;box-shadow:none;transform:none}
 .product-marquee__item:has(+.product-marquee__item:hover)>.product-marquee__tile,.product-marquee__item:hover+.product-marquee__item>.product-marquee__tile{transform:none}
 :is(.product-marquee__tile,.family-nav__button):hover .icon-stack{transform:rotate(-35deg) skew(20deg)}
 :is(.product-marquee__tile,.family-nav__button):hover .icon-stack__layer:nth-child(1){opacity:.2}
 :is(.product-marquee__tile,.family-nav__button):hover .icon-stack__layer:nth-child(2){opacity:.4;transform:translate(var(--layer-step),calc(-1 * var(--layer-step)))}
 :is(.product-marquee__tile,.family-nav__button):hover .icon-stack__layer:nth-child(3){opacity:.6;transform:translate(calc(2 * var(--layer-step)),calc(-2 * var(--layer-step)))}
 :is(.product-marquee__tile,.family-nav__button):hover .icon-stack__layer:nth-child(4){opacity:.8;transform:translate(calc(3 * var(--layer-step)),calc(-3 * var(--layer-step)))}
 :is(.product-marquee__tile,.family-nav__button):hover .icon-stack__layer:nth-child(5){opacity:1;transform:translate(calc(4 * var(--layer-step)),calc(-4 * var(--layer-step)))}
}
.product-marquee__tile:focus-visible,.family-nav__button:focus-visible{outline:1px solid #c3d9ff99;outline-offset:5px}
@media(max-width:640px){.product-marquee__tile .icon-stack{--layer-step:2.5px}}
@media(prefers-reduced-motion:reduce){.icon-stack,.icon-stack__layer{transition:none}}

/* A transparent opening layer must not expose either custom or native hints. */
body.opening-pending #app,
body:has(.gravity-opening,.arrival-layer,.starlight-opening,.video-opening,.cinematic-intro) #app { pointer-events: none; }
body.opening-pending .app-hint,
body:has(.gravity-opening,.arrival-layer,.starlight-opening,.video-opening,.cinematic-intro) .app-hint { display: none !important; }
/* App identification inspired by the user's vikas7754 layered-icon reference. */
.app-hint{position:fixed;left:0;top:0;z-index:210;width:max-content;max-width:calc(100vw - 24px);padding:9px 12px;border:1px solid #b8cdea29;border-radius:12px;background:linear-gradient(145deg,#222a38f7,#121720fa);box-shadow:0 8px 24px #0006,inset 0 1px 0 #f0f6ff08;backdrop-filter:blur(16px);color:#dce7f8;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .18s,transform .18s;font-family:inherit}
.app-hint.is-visible{opacity:1;transform:translateY(0)}
.app-hint[data-placement="below"]:not(.is-visible){transform:translateY(-4px)}
.app-hint__head{display:flex;align-items:center;gap:9px}
.app-hint__icon{position:relative;display:grid;place-items:center;width:29px;height:29px;flex:none;color:var(--hint-color,#bcd1ee);border:1px solid #bfd8ff30;border-radius:8px;background:#1a2434}
.app-hint__icon svg{display:block;width:19px;height:19px}
.app-hint strong{font-size:12px;font-weight:550;line-height:1.4;max-width:190px}
@media(prefers-reduced-motion:reduce){.app-hint{transition:none}}

/* ./storefront-polish.css */
#app,#overlay-root,.app-hint{-webkit-user-select:none;user-select:none}
input,textarea,[contenteditable="true"],.order-credentials-text{-webkit-user-select:text;user-select:text}
#app img,#app svg{-webkit-user-drag:none}
.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap}
.card-price{display:inline-flex;align-items:baseline;white-space:nowrap;flex:none;line-height:1.2}
.card-price em{display:inline;white-space:nowrap;flex:none;margin-left:4px}
.card-price small{flex:none}
.product-card{position:relative;isolation:isolate}
.product-card>.card-stars{position:absolute;inset:0;z-index:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.product-card>:not(.card-stars){position:relative;z-index:1}
.card-stars i{position:absolute;left:var(--star-x);top:var(--star-y);width:var(--star-size);height:var(--star-size);border-radius:50%;background:#d9e9ff;opacity:.18;box-shadow:0 0 3px #b9d6ff33;animation:card-starlight var(--star-period) var(--star-delay) ease-in-out infinite}
@keyframes card-starlight{0%,78%,86%,100%{opacity:.16;box-shadow:0 0 2px #b9d6ff22}81%{opacity:.8;box-shadow:0 0 5px #b9d6ff77}83%{opacity:.38;box-shadow:0 0 3px #b9d6ff44}}
body:not(.dark-page) .card-stars{display:none}
.dark-page .stage-art--x>.brand-icon{color:#edf1f8!important;filter:drop-shadow(0 4px 20px #c7dcff0b)}
.stage-art--x:before{background:radial-gradient(ellipse,#8ca4ca22,transparent 70%)}
.site-footer{margin-top:30px;padding:25px 0;align-items:center;font-size:10px}
.collection,.site-footer,.dark-page .card-bottom,.panel-total,.token-product-page .panel-total,.term-row,.summary-row.total,.checkout-bottom,.order-credential-card{border-top:0;border-bottom:0}
.site-footer .footer-links{gap:20px}
.site-footer .footer-links button{font-size:10px;color:var(--secondary)}
@media(max-width:640px){
 .product-grid,.dark-page .product-grid{gap:12px}
 .product-card,.dark-page .product-card{min-height:178px;padding:14px 12px;border-radius:16px;transform:none}
 .product-card:is(:hover,:focus-visible),.dark-page .product-card:is(:hover,:focus-visible){transform:none}
 .dark-page .product-card:hover{box-shadow:0 0 22px -12px color-mix(in srgb,var(--brand-color) 40%,#dce7ff),inset 0 0 35px #e2edff04;border-color:#cbdcff2b}
 .dark-page .product-card:hover .card-brand{transform:none;box-shadow:inset 0 1px 0 #ffffff05,0 4px 8px #0002}
 .card-top,.dark-page .card-top{margin-bottom:12px;align-items:center}
 .product-card .card-brand,.dark-page .product-card .card-brand{width:36px;height:36px;border-radius:10px}
 .product-card .card-brand .brand-icon,.dark-page .product-card .card-brand .brand-icon{width:23px;height:23px}
 .product-card h3,.dark-page .product-card h3{font-size:12px;line-height:1.4;min-height:17px;margin-bottom:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis}
 .product-card .card-description,.dark-page .product-card .card-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:28px;line-height:1.55}
 .card-tag,.dark-page .card-tag{font-size:6.5px;line-height:1.3;padding:3px 4px}
 .product-card .card-bottom,.dark-page .product-card .card-bottom{margin-top:auto;padding-top:12px;min-height:42px}
 .dark-page .card-price,.card-price{font-size:18px;letter-spacing:-.5px}
 .dark-page .card-price small{font-size:9px;margin-right:2px}
 .dark-page .card-price em{font-size:8px;margin-left:3px}
 .card-bottom{gap:6px}
 .card-stars i:nth-child(4){display:none}
 .site-footer{display:flex;align-items:center;justify-content:space-between;flex-direction:row;gap:12px;margin-top:22px;padding:24px 0;font-size:9px}
 .site-footer .footer-links{gap:28px}
 .site-footer .footer-links button{font-size:10px}
}
@media(max-width:360px){.dark-page .card-price,.card-price{font-size:16px;letter-spacing:-.6px}.card-bottom{gap:4px}.product-card,.dark-page .product-card{min-height:174px;padding:13px 10px}.product-card h3,.dark-page .product-card h3{font-size:11px}.dark-page .card-tag,.card-tag{font-size:6px;padding:3px}}
@media(prefers-reduced-motion:reduce){.card-stars i{animation:none}}

/* Minimal footer: one centered NOVA SELECT mark across every viewport. */
.site-footer { justify-content: center; text-align: center; }
.site-footer .footer-links { display: none; }
@media (max-width: 640px) { .site-footer { align-items: center; justify-content: center; flex-direction: row; gap: 0; } }

/* ./explore-glitch.css */
/* User-selected Uiverse.io glitch effect by 212004ALJI.
   The sliced overlay animates; the real button keeps a stable hitbox. */
.home-hero .hero-actions .btn[data-action="explore"]{position:relative;isolation:isolate;overflow:visible;border:1px solid #91bcd64d;border-radius:9px;background:#12192599;color:#e5edf9;box-shadow:none;transform:none;translate:none;scale:1;animation:none;transition:background-color .2s,border-color .2s,box-shadow .2s}
.home-hero .hero-actions .btn[data-action="explore"]:is(:hover,:active,:focus-visible){background:#12192599;border-color:#4ad5dc;box-shadow:0 10px 10px -10px #1df2f0aa;color:#fff;transform:none;translate:none;scale:1;text-shadow:-1px -1px 0 #1df2f0,1px 1px 0 #e94be8}
.btn[data-action="explore"]>.explore-label{position:relative;display:block;pointer-events:none}
.btn[data-action="explore"] .icon{pointer-events:none;transform:none;animation:none}
.home-hero .hero-actions .btn[data-action="explore"]::after,.btn[data-action="explore"]>.explore-label::after{--move1:inset(50% 50% 50% 50%);--move2:inset(31% 0 40% 0);--move3:inset(39% 0 15% 0);--move4:inset(45% 0 40% 0);--move5:inset(45% 0 6% 0);--move6:inset(14% 0 61% 0);position:absolute;display:block;clip-path:var(--move1);pointer-events:none;background:transparent}
.home-hero .hero-actions .btn[data-action="explore"]::after{content:"";inset:-1px;border:3px solid #1df2f0;border-radius:inherit}
.btn[data-action="explore"]>.explore-label::after{content:attr(data-text);inset:0;color:#fff;text-shadow:-3px -3px 0 #1df2f0,3px 3px 0 #e94be8;white-space:nowrap}
.home-hero .hero-actions .btn[data-action="explore"]:is(:hover,:active,:focus-visible)::after,.btn[data-action="explore"]:is(:hover,:active,:focus-visible)>.explore-label::after{animation:nova-explore-glitch 1s steps(2,end) 1}
@keyframes nova-explore-glitch{
 0%{clip-path:var(--move1);transform:translate(0,-10px)}
 10%{clip-path:var(--move2);transform:translate(-10px,10px)}
 20%{clip-path:var(--move3);transform:translate(10px,0)}
 30%{clip-path:var(--move4);transform:translate(-10px,10px)}
 40%{clip-path:var(--move5);transform:translate(10px,-10px)}
 50%{clip-path:var(--move6);transform:translate(-10px,10px)}
 60%{clip-path:var(--move1);transform:translate(10px,-10px)}
 70%{clip-path:var(--move3);transform:translate(-10px,10px)}
 80%{clip-path:var(--move2);transform:translate(10px,-10px)}
 90%{clip-path:var(--move4);transform:translate(-10px,10px)}
 100%{clip-path:var(--move1);transform:translate(0)}
}
@media(prefers-reduced-motion:reduce){.home-hero .hero-actions .btn[data-action="explore"]::after,.btn[data-action="explore"]>.explore-label::after{animation:none!important}.home-hero .hero-actions .btn[data-action="explore"]:is(:hover,:active,:focus-visible){text-shadow:none}}

/* ./theme-switch.css */
/* Muted blue-silver sun and cool crescent, within the original header dimensions. */
.site-header .theme-toggle.change-theme__icon{position:relative;width:32px;height:32px;flex:none;display:grid;place-items:center;overflow:hidden;padding:4px;border:1px solid var(--border);border-radius:10px;background:linear-gradient(145deg,#d8e5ff0a,#d8e5ff02);box-shadow:inset 0 1px 0 #eff6ff05;transition:border-color .25s,background .25s}
.site-header .theme-toggle.change-theme__icon:hover{border-color:#91a7c044;background:#91a7c009}
.theme-toggle .theme-orb{display:block;width:22px;height:22px;overflow:visible;pointer-events:none}
.theme-orb__sun,.theme-orb__moon{transform-origin:12px 12px;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.theme-orb__sun{opacity:1;transform:rotate(0) scale(1)}
.theme-orb__rays{transform-origin:12px 12px;stroke:#899bb1;stroke-width:1.35;stroke-linecap:round;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.theme-orb__core{filter:drop-shadow(0 0 2px #91a7c01c)}
.theme-orb__moon{opacity:0;transform:rotate(-38deg) scale(.6)}
.theme-toggle[data-theme-current="light"] .theme-orb__sun{opacity:0;transform:rotate(50deg) scale(.5)}
.theme-toggle[data-theme-current="light"] .theme-orb__moon{opacity:1;transform:rotate(0) scale(1)}
.theme-toggle:is(:hover,:focus-visible) .theme-orb__rays{transform:rotate(35deg)}
.theme-toggle[data-theme-current="light"]:is(:hover,:focus-visible) .theme-orb__moon{transform:rotate(-12deg) scale(1.04)}
body:not(.dark-page) .theme-toggle{background:#e8edf5;border-color:#c9d4e4}
body:not(.dark-page) .theme-orb__moon{fill:#576a89}
@media(max-width:640px){.site-header .theme-toggle.change-theme__icon{width:29px;height:29px;padding:3px}.site-header .header-actions{gap:15px}.theme-toggle .theme-orb{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){.theme-orb__sun,.theme-orb__moon,.theme-orb__rays{transition:none}}

/* ./squishy-buttons.css */
/* Visual-only squeeze from user-supplied Uiverse.io / Botwe-Felix5820. */
.squishy-button{position:relative;isolation:isolate;overflow:visible;background:transparent!important;border-width:0!important;box-shadow:none!important;padding:0!important;transform:none!important;translate:none!important;scale:1!important;min-height:var(--squish-height)}
.squishy-button .squish-face{position:relative;display:inline-flex;align-items:center;justify-content:inherit;gap:inherit;border-radius:inherit;pointer-events:none;transform-origin:center;white-space:inherit;flex:1;min-width:0;min-height:var(--squish-height);width:100%;box-sizing:border-box}
.squishy-button:focus-visible{outline-offset:5px}
@media(prefers-reduced-motion:reduce){.squish-face{transform:none!important}}

/* ./copy-actions.css */
/* Double-document press/bounce from user-supplied Uiverse.io / Codecite. */
.copy-action{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:none;min-height:32px;padding:0 10px;border:1px solid #a5c6eb2b;border-radius:9px;background:#8aaddc0a;color:#c4d9f1;font-family:inherit;font-size:10px;font-weight:500;line-height:1;cursor:pointer;transition:background .2s,border-color .2s}
.copy-action:hover{background:#8aaddc14;border-color:#b4d4fa54}
.copy-files{display:block;position:relative;width:18px;height:20px;flex:none;pointer-events:none}
.copy-files svg{display:block;width:18px;height:20px;fill:none}
.copy-files svg:nth-child(2){position:absolute;inset:0}
.copy-files .copy-back{fill:#d6e7fb}.copy-files .copy-front{fill:#a8c6ed}.copy-files .copy-fold{fill:#6889b8}
.copy-action:active .copy-files{animation:nova-copy-press .2s linear 1}
.copy-action:active .copy-files svg:nth-child(2){animation:nova-copy-bounce .2s linear 1}
.copy-files .copy-checkmark{display:none;position:absolute;inset:0;color:#a4dabf}
.copy-action.is-copied .copy-files>svg:not(.copy-checkmark){display:none}
.copy-action.is-copied .copy-checkmark{display:block}
.copy-feedback{position:absolute;z-index:5;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%);padding:7px 9px;border:1px solid #c7daf02b;border-radius:7px;background:#253246;color:#e1edfc;font-size:10px;line-height:1.3;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none}
.copy-feedback:before{content:attr(data-text-initial)}
.copy-feedback:after{content:"";position:absolute;left:50%;bottom:-4px;width:6px;height:6px;transform:translateX(-50%) rotate(45deg);background:inherit}
.copy-action:is(:hover,:focus-visible,.is-copied)>.copy-feedback{opacity:1;visibility:visible}
.copy-action.is-copied>.copy-feedback:before{content:attr(data-text-end)}
.summary-order-id{display:flex;align-items:flex-start;justify-content:flex-end;gap:8px;min-width:0}
.summary-order-id>span{overflow-wrap:anywhere;min-width:0}
.summary-order-id .copy-action{width:28px;min-height:28px;padding:4px;border-radius:7px}
.summary-order-id .copy-files,.summary-order-id .copy-files svg{width:14px;height:16px}
.summary-order-id .copy-action__label{display:none}
.credential-actions{display:flex;align-items:stretch;gap:8px}
.credential-actions>.copy-action,.credential-actions>.btn{flex:1;min-width:0;min-height:39px;font-size:10px}
.order-credential-card .credential-actions>.btn{width:auto}
body:not(.dark-page) .copy-action{color:#4e6587;border-color:#b4c8e2;background:#edf3fc}
@keyframes nova-copy-press{0%,100%{transform:scale(1)}50%{transform:scale(.92)}}
@keyframes nova-copy-bounce{0%{transform:translate(0,0);opacity:1}50%{transform:rotate(5deg) translate(6px,-10px);opacity:.8}100%{transform:scale(.9) rotate(10deg) translate(13px,-20px);opacity:0}}
@media(prefers-reduced-motion:reduce){.copy-action .copy-files,.copy-action .copy-files svg{animation:none!important}}

/* ./home-reference.css */
/* Keep the original homepage layout and animated canvas.  The glass frame is
   part of the same tilted button as its icon, so it never sits upright around it. */
.home-hero .hero-art .floating-brand {
  padding:0;
  cursor:pointer;
  touch-action:manipulation;
  animation:float 7s ease-in-out infinite;
  transition:box-shadow .24s ease,border-color .24s ease,background .24s ease;
}
.home-hero .hero-art .float-muse {animation-delay:-.4s}
.home-hero .hero-art .float-tg {animation-delay:-2s}
.home-hero .hero-art .float-x {animation-delay:-4s}
.home-hero .hero-art .float-gemini {animation-delay:-5.4s}
.dark-page .home-hero .hero-art .floating-brand {
  background:radial-gradient(ellipse at 35% 16%,rgba(102,124,155,.31),rgba(31,40,54,.69) 47%,rgba(10,14,21,.86) 100%);
  border:1px solid rgba(182,210,241,.32);
  border-top-color:rgba(218,233,255,.46);
  box-shadow:inset 0 1px 2px #e3f2ff25,inset 0 -4px 14px #0005,0 7px 18px #0006;
  backdrop-filter:blur(5px);
}
.dark-page .home-hero .floating-brand .brand-icon {filter:drop-shadow(0 0 3px #67adf080)}
.dark-page .home-hero .float-x {color:#dbeeff}
.dark-page .home-hero .float-gemini svg path[fill="url(#gemini)"] {fill:#e9f5ff}
.dark-page .home-hero .hero-art .floating-brand:is(:hover,:focus-visible) {
  border-color:rgba(185,217,250,.7);
  box-shadow:inset 0 1px 3px #ecf7ff33,inset 0 -4px 14px #0005,0 0 0 1px #bedfff25,0 0 16px #83c0ff30;
}
.home-hero .floating-brand:focus-visible {outline:2px solid #d2e8ff;outline-offset:3px}
body:has(.gravity-opening) .home-hero .floating-brand {animation-play-state:paused}
@media(prefers-reduced-motion:reduce) {.home-hero .hero-art .floating-brand {animation:none;transition:none}}

/* ./cosmic-details.css */
/* Separate decorative layers retain their original layout while drifting independently. */
.home-hero > .hero-art::before { content: none; }
.home-hero > .hero-art > .cosmic-details {
  position: absolute;
  inset: -5% -16% -3% -45%;
  z-index: -1;
  overflow: clip;
  pointer-events: none;
  opacity: .78;
  filter: brightness(.9) saturate(.88);
}
.cosmic-detail {
  position: absolute;
  display: block;
  pointer-events: none;
}
.cosmic-detail img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  user-select: none;
}
.cosmic-detail--galaxy {
  left: 2%; top: 7%;
  width: clamp(135px, 15vw, 215px);
  aspect-ratio: 1942 / 809;
  transform: translate(-2%, -7%);
}
.cosmic-detail--dust {
  left: 6%; top: 86%;
  width: clamp(160px, 17vw, 240px);
  aspect-ratio: 2170 / 725;
  transform: translate(-6%, -86%);
}
.cosmic-detail--planet {
  right: 0; top: 96%;
  width: clamp(150px, 11vw, 190px);
  aspect-ratio: 1511 / 1041;
  transform: translateY(-96%);
}
.cosmic-detail--galaxy img { animation: cosmic-galaxy-drift 17s cubic-bezier(.37,.02,.63,.98) infinite alternate; transform-origin: 50% 50%; }
.cosmic-detail--dust img { animation: cosmic-dust-drift 14s cubic-bezier(.37,.02,.63,.98) infinite alternate; transform-origin: 50% 50%; }
.cosmic-detail--planet img { animation: cosmic-planet-drift 16s cubic-bezier(.37,.02,.63,.98) infinite alternate; transform-origin: 50% 50%; }
@keyframes cosmic-galaxy-drift {
  from { transform: translate3d(-7px, 3px, 0) rotate(-2.2deg) scale(.98); }
  to { transform: translate3d(8px, -4px, 0) rotate(2.6deg) scale(1.02); }
}
@keyframes cosmic-dust-drift {
  from { transform: translate3d(-10px, 3px, 0) rotate(-1.4deg) scale(.98); }
  to { transform: translate3d(9px, -3px, 0) rotate(1.8deg) scale(1.02); }
}
@keyframes cosmic-planet-drift {
  from { transform: translate3d(-5px, 4px, 0) rotate(-1.8deg) scale(.98); }
  to { transform: translate3d(7px, -5px, 0) rotate(2.1deg) scale(1.02); }
}
body:not(.dark-page) .home-hero > .hero-art > .cosmic-details { opacity: .3; }
@media (max-width: 640px) {
  .home-hero > .hero-art > .cosmic-details { inset: 0 -5% 0 -3%; opacity: .65; }
  .cosmic-detail--galaxy { left: 1%; top: 8%; width: 24%; transform: translate(-1%, -8%); }
  .cosmic-detail--dust { left: 0; top: 90%; width: 30%; transform: translateY(-90%); }
  .cosmic-detail--planet { top: 100%; width: 21%; transform: translateY(-100%); }
}
@media (prefers-reduced-motion: reduce) {
  .cosmic-detail img { animation: none; }
}







/* Keep wide decorative layers within the viewport without moving the hero. */
html, body { overflow-x: clip; }


/* Keep the drifting planet clear of the Gemini badge on narrower desktops. */
@media (min-width: 641px) {
  .cosmic-detail--planet {
    right: min(clamp(0px, calc(690px - 50vw), 50px), clamp(25px, calc(290px - 25vw), 50px));
  }
}
@media (min-width: 641px) and (max-width: 1300px) {
  .home-hero > .hero-art > .cosmic-details { overflow: visible; }
  .cosmic-detail--planet {
    top: calc(100% - 30px - clamp(0px, calc(60vw - 648px), 90px));
    width: clamp(90px, calc(11vw + 7px), 150px);
    transform: none;
  }
}


/* The hero scene should read as a living celestial system at a glance. */
.orbit-canvas {
  transform-origin: 54% 52%;
  animation: hero-blackhole-float 11s cubic-bezier(.37,.02,.63,.98) infinite alternate;
  will-change: transform;
}
@keyframes hero-blackhole-float {
  from { transform: translate3d(-5px, 3px, 0) rotate(-.55deg) scale(1); }
  50% { transform: translate3d(3px, -4px, 0) rotate(.35deg) scale(1.012); }
  to { transform: translate3d(7px, 2px, 0) rotate(.65deg) scale(1.018); }
}
@media (max-width: 640px) {
  .orbit-canvas { animation-duration: 9s; }
}

@media (prefers-reduced-motion: reduce) {
  .orbit-canvas { animation: none; }
}

/* ./theme-system.css */
/* Daylight accents: keep the same space imagery, with soft sky tones around it. */
body:not(.dark-page) .home-hero > .hero-art::before {
  content: "";
  display: block;
  position: absolute;
  inset: -10% -15% -8% -30%;
  z-index: -2;
  border-radius: 0;
  pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 0%, #000 38%, transparent 100%);
  mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 0%, #000 38%, transparent 100%);
  background:
    radial-gradient(ellipse at 62% 53%, rgba(150, 174, 208, .24), rgba(197, 214, 233, .11) 43%, transparent 70%),
    radial-gradient(ellipse at 24% 20%, rgba(181, 201, 226, .22), transparent 40%),
    radial-gradient(ellipse at 22% 80%, rgba(191, 205, 223, .17), transparent 40%),
    radial-gradient(ellipse at 90% 80%, rgba(221, 201, 177, .18), transparent 40%);
}
body:not(.dark-page) .home-hero > .hero-art > .cosmic-details {
  opacity: .9;
  filter: brightness(.98) saturate(.9);
}

body:not(.dark-page) .home-hero .hero-art .floating-brand {
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(222,232,245,.57));
  border-color: rgba(255,255,255,.82);
  box-shadow: inset 0 1px 2px #fff9, 0 7px 20px #5672981c;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

/* Preserve each recognizable brand against the translucent daylight tiles. */
body:not(.dark-page) .home-hero .hero-art .float-muse { color: #2265c8; }
body:not(.dark-page) .home-hero .hero-art .float-tg { color: #0879b5; }
body:not(.dark-page) .home-hero .hero-art .float-x { color: #29384d; }
body:not(.dark-page) .home-hero .hero-art .float-gemini .brand-icon {
  filter: saturate(1.2) brightness(.78);
}
/* Light cards and page sky use muted blue pinpoints instead of white flashes. */
body:not(.dark-page) .page-starfield { visibility: visible; opacity: .65; }
body:not(.dark-page) .card-stars { display: block; }
body:not(.dark-page) .card-stars i {
  background: #8faed6;
  box-shadow: 0 0 3px #8aaad52b;
  animation-name: card-starlight-day;
}
@keyframes card-starlight-day {
  0%, 78%, 86%, 100% { opacity: .18; box-shadow: 0 0 2px #8aaad521; }
  81% { opacity: .52; box-shadow: 0 0 4px #8aaad54a; }
  83% { opacity: .28; box-shadow: 0 0 3px #8aaad530; }
}

/* The product-family icons retain their selected brand colour on light tiles. */
body:not(.dark-page) .product-family-nav {
  --family-tile: color-mix(in srgb, var(--family-color) 9%, #eef3f9);
}
body:not(.dark-page) .product-family-nav .icon-stack__front {
  background: var(--family-tile);
  border-color: color-mix(in srgb, var(--family-color) 19%, #dbe4f0);
  border-top-color: #fff;
  box-shadow: inset 0 1px 0 #fffc, 0 2px 6px #536f9410;
}
body:not(.dark-page) .product-family-nav .family-nav__selected .icon-stack__front {
  background: color-mix(in srgb, var(--family-color) 14%, #f2f6fc);
  border-color: color-mix(in srgb, var(--family-color) 38%, #dbe4f0);
  box-shadow: inset 0 1px 0 #fffc, 0 2px 8px #536f9415;
}
body:not(.dark-page) .product-family-nav[data-family="x"] { --family-tile: #edf0f5; }
body:not(.dark-page) .product-family-nav[data-family="x"] .family-nav__selected .icon-stack__front {
  background: #e6ebf2;
  border-color: #c9d1dc;
}
@media (prefers-reduced-motion: reduce) {
  body:not(.dark-page) .card-stars i { animation: none; opacity: .18; }
}

/* Daylight reading palette: secondary text remains clear on white and blue-tinted surfaces. */
body:not(.dark-page) {
  --muted: #526176;
  --secondary: #48576b;
}
body:not(.dark-page) .hero-copy h1 span { color: #56647a; }
body:not(.dark-page) .site-header .space-brand__name small { color: #52647e; }
body:not(.dark-page) input::placeholder,
body:not(.dark-page) textarea::placeholder { color: #5d6a7d; opacity: 1; }
body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"] {
  background: #1b2737;
}
body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"]:is(:hover, :active, :focus-visible) {
  background: #223149;
}

/* Muse Token uses its own colors; keep its supporting copy equally legible. */
body:not(.dark-page) .token-product-page { --token-note: #526176; }
body:not(.dark-page) .token-product-page .panel-subtitle,
body:not(.dark-page) .token-product-page .field-heading > span,
body:not(.dark-page) .token-product-page .variant-detail,
body:not(.dark-page) .token-product-page .pay-label small,
body:not(.dark-page) .token-product-page .product-consent-row,
body:not(.dark-page) .token-product-page .total-label,
body:not(.dark-page) .token-product-page .total-label small { color: #526176; }
body:not(.dark-page) .token-product-page .text-input::placeholder { color: #5d6a7d; opacity: 1; }

/* Order and payment labels retain their status colors without fading into the page. */
body:not(.dark-page) .order-status { color: #426f4a; }
body:not(.dark-page) .order-status.pending { color: #805a22; }
body:not(.dark-page) .order-status.expired { color: var(--muted); }
body:not(.dark-page) .payment-center > p.demo-warning { color: #905620 !important; }
body:not(.dark-page) .orders-dialog { --orders-muted: #526176; }
body:not(.dark-page) #orders-lookup-form input::placeholder { color: #5d6a7d; opacity: 1; }
body:not(.dark-page) .orders-dialog .orders-token-help,
body:not(.dark-page) .orders-recent h3 span,
body:not(.dark-page) .orders-all-button { color: #526176; }


/* Keep labels inside highlighted controls and notices readable in daylight. */
body:not(.dark-page) .recommend { color: #3853a2; }
body:not(.dark-page) .pay-mark.alipay { background: #0765d9; }
body:not(.dark-page) .pay-mark.usdt { background: #16765e; }
body:not(.dark-page) .notice-alert { color: #8e502c; }
body:not(.dark-page) .term-no { color: #526176; }
body:not(.dark-page) .payment-wait-note { color: #a3b4cc; }

/* ./hero-random-float.css */
/* The random drift owns translation only, preserving the tilted glass icons. */
.hero-random-float-target { animation: none !important; }
.home-hero > .hero-art > .cosmic-details { overflow: visible; }
/* Reduced motion pauses the simulation at its safe static position. */


/* ./readability.css */
/* Keep supporting information legible without changing the established layout. */
@media (min-width: 641px) {
  body .product-card .card-description { font-size: 11px; }
  body .variant-detail, body .input-help, body .pay-label small,
  body .order-credential-card p { font-size: 11px; }
}

@media (max-width: 640px) {
  body .orders-label, body .page-back-button { font-size: 12px; }
  body .page-back-trail { font-size: 10px; }
  body .site-footer, body .site-footer button { font-size: 11px; }

  body .category-tabs button { font-size: 11px; }
  body .section-heading p { font-size: 11px; }
  body .product-card h3 { font-size: 13px; }
  body .product-card .card-tag { font-size: 9px; line-height: 1.3; }
  body .product-card .card-description { font-size: 11px !important; line-height: 1.5; min-height: 33px; }
  body .card-price small, body .card-price em { font-size: 10px; }

  body .stage-caption p, body .panel-tag, body .field-heading > span,
  body .quantity-label small, body .input-help, body .panel-bottom-note,
  body .token-product-page .field-heading > span,
  body .token-product-page .input-help { font-size: 11px; }
  body .panel-subtitle, body .token-product-page .panel-subtitle { font-size: 13px; }
  body .field-heading, body .quantity-label, body .form-field > label,
  body .variant-name, body .pay-label, body .token-product-page .variant-name,
  body .token-product-page .pay-label { font-size: 13px; }
  body .variant-detail, body .token-product-page .variant-detail { font-size: 11px; }
  body .pay-label small, body .token-product-page .pay-label small { font-size: 10px; }
  body .text-input { font-size: 16px; }
  body .product-consent-row, body .product-consent-row button,
  body .token-product-page .product-consent-row,
  body .token-product-page .product-consent-row button { font-size: 11px; }

  body .checkout-progress { font-size: 10px; }
  body .checkout-header p, body .notice-alert p, body .terms-contact,
  body .terms-contact button, body .summary-detail, body .payment-center > p,
  body .payment-center p.demo-warning, body .order-credential-card p,
  body .order-credential-legacy { font-size: 12px; }
  body .term-row h3, body .term-row p, body .summary-row, body .consent { font-size: 12px; }
  body .consent small, body .delivery-tag { font-size: 10px; }
  body .checkout-header .link-button, body .copy-action__label,
  body .credential-actions > .btn, body .credential-actions > .copy-action { font-size: 11px; }

  body .orders-head p, body .order-item-info p, body .order-item .link-button,
  body .orders-head .btn, body .orders-dialog .orders-token-help,
  body .orders-dialog .orders-local-note, body .orders-all-button { font-size: 12px; }
  body .order-item-info small, body .order-status,
  body .orders-recent-row span { font-size: 10px; }
}
/* Match the existing night and Token selectors so sizes stay consistent in both themes. */
@media (min-width: 641px) {
  body.dark-page .product-card .card-description { font-size: 11px; }
  body .token-product-page .variant-detail,
  body.dark-page .token-product-page .variant-detail,
  body .token-product-page .pay-label small,
  body.dark-page .token-product-page .pay-label small,
  body .token-product-page .input-help { font-size: 11px; }
}
@media (max-width: 640px) {
  body.dark-page .category-tabs button { font-size: 11px; }
  body.dark-page .product-card h3 { font-size: 13px; }
  body.dark-page .card-price small, body.dark-page .card-price em { font-size: 10px; }
}
@media (max-width: 360px) {
  body .product-card h3, body.dark-page .product-card h3 { font-size: 12px; }
}
@media (max-width: 640px) {
  body .credential-actions > .btn .squish-face { padding-inline: 8px; gap: 5px; white-space: nowrap; }
}
@media (max-width: 360px) {
  body .payment-option, body .token-product-page .payment-option { padding-left: 5px; padding-right: 5px; gap: 4px; }
  body .pay-label small, body .token-product-page .pay-label small { white-space: nowrap; }
  body .token-product-page .variant { padding-left: 6px; padding-right: 6px; column-gap: 4px; }
}

/* Payment marks retain their own brand artwork in light and dark themes. */
.payment-option .pay-mark.alipay,
.payment-option .pay-mark.wechat,
.dark-page .payment-option .pay-mark.alipay,
.dark-page .payment-option .pay-mark.wechat,
.token-product-page .payment-option .pay-mark.alipay,
.token-product-page .payment-option .pay-mark.wechat,
.dark-page .token-product-page .payment-option .pay-mark.alipay,
.dark-page .token-product-page .payment-option .pay-mark.wechat,
body:not(.dark-page) .payment-option .pay-mark.alipay,
body:not(.dark-page) .payment-option .pay-mark.wechat {
  background: transparent;
  border: 0;
  box-shadow: none;
  width: 26px;
  height: 26px;
}
.payment-option .pay-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
/* Both payment brands are self-contained SVG artwork. Do not place a second
   white tile behind Alipay; it creates the visible halo in dark mode. */
.payment-option .pay-mark.alipay,
.payment-option .pay-mark.wechat {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.payment-option .pay-mark.alipay img {
  background: transparent;
  border-radius: 0;
}

/* Make totals readable at each screen size without crowding the compact layout. */
.summary-row.total dt { font-size: 14px; font-weight: 560; letter-spacing: -.1px; }
.summary-row.total dd { font-size: 32px; font-weight: 650; letter-spacing: -1.3px; }
.summary-row.total dd small { font-size: 15px; }
.panel-total .total-label { font-size: 13px; font-weight: 560; }
.panel-total .total-label small { font-size: 10px; }
.panel-total .total-price { font-size: 34px; font-weight: 650; letter-spacing: -1.2px; }
.panel-total .total-price small { font-size: 15px; }
.token-product-page .total-price { font-size: 34px; }
@media (max-width: 640px) {
  .summary-row.total dt { font-size: 13px; }
  .summary-row.total dd { font-size: 29px; letter-spacing: -1.1px; }
  .summary-row.total dd small { font-size: 13px; }
  .panel-total .total-label { font-size: 13px; }
  .panel-total .total-label small { font-size: 10px; }
  .panel-total .total-price { font-size: 31px; }
  .panel-total .total-price small { font-size: 14px; }
  .token-product-page .total-price { font-size: 31px; }
}

/* Safari zooms focused controls below 16px and can retain that zoom on the
   payment route. Scope the fix to purchase fields, with enough specificity
   to beat the later desktop-spec-glass.css rule on phones and touch devices. */
@media (max-width: 640px), (hover: none) and (pointer: coarse) {
  body .buy-panel #purchase-form .text-input { font-size: 16px; }

  /* The quantity field has an inline font shorthand, so override its size only. */
  body .buy-panel #quantity-input { font-size: 16px !important; }
}

/* ./brand-colors.css */
/* Brand marks keep their own colors across the storefront and ordering flow. */
svg[data-brand="muse"] { color: #1767ff; }
svg[data-brand="openai"] { color: #10a37f; }
svg[data-brand="x"], svg[data-brand="apple"], svg[data-brand="grok"], svg[data-brand="tiktok"] { color: #17191d; }
.dark-page svg[data-brand="x"], .dark-page svg[data-brand="apple"], .dark-page svg[data-brand="grok"], .dark-page svg[data-brand="tiktok"] { color: #f4f6f9; }

/* X, Apple, Grok and TikTok use light marks on dark glass tiles in dark mode, and dark marks on light tiles in daylight mode. */
body:not(.dark-page) .family-nav__button:is([data-product="x"],[data-product="apple"],[data-product="grok"],[data-product="tiktok"]) .icon-stack__front {
  background: #e9edf3;
  border-color: #d1d9e4;
  border-top-color: #fff;
}
body:not(.dark-page) .family-nav__button:is([data-product="x"],[data-product="apple"],[data-product="grok"],[data-product="tiktok"]) svg[data-brand] { color: #17191d; }

/* Existing grayscale treatments should not wash out the brand artwork. */
.dark-page .product-card .card-brand .brand-icon,
.dark-page .order-item .card-brand .brand-icon { filter: none; }
.dark-page .product-stage .stage-art > .brand-icon { filter: drop-shadow(0 0 25px #c0d3ff0a); }

/* The community button keeps its familiar freestanding paper plane. */
.telegram-invite__plane svg[data-brand="telegram"] { transform: scale(1.5); }
.telegram-invite__plane svg[data-brand="telegram"] circle { display: none; }
.telegram-invite__plane svg[data-brand="telegram"] path { fill: currentColor; }
/* Brand hints keep monochrome marks readable on their dark background. */
.app-hint svg[data-brand="x"], .app-hint svg[data-brand="apple"] { color: #f4f6f9; }

.stage-art--x { --product-orbit-color: #61799b; }
.dark-page .stage-art--x { --product-orbit-color: #c5d8f3; }
/* Product-stage orbital companion: keep the ring legible in both themes and let a tiny star travel around it. */
.product-stage .stage-art .orbital-ring {
  border-width: 1.5px;
  border-color: color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 18%, transparent);
  box-shadow: 0 0 18px color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 8%, transparent);
  opacity: .9;
}
.product-stage .stage-art .orbital-ring::after {
  top: 50%;
  right: auto;
  left: 50%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 28%, #fff 0 18%, var(--product-orbit-color, var(--product-color)) 44%, color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 45%, transparent) 72%, transparent 100%);
  box-shadow: 0 0 5px color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 95%, transparent), 0 0 14px color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 58%, transparent);
  opacity: 1;
  transform: translate(-50%, -50%) rotate(0deg) translateX(168px);
  transform-origin: center;
  animation: nova-orbital-companion 6.8s linear infinite;
}
.dark-page .product-stage .stage-art .orbital-ring {
  border-color: color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 30%, transparent);
  box-shadow: 0 0 22px color-mix(in srgb, var(--product-orbit-color, var(--product-color)) 14%, transparent), inset 0 0 7px color-mix(in srgb, #dbeaff 12%, transparent);
}
@keyframes nova-orbital-companion {
  from { transform: translate(-50%, -50%) rotate(0deg) translateX(168px); }
  to { transform: translate(-50%, -50%) rotate(360deg) translateX(168px); }
}
@media (max-width: 640px) {
  .product-stage .stage-art .orbital-ring {
    border-width: 1.35px;
  }
  .product-stage .stage-art .orbital-ring::after {
    width: 7px;
    height: 7px;
    transform: translate(-50%, -50%) rotate(0deg) translateX(103px);
    animation-name: nova-orbital-companion-mobile;
  }
  @keyframes nova-orbital-companion-mobile {
    from { transform: translate(-50%, -50%) rotate(0deg) translateX(103px); }
    to { transform: translate(-50%, -50%) rotate(360deg) translateX(103px); }
  }
}
@media (prefers-reduced-motion: reduce) {
  .product-stage .stage-art .orbital-ring::after { animation: none; }
}

/* Telegram uses the standalone official blue paper-plane silhouette. */
svg[data-brand="telegram"] { color: #26a5e4; }
.telegram-invite__plane svg[data-brand="telegram"] { width: 100%; height: 100%; transform: none; }

/* ./card-glow.css */
/* Strong, brand-colored light stays outside the card, while the existing
   artwork, floating motion and readable content remain untouched. */
.product-card {
  --glow-a: var(--brand-color);
  --glow-b: var(--glow-a);
  --glow-c: var(--glow-a);
  --glow-d: var(--glow-a);
  touch-action: manipulation;
}
.product-card:is([data-product="muse"],[data-product="muse-token"]) { --glow-a:#1767ff; }
.product-card[data-product="telegram"] { --glow-a:#26a5e4; }
.product-card[data-product="chatgpt"] { --glow-a:#10a37f; }
.product-card[data-product="claude"] { --glow-a:#d97757; }
.product-card[data-product="instagram"] { --glow-a:#ec4899; --glow-b:#f59e0b; --glow-c:#8b5cf6; --glow-d:#ec4899; }
.product-card[data-product="facebook"] { --glow-a:#1877f2; }
.product-card[data-product="discord"] { --glow-a:#5865f2; }
.product-card[data-product="grok"] { --glow-a:#38bdf8; }
.product-card[data-product="reddit"] { --glow-a:#ff4500; }
.product-card[data-product="line"] { --glow-a:#06c755; }
.product-card[data-product="gemini"] { --glow-a:#4285f4; --glow-b:#9b72cb; --glow-c:#d96570; --glow-d:#9b72cb; }
.product-card[data-product="gmail"] { --glow-a:#4285f4; --glow-b:#ea4335; --glow-c:#fbbc04; --glow-d:#34a853; }
body.dark-page .product-card:is([data-product="x"],[data-product="apple"]) { --glow-a:#f4f6f9; }
body:not(.dark-page) .product-card:is([data-product="x"],[data-product="apple"]) { --glow-a:#30343b; }

body .product-grid .product-card:is(:hover,:focus-visible,:active,.is-touching) {
  z-index: 3;
  border-color: color-mix(in srgb,var(--glow-a) 58%,transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb,var(--glow-a) 40%,transparent),
    -8px -7px 26px -5px color-mix(in srgb,var(--glow-a) 60%,transparent),
     8px -7px 26px -5px color-mix(in srgb,var(--glow-b) 60%,transparent),
     8px  7px 26px -5px color-mix(in srgb,var(--glow-c) 60%,transparent),
    -8px  7px 26px -5px color-mix(in srgb,var(--glow-d) 60%,transparent),
    inset 0 0 34px -14px color-mix(in srgb,var(--glow-a) 26%,transparent);
}
/* A press should be visible immediately, including on touch-only screens. */
body .product-grid .product-card:is(:active,.is-touching) { transition-duration:0s; }


/* Keep the card geometry identical in light and dark themes. */
@media (min-width: 641px) {
  .dark-page .product-grid { gap: 15px; }
  .dark-page .product-card {
    min-height: 207px;
    padding: 22px 19px 18px;
    border-radius: 18px;
  }
  .dark-page .card-top {
    margin-bottom: 21px;
    align-items: center;
  }
  .dark-page .product-card .card-brand {
    width: 44px;
    height: 44px;
    border-radius: 13px;
  }
  .dark-page .product-card h3 { margin-bottom: 7px; }
  .dark-page .product-card .card-description { line-height: 1.6; }
  .dark-page .card-bottom {
    margin-top: auto;
    padding-top: 24px;
    border-top: 0;
  }
  .dark-page .card-price { font-size: 17px; }
  .dark-page .card-price small { font-size: 9px; }
}
@media (min-width: 1800px) {
  .dark-page .product-card {
    min-height: 220px;
    padding: 24px 22px;
  }
}
@media (min-width: 641px) and (max-width: 1120px) {
  .dark-page .product-card {
    min-height: 207px;
    padding: 20px 17px;
  }
}
/* Keep the scattered stars; animate a single point per card so the other
   small glows do not all trigger repeated repaints during the float. */
.product-grid .product-card .card-stars i { animation: none; }
.product-grid .product-card .card-stars i:first-child {
  animation: card-star-twinkle var(--star-period) var(--star-delay) ease-in-out infinite;
}
body:not(.dark-page) .product-grid .product-card .card-stars i:first-child {
  animation-name: card-star-twinkle-day;
}
@keyframes card-star-twinkle {
  0%, 78%, 86%, 100% { opacity: .16; }
  81% { opacity: .8; }
  83% { opacity: .38; }
}
@keyframes card-star-twinkle-day {
  0%, 78%, 86%, 100% { opacity: .18; }
  81% { opacity: .52; }
  83% { opacity: .28; }
}
.product-card.is-decoration-paused .card-stars i,
.product-card.is-decoration-paused .cosmic-buy__surface { animation-play-state: paused; }

/* Both cards light their entire contacting edge in their own brand colour.
   Only the brief opacity fade is animated; the gradient itself stays static. */
.product-card > .card-collision-glow {
  position: absolute;
  inset: 0;
  z-index: 0 !important;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: none;
}
.product-card > .card-collision-glow[data-collision-edge="left"] { --collision-direction: to right; }
.product-card > .card-collision-glow[data-collision-edge="right"] { --collision-direction: to left; }
.product-card > .card-collision-glow[data-collision-edge="top"] { --collision-direction: to bottom; }
.product-card > .card-collision-glow[data-collision-edge="bottom"] { --collision-direction: to top; }
.product-card > .card-collision-glow[data-collision-active="true"] {
  background: linear-gradient(
    var(--collision-direction),
    color-mix(in srgb, var(--glow-a) 90%, transparent) 0,
    color-mix(in srgb, var(--glow-a) 60%, transparent) 2px,
    color-mix(in srgb, var(--glow-a) 26%, transparent) 8px,
    transparent 26px
  );
}
@media (prefers-reduced-motion: reduce) {
  .product-card > .card-collision-glow { transition: none !important; opacity: 0 !important; }
}

/* ./footer-brand.css */
/* Centered brand, compact navigation and one shared metadata line. */
body .site-footer{width:100%;display:flex;flex-direction:column;align-items:center;gap:5px;margin:24px auto 0;padding:18px 0 15px;border-top:1px solid var(--border);text-align:center}
.footer-overview{display:flex;justify-content:center;width:100%;min-width:0}
.footer-brand-link{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:26px;color:var(--text);font-size:12px;font-weight:650;letter-spacing:1.3px;line-height:1.4;text-decoration:none}
.footer-brand-link:is(:hover,:focus-visible){color:var(--accent)}
.footer-brand-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:2px}
.footer-meta{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3px 14px;max-width:100%;min-width:0}
.footer-description{margin:0;color:var(--secondary);font-size:10px;line-height:1.7;text-align:center;overflow-wrap:anywhere}
.site-footer .footer-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 20px;width:100%;min-width:0}
.footer-links a{display:inline-flex;align-items:center;min-height:29px;padding:3px 0;color:var(--secondary);font-size:11px;line-height:1.5;text-decoration:none;text-underline-offset:4px}
.footer-links a:is(:hover,:focus-visible){color:var(--text);text-decoration:underline}
.footer-note{margin:0;color:var(--muted);font-size:10px;line-height:1.6;text-align:center;overflow-wrap:anywhere}
.static-home-intro{min-height:70vh;padding-top:80px}
.static-home-intro>p{margin-top:16px;line-height:1.8;color:var(--secondary)}
@media(max-width:640px){
 body .site-footer{gap:4px;margin-top:20px;padding:14px 0 12px}
 .footer-brand-link{min-height:22px;font-size:11px;letter-spacing:1.1px}
 .footer-description{display:none}
 .site-footer .footer-links{gap:0 15px}
 .site-footer:not([data-tenant-footer]) .footer-links .footer-link-secondary{display:none}
 .footer-links a{min-height:29px;font-size:10px}
 .footer-note{font-size:9px}
}

/* ./explore-uiverse.css */
/* A single click-only colour burst for the existing Explore CTA.
   The base .btn keeps its original size, arrow and layout. */
.home-hero .hero-actions .btn[data-action="explore"] {
  position: relative;
  isolation: isolate;
  overflow: visible;
  z-index: 0;
  transform-origin: center;
  text-shadow: none !important;
}

.home-hero .hero-actions .btn[data-action="explore"] > .explore-label,
.home-hero .hero-actions .btn[data-action="explore"] > .icon {
  position: relative;
  z-index: 2;
}

.home-hero .hero-actions .btn[data-action="explore"] > .explore-label {
  white-space: nowrap;
  transition: color .2s ease;
}

/* Remove the old glitch slice and its duplicated text layer. */
.home-hero .hero-actions .btn[data-action="explore"] > .explore-label::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

.home-hero .hero-actions .btn[data-action="explore"]::before,
.home-hero .hero-actions .btn[data-action="explore"]::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 150%;
  height: 100%;
  transform: translateX(-50%);
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  border: 0 !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  text-shadow: none !important;
  animation: none;
}

.home-hero .hero-actions .btn[data-action="explore"]::before {
  top: -66%;
  background-image:
    radial-gradient(circle, #ff5d8f 0 3px, transparent 3.5px),
    radial-gradient(circle, #ffb84d 0 3px, transparent 3.5px),
    radial-gradient(circle, #ffe36e 0 2.5px, transparent 3px),
    radial-gradient(circle, #48d7ff 0 3px, transparent 3.5px),
    radial-gradient(circle, #8e7dff 0 3px, transparent 3.5px),
    radial-gradient(circle, #61e6a5 0 2.5px, transparent 3px);
  background-size: 9px 9px, 10px 10px, 8px 8px, 10px 10px, 9px 9px, 8px 8px;
  background-position: 12% 112%, 31% 118%, 48% 110%, 66% 116%, 82% 108%, 94% 118%;
}

.home-hero .hero-actions .btn[data-action="explore"]::after {
  bottom: -66%;
  background-image:
    radial-gradient(circle, #ff6b6b 0 3px, transparent 3.5px),
    radial-gradient(circle, #ffcf5a 0 2.5px, transparent 3px),
    radial-gradient(circle, #7ee787 0 3px, transparent 3.5px),
    radial-gradient(circle, #52b9ff 0 3px, transparent 3.5px),
    radial-gradient(circle, #c08cff 0 2.5px, transparent 3px),
    radial-gradient(circle, #ff84c8 0 3px, transparent 3.5px);
  background-size: 9px 9px, 8px 8px, 10px 10px, 9px 9px, 8px 8px, 10px 10px;
  background-position: 8% -10%, 26% -6%, 43% -12%, 61% -8%, 79% -14%, 96% -7%;
}

/* The particles play once after the click class is applied. Hover and focus stay still. */
.home-hero .hero-actions .btn[data-action="explore"].explore-burst::before,
.home-hero .hero-actions .btn[data-action="explore"].explore-burst::after {
  opacity: 1;
  animation-duration: .68s;
  animation-timing-function: cubic-bezier(.2,.72,.24,1);
  animation-fill-mode: both;
}

.home-hero .hero-actions .btn[data-action="explore"].explore-burst::before {
  animation-name: nova-explore-colour-burst-top;
}

.home-hero .hero-actions .btn[data-action="explore"].explore-burst::after {
  animation-name: nova-explore-colour-burst-bottom;
}

.home-hero .hero-actions .btn[data-action="explore"]:active {
  transform: scale(.97);
}

@keyframes nova-explore-colour-burst-top {
  0% {
    opacity: 0;
    background-position: 12% 112%, 31% 118%, 48% 110%, 66% 116%, 82% 108%, 94% 118%;
    transform: translateX(-50%) translateY(5px) scale(.72);
  }
  18% { opacity: 1; }
  58% {
    opacity: .95;
    background-position: 1% 14%, 21% 1%, 43% 18%, 67% -2%, 87% 12%, 105% 4%;
    transform: translateX(-50%) translateY(-8px) scale(1);
  }
  100% {
    opacity: 0;
    background-position: -8% -26%, 18% -38%, 45% -18%, 72% -34%, 95% -20%, 112% -31%;
    background-size: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
    transform: translateX(-50%) translateY(-16px) scale(1.08);
  }
}

@keyframes nova-explore-colour-burst-bottom {
  0% {
    opacity: 0;
    background-position: 8% -10%, 26% -6%, 43% -12%, 61% -8%, 79% -14%, 96% -7%;
    transform: translateX(-50%) translateY(-5px) scale(.72);
  }
  18% { opacity: 1; }
  58% {
    opacity: .95;
    background-position: -1% 85%, 23% 98%, 45% 80%, 63% 102%, 84% 87%, 106% 96%;
    transform: translateX(-50%) translateY(8px) scale(1);
  }
  100% {
    opacity: 0;
    background-position: -11% 125%, 20% 138%, 47% 118%, 69% 143%, 94% 126%, 116% 136%;
    background-size: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
    transform: translateX(-50%) translateY(17px) scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero .hero-actions .btn[data-action="explore"]::before,
  .home-hero .hero-actions .btn[data-action="explore"]::after,
  .home-hero .hero-actions .btn[data-action="explore"] > .explore-label {
    animation: none !important;
    transition: none !important;
  }
}

/* ./card-tone-preview.css */
/* Graphite and silver tone pass for dark purchase panels. */
.dark-page .buy-panel{
  background:linear-gradient(145deg,#23272d 0%,#1b1f24 58%,#171a1f 100%);
  border-color:#3c424b;
  box-shadow:0 18px 48px #0005,inset 0 1px 0 #ffffff0b,inset 0 -1px 0 #0004;
}
.dark-page .buy-panel .variant,
.dark-page .buy-panel .payment-option{
  background:linear-gradient(145deg,#2a2e34 0%,#21252b 100%);
  border-color:#3b424b;
  box-shadow:inset 0 1px 0 #ffffff08,inset 0 -1px 0 #0004;
}
.dark-page .buy-panel .variant:hover,
.dark-page .buy-panel .payment-option:hover{
  background:linear-gradient(145deg,#31363d 0%,#262b31 100%);
  border-color:color-mix(in srgb,var(--brand-color,#8ca8ff) 46%,#7a838f);
}
/* Keep the selected surface silver-grey; the product brand remains on the edge. */
.dark-page .buy-panel .variant.selected,
.dark-page .buy-panel .payment-option.selected,
.dark-page .token-product-page .variant.selected,
.dark-page .token-product-page .payment-option.selected{
  background:linear-gradient(145deg,#3b4047 0%,#2c3036 100%);
  border-color:color-mix(in srgb,var(--brand-color,#8ca8ff) 74%,#d9e0e8);
  box-shadow:
    inset 0 1px 0 #ffffff20,
    inset 0 -1px 0 #0005,
    0 0 0 1px color-mix(in srgb,var(--brand-color,#8ca8ff) 20%,transparent);
}
.dark-page .buy-panel .text-input,
.dark-page .buy-panel .quantity-control{
  background:linear-gradient(145deg,#2a2e34 0%,#21252b 100%);
  border-color:#3b424b;
  box-shadow:inset 0 1px 0 #ffffff07,inset 0 -1px 0 #0004;
}
.dark-page .buy-panel .quantity-control button{
  background:#353a41;
  border-color:#4b535e;
  color:#cbd2dc;
}
.dark-page .buy-panel .quantity-control button:not(:disabled):hover{
  background:#454c56;
  box-shadow:0 2px 7px #0004;
}
.dark-page .buy-panel .panel-total{border-top-color:#ffffff1c}
.dark-page .buy-panel .field-heading,
.dark-page .buy-panel .form-field>label,
.dark-page .buy-panel .quantity-label{color:#d9dee6}
.dark-page .buy-panel .panel-subtitle,
.dark-page .buy-panel .field-heading>span,
.dark-page .buy-panel .quantity-label small,
.dark-page .buy-panel .input-help{color:#a1aab7}
.dark-page .buy-panel .variant-detail,
.dark-page .buy-panel .pay-label small{color:#acb5c1}
@media(max-width:640px){
  .dark-page .buy-panel{
    background:linear-gradient(145deg,#21252b 0%,#191c22 100%);
    border-color:#373e48;
  }
  .dark-page .buy-panel .variant,
  .dark-page .buy-panel .payment-option{
    background:linear-gradient(145deg,#282c33 0%,#20242a 100%);
  }
  .dark-page .buy-panel .variant.selected,
  .dark-page .buy-panel .payment-option.selected,
  .dark-page .token-product-page .variant.selected,
  .dark-page .token-product-page .payment-option.selected{
    background:linear-gradient(145deg,#373c43 0%,#2a2e34 100%);
  }
}

/* ./quantity-control-fix.css */
/* Keep +/- glyphs geometrically centered without changing the control size. */
.quantity-control button {
  position: relative;
  display: grid;
  place-items: center;
  padding: 0;
  line-height: 0;
}

.quantity-control button .icon {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  width: 14px;
  height: 14px;
  margin: auto;
  line-height: 0;
}

.quantity-control button .icon svg {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
}

/* ./consent-attention.css */
/* High-contrast, theme-aware feedback for an incomplete purchase agreement. */
.product-consent-row {
  position: relative;
  isolation: isolate;
}

.product-consent-row.needs-attention {
  color: var(--text);
  border-color: color-mix(in srgb, var(--accent) 78%, var(--border) 22%);
  background: color-mix(in srgb, var(--accent-soft) 78%, var(--surface) 22%);
  outline: none;
  box-shadow:
    0 0 22px color-mix(in srgb, var(--accent) 24%, transparent),
    0 10px 28px color-mix(in srgb, var(--accent) 18%, transparent);
  animation: nova-consent-shake .52s cubic-bezier(.36, .07, .19, .97) both;
}

.product-consent-row.needs-attention input {
  outline: 2px solid color-mix(in srgb, var(--accent) 35%, transparent);
  outline-offset: 2px;
  box-shadow: none;
  accent-color: var(--accent);
}

.product-consent-row.needs-attention label span {
  color: var(--text);
  font-weight: 700;
}

.product-consent-row.needs-attention > button {
  border-color: color-mix(in srgb, var(--accent) 72%, var(--border) 28%);
  background: color-mix(in srgb, var(--accent-soft) 92%, var(--surface) 8%);
  color: var(--accent);
}

.product-consent-row.needs-attention + #error-agreement {
  color: var(--accent);
  font-weight: 650;
}

#purchase-consent:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

@keyframes nova-consent-shake {
  0%, 100% { transform: translateX(0); }
  15% { transform: translateX(-4px); }
  30% { transform: translateX(3px); }
  45% { transform: translateX(-2px); }
  60% { transform: translateX(1px); }
  75% { transform: translateX(-1px); }
}

@media (prefers-reduced-motion: reduce) {
  .product-consent-row.needs-attention {
    animation: none;
  }
}

/* Keep the existing controls in place and draw attention to the missing step. */
#checkout-consent.needs-attention,
.cloud-check.needs-attention {
  animation: nova-consent-shake .52s cubic-bezier(.36,.07,.19,.97) both;
}
#checkout-consent.needs-attention input,
.cloud-check.needs-attention input {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
#checkout-consent.needs-attention > span,
.cloud-check.needs-attention > #verify-label { color: var(--text); font-weight: 700; }
#checkout-feedback:not(:empty) { display: block; margin-top: 6px; color: var(--accent); line-height: 1.5; font-weight: 650; }

.product-terms-dialog .terms-reading-status {
  margin: 12px 0 2px;
  color: var(--accent);
  font-size: 10px;
  line-height: 1.6;
}
.product-terms-dialog .terms-reading-action {
  width: 100%;
  min-height: 42px;
  margin-top: 18px;
}
.product-terms-dialog .terms-reading-action:disabled {
  cursor: wait;
  opacity: .58;
}
.cloud-check.needs-attention { border-color: var(--accent); }
@media (prefers-reduced-motion: reduce) {
  #checkout-consent.needs-attention, .cloud-check.needs-attention { animation: none; }
}

/* ./light-edge-polish.css */
/* Daylight edge polish: remove the hard white highlight from translucent cards. */
body:not(.dark-page) .product-marquee__tile .icon-stack__front {
  background: linear-gradient(145deg, #edf1f6, #e1e6ee);
  border-color: #c3cedc;
  border-top-color: #c3cedc !important;
  box-shadow: 0 2px 8px rgba(73, 94, 122, .12);
}

body:not(.dark-page) .product-family-nav .icon-stack__front {
  border-top-color: #c5d0de !important;
  box-shadow: 0 2px 7px rgba(73, 94, 122, .10);
}

body:not(.dark-page) .product-family-nav .family-nav__selected .icon-stack__front {
  box-shadow: 0 2px 9px rgba(73, 94, 122, .14);
}

body:not(.dark-page) .home-hero .hero-art .floating-brand {
  background: linear-gradient(145deg, rgba(239, 243, 248, .94), rgba(224, 231, 240, .82));
  border-color: rgba(185, 199, 216, .88);
  border-top-color: rgba(185, 199, 216, .88);
  box-shadow: 0 7px 20px rgba(82, 107, 139, .12);
}

/* ./consent-layout.css */
/* Purchase agreement as a single, readable confirmation control. */
.product-consent-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 10px;
  width: 100%;
  min-height: 46px;
  margin-top: 20px;
  padding: 9px 11px;
  border: 1px solid color-mix(in srgb, var(--border) 86%, var(--accent) 14%);
  border-radius: 13px;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--surface-soft) 88%, var(--surface) 12%),
    color-mix(in srgb, var(--surface) 94%, var(--surface-soft) 6%));
  color: var(--secondary);
  line-height: 1.4;
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.product-consent-row label {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 26px;
  gap: 8px;
  cursor: pointer;
}

.product-consent-row label span {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  font-weight: 560;
  line-height: 1.4;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.product-consent-row input {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin: 0;
  accent-color: var(--accent);
  cursor: pointer;
}

.product-consent-row > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  flex: 0 0 auto;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border) 62%);
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 78%, var(--surface) 22%);
  color: var(--accent);
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  text-underline-offset: 3px;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.product-consent-row > button:hover,
.product-consent-row > button:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 68%, var(--border) 32%);
  background: color-mix(in srgb, var(--accent-soft) 90%, var(--surface) 10%);
  color: var(--accent);
  transform: translateY(-1px);
}

.product-consent-row + #error-agreement {
  margin: 8px 2px 0;
  line-height: 1.55;
  white-space: normal;
}

body:not(.dark-page) .product-consent-row {
  border-color: #cbd8e6;
  background: linear-gradient(135deg, #f8fbff, #edf3f9);
}

body.dark-page .product-consent-row {
  border-color: #435366;
  background: linear-gradient(135deg, #26313d, #1b2530);
}

@media (max-width: 640px) {
  .product-consent-row {
    column-gap: 7px;
    min-height: 44px;
    margin-top: 18px;
    padding: 8px 10px;
  }

  .product-consent-row label {
    gap: 7px;
  }

  .product-consent-row label span {
    font-size: 10px;
  }

  .product-consent-row > button {
    min-height: 27px;
    padding: 0 8px;
    font-size: 9px;
  }
}

@media (max-width: 345px) {
  .product-consent-row {
    column-gap: 5px;
    padding-left: 8px;
    padding-right: 8px;
  }

  .product-consent-row label {
    gap: 6px;
  }

  .product-consent-row label span,
  .product-consent-row > button {
    font-size: 9px;
  }

  .product-consent-row > button {
    padding-left: 7px;
    padding-right: 7px;
  }
}

/* Warning state wins over the theme surface border so the whole control reads as one cue. */
body:not(.dark-page) .product-consent-row.needs-attention,
body.dark-page .product-consent-row.needs-attention {
  border-color: var(--accent);
}


/* ./theme-colors.css */
/* Shared theme palette: daylight uses silver-blue surfaces; night uses graphite and cool blue. */
body:not(.dark-page) {
  --bg: #f2f5f9;
  --surface: #fbfcfe;
  --surface-soft: #edf2f7;
  --text: #1f2937;
  --secondary: #4b5d72;
  --muted: #6f8094;
  --border: #d7e0ea;
  --accent: #557be7;
  --accent-soft: #eaf0ff;
  --shadow: 0 16px 44px -24px rgba(50, 73, 103, .28);
  color-scheme: light;
  background: var(--bg);
  color: var(--text);
}

body.dark-page {
  --bg: #070a0f;
  --surface: #161c25;
  --surface-soft: #1c2531;
  --text: #eef3f9;
  --secondary: #a6b2c4;
  --muted: #8492a5;
  --border: #344254;
  --accent: #91aaff;
  --accent-soft: #263753;
  --shadow: 0 18px 60px rgba(0, 0, 0, .48);
  color-scheme: dark;
  background: var(--bg);
  color: var(--text);
}

body:not(.dark-page) .header-nav {
  background: linear-gradient(145deg, #e9eef4, #dfe6ee);
  border-color: #d1dbe7;
  box-shadow: inset 0 1px 0 #ffffff, 0 4px 14px rgba(65, 87, 116, .08);
}

body.dark-page .header-nav {
  background: linear-gradient(145deg, #1b2430, #111821);
  border-color: #3a4758;
  box-shadow: inset 0 1px 0 rgba(225, 237, 255, .07), 0 8px 20px rgba(0, 0, 0, .24);
}

body:not(.dark-page) .header-nav button.active {
  background: #ffffff;
  color: #223248;
  box-shadow: 0 2px 8px rgba(65, 87, 116, .14);
}

body.dark-page .header-nav button.active {
  background: linear-gradient(145deg, #3a4657, #2b3543);
  color: #f3f7fd;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 3px 10px rgba(0, 0, 0, .28);
}

/* The original Explore dimensions, arrow and flex layout remain intact. */
body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"] {
  background: linear-gradient(145deg, #f7fafe, #dfe8f2);
  border: 1px solid #c3cedc;
  color: #243b56;
  box-shadow: inset 0 1px 0 #ffffff, 0 4px 12px rgba(73, 94, 122, .14);
}

body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"]:is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #ffffff, #e8f0f8);
  border-color: #9fb4ce;
  color: #1f4268;
  box-shadow: inset 0 1px 0 #ffffff, 0 7px 18px rgba(73, 94, 122, .18);
}

body.dark-page .home-hero .hero-actions .btn[data-action="explore"] {
  background: linear-gradient(145deg, #252d39, #171e29);
  border: 1px solid #44546b;
  color: #edf3fb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 7px 18px rgba(0, 0, 0, .26);
}

body.dark-page .home-hero .hero-actions .btn[data-action="explore"]:is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #303c4d, #1d2735);
  border-color: #6d8bb4;
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11), 0 9px 22px rgba(0, 0, 0, .34);
}

body:not(.dark-page) .hero-actions .telegram-invite {
  background: linear-gradient(145deg, #f5faff, #e1edf8);
  border-color: #b9cee2;
  color: #2c5476;
  box-shadow: inset 0 1px 0 #ffffff, 0 4px 12px rgba(73, 110, 145, .13);
}

body:not(.dark-page) .hero-actions .telegram-invite:is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #ffffff, #e7f3fc);
  border-color: #86b0d2;
  color: #1e4e79;
  box-shadow: inset 0 1px 0 #ffffff, 0 7px 18px rgba(73, 110, 145, .18);
}

body:not(.dark-page) .telegram-invite__plane { color: #168fca; }

body.dark-page .hero-actions .telegram-invite {
  background: linear-gradient(145deg, #26384c, #1a293a);
  border-color: #526f91;
  color: #e2efff;
  box-shadow: inset 0 1px 0 rgba(221, 239, 255, .08), 0 7px 18px rgba(0, 0, 0, .24);
}

body.dark-page .hero-actions .telegram-invite:is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #304a64, #203449);
  border-color: #82add7;
  color: #ffffff;
}

body.dark-page .telegram-invite__plane { color: #49b9ef; }

/* Primary actions share the same theme language as the hero controls. */
body:not(.dark-page) .btn-primary,
body:not(.dark-page) .btn-full {
  background: linear-gradient(145deg, #eef4fa, #d3e0ed);
  border: 1px solid #b9c9da;
  color: #21364f;
  box-shadow: inset 0 1px 0 #ffffff, 0 4px 13px rgba(61, 87, 119, .14);
}

body:not(.dark-page) .btn-primary:not(:disabled):is(:hover, :focus-visible),
body:not(.dark-page) .btn-full:not(:disabled):is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #ffffff, #e1ebf4);
  border-color: #8fa9c3;
  color: #183c62;
  box-shadow: inset 0 1px 0 #ffffff, 0 7px 18px rgba(61, 87, 119, .18);
}

body.dark-page .btn-primary,
body.dark-page .btn-full {
  background: linear-gradient(145deg, #e9eff8, #bdc9dc);
  border: 1px solid #d6e2f2;
  color: #17202d;
  box-shadow: inset 0 1px 0 #ffffff, 0 6px 18px rgba(0, 0, 0, .32);
}

body.dark-page .btn-primary:not(:disabled):is(:hover, :focus-visible),
body.dark-page .btn-full:not(:disabled):is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #ffffff, #d6e0ef);
  border-color: #ffffff;
  color: #111a27;
}

body:not(.dark-page) .cosmic-buy {
  background: linear-gradient(145deg, #f1f6fb, #d8e3ee);
  border-color: #b4c7db;
  color: #31506e;
  box-shadow: inset 0 1px 0 #ffffff, 0 3px 9px rgba(73, 94, 122, .14);
}

body:not(.dark-page) .cosmic-buy__label { color: #31506e; }
body:not(.dark-page) .product-card:is(:hover, :focus-visible, :active) .cosmic-buy {
  background: linear-gradient(145deg, #fbfdff, #e2edf6);
  border-color: #86a6c9;
}

body.dark-page .cosmic-buy {
  background: linear-gradient(145deg, #2a3b52, #1b2a3b);
  border-color: #607b9f;
  color: #deebfb;
  box-shadow: inset 0 1px 0 rgba(218, 236, 255, .10), 0 4px 11px rgba(0, 0, 0, .28);
}

body.dark-page .cosmic-buy__label { color: #deebfb; }
body.dark-page .product-card:is(:hover, :focus-visible, :active) .cosmic-buy {
  border-color: #90b4df;
  background: linear-gradient(145deg, #354b66, #22364c);
}

/* Silver-blue cards and purchase surfaces in daylight. */
body:not(.dark-page) .product-card {
  background: linear-gradient(155deg, #ffffff 0%, #f5f8fb 100%);
  border-color: #d8e1eb;
  border-top-color: #cbd6e2;
  box-shadow: inset 0 1px 0 #ffffff, 0 10px 25px -20px rgba(48, 74, 110, .30);
}

body:not(.dark-page) .product-card:hover,
body:not(.dark-page) .product-card:focus-visible {
  border-color: #b7c8dc;
  box-shadow: inset 0 1px 0 #ffffff, 0 13px 30px -15px rgba(38, 53, 86, .24);
}

body:not(.dark-page) .buy-panel {
  background: linear-gradient(145deg, #fbfcfe 0%, #eef3f8 100%);
  border-color: #d0dbe7;
  box-shadow: 0 18px 48px -24px rgba(50, 73, 103, .28), inset 0 1px 0 #ffffff;
}

body:not(.dark-page) .buy-panel .variant,
body:not(.dark-page) .buy-panel .payment-option {
  background: linear-gradient(145deg, #ffffff, #f2f6fa);
  border-color: #d1dce8;
}

body:not(.dark-page) .buy-panel .variant.selected,
body:not(.dark-page) .buy-panel .payment-option.selected {
  background: linear-gradient(145deg, #f0f5ff, #e2ebff);
  border-color: #8da8f3;
  box-shadow: 0 0 0 1px rgba(85, 123, 231, .10), inset 0 1px 0 #ffffff;
}

body:not(.dark-page) .buy-panel .text-input,
body:not(.dark-page) .buy-panel .quantity-control {
  background: linear-gradient(145deg, #f7faff, #e9eff5);
  border-color: #cbd7e4;
}

body:not(.dark-page) .buy-panel .quantity-control button {
  background: #f9fbfe;
  color: #526982;
}

body:not(.dark-page) .buy-panel .quantity-control button:not(:disabled):hover {
  background: #ffffff;
  box-shadow: 0 2px 7px rgba(54, 79, 110, .14);
}

body:not(.dark-page) .buy-panel .panel-total { border-top-color: #cfd9e5; }

/* Night purchase surfaces keep the graphite/silver treatment but gain a blue edge. */
body.dark-page .buy-panel {
  background: linear-gradient(145deg, #242c36 0%, #1a222c 58%, #151c25 100%);
  border-color: #3f4d5e;
}

body.dark-page .buy-panel .variant,
body.dark-page .buy-panel .payment-option {
  background: linear-gradient(145deg, #2c3541, #202a35);
  border-color: #435265;
}

body.dark-page .buy-panel .variant.selected,
body.dark-page .buy-panel .payment-option.selected {
  background: linear-gradient(145deg, #3c4a5a, #2d3947);
  border-color: color-mix(in srgb, var(--brand-color, #8ca8ff) 72%, #d9e0e8);
}

body.dark-page .buy-panel .text-input,
body.dark-page .buy-panel .quantity-control {
  background: linear-gradient(145deg, #2b3541, #202a35);
  border-color: #425266;
}

body.dark-page .buy-panel .quantity-control button {
  background: #394756;
  color: #d8e2ee;
}

body.dark-page .buy-panel .quantity-control button:not(:disabled):hover {
  background: #4a5c70;
}

body.dark-page .buy-panel .panel-total { border-top-color: #536579; }

/* Keep the category row on the same crisp UI face after the theme overrides. */
.category-tabs button,
.category-tabs button span,
.category-tabs button small {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

body .category-tabs button { font-weight: 600; letter-spacing: 0; }
body.dark-page .category-tabs button { font-weight: 600; }
body .category-tabs button small,
body.dark-page .category-tabs button small { font-weight: 700; }

/* Keep the warning legible against each surface. */
body:not(.dark-page) .field-error { color: #a34f57; }
body.dark-page .field-error { color: #ff9b9b; }

/* Category counts need to remain legible on both compact phone themes. */
.category-tabs button small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 19px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  opacity: 1;
}

body:not(.dark-page) .category-tabs button small {
  color: #254463;
  background: #c9d9eb;
  box-shadow: inset 0 0 0 1px #ffffff88;
}

body.dark-page .category-tabs button small {
  color: #ffffff;
  background: #435a78;
  box-shadow: inset 0 0 0 1px #dce9ff33;
}

.eyebrow i {
  font-style: normal;
  opacity: .58;
}

/* Daylight cards keep the same brand edge light as night mode, with a stronger
   contrast against the pale surface so touch and hover remain obvious. */
body:not(.dark-page) .product-grid .product-card:is(:hover, :focus-visible, :active, .is-touching) {
  z-index: 3;
  border-color: color-mix(in srgb, var(--glow-a) 72%, #7a8da5 28%);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--glow-a) 38%, transparent),
    -8px -7px 26px -5px color-mix(in srgb, var(--glow-a) 50%, transparent),
     8px -7px 26px -5px color-mix(in srgb, var(--glow-b) 50%, transparent),
     8px  7px 26px -5px color-mix(in srgb, var(--glow-c) 50%, transparent),
    -8px  7px 26px -5px color-mix(in srgb, var(--glow-d) 50%, transparent),
    inset 0 0 30px -14px color-mix(in srgb, var(--glow-a) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.82);
}

/* Final daylight CTA guard: keep legacy dark button rules from leaking into light mode. */
body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"] {
  background: linear-gradient(145deg, #f7fafe, #dfe8f2) !important;
  border-color: #c3cedc !important;
  color: #243b56 !important;
}

body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"] > .explore-label {
  color: #243b56 !important;
}

body:not(.dark-page) .hero-actions .telegram-invite {
  background: linear-gradient(145deg, #f5faff, #e1edf8) !important;
  border-color: #b9cee2 !important;
  color: #2c5476 !important;
}

body:not(.dark-page) .hero-actions .telegram-invite__plane {
  color: #168fca !important;
}

body:not(.dark-page) .cosmic-buy {
  background: linear-gradient(145deg, #f1f6fb, #d8e3ee) !important;
  border-color: #b4c7db !important;
  color: #31506e !important;
}

body:not(.dark-page) .cosmic-buy__label {
  color: #31506e !important;
}

body:not(.dark-page) .btn-primary,
body:not(.dark-page) .btn-full {
  background: linear-gradient(145deg, #eef4fa, #d3e0ed) !important;
  border-color: #b9c9da !important;
  color: #21364f !important;
}
/* Touch edge contrast: the active outline flips against each theme so the
   card boundary remains visible while a card is being pressed or touched. */
body.dark-page .product-grid .product-card:is(:active, .is-touching) {
  border-color: #ffffff !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.86),
    0 0 28px -6px rgba(255,255,255,.62),
    -8px -7px 26px -5px color-mix(in srgb, var(--glow-a) 42%, transparent),
     8px -7px 26px -5px color-mix(in srgb, var(--glow-b) 42%, transparent),
     8px  7px 26px -5px color-mix(in srgb, var(--glow-c) 42%, transparent),
    -8px  7px 26px -5px color-mix(in srgb, var(--glow-d) 42%, transparent),
    inset 0 0 24px -12px rgba(255,255,255,.28) !important;
}

body:not(.dark-page) .product-grid .product-card:is(:active, .is-touching) {
  border-color: #27364a !important;
  box-shadow:
    0 0 0 1px rgba(39,54,74,.74),
    0 0 24px -8px rgba(39,54,74,.44),
    -8px -7px 26px -5px color-mix(in srgb, var(--glow-a) 50%, transparent),
     8px -7px 26px -5px color-mix(in srgb, var(--glow-b) 50%, transparent),
     8px  7px 26px -5px color-mix(in srgb, var(--glow-c) 50%, transparent),
    -8px  7px 26px -5px color-mix(in srgb, var(--glow-d) 50%, transparent),
    inset 0 0 24px -12px rgba(39,54,74,.16) !important;
}

/* Readability pass: keep supporting copy visibly distinct in both themes. */
body:not(.dark-page) {
  --secondary: #38506a;
  --muted: #536a83;
}

body.dark-page {
  --secondary: #b9c6d8;
  --muted: #9aabc0;
}

body:not(.dark-page) .hero-copy > p,
body:not(.dark-page) .hero-note,
body:not(.dark-page) .eyebrow,
body:not(.dark-page) .section-heading p,
body:not(.dark-page) .collection-count,
body:not(.dark-page) .stage-caption p,
body:not(.dark-page) .product-card .card-description,
body:not(.dark-page) .product-card .card-tag,
body:not(.dark-page) .variant-detail,
body:not(.dark-page) .pay-label small,
body:not(.dark-page) .input-help,
body:not(.dark-page) .panel-bottom-note,
body:not(.dark-page) .card-price small,
body:not(.dark-page) .card-price em,
body:not(.dark-page) .orders-head p,
body:not(.dark-page) .order-item-info p,
body:not(.dark-page) .order-item-info small,
body:not(.dark-page) .empty-orders p,
body:not(.dark-page) .site-footer,
body:not(.dark-page) .footer-links a,
body:not(.dark-page) .service-item p {
  color: var(--muted);
  font-weight: 500;
}

body:not(.dark-page) .category-tabs button,
body:not(.dark-page) .search-box input::placeholder,
body:not(.dark-page) .form-field > label,
body:not(.dark-page) .field-heading,
body:not(.dark-page) .quantity-label,
body:not(.dark-page) .pay-label,
body:not(.dark-page) .variant-name {
  color: var(--secondary);
  font-weight: 500;
}

body:not(.dark-page) .product-card h3,
body:not(.dark-page) .card-price,
body:not(.dark-page) .section-heading h2,
body:not(.dark-page) .orders-head h1 {
  color: var(--text);
  font-weight: 650;
}

body.dark-page .hero-copy > p,
body.dark-page .hero-note,
body.dark-page .eyebrow,
body.dark-page .section-heading p,
body.dark-page .collection-count,
body.dark-page .stage-caption p,
body.dark-page .product-card .card-description,
body.dark-page .product-card .card-tag,
body.dark-page .variant-detail,
body.dark-page .pay-label small,
body.dark-page .input-help,
body.dark-page .panel-bottom-note,
body.dark-page .card-price small,
body.dark-page .card-price em,
body.dark-page .orders-head p,
body.dark-page .order-item-info p,
body.dark-page .order-item-info small,
body.dark-page .empty-orders p,
body.dark-page .site-footer,
body.dark-page .footer-links a,
body.dark-page .service-item p {
  color: var(--muted);
  font-weight: 500;
}

body.dark-page .category-tabs button,
body.dark-page .search-box input::placeholder,
body.dark-page .form-field > label,
body.dark-page .field-heading,
body.dark-page .quantity-label,
body.dark-page .pay-label,
body.dark-page .variant-name {
  color: var(--secondary);
  font-weight: 500;
}

body.dark-page .product-card h3,
body.dark-page .card-price,
body.dark-page .section-heading h2,
body.dark-page .orders-head h1 {
  color: var(--text);
  font-weight: 600;
}

/* Premium's earlier night rules use fixed gray values; align them with the brighter palette. */
body.dark-page .hero-copy > p { color: #a4b2c6; }
body.dark-page .hero-note { color: #9aabc0; }
body.dark-page .eyebrow { color: #a8b5c8; }
body.dark-page .section-heading p { color: #a0aec1; }
body.dark-page .art-caption { color: #a0aec1; }
body.dark-page .header-actions button { color: #b7c3d4; }
body.dark-page .search-box input::placeholder { color: #9aabc0; opacity: 1; }

/* Keep labels readable while cards float and while product panels are open. */
.category-tabs button,
.product-card .card-tag,
.product-card .card-description,
.collection-count,
.stage-caption p,
.variant-detail,
.pay-label small,
.input-help,
.panel-bottom-note,
.card-price small,
.card-price em,
.order-item-info p,
.order-item-info small,
.orders-head p,
.site-footer,
.footer-links a {
  text-rendering: optimizeLegibility;
}

/* Stronger, readable type on floating product cards in both themes. */
body:not(.dark-page) .product-grid .product-card :is(.card-description, .card-tag, .card-price small, .card-price em) {
  color: #34485f;
  font-weight: 600;
}
body.dark-page .product-grid .product-card :is(.card-description, .card-tag, .card-price small, .card-price em) {
  color: #d0dbea;
  font-weight: 600;
}
body .product-grid .product-card h3,
body .product-grid .product-card .card-price { font-weight: 700; }
body .product-grid .product-card .card-description { font-size: 11.5px !important; line-height: 1.55; }
body .product-grid .product-card .card-tag,
body .product-grid .product-card .card-price small,
body .product-grid .product-card .card-price em { font-size: 10px; }
@media (max-width: 360px) {
  body .product-grid .product-card .card-description { font-size: 11px !important; }
}

/* Daylight: give the purchase planet's two moving satellites and orbit contrast
   against the pale button without changing its hitbox or animation timing. */
body:not(.dark-page) .product-card .cosmic-buy__planet > g:first-child ellipse:first-child {
  stroke: #53779f; stroke-width: 1.7; opacity: .95;
}
body:not(.dark-page) .product-card .cosmic-buy__planet > g:first-child ellipse:nth-child(2) {
  stroke: #8eabc9; stroke-width: .9; opacity: .8;
}
body:not(.dark-page) .product-card .cosmic-buy__planet > g:last-child > path {
  stroke: #547ba6; stroke-width: 1.7; opacity: 1;
}
body:not(.dark-page) .product-card .cosmic-buy__orbit-light:first-of-type circle:nth-child(2) {
  fill: #2587e9; stroke: #eef8ff; stroke-width: .8;
}
body:not(.dark-page) .product-card .cosmic-buy__orbit-light:nth-of-type(2) circle:nth-child(2) {
  fill: #c77a22; stroke: #fff6e3; stroke-width: .8;
}
body:not(.dark-page) .product-card .cosmic-buy__orbit-light { filter: none; }
body:not(.dark-page) .product-card .cosmic-buy__orbit-static circle:first-child { fill: #2587e9; }
body:not(.dark-page) .product-card .cosmic-buy__orbit-static circle:last-child { fill: #c77a22; }

/* Explore CTA: one crisp text layer with a stable, balanced mobile hit area. */
.home-hero .hero-actions .btn[data-action="explore"] {
  min-width: 174px;
  min-height: 46px;
  height: 46px;
  padding: 0 18px;
  gap: 12px;
  justify-content: space-between;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.home-hero .hero-actions .btn[data-action="explore"] > .explore-label {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  color: inherit;
  font: inherit;
  line-height: 1;
  letter-spacing: inherit;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* The click burst belongs to the button; the old sliced text overlay does not. */
.home-hero .hero-actions .btn[data-action="explore"] > .explore-label::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

.home-hero .hero-actions .btn[data-action="explore"] > .icon {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
}

@media (max-width: 640px) {
  .home-hero .hero-actions .btn[data-action="explore"] {
    min-width: 168px;
    min-height: 45px;
    height: 45px;
    padding-inline: 17px;
    gap: 10px;
    border-radius: 10px;
    font-size: 13px;
  }

  .home-hero .hero-actions .btn[data-action="explore"] > .icon {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
  }
}

@media (max-width: 360px) {
  .home-hero .hero-actions .btn[data-action="explore"] {
    min-width: 158px;
    padding-inline: 15px;
    font-size: 12px;
  }
}

/* Hero hierarchy: the two actions share one deliberate frame and the slogan
   reads as two designed lines instead of a dense block of type. */
.home-hero .hero-actions .btn[data-action="explore"],
.home-hero .hero-actions .telegram-invite {
  width: 174px;
  min-width: 174px;
  height: 46px;
  min-height: 46px;
  padding: 0 18px;
  gap: 12px;
  justify-content: space-between;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
}

.home-hero .hero-actions .telegram-invite__plane {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

.home-hero .hero-copy h1 {
  line-height: 1.16;
  letter-spacing: -1.9px;
  font-weight: 620;
  text-wrap: balance;
}

.home-hero .eyebrow {
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 1.6px;
  gap: 8px;
}

body.dark-page .home-hero .hero-copy h1 {
  color: #f3f7fc;
  text-shadow: 0 3px 22px rgba(149, 190, 235, .12);
}

body.dark-page .home-hero .hero-copy h1 span {
  background: linear-gradient(110deg, #dce9f8 4%, #a5bdd6 52%, #718ba9 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

@media (max-width: 640px) {
  .home-hero .hero-actions .btn[data-action="explore"],
  .home-hero .hero-actions .telegram-invite {
    width: 168px;
    min-width: 168px;
    height: 45px;
    min-height: 45px;
    padding-inline: 17px;
    gap: 10px;
    border-radius: 10px;
    font-size: 13px;
  }

  .home-hero .hero-actions .telegram-invite__plane {
    width: 17px;
    height: 17px;
    flex-basis: 17px;
  }

  .home-hero .hero-copy h1 {
    font-size: 34px;
    font-weight: 620;
    line-height: 1.16;
    letter-spacing: -1.25px;
    margin: 13px 0 14px;
    white-space: normal;
  }

  .home-hero .hero-copy h1 br {
    display: block;
  }

  .home-hero .eyebrow {
    font-size: 15px;
    letter-spacing: 1.4px;
    gap: 7px;
  }

  .home-hero .eyebrow::before {
    width: 18px;
  }
}

@media (max-width: 360px) {
  .home-hero .hero-actions .btn[data-action="explore"],
  .home-hero .hero-actions .telegram-invite {
    width: 158px;
    min-width: 158px;
    padding-inline: 15px;
    font-size: 12px;
  }

  .home-hero .hero-copy h1 {
    font-size: 31px;
  }

  .home-hero .eyebrow {
    font-size: 14px;
  }
}

/* Match the original Telegram CTA footprint; the explore CTA follows it. */
.home-hero .hero-actions .btn[data-action="explore"],
.home-hero .hero-actions .telegram-invite {
  width: 145px;
  min-width: 145px;
  height: 44px;
  min-height: 44px;
  padding: 0 15px;
  gap: 6px;
  justify-content: center;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 640px) {
  .home-hero .hero-actions .btn[data-action="explore"],
  .home-hero .hero-actions .telegram-invite {
    width: 112px;
    min-width: 112px;
    height: 34px;
    min-height: 34px;
    padding-inline: 10px;
    gap: 5px;
    border-radius: 8px;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Inter, sans-serif;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.15px;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
  }

  .home-hero .hero-actions .telegram-invite__plane {
    width: 15px;
    height: 15px;
    flex-basis: 15px;
  }
}

@media (max-width: 360px) {
  .home-hero .hero-actions .btn[data-action="explore"],
  .home-hero .hero-actions .telegram-invite {
    width: 108px;
    min-width: 108px;
    font-size: 10px;
  }
}

/* Keep the enlarged mobile eyebrow from pushing the celestial artwork down. */
@media (max-width: 640px) {
  .home-hero,
  .dark-page .home-hero {
    padding-top: 4px;
  }

  .home-hero .hero-copy h1 {
    margin: 8px 0 10px;
  }

  .home-hero .hero-actions {
    margin-top: 9px;
  }
}

/* The supplied transparent lockup is the desktop hero typography. */
.home-hero .hero-typography-lockup {
  display: block;
  width: min(100%, 480px);
  height: auto;
  margin: 0;
  object-fit: contain;
  object-position: left center;
  user-select: none;
  -webkit-user-drag: none;
}

.home-hero .hero-copy__mobile {
  display: none;
}

@media (min-width: 641px) {
  .home-hero .hero-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .home-hero .hero-typography-lockup {
    margin-inline: auto;
  }

  .home-hero .hero-actions {
    justify-content: center;
  }
}

@media (min-width: 641px) {
  .dark-page .home-hero .hero-actions {
    margin-top: 20px;
  }
}

@media (max-width: 640px) {
  .home-hero .hero-copy {
    transform: translateX(clamp(6px, 2.2vw, 12px));
  }

  .home-hero .hero-typography-lockup {
    display: block;
    width: min(100%, 200px);
    height: auto;
    margin: 0 auto;
  }

  .home-hero .hero-copy__mobile {
    display: none;
  }

  .home-hero .hero-copy__mobile .eyebrow {
    justify-content: center;
    font-size: clamp(13px, 3.7vw, 15px);
    letter-spacing: clamp(1px, .36vw, 1.4px);
    line-height: 1.25;
    white-space: nowrap;
  }

  .home-hero .hero-copy__mobile h1 {
    font-size: clamp(28px, 8.1vw, 34px);
    font-weight: 560;
    line-height: 1.16;
    letter-spacing: clamp(-1px, -.22vw, -.7px);
    margin: 10px 0 12px;
    white-space: nowrap;
    text-wrap: balance;
  }

  .home-hero .hero-copy__mobile .hero-lede {
    display: none;
  }

  .home-hero .hero-actions {
    width: max-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    gap: 8px;
    justify-content: center;
  }
}
/* Keep the two hero actions as one visual system. Explore uses the same
   surface, border, text and hover palette as the Telegram invitation in both
   themes; only the icon and label differ. */
body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"],
body:not(.dark-page) .hero-actions .telegram-invite {
  background: linear-gradient(145deg, #f5faff, #e1edf8) !important;
  border: 1px solid #b9cee2 !important;
  border-color: #b9cee2 !important;
  color: #2c5476 !important;
  box-shadow: inset 0 1px 0 #ffffff, 0 4px 12px rgba(73, 110, 145, .13) !important;
}

body:not(.dark-page) .home-hero .hero-actions .btn[data-action="explore"]:is(:hover, :focus-visible),
body:not(.dark-page) .hero-actions .telegram-invite:is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #ffffff, #e7f3fc) !important;
  border-color: #86b0d2 !important;
  color: #1e4e79 !important;
  box-shadow: inset 0 1px 0 #ffffff, 0 7px 18px rgba(73, 110, 145, .18) !important;
}

body.dark-page .home-hero .hero-actions .btn[data-action="explore"],
body.dark-page .hero-actions .telegram-invite {
  background: linear-gradient(145deg, #26384c, #1a293a) !important;
  border: 1px solid #526f91 !important;
  border-color: #526f91 !important;
  color: #e2efff !important;
  box-shadow: inset 0 1px 0 rgba(221, 239, 255, .08), 0 7px 18px rgba(0, 0, 0, .24) !important;
}

body.dark-page .home-hero .hero-actions .btn[data-action="explore"]:is(:hover, :focus-visible),
body.dark-page .hero-actions .telegram-invite:is(:hover, :focus-visible) {
  background: linear-gradient(145deg, #304a64, #203449) !important;
  border-color: #82add7 !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(221, 239, 255, .11), 0 9px 22px rgba(0, 0, 0, .30) !important;
}

/* ./muse-typography.css */

/* Muse-inspired typography: system sans, normal weights, generous readable spacing. */
.buy-panel .muse-redeem-entry{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin:6px 0 12px;padding:10px 12px;border:1px solid #7c9dcf70;border-radius:11px;background:#5285c014;color:#2e5689;font-size:13px;font-weight:600;line-height:1.5;white-space:normal;text-align:center;text-decoration:none;box-shadow:none}
body.dark-page .buy-panel .muse-redeem-entry{color:#bcd8fa;border-color:#89b5ee65;background:#5285c01c;box-shadow:none}
.buy-panel .muse-redeem-entry:focus-visible{outline:2px solid #83abeb;outline-offset:3px}
:root {
  font-family: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-optical-sizing: auto;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}
body { font-family: inherit; font-weight: 400; letter-spacing: normal; }

/* Keep the floating cards clear without adding a transformed text layer. */
body .product-grid .product-card h3,
body .product-grid .product-card .card-price { font-weight: 650; }
body .product-grid .product-card .card-description { line-height: 1.65; }

/* Product page hierarchy follows Muse's larger, calmer type scale. */
.buy-panel h1 { font-size: 31px; font-weight: 600; letter-spacing: -.8px; }
.panel-subtitle { font-size: 14px; line-height: 1.65; }
.field-heading { font-size: 13px; font-weight: 550; }
.field-heading > span { font-size: 11px; }
.variant-name { font-size: 13px; font-weight: 550; line-height: 1.45; }
.variant-detail { font-size: 12px; line-height: 1.55; }
.variant-price { font-size: 19px; font-weight: 550; }
.form-field > label, .quantity-label { font-size: 12px; font-weight: 550; }
.input-help, .panel-bottom-note { font-size: 11px; line-height: 1.65; }
.pay-label { font-size: 13px; }
.pay-label small { font-size: 10px; line-height: 1.5; }
.product-consent-row { font-size: 12px; }

.stage-caption h2 { font-size: 24px; font-weight: 550; }
.stage-caption p { font-size: 13px; line-height: 1.65; }

.checkout-header h1 { font-size: 30px; font-weight: 550; letter-spacing: -.5px; }
.checkout-header p, .notice-alert p, .term-row p, .summary-detail { font-size: 13px; line-height: 1.7; }
.term-row h3 { font-size: 14px; font-weight: 550; }
.summary-row { font-size: 12px; }
.consent { font-size: 12px; }
.consent small { font-size: 10px; }

@media (max-width: 640px) {
  .buy-panel h1 { font-size: 30px; }
  .panel-subtitle { font-size: 14px; }
  .field-heading { font-size: 14px; }
  .variant-name { font-size: 14px; }
  .variant-detail { font-size: 12px; }
  .variant-price { font-size: 20px; }
  .form-field > label, .quantity-label { font-size: 13px; }
  .input-help, .panel-bottom-note { font-size: 12px; }
  .pay-label { font-size: 13px; }
  .pay-label small { font-size: 11px; }
  .stage-caption h2 { font-size: 22px; }
  .stage-caption p { font-size: 12px; }
  .checkout-header h1 { font-size: 27px; }
  .checkout-header p, .notice-alert p, .term-row p, .summary-detail { font-size: 12px; }
  .term-row h3 { font-size: 13px; }
  .summary-row, .consent { font-size: 12px; }
}
/* Match the site wordmark to the same calm type family. */
.space-brand__title { font-family: system-ui, -apple-system, "Segoe UI", sans-serif; font-weight: 600; letter-spacing: .12em; padding-left: .12em; }
.space-brand__subtitle { font-family: system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif; font-weight: 550; }
/* These existing theme selectors have higher specificity than the base styles. */
body .buy-panel h1 { font-size: 31px; font-weight: 600; }
body .buy-panel .panel-subtitle, body .token-product-page .panel-subtitle { font-size: 14px; line-height: 1.65; }
body .buy-panel .variant-name, body .token-product-page .variant-name { font-size: 13px; font-weight: 550; }
body .buy-panel .variant-detail, body.dark-page .token-product-page .variant-detail { font-size: 12px; line-height: 1.55; }
body .buy-panel .pay-label { font-size: 13px; }
body .buy-panel .pay-label small, body.dark-page .token-product-page .pay-label small { font-size: 11px; line-height: 1.5; }
@media(max-width:640px) {
 body .buy-panel h1 { font-size: 30px; }
 body .buy-panel .variant-name, body .token-product-page .variant-name { font-size: 14px; }
}
/* Premium steel-blue slogan treatment, matched to the planet artwork. */
body:not(.dark-page) .hero-copy h1 span {
  background: linear-gradient(105deg, #294965 0%, #557391 52%, #7892ad 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
body.dark-page .hero-copy h1 span {
  background: linear-gradient(105deg, #edf3fa 0%, #c4d2e1 48%, #8fa6bf 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ./catalog-scale.css */

/* Catalog scale: keep the glass-card storefront readable as the catalog grows. */
.collection-toolbar {
  position: sticky;
  top: 10px;
  z-index: 12;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, var(--accent) 22%);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  box-shadow: 0 10px 26px color-mix(in srgb, var(--text) 7%, transparent);
  backdrop-filter: blur(16px) saturate(1.08);
}
.category-tabs {
  flex-wrap: nowrap;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  padding: 1px;
}
.category-tabs::-webkit-scrollbar { display: none; }
.category-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
}
.category-tabs button small {
  min-width: 16px;
  padding: 1px 4px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--surface-soft) 80%, var(--accent) 20%);
  color: var(--muted);
  font-size: 8px;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.category-tabs button.active small {
  background: color-mix(in srgb, var(--accent-soft) 70%, var(--accent) 30%);
  color: var(--accent);
}
.product-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.product-grid .product-card {
  content-visibility: auto;
  contain-intrinsic-size: 220px;
}
@media (min-width: 1600px) {
  .product-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (min-width: 861px) {
  .buy-panel .variants {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }
  .buy-panel .variant { min-width: 0; min-height: 70px; }
  .buy-panel .variant-detail { overflow-wrap: anywhere; }
}
@media (max-width: 860px) {
  .collection-toolbar { top: 6px; }
}
@media (max-width: 640px) {
  .collection-toolbar {
    margin-inline: -4px;
    padding: 7px 6px;
    border-radius: 12px;
  }
  .collection-toolbar .collection-count { display: none; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
}
/* Keep category pills floating; the outer glass rectangle adds visual weight. */
.collection-toolbar {
  position: relative;
  top: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
.category-tabs { padding: 0; }
.category-tabs button {
  border: 1px solid transparent;
  background: transparent;
}
.category-tabs button.active {
  border-color: var(--border);
  background: color-mix(in srgb, var(--surface) 84%, var(--accent) 16%);
  box-shadow: 0 3px 10px color-mix(in srgb, var(--text) 7%, transparent);
}
.collection-toolbar .collection-count { margin-left: auto; }
@media (max-width: 640px) {
  .collection-toolbar { margin-inline: 0; padding: 0; }
}

@media(max-width:640px){
  /* Phone catalog cards use the same square frame as desktop cards while keeping the two-column mobile grid. */
  /* Widen only the collection area; the hero/header keep their original alignment. */
  .home-page .collection { margin-inline: -8px; }
  .home-page .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .home-page .product-grid .product-card { aspect-ratio: 1 / 1; min-height: 0; padding: 14px 13px 11px; }
  .home-page .product-grid .product-card .card-top { margin-bottom: 10px; }
  .home-page .product-grid .product-card .card-brand { width: 42px; height: 42px; border-radius: 12px; }
  .home-page .product-grid .product-card .card-brand .brand-icon { width: 27px; height: 27px; }
  .home-page .product-grid .product-card h3 { font-size: 14px; margin-bottom: 6px; }
  .home-page .product-grid .product-card .card-description { font-size: 12px !important; line-height: 1.45; }
  .home-page .product-grid .product-card .card-tag { font-size: 9px; }
  .home-page .product-grid .product-card .card-bottom { padding-top: 6px; }
  .home-page .product-grid .product-card .card-price { font-size: 19px; }
}
@media(max-width:360px){
  /* Keep the same spacious two-column rhythm on compact phones without clipping names. */
  .home-page .product-grid .product-card { padding: 11px 10px 9px; }
  .home-page .product-grid .product-card .card-top { margin-bottom: 8px; }
  .home-page .product-grid .product-card .card-brand { width: 36px; height: 36px; border-radius: 11px; }
  .home-page .product-grid .product-card .card-brand .brand-icon { width: 23px; height: 23px; }
  .home-page .product-grid .product-card h3 { font-size: 12px; }
  .home-page .product-grid .product-card .card-description { font-size: 10.5px !important; }
  .home-page .product-grid .product-card .card-price { font-size: 17px; }
  .home-page .product-grid .product-card .cosmic-buy { width: 55px; }
}

/* ./desktop-spec-glass.css */

/* Desktop variant cards: the supplied glass-card idea is used for selectable specs. */
@media (min-width: 641px) {
  .buy-panel .variants { gap: 11px; }
  .buy-panel .variant {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    flex: 0 0 auto;
    min-height: 78px;
    height: auto;
    padding: 16px 16px;
    overflow: visible;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.022));
    box-shadow: 0 12px 20px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.12);
    backdrop-filter: blur(10px);
    transform: none;
    transition: .28s ease;
  }
  .buy-panel .variant::before {
    content: none;
    display: none;
  }
  .buy-panel .variant:hover,
  .buy-panel .variant:focus-visible {
    z-index: 4;
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--product-color) 68%, white 32%);
    box-shadow: 0 18px 24px rgba(0,0,0,.24), 0 0 18px color-mix(in srgb, var(--product-color) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.20);
    outline: none;
  }
  .buy-panel .variant.selected {
    border-color: color-mix(in srgb, var(--product-color) 72%, white 28%);
    background: linear-gradient(145deg, color-mix(in srgb, var(--product-color) 22%, #202b39), rgba(255,255,255,.06));
    box-shadow: 0 16px 24px rgba(0,0,0,.22), 0 0 18px color-mix(in srgb, var(--product-color) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.18);
  }
  .buy-panel .variant .radio-dot { grid-column: 1; }
  .buy-panel .variant .variant-label { grid-column: 2; }
  .buy-panel .variant .variant-price { grid-column: 3; align-self: center; }
  .buy-panel .variant .variant-name { padding-right: 5px; }
  body:not(.dark-page) .buy-panel .variant {
    border-color: rgba(74,101,132,.22);
    background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(221,231,241,.58));
    box-shadow: 0 16px 22px rgba(55,77,106,.12), inset 0 1px 0 rgba(255,255,255,.98);
  }
  body:not(.dark-page) .buy-panel .variant.selected {
    background: linear-gradient(145deg, color-mix(in srgb, var(--product-color) 12%, white), rgba(220,232,244,.80));
  }
  body:not(.dark-page) .buy-panel .variant::before { color: #55718d; }
}
@media (prefers-reduced-motion: reduce) {
  .buy-panel .variant { transform: none; transition: none; }
}

/* The supplied glass-card interaction is used for the product specs beneath
   the left-side product art. It stays desktop-only; mobile keeps its compact
   product presentation. */
@media (max-width: 860px) {
  .spec-glass-deck { display: none !important; }
}

@media (min-width: 861px) {
  .product-stage { overflow: visible; }
  .spec-glass-deck {
    position: absolute;
    z-index: 6;
    left: 50%;
    top: calc(100% + 54px);
    translate: -50% 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 920px);
    height: 252px;
    padding: 10px 18px;
    isolation: isolate;
    perspective: 900px;
    pointer-events: none;
  }
  .spec-glass-deck__header {
    position: absolute;
    top: -62px;
    left: 50%;
    translate: -50% 0;
    z-index: 25;
    display: grid;
    grid-template-columns: 40px auto 40px;
    align-items: center;
    gap: 7px 12px;
    padding: 0;
    color: var(--text);
    text-align: center;
    white-space: nowrap;
    pointer-events: none;
  }
  .spec-glass-deck__header::before,
  .spec-glass-deck__header::after {
    content: "";
    height: 1px;
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--product-color) 65%, transparent));
  }
  .spec-glass-deck__header::before { grid-column: 1; grid-row: 1; }
  .spec-glass-deck__header::after { grid-column: 3; grid-row: 1; rotate: 180deg; }
  .spec-glass-deck__badge {
    grid-column: 2;
    grid-row: 1;
    padding: 4px 13px;
    border: 1px solid #6987ad;
    border-radius: 999px;
    background: #182b43;
    color: #f1f6ff;
    font-size: 16px;
    font-weight: 750;
    line-height: 22px;
    letter-spacing: .04em;
  }
  .spec-glass-deck__hint {
    grid-column: 1 / -1;
    color: #bfd1e9;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: .02em;
  }
  .spec-glass-card {
    position: relative;
    flex: 0 0 174px;
    width: 174px;
    height: 220px;
    margin: 0 -22px;
    padding: 22px 12px 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 12px;
    background: linear-gradient(155deg, #2b3948 0%, #202b38 58%, #18212c 100%);
    box-shadow: 0 20px 28px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.18);
    color: var(--text);
    transform: rotate(calc((var(--spec-card-index) - (var(--spec-card-count) - 1) / 2) * 3deg)) translateY(0);
    transform-origin: 50% 92%;
    transition: margin .55s cubic-bezier(.2,.75,.25,1), transform .55s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease, border-color .35s ease;
    z-index: calc(1 + var(--spec-card-index));
    cursor: pointer;
    pointer-events: auto;
  }
  .spec-glass-card::before {
    content: none;
    display: none;
  }
  .spec-glass-card::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 44px;
    background: #18212c;
    pointer-events: none;
  }
  .spec-glass-card__icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin-top: 4px;
    border: 1px solid color-mix(in srgb, var(--product-color) 38%, transparent);
    border-radius: 14px;
    background: color-mix(in srgb, var(--product-color) 14%, #111821);
    color: var(--product-color);
    box-shadow: 0 0 16px color-mix(in srgb, var(--product-color) 14%, transparent);
  }
  .spec-glass-card__icon .brand-icon { width: 34px; height: 34px; }
  .spec-glass-card__name {
    flex: 0 0 22px;
    width: 100%;
    height: 22px;
    margin-top: 2px;
    color: var(--text);
    font-size: 14.5px;
    font-weight: 700;
    line-height: 22px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .spec-glass-card__detail {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    max-width: 100%;
    padding: 0 11px;
    border-radius: 999px;
    background: #102034;
    border: 1px solid #89a9d7;
    box-shadow: none;
    color: #f1f6ff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
  }
  .spec-glass-card__price {
    position: absolute;
    right: 0;
    bottom: 9px;
    left: 0;
    z-index: 1;
    color: var(--text);
    font-size: 21px;
    font-weight: 700;
    text-align: center;
  }
  .spec-glass-card__price small { margin-right: 2px; color: #c4d3e3; font-size: 12px; font-weight: 550; }
  .spec-glass-card__price em { margin-left: 3px; color: #b4c4d6; font-size: 11px; font-style: normal; font-weight: 550; }
  .spec-glass-deck:has(.spec-glass-card:is(:hover,:focus-visible)) .spec-glass-card,
  .spec-glass-card:focus-visible {
    margin-inline: 5px;
    transform: rotate(0deg) translateY(-10px) scale(1.025);
    border-color: color-mix(in srgb, var(--product-color) 52%, white 48%);
  }
  .spec-glass-card:hover,
  .spec-glass-card:focus-visible,
  .spec-glass-card.selected {
    border-color: color-mix(in srgb, var(--product-color) 70%, white 30%);
    box-shadow: 0 22px 28px rgba(0,0,0,.3), 0 0 20px color-mix(in srgb, var(--product-color) 28%, transparent), inset 0 1px 0 rgba(255,255,255,.24);
    outline: none;
  }
  .spec-glass-card.selected { z-index: calc(1 + var(--spec-card-index)); }
  .spec-glass-card:hover,
  .spec-glass-card:focus-visible { z-index: 20; }
  .spec-glass-deck .spec-glass-card:is(:hover,:focus-visible,:active,.selected) {
    box-shadow:
      0 0 0 1px color-mix(in srgb,var(--spec-glow-a, var(--product-color)) 52%,transparent),
      -8px -7px 26px -5px color-mix(in srgb,var(--spec-glow-a, var(--product-color)) 60%,transparent),
       8px -7px 26px -5px color-mix(in srgb,var(--spec-glow-b, var(--product-color)) 60%,transparent),
       8px  7px 26px -5px color-mix(in srgb,var(--spec-glow-c, var(--product-color)) 60%,transparent),
      -8px  7px 26px -5px color-mix(in srgb,var(--spec-glow-d, var(--product-color)) 60%,transparent),
      inset 0 0 34px -14px color-mix(in srgb,var(--spec-glow-a, var(--product-color)) 26%,transparent);
  }
  .product-stage:has(.stage-art--x) .spec-glass-card { --spec-glow-a:#f4f6f9; --spec-glow-b:#f4f6f9; --spec-glow-c:#f4f6f9; --spec-glow-d:#f4f6f9; }
  .spec-glass-deck:has(.spec-glass-card:is(:hover,:focus-visible)) .spec-glass-card.selected,
  .spec-glass-card.selected:focus-visible { transform: rotate(0deg) translateY(-10px) scale(1.025); }
  body:not(.dark-page) .spec-glass-card {
    border-color: rgba(92,119,151,.25);
    background: linear-gradient(155deg, #fbfdff 0%, #e8eef5 58%, #d7e1ec 100%);
    box-shadow: 0 18px 22px rgba(55,77,106,.16), inset 0 1px 0 rgba(255,255,255,.95);
  }
  body:not(.dark-page) .spec-glass-card::after { background: #d5e0eb; }
  body:not(.dark-page) .spec-glass-card__name,
  body:not(.dark-page) .spec-glass-card__price { color: #294661; }
  body:not(.dark-page) .spec-glass-card__detail { color: #58718a; }
  body:not(.dark-page) .spec-glass-card__icon {
    border-color: #c5d0df;
    background: linear-gradient(145deg, #eef2f7, #dfe7f0);
    color: #17191d;
    box-shadow: inset 0 1px 0 #fff, 0 2px 8px rgba(55, 77, 106, .14);
  }
  body:not(.dark-page) .spec-glass-card__icon .brand-icon,
  body:not(.dark-page) .spec-glass-card__icon svg[data-brand="x"],
  body:not(.dark-page) .spec-glass-card__icon svg[data-brand="apple"] {
    color: #17191d;
  }
  body:not(.dark-page) .product-stage:has(.stage-art--x) .spec-glass-card {
    --spec-glow-a: #30343b;
    --spec-glow-b: #30343b;
    --spec-glow-c: #30343b;
    --spec-glow-d: #30343b;
  }
}

@media (prefers-reduced-motion: reduce) {
  .spec-glass-card { transform: none; transition: none; }
  .spec-glass-deck:has(.spec-glass-card:is(:hover,:focus-visible)) .spec-glass-card,
  .spec-glass-card:focus-visible,
  .spec-glass-deck:has(.spec-glass-card:is(:hover,:focus-visible)) .spec-glass-card.selected,
  .spec-glass-card.selected:focus-visible { transform: none; }
}
/* Final category label type pass: keep the compact row crisp and easy to scan. */
body .category-tabs button,
body.dark-page .category-tabs button {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-weight: 600;
  letter-spacing: 0;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

body .category-tabs button small,
body.dark-page .category-tabs button small {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-weight: 700;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

/* Synced product details layout: keeps both short 3-line descriptions and
   multi-section 50-line instructions clean, readable, and well-proportioned. */
.checkout-columns {
  align-items: start;
}
.purchase-terms {
  min-width: 0;
}
.terms-scroll-area {
  max-height: 540px;
  overflow-y: auto;
  padding-right: 8px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .32) transparent;
}
.terms-dialog-scroll {
  max-height: min(52vh, 440px);
  overflow-y: auto;
  margin: 10px 0 18px;
  padding-right: 6px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .32) transparent;
}
.buy-panel .variants {
  max-height: 530px;
  overflow-y: auto;
  padding: 6px 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .28) transparent;
}
.term-row {
  align-items: flex-start;
  padding: 16px 0;
  border-bottom: 1px solid rgba(148, 163, 184, .12) !important;
}
.term-row:last-child {
  border-bottom: 0 !important;
}
.term-content {
  min-width: 0;
  flex: 1 1 auto;
}
.term-body {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 8px;
  color: var(--secondary);
  font-size: 12.5px;
  line-height: 1.75;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.term-line {
  position: relative;
}
.term-format-box {
  margin: 4px 0;
  padding: 9px 12px;
  border-radius: 9px;
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .55);
  color: #e2e8f0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11.5px;
  line-height: 1.6;
  overflow-wrap: anywhere;
  word-break: break-all;
}
body:not(.dark-page) .term-format-box {
  background: #f1f5f9;
  border-color: #cbd5e1;
  color: #1e293b;
}
.term-link {
  color: #60a5fa;
  text-decoration: underline;
  text-underline-offset: 3px;
  word-break: break-all;
}
.term-link:hover {
  color: #93c5fd;
}
.order-summary {
  height: fit-content;
}
.order-summary .summary-variant {
  font-size: 18px;
  line-height: 1.45;
  font-weight: 650;
  overflow-wrap: anywhere;
}
@media (min-width: 861px) {
  .checkout-columns > .order-summary {
    position: sticky;
    top: 24px;
  }
}

/* Enlarge tiny labels, counts, and option text across the product page and
   checkout view so every specification and badge is effortless to read. */
body .buy-panel .panel-tag {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--secondary);
}
body .buy-panel h1 {
  font-size: 32px;
  font-weight: 700;
}
body .buy-panel .panel-subtitle {
  font-size: 14px;
  font-weight: 500;
  color: var(--secondary);
}
body .buy-panel .field-heading {
  font-size: 15.5px;
  font-weight: 650;
  color: var(--text);
  margin: 24px 0 12px;
}
body .buy-panel .field-heading > span {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(148, 163, 184, .14);
  border: 1px solid rgba(148, 163, 184, .22);
  font-size: 13px;
  font-weight: 600;
  color: #cdd9e8;
}
body:not(.dark-page) .buy-panel .field-heading > span {
  background: #e8eff7;
  border-color: #cbd8e6;
  color: #364f6b;
}
body .buy-panel .variant-name {
  font-size: 15px !important;
  font-weight: 650 !important;
  color: var(--text) !important;
  line-height: 1.45;
}
body .buy-panel .variant-detail {
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.5;
  margin-top: 5px;
  color: #b8c7d9 !important;
}
body:not(.dark-page) .buy-panel .variant-detail {
  color: #516880 !important;
}
body .buy-panel .recommend {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 5px;
}
body .buy-panel .variant-price {
  font-size: 21px;
  font-weight: 700;
}
body .buy-panel .variant-price small {
  font-size: 12px;
  font-weight: 550;
}
body .buy-panel .quantity-label {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: var(--text) !important;
}
body .buy-panel .quantity-label small {
  font-size: 12px;
  margin-top: 4px;
  color: var(--secondary);
}
body .buy-panel .quantity-control output {
  font-size: 14px;
  font-weight: 650;
}
body .buy-panel .form-field > label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--text) !important;
  margin-bottom: 8px;
}
body .buy-panel .text-input {
  height: 44px;
  font-size: 14px;
}
body .buy-panel .input-help {
  font-size: 12px !important;
  color: var(--secondary) !important;
}
body .buy-panel .pay-label {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: var(--text) !important;
}
body .buy-panel .pay-label small {
  font-size: 11.5px !important;
  color: var(--secondary) !important;
}
body .buy-panel .product-consent-row {
  font-size: 13.5px;
}
body .buy-panel .product-consent-row button {
  font-size: 13px;
  font-weight: 600;
}
body .buy-panel .panel-total .total-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}
body .buy-panel .panel-total .total-label small {
  font-size: 12px;
  color: var(--secondary);
}
body .buy-panel .btn-full {
  min-height: 48px;
  font-size: 15px;
  font-weight: 650;
}
body .buy-panel .panel-bottom-note {
  font-size: 12px !important;
  color: var(--secondary) !important;
}
body .stage-caption h2 {
  font-size: 26px;
  font-weight: 650;
}
body .stage-caption p {
  font-size: 14px !important;
  color: var(--secondary) !important;
}
body .checkout-header p {
  font-size: 13.5px;
}
body .notice-alert strong,
body .notice-alert p {
  font-size: 13.5px;
}
body .term-row h3 {
  font-size: 15px;
  font-weight: 650;
}
body .term-body {
  font-size: 13.5px;
  line-height: 1.8;
}
body .term-format-box {
  font-size: 12.5px;
}
body .order-summary .summary-detail,
body .order-summary .summary-row {
  font-size: 13px;
}
body .checkout-bottom .consent {
  font-size: 13.5px;
}
body .checkout-bottom .consent small {
  font-size: 12px;
}

/* Widen the purchase panel and lock variant card flex-shrink so 8+ variants
   stay just as boxy, roomy, and readable as 2-variant products (Muse AI). */
@media (min-width: 861px) {
  body .product-layout {
    grid-template-columns: minmax(0, 1fr) 468px;
    gap: 54px;
  }
}
@media (min-width: 1440px) {
  body .product-layout {
    grid-template-columns: minmax(0, 1fr) 492px;
    gap: 72px;
  }
}
body .buy-panel .variants {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 460px;
  overflow-y: auto;
  overflow-x: hidden !important;
  padding: 4px 2px;
}
body .buy-panel .variant {
  flex: 0 0 auto !important;
  min-height: 74px !important;
  height: auto !important;
  padding: 15px 16px !important;
  border-radius: 14px !important;
}
body:not(.dark-page) .spec-glass-card__detail {
  background: #e1eaf8;
  border-color: #a2b8d8;
  color: #183a60;
  box-shadow: none;
}
body:not(.dark-page) .spec-glass-deck__badge{background:#e6eefb;border-color:#96afd0;color:#17395f}
body:not(.dark-page) .spec-glass-deck__hint{color:#3c5678}

/* Make the spec-group selector modal (and mobile directory modal) spacious,
   full-width, and 100% readable without truncating category names. */
body .spec-group-directory-dialog {
  max-width: 480px;
}
body .spec-group-directory-grid {
  grid-template-columns: 1fr !important;
  gap: 11px !important;
  max-height: min(64vh, 520px);
}
body .spec-group-directory-item {
  min-height: 78px !important;
  grid-template-columns: 46px minmax(0, 1fr) auto !important;
  gap: 13px !important;
  padding: 14px 16px !important;
  border-radius: 15px !important;
}
body .spec-group-directory-item.selected {
  border-color: color-mix(in srgb, var(--accent) 75%, white 25%) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 45%, transparent), 0 10px 22px rgba(0, 0, 0, .28) !important;
}
body .spec-group-directory-item .category-directory-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 13px !important;
}
body .spec-group-directory-item .category-directory-icon .brand-icon {
  width: 27px !important;
  height: 27px !important;
}
body .spec-group-directory-item .category-directory-copy strong {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
body .spec-group-directory-item .category-directory-copy small {
  display: inline-flex !important;
  align-items: center;
  margin-top: 6px !important;
  padding: 2px 9px;
  border-radius: 999px;
  background: rgba(148, 163, 184, .16);
  border: 1px solid rgba(148, 163, 184, .26);
  color: #dbe7f5 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
body:not(.dark-page) .spec-group-directory-item .category-directory-copy small {
  background: #e6eef7;
  border-color: #c5d4e5;
  color: #2c4765 !important;
}
body .spec-group-directory-item .category-directory-price {
  grid-column: 3 !important;
  margin-top: 0 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--text) !important;
}
@media (max-width: 640px) {
  body .buy-panel {
    padding: 20px 15px;
    border-radius: 20px;
  }
  body .buy-panel .variant {
    min-height: 70px !important;
    padding: 14px 14px !important;
  }
  body .category-directory-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  body .category-directory-item {
    min-height: 72px !important;
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    gap: 12px !important;
    padding: 12px 14px !important;
  }
  body .category-directory-icon {
    width: 44px !important;
    height: 44px !important;
  }
  body .category-directory-copy strong {
    font-size: 15px !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  body .category-directory-copy small {
    font-size: 12px !important;
  }
  body .category-directory-price {
    grid-column: 3 !important;
    margin-top: 0 !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
  }
}

/* ./typography-consistency.css */


/* Four heading glyphs from Ma Shan Zheng, SIL OFL 1.1 (license in assets/fonts). */
@font-face {
  font-family: "NOVA Heading";
  src: url('./assets/fonts/nova-heading.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  unicode-range: U+4E3A,U+4F60,U+7CBE,U+9009;
}

/* One readable UI face for both themes. Noto Sans SC is installed locally,
   so Chinese glyphs do not change shape when the theme toggles. */
body,
button,
input,
select,
textarea {
  font-family: "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Keep hierarchy the same in daylight and night themes. */
body:not(.dark-page) .section-heading h2,
body.dark-page .section-heading h2 {
  font-weight: 650;
  letter-spacing: -.6px;
}

body:not(.dark-page) .category-tabs button,
body.dark-page .category-tabs button {
  font-family: "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
}

body:not(.dark-page) .category-tabs button small,
body.dark-page .category-tabs button small {
  font-family: "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
}

body .search-box input {
  font-size: 11px;
  font-weight: 500;
}

body .hero-actions .btn,
body .header-nav button,
body .header-actions button,
body .site-footer,
body .footer-links button,
body .footer-links a {
  font-weight: 600;
}

body .product-card h3 {
  font-weight: 650;
  letter-spacing: -.3px;
}

body .product-card .card-description {
  font-weight: 500;
  line-height: 1.55;
}

/* Theme colors may change, but the storefront geometry must not move. */
body:not(.dark-page) .site-header,
body.dark-page .site-header {
  height: 116px;
}

body:not(.dark-page) .home-hero,
body.dark-page .home-hero {
  min-height: 390px;
  padding-top: 27px;
  padding-bottom: 33px;
}

body:not(.dark-page) .collection,
body.dark-page .collection {
  padding-top: 25px;
}

body:not(.dark-page) .section-heading p,
body.dark-page .section-heading p {
  font-size: 11px;
  margin-top: 7px;
}

/* The compact phone row gets the same four-column rhythm in either theme.
   Smaller badge padding leaves room for the full Chinese category names. */
@media (max-width: 640px) {
  body:not(.dark-page) .site-header,
  body.dark-page .site-header {
    height: clamp(74px, 19vw, 82px);
  }

  body:not(.dark-page) .home-hero,
  body.dark-page .home-hero {
    min-height: 0;
    padding-top: 4px;
    padding-bottom: 12px;
  }

  body:not(.dark-page) .hero-art,
  body.dark-page .hero-art {
    height: 250px;
    margin-top: 0;
  }

  body:not(.dark-page) .collection,
  body.dark-page .collection {
    padding-top: 24px;
  }

  body .category-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
  }

  /* Match the theme selectors above and in premium.css so compact spacing
     wins in both themes instead of retaining the desktop/night padding. */
  body:not(.dark-page) .category-tabs button,
  body.dark-page .category-tabs button {
    min-width: 0;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 8px 2px;
    font-size: 10px;
    white-space: nowrap;
  }

  body .category-tabs button span {
    flex: 0 0 auto;
    min-width: 0;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
  }

  body .category-tabs button small {
    min-width: 18px;
    height: 18px;
    padding-inline: 3px;
    font-size: 10px;
  }
}

@media (min-width: 400px) and (max-width: 640px) {
  body .category-tabs {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  body:not(.dark-page) .category-tabs button,
  body.dark-page .category-tabs button {
    padding-inline: 1px;
    font-size: 9.5px;
  }
}

@media (max-width: 360px) {
  body:not(.dark-page) .category-tabs button,
  body.dark-page .category-tabs button {
    font-size: 9.5px;
  }
}

/* The collection heading is the storefront's ink seal: use a Chinese
   calligraphic fallback stack while keeping the count badge in a crisp UI
   face.  The badge has a fixed footprint so it never gets clipped by the
   search field on a narrow phone. */
.section-heading h2 {
  font-family: "NOVA Heading", "STKaiti", "KaiTi", "Kaiti SC", "Noto Serif SC", "Songti SC", serif;
  font-weight: 650;
  letter-spacing: .02em;
  line-height: 1.2;
  white-space: nowrap;
}

.section-heading h2 span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 26px;
  height: 23px;
  padding: 0 7px;
  font-family: "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}

body:not(.dark-page) .section-heading h2,
body.dark-page .section-heading h2 {
  font-size: 24px;
}

body:not(.dark-page) .section-heading h2 span {
  color: #254463;
  background: #d5e2ef;
  border-color: #bdcedf;
  box-shadow: inset 0 1px 0 #ffffffaa;
}

body.dark-page .section-heading h2 span {
  color: #f5f8ff;
  background: #334963;
  border-color: #607895;
  box-shadow: inset 0 1px 0 #dbe8fa2e;
}

.section-heading,
.section-heading > div:first-child,
.collection-toolbar {
  min-width: 0;
}

.section-heading > div:first-child {
  flex: 1 1 auto;
}

/* Keep the heading and logo away from the viewport edge when artwork has a
   transparent glow extending beyond its bitmap bounds. */
@media (min-width: 641px) {
  .site-header .wordmark { margin-left: 8px; }
  .section-heading { padding-inline: 8px; }
}

/* Theme colors may differ, but the desktop layout rhythm does not. */
@media (min-width: 641px) {
  body:not(.dark-page) .home-hero,
  body.dark-page .home-hero {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }

  body:not(.dark-page) .hero-art,
  body.dark-page .hero-art { height: 348px; }

  body:not(.dark-page) .hero-copy h1,
  body.dark-page .hero-copy h1 {
    font-size: 52px;
    line-height: 1.38;
    letter-spacing: -2.7px;
    margin: 17px 0;
  }

  body:not(.dark-page) .hero-copy > p,
  body.dark-page .hero-copy > p {
    font-size: 13px;
    line-height: 1.9;
  }

  body:not(.dark-page) .hero-actions,
  body.dark-page .hero-actions { margin-top: 28px; }

  /* premium.css gives the night theme a shorter action gap; the artwork and
     copy use the same vertical rhythm in both themes. */
  body.dark-page .home-hero .hero-actions { margin-top: 28px; }

  body:not(.dark-page) .hero-note,
  body.dark-page .hero-note {
    gap: 19px;
    margin-top: 26px;
  }

  body:not(.dark-page) .category-tabs button,
  body.dark-page .category-tabs button {
    font-size: 11px;
    padding: 8px 15px;
    border-radius: 8px;
  }

  body:not(.dark-page) .collection-count,
  body.dark-page .collection-count { font-size: 10px; }

  body:not(.dark-page) .product-grid,
  body.dark-page .product-grid { gap: 15px; }

  body:not(.dark-page) .product-card,
  body.dark-page .product-card {
    min-height: 207px;
    padding: 22px 19px 18px;
    border-radius: 18px;
  }

  body:not(.dark-page) .card-top,
  body.dark-page .card-top {
    margin-bottom: 21px;
    align-items: center;
  }

  body:not(.dark-page) .product-card .card-brand,
  body.dark-page .product-card .card-brand {
    width: 44px;
    height: 44px;
    border-radius: 13px;
  }

  body:not(.dark-page) .product-card .card-description,
  body.dark-page .product-card .card-description {
    font-size: 10px;
    line-height: 1.6;
  }

  body:not(.dark-page) .product-card .card-tag,
  body.dark-page .product-card .card-tag {
    margin-top: 0;
    padding: 3px 6px;
    font-size: 10px;
  }

  body:not(.dark-page) .product-card h3,
  body.dark-page .product-card h3 {
    font-size: 14px;
    font-weight: 620;
    letter-spacing: -.4px;
    margin-bottom: 7px;
  }

  body:not(.dark-page) .card-bottom,
  body.dark-page .card-bottom {
    margin-top: auto;
    padding-top: 24px;
    border-top: 0;
  }

  body:not(.dark-page) .card-price,
  body.dark-page .card-price { font-size: 17px; }
}

/* Desktop labels stay legible while the card keeps its continuous drift. */
@media (min-width: 641px) {
  body .product-grid .cosmic-buy__label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
  }
  body .product-grid[data-card-physics="active"] .product-card:is(:hover, :focus-visible, :active) {
    transform: none !important;
  }
}

@media (min-width: 1800px) {
  body:not(.dark-page) .home-hero,
  body.dark-page .home-hero { min-height: 430px; }

  body:not(.dark-page) .hero-copy h1,
  body.dark-page .hero-copy h1 { font-size: 59px; }

  body:not(.dark-page) .hero-art,
  body.dark-page .hero-art { height: 390px; }

  body:not(.dark-page) .product-card,
  body.dark-page .product-card {
    min-height: 220px;
    padding: 24px 22px;
  }
}

@media (min-width: 641px) and (max-width: 1120px) {
  body:not(.dark-page) .hero-copy h1,
  body.dark-page .hero-copy h1 { font-size: 45px; }

  body:not(.dark-page) .product-card,
  body.dark-page .product-card {
    min-height: 207px;
    padding: 20px 17px;
  }
}

@media (min-width: 641px) and (max-width: 860px) {
  body:not(.dark-page) .home-hero,
  body.dark-page .home-hero { min-height: 340px; }

  body:not(.dark-page) .hero-copy h1,
  body.dark-page .hero-copy h1 { font-size: 39px; }

  body:not(.dark-page) .hero-art,
  body.dark-page .hero-art { height: 300px; }
}

@media (max-width: 640px) {
  .section-heading {
    align-items: center;
    gap: 10px;
    padding-inline: 4px;
  }

  body:not(.dark-page) .section-heading h2,
  body.dark-page .section-heading h2 {
    font-size: clamp(22px, 6.2vw, 25px);
    letter-spacing: .01em;
  }

  .section-heading h2 span {
    min-width: 27px;
    height: 22px;
    padding-inline: 7px;
    font-size: 12px;
  }

  .section-heading .search-box {
    flex: 0 1 135px;
    min-width: 0;
    width: 135px;
  }
}

/* The category capsule should stay evenly lit. Remove the separate top
   reflection that reads as an unintended glowing strip above the label. */
@media (min-width: 641px) {
  .header-nav__glass::after {
    display: none;
  }

  .category-tabs__glass::after {
    display: none;
  }
}

@media (max-width: 360px) {
  .section-heading { gap: 7px; padding-inline: 2px; }
  body:not(.dark-page) .section-heading h2,
  body.dark-page .section-heading h2 { font-size: 21px; }
  .section-heading h2 span { min-width: 25px; height: 21px; font-size: 11px; }
  .section-heading .search-box { flex-basis: 118px; width: 118px; }
}

/* The two hero actions are a matched pair. Keep their labels on the same
   crisp UI face so Explore does not look heavier than Telegram. */
.home-hero .hero-actions .btn[data-action="explore"],
.home-hero .hero-actions .telegram-invite {
  font-family: "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Segoe UI Variable Text", "Segoe UI", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1;
  font-synthesis: none;
}

@media (max-width: 640px) {
  .home-hero .hero-actions .btn[data-action="explore"],
  .home-hero .hero-actions .telegram-invite {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: -.15px;
  }
}

@media (max-width: 360px) {
  .home-hero .hero-actions .btn[data-action="explore"],
  .home-hero .hero-actions .telegram-invite { font-size: 10px; }
}

/* Let the moving glass capsule provide the hover state. An inactive tab must
   not paint its own rectangular background over that capsule. */
.category-tabs button:hover,
.category-tabs button:focus-visible {
  background: transparent;
}

/* The moving capsule is the only hover surface.  The night theme's premium
   selector is more specific, so keep its button paint transparent as well. */
body.dark-page .category-tabs button:hover,
body.dark-page .category-tabs button:focus-visible {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* A count is a badge, not an auto-sized text box.  A fixed footprint keeps
   12 and single-digit counts optically identical while the number changes. */
.category-tabs button small {
  width: 24px;
  min-width: 24px;
  height: 18px;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 24px;
}

@media (max-width: 640px) {
  body .category-tabs button small {
    width: 20px;
    min-width: 20px;
    height: 18px;
    padding: 0;
    flex: 0 0 20px;
  }
}

@media (min-width: 641px) {
  .category-tabs__glass {
    top: 1px;
    height: calc(100% - 2px);
    border-radius: 999px;
  }

  body .collection-count {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    margin-right: 12px;
    gap: 8px;
  }

  .collection-count .status-dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    box-shadow: 0 0 0 3px #6c9c8340;
  }
}

/* Keep the collection search field on the same right edge as the header
   actions. The theme changes colors only; these insets stay fixed. */
@media (min-width: 641px) {
  .section-heading {
    padding-left: 8px;
    padding-right: 0;
  }
}

@media (max-width: 640px) {
  .section-heading {
    padding-left: 4px;
    padding-right: 8px;
  }

  /* The catalog stays the same size in both themes; only its colors change. */
  body:not(.dark-page) .collection-count,
  body.dark-page .collection-count {
    font-size: 10px;
  }

  body:not(.dark-page) .home-page .product-grid .product-card h3,
  body.dark-page .home-page .product-grid .product-card h3 {
    letter-spacing: -.3px;
  }

  body:not(.dark-page) .home-page .product-grid .product-card .card-description,
  body.dark-page .home-page .product-grid .product-card .card-description {
    min-height: 33px;
  }
}

/* Phones do not render the desktop moving glass layer. Give the selected
   category its own immediate pill so taps never leave the row unmarked while
   the desktop glass code is initializing. */
@media (max-width: 640px) {
  .category-tabs button.active,
  .category-tabs button.active:hover,
  .category-tabs button.active:focus-visible {
    border-radius: 999px;
  }

  body:not(.dark-page) .category-tabs button.active,
  body:not(.dark-page) .category-tabs button.active:hover,
  body:not(.dark-page) .category-tabs button.active:focus-visible {
    background: #f8fbff !important;
    border-color: #b7c8db !important;
    box-shadow: 0 3px 10px rgba(64, 89, 120, .16) !important;
    color: #243b56 !important;
  }

  body.dark-page .category-tabs button.active,
  body.dark-page .category-tabs button.active:hover,
  body.dark-page .category-tabs button.active:focus-visible {
    background: #202a39 !important;
    border-color: #526785 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .42) !important;
    color: #eef4ff !important;
  }
}

/* ./visual-readiness.css */
/* Keep page controls usable and reserve image geometry during decode. */
.visual-image-pending,
.visual-image-failed { visibility: hidden !important; }
.visual-picture { display: contents; }

/* ./payment-card.css */
.payment-card{--pay-text:#26374e;--pay-muted:#667991;--pay-line:#91a9c740;--pay-surface:#f8fbff;--pay-soft:#edf3fb;--pay-accent:#456ba5;--pay-star:#6a89b6;--pay-panel:linear-gradient(145deg,#ffffffb8,#e5edfa70);--pay-complete:#277d7f;--pay-button:linear-gradient(135deg,#334a6a,#1c2b45);--pay-button-text:#f2f7ff;position:relative;isolation:isolate;box-sizing:border-box;width:100%;max-width:760px;margin:0 auto;padding:26px;border:1px solid var(--pay-line);border-radius:24px;background:radial-gradient(ellipse at 100% 0,#668ad51b,transparent 52%),radial-gradient(ellipse at 0 75%,#9b77cc0a,transparent 45%),var(--pay-surface);color:var(--pay-text);box-shadow:inset 0 1px 0 #fff8,0 16px 55px #15336a0b;font-size:13px;line-height:1.65;text-align:left;overflow-wrap:anywhere}
.dark-page .payment-card{--pay-text:#e6efff;--pay-muted:#a3b2ca;--pay-line:#95b9f52d;--pay-surface:#0b111b;--pay-soft:#101a2a;--pay-accent:#b2cbf5;--pay-star:#c5dcff;--pay-panel:linear-gradient(145deg,#b6d1ff0b,#7c9bdf03);--pay-complete:#a0d8d1;--pay-button:linear-gradient(125deg,#e0edff,#b7c7eb);--pay-button-text:#1b2c48;box-shadow:inset 0 1px 0 #c7deff16,0 16px 55px #0003;color-scheme:dark}
.payment-card:before{content:"";position:absolute;inset:0 0 auto;height:165px;z-index:-1;border-radius:inherit;pointer-events:none;opacity:.42;background:radial-gradient(circle at 11% 18%,var(--pay-star) 0 .7px,transparent 1.3px),radial-gradient(circle at 35% 6%,var(--pay-star) 0 .6px,transparent 1.2px),radial-gradient(circle at 67% 11%,var(--pay-star) 0 1px,transparent 1.8px),radial-gradient(circle at 92% 27%,var(--pay-star) 0 .7px,transparent 1.5px),radial-gradient(circle at 5% 58%,var(--pay-star) 0 .5px,transparent 1.2px),radial-gradient(circle at 83% 72%,var(--pay-star) 0 .6px,transparent 1.4px)}
.payment-card:after{content:"";position:absolute;top:-1px;left:14%;right:14%;height:1px;background:linear-gradient(90deg,transparent,#b9d3f787,transparent);pointer-events:none}
.payment-card *{box-sizing:border-box}
.payment-card .payment-card__icon,.payment-card .icon{display:block;width:17px;height:17px;flex:none}
.payment-card .payment-card__header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.payment-card .payment-card__back{display:inline-flex;align-items:center;justify-content:center;min-height:36px;margin:0;padding:5px 11px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--pay-muted);font-size:12px}
.payment-card .payment-card__back:hover{background:var(--pay-soft);color:var(--pay-text)}
.payment-card__progress ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0 0 24px;padding:16px 8px 24px;border:0;border-bottom:1px solid var(--pay-line);border-radius:0;background:transparent;list-style:none}
.payment-card__progress li{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;color:var(--pay-muted);font-size:12px}
.payment-card__progress li:not(:last-child):after{position:absolute;content:"";height:1px;left:calc(50% + 25px);right:calc(-50% + 25px);top:16px;background:var(--pay-line)}
.payment-card__progress li[data-state=complete]:after{background:linear-gradient(90deg,var(--pay-complete),var(--pay-accent));opacity:.65}
.payment-card__progress b{position:relative;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--pay-line);border-radius:50%;background:var(--pay-panel);font-size:14px;font-weight:600}
.payment-card__progress [data-state=complete] b{border-color:var(--pay-complete);background:var(--pay-panel);color:var(--pay-complete)}
.payment-card__progress :is([data-state=complete],[data-state=current]) b:before{content:"";position:absolute;inset:-5px;border:1px solid var(--pay-line);border-radius:50%;pointer-events:none}
.payment-card__progress [data-state=current]{color:var(--pay-accent);font-weight:600}
.payment-card__progress [data-state=current] b{border-color:var(--pay-accent);color:var(--pay-accent)}
.payment-card .payment-card__heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;padding-bottom:20px}
.payment-card .payment-card__heading h1{margin:0;font-size:25px;font-weight:650;letter-spacing:-.5px;line-height:1.4;color:var(--pay-text)}
.payment-card .payment-card__amount{font-size:32px;font-weight:650;line-height:1.25;letter-spacing:-.7px;font-variant-numeric:tabular-nums}
.payment-card .payment-card__amount small{margin-right:4px;font-size:16px;letter-spacing:0}
.payment-card .payment-card__amount-note{flex-basis:100%;margin:0;color:var(--pay-muted);font-size:11px}
.payment-card__body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.payment-card .payment-card__payment{padding:23px 18px 14px;text-align:center;background:var(--pay-panel);border:1px solid var(--pay-line);border-radius:17px;box-shadow:inset 0 1px 0 #d8e8ff0a}
.payment-card .payment-card__payment h2{margin:0;color:var(--pay-text);font-size:19px}
.payment-card .payment-card__payment-note{margin:10px 0 18px;color:var(--pay-muted);font-size:12px}
.payment-card .payment-card__qr{width:228px;max-width:100%;margin:0 auto 18px;padding:0;background:#fff;border:0;border-radius:0;overflow:hidden;line-height:0}
.payment-card .payment-card__qr svg{display:block;width:100%;height:auto;aspect-ratio:1;max-width:none;background:#fff}
.payment-card .payment-card__qr img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:#fff}
.payment-card .payment-card__method{display:flex;align-items:center;justify-content:center;gap:7px;color:var(--pay-muted);font-size:13px}
.payment-card .payment-card__method img{width:20px;height:20px;object-fit:contain;flex:none}
.payment-card .payment-card__pay-link{display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;height:auto;margin:18px 0 0;padding:10px 16px;border:1px solid #9ebce85c;border-radius:12px;background:var(--pay-button);color:var(--pay-button-text);font-size:15px;font-weight:600;text-decoration:none;box-shadow:inset 0 1px 0 #ffffff38,0 4px 16px #0a173315}
.payment-card .payment-card__pay-link:hover{background:var(--pay-button);color:var(--pay-button-text);border-color:var(--pay-accent);box-shadow:inset 0 1px 0 #ffffff50,0 4px 18px #6c9bff20}
.payment-card .payment-card__copy-link{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:6px 10px;margin:5px 0 0;border:0;background:transparent;color:var(--pay-accent);font-size:12px}
.payment-card .payment-card__countdown{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 0;padding-top:12px;border-top:1px solid var(--pay-line);color:var(--pay-muted);font-size:11px}
.payment-card .payment-card__countdown>span{display:inline-flex;align-items:center;gap:5px}
.payment-card .payment-card__countdown .icon,.payment-card .payment-card__countdown .payment-card__icon{width:14px;height:14px}
.payment-card .payment-card__countdown strong{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.payment-card .payment-card__qr-error{padding:14px;margin:0 0 16px;background:var(--pay-soft);border-radius:12px;color:var(--pay-muted);font-size:12px}
.payment-card .payment-card__details{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;border:0}
.payment-card .payment-card__detail{display:grid;grid-template-columns:minmax(58px,1fr) minmax(0,2.5fr);align-items:start;gap:12px;font-size:12px;line-height:1.65}
.payment-card .payment-card__detail dt{margin:0;color:var(--pay-muted);font-weight:400}
.payment-card .payment-card__detail dd{min-width:0;margin:0;color:var(--pay-text);text-align:right;font-weight:450;white-space:pre-wrap;overflow-wrap:anywhere}
.payment-card .payment-card__detail--order dd{font-size:11px;font-variant-numeric:tabular-nums}
.payment-card .payment-card__detail .payment-card__status{color:var(--pay-accent);font-weight:600}
.payment-card .payment-card__detail .payment-card__status[data-status=paid]{color:var(--pay-complete)}
.payment-card .payment-card__detail--total{padding-top:12px;border-top:1px solid var(--pay-line)}
.payment-card .payment-card__detail--total dd{font-weight:600;font-variant-numeric:tabular-nums}
.payment-card .payment-card__actions{display:flex;flex-direction:column;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--pay-line)}
.payment-card .payment-card__action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.payment-card .payment-card__button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:44px;width:100%;height:auto;padding:9px 10px;border:1px solid var(--pay-line);border-radius:11px;background:var(--pay-panel);color:var(--pay-text);font-size:12px;font-weight:500;line-height:1.5;text-decoration:none;box-shadow:inset 0 1px 0 #d8e8ff08}
.payment-card .payment-card__button:hover:not(:disabled){border-color:var(--pay-accent);color:var(--pay-accent)}
.payment-card .payment-card__button:disabled{opacity:.5;cursor:not-allowed}
.payment-card .payment-card__sync-note,.payment-card .payment-card__poll-note{margin:12px 0 0;color:var(--pay-muted);font-size:11px;text-align:center}
.payment-card .payment-card__sync-note{color:var(--pay-accent)}
.payment-card .payment-card__sync-note:empty{display:none}
.payment-card .payment-card__credentials-note{margin:12px 0 0;color:var(--pay-muted);font-size:11px;text-align:center}
.payment-card .payment-card__credentials-note button{margin-left:4px;padding:0;color:var(--pay-accent);background:transparent;border:0;font-size:inherit;text-decoration:underline;text-underline-offset:2px}
.payment-card .payment-card__state{padding:24px 18px 20px;background:var(--pay-panel);border:1px solid var(--pay-line);border-radius:17px;text-align:center;box-shadow:inset 0 1px 0 #d8e8ff0a}
.payment-card .payment-card__state-icon{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:54px;height:54px;margin:0 auto 19px;border:1px solid var(--pay-line);border-radius:50%;color:var(--pay-muted);background:radial-gradient(circle at 33% 25%,#bdd8ff20,transparent 70%),var(--pay-soft)}
.payment-card .payment-card__state-icon:before{content:"";position:absolute;inset:-7px;border:1px solid var(--pay-line);border-radius:50%;pointer-events:none}
.payment-card .payment-card__state-icon:after{content:"";position:absolute;z-index:-1;width:80px;height:24px;border:1px solid var(--pay-accent);border-radius:50%;transform:rotate(-26deg);opacity:.55;pointer-events:none}
.payment-card .payment-card__state-icon .icon,.payment-card .payment-card__state-icon .payment-card__icon{width:22px;height:22px}
.payment-card .payment-card__state--paid .payment-card__state-icon{color:var(--pay-complete);border-color:var(--pay-complete)}
.payment-card .payment-card__state h2{margin:0;color:var(--pay-text);font-size:18px;font-weight:600}
.payment-card .payment-card__state>p{margin:10px 0 0;color:var(--pay-muted);font-size:12px}
.payment-card .payment-card__delivery{margin-top:18px;padding:15px 12px 10px;text-align:left;background:transparent;border:0;border-top:1px solid var(--pay-line);border-radius:0}
.payment-card .payment-card__delivery strong{font-size:12px;color:var(--pay-muted);font-weight:600}
.payment-card .payment-card__delivery pre{margin:8px 0 0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;line-height:1.8;color:var(--pay-text);white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
.payment-method-dialog .payment-method-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.payment-method-dialog .payment-method-options button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px}
.payment-method-dialog .payment-method-options img{width:23px;height:23px}
@media(max-width:620px){.payment-card{max-width:440px;padding:20px;border-radius:20px}.payment-card__body{grid-template-columns:minmax(0,1fr);gap:22px}.payment-card .payment-card__heading h1{font-size:24px}.payment-card .payment-card__amount{font-size:30px}.payment-card .payment-card__details{gap:11px}.payment-card .payment-card__actions{margin-top:20px}}
@media(max-width:350px){.payment-card{padding:16px}.payment-card .payment-card__qr{width:210px}.payment-card .payment-card__button{gap:5px;padding:8px 5px;font-size:11px}.payment-card__progress li{font-size:11px}}

/* ./checkout-captcha.css */
.checkout-captcha{width:320px;max-width:100%;min-width:0;flex:none;padding:10px 0}
.checkout-captcha[hidden]{display:none!important}
.checkout-captcha__widget{min-width:0;max-width:100%}
.checkout-captcha__status{margin:7px 0;font-size:12px;line-height:1.6;color:var(--secondary)}
.checkout-captcha__retry{padding:7px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font:inherit;font-size:12px;cursor:pointer}
.checkout-captcha__retry[hidden]{display:none}
.payment-card-page{padding-top:32px;padding-bottom:20px;min-height:70vh}
@media(max-width:480px){.payment-card-page{padding-top:20px}.checkout-submit{max-width:100%;min-width:0;flex-wrap:wrap}}

/* ./partner-entry.css */
/* Account access is independent of the homepage motion and navigation effects. */
.site-header .header-account{display:inline-flex;align-items:center;justify-content:center;flex:none;padding:10px 23px;border:0;border-radius:999px;background:transparent;box-shadow:none;color:var(--secondary);font-family:inherit;font-size:12px;font-weight:600;line-height:normal;white-space:nowrap;text-decoration:none;transition:color .22s ease}
.site-header .header-account:focus-visible{outline:2px solid #83abeb;outline-offset:3px}
.site-header .header-account:hover,.site-header .header-account:focus-visible{color:var(--text)}
.dialog-note .partner-entry-links{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.partner-entry-links a{color:#729ff7;text-decoration:underline;text-underline-offset:3px}
.site-header{position:relative;z-index:20}
.site-header .header-controls{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:0 10px 0 0;border:1px solid #3a4758;border-radius:999px;background:linear-gradient(145deg,#1b2430,#111821);box-shadow:inset 0 1px 0 #e1edff12,0 8px 20px #0000003d}
body:not(.dark-page) .site-header .header-controls{background:linear-gradient(145deg,#e9eef4,#dfe6ee);border-color:#d1dbe7;box-shadow:inset 0 1px 0 #fff,0 4px 14px #41577414}
.site-header .header-controls .header-nav{margin:0;min-width:0;background:transparent;border-color:transparent;box-shadow:none}
.site-header .header-controls .header-actions{margin:0;gap:0}
.site-header .header-nav .header-account{position:relative;z-index:1;margin:0;font-size:12px}
.site-header .header-nav [data-action="orders"]{display:inline-flex;align-items:center;gap:7px;padding:10px 15px}
.site-header .header-nav [data-action="orders"] .icon{width:15px;height:15px}
.site-header .header-mobile-menu{display:none}
.site-header .header-guide{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;flex:none;padding:10px 23px;border-radius:999px;color:var(--secondary);font-size:12px;font-weight:600;line-height:normal;white-space:nowrap;transition:color .22s ease}
.site-header .header-guide:is(:hover,:focus-visible){color:var(--text)}
.site-menu-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:20px 0}
.site-menu-links>:last-child:nth-child(odd){grid-column:1/-1}
.site-menu-links--member>[data-menu-destination="agency"]{grid-column:1/-1}
.site-menu-links--member>:last-child:nth-child(odd){grid-column:auto}
.site-menu-links>a,.site-menu-links>button{display:flex;align-items:center;justify-content:center;min-width:0;min-height:48px;padding:10px 8px;border:1px solid #8ea4ca3b;border-radius:12px;background:#88a9ec0b;color:inherit;text-align:center;text-decoration:none;font:inherit;font-size:13px;line-height:1.5}
.site-menu-links>:is(a,button):focus-visible{outline:2px solid #83abeb;outline-offset:3px}
.site-menu-dialog{width:min(420px,100%);max-height:calc(100dvh - 32px);overflow:auto}
.site-menu-dialog .btn[data-close-dialog]{display:none}
@media(max-width:1120px){.site-header .header-account{padding:10px 17px}}
@media(max-width:900px){.site-header .header-controls{position:static;transform:none;margin-left:auto;padding:0;border:0;border-radius:0}.site-header .header-controls,body:not(.dark-page) .site-header .header-controls{background:transparent;box-shadow:none}.site-header .header-nav{display:none}.site-header .header-controls .header-actions{gap:10px}.site-header .header-mobile-menu{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 12px;border:1px solid #8ea4ca45;border-radius:12px;color:var(--text);font-size:12px;font-weight:600}.site-header .header-mobile-menu svg{width:17px;height:17px}}
@media(max-width:900px){
 .site-header .header-actions :is(.theme-toggle.change-theme__icon,.header-mobile-menu){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:7px;width:88px;height:44px;min-height:44px;padding:0 10px;border-radius:12px;border:1px solid #8ea4ca45;font-size:12px;font-weight:600;color:var(--text)}
 .site-header .header-actions .theme-toggle.change-theme__icon{width:44px;height:44px;padding:10px;border:0;background:transparent;box-shadow:none;border-radius:50%;min-height:44px}
 .site-header .header-actions .theme-toggle.change-theme__icon:hover{background:transparent;border-color:transparent}
 .site-header .theme-toggle .theme-orb{width:24px;height:24px;flex:none}
}
@media(max-width:360px){
 .site-header .header-actions .header-mobile-menu{width:76px;padding-inline:7px}
 .site-header .header-controls .header-actions{gap:6px}
}
/* Emphasize only the live catalog total; category badges keep their own scale. */
@media(min-width:641px){
  .home-page .collection-toolbar .collection-count{--collection-count-accent:#16835c;flex:0 0 auto}
  body.dark-page .home-page .collection-toolbar .collection-count{--collection-count-accent:#67d9a7}
  .home-page .collection-toolbar .collection-count #product-count{color:var(--collection-count-accent);font-size:18px;font-weight:750;line-height:1;font-variant-numeric:tabular-nums}
  .home-page .collection-toolbar .collection-count .status-dot{width:8px;height:8px;flex:0 0 8px;background:var(--collection-count-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--collection-count-accent) 18%,transparent)}
}

/* A scroll destination is not an interactive card; its controls retain their focus styles. */
#collection:focus{outline:none}

.site-menu-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 10px}
.site-menu-heading h2{margin:0}
.site-menu-heading .site-menu-theme{box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:0;border:1px solid #96b9f080;border-radius:50%;background:#88a9ec1c;color:var(--text)}
.site-menu-heading .site-menu-theme .theme-orb{display:block;flex:none;width:28px;height:28px}
.site-menu-heading .site-menu-theme .theme-orb__core{fill:#f5d185;filter:none}
.site-menu-heading .site-menu-theme .theme-orb__rays{stroke:#f5d185;stroke-width:1.7}
.site-menu-heading .site-menu-theme .theme-orb__moon{fill:#395e9a}
body.dark-page .site-menu-heading .site-menu-theme .theme-orb__moon{fill:#d2e3ff}
body:not(.dark-page) .site-menu-heading .site-menu-theme{background:#e8effb;border-color:#91add6}
.site-menu-heading .site-menu-theme:is(:hover,:focus-visible){background:#88a9ec32}
.site-menu-heading .site-menu-theme:focus-visible{outline:2px solid #83abeb;outline-offset:3px}
.contact-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.agency-dialog{padding:28px;max-width:460px}
.agency-dialog .dialog-eyebrow{margin-bottom:8px}
.agency-dialog h2{font-size:22px;margin-bottom:10px;padding-right:18px;line-height:1.4}
.agency-dialog>p{margin:0;font-size:12px;line-height:1.75}
.agency-dialog .dialog-note{margin-top:15px;padding:17px;font-size:12px;line-height:1.75}
.agency-dialog .dialog-note>p{margin:5px 0 0;font-size:11px;line-height:1.8}
.agency-dialog .partner-entry-links{gap:8px 14px;margin:10px 0 16px;font-size:11px}
.agency-dialog .contact-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:13px}
.agency-dialog .contact-actions>a.btn{display:flex;align-items:center;justify-content:center;min-width:0;width:100%;min-height:42px;margin:0;padding:8px 6px;font-size:12px;line-height:1.4;white-space:nowrap;gap:0;text-align:center}
@media(max-width:400px){.agency-dialog{padding:25px 20px}.agency-dialog h2{font-size:20px}.agency-dialog .dialog-note{padding:13px}.agency-dialog .contact-actions{gap:7px}.agency-dialog .contact-actions>a.btn{font-size:11px;padding-inline:3px}}
@media(max-width:900px){.site-header .header-actions .theme-toggle.change-theme__icon{display:none}}

/* Local design preview only. MiSans is provided by Xiaomi; original font bytes
   and the accompanying license are retained in fonts/. */

.home-hero .actual-type-frame{
 display:block;position:relative;width:min(100%,480px);height:206px;margin:0 auto;
}
.home-hero .actual-type-frame>.hero-typography-lockup{
 visibility:hidden;opacity:0!important;width:100%;height:100%;
}
.home-hero .actual-type{
 position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
 pointer-events:none;color:#f3f5f8;-webkit-font-smoothing:antialiased;
 font-family:"Star Preview MiSans","Microsoft YaHei UI",sans-serif;
}
.actual-type .actual-type__group{width:340px;max-width:100%;text-align:center;}
.actual-type__group>span{display:block;white-space:nowrap;}
.actual-type .actual-type__hello{
 color:#93bada;
 font-size:23px;line-height:1.2;font-weight:450;letter-spacing:-.5px;margin-bottom:9px;
}
.actual-type .actual-type__category{
 color:#d3dbe5;font-size:24px;line-height:1.4;font-weight:450;letter-spacing:.6px;margin-bottom:5px;
}
.actual-type .actual-type__headline{
 font-size:62px;line-height:1.2;font-weight:520;letter-spacing:1.5px;margin-bottom:18px;
}
.actual-type .actual-type__brand{position:relative;color:#b2d7f1;}
.actual-type .actual-type__brand::after{
 content:"";position:absolute;left:3px;right:0;bottom:-7px;height:2px;
 background:#a2c8e4;border-radius:60% 30% 75% 30%;transform:rotate(-2deg);
}
.actual-type .actual-type__support{
 color:#a7b2c1;font-size:14px;line-height:1.6;font-weight:330;letter-spacing:.8px;
}
.home-hero .hero-copy:has(.actual-type) .hero-actions{margin-top:12px!important;}
html[data-type-variant="editorial"] .actual-type{font-family:"Star Preview MiSans","Microsoft YaHei UI",sans-serif;}
html[data-type-variant="editorial"] .actual-type .actual-type__group{width:310px;text-align:left;}
html[data-type-variant="editorial"] .actual-type .actual-type__hello{
 font-size:17px;font-weight:380;letter-spacing:.3px;color:#9ebbd3;margin-bottom:13px;
}
html[data-type-variant="editorial"] .actual-type .actual-type__category{
 color:#f1f4f8;font-size:30px;line-height:1.35;font-weight:520;letter-spacing:-.5px;margin-bottom:4px;
}
html[data-type-variant="editorial"] .actual-type .actual-type__headline{
 font-size:56px;line-height:1.2;letter-spacing:.4px;font-weight:600;margin-bottom:18px;
}
html[data-type-variant="editorial"] .actual-type .actual-type__brand{color:#eef5fc;}
html[data-type-variant="editorial"] .actual-type .actual-type__brand::after{display:none;}
html[data-type-variant="editorial"] .actual-type .actual-type__support{font-size:14px;letter-spacing:.3px;}
body:not(.dark-page) .home-hero .actual-type,
body:not(.dark-page) .actual-type .actual-type__brand,
body:not(.dark-page) .actual-type .actual-type__category{color:#28364b;}
body:not(.dark-page) .actual-type .actual-type__hello{color:#4e7b9d;}
body:not(.dark-page) .actual-type .actual-type__support{color:#64748b;}
@media(max-width:640px){
 .home-hero .actual-type-frame{width:min(100%,260px);height:126px;}
 .actual-type .actual-type__group{width:250px;}
 .actual-type .actual-type__hello{font-size:14px;line-height:1.2;margin-bottom:5px;}
 .actual-type .actual-type__category{font-size:16px;line-height:1.35;letter-spacing:.3px;margin-bottom:2px;}
 .actual-type .actual-type__headline{font-size:30px;line-height:1.3;letter-spacing:.7px;margin-bottom:12px;}
 .actual-type .actual-type__brand::after{height:1.5px;bottom:-5px;}
 .actual-type .actual-type__support{font-size:10.5px;line-height:1.5;letter-spacing:.15px;}
 .home-hero .hero-copy:has(.actual-type) .hero-actions{margin-top:8px!important;}
 html[data-type-variant="editorial"] .actual-type .actual-type__group{width:232px;}
 html[data-type-variant="editorial"] .actual-type .actual-type__hello{font-size:13px;line-height:1.2;margin-bottom:7px;}
 html[data-type-variant="editorial"] .actual-type .actual-type__category{font-size:20px;line-height:1.35;letter-spacing:-.3px;margin-bottom:3px;}
 html[data-type-variant="editorial"] .actual-type .actual-type__headline{font-size:30px;line-height:1.3;letter-spacing:.2px;margin-bottom:10px;}
 html[data-type-variant="editorial"] .actual-type .actual-type__support{font-size:10.5px;line-height:1.5;letter-spacing:.1px;}
}

/* Font exploration only. All original font bytes and publisher provenance
   remain in fonts/. This sheet is never included in the published store. */




/* Keep the already-liked greeting and underline identical across alternatives. */
html[data-type-face] .actual-type .actual-type__hello{
 font-family:"Star Preview MiSans",sans-serif;color:#93bada;font-size:23px;
 line-height:1.2;font-weight:450;letter-spacing:-.5px;margin-bottom:9px;
}
html[data-type-face] .actual-type .actual-type__headline{line-height:74.4px;}
html[data-type-face] .actual-type .actual-type__brand::after{
 display:block;background:#a2c8e4;height:2px;bottom:-7px;transform:rotate(-2deg);
}

html[data-type-face="rounded"] .actual-type .actual-type__category{
 font-family:"Star Rounded",sans-serif;font-weight:500;font-size:24px;letter-spacing:1px;
}
html[data-type-face="rounded"] .actual-type .actual-type__headline{
 font-family:"Star Rounded",sans-serif;font-size:62px;font-weight:700;letter-spacing:1.4px;
}
html[data-type-face="rounded"] .actual-type .actual-type__support{
 font-family:"Star Rounded",sans-serif;font-weight:500;font-size:14px;letter-spacing:.7px;
}

html[data-type-face="tech"] .actual-type .actual-type__category{
 font-family:"Star Tech",sans-serif;font-weight:400;font-size:24px;letter-spacing:1px;
}
html[data-type-face="tech"] .actual-type .actual-type__headline{
 font-family:"Star Tech",sans-serif;font-size:62px;font-weight:400;letter-spacing:2.3px;
}
html[data-type-face="tech"] .actual-type .actual-type__support{
 font-family:"Star Preview MiSans",sans-serif;font-weight:330;font-size:14px;letter-spacing:1.1px;
}

html[data-type-face="serif"] .actual-type .actual-type__category{
 font-family:"Noto Serif SC","Songti SC",serif;font-weight:550;font-size:24px;letter-spacing:1.4px;
}
html[data-type-face="serif"] .actual-type .actual-type__headline{
 font-family:"Noto Serif SC","Songti SC",serif;font-size:62px;font-weight:750;letter-spacing:3px;
}
html[data-type-face="serif"] .actual-type .actual-type__support{
 font-family:"Noto Serif SC","Songti SC",serif;font-weight:450;font-size:14px;letter-spacing:.9px;
}

@media(max-width:640px){
 html[data-type-face] .actual-type .actual-type__hello{font-size:14px;line-height:1.2;margin-bottom:5px;}
 html[data-type-face] .actual-type .actual-type__category{font-size:16px;line-height:21.6px;letter-spacing:.3px;}
 html[data-type-face] .actual-type .actual-type__headline{font-size:30px;line-height:39px;letter-spacing:.8px;}
 html[data-type-face] .actual-type .actual-type__support{font-size:10.5px;line-height:15.75px;letter-spacing:.15px;}
 html[data-type-face] .actual-type .actual-type__brand::after{height:1.5px;bottom:-5px;}
}

/* Local reference study only: a strong blue greeting and a compact left edge. */
/* Hide the browser helper's injected palette in local comparison screenshots. */
#automa-palette{display:none!important;}
.home-hero .actual-type .actual-type__group{width:340px;text-align:left;}
html[data-type-face] .actual-type .actual-type__hello{
 font-family:"Star Preview MiSans",sans-serif;font-size:46px;line-height:1.1;
 font-weight:700;letter-spacing:-1.1px;color:#92c5fc;margin-bottom:1px;
}
html[data-type-face] .actual-type .actual-type__category{
 font-family:"Star Preview MiSans",sans-serif;font-size:26px;line-height:1.35;
 font-weight:700;letter-spacing:-.3px;color:#f3f5f8;margin-bottom:3px;
}
html[data-type-face] .actual-type .actual-type__headline{
 font-family:"Star Preview MiSans",sans-serif;font-size:58px;line-height:1.14;
 font-weight:700;letter-spacing:-1.4px;color:#f3f5f8;margin-bottom:17px;
}
html[data-type-face] .actual-type .actual-type__brand{color:#f3f5f8;}
html[data-type-face] .actual-type .actual-type__support{
 font-family:"Star Preview MiSans",sans-serif;font-size:13.5px;line-height:1.6;
 font-weight:380;letter-spacing:.7px;
}
.home-hero .hero-copy:has(.actual-type) .hero-actions{
 width:min(100%,340px)!important;justify-content:flex-start;
 margin-left:auto!important;margin-right:auto!important;gap:14px;
}
@media(max-width:640px){
 .home-hero .actual-type .actual-type__group{width:250px;}
 html[data-type-face] .actual-type .actual-type__hello{
  font-size:28px;line-height:30.8px;letter-spacing:-.6px;margin-bottom:2px;
 }
 html[data-type-face] .actual-type .actual-type__category{
  font-size:17.5px;line-height:23.625px;letter-spacing:-.2px;margin-bottom:2px;
 }
 html[data-type-face] .actual-type .actual-type__headline{
  font-size:33px;line-height:39.6px;letter-spacing:-.7px;margin-bottom:12px;
 }
 html[data-type-face] .actual-type .actual-type__support{
  font-size:10.5px;line-height:15.75px;letter-spacing:.15px;
 }
 .home-hero .hero-copy:has(.actual-type) .hero-actions{
  width:min(100%,250px)!important;gap:10px;
 }
}

/* Local preview: stronger desktop scale and centered mobile text/buttons. */
@media(min-width:641px){
 .home-hero .actual-type-frame{height:220px;}
 .home-hero .actual-type .actual-type__group{width:420px;}
 html[data-type-face] .actual-type .actual-type__hello{
  font-size:clamp(40px,4.05vw,62px);margin-bottom:2px;
 }
 html[data-type-face] .actual-type .actual-type__category{
  font-size:clamp(24px,2.15vw,33px);margin-bottom:3px;
 }
 html[data-type-face] .actual-type .actual-type__headline{
  font-size:clamp(50px,5.1vw,78px);margin-bottom:0;
 }
 html[data-type-face] .actual-type .actual-type__support{
  font-size:14.5px;
 }
 .home-hero .hero-copy:has(.actual-type) .hero-actions{
  width:min(100%,420px)!important;
 }
}
@media(max-width:640px){
 .home-hero .actual-type .actual-type__group{text-align:center;}
 .home-hero .hero-copy:has(.actual-type) .hero-actions{justify-content:center;}
}

/* Local mobile layout study; the approved desktop scale remains in v6. */
@media(max-width:640px){
 .home-hero .actual-type-frame{width:min(100%,300px);height:128px;}
 .home-hero .actual-type .actual-type__group{width:280px;text-align:center;}
 html[data-type-face] .actual-type .actual-type__hello{
  font-size:30px;line-height:1.15;font-weight:700;margin-bottom:8px;
 }
 html[data-type-face] .actual-type .actual-type__category{
  font-size:16px;line-height:1.4;font-weight:500;letter-spacing:.35px;
  color:#d3dbe5;margin-bottom:8px;
 }
 html[data-type-face] .actual-type .actual-type__headline{
  position:relative;width:fit-content;margin-left:auto;margin-right:auto;
  font-size:40px;line-height:1.15;letter-spacing:-.7px;margin-bottom:0;
 }
 html[data-type-face] .actual-type .actual-type__support{
  font-size:11.5px;line-height:1.5;font-weight:400;letter-spacing:.2px;
 }
 .home-hero .hero-copy:has(.actual-type) .hero-actions{
  width:min(100%,280px)!important;justify-content:center;
  margin-top:14px!important;gap:12px;
 }
 .home-hero .hero-copy:has(.actual-type) .hero-actions .btn{
  height:38px;min-height:38px;
 }
}
@media(max-width:360px){
 html[data-type-face] .actual-type .actual-type__hello{font-size:28px;}
 html[data-type-face] .actual-type .actual-type__category{font-size:15.5px;}
 html[data-type-face] .actual-type .actual-type__headline{font-size:36px;}
 html[data-type-face] .actual-type .actual-type__support{font-size:11px;}
}

/* Local preview: follow the reference's common left edge on mobile. */
@media(max-width:640px){
 .home-hero .actual-type .actual-type__group{text-align:left;}
 html[data-type-face] .actual-type .actual-type__headline{
  margin-left:0;margin-right:0;
 }
 .home-hero .hero-copy:has(.actual-type) .hero-actions{
  justify-content:flex-start;
 }
}

/* Let mobile card content determine its height instead of clipping to a square. */
/* Screenshot-only rendering; ordinary storefront assets are unchanged. */
html[data-preview-capture] .home-page .product-grid .product-card{
 content-visibility:visible;contain-intrinsic-size:none;
}
@media(max-width:640px){
 .home-page .product-grid .product-card{
  aspect-ratio:auto;height:auto;min-height:180px;
 }
}

/* Local font pairing preview; all three lines use different font files. */
html[data-type-face] .actual-type .actual-type__hello{
 font-family:"Star Preview MiSans",sans-serif;font-weight:700;
}
html[data-type-face] .actual-type .actual-type__category{
 font-family:"Star Tech",sans-serif;font-weight:400;letter-spacing:.6px;
}
html[data-type-face] .actual-type .actual-type__headline{
 font-family:"Star Rounded",sans-serif;font-weight:700;letter-spacing:.4px;
}
@media(min-width:641px){
 .home-hero .actual-type-frame{height:242px;}
 .home-hero .actual-type .actual-type__group{width:460px;}
 html[data-type-face] .actual-type .actual-type__hello{
  font-size:clamp(44px,4.5vw,70px);
 }
 html[data-type-face] .actual-type .actual-type__category{
  font-size:clamp(24px,2.35vw,37px);
 }
 html[data-type-face] .actual-type .actual-type__headline{
  font-size:clamp(56px,5.8vw,90px);
 }
 .home-hero .hero-copy:has(.actual-type) .hero-actions{
  width:min(100%,460px)!important;
 }
}
@media(max-width:640px){
 html[data-type-face] .actual-type .actual-type__headline{letter-spacing:-.1px;}
}

/* Static orbit accent, confined to the local typography preview. */
html[data-type-face] .actual-type .actual-type__brand::after{
 content:"";left:-8px;right:-20px;bottom:-12px;height:20px;
 border:0;border-radius:0;box-shadow:none;transform:none;
 background:url('./assets/nova-title-orbit-73137341eebb.svg') center / 100% 100% no-repeat;
 filter:drop-shadow(0 0 3px #62b6ff88) drop-shadow(0 2px 7px #3679d344);
}
@media(max-width:640px){
 html[data-type-face] .actual-type .actual-type__brand::after{
  left:-4px;right:-11px;bottom:-8px;height:12px;
  filter:drop-shadow(0 0 2px #62b6ff88);
 }
}

/* Keep the real character for layout, selection and accessibility. */
.home-hero .actual-type .actual-type__planet-letter{
 position:relative;display:inline-block;line-height:inherit;
}
.home-hero .actual-type .actual-type__plain-letter{
 color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;
}
.home-hero .actual-type .actual-type__glyph-art{
 position:absolute;left:0;top:-.154em;width:1em;height:1.448em;
 overflow:visible;pointer-events:none;transform:none;animation:none;
}
@media(max-width:640px){
 .home-hero .actual-type .actual-type__glyph-art{top:-.149em;}
}

/* Render only the approved glyph artwork; keep real accessible text. */
.home-hero .actual-type-frame>.hero-typography-lockup{display:block;object-fit:fill;}
.home-hero .actual-type .actual-type__hello,.home-hero .actual-type .actual-type__category{position:relative;}
.home-hero .actual-type .actual-type__text{color:transparent!important;}
.home-hero .actual-type .actual-type__word-art{position:absolute;left:0;top:0;max-width:none;pointer-events:none;}
.home-hero .actual-type .actual-type__hello .actual-type__word-art{width:2.675em;height:1.1em;}
.home-hero .actual-type .actual-type__category .actual-type__word-art{width:8.40625em;height:1.3984375em;}
.home-hero .actual-type h1.actual-type__headline{margin-top:0;margin-left:0;margin-right:0;padding:0;}
.home-hero .actual-type h1.actual-type__headline span{margin:0;padding:0;transform:none;animation:none;filter:none;text-shadow:none;background:none;}
.home-hero .actual-type .actual-type__headline :is(.actual-type__brand,.actual-type__outline-letter){color:inherit;}
.home-hero .actual-type .actual-type__outline-letter{position:relative;display:inline-block;width:1em;height:1.15em;line-height:inherit;vertical-align:top;}
.home-hero .actual-type .actual-type__plain-letter{position:absolute;inset:0;opacity:0;color:transparent!important;-webkit-text-fill-color:transparent!important;}
body:not(.dark-page) .home-hero .actual-type .actual-type__headline{color:#28364b;}
body:not(.dark-page) .home-hero .actual-type .actual-type__hello .actual-type__word-art{filter:brightness(.65) saturate(1.3);}
body:not(.dark-page) .home-hero .actual-type .actual-type__category .actual-type__word-art{filter:brightness(.38);}
@media(max-width:640px){.home-hero .actual-type .actual-type__hello .actual-type__word-art{top:.025em;}}
@media(min-width:641px) and (max-width:799px){.home-page .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(min-width:800px) and (max-width:1024px){.home-page .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}

/* Lift desktop lettering; leave the orbit accent and action buttons in place. */
@media(min-width:641px){
 .home-hero .actual-type .actual-type__group{transform:translateY(-12px);}
 html[data-type-face] .home-hero .actual-type .actual-type__brand::after{transform:translateY(12px);}
}

/* One transparent selected-letter asset per theme; no native letter underneath. */
.home-hero .actual-type .actual-type__selected-art--dark{display:none;}
.home-hero .actual-type .actual-type__selected-art--light{display:block;}
body.dark-page .home-hero .actual-type .actual-type__selected-art--dark{display:block;}
body.dark-page .home-hero .actual-type .actual-type__selected-art--light{display:none;}

/* Place the orbit accent separately, with clearance above the action buttons. */
html[data-type-face] .home-hero .actual-type .actual-type__brand::after{display:none;}
.home-hero .actual-type .actual-type__orbit-art{position:absolute;left:-8px;bottom:-12px;width:calc(100% + 28px);height:12px;max-width:none;object-fit:fill;pointer-events:none;transform:translateY(clamp(-9px,calc(10px - .21em),-2px));filter:drop-shadow(0 0 3px #62b6ff66);}
@media(max-width:640px){
 .home-hero .actual-type .actual-type__orbit-art{left:-4px;bottom:-8px;width:calc(100% + 15px);height:12px;transform:translateY(3px);filter:drop-shadow(0 0 2px #62b6ff66);}
 .home-hero .hero-copy:has(.actual-type) .hero-actions{margin-top:20px!important;}
}

/* Natural Earth: the static first frame remains behind a lazily started canvas. */
.home-hero .actual-type .actual-type__earth{position:absolute;left:.039501em;top:.151em;width:.27em;height:.27em;max-width:none;pointer-events:none;opacity:0;contain:strict;transform:none;animation:none;}
.home-hero .actual-type .actual-type__earth[data-earth-ready="true"]{opacity:1;}
@media(max-width:640px){.home-hero .actual-type .actual-type__earth{top:.156em;}}


/* Muse 6-slot Invite Grid (Dark & Light) + Built-in Progress Panel */
.xx-muse-subtitle {
  margin: -4px 0 16px;
  font-size: 14px;
  color: var(--muted, #94a3b8);
}
.invite-code {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-top: 6px;
}
.invite-code > .invite-slot {
  display: block;
  width: 100%;
  height: 52px;
  padding: 0;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(255, 255, 255, 0.92);
  color: #0f172a;
  font: 600 22px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-align: center;
  text-transform: uppercase;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}
.dark-page .invite-code > .invite-slot {
  background: rgba(15, 23, 42, 0.65);
  border-color: rgba(148, 163, 184, 0.24);
  color: #f8fafc;
}
.invite-code > .invite-slot:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.22);
}
.invite-code.invalid > .invite-slot,
.invite-code > .invite-slot.invalid {
  border-color: #ef4444;
}

.xx-muse-builtin {
  margin: 8px 0 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.xx-muse-builtin__tabs {
  display: flex;
  gap: 8px;
}
.xx-muse-builtin__tab {
  flex: 1;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(148, 163, 184, 0.08);
  color: inherit;
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.16s ease;
}
.xx-muse-builtin__tab:hover,
.xx-muse-builtin__tab.is-active {
  border-color: rgba(59, 130, 246, 0.55);
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  font-weight: 600;
}
.xx-muse-builtin__panel {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.35);
}
.xx-muse-builtin__tip {
  margin: 0 0 8px;
  font-size: 12px;
  color: #94a3b8;
}
.xx-muse-builtin__row {
  display: flex;
  gap: 8px;
}
.xx-muse-builtin__row input {
  flex: 1;
  height: 38px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  background: rgba(15, 23, 42, 0.6);
  color: inherit;
  font-size: 13px;
}
.xx-muse-builtin__btn {
  height: 38px;
  padding: 0 14px;
  border-radius: 10px;
  border: none;
  background: #3b82f6;
  color: #fff;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.xx-muse-builtin__result,
.xx-muse-progress {
  margin: 10px 0;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(59, 130, 246, 0.32);
  background: rgba(59, 130, 246, 0.09);
  display: flex;
  flex-direction: column;
  gap: 10px;
  text-align: left;
}
.xx-muse-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 13.5px;
}
.xx-muse-badge {
  font-size: 12px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(59, 130, 246, 0.2);
  color: #60a5fa;
}
.xx-muse-badge.is-done {
  background: rgba(16, 185, 129, 0.2);
  color: #34d399;
}
.xx-muse-badge.is-warn {
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
}
.xx-muse-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
}
.xx-muse-bar {
  width: 100%;
  height: 9px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.22);
  overflow: hidden;
}
.xx-muse-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #3b82f6, #10b981);
  transition: width 0.35s ease;
}
.xx-muse-hint {
  margin: 0;
  font-size: 12px;
  color: #94a3b8;
}
.xx-muse-alert {
  margin: 0;
  font-size: 12.5px;
  color: #f87171;
  font-weight: 500;
}
.xx-muse-ok {
  margin: 0;
  font-size: 12.5px;
  color: #34d399;
  font-weight: 600;
}
.xx-muse-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: #94a3b8;
}
.xx-muse-link {
  background: none;
  border: none;
  color: #60a5fa;
  font-size: 12px;
  cursor: pointer;
  text-decoration: underline;
}
.xx-muse-batches {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.xx-muse-chip {
  font-size: 11.5px;
  padding: 2px 8px;
  border-radius: 6px;
  background: rgba(148, 163, 184, 0.15);
}
.xx-muse-rebind {
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px dashed rgba(148, 163, 184, 0.28);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.xx-muse-rebind p {
  margin: 0;
  font-size: 12px;
}
.xx-muse-rebind-row {
  display: flex;
  gap: 8px;
}
.xx-muse-rebind-row input {
  flex: 1;
  height: 38px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.3);
  background: rgba(15, 23, 42, 0.5);
  color: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.xx-muse-rebind-msg.is-err {
  color: #f87171;
}