@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&display=swap');

:root{--sea:#082f30;--deep:#061e26;--ink:#173135;--cream:#faf5e9;--paper:#fffaf0;--muted:#58656a;--gold:#f0c75f;--line:#d8d6c6;color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans','Avenir Next',sans-serif;line-height:1.55}
img{display:block;max-width:100%}a{color:inherit}
.wrap,.top-inner{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.skip-link{position:absolute;z-index:20;top:-80px;left:16px;padding:10px 18px;background:var(--gold);color:var(--deep);font-weight:700}
.skip-link:focus{top:12px}
:focus-visible{outline:3px solid #ee765f;outline-offset:4px}

.top{position:relative;z-index:10;background:var(--paper);border-bottom:1px solid #ece3d0}
.top-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:88px}
.brand{display:block;width:168px;flex:none}.brand img{width:100%;height:auto}
.site-nav{display:flex;align-items:center;justify-content:center;gap:clamp(20px,3vw,42px);margin-left:auto}
.site-nav a{color:#24484a;font-size:.91rem;font-weight:700;text-decoration:none;transition:color .2s ease}
.site-nav a:hover{color:#b95543}
.nav-play{display:inline-flex;align-items:center;justify-content:center;gap:16px;flex:none;min-height:44px;padding:0 20px;border-radius:100px;background:var(--sea);color:var(--paper);font-size:.9rem;font-weight:700;text-decoration:none;transition:transform .2s ease,background .2s ease}
.nav-play:hover{transform:translateY(-2px);background:#145455}

.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 45% 10%,#145252 0,transparent 38%),linear-gradient(145deg,#0d4142 0%,var(--deep) 88%);color:var(--paper)}
.hero:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 70px,rgba(255,255,255,.015) 70px 71px);pointer-events:none}
.hero:after{content:'';position:absolute;right:-15vw;bottom:-400px;width:800px;height:800px;border:1px solid rgba(240,199,95,.15);border-radius:50%;pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:clamp(32px,4vw,64px);min-height:620px;padding-block:74px 80px}
.hero-copy{position:relative;z-index:2;padding-block:20px}
.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 20px;color:var(--gold);font-size:.7rem;font-weight:700;letter-spacing:.22em;line-height:1.3}
.eyebrow-line{display:inline-block;width:34px;height:1px;background:currentColor}
h1,h2,h3,p{margin-top:0}
h1,h2{font-family:Fraunces,Palatino,Georgia,serif;font-weight:600;letter-spacing:-.045em;line-height:1.06}
h1{margin-bottom:24px;font-size:clamp(3.5rem,5.3vw,5.75rem)}
h1 em,h2 em{color:var(--gold);font-weight:inherit}
.hero-lede{max-width:530px;margin-bottom:29px;color:#dcece8;font-size:clamp(1.05rem,1.4vw,1.18rem);line-height:1.65}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px 28px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:55px;padding:0 25px;border-radius:100px;font-weight:700;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.button:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(0,0,0,.2)}
.button-gold{background:var(--gold);color:#102b2d}
.button span,.nav-play span,.text-link span{font-size:1.25em;line-height:1}
.text-link{display:inline-flex;align-items:center;gap:12px;color:var(--paper);font-weight:700;text-decoration-color:var(--gold);text-underline-offset:7px;text-decoration-thickness:2px}
.text-link:hover{color:var(--gold)}
.hero-note{display:flex;align-items:center;gap:9px;margin:28px 0 0;color:#a8c8c4;font-size:.83rem}
.note-dot{width:7px;height:7px;border-radius:50%;background:#edbd58}
.hero-art{position:relative;min-width:0;height:485px;border:8px solid rgba(255,250,240,.95);border-radius:240px 240px 22px 22px;box-shadow:0 28px 60px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.2);isolation:isolate}
.hero-scene{width:100%;height:100%;border-radius:231px 231px 14px 14px;object-fit:cover;object-position:center}
.hero-art-shade{position:absolute;inset:0;z-index:1;border-radius:inherit;background:linear-gradient(180deg,transparent 55%,rgba(6,30,38,.63) 100%);pointer-events:none}
.hero-card{position:absolute;z-index:2;bottom:-32px;left:-48px;width:clamp(110px,11vw,160px);transform:rotate(-15deg);border:6px solid var(--paper);border-radius:13px;box-shadow:0 18px 32px rgba(0,0,0,.45)}
.hero-card img{width:100%;height:auto;border-radius:7px}
.hero-stamp{position:absolute;z-index:2;top:25px;right:-28px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100px;height:100px;border:1px solid #c28b53;border-radius:50%;background:var(--gold);color:#163839;font-size:.62rem;font-weight:800;letter-spacing:.13em;line-height:1.3;text-align:center;transform:rotate(11deg);box-shadow:0 8px 20px rgba(0,0,0,.22)}
.stamp-star{font-size:1.5rem;line-height:1.2}
.hero-art-caption{position:absolute;z-index:2;right:23px;bottom:12px;margin:0;color:var(--paper);font-family:Fraunces,Georgia,serif;font-size:1rem;font-style:italic;text-shadow:0 2px 8px #092b2d}
.hero-art-caption span{color:var(--gold)}

.rule-strip{background:var(--gold);color:#203738}
.rule-strip-inner{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(16px,3vw,38px);min-height:66px;padding-block:14px}
.rule-strip span{font-size:.83rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.rule-strip b{margin-right:12px;font-size:.75rem;opacity:.56}.rule-strip i{font-style:normal;font-size:.85rem}
.section-pad{padding-block:clamp(78px,9vw,132px)}
.how{background:var(--paper)}
.how-grid,.personal-grid,.friends-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(50px,7vw,110px)}
.eyebrow-dark{color:#bd6548}
h2{margin-bottom:21px;font-size:clamp(2.7rem,4.4vw,4.65rem)}
.how h2 em,.friends h2 em{color:#d46f56}
.section-lede{max-width:520px;margin-bottom:32px;color:var(--muted);font-size:1.08rem;line-height:1.7}
.steps{max-width:560px;border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:44px 1fr;gap:17px;padding:22px 0;border-bottom:1px solid var(--line)}
.step-number{padding-top:2px;color:#bc7652;font-family:Fraunces,Georgia,serif;font-size:1.1rem;font-weight:700}
.step h3{margin:0 0 4px;font-size:1.08rem;line-height:1.35}
.step p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.55}
.play-illustration{position:relative;min-width:0;padding-bottom:35px}
.felt-frame{padding:16px;border:10px solid #985b34;border-radius:45% / 20%;background:#b77944;box-shadow:inset 0 0 0 3px rgba(255,236,183,.4),0 35px 45px rgba(47,38,27,.2);transform:rotate(4deg)}
.felt-inner{position:relative;aspect-ratio:1.17;overflow:hidden;border:2px solid #d2ac67;border-radius:45% / 20%;background:radial-gradient(circle at 50% 40%,#157462 0,#075044 62%,#063d38 100%);box-shadow:inset 0 0 35px rgba(0,0,0,.37)}
.felt-inner:before{content:'';position:absolute;inset:18px;border:1px solid rgba(244,214,151,.45);border-radius:inherit}
.felt-label{position:absolute;top:11%;left:0;width:100%;color:#e2ca8e;font-size:.64rem;font-weight:700;letter-spacing:.24em;text-align:center}
.playing-card{position:absolute;top:31%;left:40%;width:27%;aspect-ratio:2 / 3;border:4px solid #f9f1dd;border-radius:11px;background:#fffdfa;box-shadow:0 11px 20px rgba(0,0,0,.34)}
.card-back{left:25%;transform:rotate(-25deg);overflow:hidden}.card-back img{width:100%;height:100%;object-fit:cover}
.card-heart{left:37%;z-index:2;color:#ca4b4b;transform:rotate(-3deg)}
.card-spade{left:49%;z-index:3;color:#173742;transform:rotate(17deg)}
.card-corner{position:absolute;top:7%;left:11%;font-family:Georgia,serif;font-size:clamp(.8rem,2vw,1.6rem);font-weight:700;line-height:.85;text-align:center}
.corner-bottom{top:auto;right:11%;bottom:7%;left:auto;transform:rotate(180deg)}
.card-suit{position:absolute;top:50%;left:50%;font-size:clamp(2.9rem,7vw,6.2rem);line-height:1;transform:translate(-50%,-50%)}
.felt-flourish{position:absolute;right:15%;bottom:14%;color:#e4bc6f;font-size:1.7rem}
.illustration-caption{position:absolute;right:2%;bottom:0;color:#aa714a;font-family:Fraunces,Georgia,serif;font-size:1.04rem;font-style:italic}

.personal{position:relative;overflow:hidden;background:radial-gradient(circle at 2% 100%,#185d5c 0,transparent 38%),linear-gradient(135deg,#073b3b,#061f29);color:var(--paper)}
.personal:before{content:'✦';position:absolute;right:2%;top:-150px;color:rgba(240,199,95,.06);font-size:34rem;line-height:1}
.personal-grid{position:relative;z-index:1}
.personal-art{position:relative;min-width:0;padding:15px 35px 15px 0}
.personal-art-frame{overflow:hidden;border:8px solid #d6b779;border-radius:160px 160px 20px 20px;background:#1e1d20;box-shadow:0 28px 50px rgba(0,0,0,.3)}
.personal-art-frame img{width:100%;height:auto;aspect-ratio:1 / 1;object-fit:cover;object-position:center}
.art-seal{position:absolute;right:0;bottom:-9px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:125px;height:125px;border:2px solid #d1ab62;border-radius:50%;background:var(--paper);color:#164142;font-family:Fraunces,Georgia,serif;font-size:1.1rem;font-weight:700;line-height:1.1;text-align:center;transform:rotate(12deg);box-shadow:0 10px 22px rgba(0,0,0,.3)}
.art-seal span{margin-top:6px;color:#d58954}
.personal .section-lede{color:#d5e6e2}
.personal-points{display:grid;gap:16px;margin:34px 0 32px}
.personal-points>div{display:grid;grid-template-columns:29px 1fr;gap:14px;align-items:start}
.point-icon{display:flex;align-items:center;justify-content:center;width:29px;height:29px;border:1px solid #d2ae61;border-radius:50%;color:var(--gold);font-size:.8rem}
.personal-points p{margin:0;color:#cfdfdc}.personal-points strong{color:#fff9ea}.text-link-light{color:var(--gold)}

.friends{background:#f7efe0}.friends-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.friends h2{max-width:560px}
.platform-note{display:grid;grid-template-columns:40px 1fr;gap:15px;max-width:430px;padding:19px 20px;border:1px solid #e2ccac;border-radius:16px;background:var(--paper)}
.platform-note>span{color:#cd7852;font-size:1.4rem}.platform-note strong{display:block;margin-bottom:3px}
.platform-note p{margin:0;color:var(--muted);font-size:.93rem}
.friends-art{position:relative;width:min(100%,530px);height:500px;justify-self:end;overflow:hidden;border-radius:220px 220px 20px 20px;box-shadow:0 25px 45px rgba(63,46,28,.2)}
.friends-art img{width:100%;height:100%;object-fit:cover;object-position:center 36%}
.friends-photo-note{position:absolute;right:0;bottom:0;left:0;display:flex;justify-content:space-between;padding:17px 24px;background:rgba(8,47,48,.93);color:#fff7e8;font-size:.72rem;font-weight:800;letter-spacing:.18em}
.friends-photo-note span{color:var(--gold);font-size:1.2rem;line-height:.8}

.closing{position:relative;overflow:hidden;padding:90px 0 100px;background:var(--deep);color:var(--paper);text-align:center}
.closing:before,.closing:after{content:'✦';position:absolute;top:0;color:rgba(240,199,95,.1);font-size:20rem;line-height:1}
.closing:before{left:-70px}.closing:after{right:-70px}.closing-inner{position:relative;z-index:1}
.closing .eyebrow{justify-content:center}.closing h2{margin-bottom:15px}
.closing p:not(.eyebrow){margin-bottom:27px;color:#cadbd9;font-size:1.06rem}
.footer{background:#04181f;color:#a8c4c1}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:82px;font-size:.88rem}
.footer a{text-decoration:none}.footer a:hover{color:var(--gold)}
.footer-brand{color:#fff5dd;font-family:Fraunces,Georgia,serif;font-size:1.23rem;font-weight:700}.footer-brand span{color:var(--gold)}

/* Privacy page */
.doc{min-height:calc(100vh - 88px);padding:55px 0 90px;background:var(--paper)}
.doc .wrap{width:min(740px,calc(100% - 48px))}
.doc .kicker{margin:0 0 14px;color:#b8644c;font-size:.72rem;font-weight:800;letter-spacing:.18em}
.doc h1{margin-bottom:10px;color:var(--ink);font-size:clamp(2.7rem,5vw,4rem)}
.doc h2{margin:1.8em 0 .5em;font-size:1.5rem;letter-spacing:-.02em}
.doc p,.doc li{color:#435458}.doc ul{padding-left:1.3rem}.doc a{color:#9f542d;font-weight:700}
.doc .updated{color:#748080;font-size:.91rem}.top .nav{color:var(--sea);font-weight:700;text-underline-offset:4px}

@media(max-width:1050px){.hero-grid{gap:28px}.hero-art{height:430px}.hero-stamp{right:-12px}.hero-card{left:-20px}.site-nav{gap:18px}}
@media(max-width:800px){
  .top-inner{min-height:78px}.brand{width:146px}.site-nav{display:none}
  .hero-grid{grid-template-columns:1fr;gap:40px;padding-block:74px 80px}.hero-copy{padding:0}
  .hero-art{width:min(100%,630px);height:460px;margin-inline:auto}
  .how-grid,.personal-grid,.friends-grid{grid-template-columns:1fr}
  .play-illustration{width:min(100%,580px);margin-inline:auto}
  .personal-art{width:min(100%,550px);order:2;margin-inline:auto}
  .friends-art{width:min(100%,530px);justify-self:center}
}
@media(max-width:600px){
  .wrap,.top-inner{width:min(100% - 36px,1180px)}.top-inner{min-height:70px;gap:14px}.brand{width:133px}
  .nav-play{min-height:39px;padding:0 14px;gap:8px;font-size:.79rem}
  .hero-grid{padding-block:54px 66px}h1{font-size:clamp(3rem,12vw,4.5rem)}h2{font-size:clamp(2.45rem,10vw,3.5rem)}
  .hero-lede{font-size:1rem}.hero-actions{align-items:flex-start;flex-direction:column}.button{min-height:52px;gap:15px;padding-inline:21px;font-size:.9rem}
  .hero-art{height:330px;border-width:5px;border-radius:150px 150px 15px 15px}.hero-scene{border-radius:146px 146px 10px 10px}
  .hero-card{bottom:-22px;left:-9px;width:95px;border-width:4px}.hero-stamp{top:15px;right:-5px;width:75px;height:75px;font-size:.47rem}
  .stamp-star{font-size:1.1rem}.hero-art-caption{right:13px;bottom:10px;font-size:.8rem}
  .rule-strip-inner{gap:7px 18px;justify-content:space-between}.rule-strip i{display:none}.rule-strip span{font-size:.69rem}.rule-strip b{margin-right:5px}
  .section-pad{padding-block:74px}.how-grid,.personal-grid,.friends-grid{gap:48px}
  .felt-frame{padding:9px;border-width:7px}.felt-label{font-size:.5rem}.playing-card{border-width:3px;border-radius:7px}
  .personal-art{padding-right:20px}.art-seal{width:90px;height:90px;font-size:.8rem}.friends-art{height:400px}
  .closing{padding:74px 0 84px}.footer-inner{flex-wrap:wrap;justify-content:space-between;padding-block:24px}.footer-inner>span{order:3;width:100%}
}
@media(max-width:390px){.brand{width:120px}.rule-strip-inner{justify-content:center}.rule-strip span{font-size:.65rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Dedicated how-to-play guide */
.how-full-link{display:inline-flex;align-items:center;gap:12px;margin-top:25px;color:#a7503b;font-weight:700;text-decoration-color:#c77a57;text-underline-offset:6px;text-decoration-thickness:2px}
.how-full-link:hover{color:#743c2d}
.footer-links{display:flex;gap:24px}
.guide-page{overflow:hidden}
.guide-page section[id]{scroll-margin-top:85px}
.guide-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 76% 45%,#17625a 0,transparent 35%),linear-gradient(135deg,#0c4442,var(--deep));color:var(--paper)}
.guide-hero:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 70px,rgba(255,255,255,.016) 70px 71px)}
.guide-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:center;gap:70px;min-height:540px;padding-block:82px}
.guide-hero h1{margin-bottom:23px;font-size:clamp(3.6rem,5.6vw,5.9rem)}
.guide-hero-copy{max-width:610px;margin-bottom:30px;color:#d3e9e4;font-size:1.15rem;line-height:1.68}
.guide-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px 32px}
.guide-hero-art{position:relative;height:370px}
.guide-hero-ring{position:absolute;inset:6% 3% 0;border:1px solid rgba(240,199,95,.38);border-radius:50%;box-shadow:0 0 0 23px rgba(240,199,95,.03),0 0 0 48px rgba(240,199,95,.025)}
.guide-deck,.guide-hero-face{position:absolute;width:176px;height:264px;border:7px solid #fff9e9;border-radius:16px;box-shadow:0 24px 34px rgba(0,0,0,.36)}
.guide-deck{top:57px;left:11%;transform:rotate(-20deg);overflow:hidden;background:#fff9e9}
.guide-deck img{width:100%;height:100%;object-fit:cover}
.guide-hero-face{top:68px;left:38%;display:flex;align-items:center;justify-content:center;background:#fffdf8;color:#c74d4b;transform:rotate(3deg)}
.guide-hero-king{top:85px;left:64%;color:#173742;transform:rotate(21deg)}
.guide-hero-face span{position:absolute;top:9%;left:10%;font-family:Georgia,serif;font-size:2.1rem;font-weight:700;line-height:.85;text-align:center}
.guide-hero-face span:last-child{top:auto;right:10%;bottom:9%;left:auto;transform:rotate(180deg)}
.guide-hero-face b{font-size:7rem;font-weight:400;line-height:1}
.guide-hero-spark{position:absolute;color:var(--gold);font-size:2.1rem}
.guide-spark-one{top:0;right:3%}.guide-spark-two{bottom:5%;left:17%;font-size:1.25rem}
.guide-subnav{position:sticky;top:0;z-index:8;border-bottom:1px solid #e7d8ba;background:rgba(255,250,240,.97);backdrop-filter:blur(12px)}
.guide-subnav-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:64px}
.guide-subnav-inner>span{color:#ac6749;font-size:.71rem;font-weight:800;letter-spacing:.16em;white-space:nowrap}
.guide-subnav a{color:#526568;font-size:.85rem;text-decoration:none;white-space:nowrap}
.guide-subnav a b{margin-left:5px;color:#1c4141;font-weight:700}
.guide-subnav a:hover b{color:#b75e43}
.practice-invite{background:#f5e7c5}
.practice-invite-inner{display:grid;grid-template-columns:95px minmax(0,1fr) auto;align-items:center;gap:24px;padding-block:34px}
.practice-icon{position:relative;display:flex;align-items:center;justify-content:center;width:78px;height:78px;border:2px solid #bd8046;border-radius:18px;background:#fff9e8;color:#153c3f;font-family:Georgia,serif;font-size:2.8rem;transform:rotate(-8deg);box-shadow:6px 6px 0 rgba(141,89,43,.15)}
.practice-icon span{position:absolute;right:11px;bottom:8px;color:#c65951;font-size:1rem}
.practice-invite .eyebrow{margin-bottom:5px}
.practice-invite h2{margin-bottom:5px;font-size:1.7rem;letter-spacing:-.02em}
.practice-invite p:not(.eyebrow){max-width:650px;margin:0;color:#5c5547;font-size:.94rem}
.button-dark{background:var(--sea);color:var(--paper);white-space:nowrap}
.button-dark:hover{background:#145455}

.guide-section{padding-block:100px}
.guide-section-heading{max-width:750px;margin-bottom:45px}
.guide-section-heading h2{margin-bottom:17px}
.guide-section-heading h2 em,.rules-section h2 em,.terms-section h2 em{color:#c97558}
.guide-section-heading>p:last-child{max-width:650px;margin:0;color:var(--muted);font-size:1.06rem;line-height:1.68}
.first-hand{background:var(--paper)}
.lesson-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.lesson-card{min-width:0;padding:24px;border:1px solid #e3d5be;border-radius:22px;background:#fffdf7;box-shadow:0 10px 22px rgba(66,53,34,.04)}
.lesson-top{display:flex;align-items:center;justify-content:space-between;color:#a06446;font-size:.71rem;font-weight:800;letter-spacing:.15em}
.lesson-top>span:last-child{color:#d3aa62;font-size:1.2rem;line-height:1}
.lesson-scene{display:flex;align-items:center;justify-content:center;gap:15px;height:195px;margin:20px 0 21px;overflow:hidden;border:1px solid #285b52;border-radius:16px;background:radial-gradient(circle at center,#176b59,#06463d 72%,#093c38);box-shadow:inset 0 0 25px rgba(0,0,0,.22)}
.demo-card{position:relative;display:flex;align-items:center;justify-content:center;width:78px;height:116px;flex:none;border:4px solid #fff8e8;border-radius:8px;background:#fffdf8;box-shadow:0 9px 15px rgba(0,0,0,.3)}
.demo-back{overflow:hidden}.demo-back img{width:100%;height:100%;object-fit:cover}
.demo-face{color:#153b43;font-family:Georgia,serif}
.demo-red{color:#c84f4f}
.demo-face span{position:absolute;top:7%;left:10%;font-size:1.1rem;font-weight:700;line-height:.8;text-align:center}
.demo-face span:last-child{top:auto;right:10%;bottom:7%;left:auto;transform:rotate(180deg)}
.demo-face b{font-size:3.5rem;font-weight:400;line-height:1}
.demo-arrow{color:#edc66f;font-size:1.8rem;font-weight:700}
.follow-scene .demo-card:first-child{transform:rotate(-9deg)}
.follow-scene .winner{margin-left:-12px;transform:rotate(8deg)}
.draw-scene{gap:9px}.draw-scene .demo-card{width:64px;height:97px}.draw-scene .demo-face b{font-size:2.7rem}.draw-scene .demo-face span{font-size:.9rem}
.draw-scene .demo-arrow{font-size:1.45rem}
.pass-scene{gap:25px}.empty-pack-demo{display:flex;align-items:center;justify-content:center;width:78px;height:116px;border:2px dashed #f0d08c;border-radius:8px;color:#f3d89f;font-size:.77rem;font-weight:800;letter-spacing:.13em;text-align:center}
.pass-pill{padding:10px 18px;border:1px solid #edc66f;border-radius:100px;background:#f0c75f;color:#193e3d;font-size:.85rem;font-weight:800;letter-spacing:.1em}
.lesson-card h3{margin-bottom:7px;font-family:Fraunces,Georgia,serif;font-size:1.38rem;letter-spacing:-.025em}
.lesson-card p{margin:0;color:#526064;font-size:.95rem;line-height:1.65}
.no-trump-note{display:grid;grid-template-columns:65px 1fr;gap:20px;align-items:center;margin-top:25px;padding:25px 30px;border:1px solid #e1c48b;border-radius:20px;background:#fff3d5}
.no-trump-symbol{display:flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:50%;background:#f0c75f;color:#164443;font-family:Georgia,serif;font-size:2.2rem}
.no-trump-note h3{margin-bottom:4px;font-family:Fraunces,Georgia,serif;font-size:1.45rem}.no-trump-note p{margin:0;color:#5c5547}

.scoring-section{background:radial-gradient(circle at right bottom,#185956,transparent 42%),linear-gradient(135deg,#0b3739,#071f29);color:var(--paper)}
.scoring-section .guide-section-heading>p:last-child{color:#d0e2df}.scoring-section .guide-section-heading h2 em{color:var(--gold)}
.score-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.score-card{padding:31px;border:1px solid rgba(240,199,95,.38);border-radius:22px;background:rgba(255,250,240,.07)}
.score-card-label{color:var(--gold);font-size:.72rem;font-weight:800;letter-spacing:.17em}
.score-example{display:flex;align-items:baseline;gap:clamp(8px,1.7vw,23px);min-height:95px;margin-top:25px;font-family:Fraunces,Georgia,serif;font-size:clamp(2.5rem,4vw,4.3rem);line-height:1}
.score-example i{color:#b7cbc8;font-style:normal;font-size:.7em}
.score-example strong{color:var(--gold);font-weight:700}.score-example small{color:#c1d8d3;font-family:'DM Sans',sans-serif;font-size:.28em;font-weight:700}
.score-card h3{margin:10px 0 7px;font-size:1.15rem}.score-card p{max-width:480px;margin:0;color:#cadbd7;line-height:1.65}

.rules-section{background:#f7efe0}
.rules-grid,.terms-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(45px,7vw,110px);align-items:start}
.rule-cards{display:grid;gap:14px}
.rule-cards article{display:grid;grid-template-columns:40px 1fr;gap:15px;padding:23px;border:1px solid #e4d2b6;border-radius:18px;background:var(--paper)}
.rule-mark{display:flex;align-items:center;justify-content:center;width:37px;height:37px;border-radius:50%;background:#f1d184;color:#194341;font-size:1.1rem}
.rule-cards h3{margin-bottom:4px;font-family:Fraunces,Georgia,serif;font-size:1.3rem}
.rule-cards p{margin:0;color:#536063;font-size:.94rem;line-height:1.6}
.terms-section{background:var(--paper)}
.terms-list{border-top:1px solid #d9d2bf}
.terms-list details{border-bottom:1px solid #d9d2bf}
.terms-list summary{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:13px 4px;cursor:pointer;color:#1d3a3e;font-weight:700;list-style:none}
.terms-list summary::-webkit-details-marker{display:none}
.terms-list summary:after{content:'+';display:flex;align-items:center;justify-content:center;width:25px;height:25px;border:1px solid #ccb892;border-radius:50%;color:#a45d3e;font-size:1.15rem;font-weight:500;line-height:1}
.terms-list details[open] summary:after{content:'−'}
.terms-list details p{max-width:580px;margin:0;padding:0 35px 18px 4px;color:#536063;font-size:.95rem;line-height:1.6}
.terms-list details[open] summary{color:#af583e}
.guide-closing{padding-block:84px}

@media(max-width:1050px){
  .guide-hero-grid{gap:25px}.guide-deck,.guide-hero-face{width:140px;height:210px}.guide-hero-face b{font-size:5.5rem}.guide-hero-face span{font-size:1.6rem}
  .practice-invite-inner{grid-template-columns:75px 1fr}.practice-invite .button{grid-column:2;justify-self:start}
}
@media(max-width:800px){
  .guide-hero-grid{grid-template-columns:1fr;gap:20px;padding-block:70px 50px}.guide-hero-art{width:min(100%,520px);height:290px;margin-inline:auto}
  .guide-deck,.guide-hero-face{top:30px;width:150px;height:225px}.guide-hero-king{top:45px}
  .guide-subnav-inner{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}.guide-subnav-inner::-webkit-scrollbar{display:none}.guide-subnav-inner>span{display:none}
  .rules-grid,.terms-grid{grid-template-columns:1fr;gap:30px}
}
@media(max-width:600px){
  .footer-links{gap:18px}
  .guide-hero-grid{padding-block:55px 40px}.guide-hero h1{font-size:clamp(3rem,11vw,4.5rem)}.guide-hero-copy{font-size:1rem}
  .guide-hero-actions{align-items:flex-start;flex-direction:column}
  .guide-hero-art{height:220px}.guide-deck,.guide-hero-face{top:21px;width:107px;height:161px;border-width:5px;border-radius:10px}
  .guide-deck{left:8%}.guide-hero-face{left:37%}.guide-hero-king{top:29px;left:63%}
  .guide-hero-face b{font-size:4.1rem}.guide-hero-face span{font-size:1.1rem}
  .guide-subnav-inner{min-height:53px;gap:22px}.guide-subnav a{font-size:.76rem}
  .practice-invite-inner{grid-template-columns:55px 1fr;gap:14px;padding-block:27px}.practice-icon{width:50px;height:50px;border-radius:12px;font-size:1.8rem}
  .practice-icon span{right:6px;bottom:4px;font-size:.75rem}.practice-invite h2{font-size:1.4rem}.practice-invite p:not(.eyebrow){font-size:.87rem}
  .practice-invite .button{grid-column:1 / -1}
  .guide-section{padding-block:70px}.guide-section-heading{margin-bottom:30px}
  .lesson-grid,.score-grid{grid-template-columns:1fr}.lesson-card{padding:19px}.lesson-scene{height:180px}
  .no-trump-note{grid-template-columns:46px 1fr;gap:14px;padding:18px}.no-trump-symbol{width:45px;height:45px;font-size:1.6rem}
  .score-card{padding:24px}.score-example{min-height:78px}
  .rule-cards article{padding:18px}
}
@media(max-width:380px){.draw-scene{gap:4px}.draw-scene .demo-card{width:54px;height:82px}.draw-scene .demo-arrow{font-size:1.2rem}}
@media(max-width:460px){
  .guide-subnav-inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 12px;min-height:0;padding-block:10px;overflow:visible}
  .guide-subnav a{font-size:.74rem}
}

/* About GoPack */
.top-inner{min-height:104px}
.brand{width:156px}
.site-nav a[aria-current="page"],.footer-links a[aria-current="page"]{color:#ae5f40}
.about-page{overflow:hidden}
.about-pad{padding-block:clamp(80px,9vw,128px)}
.about-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 65% 20%,#195c55 0,transparent 38%),linear-gradient(140deg,#0d4141,var(--deep) 90%);color:var(--paper)}
.about-hero:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 72px,rgba(255,255,255,.016) 72px 73px);pointer-events:none}
.about-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:clamp(45px,6vw,85px);min-height:620px;padding-block:76px}
.about-hero-copy{position:relative;z-index:1}
.about-hero h1{font-size:clamp(3.5rem,5.2vw,5.55rem)}
.about-hero-copy>p:not(.eyebrow){max-width:550px;margin-bottom:30px;color:#d6e8e4;font-size:1.12rem;line-height:1.7}
.about-hero-actions,.about-final-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px 30px}
.about-logo-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:450px;overflow:hidden;border:8px solid #ebd8ac;border-radius:230px 230px 22px 22px;background:linear-gradient(rgba(4,31,37,.42),rgba(4,31,37,.74)),url('/media/caribbean-table.webp') center / cover;box-shadow:0 30px 45px rgba(0,0,0,.28)}
.about-logo-stage:after{content:'';position:absolute;inset:16px;border:1px solid rgba(255,229,171,.5);border-radius:inherit;pointer-events:none}
.about-logo-sun{position:absolute;width:330px;height:330px;border:1px solid rgba(240,199,95,.42);border-radius:50%;box-shadow:0 0 0 35px rgba(240,199,95,.06),0 0 0 70px rgba(240,199,95,.035)}
.about-logo-stage img{position:relative;z-index:1;width:90%;height:auto;filter:drop-shadow(0 15px 18px rgba(0,0,0,.6))}
.about-logo-caption{position:absolute;z-index:1;bottom:24px;left:0;width:100%;color:#ffe7a5;font-size:.73rem;font-weight:800;letter-spacing:.19em;text-align:center;text-shadow:0 2px 8px #062c2f}
.about-marquee{background:var(--gold);color:#193b3c}
.about-marquee-inner{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(19px,3vw,45px);min-height:67px;padding-block:13px}
.about-marquee span{font-size:.82rem;font-weight:800;letter-spacing:.11em;white-space:nowrap}.about-marquee i{font-size:.9rem;font-style:normal}
.about-story{background:var(--paper)}
.about-story-grid,.about-style-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(55px,7vw,100px)}
.about-story-art{min-width:0;padding:20px}
.about-felt{padding:15px;border:12px solid #9d633a;border-radius:43% / 18%;background:#b77c49;box-shadow:0 25px 38px rgba(61,42,22,.17),inset 0 0 0 2px #e4bc79;transform:rotate(-3deg)}
.about-felt-inner{position:relative;aspect-ratio:1.15;overflow:hidden;border:2px solid #d0ad69;border-radius:43% / 18%;background:radial-gradient(circle at 50% 45%,#176f5e,#074d42 70%,#053c39);box-shadow:inset 0 0 30px rgba(0,0,0,.32)}
.about-felt-inner:before{content:'';position:absolute;inset:16px;border:1px solid rgba(238,211,159,.55);border-radius:inherit}
.about-felt-caption{position:absolute;top:11%;left:0;width:100%;color:#e8c78c;font-size:.65rem;font-weight:800;letter-spacing:.21em;text-align:center}
.about-card-back,.about-card-face{position:absolute;top:31%;left:22%;width:28%;height:48%;border:5px solid #fff8e7;border-radius:10px;box-shadow:0 15px 20px rgba(0,0,0,.38)}
.about-card-back{object-fit:cover;transform:rotate(-20deg)}
.about-card-face{display:flex;align-items:center;justify-content:center;background:#fffdfa;color:#c74d4b;transform:rotate(-2deg)}
.about-card-face small{position:absolute;top:7%;left:9%;font-family:Georgia,serif;font-size:1.5rem;font-weight:700;line-height:.8;text-align:center}
.about-card-face b{font-family:Georgia,serif;font-size:clamp(3rem,7vw,6rem);font-weight:400}
.about-heart{left:38%}.about-king{left:53%;transform:rotate(15deg)}
.about-story h2 em,.about-style h2 em{color:#c97558}
.about-story .section-lede{margin-bottom:18px}
.about-ways{background:radial-gradient(circle at right bottom,#185955,transparent 43%),linear-gradient(135deg,#0c3a3a,#061f29);color:var(--paper)}
.about-heading{max-width:800px;margin-bottom:40px}
.about-heading h2 em{color:var(--gold)}
.about-heading>p:last-child{max-width:640px;margin:0;color:#d2e3df;font-size:1.08rem}
.about-ways-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:21px}
.about-way{position:relative;display:flex;flex-direction:column;min-height:360px;padding:32px;border:1px solid rgba(239,201,119,.45);border-radius:22px;background:rgba(255,250,240,.07)}
.about-way-browser{background:rgba(255,250,240,.1)}
.about-way-index{color:var(--gold);font-size:.7rem;font-weight:800;letter-spacing:.16em}
.about-way-symbol{position:absolute;top:22px;right:30px;color:rgba(240,199,95,.45);font-family:Georgia,serif;font-size:4.7rem;line-height:1}
.about-way h3{margin:70px 0 10px;font-family:Fraunces,Georgia,serif;font-size:2rem;letter-spacing:-.03em}
.about-way p{max-width:490px;margin:0 0 25px;color:#d2e4df;font-size:1rem;line-height:1.65}
.about-way a{display:inline-flex;gap:15px;align-items:center;margin-top:auto;color:var(--gold);font-weight:700;text-underline-offset:6px}
.about-way-note{margin-top:auto;color:#a8c5bf;font-size:.67rem;font-weight:800;letter-spacing:.13em}
.about-style{background:#f7efe0}
.about-style-note{display:flex;align-items:flex-start;gap:14px;max-width:540px;margin:0;padding:18px 20px;border:1px solid #dfcaab;border-radius:16px;background:var(--paper);color:#4e5d5f;font-size:.94rem}
.about-style-note span{color:#bb7051;font-size:1.1rem;line-height:1.2}
.about-style-art{overflow:hidden;border:9px solid #d8b87d;border-radius:170px 170px 20px 20px;box-shadow:0 25px 42px rgba(61,42,22,.19)}
.about-style-art img{width:100%;height:auto;aspect-ratio:1.13;object-fit:cover}
.about-final{position:relative;overflow:hidden;padding-block:100px;background:var(--deep);color:var(--paper);text-align:center}
.about-final-scene{position:absolute;inset:0;background:linear-gradient(rgba(4,26,32,.76),rgba(4,26,32,.83)),url('/media/caribbean-table.webp') center 40% / cover;opacity:.9}
.about-final-inner{position:relative;z-index:1}
.about-final .eyebrow{justify-content:center}
.about-final h2{font-size:clamp(3rem,5vw,5rem)}
.about-final h2 em{color:var(--gold)}
.about-final p:not(.eyebrow){max-width:600px;margin:0 auto 29px;color:#e1ece7;font-size:1.08rem}
.about-final-actions{justify-content:center}
@media(max-width:1050px){
  .about-hero-grid{gap:30px}.about-logo-stage{min-height:390px}
}
@media(max-width:800px){
  .top-inner{min-height:84px}.brand{width:130px}
  .about-hero-grid{grid-template-columns:1fr;gap:35px;padding-block:67px}.about-logo-stage{width:min(100%,620px);min-height:390px;margin-inline:auto}
  .about-story-grid,.about-style-grid{grid-template-columns:1fr}
  .about-story-art{width:min(100%,600px);margin-inline:auto;order:2}
  .about-style-art{width:min(100%,600px);margin-inline:auto}
}
@media(max-width:600px){
  .top-inner{min-height:74px}.brand{width:116px}
  .about-pad{padding-block:74px}.about-hero-grid{padding-block:55px 65px}
  .about-hero h1{font-size:clamp(3rem,11.5vw,4.4rem)}.about-hero-copy>p:not(.eyebrow){font-size:1rem}
  .about-hero-actions{align-items:flex-start;flex-direction:column}
  .about-logo-stage{min-height:300px;border-width:5px;border-radius:180px 180px 16px 16px}
  .about-logo-caption{bottom:18px;font-size:.58rem}
  .about-marquee-inner{gap:7px 15px}.about-marquee span{font-size:.67rem}.about-marquee i{display:none}
  .about-story-art{padding:0}.about-felt{padding:9px;border-width:7px}.about-felt-caption{font-size:.5rem}
  .about-card-back,.about-card-face{border-width:3px;border-radius:7px}.about-card-face small{font-size:1rem}
  .about-ways-grid{grid-template-columns:1fr}.about-way{min-height:310px;padding:25px}.about-way h3{margin-top:58px;font-size:1.7rem}
  .about-style-art{border-width:6px;border-radius:130px 130px 16px 16px}
  .about-final{padding-block:78px}.about-final-actions{flex-direction:column}
}
@media(max-width:390px){.brand{width:108px}.about-marquee-inner{justify-content:space-around}}