section[id],[id]{scroll-margin-top:84px}
.mnav{display:none;margin-left:auto}
.mnav summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--ink);padding:8px 14px;border:1.5px solid var(--line);border-radius:999px;background:var(--paper)}
.mnav summary::-webkit-details-marker{display:none}
.mnav .bars{display:inline-flex;flex-direction:column;gap:3px}.mnav .bars i{display:block;width:16px;height:2px;background:var(--ink);border-radius:2px}
.mnav[open] summary{background:var(--cream);border-color:var(--tomato);color:var(--tomato)}
.mpanel{position:absolute;left:0;right:0;top:68px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 16px 30px rgba(43,33,24,.14);padding:8px 20px 22px;max-height:calc(100vh - 68px);overflow-y:auto}
.mpanel .mh{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--tomato);margin:16px 0 8px}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mgrid a{display:flex;align-items:center;gap:8px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);font-size:14px;font-weight:600;line-height:1.25;background:var(--cream)}
.mgrid a span{font-size:20px;flex:none}
.mwhole{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;margin-top:18px;padding:12px 14px;border:1.5px solid var(--ink);border-radius:12px;text-decoration:none;color:var(--ink);font-weight:700;font-size:15px;background:var(--paper)}.mwhole span{grid-row:span 2;font-size:24px}.mwhole small{font-weight:500;color:var(--muted);font-size:13px}
.mabout{display:block;margin-top:10px;padding:13px;text-align:center;border-radius:12px;background:var(--tomato);color:#fff;text-decoration:none;font-weight:600}
@media(max-width:900px){.mnav{display:block}header.site .wrap{position:static}}

:root{--cream:#FBF6EE;--paper:#FFFDF9;--ink:#2B2118;--muted:#6E6157;--line:#E8DDCF;--tomato:#D9472B;--tomato-d:#B23A22;--mustard:#E9A23B;--sage:#6B8F71;--r:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:17px/1.6 "Inter",system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:"Fraunces",Georgia,serif;line-height:1.15;letter-spacing:-.01em}
a{color:inherit}img{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
header.site{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
header.site .wrap{display:flex;align-items:center;gap:24px;height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:"Fraunces",Georgia,serif;font-weight:700;font-size:22px}
.logo .mark{width:34px;height:42px;border-radius:6px;background:var(--tomato);color:#fff;display:grid;place-items:center;font-size:18px;transform:rotate(-6deg);box-shadow:4px 3px 0 var(--mustard)}
nav.main{display:flex;gap:18px;margin-left:auto;font-size:15px;font-weight:500}
nav.main a{text-decoration:none;color:var(--muted)}nav.main a:hover{color:var(--tomato)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--tomato);color:#fff;border:0;border-radius:999px;padding:12px 22px;font:600 15px/1 inherit;font-family:inherit;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--tomato-d)}.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.hero{padding:64px 0 40px;overflow:hidden}.hero .wrap>*{min-width:0}body{overflow-x:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(38px,5vw,62px);margin:0 0 16px}
.hero h1 em{color:var(--tomato);font-style:italic}
.hero p.lead{font-size:19px;color:var(--muted);max-width:520px;margin:0 0 26px}
.search{display:flex;background:var(--paper);border:1.5px solid var(--ink);border-radius:999px;padding:6px;max-width:520px}
.search input{flex:1;border:0;background:transparent;font:inherit;padding:8px 16px;outline:none;min-width:0}
.fan{position:relative;height:340px}
.fan .pc{position:absolute;left:50%;top:20px;width:200px;height:280px;margin-left:-100px;border-radius:16px;background:var(--paper);border:1px solid var(--line);box-shadow:0 10px 30px rgba(43,33,24,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px;text-decoration:none;transition:transform .3s}
.fan .pc .em{font-size:72px}.fan .pc b{font-family:"Fraunces",Georgia,serif;font-size:18px;margin-top:10px}
.fan .pc .corner{position:absolute;top:10px;left:14px;font-weight:700;color:var(--tomato)}
.fan .pc:nth-child(1){transform:rotate(-14deg) translateX(-120px)}.fan .pc:nth-child(2){transform:rotate(-4deg) translateX(-40px)}
.fan .pc:nth-child(3){transform:rotate(6deg) translateX(40px)}.fan .pc:nth-child(4){transform:rotate(16deg) translateX(120px)}
.fan .pc.ph{justify-content:flex-start;padding:30px 12px 14px}.fan .pc.ph img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;display:block}.fan .pc.ph b{font-size:16px;line-height:1.25;margin-top:12px}
.fan .pc:hover{z-index:5;transform:translateY(-14px) scale(1.04)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.chip{border:1.5px solid var(--line);background:var(--paper);border-radius:999px;padding:8px 16px;font:500 14px/1 inherit;font-family:inherit;cursor:pointer;color:var(--ink);text-decoration:none}
.chip.on,.chip:hover{border-color:var(--ink);background:var(--ink);color:#fff}
section.block{padding:36px 0}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px}
.sec-h h2{font-size:34px;margin:0}.sec-h .count{color:var(--muted);font-size:15px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(43,33,24,.12)}
.card .art{aspect-ratio:4/3;display:grid;place-items:center;font-size:76px;position:relative}
.card .art .suit{position:absolute;top:10px;left:12px;font-size:18px;color:rgba(255,255,255,.9);font-weight:700}
.card .art .suit.b{top:auto;left:auto;bottom:10px;right:12px;transform:rotate(180deg)}
.card .body{padding:14px 16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .cat{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--tomato)}
.card h3{font-size:20px;margin:0}
.card .meta{font-size:13.5px;color:var(--muted);margin-top:auto}
.ad{border:1.5px dashed #CDBFAE;border-radius:10px;color:#A89886;font-size:12px;letter-spacing:.1em;text-transform:uppercase;display:grid;place-items:center;min-height:100px;margin:26px 0;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(205,191,174,.12) 10px,rgba(205,191,174,.12) 20px)}
.ad.side{min-height:600px;margin:0}
.news{background:var(--ink);color:var(--cream);border-radius:22px;padding:44px;display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;margin:40px 0}
.news h2{font-size:36px;margin:0 0 8px}.news p{margin:0;color:#D7CCBE}
.news form{display:flex;gap:8px;flex-wrap:wrap}
.news input{flex:1;min-width:200px;border:0;border-radius:999px;padding:14px 20px;font:inherit}
.news .ok{color:var(--mustard);font-weight:600}
footer.site{border-top:1px solid var(--line);padding:40px 0;color:var(--muted);font-size:14px;margin-top:40px}
footer.site .wrap{display:flex;flex-wrap:wrap;gap:18px 32px;justify-content:space-between}
footer.site a{color:var(--muted)}
.crumbs{font-size:14px;color:var(--muted);margin:26px 0 8px}.crumbs a{text-decoration:none}
.rhead h1{font-size:clamp(34px,4.6vw,54px);margin:0 0 12px}
.rhead .desc{font-size:19px;color:var(--muted);margin:0 0 18px;max-width:720px}
.stats{display:flex;flex-wrap:wrap;gap:10px 28px;font-size:15px;margin:0 0 20px}
.stats b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.rgrid{display:grid;grid-template-columns:1fr 300px;gap:40px}
.hero-art{border-radius:18px;aspect-ratio:16/9;display:grid;place-items:center;font-size:130px;position:relative}
.hero-art small{position:absolute;bottom:12px;right:16px;font-size:12px;color:rgba(255,255,255,.85)}
.prose h2{font-size:28px;margin:34px 0 10px}
.tipbox{background:#FFF4DC;border-left:4px solid var(--mustard);border-radius:8px;padding:16px 20px;margin:20px 0}
.gear{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin:24px 0}
.gear h3{margin:0 0 4px;font-size:21px}.gear .disc{font-size:12.5px;color:var(--muted);margin:0 0 12px}
.gear ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.gear li{display:flex;justify-content:space-between;gap:14px;align-items:center;border-top:1px solid var(--line);padding-top:10px}
.gear li span{font-size:14px;color:var(--muted);display:block}
.gear a.shop{white-space:nowrap;font-weight:600;color:var(--tomato);font-size:14px}
.rcard{background:var(--paper);border:2px solid var(--ink);border-radius:20px;padding:30px;margin:30px 0;position:relative;scroll-margin-top:90px}
.rcard:before,.rcard:after{content:attr(data-suit);position:absolute;font-size:26px;color:var(--tomato);font-weight:700}
.rcard:before{top:12px;left:16px}.rcard:after{bottom:12px;right:16px;transform:rotate(180deg)}
.rcard h2{font-size:32px;margin:0 0 6px;padding-left:22px}
.rcard .stats{padding-left:22px}
.scaler{display:inline-flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:999px;padding:4px}
.scaler button{width:32px;height:32px;border-radius:50%;border:0;background:var(--cream);font-size:18px;cursor:pointer}
.cols{display:grid;grid-template-columns:.9fr 1.1fr;gap:34px;margin-top:20px}
.cols h3{font-size:22px;margin:0 0 10px}
.ing{list-style:none;padding:0;margin:0}
.ing li{padding:8px 0;border-bottom:1px dashed var(--line);display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.ing li input{margin-top:6px;accent-color:var(--tomato)}
.ing li.done{color:#AFA294;text-decoration:line-through}
.steps{padding:0;margin:0;list-style:none;counter-reset:s}
.steps li{counter-increment:s;position:relative;padding:0 0 16px 46px}
.steps li:before{content:counter(s);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--tomato);color:#fff;font-weight:700;display:grid;place-items:center;font-size:14px}
.rate{display:flex;gap:4px;font-size:26px;color:#D8CBB8;cursor:pointer}.rate span.on{color:var(--mustard)}
aside .sticky{position:sticky;top:90px;display:grid;gap:20px}
.mini{display:flex;gap:12px;align-items:center;text-decoration:none}
.mini .t{width:64px;height:64px;border-radius:10px;display:grid;place-items:center;font-size:30px;flex:none}
.mini b{font-size:15px;line-height:1.3}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.panel h4{margin:0 0 12px;font-family:"Fraunces",Georgia,serif;font-size:19px}
.empty{padding:40px;text-align:center;color:var(--muted);display:none}
.page{max-width:760px;margin:40px auto}.card .art img,.hero-art.photo img,.mini .t img{width:100%;height:100%;object-fit:cover;display:block}.card .art img{position:absolute;inset:0}.card .art .suit{z-index:2;text-shadow:0 1px 3px rgba(0,0,0,.5)}.hero-art.photo{overflow:hidden;padding:0;aspect-ratio:4/3}.mini .t{overflow:hidden}.card.tt .body{gap:8px}.card.tt .ttb{margin:0;font-size:15px;color:var(--muted)}.card.tt .proof{margin:0;font-size:13.5px;color:#2E6B3A;background:#EAF4EC;border-radius:8px;padding:8px 10px}.card.tt .btn{margin-top:auto;justify-content:center;font-size:14px;padding:10px 16px}
.dd{position:relative}nav.main{align-items:center}.dd .menu{display:none;position:absolute;right:0;top:100%;padding-top:14px;min-width:290px;z-index:30}
.dd .menu:before{content:"";position:absolute;inset:14px 0 0;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(43,33,24,.14);z-index:-1}
.dd:hover .menu,.dd:focus-within .menu{display:block}.dd .menu a{display:block;padding:10px 18px;color:var(--ink)}.dd .menu a:hover{background:var(--cream)}
.decks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.deck{display:flex;gap:16px;align-items:center;padding:20px;border-radius:18px;text-decoration:none;border:1px solid var(--line);transition:transform .2s,box-shadow .2s}
.deck:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(43,33,24,.1)}
.deck .ic{width:64px;height:84px;border-radius:10px;display:grid;place-items:center;font-size:32px;flex:none;color:#fff;box-shadow:4px 3px 0 rgba(43,33,24,.15);transform:rotate(-5deg)}
.deck b{font-family:"Fraunces",Georgia,serif;font-size:20px;display:block;line-height:1.2}.deck span{font-size:14px;color:var(--muted)}
.uw-banner{background:#FBEFD9;border-radius:22px;padding:34px;display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;align-items:center}
.uw-banner h2{font-size:38px;margin:6px 0 10px}.uw-banner p{color:var(--muted);margin:0 0 18px}
.uw-banner .grid{grid-template-columns:repeat(2,1fr);gap:14px}.uw-banner .card .art{font-size:54px;aspect-ratio:4/3}.uw-banner .card h3{font-size:17px}
.kicker{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tomato)}
.uw-hero{background:linear-gradient(135deg,#FBEFD9,#F4E1C4);padding:56px 0 46px;border-bottom:1px solid var(--line)}
.uw-hero h1{font-size:clamp(40px,5.4vw,64px);margin:8px 0 14px}.uw-hero p{font-size:19px;color:var(--muted);max-width:640px;margin:0 0 22px}
.uw-tabs{display:flex;gap:10px;flex-wrap:wrap}
.uw-hero p.care{font-size:14px;margin:20px 0 0}.care{font-size:14px;color:var(--muted);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-top:26px;max-width:760px}
.page h1{font-size:46px}
.note{background:#FFF4DC;border-radius:10px;padding:14px 18px;font-size:15px}
@media(max-width:900px){.decks{grid-template-columns:1fr}.uw-banner,.hero .wrap,.rgrid,.cols,.news{grid-template-columns:1fr}.fan{height:300px}aside{display:none}nav.main{display:none}.news{padding:30px}.hero{padding:36px 0 10px}.fan{height:260px;transform:scale(.72);transform-origin:center top}.rgrid>main{min-width:0}}
@media print{header.site,footer.site,.ad,.gear,aside,.actions,.news,.crumbs,.related,.rhead,.hero-art,.prose,.rate-wrap{display:none!important}.rcard{border:0;margin:0}.rgrid{display:block}body{background:#fff}}