/* PT TOWN — ตู้กาชา (ต่อจาก ptm.css + ptm-clothes.css) */
.pga-top{display:grid;gap:14px}
@media(min-width:900px){.pga-top{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}}
.pga-mc{display:flex;flex-direction:column;align-items:center;gap:14px;background:linear-gradient(180deg,#fff,#fff4ec)}
.pga-stage{height:min(46vh,400px);touch-action:pan-y;cursor:grab;background:#f3ecff}
.pga-me{padding:7px 12px;font-size:13px}
.pga-try .ptm-h{margin-top:0}

/* ---------- ตู้กาชา (CSS ล้วน) ---------- */
.gm{position:relative;width:240px;display:flex;flex-direction:column;align-items:center}
.gm-sign{position:relative;z-index:2;padding:4px 16px;border-radius:99px;background:var(--ink);color:#ffd34d;font-weight:800;letter-spacing:.12em;font-size:13px;margin-bottom:-12px}
.gm-dome{position:relative;width:214px;height:200px;border-radius:50% 50% 44% 44%;border:7px solid #fff;overflow:hidden;
  background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.95) 0,rgba(255,255,255,.4) 22%,rgba(210,232,255,.55) 60%,rgba(170,205,245,.7) 100%);box-shadow:0 8px 24px rgba(60,40,80,.18),inset 0 -10px 30px rgba(80,120,200,.2)}
.gm-dome::after{content:"";position:absolute;left:22px;top:18px;width:46px;height:70px;border-radius:50%;background:rgba(255,255,255,.55);transform:rotate(24deg);pointer-events:none}
.gm-ball{position:absolute;width:48px;height:48px;border-radius:50%;background:linear-gradient(180deg,var(--bc,#ee4d2d) 50%,#fff 50%);box-shadow:inset -4px -4px 8px rgba(0,0,0,.15)}
.gm-ball:nth-child(1){left:8px;bottom:6px;--bc:#ee4d2d}
.gm-ball:nth-child(2){left:52px;bottom:2px;--bc:#5fb7ff}
.gm-ball:nth-child(3){left:98px;bottom:4px;--bc:#ffd34d}
.gm-ball:nth-child(4){left:142px;bottom:8px;--bc:#7ed3a0}
.gm-ball:nth-child(5){left:24px;bottom:46px;--bc:#ff9ec4}
.gm-ball:nth-child(6){left:70px;bottom:44px;background:linear-gradient(180deg,#7b3fe4 50%,#f5b301 50%);box-shadow:0 0 14px rgba(155,92,255,.8),inset -4px -4px 8px rgba(0,0,0,.2)}
.gm-ball:nth-child(7){left:116px;bottom:48px;--bc:#3f6fd8}
.gm-ball:nth-child(8){left:150px;bottom:54px;--bc:#ff8a3d}
.gm-ball:nth-child(9){left:40px;bottom:88px;--bc:#9d7bd8}
.gm-ball:nth-child(10){left:88px;bottom:90px;--bc:#2f9e62}
.gm-ball:nth-child(11){left:130px;bottom:94px;--bc:#e8454f}
.gm-ball:nth-child(12){left:62px;bottom:130px;--bc:#ffd34d}
.gm-ball:nth-child(13){left:110px;bottom:134px;--bc:#5fb7ff}
.gm-body{position:relative;width:226px;height:132px;margin-top:-14px;border-radius:16px 16px 28px 28px;background:linear-gradient(180deg,#ff7a45,#ee4d2d 70%,#c43a1e);box-shadow:0 10px 24px rgba(196,58,30,.3)}
.gm-knob{position:absolute;left:50%;top:22px;width:62px;height:62px;margin-left:-31px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#e9e1da);box-shadow:0 4px 10px rgba(0,0,0,.2)}
.gm-knob i{position:absolute;left:50%;top:50%;width:46px;height:12px;margin:-6px 0 0 -23px;border-radius:6px;background:var(--ink)}
.gm-slot{position:absolute;left:50%;bottom:12px;width:84px;height:34px;margin-left:-42px;border-radius:12px 12px 8px 8px;background:#3a2530;box-shadow:inset 0 4px 8px rgba(0,0,0,.4)}
.gm-cap{position:absolute;left:50%;top:-20px;width:40px;height:40px;margin-left:-20px;border-radius:50%;opacity:0;background:linear-gradient(180deg,#ee4d2d 50%,#fff 50%)}
.gm-cap.is-secret{background:linear-gradient(180deg,#7b3fe4 50%,#f5b301 50%);box-shadow:0 0 18px 6px rgba(155,92,255,.8)}
.gm.is-spin .gm-knob i{animation:gmTurn .9s ease-in-out}
.gm.is-spin .gm-ball{animation:gmShake .18s ease-in-out 5 alternate}
.gm.is-spin .gm-ball:nth-child(2n){animation-delay:.06s}
.gm.is-spin .gm-ball:nth-child(3n){animation-delay:.12s}
.gm.is-drop .gm-cap{animation:gmDrop .7s cubic-bezier(.3,.7,.4,1.4) forwards}
.gm.is-open .gm-cap{animation:gmOpen .5s ease-out forwards}
@keyframes gmTurn{to{transform:rotate(360deg)}}
@keyframes gmShake{from{transform:translate(-3px,0) rotate(-8deg)}to{transform:translate(3px,-8px) rotate(8deg)}}
@keyframes gmDrop{0%{opacity:1;transform:translateY(-30px) scale(.6)}100%{opacity:1;transform:translateY(12px) scale(1)}}
@keyframes gmOpen{0%{opacity:1;transform:translateY(12px) scale(1)}60%{opacity:1;transform:translateY(-20px) scale(1.6)}100%{opacity:0;transform:translateY(-30px) scale(2.2)}}
.gm-flash{position:fixed;inset:0;z-index:40;pointer-events:none;opacity:0}
.gm-flash.is-normal{background:radial-gradient(circle at 50% 45%,rgba(255,211,77,.55),rgba(255,211,77,0) 55%);animation:gmFlash 1.1s ease-out}
.gm-flash.is-secret{background:radial-gradient(circle at 50% 45%,rgba(255,240,200,.95) 0,rgba(155,92,255,.8) 22%,rgba(90,30,170,.35) 50%,rgba(90,30,170,0) 75%);animation:gmFlash 1.5s ease-out}
.gm-flash.is-secret::after{content:"";position:absolute;left:50%;top:45%;width:180vmax;height:180vmax;margin:-90vmax 0 0 -90vmax;background:repeating-conic-gradient(rgba(255,230,150,.35) 0 6deg,rgba(255,230,150,0) 6deg 18deg);animation:gmRays 1.5s linear}
@keyframes gmFlash{0%{opacity:0}20%{opacity:1}100%{opacity:0}}
@keyframes gmRays{to{transform:rotate(60deg)}}
@media(prefers-reduced-motion:reduce){.gm *,.gm-flash,.gm-flash::after{animation-duration:.01s!important}}

/* ปุ่มหมุน */
.pga-btns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;width:100%;max-width:420px}
.pga-b{flex-direction:column;gap:0;padding:12px 10px;font-size:16px;border-radius:16px;line-height:1.25}
.pga-b small{font-size:13px;font-weight:600;opacity:.95}
.pga-b.is-ten{background:linear-gradient(135deg,#7b3fe4,#5b2aa8)}
.pga-b.is-ten:hover{background:linear-gradient(135deg,#6a31d0,#4b1f8f)}
.pga-pity{width:100%;max-width:420px;display:grid;gap:6px;font-size:14px;text-align:center}
.pga-pity b{color:var(--secret);font-size:18px}
.pga-pity progress,.pga-set progress{width:100%;height:10px;border:0;border-radius:99px;overflow:hidden;background:#eee3f7;accent-color:var(--secret)}
.pga-pity progress::-webkit-progress-bar,.pga-set progress::-webkit-progress-bar{background:#eee3f7;border-radius:99px}
.pga-pity progress::-webkit-progress-value,.pga-set progress::-webkit-progress-value{background:linear-gradient(90deg,#9b5cff,#f5b301);border-radius:99px}
.pga-pity progress::-moz-progress-bar,.pga-set progress::-moz-progress-bar{background:linear-gradient(90deg,#9b5cff,#f5b301);border-radius:99px}
.pga-prop{display:block;padding:6px 10px;border:1px dashed #c9a6ff;border-radius:10px;background:var(--secret-wash);color:#5b2aa8;font-size:12px}

/* โอกาส */
.pga-oddsc{margin-top:14px}
.pga-oddsc .ptm-h{margin-top:0}
.pga-tbl{width:100%;border-collapse:collapse;font-size:14px}
.pga-tbl th{text-align:left;font-size:12px;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
.pga-tbl td{padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
.pga-tbl td:last-child,.pga-tbl th:last-child{text-align:right;white-space:nowrap}
.pga-tbl td:nth-child(2),.pga-tbl th:nth-child(2){white-space:nowrap;color:var(--ink2)}
.pga-tbl td small{display:block;font-size:11px;color:var(--muted);font-weight:500}
.pga-tbl .is-sum td{font-weight:700}
.pga-tbl .is-sum td:last-child{font-size:16px}
.pga-tbl .is-secret td{background:var(--secret-wash);color:#4b1f8f}
.pga-tbl .is-sub td:first-child{padding-left:18px}
.pga-rules{margin:12px 0 0;padding-left:20px;display:grid;gap:4px;font-size:13px;color:var(--ink2)}

/* สะสม */
.pga-sets{display:grid;gap:10px}
@media(min-width:640px){.pga-sets{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:960px){.pga-sets{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pga-set{display:grid;gap:8px;padding:12px;border-radius:var(--r);background:#fff;border:1px solid #e4d6fb}
.pga-set.is-full{background:linear-gradient(160deg,#fff,#f6eeff);border-color:#b892ff}
.pga-set-h{display:flex;align-items:center;gap:8px}
.pga-set-h>div{flex:1;min-width:0;display:grid}
.pga-set-h small{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--secret)}
.pga-set-h b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pga-set-h>span{font-weight:800;color:var(--secret)}
.pga-pcs{display:flex;gap:6px;flex-wrap:wrap}
.pga-pc{width:48px;height:48px;border-radius:10px;overflow:hidden;background:radial-gradient(circle at 50% 38%,#fff5d6,#c9a6ff 55%,#4b1f8f)}
.pga-pc img{display:block;width:100%;height:100%;object-fit:contain}
.pga-pc.is-lock img{filter:grayscale(1) brightness(.35)}

/* ประวัติ */
.pga-hist{list-style:none;margin:0;padding:6px 14px;display:grid}
.pga-hist li{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);min-width:0}
.pga-hist li:last-child{border-bottom:0}
.pga-hist time{flex:none;font-size:12px;color:var(--muted);width:92px}
.pga-hist b{flex:1;min-width:0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pga-hist .ptm-tag{position:static;flex:none}
.pga-hist small{flex:none;font-size:12px;color:var(--ok);font-weight:700}
.pga-hist li.is-secret b{color:var(--secret)}
.pga-n{flex:none;font-size:12px;color:var(--muted)}
.pga-empty{color:var(--muted);justify-content:center}

/* ผลการหมุน */
.pga-rv{display:grid;justify-items:center;gap:6px;text-align:center}
.pga-rib{padding:4px 14px;border-radius:99px;background:linear-gradient(90deg,#7b3fe4,#b88a2c);color:#fff;font-weight:800;font-size:13px}
.pga-rib.is-n{background:var(--ground);color:var(--ink2)}
.pga-rv-pic{width:min(280px,100%);aspect-ratio:1/1;border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#fffaf4,#f3e2cf)}
.pga-rv.is-secret .pga-rv-pic{background:radial-gradient(circle at 50% 38%,#fff5d6 0,#c9a6ff 45%,#3a1475 100%);box-shadow:0 0 0 3px #f5b301,0 0 30px rgba(155,92,255,.6);animation:pgaGlow 1.6s ease-in-out infinite alternate}
@keyframes pgaGlow{to{box-shadow:0 0 0 3px #ffd34d,0 0 46px rgba(155,92,255,.9)}}
.pga-rv-img{display:block;width:100%;height:100%;object-fit:contain}
.pga-rv-n{font-size:18px}
.pga-rv.is-secret .pga-rv-n{color:#4b1f8f}
.pga-rv small{color:var(--muted)}
.pga-dup{margin:4px 0 0;padding:6px 12px;border-radius:10px;background:#fff6dc;color:#7a5200;font-weight:600;font-size:13px}
.pga-got{margin:4px 0 0;color:var(--ok);font-weight:700;font-size:13px}
.ptm-dlg.pga-dlg10{width:min(640px,calc(100vw - 32px))}
.pga-g10{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
@media(min-width:520px){.pga-g10{grid-template-columns:repeat(5,minmax(0,1fr))}}
.pga-c10{position:relative;display:grid;gap:2px;padding:6px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;text-align:center;min-width:0}
.pga-c10 img{display:block;width:100%;aspect-ratio:1/1;border-radius:8px;background:radial-gradient(circle at 50% 40%,#fffaf4,#f3e2cf);object-fit:contain}
.pga-c10 b{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pga-c10 small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pga-c10 .ptm-tag{top:4px;left:4px;font-size:10px;padding:1px 6px}
.pga-c10.is-secret{border-color:#b892ff;background:linear-gradient(170deg,#fff,#f1e6ff)}
.pga-c10.is-secret img{background:radial-gradient(circle at 50% 38%,#fff5d6 0,#c9a6ff 45%,#3a1475 100%)}
.pga-c10.on{box-shadow:0 0 0 2px var(--brand)}
.pga-sum{margin:10px 0 0;font-size:13px;color:var(--ink2)}
.pga-why{margin:-4px 0 0;min-height:1em;font-size:13px;color:var(--muted);text-align:center}
.pga-why:empty{display:none}
.pga-warn{margin:6px 0 0;padding:6px 10px;border-radius:10px;background:#fff6dc;color:#7a5200;font-size:13px}
.pga-where{margin:6px 0 0;font-size:13px;color:var(--ink2)}
.pga-where a,.pga-rules a,.pga-oddsc a,#pgaSetH a{color:var(--brand);font-weight:700}
.pga-emo{display:grid;place-items:center;width:100%;height:100%;aspect-ratio:1/1;font-size:44px;border-radius:8px;background:radial-gradient(circle at 50% 38%,#fff5d6 0,#c9a6ff 45%,#3a1475 100%)}
.pga-rv-pic .pga-emo{font-size:110px;border-radius:0}
.pga-pc .pga-emo{font-size:24px;border-radius:0}
.pga-pc.is-lock .pga-emo{filter:grayscale(1) brightness(.5)}

/* ช่องสะสมที่ยังไม่ได้: กล่อง ? (ไม่วาดรูป ลดกระตุก 7 พ.ย. 2569) */
.pga-pc.is-lock{display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,#efe6ff,#b99cf0 60%,#6a3fc2)}
.pga-pc .pga-q{font-style:normal;font-weight:800;font-size:22px;color:#fff;text-shadow:0 2px 4px rgba(60,20,120,.45)}
/* กฎตู้กาชา 3 หัวข้อ (7 พ.ย. 2569) */
.pga-rg{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:12px}
@media (min-width:720px){.pga-rg{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pga-rgc{padding:12px 14px;border-radius:16px;background:#fffaf4;border:1px solid #f3e6d8}
.pga-rgc.is-odds{background:#f8f3ff;border-color:#e7dbff}
.pga-rgc.is-use{background:#f2fbf6;border-color:#d6f0e1}
.pga-rgc h3{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:15px}
.pga-rgc h3 .ptm-ic{width:22px;height:22px}
.pga-rgc ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.pga-rgc li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;font-size:13.5px;line-height:1.45}
.pga-rgc li b{color:#2a1f24}
.pga-rgc li span{color:#5a4d54}
.pga-rgc li em{font-style:normal;font-weight:800;color:#7a3cf0}
.pga-rgc p{margin:0 0 8px;font-size:13.5px;color:#5a4d54;line-height:1.45}
.pga-rgo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.pga-rgo a{display:flex;flex-direction:column;padding:8px 10px;border-radius:12px;background:#fff;border:1px solid #d6f0e1;color:#1f7a4a;font-weight:700;font-size:13px;text-decoration:none}
.pga-rgo a small{font-weight:500;color:#6b7f74;font-size:11.5px}