:root { --ink:#17151e; --violet:#7850ec; --violet-dark:#5637b5; --lime:#e9fa79; --paper:#f7f5ec; --white:#fffefa; --pink:#ff94a4; --muted:#6c6970; --nav-height:78px; --body:'DM Sans',Arial,sans-serif; --display:'Space Grotesk','DM Sans',Arial,sans-serif; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-height) + 20px); }
body { margin:0; padding-top:var(--nav-height); background:var(--paper); color:var(--ink); font:400 16px/1.55 var(--body); }
body,main,header,footer { min-width:0; }
:focus-visible { outline:3px solid var(--pink); outline-offset:4px; }
::selection { background:var(--lime); color:var(--ink); }
.navbar.site-nav { min-height:var(--nav-height); padding:0; border-bottom:2px solid var(--ink); background:var(--ink); }
.navbar.site-nav .navbar-brand,.footer-brand { display:inline-flex; align-items:center; gap:10px; margin:0; color:var(--white); text-decoration:none; font:700 1.6rem/1 var(--display); letter-spacing:-.065em; }
.navbar.site-nav .navbar-brand::before,.footer-brand::before { content:''; display:block; width:40px; height:40px; flex:none; background:url('../images/jokercoupon-mark.svg') center/contain no-repeat; }
.navbar.site-nav .nav-link { padding:.55rem 1rem; color:var(--white); font-size:.89rem; font-weight:800; }
.navbar.site-nav .nav-link:hover,.navbar.site-nav .nav-link.active { color:var(--lime); }
.navbar.site-nav .nav-cta { display:flex; justify-content:space-between; align-items:center; gap:1.6rem; margin-left:.75rem; padding:.6rem 1rem; background:var(--lime); color:var(--ink); border-radius:4px; }
.navbar.site-nav .nav-cta:hover { background:var(--pink); color:var(--ink); }
.navbar-toggler { border:1px solid var(--white); border-radius:3px; }
.navbar-toggler-icon { background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23fffefa' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }

.home-page .hero { overflow:hidden; background:var(--paper); }
.hero-layout { display:grid; grid-template-columns:53% 47%; min-height:670px; }
.hero-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:4.7rem 3rem 3.6rem 0; }
.hero-kicker,.section-index { margin:0; font:800 .7rem/1.3 var(--body); letter-spacing:.18em; }
.hero-kicker { display:flex; align-items:center; gap:.7rem; color:var(--violet-dark); }.hero-kicker span { font-size:1.2rem; line-height:1; }
.hero-copy h1 { margin:1.4rem 0 1.4rem; font:700 clamp(4.3rem,7vw,7.3rem)/.91 var(--display); letter-spacing:-.085em; }
.hero-copy h1 em { color:var(--violet); font-style:normal; }
.hero-lead { max-width:460px; margin:0; color:#56535c; font-size:1.05rem; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.7rem; margin-top:2rem; }
.main-button { display:inline-flex; align-items:center; justify-content:space-between; gap:1.9rem; min-height:57px; padding:.8rem 1.15rem; border:2px solid var(--ink); border-radius:5px; background:var(--ink); color:var(--white); text-decoration:none; font-weight:800; box-shadow:5px 5px 0 var(--violet); transition:transform .2s,box-shadow .2s; }
.main-button:hover { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--violet); color:var(--white); }
.plain-link { color:var(--ink); font-size:.89rem; font-weight:800; text-decoration:underline; text-underline-offset:5px; }.plain-link:hover { color:var(--violet-dark); }
.hero-bottom { display:flex; justify-content:space-between; gap:1rem; width:min(100%,470px); margin-top:4.3rem; padding-top:.85rem; border-top:1px solid #b6b2af; color:#6e6a72; font-size:.65rem; font-weight:800; letter-spacing:.1em; }
.hero-scene { position:relative; display:grid; place-items:center; min-height:670px; overflow:hidden; isolation:isolate; border-left:2px solid var(--ink); background:var(--violet); }
.hero-scene::before { content:''; position:absolute; z-index:-2; inset:0; opacity:.22; background:repeating-linear-gradient(45deg,transparent 0 73px,#2b1c65 74px 76px); }
.scene-diamond { position:absolute; z-index:-1; width:500px; height:500px; border:2px solid rgba(23,21,30,.55); transform:rotate(45deg); }
.diamond-one { left:-380px; top:-250px; }.diamond-two { right:-400px; bottom:-310px; }
.wild-card { position:relative; display:flex; flex-direction:column; width:min(64%,365px); min-height:500px; padding:1.1rem; border:3px solid var(--ink); border-radius:18px; background:var(--white); box-shadow:18px 20px 0 var(--ink); transform:rotate(-11deg); }
.wild-card::before { content:''; position:absolute; inset:12px; border:2px solid var(--ink); border-radius:9px; pointer-events:none; }
.card-corner { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; width:28px; color:var(--violet-dark); font:700 1.6rem/.9 var(--display); }.card-corner span { font-size:1rem; }.card-corner.bottom { align-self:end; margin-top:auto; transform:rotate(180deg); }
.card-center { position:absolute; inset:20% 7%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid var(--ink); border-radius:50%; background:var(--lime); transform:rotate(11deg); }
.center-spark { color:var(--violet); font-size:2.6rem; line-height:1; }
.card-center strong { margin:.7rem 0 .55rem; font:700 clamp(3.1rem,4.8vw,5rem)/.88 var(--display); letter-spacing:-.09em; text-align:center; }
.card-center small { font-size:.7rem; font-weight:900; letter-spacing:.12em; }
.scene-badge { position:absolute; right:2%; bottom:12%; z-index:2; display:flex; flex-direction:column; width:140px; padding:1rem; border:2px solid var(--ink); border-radius:4px; background:var(--pink); color:var(--ink); font-size:.7rem; font-weight:900; line-height:1.18; letter-spacing:.06em; transform:rotate(9deg); box-shadow:5px 5px 0 var(--ink); }.scene-badge span { align-self:end; font-size:1.6rem; }
.signal-bar { overflow:hidden; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); background:var(--lime); }
.signal-inner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:59px; white-space:nowrap; font-size:.71rem; font-weight:900; letter-spacing:.13em; }.signal-inner b { color:var(--violet-dark); font-size:1.4rem; line-height:1; }

.stores-section { padding:6.1rem 0 7rem; background:var(--ink); color:var(--white); }
.stores-intro { display:flex; justify-content:space-between; align-items:end; gap:3rem; margin-bottom:2.8rem; }
.section-index { color:var(--lime); }
.stores-intro h2,.how-heading h2 { margin:.7rem 0 0; font:700 clamp(3.6rem,6vw,6.4rem)/.95 var(--display); letter-spacing:-.08em; }.stores-intro h2 span { color:var(--lime); }
.stores-side { width:min(100%,355px); }.stores-side p { margin:0 0 1.1rem; color:#c6c4cd; font-size:.92rem; }
.store-search { display:flex; align-items:center; gap:.65rem; min-height:52px; padding:.35rem .8rem; border:2px solid var(--white); border-radius:3px; background:var(--white); color:var(--ink); }
.store-search > span { font-size:1.5rem; line-height:1; }.store-search input { flex:1; width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--ink); font-size:.85rem; }.store-search:focus-within { outline:3px solid var(--lime); outline-offset:3px; }.store-search button { border:0; background:transparent; color:var(--ink); font-size:1.4rem; line-height:1; }
.store-list { display:grid; gap:8px; }
.store-card { display:grid; grid-template-columns:55px minmax(0,1fr) 300px 52px; align-items:center; gap:1.25rem; min-height:144px; padding:1rem 1.15rem; border:2px solid var(--white); background:var(--paper); color:var(--ink); text-decoration:none; transition:transform .2s,background .2s; }
.store-card:nth-child(even) { background:#eee8ff; }.store-card:nth-child(3n) { background:#f2fab7; }
.store-card:hover { transform:translateX(9px); background:var(--pink); color:var(--ink); }
.store-number { align-self:start; font-size:.73rem; font-weight:900; }
.store-name { display:flex; flex-direction:column; gap:.1rem; }.store-name strong { font:700 clamp(2rem,3.8vw,3.7rem)/1 var(--display); letter-spacing:-.07em; }.store-name small { color:#57515f; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.store-logo { display:grid; place-items:center; width:300px; max-width:100%; height:100px; padding:.55rem; border:1px solid var(--ink); border-radius:3px; background:#fff; }
.store-logo.dark-logo { background:#1d273d; }.store-logo img { display:block; width:min(100%,270px); height:76px; object-fit:contain; }
.store-arrow { display:grid; place-items:center; width:46px; height:46px; border:2px solid var(--ink); border-radius:50%; font-size:1.4rem; line-height:1; transition:transform .2s; }.store-card:hover .store-arrow { transform:rotate(45deg); }
.store-card[hidden] { display:none !important; }.no-results { margin:1.8rem 0 0; color:var(--white); font-weight:700; }

.how-section { padding:6.2rem 0 6.6rem; background:var(--lime); color:var(--ink); }
.how-layout { display:grid; grid-template-columns:44% 56%; gap:3rem; }.how-section .section-index { color:var(--violet-dark); }.how-heading h2 span { color:var(--violet); }
.how-heading > p:not(.section-index) { max-width:365px; margin:1.4rem 0; color:#4a4b36; font-size:.93rem; }.how-heading > a { color:var(--ink); font-size:.84rem; font-weight:800; text-underline-offset:5px; }.how-heading > a:hover { color:var(--violet-dark); }
.steps-list { display:grid; gap:10px; margin:0; padding:0; list-style:none; }.steps-list li { display:grid; grid-template-columns:64px 1fr; gap:1rem; min-height:128px; padding:1.15rem; border:2px solid var(--ink); background:var(--paper); box-shadow:5px 5px 0 var(--ink); }.steps-list li > span { color:var(--violet-dark); font:700 1.9rem/1 var(--display); }.steps-list h3 { margin:0 0 .3rem; font:700 1.45rem/1.1 var(--display); letter-spacing:-.04em; }.steps-list p { margin:0; color:#5e5a61; font-size:.88rem; }
.site-footer { padding:3rem 0 1.3rem; background:var(--ink); color:var(--white); }.footer-main,.footer-bottom { display:flex; justify-content:space-between; align-items:start; gap:2rem; }.footer-brand { font-size:1.6rem; }.footer-main p { margin:.65rem 0 0; color:#bcb9c6; font-size:.85rem; }.footer-main > a { color:var(--lime); font-size:.83rem; font-weight:800; text-decoration:none; }.footer-main > a:hover { text-decoration:underline; }.footer-bottom { margin-top:3rem; padding-top:1rem; border-top:1px solid #5a5666; color:#bcb9c6; font-size:.73rem; font-weight:700; letter-spacing:.07em; }

body:not(.home-page) { background:var(--paper); }.breadcrumb-nav { padding:1.1rem 0; }.breadcrumb { margin:0; }.breadcrumb-item,.breadcrumb-item a { color:var(--muted); font-size:.82rem; text-decoration:none; }.breadcrumb-item a:hover { color:var(--violet-dark); }.breadcrumb-item.active { color:var(--ink); }
body:not(.home-page) .hero { position:relative; overflow:hidden; padding:4.2rem 0 4.5rem; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); background:var(--violet); color:var(--white); }
body:not(.home-page) .hero::before { content:'✦'; position:absolute; right:4%; top:-7rem; color:rgba(233,250,121,.19); font:700 25rem/1 var(--display); }.hero .container { position:relative; }
body:not(.home-page) .hero h1 { max-width:980px; margin:0 auto .7rem; font:700 clamp(2.9rem,4.8vw,4.8rem)/1 var(--display); letter-spacing:-.065em; }.hero .lead { max-width:630px; margin:0 auto; color:#f1ecff; font-size:1rem; }
.brand-logo { display:block; width:320px; height:140px; max-width:calc(100% - 2rem); max-height:none; margin:0 auto 1.6rem; padding:18px 22px; border:2px solid var(--ink); border-radius:6px; background:#fff; object-fit:contain; box-shadow:8px 8px 0 var(--lime); }.brand-amazon .brand-logo,.brand-shein .brand-logo,.brand-namshi .brand-logo { background:#1d273d; }
.coupons-section { padding:4rem 0 6rem; }.coupon-card { height:100%; padding:1.55rem; border:2px solid var(--ink); border-radius:6px; background:var(--white); box-shadow:6px 6px 0 #cab9ff; transition:transform .2s; }.coupon-card:hover { transform:translateY(-4px); }.coupon-title { min-height:50px; font:700 1.25rem/1.2 var(--display); letter-spacing:-.03em; }.coupon-code { display:inline-block; margin:1.2rem 0; padding:.65rem .85rem; border:2px dashed var(--violet-dark); background:#f1ebff; font:700 .95rem/1.2 ui-monospace,monospace; letter-spacing:.08em; }.btn-copy { display:block; width:100%; min-height:48px; padding:.7rem 1rem; border:2px solid var(--ink); border-radius:4px; background:var(--lime); color:var(--ink); font-size:.89rem; font-weight:900; cursor:pointer; }.btn-copy:hover { background:var(--pink); }.copied-msg { display:none; margin-top:.7rem; color:#286b42; font-size:.82rem; font-weight:800; }
body:not(.home-page) .site-footer { padding:2.2rem 1rem; text-align:center; }.site-footer .footer-brand { margin-bottom:.7rem; }body:not(.home-page) .site-footer p { margin:0; color:#bcb9c6; font-size:.82rem; }

@media(max-width:991.98px) { .navbar.site-nav .navbar-collapse { padding:.8rem 0 1.1rem; border-top:1px solid #5a5666; }.navbar.site-nav .nav-cta { display:inline-flex; margin:.5rem 0 0; }.hero-layout { grid-template-columns:1fr; }.hero-copy { min-height:560px; padding:4.5rem 0; }.hero-scene { min-height:590px; border-left:0; border-top:2px solid var(--ink); }.stores-intro { align-items:start; }.store-card { grid-template-columns:42px minmax(0,1fr) 240px 45px; }.store-logo { width:240px; }.how-layout { grid-template-columns:1fr; gap:2.5rem; } }
@media(max-width:767.98px) { :root { --nav-height:68px; }.navbar.site-nav .navbar-brand { font-size:1.3rem; }.navbar.site-nav .navbar-brand::before { width:33px; height:33px; }.hero-copy { min-height:auto; padding:4rem 0; }.hero-copy h1 { font-size:clamp(4rem,13vw,6rem); }.hero-bottom { margin-top:3.5rem; }.hero-scene { min-height:500px; }.wild-card { width:min(60%,300px); min-height:400px; box-shadow:12px 14px 0 var(--ink); }.card-center strong { font-size:clamp(2.6rem,8vw,4rem); }.scene-badge { width:110px; bottom:11%; padding:.7rem; font-size:.55rem; }.signal-inner { min-width:670px; }.stores-section,.how-section { padding:4.5rem 0; }.stores-intro { flex-direction:column; gap:1.4rem; }.stores-intro h2,.how-heading h2 { font-size:clamp(3.5rem,11vw,5.5rem); }.stores-side { width:100%; }.store-card { grid-template-columns:36px minmax(0,1fr) 42px; grid-template-rows:auto auto; gap:.6rem; min-height:0; padding:1rem; }.store-number { grid-column:1; grid-row:1; }.store-name { grid-column:2; grid-row:1; }.store-name strong { font-size:2rem; }.store-arrow { grid-column:3; grid-row:1; width:40px; height:40px; }.store-logo { grid-column:2/4; grid-row:2; width:100%; height:100px; }.store-logo img { height:76px; }.footer-bottom { flex-direction:column; gap:.5rem; } }
@media(max-width:430px) { .hero-actions { gap:1.1rem; }.hero-bottom { font-size:.55rem; }.wild-card { width:260px; }.store-name strong { font-size:1.65rem; }.store-card { grid-template-columns:30px minmax(0,1fr) 38px; }.store-arrow { width:36px; height:36px; font-size:1.2rem; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; } }