/* Daily Spin page. Designed for the light content area of the restored site frame (white to light gray, red accents). */
.ds-page{padding:8px 28px 34px;color:#2b2118;font:15px/1.5 Arial,Helvetica,sans-serif}
.ds-page h1{margin:6px 0 10px}
.ds-page h2{margin:0;font:bold 19px/1.2 Arial,Helvetica,sans-serif;color:#2b2118;text-transform:none}
.ds-lead{margin:0 0 22px;color:#5b4c3b}
.ds-strong{font-variant-numeric:tabular-nums;color:#8f0b03}
.ds-status{min-height:1.4em;margin:16px 0 0;font-weight:bold;color:#8f0b03}
.ds-login-link{display:inline-block;margin-left:6px;padding:7px 16px;background:#bf170d;border:1px solid #830900;color:#fff;font-weight:bold;text-decoration:none}

.ds-spins{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.ds-card{position:relative;padding:18px 20px 20px;background:#fff;border:1px solid #d6cbb8;box-shadow:0 1px 0 rgba(0,0,0,.04);overflow:hidden}
.ds-card-available{border-color:#bf170d;box-shadow:0 0 0 2px rgba(191,23,13,.12)}
.ds-card-locked{background:#f6f2ea}
.ds-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.ds-card-blurb{margin:0 0 14px;color:#5b4c3b}
.ds-pill{flex:none;padding:3px 10px;border-radius:999px;font:bold 11px/1.4 Arial,sans-serif;text-transform:uppercase;letter-spacing:.05em}
.ds-pill-available{background:#bf170d;color:#fff}
.ds-pill-claimed{background:#e6e0d3;color:#4d4131}
.ds-pill-locked{background:#ddd5c5;color:#5b4c3b}
.ds-btn{display:block;width:100%;padding:12px 16px;border:1px solid #830900;background:#bf170d;color:#fff;font:bold 14px Arial,sans-serif;text-transform:uppercase;letter-spacing:.03em;cursor:pointer}
.ds-btn:hover:not(:disabled){background:#8f0b03}
.ds-btn:focus-visible{outline:3px solid #ffb400;outline-offset:2px}
.ds-btn:disabled{background:#c9c0b0;border-color:#b3a995;color:#fff;cursor:default}
.ds-hint{margin:10px 0 0;font-size:13px;color:#7a6a58}

.ds-reward{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:10px 12px;background:#fdf6e3;border:1px solid #e8d7a6}
.ds-reward-art{width:48px;height:48px;object-fit:contain;image-rendering:pixelated;flex:none}
.ds-reward-decis{flex:none;min-width:48px;padding:10px 6px;text-align:center;background:#bf170d;color:#fff;font:bold 16px Arial,sans-serif;border-radius:4px}
.ds-reward-text{display:flex;flex-direction:column;line-height:1.25}
.ds-reward-text small{color:#7a6a58;text-transform:uppercase;letter-spacing:.06em;font-size:11px}
.ds-reward-text strong{font-size:17px;color:#2b2118}
.ds-card.is-revealed{animation:ds-pop .6s ease-out}
@keyframes ds-pop{0%{box-shadow:0 0 0 0 rgba(191,23,13,.5)}100%{box-shadow:0 0 0 14px rgba(191,23,13,0)}}

/* Prize reel: a horizontal strip that scrolls right to left and stops with the winning tile under the marker. */
.ds-reelbox{margin:0 0 18px;padding:14px 0 14px;background:#fff;border:1px solid #d6cbb8}
.ds-reel-viewport{position:relative;overflow:hidden;height:156px;background:linear-gradient(#efe7d6,#f8f3e8);border-top:1px solid #d6cbb8;border-bottom:1px solid #d6cbb8}
.ds-reel-track{position:absolute;left:0;top:12px;display:flex;gap:8px;width:max-content;will-change:transform;transform:translate3d(0,0,0)}
.ds-tile{flex:none;box-sizing:border-box;width:120px;height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px 6px;background:#fffdf8;border:2px solid #dcd2bd;border-radius:6px;text-align:center;transition:opacity .35s,transform .35s,box-shadow .35s,border-color .35s}
.ds-tile-art{flex:none;max-width:76px;max-height:64px;width:auto;height:auto;image-rendering:pixelated}
.ds-tile-art.sp-art-missing{width:56px;height:56px}
.ds-tile-coin{flex:none;width:64px;height:64px;display:block}
.ds-tile-name{max-width:100%;font:bold 12px/1.2 Arial,Helvetica,sans-serif;color:#3b2f22;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ds-tile-decis .ds-tile-name{color:#8f0b03}
.ds-reel-track.has-winner .ds-tile:not(.is-winner){opacity:.38}
.ds-tile.is-winner{border-color:#bf170d;background:#fff6e0;transform:scale(1.07);box-shadow:0 0 0 3px rgba(191,23,13,.28)}
.ds-reel-marker{position:absolute;top:0;bottom:0;left:50%;width:0;border-left:3px solid rgba(191,23,13,.88);transform:translateX(-1.5px);pointer-events:none;z-index:2}
.ds-reel-marker::before,.ds-reel-marker::after{content:"";position:absolute;left:-10px;border-left:8.5px solid transparent;border-right:8.5px solid transparent}
.ds-reel-marker::before{top:-1px;border-top:12px solid #bf170d}
.ds-reel-marker::after{bottom:-1px;border-bottom:12px solid #bf170d}
.ds-reel-fade{position:absolute;top:0;bottom:0;width:70px;pointer-events:none;z-index:1}
.ds-reel-fade-l{left:0;background:linear-gradient(90deg,#efe7d6,rgba(239,231,214,0))}
.ds-reel-fade-r{right:0;background:linear-gradient(270deg,#efe7d6,rgba(239,231,214,0))}
.ds-reel-result{display:flex;align-items:center;gap:14px;margin:14px 20px 0;padding:10px 14px;background:#fdf6e3;border:1px solid #e8d7a6}
.ds-reel-result .ds-tile-art,.ds-reel-result .ds-tile-coin{width:auto}
.ds-reel-result .ds-tile-coin{width:48px;height:48px}
.ds-reel-result-text{display:flex;flex-direction:column;line-height:1.3}
.ds-reel-result-text small{color:#7a6a58;text-transform:uppercase;letter-spacing:.06em;font-size:11px}
.ds-reel-result-text strong{font-size:18px;color:#2b2118}
.ds-reel-result-text span{color:#5b4c3b;font-size:13px}

.ds-panel{margin-bottom:18px;padding:18px 20px 20px;background:#fff;border:1px solid #d6cbb8}
.ds-sub{margin:4px 0 14px;color:#5b4c3b}
.ds-challenges{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.ds-challenge-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:5px;font-weight:bold}
.ds-challenge-num{font-variant-numeric:tabular-nums;color:#4d4131;font-weight:normal}
.is-complete .ds-challenge-num{color:#256a29;font-weight:bold}
.ds-check{color:#256a29}
.ds-bar{height:12px;background:#e6e0d3;border:1px solid #cfc4af;overflow:hidden}
.ds-bar span{display:block;height:100%;background:#bf170d;transition:width .5s ease}
.is-complete .ds-bar span{background:#2f7a32}

.ds-coll-name{margin:4px 0 0;font:bold 26px/1.1 CokeDisplay,Impact,sans-serif;color:#b51109;text-transform:uppercase}
.ds-items{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.ds-item{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#faf6ef;border:1px solid #e3dccd;min-height:64px}
.sp-art{width:48px;height:48px;object-fit:contain;image-rendering:pixelated;flex:none}
.sp-art-missing{display:flex;align-items:center;justify-content:center;background:#e6e0d3;color:#7a6a58;font:bold 18px Arial,sans-serif;border-radius:4px}
.ds-item-name{font-size:13px;line-height:1.25;overflow-wrap:anywhere}
.ds-decis-badge{flex:none;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:#bf170d;color:#fff;font:bold 22px Arial,sans-serif;border-radius:50%}
.ds-next{margin:0;color:#5b4c3b}

@media(max-width:820px){.ds-spins{grid-template-columns:1fr}.ds-page{padding:8px 16px 28px}.ds-items{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))}}
@media(prefers-reduced-motion:reduce){.ds-card.is-revealed{animation:none}.ds-bar span{transition:none}.ds-tile{transition:none}}
