:root { --config-shell: min(1500px, calc(100% - clamp(28px, 6vw, 110px))); }
.configurator-page { min-height: 100vh; background: radial-gradient(circle at 8% 18%, rgba(255,106,0,.09), transparent 28%), radial-gradient(circle at 92% 72%, rgba(0,144,255,.08), transparent 30%), #050a0e; }
.config-header { min-height: 82px; width: var(--config-shell); margin: auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 2; }
.config-header-actions { display: flex; align-items: center; gap: 16px; }
.account-state { border: 1px solid #2a3a44; padding: 10px 13px; color: #77858e; font: 700 9px var(--heading); letter-spacing: 1px; }
.account-state.is-online { border-color: #315b42; color: var(--green); }
.config-shell { width: var(--config-shell); margin: auto; padding: clamp(45px, 6vw, 90px) 0 80px; }
.config-intro { display: grid; gap: 24px; }
.config-back { width: fit-content; color: #8b98a0; text-decoration: none; font: 700 10px var(--heading); letter-spacing: 1.2px; }
.config-game-heading { position: relative; isolation: isolate; min-height: clamp(250px, 31vw, 410px); display: flex; align-items: flex-end; overflow: hidden; border: 1px solid var(--line); padding: clamp(28px, 5vw, 64px); background: #071016; box-shadow: 0 28px 75px rgba(0,0,0,.38); }
.config-game-heading::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(2,7,10,.96) 0%, rgba(2,7,10,.76) 47%, rgba(2,7,10,.2) 100%), linear-gradient(0deg, rgba(2,7,10,.9), transparent 72%); pointer-events: none; }
.config-game-heading .game-art { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; clip-path: none; border: 0; background-size: cover !important; background-position: center; box-shadow: none; transform: none; filter: saturate(1.06) contrast(1.04); }
.config-game-heading .game-art::before { background: none; }
.config-game-heading .game-art::after { display: none; }
.config-game-heading > div { position: relative; z-index: 1; max-width: 780px; }
.config-game-heading small,.config-card small,.quote-card>small { color: var(--orange); font: 700 10px var(--heading); letter-spacing: 2px; }
.config-game-heading h1 { margin: 5px 0; font: 700 clamp(44px, 5vw, 76px)/.9 var(--heading); letter-spacing: -1px; }
.config-game-heading p { max-width: 680px; color: var(--muted); line-height: 1.6; }
.location-cards { display: flex; flex-wrap: wrap; gap: 10px; }
.location-cards article { min-width: 170px; padding: 13px 15px; border: 1px solid var(--line); background: #081117; display: flex; justify-content: space-between; gap: 20px; }
.location-cards b { font: 700 12px var(--heading); }.location-cards span { color: var(--green); font: 700 9px var(--heading); }.location-cards .is-full { color: #ff6d64; }.location-cards article.is-full { opacity: .62; border-color: #422b2b; }
.config-safety { margin: 0; color: #66747d; font-size: 10px; }
.config-workspace { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(330px, .6fr); gap: 16px; margin-top: 35px; align-items: start; }
.config-card,.quote-card { border: 1px solid var(--line); background: linear-gradient(145deg, #0d171e, #071016); box-shadow: 0 25px 70px rgba(0,0,0,.35); }
.config-card>header { padding: 26px 30px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.config-card h2,.quote-card h2 { margin: 5px 0 0; font: 700 28px var(--heading); }.config-card header>span { color: #64737d; font: 700 8px var(--heading); letter-spacing: 1px; }
.config-fields { padding: 26px 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; border-bottom: 1px solid var(--line); }
.config-fields .wide { grid-column: 1/-1; }.config-fields label,.config-notes { display: flex; flex-direction: column; gap: 8px; color: #aab4bb; font: 600 10px var(--heading); letter-spacing: .8px; }
.config-fields input,.config-fields select,.config-notes textarea { min-height: 48px; border: 1px solid #293a45; background: #071016; color: #e5ebef; padding: 0 14px; font: 500 13px var(--body); outline: none; }.config-notes textarea { padding: 13px; resize: vertical; }
.resource-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; padding: 26px 30px; }
.resource-controls label { border: 1px solid var(--line); background: #081118; padding: 20px; }.resource-controls label>span { display: flex; justify-content: space-between; margin-bottom: 20px; }.resource-controls b { font: 700 12px var(--heading); }.resource-controls output { color: var(--orange); font: 700 18px var(--heading); }
.resource-controls input { width: 100%; accent-color: var(--orange); }.config-notes { margin: 0 30px 30px; }
.quote-card { position: sticky; top: 20px; padding: 29px; }.quote-card dl { margin: 25px 0; border-block: 1px solid var(--line); }.quote-card dl>div { min-height: 55px; display: flex; justify-content: space-between; gap: 20px; align-items: center; border-bottom: 1px solid var(--line); }.quote-card dl>div:last-child { border: 0; }.quote-card dt { color: #75828b; font-size: 10px; }.quote-card dd { margin: 0; text-align: right; font: 600 11px var(--heading); }
.quote-price { display: flex; justify-content: space-between; gap: 20px; align-items: end; }.quote-price>span { display: flex; flex-direction: column; }.quote-price small { color: #75828b; font: 700 8px var(--heading); letter-spacing: 1px; }.quote-price em { color: var(--orange); font-size: 9px; font-style: normal; margin-top: 4px; }.quote-price b { font: 700 38px var(--heading); }
.quote-card>.btn { width: 100%; margin-top: 18px; }.quote-card>.btn:disabled { cursor: not-allowed; transform: none; filter: grayscale(.35); opacity: .58; box-shadow: none; }.quote-card>p { color: #6d7a83; font-size: 9px; line-height: 1.6; }
.config-message { display: none; margin-top: 18px; padding: 12px; border: 1px solid #344651; font-size: 10px; line-height: 1.5; }.config-message.is-visible { display: block; }.config-message.is-success { border-color: #315b42; color: var(--green); }.config-message.is-error { border-color: #6c3434; color: #ff8b83; }
@media(max-width: 900px) { .config-header { width: calc(100% - 28px); }.account-state,.config-header .btn { display: none; }.config-game-heading { min-height: 300px; }.config-workspace { grid-template-columns: 1fr; }.quote-card { position: static; }.config-card>header { align-items: flex-start; }.config-card header>span { display: none; } }
@media(max-width: 580px) { :root { --config-shell: calc(100% - 24px); }.config-header { min-height: 70px; }.config-header .logo { font-size: 22px; }.config-game-heading { min-height: 250px; padding: 24px 20px; }.config-game-heading::before { background: linear-gradient(0deg, rgba(2,7,10,.94) 0%, rgba(2,7,10,.65) 70%, rgba(2,7,10,.28) 100%); }.config-game-heading h1 { font-size: 44px; }.config-fields,.resource-controls { grid-template-columns: 1fr; padding: 20px; }.config-fields .wide { grid-column: auto; }.config-notes { margin: 0 20px 20px; }.quote-card { padding: 22px; } }
.custom-request-link{display:flex;flex-direction:column;gap:5px;margin-top:12px;padding:15px;border:1px solid #75411f;background:linear-gradient(90deg,rgba(255,101,0,.1),transparent);text-decoration:none}.custom-request-link span{color:#aab4ba;font-size:10px;line-height:1.5}.custom-request-link b{color:var(--orange);font:700 10px var(--heading);letter-spacing:.8px}.custom-request-link:hover{border-color:var(--orange);background:rgba(255,101,0,.12)}
.game-mod-support{margin-top:22px;border:1px solid rgba(71,205,235,.22);background:rgba(5,17,24,.72);padding:20px}.game-mod-support>small{color:#48cae4;font-weight:800;letter-spacing:.14em}.game-mod-support h2{font-size:20px;margin:6px 0}.game-mod-support>p{color:#9cb0bc;line-height:1.65;margin:0}.game-mod-modes{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.game-mod-modes span{border:1px solid rgba(255,101,0,.34);color:#ff9a55;padding:6px 9px;text-transform:uppercase;font:700 10px/1.2 Rajdhani,sans-serif;letter-spacing:.08em}.game-mod-support details{border-top:1px solid #20313a;padding-top:12px}.game-mod-support summary{cursor:pointer;color:#dfe8ed;font-weight:700}.game-mod-support dl{display:grid;gap:8px;margin:13px 0 0}.game-mod-support dl div{display:grid;grid-template-columns:minmax(95px,140px) 1fr;gap:12px}.game-mod-support dt{color:#ff7b23;font-weight:700}.game-mod-support dd{margin:0;color:#95a8b4;line-height:1.5}
@media(max-width:600px){.game-mod-support dl div{grid-template-columns:1fr;gap:2px}}
@media(max-width:430px){
  .config-header{gap:6px}
  .config-header .logo{min-width:0;font-size:18px}
  .config-header .iguana-mark{width:34px;height:34px;margin-right:6px;flex:0 0 34px}
  .config-header .logo small{display:none}
  .config-header-actions{flex:0 0 auto;gap:6px}
  .config-header-actions .ig-account-menu{flex:0 0 48px}
}
@media(max-width:360px){
  .config-header,.config-header-actions,.config-shell,.config-intro,.config-workspace,.config-card,.quote-card,.config-game-heading>div{min-width:0}
  .config-header{width:calc(100% - 20px)}
  .config-shell{width:calc(100% - 20px)}
  .config-header .logo{font-size:17px}
  .config-header .iguana-mark{width:30px;height:30px;flex-basis:30px}
  .config-header-actions{gap:4px}
  .config-game-heading{padding:22px 16px}
  .config-game-heading h1{font-size:clamp(34px,12vw,40px);overflow-wrap:anywhere}
  .location-cards article,.game-mod-support,.resource-controls label{min-width:0;max-width:100%}
  .game-mod-modes span{max-width:100%;overflow-wrap:anywhere}
  .quote-price{flex-wrap:wrap}
}
/* Local artwork contrast r1: preserve every original image and crop.
   Darken only the caption footprint, not the entire illustration.
   The picture and light caption keep identical contrast in both UI themes. */
body.ig-premium.configurator-page .config-game-heading::before {
  background: linear-gradient(90deg, rgba(2,7,10,.24), rgba(2,7,10,.06));
}
body.ig-premium.configurator-page .config-game-heading > div::before {
  content: "";
  position: absolute;
  inset: -.65rem -.85rem;
  z-index: -1;
  border-radius: .65rem;
  background: rgba(2,7,10,.78);
  box-shadow: 0 4px 18px #0002;
  pointer-events: none;
}
@media (max-width: 580px) {
  body.ig-premium.configurator-page .config-game-heading::before {
    background: linear-gradient(0deg, rgba(2,7,10,.24), rgba(2,7,10,.06));
  }
  body.ig-premium.configurator-page .config-game-heading > div::before {
    inset: -.55rem -.65rem;
  }
}
/* Do not reveal a stale game illustration or mod panel while unavailable. */
#config-game-art[hidden], #game-mod-support[hidden] { display: none !important; }
