/* Permanent Glory progression and tactile pack effects. */
.glory-dialog { --g-ink:#faf0df; --g-muted:#c1b5a4; --g-gold:#ebcd8f; box-sizing:border-box; width:min(550px,calc(100vw - 32px)); max-height:min(850px,90dvh); padding:0; border:1px solid #ead7ae40; border-radius:24px; background:linear-gradient(145deg,#272722,#171c1b 60%); color:var(--g-ink); box-shadow:0 30px 100px #0009,inset 0 1px #ffffff10; font:14px/1.5 system-ui,sans-serif; overscroll-behavior:contain; }
.glory-dialog::backdrop { background:#080b0ac4; backdrop-filter:blur(7px); }
.glory-panel { padding:22px; }
.glory-header { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.glory-brand { display:flex; align-items:center; gap:12px; min-width:0; }
.glory-header-copy { min-width:0; }
.glory-hole-emblem { display:block; width:96px; height:74px; flex:none; object-fit:contain; object-position:center; }
.glory-eyebrow { color:#d6c39e; font:650 10px/1.5 system-ui,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.glory-header h2 { margin:4px 0 0; color:#fff2d8; font:500 clamp(21px,4.8vw,27px)/1.15 Georgia,serif; letter-spacing:-.04em; }
.glory-icon-button { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:11px; color:#ddd0bd; border:1px solid #e9d7b220; background:#ffffff04; border-radius:50%; cursor:pointer; }
.glory-icon-button svg { width:20px; height:20px; }
.glory-icon-button:hover { color:#fff5df; background:#ffffff0d; }
.glory-summary { margin-top:16px; padding:14px 17px; border:1px solid #e4cb932b; border-radius:15px; background:linear-gradient(115deg,#ddbd7a13,#ffffff03); }
.glory-score-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.glory-score-row strong { display:block; color:#fff0d0; font:500 36px/1.2 system-ui,sans-serif; letter-spacing:-1.4px; font-variant-numeric:tabular-nums; }
.glory-score-row strong small { margin-left:8px; color:#c5b595; font:600 9px/1 system-ui,sans-serif; letter-spacing:.09em; }
.glory-peak { color:#c1b5a4; text-align:right; font-size:10px; }
.glory-peak strong { margin-top:3px; color:#dfd2b9; font-size:17px; letter-spacing:-.3px; }
.glory-next-copy { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 10px; margin:10px 0 8px; color:#dbceb5; font-size:11px; }
.glory-next-copy b { color:#f5e3bd; font-weight:600; }
.glory-progress { height:5px; border-radius:5px; overflow:hidden; background:#ffffff13; }
.glory-progress i { display:block; height:100%; background:linear-gradient(90deg,#bda16a,#f4dfab); border-radius:inherit; transition:width .35s ease; }
.glory-retained { margin:12px 0 0; font-size:11px; color:var(--g-muted); }
.glory-timeline { list-style:none; margin:14px 0 0; padding:0; display:grid; gap:10px; }
.glory-perk { position:relative; display:grid; grid-template-columns:36px minmax(0,1fr); gap:12px; padding:12px 14px; border:1px solid #eee0c51b; border-radius:15px; background:#ffffff02; scroll-margin-block:20px; }
.glory-perk.is-active { border-color:#afd1b638; background:linear-gradient(120deg,#83ad8c0c,transparent); }
.glory-perk.is-next { border-color:#ead09866; background:linear-gradient(120deg,#cbb06d13,transparent); box-shadow:inset 0 0 25px #f1c16b03; }
.glory-perk-icon { display:grid; place-items:center; width:36px; height:40px; border-radius:10px; color:#c4baa8; border:1px solid #ffffff15; background:#ffffff04; }
.glory-perk-icon svg { width:24px; height:24px; }
.is-active .glory-perk-icon { color:#c1d6bb; border-color:#c5dabc2b; background:#bcd8b20b; }
.is-next .glory-perk-icon { color:#efcf8b; border-color:#d4b37140; background:#e6bb610a; }
.glory-perk-meta { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:5px; min-height:20px; color:#bdb2a0; font-size:9px; font-weight:600; letter-spacing:.06em; }
.glory-badge { display:inline-flex; align-items:center; gap:4px; color:#bfb9ad; font-size:9px; letter-spacing:.02em; }
.glory-badge svg { width:11px; height:11px; }
.is-active .glory-badge { color:#c0d9bb; }
.is-next .glory-badge { color:#f5dca2; }
.glory-perk h3 { margin:1px 0 4px; color:#f4e8d5; font:500 20px/1.2 Georgia,serif; }
.glory-perk-meta h3 { letter-spacing:0; }
.glory-perk-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 8px; margin-top:7px; }
.glory-threshold { color:#c7b897; font-size:9px; letter-spacing:.06em; font-weight:600; }
.glory-perk-bottom .glory-rate { margin-top:0; }
.glory-perk-description { margin:0; color:#d5cec1; font-size:12px; line-height:1.5; }
.glory-rate { display:inline-block; margin-top:7px; padding:2px 6px; border-radius:4px; background:#ffffff07; color:#e6d7b9; font-size:10px; }
.glory-footer { display:flex; gap:9px; margin:15px 2px 0; color:#d4c7af; font-size:11px; }
.glory-footer>svg { width:16px; height:16px; color:#bdd3b5; flex-shrink:0; margin-top:1px; }
.glory-footer small { display:block; color:#b3aa9b; font-size:10px; margin-top:5px; }
.glory-storage { background:#b2832220; color:#f5d69b; border:1px solid #cfad6440; padding:10px; border-radius:8px; font-size:12px; }
.glory-trigger { cursor:pointer; position:relative; min-height:44px; }
.glory-trigger::after { content:''; position:absolute; left:20%; right:20%; bottom:3px; height:2px; border-radius:2px; background:linear-gradient(to right,#eacf98 var(--glory-progress,0%),#ffffff16 var(--glory-progress,0%)); }
.glory-trigger:hover { background-color:#e3c88b0c; }
.glory-trigger:focus-visible,.glory-dialog :focus-visible,.glory-toast :focus-visible { outline:2px solid #f4d99e; outline-offset:3px; }
.glory-toast { box-sizing:border-box; position:fixed; z-index:1100; right:24px; bottom:calc(112px + env(safe-area-inset-bottom,0px)); display:flex; align-items:center; gap:12px; width:min(400px,calc(100vw - 32px)); padding:14px; border:1px solid #e4c68466; border-radius:17px; color:#f8ebd2; background:linear-gradient(115deg,#343127,#1c2420); box-shadow:0 12px 50px #0008,inset 0 1px #f4d99e16; animation:glory-arrive .3s ease-out; }
.glory-toast[hidden],.glory-dialog [hidden] { display:none!important; }
.glory-toast-emblem { display:grid; place-items:center; flex:none; width:40px; height:48px; color:#edce8e; background:#e4c0770c; border:1px solid #e5ce9a33; border-radius:10px; }
.glory-toast-emblem svg { width:25px; height:25px; }
.glory-toast-open { flex:1; min-width:0; border:0; padding:3px 0; text-align:left; color:inherit; background:none; cursor:pointer; font:12px/1.5 system-ui,sans-serif; min-height:44px; }
.glory-toast-open strong { display:block; font:500 21px/1.3 Georgia,serif; margin:4px 0; }
.glory-toast-effect { display:block; color:#d0c6b5; font-size:11px; }
.glory-toast-link { display:block; margin-top:7px; color:#edce8e; font-size:10px; }
.glory-toast .glory-icon-button { width:44px; height:44px; align-self:flex-start; border:0; background:transparent; margin:-5px -5px 0 0; }
.glory-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@keyframes glory-arrive { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:600px) {
  .glory-dialog { width:100%; max-width:100%; max-height:91dvh; margin:auto 0 0; border-radius:23px 23px 0 0; border-bottom:0; }
  .glory-panel { padding:23px 18px max(24px,env(safe-area-inset-bottom)); }
  .glory-header { position:sticky; top:0; z-index:2; padding-block:8px; background:#252722; box-shadow:0 8px 14px #252722; }
  .glory-perk { scroll-margin-top:120px; }
  .glory-brand { gap:9px; }
  .glory-hole-emblem { width:72px; height:68px; }
  .glory-summary { padding:17px; }
  .glory-perk { padding:15px 12px; gap:11px; }
  .glory-toast { right:16px; bottom:calc(100px + env(safe-area-inset-bottom,0px)); }
}
@media(prefers-reduced-motion:reduce) { .glory-toast { animation:none; } .glory-progress i { transition:none; } }

.mobile-header-wallet { display:none; }
.results-meta { flex-wrap:wrap; justify-content:center; max-width:100%; }
.glory-triggered { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:6px; min-width:0; max-width:100%; letter-spacing:normal; }
.glory-triggered:empty { display:none; }
.glory-trigger-chip { padding:5px 8px; border:1px solid #c2a66d55; border-radius:5px; color:#efddb7; background:#24251ed9; font:10px/1.2 system-ui,sans-serif; }
/* Passive wrapper seal: pointer events pass through to the opening surface. */
.glory-bonus-seal { position:absolute; z-index:5; width:clamp(86px,43%,126px); aspect-ratio:6 / 5; container-type:inline-size; left:12px; bottom:22px; pointer-events:none; user-select:none; color:#653b54; filter:drop-shadow(0 3px 3px #0005); transform:rotate(-9deg); }
.glory-bonus-seal::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,#fff4f6,#d7abc4 22%,#faedf4 45%,#edcddd 65%,#fff6ee); clip-path:polygon(100.00% 50.00%,93.79% 54.31%,99.04% 59.75%,92.11% 62.77%,96.19% 69.13%,88.80% 70.74%,91.57% 77.78%,84.01% 77.91%,85.36% 85.36%,77.91% 84.01%,77.78% 91.57%,70.74% 88.80%,69.13% 96.19%,62.77% 92.11%,59.75% 99.04%,54.31% 93.79%,50.00% 100.00%,45.69% 93.79%,40.25% 99.04%,37.23% 92.11%,30.87% 96.19%,29.26% 88.80%,22.22% 91.57%,22.09% 84.01%,14.64% 85.36%,15.99% 77.91%,8.43% 77.78%,11.20% 70.74%,3.81% 69.13%,7.89% 62.77%,0.96% 59.75%,6.21% 54.31%,0.00% 50.00%,6.21% 45.69%,0.96% 40.25%,7.89% 37.23%,3.81% 30.87%,11.20% 29.26%,8.43% 22.22%,15.99% 22.09%,14.64% 14.64%,22.09% 15.99%,22.22% 8.43%,29.26% 11.20%,30.87% 3.81%,37.23% 7.89%,40.25% 0.96%,45.69% 6.21%,50.00% 0.00%,54.31% 6.21%,59.75% 0.96%,62.77% 7.89%,69.13% 3.81%,70.74% 11.20%,77.78% 8.43%,77.91% 15.99%,85.36% 14.64%,84.01% 22.09%,91.57% 22.22%,88.80% 29.26%,96.19% 30.87%,92.11% 37.23%,99.04% 40.25%,93.79% 45.69%); }
.glory-bonus-seal-inner { position:absolute; inset:11.4% 8.7%; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:2cqw; border:1px solid #bd8ca8; border-radius:50%; background:linear-gradient(155deg,#fff8f5,#eed1e2 48%,#fdf0f5); box-shadow:0 0 0 3px #f5e0ec,0 0 0 4px #bd8ca8,inset 0 0 0 2px #fff7fa; text-shadow:0 1px #fff7fa; }
.glory-bonus-seal-inner b { max-width:100%; font:700 17.5cqw/1.15 Georgia,serif; letter-spacing:-.04em; }
.glory-bonus-seal-inner > span { font:800 7.14cqw/1.2 system-ui,sans-serif; letter-spacing:.1em; }
.has-glory-effect .card-media { position:relative; }
.glory-effect-label { position:absolute; z-index:8; left:50%; bottom:7px; transform:translateX(-50%); padding:4px 8px; max-width:96%; white-space:nowrap; border:1px solid #eed9955c; border-radius:4px; color:#f2dfb1; background:#272418f0; font:600 8px/1.2 system-ui,sans-serif; letter-spacing:.04em; pointer-events:none; }
.glory-effect-label[data-effect=smuggled] { color:#d5ebd1; border-color:#b4d0a962; background:#1d3229f2; }
.glory-effect-label[data-effect=lucky] { color:#fff0b9; border-color:#e8d28870; }
.glory-six-cards { --card-width:clamp(140px,14.2vw,218px); }
.glory-stuck-card { transform:translateX(-25px) rotate(4deg); }
.glory-separate { position:absolute; inset:0; z-index:15; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:13px; border:1px solid #ecd7a08a; border-radius:inherit; background:linear-gradient(130deg,#303c31ea,#182522e8); color:#f2dfb9; cursor:grab; touch-action:none; transform:translateX(calc(var(--peel,0) * 20px)); }
.glory-separate::before,.glory-separate::after { content:''; position:absolute; width:58%; height:25px; left:21%; top:15%; background:#d5cda154; border-block:1px dashed #eee1b649; transform:rotate(-8deg); }
.glory-separate::after { top:auto; bottom:15%; transform:rotate(7deg); }
.glory-separate>span { font:48px Georgia,serif; }
.glory-separate b { font-size:9px; letter-spacing:.07em; }
.glory-separate small { font-size:10px; color:#c4c6ae; }
@media(min-width:761px) { .cards.glory-six-cards { grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; } }
@media(max-width:760px) {
  body:has([data-glory-mobile]) .game-hud { justify-content:space-between; gap:8px; padding:5px 12px 0; }
  body:has([data-glory-mobile]) .game-hud .brand { min-width:0; font-size:clamp(18px,5.7vw,26px); }
  .mobile-header-wallet { display:flex; flex-shrink:0; align-items:center; min-height:44px; color:#f0debb; border:1px solid #e0c58d38; border-radius:9px; background:#23231ee8; z-index:40; }
  .glory-mobile-entry,
  .mobile-header-points { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:3px; padding:6px 9px; min-height:44px; }
  .glory-mobile-entry { position:relative; color:inherit; border:0; border-radius:9px 0 0 9px; background:none; }
  .mobile-header-points { position:relative; }
  .mobile-header-points::before { content:''; position:absolute; left:0; top:9px; bottom:9px; border-left:1px solid #e0c58d38; }
  .mobile-header-wallet > * > span { font-size:12px; line-height:1.1; font-variant-numeric:tabular-nums; white-space:nowrap; }
  .mobile-header-wallet small { font-size:8px; line-height:1; color:#c6b28b; }
  .glory-effect-label { font-size:9px; }
  .glory-triggered { flex-basis:100%; }
}
@media(prefers-reduced-motion:reduce) { .glory-stuck-card { transform:none; } }

.glory-separate:focus-visible { outline:2px solid #efd4a0; outline-offset:3px; }

@media(max-width:760px) {
  .pack-plinth:has(.glory-bonus-seal) .pack-tap-hint { bottom:132px; }
}

.glory-trigger-chip[data-effect=sticker] { color:#f5ddea; border-color:#dbb5cd55; background:#30232ed9; }
.glory-point-spark { position:fixed; z-index:1000; width:6px; height:6px; border-radius:50%; background:#f4d5e9; box-shadow:0 0 5px #f1b9d880; pointer-events:none; }
