.hw{width:100%;max-width:760px;margin:0 auto;padding:0 14px;display:flex;flex-direction:column;align-items:center;gap:14px}
.note{font-size:12px;color:var(--muted);line-height:1.6}
/* 카드 공통 */
.hc{border:0;padding:0;background:none;cursor:pointer;aspect-ratio:60/96;width:100%;perspective:600px;display:block}
.hc .in{position:relative;display:block;width:100%;height:100%;transition:transform .35s;transform-style:preserve-3d}
.hc.up .in{transform:rotateY(180deg)}
.hc .fc,.hc .bk{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:5px;overflow:hidden;box-shadow:0 2px 4px rgba(60,30,10,.3)}
.hc .fc{transform:rotateY(180deg)}
.hc svg{display:block;width:100%;height:100%}
.hc.done{cursor:default}.hc.done .fc{opacity:.45;filter:saturate(.6)}
.hc.miss .fc{box-shadow:0 0 0 3px #d8333a}
.hc.hit .fc{box-shadow:0 0 0 3px #2f9e6a}
/* 짝맞추기 판 */
.mem{display:grid;gap:8px;width:100%}
.mem.c4{grid-template-columns:repeat(4,1fr);max-width:360px}
.mem.c6{grid-template-columns:repeat(6,1fr);max-width:540px}
.mem.c8{grid-template-columns:repeat(8,1fr);max-width:720px}
@media(max-width:520px){.mem.c8{grid-template-columns:repeat(6,1fr);gap:5px}.mem{gap:6px}}
/* 오관떼기 */
.og-top{display:flex;gap:14px;align-items:flex-start;justify-content:center;width:100%}
.og-pile{width:64px;flex:none;text-align:center;font-size:12px;color:#5c554b}
.og-pile .slot{width:64px;aspect-ratio:60/96;border:2px dashed rgba(90,60,30,.35);border-radius:6px;position:relative;margin-bottom:4px}
.og-pile .slot .hc{position:absolute;inset:0}
.og-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;width:100%;max-width:470px}
.og-col{position:relative;min-height:160px}
.og-col .hc{position:absolute;left:0;right:0}
.hc.sel .fc{box-shadow:0 0 0 3px #f4c430,0 6px 12px rgba(0,0,0,.3);transform:rotateY(180deg) translateY(-4px)}
.hc.free .fc{box-shadow:0 0 0 2px rgba(255,255,255,.9),0 2px 4px rgba(60,30,10,.3)}
.og-bar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
@media(max-width:520px){.og-cols{gap:6px}.og-pile,.og-pile .slot{width:52px}}
/* 화투점 */
.hf-board{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;width:100%;max-width:400px}
.hf-col{position:relative;min-height:190px}
.hf-col .hc{position:absolute;left:0;right:0}
.hf-col.glow .hc.up .fc{box-shadow:0 0 0 3px #f4c430}
.hf-row{display:flex;align-items:center;gap:12px;justify-content:center;flex-wrap:wrap;width:100%}
.hf-stock{width:70px}
.hf-drawn{width:70px;min-height:112px}
.hf-disc{display:flex;flex-wrap:wrap;gap:4px;min-height:52px;width:100%;max-width:520px;justify-content:center;padding:6px;border-radius:8px;background:rgba(255,255,255,.35)}
.hf-disc .hc{width:30px}
.hf-months{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;width:100%;max-width:520px}
.hf-m{background:rgba(255,255,255,.55);border-radius:8px;padding:5px 4px;text-align:center;font-size:12px;color:#5c554b;border:1.5px solid transparent}
.hf-m b{display:block;font-size:13px;color:var(--ink)}
.hf-m .dots{letter-spacing:2px;color:#c9b99c}.hf-m .dots i{font-style:normal;color:#c8262c}
.hf-m.full{border-color:#c8262c;background:#fff6e8}
.hf-res{width:100%;max-width:560px;background:#fffaf0;border:1px solid var(--line);border-radius:14px;padding:18px 18px 16px;box-shadow:0 6px 16px rgba(70,40,10,.12)}
.hf-res h3{margin:0 0 4px;font-size:20px}
.hf-res .sub{color:var(--muted);font-size:13px;margin-bottom:12px}
.hf-cards{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.hf-cards .one{width:120px;text-align:center;font-size:13px}
.hf-cards .one svg{width:62px;display:block;margin:0 auto 4px;border-radius:5px;box-shadow:0 3px 6px rgba(60,30,10,.25)}
.hf-res p{margin:6px 0;line-height:1.65}
.hf-res .tools{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.mean{padding-left:18px}.mean li{margin:2px 0}
@media(max-width:520px){.hf-board{gap:7px}.hf-col{min-height:150px}.hf-months{grid-template-columns:repeat(4,1fr)}.hf-stock,.hf-drawn{width:56px}}