/* Shared wheel presentation. Gameplay is handled by the existing wheel.js. */
html body.page-action-lucky_wheel { background:#f4f6fa !important; }
#wheel-experience {
  --wx-bg:#f4f6fa; --wx-surface:#fff; --wx-text:#17243c; --wx-muted:#526078;
  --wx-border:#e0e6ef; --wx-primary:#174ed8; --wx-accent:#f2ba3e;
  --wx-success:#147950; --wx-warning:#8a5b00; --wx-danger:#b42336;
  max-width:1230px; margin:28px auto 0; padding:0 16px 48px;
  color:var(--wx-text); font-size:16px; line-height:1.6;
}
#wheel-experience *, #wheel-experience *::before, #wheel-experience *::after {box-sizing:border-box;}
#wheel-experience h1,#wheel-experience h2,#wheel-experience h3 {color:var(--wx-text);line-height:1.25;letter-spacing:0;text-shadow:none;}
#wheel-experience button,#wheel-experience select {font:inherit;}
#wheel-experience a {text-decoration:none;}
#wheel-experience .wheel-breadcrumb {display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:20px;font-size:13px;color:var(--wx-muted);}
#wheel-experience .wheel-breadcrumb a {color:var(--wx-muted);}
#wheel-experience .wheel-breadcrumb a:hover {color:var(--wx-primary);}
#wheel-experience .wheel-hero {background:none;border:0;box-shadow:none;padding:0;border-radius:0;}
#wheel-experience .wheel-hero-copy {display:flex;align-items:center;justify-content:space-between;gap:24px;}
#wheel-experience .wheel-eyebrow {display:inline-flex;align-items:center;gap:8px;color:#845905;font-size:12px;font-weight:700;line-height:1.4;}
#wheel-experience .wheel-eyebrow i {color:#ad7706;}
#wheel-experience .wheel-hero-title {font-size:32px!important;font-weight:800!important;margin:8px 0 10px;}
#wheel-experience .wheel-hero-subtitle {font-size:16px!important;font-weight:400!important;color:var(--wx-muted);margin:0;max-width:660px;}
#wheel-experience .wheel-hero-text {min-width:0;}
#wheel-experience .wheel-hero-price {flex-shrink:0;text-align:right;padding-left:24px;border-left:1px solid var(--wx-border);}
#wheel-experience .wheel-price-label {display:block;color:var(--wx-muted);font-size:13px;font-weight:600;}
#wheel-experience .wheel-price-block {display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px;}
#wheel-experience .wheel-price-current {color:var(--wx-primary);font-weight:800;font-size:32px;line-height:1.2;font-variant-numeric:tabular-nums;}
#wheel-experience .wheel-price-original {color:var(--wx-muted);font-size:14px;text-decoration:line-through;}
#wheel-experience .wheel-price-sale {color:#714c00;background:#fff0c4;border:1px solid #f2db9b;border-radius:6px;font-weight:700;font-size:12px;padding:3px 7px;}
#wheel-experience .wheel-stats,#wheel-experience .wheel-btn-trial {display:none!important;}
#wheel-experience .wheel-ticker {display:flex;align-items:center;gap:12px;overflow:hidden;padding:12px 16px;margin-top:24px;background:#eaf0fc;border:1px solid #dce5f7;border-radius:10px;font-size:13px;color:#314b79;}
#wheel-experience .wheel-ticker-icon {flex:0 0 auto;color:var(--wx-primary);}
#wheel-experience .wheel-ticker-track {display:flex;gap:32px;min-width:0;white-space:nowrap;overflow-x:auto;scrollbar-width:none;}
#wheel-experience .wheel-ticker-track::-webkit-scrollbar {display:none;}
#wheel-experience .wheel-shell {display:flex;flex-direction:column;gap:24px;margin-top:20px;}
#wheel-experience .wheel-main-column {display:contents;}
#wheel-experience .wheel-main-card {order:0;border:1px solid var(--wx-border);border-radius:20px;background:var(--wx-surface);box-shadow:0 12px 36px #182e5710;overflow:hidden;}
#wheel-experience .wheel-stage {padding:0;background:none;}
#wheel-experience .wheel-stage-grid {display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);}
#wheel-experience .wheel-rotator-wrap {min-width:0;position:relative;display:flex;align-items:center;justify-content:center;min-height:490px;padding:28px;background:radial-gradient(ellipse at center,#fff 35%,#eaf2ff 100%);border-right:1px solid var(--wx-border);overflow:hidden;}
#wheel-experience .wheel-rotator-wrap::before {content:'';position:absolute;inset:24px;border:1px solid #d7e4f4;border-radius:50%;pointer-events:none;}
#wheel-experience .wheel-rotator-glow {display:none;}
#wheel-experience #rotate {position:relative;display:block;width:100%!important;max-width:450px!important;height:auto!important;object-fit:contain;filter:drop-shadow(0 12px 14px #142e5220);}
#wheel-experience .wheel-controls {padding:32px;display:flex;flex-direction:column;justify-content:center;gap:18px;min-width:0;}
#wheel-experience .wheel-section-title {font-size:24px;margin:0;font-weight:800;}
#wheel-experience .wheel-comment-text {color:var(--wx-muted);font-size:16px;line-height:1.65;margin:0;}
#wheel-experience .wheel-unit-price {border-bottom:1px solid var(--wx-border);padding-bottom:18px;}
#wheel-experience .wheel-unit-price .wheel-price-current {font-size:38px;}
#wheel-experience .wheel-pill-row {display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--wx-muted);}
#wheel-experience .wheel-pill {display:inline-flex;align-items:center;gap:6px;}
#wheel-experience .wheel-pill i {color:var(--wx-primary);}
#wheel-experience .wheel-field label {display:block;font-weight:700;font-size:14px;margin-bottom:8px;}
#wheel-experience .wheel-qty {width:100%;height:50px;border:1px solid #c8d3e3;border-radius:10px;background:#fff;color:var(--wx-text);padding:0 14px;cursor:pointer;}
#wheel-experience .wheel-total {display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--wx-muted);font-size:14px;}
#wheel-experience .wheel-total output {font-size:22px;font-weight:800;color:var(--wx-text);font-variant-numeric:tabular-nums;}
#wheel-experience .wheel-btn-stack {display:grid;gap:10px;}
#wheel-experience .wheel-btn {display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:54px;padding:12px 18px;border:0;border-radius:10px;font-size:17px;font-weight:700;cursor:pointer;transition:background .18s,box-shadow .18s;}
#wheel-experience .wheel-btn-real {background:var(--wx-primary);color:#fff;box-shadow:0 7px 14px #174ed824;}
#wheel-experience .wheel-btn-real:hover {background:#123caf;box-shadow:0 8px 18px #174ed836;}
#wheel-experience button:focus-visible,#wheel-experience select:focus-visible,#wheel-experience a:focus-visible {outline:3px solid #e6a920;outline-offset:3px;}
#wheel-experience .wheel-side-column {order:1;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;min-width:0;align-items:start;}
#wheel-experience .wheel-side-card,#wheel-experience .wheel-review-card,#wheel-experience .wheel-related-card {padding:24px;background:var(--wx-surface);border:1px solid var(--wx-border);border-radius:16px;min-width:0;box-shadow:none;margin:0;}
#wheel-experience .wheel-side-tabs {display:flex;gap:8px;padding:4px;background:#f0f3f8;border-radius:10px;margin-bottom:20px;}
#wheel-experience .wheel-side-tab {flex:1;min-height:44px;border:0;border-radius:7px;background:transparent;color:var(--wx-muted);font-size:14px;font-weight:700;cursor:pointer;}
#wheel-experience .wheel-side-tab.active {background:#fff;color:var(--wx-primary);box-shadow:0 2px 5px #1b315610;}
#wheel-experience .wheel-side-panel {display:none;}
#wheel-experience .wheel-side-panel.active {display:block;}
#wheel-experience .wheel-top-title {font-size:18px;font-weight:800;margin:0 0 12px;color:var(--wx-text);}
#wheel-experience .wheel-top-list,#wheel-experience .wheel-history-list {list-style:none;padding:0;margin:0;max-height:300px;overflow:auto;scrollbar-width:thin;}
#wheel-experience .wheel-history-list li {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:12px 0;border-bottom:1px solid #edf0f5;}
#wheel-experience .wheel-top-list li {display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0f5;}
#wheel-experience .wheel-history-list li:last-child,#wheel-experience .wheel-top-list li:last-child {border:0;}
#wheel-experience .wheel-player-name {font-weight:700;font-size:14px;color:var(--wx-text);overflow-wrap:anywhere;}
#wheel-experience .wheel-history-meta,#wheel-experience .wheel-player-note {color:var(--wx-muted);font-size:13px;line-height:1.6;overflow-wrap:anywhere;}
#wheel-experience .wheel-rank {display:grid;place-items:center;width:30px;height:30px;border-radius:8px;color:#845905;background:#fff2cf;font-size:13px;font-weight:800;}
#wheel-experience .wheel-player-score {color:var(--wx-primary);font-weight:700;}
#wheel-experience .wheel-rules {color:var(--wx-muted);line-height:1.8;font-size:16px;overflow-wrap:anywhere;white-space:pre-line;}
#wheel-experience .wheel-steps {list-style:none;counter-reset:steps;margin:0 0 20px;padding:0;display:grid;gap:16px;}
#wheel-experience .wheel-steps li {counter-increment:steps;display:flex;gap:12px;align-items:start;font-size:14px;color:var(--wx-muted);}
#wheel-experience .wheel-steps li::before {content:counter(steps,decimal-leading-zero);flex:0 0 28px;color:var(--wx-primary);font-weight:800;}
#wheel-experience .wheel-steps strong {display:block;color:var(--wx-text);font-weight:700;}
#wheel-experience .wheel-review-card {order:2;}
#wheel-experience .wheel-review-head {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px;}
#wheel-experience .wheel-review-head h3 {font-size:18px;margin:0;font-weight:700;}
#wheel-experience .wheel-review-score {color:#976b04;white-space:nowrap;}
#wheel-experience .wheel-review-card p {font-size:16px;color:var(--wx-muted);margin:0;}
#wheel-experience .wheel-review-author {font-size:13px;color:var(--wx-muted);margin-top:10px;}
#wheel-experience .wheel-related-card {order:3;}
#wheel-experience .wheel-related-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;}
#wheel-experience .wheel-related-item {display:grid;gap:8px;min-width:0;color:var(--wx-text);padding:12px;border:1px solid var(--wx-border);border-radius:12px;transition:border-color .18s;}
#wheel-experience .wheel-related-item:hover {border-color:var(--wx-primary);}
#wheel-experience .wheel-related-thumb {display:block;aspect-ratio:16/10;overflow:hidden;background:#f1f5fb;border-radius:8px;}
#wheel-experience .wheel-related-thumb img {display:block;width:100%;height:100%;object-fit:cover;}
#wheel-experience .wheel-related-name {font-size:16px;font-weight:700;}
#wheel-experience .wheel-related-meta {font-size:13px;color:var(--wx-muted);}
#wheel-experience .wheel-related-price {display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--wx-primary);font-size:20px;font-weight:800;}
#wheel-experience .wheel-related-price del {font-size:13px;font-weight:400;color:var(--wx-muted);}
@media (max-width:900px) {
  #wheel-experience .wheel-stage-grid {grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);}
  #wheel-experience .wheel-rotator-wrap {padding:16px;min-height:360px;}
  #wheel-experience .wheel-controls {padding:24px;gap:16px;}
  #wheel-experience .wheel-hero-title {font-size:28px!important;}
  #wheel-experience .wheel-hero-price {display:none;}
}
@media (max-width:680px) {
  #wheel-experience {margin-top:18px;padding:0 12px 32px;}
  #wheel-experience .wheel-breadcrumb {margin-bottom:16px;}
  #wheel-experience .wheel-hero-title {font-size:26px!important;}
  #wheel-experience .wheel-ticker {margin-top:18px;}
  #wheel-experience .wheel-shell {gap:16px;margin-top:16px;}
  #wheel-experience .wheel-stage-grid,#wheel-experience .wheel-side-column {grid-template-columns:1fr;}
  #wheel-experience .wheel-side-column {gap:16px;}
  #wheel-experience .wheel-rotator-wrap {min-height:0;padding:18px;border-right:0;border-bottom:1px solid var(--wx-border);}
  #wheel-experience #rotate {max-width:340px!important;}
  #wheel-experience .wheel-controls {padding:20px;}
  #wheel-experience .wheel-unit-price .wheel-price-current {font-size:32px;}
  #wheel-experience .wheel-side-card,#wheel-experience .wheel-review-card,#wheel-experience .wheel-related-card {padding:20px;}
  #wheel-experience .wheel-related-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  #wheel-experience .wheel-related-name {font-size:14px;}
  #wheel-experience .wheel-review-head {align-items:start;flex-direction:column;gap:8px;}
}
@media (prefers-reduced-motion:reduce) {#wheel-experience * {scroll-behavior:auto;transition:none!important;animation:none!important;}}
