/* Event controls: chamfered metalwork, enamel surfaces and inventory slots.
   References: Granado Espada official homepage; Lost Ark package 260909. */
:root{--event-brass:#c6a76b;--event-gold:#e8d5a7;--event-navy:#122333}
.site-nav,.site-nav.is-scrolled{background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.3) 55%,rgba(0,0,0,0) 100%);border-bottom:0;box-shadow:none;backdrop-filter:none}
.brand-title{color:#dccda9}
.site-nav a,.site-nav button{text-shadow:0 1px 4px #0009}
.site-nav.is-over-paper .brand-title,.site-nav.is-over-paper .utility-link,.site-nav.is-over-paper .dismiss-today{color:#17272d;text-shadow:none}
.site-nav.is-over-paper .brand img,.site-nav.is-over-paper .utility-steam-icon{filter:brightness(.16)}
.site-nav.is-over-paper .brand-title,.site-nav.is-over-paper .dismiss-today{border-color:#17272d40}
/* Match the original legacy title's serif stack, weight and spacing. */
.hero-copy h1{font-family:"Cinzel","Times New Roman",serif;font-weight:700;line-height:.9;letter-spacing:0;text-transform:uppercase;color:#fff;text-shadow:0 1px 2px #031329aa,0 0 10px #acdfff99,0 0 26px #438fff80,0 0 56px #2868df59;animation:legacy-title-blue-light 6s ease-in-out infinite;animation-play-state:paused}
.hero-copy h1>span{color:inherit}
.is-cinema-running .hero-copy h1{animation-play-state:running}
@keyframes legacy-title-blue-light{
  0%,100%{text-shadow:0 1px 2px #031329aa,0 0 10px #acdfff99,0 0 26px #438fff80,0 0 56px #2868df59}
  50%{text-shadow:0 1px 2px #031329aa,0 0 13px #c3eaffb3,0 0 32px #58a8ff99,0 0 66px #317dec73}
}
.hero-edition{color:#c4c7cd}.hero-edition>span:first-child{color:#e5c98d}
/* Original Granado Espada raster sprite: play_button, x=0 y=145, 304x82. */
.hero-actions{width:min(100%,588px);gap:16px;margin-top:40px}
.game-cta{display:flex;position:relative;isolation:isolate;flex:1 1 0;min-width:0;min-height:82px;justify-content:center;gap:14px;padding:16px 24px;background:transparent;border:0;color:#ffe399;text-shadow:0 2px 4px #040a12;transition:filter .2s,transform .2s,color .2s}
.game-cta:before{content:"";position:absolute;inset:0;z-index:-1;background-image:url('assets/ge-ui/deco_img.png');background-size:156.9079% 909.7561%;background-position:0% 21.83735%;background-repeat:no-repeat;pointer-events:none}
.game-cta:after{content:"";position:absolute;inset:10px 29px;z-index:-2;background:linear-gradient(90deg,transparent,#101d2fc9 15%,#101d2fc9 85%,transparent);pointer-events:none;transition:background .2s}
.game-cta.hero-primary,.game-cta.hero-secondary{background:transparent;border:0;color:#ffe399}
.game-cta:hover,.game-cta.hero-primary:hover,.game-cta.hero-secondary:hover{background:transparent;border:0;color:#fff0bd;filter:brightness(1.18);transform:translateY(-2px)}
.game-cta:hover:after{background:linear-gradient(90deg,transparent,#3e3529d9 15%,#3e3529d9 85%,transparent)}
.game-cta:active{transform:translateY(1px);filter:brightness(.95)}
.game-cta:focus-visible{outline:2px solid #f5ddb0;outline-offset:5px}
.game-cta>.cta-label,.game-cta:hover>.cta-label{display:block;font-size:18px;font-weight:600;letter-spacing:.005em;line-height:1.4;transform:none}
/* Original header arrow frame: sprite x=151 y=10, 201x50. */
.utility-game{position:relative;isolation:isolate;min-width:154px;min-height:50px;padding:10px 23px 10px 13px;border:0;background:transparent;color:#ffe399;font-weight:600;text-shadow:0 1px 2px #000}
.utility-game:before{content:"";position:absolute;inset:0;z-index:-1;background-image:url('assets/ge-ui/deco_img.png');background-size:237.3134% 1492%;background-position:54.71014% 1.43678%;background-repeat:no-repeat}
.utility-game:hover{color:#fff0ba;background:transparent;border:0;filter:brightness(1.2)}
.utility-game:active{transform:translateY(1px)}
.utility-steam-icon{display:block;width:20px;height:19px;max-width:20px;object-fit:contain}
.utility-home{color:#e4d3ae;min-width:32px}
.dismiss-today{color:#b7bec5}.dismiss-today:hover{color:#f0dfb9}.dismiss-cross{font-size:18px;font-weight:300;line-height:1}
.motion-symbol{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;font-size:17px;line-height:1}
.collection-section{background:#efede4;border-top:1px solid #a99265}
.collection-section .eyebrow{color:#866532}.collection-section h2{color:#24363b}
.cat-filters{gap:8px;margin-bottom:22px}
.cat-filter{border-radius:0;border:1px solid #b8ad96;background:#e4e0d4;color:#4b514d;box-shadow:inset 0 0 0 2px #f2eee5}
.cat-filter:hover{background:#f4eddc;border-color:#9d8251;color:#25363b}
.cat-filter.is-active{background:#203440;border-color:#a68a56;color:#f2dfb9;box-shadow:inset 0 0 0 2px #11242e,inset 0 0 0 3px #a58b554d}
.cat-search{border-radius:0;border-color:#aea58f;background:#f9f6ed;box-shadow:inset 0 2px 5px #5d4f3110}
.cat-grid{gap:12px;border-top:0}.cat-card{border-bottom:0}
.cat-open{padding:16px 13px;gap:13px;border:1px solid #c7bca6;background:linear-gradient(120deg,#faf7ed,#eee9dc);box-shadow:inset 0 0 0 3px #f8f4ea;cursor:default;transition:none}
.cat-open:hover{background:linear-gradient(120deg,#faf7ed,#eee9dc)}
.cat-card:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.cat-art{width:56px;height:56px;flex-basis:56px;border:1px solid #a29378;background:linear-gradient(135deg,#243743,#121f2b);box-shadow:inset 0 0 0 2px #c5b48b4a,0 1px 0 #fff9}
.cat-art img{width:46px;height:46px;max-width:46px;max-height:46px}
.cat-category{font-size:12px;color:#82745b}.cat-copy strong{font-size:14px;font-weight:550;color:#2d383c}.cat-arrow{color:#967745}
.cat-more{border-radius:0;min-width:240px;min-height:50px;border:1px solid #a78c58;background:#263c45;color:#f0dfbd;box-shadow:inset 0 0 0 3px #18313a,inset 0 0 0 4px #c8b08155}
.cat-more:hover{background:#334e55;color:#fff1cf}
.rw-view-button,.cn-chapter-button,.rw-quick-button,.rw-filter{border-radius:0;transition:background .18s,border-color .18s,color .18s}
.rw-view-button,.cn-chapter-button{border:1px solid #c3a56c55;background:#101f2c;box-shadow:inset 0 0 0 2px #d6bd8910}
.rw-view-button.is-active,.cn-chapter-button.is-active{background:#34414a;border-color:#c4a66f;color:#f2d8a5;box-shadow:inset 0 0 0 2px #13212d,inset 0 0 0 3px #c4a66f52}
.rw-target-button,.cn-select-button,.rw-list-more{border-radius:0;border:1px solid #b7975f;background:#213640;color:#ead6aa;box-shadow:inset 0 0 0 2px #c5a36a1a}
.item-dialog{border-radius:0;border:1px solid #b49966;box-shadow:inset 0 0 0 4px #e9dfc9,0 28px 100px #03090db3}
.item-dialog-close{border:1px solid #ac9770;top:12px;right:13px;width:36px;height:36px;min-height:36px;background:#263c45;color:#f1ddac;font-size:23px;box-shadow:inset 0 0 0 2px #d9ba7f20}
.item-dialog-art{background:#20343f;border:1px solid #a99162;box-shadow:inset 0 0 0 3px #dfc89525}
@media(max-width:1100px){.game-cta{padding-inline:17px;gap:11px}.game-cta>.cta-label{font-size:17px}}
@media(max-width:720px){
  .hero-actions{gap:10px;margin-top:30px;width:100%}.game-cta{min-height:68px;padding:13px 16px;gap:9px}
  .game-cta>.cta-label,.game-cta:hover>.cta-label{font-size:14px;letter-spacing:-.025em}
  .game-cta:after{inset:10px 20px}
  .site-nav .utility-game{min-width:0;min-height:44px;padding:8px 15px 8px 9px;font-size:12px;gap:6px}
  .utility-steam-icon{width:17px;height:17px}.dismiss-cross{display:none}
  .cat-grid{gap:10px}.cat-open{padding:14px 12px}.cat-filter{padding:9px 11px;font-size:13px}.cat-filter-count{font-size:12px}
}
@media(max-width:380px){.game-cta{padding-inline:12px;gap:7px}.game-cta>.cta-label,.game-cta:hover>.cta-label{font-size:13px}.site-nav .utility-game{padding-inline:9px 14px;gap:5px}.utility-steam-icon{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){.hero-copy h1{animation:none}.game-cta,.utility-game,.cat-open,.cat-filter{transition:none}.game-cta:hover,.game-cta:active,.utility-game:active{transform:none}}
.motion-paused .hero-copy h1{animation:none}
.motion-paused .game-cta:hover,.motion-paused .game-cta:active,.motion-paused .utility-game:active{transform:none}
