.ongoing-events { max-width: 1800px; margin: 0 auto 22px; padding: 0 20px; }
#event-details, #events-list, #speed-server-transfer { scroll-margin-top: 24px; }
#event-details:focus, #events-list:focus { outline: none; }
.speed-event-announcement { display: flex; flex-direction: column; align-items: stretch; gap: 16px; max-width: 1800px; margin: 0 auto 22px; padding: 0 20px; }
.speed-event-announcement > .speed-event-announcement-card { width: 100%; min-width: 0; }
.speed-event-announcement > .character-transfer-card { order: -1; align-self: flex-end; width: 380px; max-width: 100%; }
.speed-event-announcement-card { display: grid; grid-template-columns: minmax(200px,34%) minmax(0,1fr); min-height: 170px; overflow: hidden; border: 1px solid #79603c; border-radius: 9px; background: linear-gradient(110deg,#302315,#171411); color: #e7d7bd; box-shadow: 0 4px 15px #0005; }
.speed-event-announcement-card > img { width: 100%; height: 100%; max-height: 220px; object-fit: cover; object-position: center; }
.speed-event-announcement-copy { align-self: center; padding: 24px 30px; }
.speed-event-announcement-copy h2 { margin: 8px 0 10px; font: 27px/1.3 Cinzel,serif; color: #f0d6a9; }
.speed-event-announcement-copy p { color: #c4b397; margin-bottom: 14px; line-height: 1.6; }
.speed-event-announcement-link { color: #e6c28a; }
.speed-event-announcement-card:hover { text-decoration: none; border-color: #d2a363; }
.speed-event-announcement-card:focus-visible, .character-transfer-card:focus-visible { outline: 2px solid #edcd92; outline-offset: 3px; }
.character-transfer-card { display: flex; align-items: center; gap: 12px; padding: 16px; margin: 0; border: 1px solid #696050; border-radius: 7px; background: linear-gradient(120deg,#2b2925,#1b1b1a); color: #dfd5c4; }
.character-transfer-copy { display: flex; flex-direction: column; min-width: 0; gap: 4px; }
.character-transfer-copy strong { color: #edd0a0; font-size: 17px; }
.character-transfer-copy span { font-size: 12px; }
.character-transfer-copy small { color: #b5ada1; font-size: 11px; }
.character-transfer-symbol { font-size: 32px; color: #d0ae76; }
.character-transfer-arrow { margin-left: auto; color: #d0ae76; font-size: 21px; }
.character-transfer-card:hover { text-decoration: none; border-color: #c0a16d; color: #efe3cf; background: #32302b; }
@media(max-width:600px) { .speed-event-announcement-card { grid-template-columns: 1fr; } .speed-event-announcement-card > img { height: 125px; } .speed-event-announcement-copy { padding: 20px; } .speed-event-announcement-copy h2 { font-size: 23px; } }
.promo-carousel-heading { display: flex; align-items: center; justify-content: space-between; padding: 0 52px; margin-bottom: 12px; }
.promo-carousel-heading h2 { margin: 0; color: #edd0a0; font: 18px/1.4 Cinzel, serif; text-shadow: 0 2px 8px #000; }
.promo-carousel-position { color: #d1b98f; font-size: 12px; font-variant-numeric: tabular-nums; }
.promo-carousel-layout { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; gap: 12px; }
.promo-event-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 18px) / 2); gap: 18px; list-style: none; padding: 0; margin: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.promo-event-track::-webkit-scrollbar { display: none; }
.promo-event-slide { min-width: 0; scroll-snap-align: start; }
.promo-event-card { display: grid; grid-template-columns: 38% minmax(0, 1fr); height: 100%; min-height: 178px; overflow: hidden; border: 1px solid #79603c; border-radius: 9px; background: linear-gradient(130deg, #302315, #171411); color: #e7d7bd; box-shadow: 0 4px 15px #0005; transition: border-color .18s, box-shadow .18s; }
.promo-event-card:hover { border-color: #d2a363; box-shadow: 0 5px 20px #0008; text-decoration: none; }
.promo-event-art { position: relative; min-width: 0; height: 100%; overflow: hidden; background: #17110d; }
.promo-event-art img { display: block; width: 100%; height: 100%; min-height: 178px; max-height: 220px; object-fit: cover; object-position: center; }
.promo-event-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 45%, #241b1370); pointer-events: none; }
.promo-event-art-contain { background: #190c10; }
.promo-event-art-contain img { object-fit: contain; }
.promo-event-art-contain::after, .promo-event-art-gallery::after { display: none; }
.promo-event-art-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: repeat(2,minmax(0,1fr)); gap: 4px; min-height: 178px; max-height: 220px; padding: 6px; background: #190c10; }
.promo-event-art-gallery img { min-height: 0; height: 100%; max-height: 100%; object-fit: contain; }
.promo-event-copy { display: flex; flex-direction: column; align-items: flex-start; padding: 18px; }
.promo-event-badge { display: inline-block; color: #e4bd7c; font-size: 10px; text-transform: uppercase; letter-spacing: 1.4px; }
.promo-event-copy h3 { margin: 8px 0; color: #f0d6a9; font: 18px/1.35 Cinzel, serif; }
.promo-event-copy p { margin: 0 0 12px; color: #c4b397; font-size: 12px; line-height: 1.6; }
.promo-event-more { color: #e6c28a; font-size: 11px; margin-top: auto; }
.promo-event-dates { display: block; color: #bca88d; font-size: 11px; line-height: 1.7; margin: 0 0 12px; font-variant-numeric: tabular-nums; }
.promo-event-dates-detail { padding: 16px 20px; margin: 18px 0; border: 1px solid #584531; border-radius: 5px; background: #282016; color: #ecd3ab; font-size:18px; font-weight:600; line-height:1.8; text-align:center; }
@media(max-width:600px) { .promo-event-dates-detail { font-size:16px; padding:14px 16px; } }
.promo-carousel-arrow { display: grid; place-items: center; width: 36px; height: 48px; padding: 0; border: 1px solid #8e6a39; border-radius: 7px; background: #231b13ed; color: #ebca91; font-size: 30px; line-height: 1; }
.promo-carousel-arrow:hover:not(:disabled) { background: #4a341d; border-color: #e2b676; }
.promo-carousel-arrow:disabled { opacity: .35; cursor: default; }
.promo-event-track:focus-visible, .promo-carousel-arrow:focus-visible, .promo-event-card:focus-visible { outline: 2px solid #edcd92 !important; outline-offset: 1px; }
.promo-events-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.promo-back-link { display: inline-block; color: #ddba82; margin-bottom: 20px; }
.promo-detail-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 24px; margin-bottom: 26px; }
.promo-detail-hero > img { display: block; width: 100%; max-height: 280px; object-fit: cover; border: 1px solid #79603c; border-radius: 8px; }
.promo-detail-hero > img.promo-detail-image-contain { width: auto; max-width: 100%; object-fit: contain; justify-self: center; }
.promo-detail-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 12px; border: 1px solid #79603c; border-radius: 8px; background: #190c10; }
.promo-detail-gallery img { display: block; width: 100%; height: 125px; object-fit: contain; }
.promo-detail-hero h3 { font: 22px/1.5 Cinzel, serif; color: #e8cfa5; margin: 12px 0; }
.promo-detail-period { color: #bdab8e; line-height: 1.7; }
.promo-detail-poster { margin: 0 0 26px; }
.promo-detail-poster img { display: block; width: 100%; height: auto; max-width: 1160px; margin: 0 auto; border: 1px solid #79603c; border-radius: 6px; }
.promo-detail-poster figcaption { color: #baa88d; font-size: 12px; line-height: 1.6; margin-top: 10px; text-align: center; }
.promo-detail-section { border-top: 1px solid #483724; padding: 18px 0 4px; }
.promo-detail-section h3 { color: #dbbc8b; font-size: 17px; margin: 0 0 10px; }
.promo-detail-section p { color: #c7baa6; line-height: 1.9; white-space: pre-line; }
.experience-pack-card { margin:26px 0; padding:26px; border:1px solid #977342; border-radius:9px; }
.experience-pack-card > header { display:flex; align-items:center; gap:18px; padding-bottom:18px; margin-bottom:20px; border-bottom:1px solid #59452e; }
.experience-pack-card h3 { margin:0; color:#f0d39e; }
.experience-pack-icon { color:#dfb979; font-size:32px; }
.experience-pack-card ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 30px; margin:0; padding-left:20px; color:#d4c5af; }
.experience-pack-card li { padding-left:4px; line-height:1.8; }
.experience-pack-card li::marker { color:#d9b471; }
.experience-pack-card .experience-pack-items { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:14px; padding:0; list-style:none; }
.experience-pack-items li { display:flex; flex-direction:column; align-items:center; text-align:center; min-width:0; padding:18px 12px; border:1px solid #655034; border-radius:7px; }
.experience-pack-item-art { display:grid; place-items:center; width:90px; height:90px; margin-bottom:14px; }
.experience-pack-item-art img { width:80px; height:80px; object-fit:contain; }
.experience-pack-item-art .glyphicon { color:#d9b471; font-size:38px; }
.experience-pack-items strong { color:#edd1a6; font-size:14px; line-height:1.6; }
.experience-pack-items small { display:block; margin-top:auto; padding-top:10px; color:#c5b69b; }
@media(max-width:650px) { .experience-pack-card { padding:20px; } .experience-pack-card ul { grid-template-columns:1fr; } }
.double-reward-highlight { display:grid; grid-template-columns:140px minmax(0,1fr); align-items:center; gap:28px; padding:30px; margin:28px 0 36px; border:1px solid #b78b43; border-radius:10px; background:transparent; }
.double-reward-multiplier { display:grid; place-items:center; width:140px; height:140px; border:1px solid #b78b4366; border-radius:50%; color:#ffe1a1; background:transparent; font:700 72px/1 Georgia,serif; }
.double-reward-highlight h3 { margin:0 0 16px; color:#f7d791; }
.double-reward-highlight p { margin:0; line-height:1.8; white-space:pre-line; }
.double-reward-events { margin:0 0 30px; }
.double-reward-events > header { display:flex; align-items:center; justify-content:center; gap:18px; margin-bottom:26px; }
.double-reward-events > header h3 { flex:0 1 auto; margin:0; color:#edce99; text-align:center; }
.double-reward-divider { flex:1; height:1px; background:linear-gradient(90deg,transparent,#96713d); }
.double-reward-divider:last-child { transform:rotate(180deg); }
.double-reward-event-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.double-reward-event-grid:has(> :nth-child(4):last-child) { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:650px) { .double-reward-event-grid:has(> :nth-child(4):last-child) { grid-template-columns:1fr; } }
.double-reward-event-card { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; min-width:0; padding:28px 18px 22px; border:1px solid #80613b; border-radius:9px; background:transparent; overflow:hidden; }
.double-reward-event-icon { display:grid; place-items:center; width:72px; height:72px; margin-bottom:20px; color:#edc57c; border:1px solid #98714277; border-radius:14px; background:transparent; }
.double-reward-event-icon svg { width:40px; height:40px; }
.double-reward-event-card h4 { margin:0 0 22px; color:#edd2a7; }
.double-reward-event-label { margin-top:auto; color:#c7b28f; font-size:14px; }
.double-reward-event-value { display:block; color:#ffdf9e; font:700 40px/1.4 Georgia,serif; }
@media(max-width:650px) { .double-reward-highlight { grid-template-columns:1fr; justify-items:center; text-align:center; padding:24px 20px; gap:18px; } .double-reward-multiplier { width:110px; height:110px; font-size:56px; } .double-reward-event-grid { grid-template-columns:1fr; } }
.golden-participation { margin:24px 0 34px; }
.golden-participation > header { text-align:center; margin-bottom:24px; }
.golden-participation > header > span { color:#b99a63; font-size:10px; letter-spacing:2px; }
.golden-participation > header h3 { margin:8px 0 10px; color:#f0d39e; font:25px/1.4 Cinzel,serif; }
.golden-participation > header p { color:#bcad95; font-size:14px; }
.golden-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px; list-style:none; padding:0; margin:0; }
.golden-step { position:relative; padding:20px 15px; text-align:center; border:1px solid #7c6038; border-radius:9px; background:linear-gradient(150deg,#302719,#191613); min-width:0; }
.golden-step-number { display:block; color:#ebcb91; font:18px/1.4 Cinzel,serif; padding-bottom:12px; border-bottom:1px solid #665031; }
.golden-step-icon { display:grid; place-items:center; width:68px; height:68px; margin:20px auto; border:1px solid #705632; border-radius:12px; color:#edc878; background:#b58a3610; }
.golden-step-icon svg { width:42px; height:42px; }
.golden-step h4 { margin:0 0 10px; color:#f0d7ac; font:600 16px/1.5 'PT Sans',sans-serif; }
.golden-step p { margin:0; color:#bdae99; font-size:13px; line-height:1.7; }
.golden-step-arrow { position:absolute; right:-24px; top:50%; transform:translateY(-50%); color:#dfb865; font-size:28px; line-height:1; }
.golden-restrictions { margin-top:26px; padding:24px; border:1px solid #745536; border-left:3px solid #d6ad67; border-radius:6px; background:#251d16; text-align:center; }
.golden-restrictions h4 { margin:0 0 12px; color:#ebcb91; font-size:20px; }
.golden-restrictions p { margin:0 0 18px; color:#c5b59c; font-size:15px; line-height:1.7; }
.golden-restrictions ul { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; padding:0; margin:0; list-style:none; }
.golden-restrictions li { padding:7px 12px; border:1px solid #59462f; border-radius:4px; color:#e1c9a3; font-size:14px; }
.golden-invocation { margin-top:28px; padding:24px; border:1px solid #7c6038; border-radius:9px; background:#1c1813; }
.golden-invocation > h3 { margin:0 0 12px; color:#f0d39e; font:22px/1.4 Cinzel,serif; text-align:center; }
.golden-invocation > p { margin:0 0 24px; color:#bcad95; font-size:14px; line-height:1.7; text-align:center; }
.golden-summon-chain { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:24px; padding:0; margin:0; list-style:none; }
.golden-summon-chain > li { position:relative; min-width:0; padding:18px 12px; border:1px solid #655034; border-radius:7px; background:linear-gradient(150deg,#302719,#191613); text-align:center; }
.golden-invocation-number { color:#bda06a; font-size:11px; }
.golden-book-icon { display:block; width:40px; height:40px; margin:16px auto; color:#e6bd71; }
.golden-summon-chain h4 { margin:0 0 12px; color:#f0d7ac; font:600 15px/1.5 'PT Sans',sans-serif; }
.golden-summon-chain p { margin:0; color:#bcad95; font-size:12px; line-height:1.7; }
.golden-summon-chain p strong { color:#ddc49a; font-weight:400; }
.golden-monsters { margin-top:32px; }
.golden-monsters > header { text-align:center; margin-bottom:24px; }
.golden-monsters > header h3 { margin:0 0 10px; color:#f0d39e; font:23px/1.4 Cinzel,serif; }
.golden-monsters > header p { color:#bba78a; font-size:12px; }
.golden-monster-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(160px,240px); gap:28px; align-items:center; margin-bottom:20px; padding:24px; border:1px solid #795b32; border-radius:9px; background:linear-gradient(140deg,#2a2218,#191613); }
.golden-monster-rewards { min-width:0; }
.golden-monster-rewards h4 { margin:0 0 18px; padding-bottom:14px; border-bottom:1px solid #624b2e; color:#efcc8b; font:24px/1.4 Cinzel,serif; }
.golden-monster-rewards ul { columns:2; column-gap:28px; padding-left:18px; margin:0; }
.golden-monster-rewards li { break-inside:avoid; padding:0 0 8px 3px; color:#d4c5af; font-size:14px; line-height:1.7; overflow-wrap:anywhere; }
.golden-monster-rewards li::marker { color:#d4a85f; }
.golden-monster-rewards > p { color:#bcad95; }
.golden-monster-description { margin:0 0 16px; line-height:1.8; white-space:pre-line; }
.golden-monster-portrait { display:block; width:100%; height:auto; max-height:360px; object-fit:contain; border-radius:5px; }
@media(max-width:650px) { .golden-monster-card { grid-template-columns:1fr; padding:18px; gap:22px; } .golden-monster-rewards ul { columns:1; } .golden-monster-portrait { max-width:240px; justify-self:center; } }
@media(max-width:900px) { .golden-invocation { padding:20px 16px; } .golden-summon-chain { grid-template-columns:1fr; gap:30px; } .golden-summon-chain .golden-step-arrow { right:auto; left:50%; top:auto; bottom:-28px; transform:translateX(-50%) rotate(90deg); } }
@media(max-width:760px) { .golden-steps { grid-template-columns:1fr; gap:30px; } .golden-step { padding:18px; } .golden-step-icon { margin:14px auto; } .golden-step-arrow { right:auto; left:50%; top:auto; bottom:-28px; transform:translateX(-50%) rotate(90deg); } }
@media (max-width: 900px) { .promo-event-track { grid-auto-columns: 100%; } .promo-detail-hero { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .promo-event-card { transition: none; } }