/* Portfolio frame remains typographic; the voucher itself preserves the source design. */
.case-content .arena-bons{margin:42px 0;padding-top:8px;min-width:0}
.case-content .arena-bons>h3{margin-top:0}
.case-content .arena-bons .arena-bons-intro{margin:0 0 25px}
.arena-bons-nav{--arena-step-surface:#f7f7f7;--arena-step-border:#858585;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 24px;padding:0 0 12px;background:var(--bg)}
:root[data-theme=dark] .arena-bons-nav{--arena-step-surface:#101010;--arena-step-border:#777}
.arena-bons[data-arena-ready=true] .arena-bons-nav{position:sticky;top:48px;z-index:2;padding-top:8px}
.arena-bons .arena-bons-nav button{display:flex;align-items:center;gap:9px;min-width:44px;min-height:52px;padding:12px 14px;border:1px solid var(--arena-step-border);border-radius:2px;background:var(--arena-step-surface);color:var(--text);font:500 15px/1.5 SuisseIntl,Arial,sans-serif;text-align:left;cursor:pointer}
.arena-bons-nav button>span{font-size:11px;line-height:1.6;font-variant-numeric:tabular-nums}
.arena-bons .arena-bons-nav button[aria-pressed=true]{border-color:var(--text);background:var(--text);color:var(--bg)}
.arena-bons .arena-bons-nav button[aria-pressed=true]>span{color:inherit}
.arena-bons button:focus-visible,.arena-bons input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.arena-bons .arena-bons-nav button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* Keep the filled selection and complete borders under later ui-feedback.css rules. */
@media(hover:hover) and (pointer:fine){
  .arena-bons .arena-bons-nav button:hover:not(:active):not(:disabled):not([aria-disabled=true]){border-color:var(--accent);background:var(--watermark);color:var(--accent)}
  .arena-bons .arena-bons-nav button[aria-pressed=true]:hover:not(:active):not(:disabled):not([aria-disabled=true]){background:var(--text);color:var(--bg)}
}
@media(hover:none),(pointer:coarse){
  .arena-bons .arena-bons-nav button:hover:not(:active):not(:disabled):not([aria-disabled=true]){border-color:var(--arena-step-border);background:var(--arena-step-surface);color:var(--text)}
  .arena-bons .arena-bons-nav button[aria-pressed=true]:hover:not(:active):not(:disabled):not([aria-disabled=true]){border-color:var(--text);background:var(--text);color:var(--bg)}
}
.arena-bons-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px;align-items:start}
.arena-bons-explanations{min-width:0}
.case-content .arena-bons-step{margin:0 0 30px;min-width:0}
.case-content .arena-bons-step:last-child{margin-bottom:0}
.arena-bons-step-label{margin:0 0 15px;color:var(--muted);font:300 12px/1.6 SuisseIntl,Arial,sans-serif}
.case-content .arena-bons-step h4{margin:0 0 15px;font:300 24px/1.25 SuisseIntl,Arial,sans-serif;letter-spacing:-.02em;color:var(--text)}
.case-content .arena-bons-step p{margin:0 0 16px;font-size:15px;line-height:1.75;color:var(--muted)}
.arena-bons-proof{display:flex;flex-direction:column;gap:7px;margin-top:25px;padding:19px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font:300 14px/1.65 SuisseIntl,Arial,sans-serif;color:var(--muted)}
.arena-bons-proof>strong{font-weight:500;color:var(--text)}
.arena-bons-proof>span[aria-hidden]{color:var(--accent)}
.case-content .arena-bons-step .arena-bons-demo-explanation{margin:18px 0 0;font-size:12px;line-height:1.7}
.case-content .arena-bons-example{min-width:0;margin:0}
.case-content .arena-bons-example>figcaption{margin:0 0 13px;max-width:42ch;color:var(--muted);font:300 12px/1.65 SuisseIntl,Arial,sans-serif}
.arena-bons [hidden]{display:none!important}

/* Static adaptation of wm-design.css's original voucher, with invalid demo code. */
.arena-voucher{position:relative;overflow:hidden;isolation:isolate;border-radius:8px;color:#fff;background:#0b1f3a;box-shadow:0 18px 40px rgba(0,0,0,.22),0 2px 6px rgba(0,0,0,.14);font-family:SuisseIntl,Arial,sans-serif}
.arena-voucher[data-demo-redeemed=true]{filter:saturate(.72) brightness(.92)}
.arena-voucher-bg,.arena-voucher-bg-half{position:absolute;inset:0}
.arena-voucher-bg-half{overflow:hidden}
.arena-voucher-bg svg{display:block;width:100%;height:100%}
.arena-voucher-bg-de{clip-path:polygon(0 0,100% 0,0 100%)}
.arena-voucher-bg-opponent{clip-path:polygon(100% 0,100% 100%,0 100%)}
.arena-voucher-bg-tint{position:absolute;inset:0;background:linear-gradient(135deg,rgba(11,31,58,.34),rgba(11,31,58,.58));mix-blend-mode:multiply}
.arena-voucher-bg-diagonal{position:absolute;top:-14%;bottom:-14%;left:50%;width:2px;background:rgba(255,255,255,.56);box-shadow:0 0 20px rgba(0,0,0,.28);transform:rotate(45deg);transform-origin:center}
.arena-voucher-glass{position:relative;z-index:1;margin:12px;padding:18px 18px 16px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(11,31,58,.58);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);box-shadow:0 14px 34px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.18)}
.arena-voucher-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.arena-voucher-eyebrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;color:#FAEAA4;font:800 17px/1.1 SuisseIntl,Arial,sans-serif}
.arena-voucher-eyebrow small{color:rgba(255,255,255,.62);font:500 12px/1 SuisseIntl,Arial,sans-serif}
.arena-voucher-match{max-width:48%;color:rgba(255,255,255,.72);font:500 11px/1.25 SuisseIntl,Arial,sans-serif;text-align:right}
.arena-voucher-use-label{margin:0 0 8px;color:rgba(255,255,255,.82);font:800 12px/1.2 SuisseIntl,Arial,sans-serif;letter-spacing:.02em}
.arena-voucher-code-row{margin-bottom:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(0,0,0,.24)}
.arena-voucher-code-label{margin-bottom:5px;color:rgba(255,255,255,.56);font:700 9px/1 SuisseIntl,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.arena-voucher-code{display:block;color:#fff;font:600 12px/1.4 ui-monospace,"SF Mono",Menlo,monospace;white-space:normal;overflow-wrap:anywhere}
.arena-voucher-status{display:flex;align-items:center;gap:8px;min-height:20px;margin-bottom:16px;color:#bfe5c8;font:650 13px/1.3 SuisseIntl,Arial,sans-serif}
.arena-voucher-status>i{flex:0 0 auto;width:8px;height:8px;border-radius:999px;background:#2e7d4f;box-shadow:0 0 0 3px rgba(46,125,79,.25)}
.arena-voucher[data-demo-redeemed=true] .arena-voucher-status{color:rgba(255,255,255,.66)}
.arena-voucher[data-demo-redeemed=true] .arena-voucher-status>i{background:rgba(255,255,255,.34);box-shadow:none}
.arena-voucher-warn{margin-bottom:14px;padding:12px 14px 13px;border:1px solid rgba(214,88,36,.45);border-radius:8px;background:rgba(214,88,36,.16)}
.arena-voucher-warn-head{display:flex;align-items:center;gap:7px;margin-bottom:6px;color:#ffb68a;font:800 13px/1.2 SuisseIntl,Arial,sans-serif}
.case-content .arena-voucher-warn p{margin:0;color:rgba(255,255,255,.88);font:400 13px/1.45 SuisseIntl,Arial,sans-serif}
.arena-voucher-static-slide{position:relative;display:flex;align-items:center;justify-content:center;height:58px;padding-left:38px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(0,0,0,.34);color:rgba(255,255,255,.78);font:750 12px/1 SuisseIntl,Arial,sans-serif}
.arena-voucher-static-slide>span{position:absolute;left:4px;top:4px;display:grid;place-items:center;width:48px;height:48px;border-radius:999px;color:#0b1f3a;background:linear-gradient(180deg,#fff,#f3f3ee);font-size:24px;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.arena-voucher-demo-mark{margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.2);color:#FAEAA4;font:700 10px/1.5 SuisseIntl,Arial,sans-serif;letter-spacing:.06em;text-align:center}
.arena-voucher-success{margin:0 0 12px;padding:14px 12px;border:1px solid rgba(191,229,200,.36);border-radius:8px;color:#bfe5c8;background:rgba(191,229,200,.12);font:900 19px/1.1 SuisseIntl,Arial,sans-serif;letter-spacing:.02em;text-align:center}
.arena-voucher-used-note{display:grid;gap:6px;margin-bottom:14px;padding:18px 16px;border:1px solid rgba(191,229,200,.28);border-radius:8px;background:rgba(191,229,200,.12);text-align:center}
.arena-voucher-used-note strong{color:#bfe5c8;font:900 17px/1.1 SuisseIntl,Arial,sans-serif;text-transform:uppercase}
.arena-voucher-used-note>span{color:rgba(255,255,255,.72);font:650 13px/1.35 SuisseIntl,Arial,sans-serif}

/* A genuine native range control demonstrates only local presentation state. */
.arena-bons-local-controls{margin-top:16px}
.arena-bons-slider{--arena-progress:0%;position:relative;height:62px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:linear-gradient(90deg,rgba(231,230,96,.42) 0,rgba(250,234,164,.62) var(--arena-progress),rgba(0,0,0,.34) var(--arena-progress),rgba(0,0,0,.34) 100%)}
.arena-bons-slider label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-left:24px;color:rgba(255,255,255,.78);font:750 12px/1.4 SuisseIntl,Arial,sans-serif;pointer-events:none}
.arena-bons-slider input[type=range]{position:relative;display:block;appearance:none;-webkit-appearance:none;width:100%;height:60px;margin:0;padding:0 4px;border:0;border-radius:999px;background:transparent;cursor:ew-resize;touch-action:pan-y}
.arena-bons-slider input[type=range]::-webkit-slider-runnable-track{height:54px;background:transparent}
.arena-bons-slider input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:52px;height:52px;border:1px solid rgba(255,255,255,.8);border-radius:999px;background:linear-gradient(180deg,#fff,#f3f3ee);box-shadow:0 4px 14px rgba(0,0,0,.4)}
.arena-bons-slider input[type=range]::-moz-range-track{height:54px;background:transparent}
.arena-bons-slider input[type=range]::-moz-range-thumb{width:50px;height:50px;border:1px solid rgba(255,255,255,.8);border-radius:999px;background:linear-gradient(180deg,#fff,#f3f3ee);box-shadow:0 4px 14px rgba(0,0,0,.4)}
.arena-bons-slider input[type=range]:focus-visible{outline-color:#FAEAA4;outline-offset:-5px}
.arena-bons-slider input[type=range]:disabled{cursor:default;opacity:.55}
.case-content .arena-bons-slider-help{margin:10px 0 0;color:var(--muted);font:300 12px/1.65 SuisseIntl,Arial,sans-serif}
.arena-bons-demo-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.arena-bons-demo-buttons button{min-height:44px;margin:0;padding:8px 0;border:0;border-bottom:1px solid var(--rule);border-radius:0;background:transparent;color:var(--text);font:300 14px/1.5 SuisseIntl,Arial,sans-serif;text-align:left;cursor:pointer}
.arena-bons-demo-buttons button:hover{color:var(--accent);border-bottom-color:currentColor}
.arena-bons-demo-buttons button:disabled{color:var(--muted);cursor:default}
.case-content .arena-bons-local-status{min-height:3.3em;margin:15px 0 0;color:var(--muted);font:300 12px/1.65 SuisseIntl,Arial,sans-serif}
.arena-bons-nav button,.arena-bons-demo-buttons button{min-width:44px;touch-action:manipulation;transition:color 120ms linear,background-color 120ms linear,transform 120ms ease-out}
.arena-bons-nav button:active:not(:disabled),.arena-bons-demo-buttons button:active:not(:disabled){background:var(--watermark);color:var(--accent);transform:translateY(1px);transition-duration:0ms}
.arena-bons .arena-bons-nav button:active:not(:disabled):not([aria-disabled=true]){border-color:var(--accent);background:var(--watermark);color:var(--accent);transform:translateY(1px);transition-duration:0ms}
.arena-bons .arena-bons-nav button[aria-pressed=true]:active:not(:disabled):not([aria-disabled=true]){background:var(--text);color:var(--bg)}
.arena-bons-slider input[type=range]:active::-webkit-slider-thumb{background:#FAEAA4}
.arena-bons-slider input[type=range]:active::-moz-range-thumb{background:#FAEAA4}
@media(prefers-reduced-motion:reduce){
  .arena-bons-nav button,.arena-bons-demo-buttons button{transition:none}
  .arena-bons-nav button:active:not(:disabled),.arena-bons-demo-buttons button:active:not(:disabled){transform:none}
  .arena-bons .arena-bons-nav button{transition:none}
  .arena-bons .arena-bons-nav button:active:not(:disabled):not([aria-disabled=true]){transform:none}
}
@media(prefers-reduced-transparency:reduce){
  .arena-voucher-glass{background:#0b1f3a;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(prefers-contrast:more){
  .arena-voucher-glass{background:#0b1f3a;border-color:rgba(255,255,255,.7);-webkit-backdrop-filter:none;backdrop-filter:none}
  .arena-bons .arena-bons-nav button{border-color:var(--text)}
  .arena-bons-slider{border-color:#fff}
}
@media(max-width:680px){
  .arena-bons-layout{grid-template-columns:minmax(0,1fr);gap:24px}
  .arena-bons-nav{gap:10px}
  .arena-bons .arena-bons-nav button{padding:10px 7px;font-size:14px;gap:6px}
  .arena-bons-example{width:min(100%,390px);justify-self:center}
  .case-content .arena-bons-step h4{font-size:23px}
}
@media(max-width:360px){
  .arena-bons-nav{gap:7px}
  .arena-bons .arena-bons-nav button{font-size:13px;gap:4px}
  .arena-voucher-glass{margin:10px;padding:15px 13px}
  .arena-voucher-eyebrow{font-size:16px}
  .arena-voucher-warn{padding:11px}
  .arena-voucher-static-slide{font-size:11px}
}
