.fs-store { --fs-gold:#ffc83d; --fs-muted:#acadc1; --fs-border:rgba(255,255,255,.09); padding:1.1rem 0 1.5rem; }
.fs-store * { min-width:0; }
.fs-hero { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1fr) 240px; align-items:center; gap:2rem; min-height:285px; margin-bottom:2rem; padding:2.8rem 3rem; overflow:hidden; border:1px solid var(--fs-border); border-radius:24px; background:radial-gradient(ellipse at 93% 30%,rgba(131,66,242,.2),transparent 56%),linear-gradient(115deg,#171429,#10111e); }
.fs-hero::after { content:''; position:absolute; inset:0; z-index:-1; opacity:.1; background-image:linear-gradient(rgba(200,159,255,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(200,159,255,.25) 1px,transparent 1px); background-size:40px 40px; mask-image:linear-gradient(to right,transparent,#000); }
.fs-eyebrow { margin:0 0 .9rem; font-family:Outfit,sans-serif; font-size:.66rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--fs-muted); }
.fs-eyebrow > span { display:inline-block; width:6px; height:6px; margin-right:.5rem; border-radius:50%; background:var(--fs-gold); box-shadow:0 0 14px rgba(255,200,61,.5); }
.fs-hero h1 { margin:0 0 .75rem; font-size:clamp(3.2rem,5vw,5rem); font-weight:800; line-height:1.02; letter-spacing:-.025em; color:#f8f5ef; overflow-wrap:anywhere; }
.fs-hero h1 > span { display:block; color:var(--fs-gold); }
.fs-intro,.fs-description { max-width:660px; margin:0; color:#c3c1d3; font-size:.9rem; line-height:1.8; }
.fs-description > :last-child { margin-bottom:0; }
.fs-description img { max-width:100%; height:auto; }
.fs-hero-copy > .fs-button { margin-top:1.4rem; }
.fs-breadcrumb { display:inline-flex; align-items:center; gap:.4rem; margin-bottom:.7rem; color:var(--fs-gold); font-size:.76rem; }
.fs-breadcrumb:hover { color:#ffe89d; }
.fs-hero-art { position:relative; display:grid; place-items:center; height:230px; }
.fs-orbit { position:absolute; width:215px; height:215px; border:1px solid rgba(187,136,255,.16); border-radius:50%; background:radial-gradient(circle,rgba(140,82,255,.18),transparent 68%); }
.fs-orbit::before { content:''; position:absolute; inset:19px; border:1px dashed rgba(195,145,255,.19); border-radius:50%; }
.fs-crystal { width:144px; height:190px; transform:rotate(12deg); filter:drop-shadow(0 16px 30px rgba(129,60,218,.4)); }
.fs-art-star { position:absolute; top:27px; right:18px; font-size:1.6rem; color:var(--fs-gold); }
.fs-art-dot { position:absolute; left:22px; bottom:30px; width:7px; height:7px; border-radius:50%; background:#cba4ff; box-shadow:0 0 18px #b177ff; }
.fs-layout { display:grid; grid-template-columns:245px minmax(0,1fr); gap:1.75rem; align-items:start; }
.fs-sidebar { padding:1.4rem; border:1px solid var(--fs-border); border-radius:18px; background:#111222; }
.fs-sidebar-heading { margin-bottom:1rem; }
.fs-sidebar .list-group { border-radius:0; gap:.35rem; }
.fs-sidebar .fs-navigation .list-group-item { display:flex; gap:.6rem; align-items:center; padding:.8rem .85rem; border:1px solid transparent; border-radius:10px; background:transparent; color:#bcbdce; font-size:.82rem; font-weight:500; overflow-wrap:anywhere; }
.fs-sidebar .fs-navigation .list-group-item i { font-size:1rem; flex-shrink:0; }
.fs-sidebar .fs-navigation .list-group-item:hover { background:rgba(255,255,255,.04); color:#fff; }
.fs-sidebar .fs-navigation .list-group-item.active { border-color:rgba(255,200,61,.2); background:rgba(255,200,61,.1); color:var(--fs-gold); }
.fs-sidebar .fs-navigation .list-group-item.ps-5 { padding-left:1.7rem!important; font-size:.76rem; }
.fs-account { padding-top:0; }
.fs-account-help { font-size:.76rem; line-height:1.7; color:var(--fs-muted); margin-bottom:1rem; }
.fs-account h3 { font-size:1.2rem; overflow-wrap:anywhere; }
.fs-account .btn { border-radius:9px; font-size:.8rem; font-weight:600; padding:.7rem .65rem; }
.fs-sidebar .card { margin-top:1.4rem; border:1px solid var(--fs-border); border-radius:12px; overflow:hidden; background:rgba(255,255,255,.02); font-size:.77rem; }
.fs-sidebar .card-header { font-size:.77rem; padding:.8rem; }
.fs-sidebar .card-body { padding:.8rem; }
.fs-sidebar .list-group-flush .list-group-item { font-size:.75rem; }
.fs-section-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1.2rem; }
.fs-section-heading .fs-eyebrow { margin-bottom:.3rem; }
.fs-section-heading h2 { margin:0; font-size:2rem; font-weight:700; color:#f4f1ea; }
.fs-count { font-family:'Barlow Condensed',sans-serif; font-size:2.5rem; font-weight:700; color:#52516b; }
.fs-category-grid { display:grid; gap:1rem; }
.fs-category-card { position:relative; display:flex; align-items:center; gap:2rem; min-height:220px; padding:2rem; overflow:hidden; border:1px solid rgba(161,103,255,.2); border-radius:18px; background:radial-gradient(ellipse at 8% 50%,rgba(139,68,237,.23),transparent 60%),#141326; transition:border-color .2s,background-color .2s; }
.fs-category-card:hover { border-color:#9860eb; background-color:#1b1631; }
.fs-category-icon { display:grid; place-items:center; width:130px; height:130px; flex-shrink:0; border:1px solid rgba(192,146,255,.18); border-radius:28px; background:linear-gradient(145deg,rgba(156,91,255,.22),rgba(109,53,196,.08)); color:#c7a1ff; }
.fs-category-icon i { font-size:4rem; filter:drop-shadow(0 8px 12px rgba(154,95,245,.25)); }
.fs-category-copy { flex:1; }
.fs-category-number { color:#b8a2d1; font-size:.65rem; font-weight:600; text-transform:uppercase; letter-spacing:.13em; }
.fs-category-copy h3 { margin:.35rem 0 .75rem; color:#faf5ff; font-size:2.8rem; font-weight:700; }
.fs-category-action { display:inline-flex; align-items:center; gap:.65rem; color:var(--fs-gold); font-size:.83rem; font-weight:600; }
.fs-category-arrow { align-self:flex-start; color:#9274b8; font-size:1.2rem; }
.fs-welcome { display:flex; align-items:start; gap:1rem; margin-top:1.3rem; padding:1.3rem 1.5rem; border:1px solid var(--fs-border); border-radius:15px; background:#10111e; color:var(--fs-muted); font-size:.8rem; line-height:1.7; }
.fs-welcome-icon { display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; border-radius:10px; background:rgba(255,200,61,.07); color:var(--fs-gold); font-size:1.1rem; }
.fs-welcome h3 { margin:0 0 .4rem; font-family:Outfit,sans-serif; font-size:.85rem; font-weight:600; color:#ebe7de; }
.fs-welcome p:last-child { margin-bottom:0; }
.fs-welcome img { max-width:100%; }
.fs-product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.fs-product { display:flex; flex-direction:column; position:relative; padding:1.25rem; overflow:hidden; border:1px solid var(--fs-border); border-radius:16px; background:linear-gradient(150deg,#181429,#111220); transition:border-color .2s,box-shadow .2s; }
.fs-product:hover { border-color:rgba(185,129,255,.45); box-shadow:0 12px 30px rgba(0,0,0,.16); }
.fs-product-top { display:flex; align-items:center; justify-content:space-between; gap:.5rem; min-height:24px; }
.fs-product-number { color:#726680; font-size:.68rem; font-weight:700; }
.fs-sale { border:1px solid rgba(255,200,61,.2); border-radius:6px; padding:.2rem .4rem; background:rgba(255,200,61,.07); color:var(--fs-gold); font-size:.6rem; font-weight:600; }
.fs-product-art { display:grid; place-items:center; height:110px; margin:.6rem 0 1rem; border-radius:12px; background:radial-gradient(ellipse,rgba(139,77,224,.15),transparent 72%); }
.fs-product-art i { font-size:3.7rem; color:#c29aff; filter:drop-shadow(0 8px 15px rgba(147,77,242,.25)); }
.fs-product-art img { width:100%; height:100%; object-fit:contain; }
.fs-product-info { flex:1; }
.fs-product-category { margin:0 0 .3rem; color:#a99cba; font-size:.6rem; font-weight:600; text-transform:uppercase; letter-spacing:.13em; }
.fs-product-info h3 { margin:0 0 .6rem; font-size:1.75rem; font-weight:700; color:#f6f2fa; overflow-wrap:anywhere; }
.fs-product-description { color:var(--fs-muted); font-size:.74rem; line-height:1.6; }
.fs-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:.5rem; margin:.65rem 0 1.1rem; }
.fs-price strong { font-size:1.5rem; line-height:1.2; color:#ffe7a0; }
.fs-price del { font-size:.75rem; color:#a39aae; }
.fs-button { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; min-height:44px; padding:.75rem 1rem; border:1px solid transparent; border-radius:10px; font-size:.8rem; font-weight:600; }
.fs-primary { background:var(--fs-gold); color:#17121f; }
.fs-primary:hover { background:#ffda70; color:#17121f; }
.fs-product-button { width:100%; margin-top:auto; font-size:.73rem; }
.fs-product [aria-busy=true] { opacity:.6; cursor:progress; }
.fs-empty { grid-column:1 / -1; display:grid; place-items:center; gap:1rem; padding:3rem 1.5rem; border:1px dashed var(--fs-border); border-radius:16px; color:var(--fs-muted); text-align:center; font-size:.85rem; }
.fs-empty > i { font-size:2rem; color:#c29aff; }
.fs-empty p { margin:0; }
.fs-store a:focus-visible,.fs-store button:focus-visible { outline:2px solid var(--fs-gold); outline-offset:4px; }
.fs-product-modal .modal-content { border:1px solid rgba(175,114,255,.28); border-radius:18px; background:#141322; color:#f3eef8; box-shadow:0 30px 100px rgba(0,0,0,.5); }
.fs-product-modal .modal-header,.fs-product-modal .modal-footer { padding:1.25rem 1.5rem; border-color:rgba(255,255,255,.08); }
.fs-product-modal .modal-title { font-size:2rem; font-weight:700; }
.fs-product-modal .modal-body { padding:1.5rem; color:#c3c1d3; line-height:1.8; }
.fs-product-modal .modal-body img { max-width:100%; height:auto; }
.fs-product-modal .modal-footer > span { color:#ffe7a0; font-size:1.35rem; font-weight:700; }
.fs-product-modal .modal-footer .btn { border-radius:9px; padding:.7rem 1rem; font-weight:600; }
.fs-product-modal .btn-close { filter:invert(1) grayscale(100%) brightness(200%); }
@media(min-width:1200px) { .fs-sidebar { position:sticky; top:1.5rem; } }
@media(max-width:1199px) { .fs-layout { grid-template-columns:210px minmax(0,1fr); gap:1.25rem; } .fs-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .fs-hero { padding:2.2rem; } .fs-sidebar { padding:1rem; } }
@media(max-width:767px) { .fs-layout { grid-template-columns:1fr; gap:1.5rem; } .fs-hero { grid-template-columns:minmax(0,1fr) 145px; padding:1.6rem; gap:1rem; min-height:240px; } .fs-hero h1 { font-size:3.5rem; } .fs-hero-art { height:160px; } .fs-crystal { width:95px; height:130px; } .fs-orbit { width:145px; height:145px; } .fs-art-star { font-size:1.1rem; right:0; top:10px; } .fs-sidebar .fs-navigation { display:flex; flex-direction:row; flex-wrap:wrap; margin-bottom:1rem!important; } .fs-sidebar .fs-navigation .list-group-item { padding:.6rem .8rem; } .fs-account { display:flex; align-items:center; flex-wrap:wrap; gap:.75rem; } .fs-account .fs-eyebrow { width:100%; margin:0; } .fs-account-help { flex:1; margin:0; } .fs-account > .btn { flex-shrink:0; } .fs-account > .d-flex { margin-bottom:0!important; } .fs-account > form { width:100%; } .fs-category-card { min-height:185px; padding:1.5rem; gap:1.3rem; } .fs-category-icon { width:100px; height:100px; } .fs-category-icon i { font-size:3rem; } }
@media(max-width:575px) { .fs-store { padding:.5rem 0 1rem; } .fs-hero { grid-template-columns:minmax(0,1fr) 85px; border-radius:18px; padding:1.5rem 1.2rem; margin-bottom:1.2rem; gap:.35rem; } .fs-hero h1 { font-size:2.8rem; } .fs-hero .fs-eyebrow { font-size:.56rem; letter-spacing:.09em; } .fs-hero-art { height:130px; } .fs-crystal { width:75px; height:110px; } .fs-orbit { width:100px; height:100px; } .fs-art-dot { left:3px; bottom:5px; } .fs-intro,.fs-description { font-size:.78rem; line-height:1.7; } .fs-hero:has(.fs-description) { grid-template-columns:1fr; } .fs-hero:has(.fs-description) .fs-hero-art { display:none; } .fs-layout { gap:1.3rem; } .fs-section-heading { margin-bottom:.8rem; } .fs-section-heading h2 { font-size:1.8rem; } .fs-section-heading .fs-eyebrow { font-size:.61rem; } .fs-count { font-size:2rem; } .fs-product-grid { gap:.7rem; } .fs-product { padding:.85rem; border-radius:12px; } .fs-product-art { height:80px; margin:.4rem 0 .8rem; } .fs-product-art i { font-size:2.9rem; } .fs-product-info h3 { font-size:1.4rem; } .fs-price strong { font-size:1.2rem; } .fs-product-button { font-size:.65rem; gap:.4rem; padding:.65rem .4rem; } .fs-category-card { min-height:160px; padding:1.15rem; gap:1rem; } .fs-category-icon { width:75px; height:90px; border-radius:18px; } .fs-category-icon i { font-size:2.8rem; } .fs-category-copy h3 { font-size:2.3rem; } .fs-category-number { font-size:.55rem; } .fs-category-action { font-size:.71rem; } .fs-category-arrow { display:none; } .fs-welcome { padding:1rem; font-size:.74rem; } .fs-product-modal .modal-body,.fs-product-modal .modal-header,.fs-product-modal .modal-footer { padding:1rem; } .fs-product-modal .modal-footer { gap:.8rem; } }
@media(max-width:359px) { .fs-hero { grid-template-columns:1fr; } .fs-hero-art { display:none; } .fs-product { padding:.7rem; } .fs-product-info h3 { font-size:1.23rem; } .fs-product-button { font-size:.61rem; } .fs-product-category { font-size:.53rem; } .fs-account-help { width:100%; flex:auto; } }
@media(prefers-reduced-motion:reduce) { .fs-product,.fs-category-card { transition:none; } }