/* A single native dialog owns the existing reward content. */
html:has(#bonusDialog){scrollbar-gutter:stable}
html.bonus-modal-open,body.aw-bonus-open{overflow:hidden}
#bonusDialog:not([open]){display:none}
#bonusDialog{width:min(1040px,calc(100% - 64px));height:min(80dvh,760px);max-height:calc(100dvh - 48px);padding:0;margin:auto;border:1px solid #bfa9bc45;border-radius:6px;background:#15131a;color:#dfd6cd;overflow:hidden;box-shadow:0 24px 90px #05040bcc;font-family:Onest,Arial,sans-serif}
#bonusDialog::backdrop{background:#08070c96}
#bonusDialog .bonus-modal-shell{display:flex;flex-direction:column;height:100%;min-height:0}
#bonusDialog[open] .bonus-modal-shell{animation:aw-bonus-panel-in .23s cubic-bezier(.2,.65,.2,1)}
#bonusDialog .bonus-modal-bar{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:20px;min-height:52px;padding:8px 16px 8px 28px;background:#100e15;border-bottom:1px solid #d4bdce25}
#bonusDialog .bonus-modal-bar>p{font:500 11px/1.5 Unbounded,sans-serif;color:#ddc6d6;margin:0}
#bonusDialog .bonus-modal-controls,#bonusDialog .bonus-modal-languages{display:flex;align-items:center;gap:12px}
#bonusDialog .bonus-modal-languages{gap:9px}
#bonusDialog .bonus-modal-languages .lang-btn{width:30px;height:30px;padding:0;border:0;border-bottom:1px solid transparent;border-radius:0;background:none;color:#a694aa;font:500 10px/1.5 Onest,sans-serif;filter:none;box-shadow:none;cursor:pointer}
#bonusDialog .bonus-modal-languages .lang-btn.active{color:#ebd8e4;border-bottom-color:#c393a1}
#bonusDialog .bonus-modal-close{position:relative;isolation:isolate;width:36px;height:34px;padding:0;border:0;background:none;color:#e3cddd;font:400 25px/1 Onest,sans-serif;cursor:pointer;flex-shrink:0}
#bonusDialog .bonus-modal-close::before{content:'';position:absolute;inset:0;z-index:-1;background:url('../img/immersive/action-panel-v6.png') center/120% 200% no-repeat;filter:brightness(.22) saturate(.3);clip-path:polygon(0 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%)}
#bonusDialog .bonus-modal-close:hover::before{filter:brightness(.3) saturate(.3)}
#bonusDialog .bonus-modal-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#806879 #15131a}
#bonusDialog #bonus-start{overflow:visible;border-bottom:0;scroll-margin-top:0}
#bonusDialog #bonus-start .aw-spread{padding:25px 32px 28px}
#bonusDialog #bonus-start h2{font-size:50px;max-width:none}
#bonusDialog #bonus-start .aw-spread-heading{gap:24px}
#bonusDialog #bonus-start .aw-creation-label{font-size:11px;margin-bottom:10px}
#bonusDialog #bonus-start time strong{font-size:48px}
#bonusDialog #bonus-start time{gap:12px}
#bonusDialog #bonus-start time span{font-size:10px}
#bonusDialog #bonus-start .aw-creation-lead{font-size:12px;margin-top:14px;max-width:78ch}
#bonusDialog #bonus-start .aw-gifts{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
#bonusDialog #bonus-start .aw-gift-art{height:175px;transform:none}
#bonusDialog #bonus-start .aw-gift-title{font-size:25px;min-height:2.32em}
#bonusDialog #bonus-start .aw-gift-caption{font-size:11px;min-height:3.2em;margin-top:6px}
#bonusDialog #bonus-start .aw-gift-term{font-size:9px}
#bonusDialog #bonus-start .aw-thread{display:none}
#bonusDialog #bonus-start .aw-selection-hint{margin:12px 0 15px;font-size:10px}
#bonusDialog #bonus-start .aw-reward-panel{min-height:80px;padding-top:15px}
#bonusDialog #bonus-start .aw-reward-panel>h3{font-size:18px}
#bonusDialog #bonus-start .aw-support{margin-top:22px;padding-top:20px}
#bonusDialog #bonus-start .aw-code-gifts{margin-top:28px;padding-top:24px}
#bonusDialog #bonus-start .aw-code-heading{align-items:flex-start;gap:30px}
#bonusDialog #bonus-start .aw-code-heading h3{font-size:32px}
#bonusDialog #bonus-start .aw-code-heading>p{font-size:12px;max-width:47ch}
#bonusDialog #bonus-start .aw-join{margin-top:26px}
#bonusDialog #bonus-start :is(.bonus-item__summary,.aw-code-fold,.aw-reward-panel){scroll-margin-top:16px}
#bonusDialog :is(button,a,summary,[tabindex]):focus-visible{outline:2px solid #dfb7c8;outline-offset:3px}
body.immersive-home .hero-bonus-entry{display:flex;flex-direction:column;align-items:center;gap:6px;width:min(520px,100%);margin-top:13px}
body.immersive-home .hero-bonus-entry>p{margin:0;color:#cbb8ca;font:400 10px/1.5 Onest,sans-serif}
body.immersive-home .hero-bonus-open{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:11px;width:280px;max-width:100%;height:46px;padding:10px 16px;background:none;border:0;border-radius:0;box-shadow:none;text-shadow:none;color:#eddce7;font:500 10px/1.5 Unbounded,sans-serif;letter-spacing:0;filter:none;cursor:pointer}
body.immersive-home .hero-bonus-open::before{content:'';position:absolute;inset:0;z-index:-1;background:url('../img/immersive/action-panel-v6.png') center/120% 200% no-repeat;clip-path:polygon(0 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%);filter:brightness(.25) saturate(.3);pointer-events:none;transition:filter .2s}
body.immersive-home .hero-bonus-open:hover::before{filter:brightness(.34) saturate(.3)}
body.immersive-home .hero-bonus-open img{width:20px;height:20px;object-fit:contain;opacity:.9}
body.immersive-home .hero-bonus-open:focus-visible{outline:2px solid #dfb7c8;outline-offset:4px}
@keyframes aw-bonus-panel-in{from{opacity:.3;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:700px) and (max-height:780px){#bonusDialog{height:calc(100dvh - 48px)}#bonusDialog #bonus-start h2{font-size:40px}#bonusDialog #bonus-start .aw-gift-art{height:125px}#bonusDialog #bonus-start .aw-gift-title{font-size:23px}#bonusDialog #bonus-start .aw-creation-lead{margin-top:10px}#bonusDialog #bonus-start .aw-spread{padding-top:20px}}
@media(max-width:699px){#bonusDialog{width:calc(100% - 24px);height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);border-radius:5px}#bonusDialog .bonus-modal-bar{min-height:48px;padding:7px 12px 7px 16px}#bonusDialog .bonus-modal-bar>p{font-size:10px}#bonusDialog .bonus-modal-controls{gap:9px}#bonusDialog #bonus-start .aw-spread{padding:23px 18px}#bonusDialog #bonus-start .aw-spread-heading{display:block}#bonusDialog #bonus-start h2{font-size:39px}#bonusDialog #bonus-start .aw-launch{margin-top:14px;text-align:left}#bonusDialog #bonus-start time strong{font-size:36px}#bonusDialog #bonus-start .aw-launch>p{font-size:9px}#bonusDialog #bonus-start .aw-gifts{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px}#bonusDialog #bonus-start .aw-gift-art{height:130px}#bonusDialog #bonus-start .aw-gift-title{font-size:23px}#bonusDialog #bonus-start .aw-gift-caption{font-size:10px}#bonusDialog #bonus-start .aw-gift-term{font-size:8px}#bonusDialog #bonus-start .aw-code-heading{display:block}#bonusDialog #bonus-start .aw-code-heading>p{max-width:none;margin-top:14px}#bonusDialog #bonus-start .aw-code-heading h3{font-size:30px}#bonusDialog #bonus-start .aw-code-bar{padding:13px}#bonusDialog #bonus-start .aw-join{gap:16px}#bonusDialog #bonus-start .aw-join p{font-size:23px}body.immersive-home .hero-bonus-entry{width:100%;margin-top:11px}body.immersive-home .hero-bonus-open{height:44px;width:280px;font-size:9px}}
@media(max-width:360px){#bonusDialog #bonus-start .aw-spread{padding-inline:14px}#bonusDialog #bonus-start h2{font-size:35px}#bonusDialog #bonus-start .aw-gift-art{height:115px}#bonusDialog #bonus-start .aw-gift-title{font-size:21px}body.immersive-home .hero-bonus-open{width:258px;font-size:9px}}
@media(prefers-reduced-motion:reduce){html:not([data-interaction-motion="full"]) #bonusDialog .bonus-modal-shell{animation:none!important}html:not([data-interaction-motion="full"]) .hero-bonus-open::before{transition:none!important}}/* Availability belongs to each code, while creation gifts stay separate. */
#bonusDialog .aw-bonus-nav{display:flex;flex-shrink:0;gap:22px;padding:0 28px;background:#151219;border-bottom:1px solid #d4bdce25}
#bonusDialog .aw-bonus-nav button{display:flex;align-items:center;gap:7px;min-height:41px;padding:8px 0;border:0;border-bottom:1px solid transparent;background:none;box-shadow:none;color:#aa99ad;font:500 11px/1.5 Onest,sans-serif;cursor:pointer}
#bonusDialog .aw-bonus-nav button.active{color:#e5cfdd;border-bottom-color:#c393a1}
#bonusDialog .aw-bonus-nav-count{font-size:9px;line-height:1.4;border:1px solid #ba91a540;padding:0 4px;color:#c3a6b7;border-radius:2px}
#bonusDialog #bonus-start .aw-campaign-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:22px;margin-top:22px}
#bonusDialog #bonus-start .aw-campaign{min-width:0;padding:21px 22px 18px;border:1px solid #d4bdce30;border-radius:4px;background:#18151b}
#bonusDialog #bonus-start .aw-campaign--upcoming{background:#1b161e;border-color:#c393a14d}
#bonusDialog #bonus-start .aw-campaign-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
#bonusDialog #bonus-start .aw-campaign h4{margin:0;color:#e4d9df;font:500 26px/1.15 Oswald,sans-serif}
#bonusDialog #bonus-start .aw-campaign-status{flex-shrink:0;display:inline-block;padding:4px 7px;font:500 9px/1.5 Onest,sans-serif;border:1px solid #c393a140;border-radius:3px;color:#d9aabe;background:#241c25}
#bonusDialog #bonus-start .aw-campaign-status[data-state=available]{background:#18201e;border-color:#8aaba340;color:#bbd1c8}
#bonusDialog #bonus-start .aw-campaign-status[data-state=expired]{color:#ac9aaa;background:#201c23;border-color:#a08a9930}
#bonusDialog #bonus-start .aw-campaign-status[data-state=pending]{color:#dbc8d3}
#bonusDialog #bonus-start .aw-campaign-date{margin:12px 0 0;color:#e0becf;font:500 11px/1.8 Onest,sans-serif}
#bonusDialog #bonus-start .aw-campaign-date>span{color:#baabbf;font-weight:400}
#bonusDialog #bonus-start .aw-campaign-date time{display:inline;font:inherit;white-space:normal}
#bonusDialog #bonus-start .aw-campaign-note{font:400 12px/1.7 Onest,sans-serif;color:#bba9bf;margin:13px 0 0}
#bonusDialog #bonus-start .aw-campaign .aw-code-bar{flex-direction:column;align-items:flex-start;gap:14px;padding:15px;margin-top:20px;background:#211924}
#bonusDialog #bonus-start .aw-campaign .aw-code-bar code{font-size:16px;letter-spacing:.035em}
#bonusDialog #bonus-start .aw-campaign .aw-code-copy{width:100%;height:46px}
#bonusDialog #bonus-start .aw-code-copy:disabled{color:#c7b3c2!important;cursor:default}
#bonusDialog #bonus-start .aw-code-copy:disabled::before{filter:brightness(.23) saturate(.3)}
#bonusDialog #bonus-start .aw-campaign .aw-code-fold{margin-top:7px}
#bonusDialog #bonus-start .aw-campaign .aw-code-fold>summary{font-size:12px}
#bonusDialog #bonus-start .aw-campaign .bonus-item__summary{padding:12px;gap:10px}
#bonusDialog #bonus-start .aw-campaign .bonus-item__head{gap:10px}
#bonusDialog #bonus-start .aw-campaign .bonus-item__toggle{display:none}
#bonusDialog #bonus-start .aw-campaign .bonus-item h3{font-size:13px}
#bonusDialog #bonus-start .aw-campaign .bonus-item__body{padding:14px}
#bonusDialog #bonus-start .aw-upcoming-gifts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:14px}
#bonusDialog #bonus-start .aw-upcoming-gifts figure{min-width:0;margin:0}
#bonusDialog #bonus-start .aw-upcoming-gifts img{display:block;width:100%;height:135px;object-fit:contain}
#bonusDialog #bonus-start .aw-upcoming-gifts strong{display:block;font:500 21px/1.2 Oswald,sans-serif;color:#dfd6cd;margin-top:7px}
#bonusDialog #bonus-start .aw-upcoming-gifts figcaption>span{display:block;color:#c6a6bb;font:500 10px/1.5 Onest,sans-serif;margin-top:6px}
#bonusDialog #bonus-start .aw-code-publication{display:flex;align-items:flex-start;gap:10px;padding:14px 15px;margin-top:20px;border:1px solid #b98ca13d;border-radius:4px;background:#211924;color:#cbb0c2}
#bonusDialog #bonus-start .aw-code-publication i{padding-top:4px;font-size:12px;opacity:.8}
#bonusDialog #bonus-start .aw-code-publication p{margin:0;font:400 12px/1.75 Onest,sans-serif}
#bonusDialog #bonus-start :is(#aw-upcoming-code-bar,#aw-upcoming-publication)[hidden]{display:none!important}
@media(max-width:799px){#bonusDialog #bonus-start .aw-campaign-grid{grid-template-columns:1fr}#bonusDialog #bonus-start .aw-upcoming-gifts img{height:155px}}
@media(max-width:699px){#bonusDialog .aw-bonus-nav{padding-inline:16px;gap:20px}#bonusDialog .aw-bonus-nav button{font-size:11px;min-height:39px}#bonusDialog #bonus-start .aw-campaign{padding:18px 16px}#bonusDialog #bonus-start .aw-campaign h4{font-size:24px}#bonusDialog #bonus-start .aw-campaign-top{flex-wrap:wrap;gap:10px}#bonusDialog #bonus-start .aw-campaign .aw-code-bar{padding:13px}#bonusDialog #bonus-start .aw-campaign .aw-code-bar code{font-size:14px}#bonusDialog #bonus-start .aw-upcoming-gifts{gap:14px}#bonusDialog #bonus-start .aw-upcoming-gifts img{height:120px}#bonusDialog #bonus-start .aw-upcoming-gifts strong{font-size:21px}#bonusDialog #bonus-start .aw-upcoming-gifts figcaption>span{font-size:9px}#bonusDialog #bonus-start .aw-campaign-status{font-size:10px}}
@media(max-width:360px){#bonusDialog #bonus-start .aw-campaign{padding-inline:13px}#bonusDialog #bonus-start .aw-upcoming-gifts img{height:95px}#bonusDialog #bonus-start .aw-upcoming-gifts strong{font-size:19px}#bonusDialog #bonus-start .aw-campaign .aw-code-bar code{font-size:13px}}
#bonusDialog #bonus-start .aw-campaign .aw-code-copy{width:min(244px,100%);height:52px}
#bonusDialog #bonus-start .aw-campaign .aw-code-copy::before{background:url('../img/immersive/action-panel-v6.png') center/120% 200% no-repeat!important}
