:root {
  --ink: #241b12;
  --ink-soft: #594735;
  --night: #11100e;
  --stone: #1d1a16;
  --stone-light: #2b261f;
  --wood: #2b1b11;
  --parchment: #d8c596;
  --parchment-light: #eee0b9;
  --gold: #c99b4b;
  --gold-light: #f0d28a;
  --rust: #8e3f27;
  --green: #496847;
  --text: #eadfca;
  --muted: #aa9d88;
  --border: rgba(201, 155, 75, .32);
  --shadow: 0 18px 60px rgba(0, 0, 0, .48);
  --serif: Georgia, 'Times New Roman', serif;
  --display: Palatino, 'Palatino Linotype', Georgia, serif;
}

* { box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; margin: 0; }
body {
  overflow: hidden;
  color: var(--text);
  background: var(--night);
  font-family: var(--serif);
  -webkit-font-smoothing: antialiased;
}
button, input, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.mobile-only { display: none !important; }

.atmosphere { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; background: radial-gradient(circle at 25% 20%, rgba(143,75,34,.22), transparent 28%), linear-gradient(135deg, #17130e, #080807 72%); }
.atmosphere::before {
  content: ''; position: absolute; inset: 0; opacity: .28;
  background-image: repeating-linear-gradient(8deg, transparent 0 13px, rgba(255,255,255,.012) 14px 15px), radial-gradient(circle at 50% 100%, rgba(99,72,34,.2), transparent 45%);
}
.mist { position: absolute; width: 75vw; height: 22vh; border-radius: 50%; filter: blur(45px); opacity: .12; background: #d4c7a2; animation: mistDrift 20s ease-in-out infinite alternate; }
.mist-one { left: -20vw; top: 62%; }
.mist-two { right: -30vw; top: 18%; animation-delay: -9s; animation-duration: 28s; }
.embers { position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,171,65,.7) 0 1px, transparent 1.5px); background-size: 77px 93px; opacity: .12; animation: emberRise 24s linear infinite; }
@keyframes mistDrift { to { transform: translate(35vw, -4vh) scale(1.2); } }
@keyframes emberRise { to { background-position: 40px -300px; } }

.auth-screen { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); min-height: 100vh; }
.auth-story { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 5vw; text-align: center; border-right: 1px solid rgba(201,155,75,.12); }
.crest { width: 104px; height: 118px; display: grid; place-items: center; margin-bottom: 22px; color: var(--gold-light); font-size: 44px; clip-path: polygon(50% 0, 92% 16%, 88% 70%, 50% 100%, 12% 70%, 8% 16%); background: linear-gradient(145deg, #6b4b25, #24170d); border: 1px solid var(--gold); filter: drop-shadow(0 12px 18px #000); }
.crest span { filter: drop-shadow(0 0 12px rgba(240,210,138,.45)); }
.eyebrow { margin: 0 0 9px; color: var(--gold); font: 700 .69rem/1 var(--display); letter-spacing: .24em; text-transform: uppercase; }
.auth-story h1 { margin: 0; color: var(--gold-light); font: 700 clamp(3.6rem, 8vw, 7.5rem)/.92 var(--display); letter-spacing: .12em; text-shadow: 0 4px 0 #59401f, 0 12px 30px #000; }
.auth-lead { margin: 24px 0 30px; color: #d6c7ad; font-size: clamp(1rem, 1.7vw, 1.35rem); line-height: 1.7; }
.world-omens { display: flex; gap: 1px; overflow: hidden; border: 1px solid var(--border); background: var(--border); }
.world-omens div { min-width: 112px; padding: 15px 22px; background: rgba(19,16,12,.82); }
.world-omens strong { display: block; color: var(--gold-light); font-size: 1.55rem; }
.world-omens span { color: var(--muted); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; }
.auth-story blockquote { margin: 35px 0 0; color: #8e806d; font-style: italic; }

.auth-card { position: relative; display: grid; place-items: center; padding: 40px; background: linear-gradient(90deg, rgba(0,0,0,.1), rgba(0,0,0,.55)); }
.auth-card-inner { position: relative; width: min(430px, 100%); padding: 45px 44px 35px; color: var(--ink); background: linear-gradient(115deg, rgba(255,255,255,.15), transparent 35%), var(--parchment); box-shadow: var(--shadow), inset 0 0 55px rgba(93,57,19,.24); clip-path: polygon(2% 0, 98% 1%, 100% 96%, 96% 100%, 3% 99%, 0 94%, 1% 4%); }
.auth-card-inner::before, .parchment-card::before { content: ''; position: absolute; inset: 8px; pointer-events: none; border: 1px solid rgba(83,54,24,.25); }
.sigil { margin: 0; color: #866125; font-size: 2.1rem; text-align: center; }
.auth-card h2 { margin: 4px 0 6px; font: 700 2rem var(--display); text-align: center; letter-spacing: .04em; }
.auth-card h2 + p { margin: 0 0 24px; color: var(--ink-soft); text-align: center; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; margin: 0 0 25px; border-bottom: 1px solid rgba(54,34,15,.3); }
.auth-tab { border: 0; padding: 12px; color: #766148; background: transparent; cursor: pointer; border-bottom: 2px solid transparent; }
.auth-tab.active { color: var(--ink); border-bottom-color: #8f5727; font-weight: 700; }
.auth-card label { display: block; margin: 14px 0 6px; color: #463420; font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.auth-card input { width: 100%; padding: 13px 14px; color: var(--ink); border: 1px solid rgba(72,43,18,.38); border-radius: 2px; background: rgba(255,249,227,.58); box-shadow: inset 0 2px 5px rgba(58,34,11,.1); }
.auth-card input::placeholder { color: #8b775c; }
.primary-button, .secondary-button, .text-button, .icon-button { border: 0; cursor: pointer; }
.primary-button { position: relative; width: 100%; padding: 13px 20px; color: #fff3d6; border: 1px solid #af7d36; border-radius: 2px; background: linear-gradient(#744123, #4c2817); box-shadow: inset 0 0 0 2px rgba(255,215,140,.11), 0 5px 12px rgba(33,17,8,.24); font-weight: 700; letter-spacing: .05em; }
.auth-card .primary-button { margin-top: 24px; }
.primary-button:hover { background: linear-gradient(#8a5129, #5b301a); transform: translateY(-1px); }
.primary-button:disabled { cursor: wait; opacity: .55; transform: none; }
.form-message { min-height: 20px; margin: 12px 0 0; color: #8e271b; text-align: center; font-size: .86rem; }
.local-note { margin: 18px 0 0; color: #6d5a40; font-size: .74rem; text-align: center; }
.torch { position: absolute; top: 20%; width: 9px; height: 100px; background: linear-gradient(90deg,#392116,#82532b,#2b180f); box-shadow: 0 10px 20px #000; }
.torch-left { left: 5%; } .torch-right { right: 5%; }
.torch i { position: absolute; left: 50%; bottom: 91px; width: 24px; height: 42px; transform: translateX(-50%); border-radius: 50% 50% 48% 48%; background: radial-gradient(circle at 50% 70%, #fff3a0 0 12%, #ff9e2a 35%, #ae2c11 68%, transparent 70%); filter: drop-shadow(0 0 12px #ff8b25) drop-shadow(0 0 35px #b23b13); animation: flame .16s ease-in-out infinite alternate; }
@keyframes flame { to { transform: translateX(-50%) skewX(4deg) scale(.94,1.07); } }

.game-shell { position: relative; z-index: 1; display: grid; grid-template-columns: 250px minmax(0,1fr); grid-template-rows: 70px minmax(0,1fr); width: 100vw; height: 100vh; background: #14120f; }
.topbar { grid-column: 1 / -1; display: flex; align-items: center; gap: 24px; min-width: 0; padding: 0 20px; border-bottom: 1px solid #4a3824; background: linear-gradient(180deg,#28231c,#171510); box-shadow: 0 5px 18px rgba(0,0,0,.45); z-index: 20; }
.mini-brand { display: flex; align-items: center; gap: 11px; width: 210px; }
.mini-crest { display: grid; place-items: center; width: 36px; height: 42px; color: var(--gold-light); background: #503719; clip-path: polygon(50% 0, 95% 18%, 85% 78%, 50% 100%, 15% 78%, 5% 18%); }
.mini-brand div { display: flex; flex-direction: column; }
.mini-brand strong { color: var(--gold-light); font: 700 1.07rem var(--display); letter-spacing: .14em; }
.mini-brand small { color: #8f816b; font-size: .59rem; letter-spacing: .08em; text-transform: uppercase; }
.player-stats { display: flex; align-self: stretch; margin-right: auto; }
.player-stats > div { display: grid; grid-template-columns: 22px auto; grid-template-rows: 1fr 1fr; align-items: end; min-width: 92px; padding: 10px 16px; border-left: 1px solid rgba(255,255,255,.05); }
.player-stats .stat-icon { grid-row: 1 / 3; align-self: center; margin-right: 8px; }
.stat-icon.gold { color: #e2b348; } .stat-icon.supplies { color: #8ca96b; } .stat-icon.renown { color: #b690d0; }
.player-stats strong { color: #eadcbf; line-height: 1; }
.player-stats small { color: #817662; font-size: .62rem; text-transform: uppercase; }
.top-actions { display: flex; align-items: center; gap: 12px; }
.online-indicator { color: #8f887c; font-size: .78rem; white-space: nowrap; }
.online-indicator i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: #68a96c; box-shadow: 0 0 8px #68a96c; }
.icon-button { display: grid; place-items: center; width: 38px; height: 38px; color: #d8c79f; border: 1px solid rgba(201,155,75,.25); border-radius: 2px; background: rgba(0,0,0,.18); font-size: 1.1rem; }
.text-button { color: #9f927c; background: transparent; }
.icon-button:hover, .text-button:hover { color: var(--gold-light); }

.sidebar { grid-row: 2; display: flex; flex-direction: column; min-height: 0; padding: 25px 14px 16px; border-right: 1px solid #493722; background: radial-gradient(circle at 20% 100%, rgba(113,67,26,.14), transparent 35%), linear-gradient(90deg,#211d17,#181510); z-index: 15; }
.nav-caption { margin: 0 12px 10px; color: #746955; font: 700 .6rem var(--display); letter-spacing: .18em; }
.sidebar nav { display: flex; flex-direction: column; gap: 5px; }
.nav-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px; color: #a89c88; border: 1px solid transparent; background: transparent; text-align: left; cursor: pointer; }
.nav-item > span { width: 25px; color: #786a54; font-size: 1.35rem; text-align: center; }
.nav-item div { display: flex; flex-direction: column; }
.nav-item strong { font-size: .86rem; font-weight: 600; }
.nav-item small { margin-top: 2px; color: #675f53; font-size: .68rem; }
.nav-item:hover { color: #e1d5bf; background: rgba(255,255,255,.025); }
.nav-item.active { color: var(--gold-light); border-color: rgba(201,155,75,.23); background: linear-gradient(90deg, rgba(125,78,31,.27), transparent); box-shadow: inset 3px 0 var(--gold); }
.nav-item.active > span { color: var(--gold); }
.sidebar-legend { display: flex; flex-direction: column; gap: 8px; margin: auto 8px 18px; padding: 15px; color: #766e61; border-top: 1px solid rgba(201,155,75,.13); border-bottom: 1px solid rgba(201,155,75,.13); font-size: .68rem; }
.sidebar-legend p { margin: 0 0 3px; color: #665d4d; font-size: .57rem; letter-spacing: .15em; }
kbd { display: inline-block; min-width: 58px; margin-right: 5px; padding: 2px 5px; color: #96886f; border: 1px solid #4b4133; border-radius: 2px; background: #17140f; font: .6rem sans-serif; text-align: center; }
.sidebar-user { display: flex; align-items: center; gap: 10px; padding: 12px 8px 0; border-top: 1px solid rgba(201,155,75,.13); }
.avatar, .large-avatar { display: grid; place-items: center; color: #f1dab0; border: 1px solid #8b6734; border-radius: 50%; background: radial-gradient(circle at 40% 30%, #7c5732, #2c1c11); font-family: var(--display); }
.avatar { width: 38px; height: 38px; }
.sidebar-user div:last-child { display: flex; flex-direction: column; min-width: 0; }
.sidebar-user strong { overflow: hidden; font-size: .83rem; text-overflow: ellipsis; }
.sidebar-user small { color: #756a59; font-size: .66rem; }

.content-area { grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; overflow: hidden; background: #0c0e0d; }
.view { display: none; height: 100%; overflow: auto; padding: 28px 30px; animation: pageIn .3s ease-out; }
.view.active { display: block; }
.view-heading { max-width: 1100px; margin: 0 auto 24px; }
.view-heading h2 { margin: 0; color: #e7d9bc; font: 700 clamp(1.6rem, 2.4vw, 2.25rem) var(--display); letter-spacing: .04em; }
.view-heading > p:last-child { color: #887e6e; }
@keyframes pageIn { from { opacity: 0; transform: translateY(5px); } }
.map-heading-row { display: flex; align-items: end; justify-content: space-between; max-width: none; margin-bottom: 18px; }
.map-actions { display: flex; gap: 8px; }
.secondary-button { padding: 9px 12px; color: #b9aa8d; border: 1px solid rgba(201,155,75,.25); border-radius: 2px; background: #201c16; font-size: .76rem; }
.secondary-button:hover { color: var(--gold-light); border-color: rgba(201,155,75,.55); }

#view-map { overflow: hidden; }
.map-layout { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 315px; gap: 14px; height: calc(100% - 80px); min-height: 430px; }
.map-stage { position: relative; min-width: 0; overflow: hidden; border: 1px solid #493923; background: radial-gradient(circle at 50% 45%, #1b302d, #0a1010 68%); box-shadow: inset 0 0 55px #000, 0 12px 35px rgba(0,0,0,.24); }
.map-stage::after { content: ''; position: absolute; inset: 8px; pointer-events: none; border: 1px solid rgba(201,155,75,.12); }
#map-canvas { position: absolute; inset: 0; }
#map-canvas canvas { display: block; width: 100%; height: 100%; cursor: grab; }
#map-canvas canvas:active { cursor: grabbing; }
.map-labels { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.map-label { position: absolute; transform: translate(-50%,-50%); color: #fff2cf; font: 700 .68rem var(--display); letter-spacing: .08em; text-align: center; text-shadow: 0 2px 4px #000, 0 0 7px #000; white-space: nowrap; transition: opacity .15s; }
.map-label small { display: block; margin-top: 2px; color: #cbbd9e; font: .5rem var(--serif); letter-spacing: .04em; }
.map-tooltip { position: absolute; z-index: 4; max-width: 230px; padding: 9px 12px; pointer-events: none; color: #e8dbc2; border: 1px solid var(--border); background: rgba(20,16,12,.94); box-shadow: 0 8px 20px #000; font-size: .72rem; }
.map-tooltip strong { display: block; color: var(--gold-light); font-size: .86rem; }
.compass { position: absolute; left: 22px; bottom: 22px; width: 52px; height: 52px; color: var(--gold); border: 1px solid rgba(201,155,75,.3); border-radius: 50%; background: rgba(10,12,11,.7); text-align: center; }
.compass span { position: absolute; top: 2px; left: 0; width: 100%; font-size: .57rem; }
.compass i { position: absolute; left: 24px; top: 14px; width: 3px; height: 29px; background: linear-gradient(var(--rust) 0 50%, #897b65 50%); clip-path: polygon(50% 0,100% 45%,65% 45%,65% 100%,35% 100%,35% 45%,0 45%); }
.map-hint { position: absolute; left: 50%; bottom: 15px; transform: translateX(-50%); padding: 6px 11px; color: #8f8676; background: rgba(9,11,10,.74); font-size: .66rem; letter-spacing: .06em; }
.webgl-fallback { position: absolute; inset: 0; display: grid; place-content: center; padding: 40px; color: #cfbea0; background: #111815; text-align: center; }
.region-panel { position: relative; min-width: 0; overflow: auto; color: #d8ccb5; border: 1px solid #493923; background: linear-gradient(160deg,#252017,#171510); box-shadow: inset 0 0 30px rgba(0,0,0,.3); }
.empty-region { display: grid; place-items: center; align-content: center; height: 100%; padding: 30px; text-align: center; }
.empty-region .ornament { color: var(--gold); font-size: 2rem; }
.empty-region h3 { margin: 12px 0 7px; font-family: var(--display); }
.empty-region p { max-width: 220px; color: #7c7262; font-size: .82rem; line-height: 1.6; }
.region-detail { min-height: 100%; padding: 24px; animation: pageIn .25s ease; }
.region-banner { margin: -24px -24px 20px; padding: 30px 24px 22px; background: linear-gradient(180deg, color-mix(in srgb, var(--region-color) 40%, #15120e), #181510); border-bottom: 1px solid color-mix(in srgb, var(--region-color) 60%, #584122); }
.region-banner .eyebrow { color: #dbc28c; }
.region-banner h3 { margin: 3px 0 5px; color: #fff0ce; font: 700 1.7rem var(--display); }
.region-banner p { margin: 0; color: #c8b99e; font-size: .77rem; }
.region-detail > p { color: #a99d89; font-size: .84rem; line-height: 1.6; }
.region-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 18px 0; }
.region-facts div { padding: 10px; border: 1px solid rgba(201,155,75,.14); background: rgba(0,0,0,.15); }
.region-facts span { display: block; color: #716959; font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; }
.region-facts strong { color: #d3c3a7; font-size: .76rem; }
.resource-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 20px; }
.resource-list span { padding: 5px 8px; color: #afa087; border: 1px solid rgba(201,155,75,.18); background: rgba(201,155,75,.06); font-size: .68rem; }
.danger-runes { color: #8e3f27; letter-spacing: .08em; }
.danger-runes .dim { color: #4d4438; }
.region-detail .primary-button { margin-top: 5px; }
.region-list { position: absolute; z-index: 8; top: 10px; right: 330px; width: 270px; max-height: calc(100% - 20px); overflow: auto; padding: 9px; border: 1px solid #604723; background: rgba(22,19,15,.97); box-shadow: var(--shadow); }
.region-list button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 10px; color: #c9bda7; border: 0; border-bottom: 1px solid rgba(255,255,255,.04); background: transparent; text-align: left; cursor: pointer; }
.region-list button:hover { background: rgba(201,155,75,.08); }
.region-swatch { width: 9px; height: 28px; background: var(--swatch); }
.region-list button span:last-child { display: flex; flex-direction: column; }
.region-list small { color: #756c5d; }

.journal-list, .civilization-grid, .profile-grid { max-width: 1100px; margin: 0 auto; }
.journal-list { display: grid; gap: 12px; padding-bottom: 40px; }
.journal-entry { position: relative; display: grid; grid-template-columns: 170px 1fr auto; gap: 22px; align-items: center; padding: 20px; color: var(--ink); background: linear-gradient(100deg,#d5c18f,#e8d7ad); box-shadow: 0 8px 22px rgba(0,0,0,.25); }
.journal-entry time { color: #746044; font-size: .72rem; }
.journal-entry h3 { margin: 0 0 5px; font-family: var(--display); }
.journal-entry p { margin: 0; color: #5f4c35; font-size: .82rem; line-height: 1.5; }
.journal-rewards { display: flex; gap: 8px; color: #62461f; font-size: .75rem; white-space: nowrap; }
.empty-state { padding: 60px 25px; color: #817666; border: 1px dashed rgba(201,155,75,.2); text-align: center; }
.empty-state strong { display: block; margin-bottom: 8px; color: #caba9e; font: 1.3rem var(--display); }
.civilization-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; padding-bottom: 40px; }
.civilization-card { position: relative; overflow: hidden; padding: 24px 24px 24px 33px; border: 1px solid color-mix(in srgb, var(--civ-color) 45%, #5a4931); background: linear-gradient(120deg, color-mix(in srgb, var(--civ-color) 20%, #191713), #15130f 60%); box-shadow: 0 8px 22px rgba(0,0,0,.24); }
.civilization-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 7px; background: var(--civ-color); box-shadow: 0 0 22px var(--civ-color); }
.civilization-card h3 { margin: 2px 0 4px; color: #e8d9bd; font-family: var(--display); }
.civilization-card .motto { margin: 0 0 14px; color: color-mix(in srgb, var(--civ-color) 50%, #e7c990); font-style: italic; }
.civilization-card p:last-child { color: #938777; font-size: .82rem; line-height: 1.55; }
.civilization-card small { color: #6f675b; text-transform: uppercase; letter-spacing: .08em; }
.profile-grid { display: grid; grid-template-columns: .85fr 1.25fr; gap: 16px; }
.parchment-card { position: relative; padding: 28px; color: var(--ink); background: linear-gradient(135deg,var(--parchment-light),var(--parchment)); box-shadow: var(--shadow), inset 0 0 35px rgba(91,54,18,.15); }
.parchment-card h3 { margin-top: 0; font-family: var(--display); }
.profile-card { grid-row: span 2; text-align: center; }
.large-avatar { width: 88px; height: 88px; margin: 5px auto 15px; font-size: 2rem; }
.profile-card > p { color: #786047; }
.profile-stat-row { display: flex; justify-content: space-between; margin-top: 10px; padding: 11px 0; border-top: 1px solid rgba(67,42,17,.2); }
.reputation-list { display: grid; gap: 11px; }
.reputation-row { display: grid; grid-template-columns: minmax(90px,1fr) 2fr 34px; gap: 10px; align-items: center; font-size: .78rem; }
.reputation-bar { height: 6px; overflow: hidden; border-radius: 3px; background: rgba(60,37,15,.18); }
.reputation-bar i { display: block; height: 100%; width: var(--reputation); background: #86622f; }
.oath-card blockquote { margin: 15px 0 0; color: #6e5437; font-size: 1.03rem; font-style: italic; line-height: 1.7; }

.chat-drawer { position: fixed; z-index: 40; top: 70px; right: 0; bottom: 0; display: grid; grid-template-rows: auto 1fr auto; width: min(390px,100vw); transform: translateX(102%); border-left: 1px solid #5d4527; background: #181510; box-shadow: -15px 0 45px rgba(0,0,0,.45); transition: transform .3s ease; }
.chat-drawer.open { transform: translateX(0); }
.chat-drawer header { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--border); }
.chat-drawer h2 { margin: 0; font: 1.25rem var(--display); }
.chat-log { overflow: auto; padding: 16px 18px; }
.chat-message { margin-bottom: 12px; padding-bottom: 11px; border-bottom: 1px solid rgba(255,255,255,.04); }
.chat-message header { display: flex; padding: 0; border: 0; }
.chat-message strong { color: var(--gold); font-size: .77rem; }
.chat-message time { margin-left: auto; color: #5f584e; font-size: .58rem; }
.chat-message p { margin: 4px 0 0; color: #b6aa96; font-size: .82rem; line-height: 1.45; overflow-wrap: anywhere; }
.chat-drawer form { display: grid; grid-template-columns: 1fr 90px; gap: 8px; padding: 14px; border-top: 1px solid var(--border); }
.chat-drawer textarea { resize: none; padding: 10px; color: #e5d6ba; border: 1px solid #4c3b27; background: #0f0e0b; }

.modal-overlay { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 24px; background: rgba(5,5,4,.82); backdrop-filter: blur(4px); }
.quest-modal { position: relative; width: min(680px,100%); max-height: min(760px,94vh); overflow: auto; padding: 45px; color: var(--ink); background: linear-gradient(135deg,#efe0b8,#cfb77d); box-shadow: 0 30px 100px #000, inset 0 0 60px rgba(87,51,15,.22); clip-path: polygon(1% 1%,98% 0,100% 96%,97% 100%,2% 99%,0 4%); animation: modalIn .28s ease-out; }
.quest-modal::before { content: ''; position: absolute; inset: 10px; pointer-events: none; border: 1px solid rgba(74,43,15,.25); }
.modal-close { position: absolute; z-index: 2; right: 18px; top: 14px; color: #674b2b; border: 0; background: transparent; font-size: 1.8rem; cursor: pointer; }
.quest-modal h2 { margin: 4px 0; font: 700 2rem var(--display); text-align: center; }
.quest-modal > .eyebrow { color: #885127; text-align: center; }
.quest-divider { display: flex; align-items: center; gap: 10px; margin: 18px 0; color: #966830; }
.quest-divider::before, .quest-divider::after { content: ''; flex: 1; height: 1px; background: rgba(82,47,16,.28); }
.quest-text { color: #594229; font-size: 1rem; line-height: 1.7; }
.quest-choices { display: grid; gap: 9px; margin-top: 24px; }
.quest-choice { padding: 13px 15px; color: #3f2c19; border: 1px solid rgba(88,48,15,.35); background: rgba(255,249,225,.35); text-align: left; cursor: pointer; }
.quest-choice:hover { padding-left: 20px; border-color: #8c5627; background: rgba(255,249,225,.62); }
.quest-choice::before { content: '›'; margin-right: 9px; color: #8c5627; font-weight: 700; }
.quest-result { margin-top: 20px; padding: 22px; border: 1px solid rgba(81,48,17,.3); background: rgba(255,249,225,.35); text-align: center; }
.quest-result h3 { font-family: var(--display); }
.reward-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin: 16px 0; }
.reward-chips span { padding: 5px 8px; border: 1px solid rgba(81,48,17,.25); font-size: .75rem; }
@keyframes modalIn { from { opacity: 0; transform: scale(.94) translateY(10px); } }

.toast-region { position: fixed; z-index: 150; right: 20px; bottom: 20px; display: grid; gap: 8px; }
.toast { max-width: 330px; padding: 12px 15px; color: #e7dbc5; border: 1px solid #6f522d; background: #211c15; box-shadow: 0 10px 30px #000; animation: toastIn .25s ease-out; }
.toast.error { border-color: #813e31; }
@keyframes toastIn { from { opacity: 0; transform: translateY(8px); } }
.loading-screen { position: fixed; z-index: 200; inset: 0; display: grid; place-content: center; color: #bcaa89; background: #100e0b; text-align: center; }
.loading-rune { color: var(--gold); font-size: 3rem; animation: runeSpin 2s linear infinite; }
@keyframes runeSpin { to { transform: rotate(360deg); } }

@media (max-width: 1100px) {
  .game-shell { grid-template-columns: 210px minmax(0,1fr); }
  .mini-brand { width: 170px; }
  .region-panel { position: absolute; right: 10px; top: 10px; bottom: 10px; width: 290px; z-index: 5; background: rgba(24,21,16,.96); }
  .map-layout { display: block; }
  .map-stage { height: 100%; }
  .region-list { right: 310px; }
}

/* Eldoria V2.1 — yaşayan dünya bileşenleri */
.audio-controls { display:flex; align-items:center; gap:5px; min-width:0; }
.audio-controls .icon-button { width:30px; height:30px; font-size:.72rem; }
.audio-controls span { width:105px; overflow:hidden; color:#887d69; font-size:.65rem; text-overflow:ellipsis; white-space:nowrap; }
.audio-controls input { width:68px; accent-color:var(--gold); }
.audio-mixer { position:relative; }.audio-mixer summary { padding:5px;color:#9e8d72;cursor:pointer;list-style:none; }.audio-mixer[open] { z-index:60; }.audio-mixer>label { position:absolute;right:0;display:flex;align-items:center;gap:8px;width:165px;padding:9px 12px;color:#b9ab94;border:1px solid #523d25;background:#17140f;font-size:.68rem; }.audio-mixer>label:nth-of-type(1){top:31px}.audio-mixer>label:nth-of-type(2){top:67px}.audio-mixer>label:nth-of-type(3){top:103px}
.segmented { display:flex; border:1px solid rgba(201,155,75,.28); }
.segmented button,.station-tabs button { padding:9px 14px; color:#93866f; border:0; background:#17140f; cursor:pointer; }
.segmented button.active,.station-tabs button.active { color:#f0ddb2; background:#62451f; box-shadow:inset 0 0 12px rgba(255,200,90,.13); }
.atlas-svg { display:block; width:100%; height:100%; filter:drop-shadow(0 15px 26px rgba(0,0,0,.5)); }
.atlas-grid { fill:none; stroke:#b8d3d0; stroke-width:1; opacity:.09; }
.atlas-country { stroke:#ddc482; stroke-width:2; opacity:.82; cursor:pointer; transition:opacity .18s,filter .18s,stroke-width .18s; }
.atlas-country:hover,.atlas-country:focus,.atlas-country.selected { opacity:1; stroke:#fff0bd; stroke-width:4; filter:drop-shadow(0 0 12px rgba(255,217,133,.7)); outline:none; }
.atlas-country-label { fill:#fff0c9; font:700 15px var(--display); text-anchor:middle; paint-order:stroke; stroke:#1a160f; stroke-width:4; pointer-events:none; }
.atlas-marker { cursor:pointer; outline:none; }
.atlas-marker circle:first-child { fill:#17140f; stroke:#e3c878; stroke-width:3; opacity:.92; }
.atlas-marker circle:nth-child(2) { fill:#f1dc8d; }
.atlas-marker text { fill:#f8e9c6; font:700 12px var(--serif); text-anchor:middle; paint-order:stroke; stroke:#14100b; stroke-width:4; }
.atlas-marker:hover circle:first-child,.atlas-marker.selected circle:first-child { fill:#8d5925; filter:drop-shadow(0 0 8px #ffd777); }
.map-tooltip span { display:block; color:#897f6d; margin-top:2px; }
.motto { color:#bc9b61; font-style:italic; }
.location-list { display:grid; gap:7px; margin:10px 0 18px; }
.location-button { display:flex; align-items:center; gap:10px; width:100%; padding:9px; color:#cbbca1; border:1px solid rgba(201,155,75,.15); background:#12110e; text-align:left; cursor:pointer; }
.location-button:hover { border-color:#896635; background:#262017; }
.location-button>span:last-child { display:flex; flex-direction:column; }
.location-button small { color:#746b5c; margin-top:2px; }
.location-icon { display:grid; place-items:center; width:32px; height:32px; color:#e3c475; border-radius:50%; background:#362817; }
.danger-runes i { color:#4d4438; font-style:normal; }
.location-hero { margin:-24px -24px 20px; padding:28px 24px; text-align:center; background:radial-gradient(circle at 50% 20%,#4c3720,#171510 72%); border-bottom:1px solid var(--border); }
.location-hero>span { color:var(--gold-light); font-size:2.3rem; }
.location-hero h3 { margin:5px; color:#f1e2c2; font:1.6rem var(--display); }
.location-hero small { color:#887a64; }
.back-link { padding:0 0 12px; color:#bca77e; border:0; background:transparent; cursor:pointer; }
.activity-list { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 18px; }
.activity-list span { padding:6px 8px; color:#a99a7f; border:1px solid rgba(201,155,75,.15); background:#12100d; font-size:.7rem; }
.contract-button { display:block; width:100%; margin-top:9px; }
.location-actions{display:grid;grid-template-columns:1.15fr .85fr;gap:8px;margin-top:13px}.location-actions .primary-button,.location-actions .secondary-button{width:100%;margin:0;padding:12px 9px}.location-actions .primary-button{box-shadow:0 0 20px rgba(196,132,50,.16),inset 0 0 0 2px rgba(255,215,140,.11)}
.locked-contract { padding:9px; color:#766c5c!important; border:1px dashed rgba(201,155,75,.18); font-size:.7rem!important; }
.quest-choice strong,.quest-choice small { display:block; }
.quest-choice small { margin:5px 0 0 22px; color:#795d3d; }
.quest-result { text-align:left; }
.result-seal { color:#6d441b; font:700 1.05rem var(--display); text-align:center; letter-spacing:.1em; }
.result-story { color:#503b25; font-size:.98rem; line-height:1.7; }
.check-reveal { padding:9px; color:#665038; border:1px dashed rgba(81,48,17,.28); font-size:.75rem; text-align:center; }
.effect-title { margin:24px 0 8px; color:#47321d; }
.effect-list { display:grid; gap:8px; }
.effect-row { padding:10px 12px; border-left:4px solid #6c8a55; background:rgba(255,249,225,.35); }
.effect-row.negative { border-color:#9a4433; }
.effect-row strong { color:#44301b; }
.effect-row p { margin:5px 0 0; color:#685137; font-size:.78rem; line-height:1.45; }
.campaign-complete { padding:14px; color:#624720; border:1px solid #846130; text-align:center; }
.wide-modal { width:min(1150px,96vw); max-height:92vh; overflow:auto; padding:35px; color:var(--ink); background:linear-gradient(135deg,#ead9aa,#cdb47c); box-shadow:0 30px 100px #000; }
.wide-modal>h2 { margin:3px 0; font:2rem var(--display); }
.class-grid { display:grid; grid-template-columns:repeat(5,minmax(170px,1fr)); gap:10px; margin-top:22px; }
.class-card { display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(65,39,14,.28); background:rgba(255,247,216,.32); }
.class-card img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:top; background:#251b13; }
.class-card>div { flex:1; padding:14px; }
.class-card h3 { margin:3px 0; font-family:var(--display); }
.class-card p { color:#624c34; font-size:.78rem; line-height:1.45; }
.class-card small { display:block; color:#6d5335; font-size:.68rem; }
.class-card>.primary-button { margin:0 12px 12px; }
.attribute-row { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:10px 0; }
.attribute-row span { padding:4px; color:#ede0bc; background:#49341f; font-size:.65rem; text-align:center; }
.character-layout { display:grid; grid-template-columns:minmax(370px,.9fr) minmax(500px,1.4fr); gap:18px; max-width:1200px; margin:auto; }
.character-sheet { display:grid; grid-template-columns:170px 1fr; gap:22px; align-content:start; }
.character-sheet>img { width:170px; height:240px; object-fit:cover; object-position:top; border:4px solid #725329; background:#251b13; }
.stat-blocks { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.stat-blocks div { display:flex; flex-direction:column; padding:9px 5px; color:#eee1bd; background:#4a351e; text-align:center; }
.stat-blocks span { font-size:.58rem; }.stat-blocks strong { font-size:1.3rem; }
.section-title { color:#dccbad; font-family:var(--display); }
.companion-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.companion-card { position:relative; display:grid; grid-template-columns:90px 1fr; gap:12px; min-height:150px; padding:10px; color:#bcae96; border:1px solid #423521; background:#17140f; }
.companion-card.active { border-color:#b18b4d; box-shadow:inset 0 0 20px rgba(177,139,77,.1); }
.companion-card.locked { filter:grayscale(.8); opacity:.62; }
.companion-card img { width:90px; height:128px; object-fit:cover; object-position:top; }
.companion-card h4 { margin:2px 0;color:#e2d4bb;}.companion-card p { margin:5px 0;color:#8c8170;font-size:.72rem;line-height:1.4;}.companion-card small { color:#b69455; }
.companion-card .secondary-button,.active-badge,.locked-badge { grid-column:1/-1; justify-self:start; }
.active-badge { color:#9fc27d;font-size:.7rem; }.locked-badge { color:#81786b;font-size:.7rem; }
.item-grid,.recipe-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; max-width:1200px; margin:auto; padding-bottom:35px; }
.item-card { display:grid; grid-template-columns:70px 1fr auto; gap:12px; align-items:center; padding:16px; color:#a99e8b; border:1px solid #473924; border-left:4px solid #87745a; background:#171510; }
.item-card h3,.recipe-card h3 { margin:3px 0;color:#e4d6bb;font-family:var(--display);}.item-card p,.recipe-card p { margin:5px 0;font-size:.76rem;line-height:1.45; }.item-card small { color:#8e795b; }
.item-icon { display:grid; place-items:center; width:65px;height:65px;border-radius:50%;background:#282117;}.item-icon img { width:42px;height:42px; }
.rarity-uncommon { border-left-color:#599152; }.rarity-rare { border-left-color:#4286b7; }.rarity-epic { border-left-color:#904dc0; }.rarity-legendary { border-left-color:#d19534; }.rarity-mythic,.rarity-exotic,.rarity-hero { border-left-color:#d54848; }
.station-tabs { display:flex; gap:2px; max-width:1200px; margin:0 auto 18px; border-bottom:1px solid var(--border); }
.recipe-card { padding:18px; color:#9d917f; border:1px solid #473924; background:linear-gradient(145deg,#1e1a14,#12110e); }
.ingredients { display:flex; flex-wrap:wrap; gap:5px; margin:12px 0; }.ingredients span { padding:4px 7px;border:1px solid #4d442f;font-size:.68rem;}.ingredients .owned { color:#a8c087;border-color:#536641;}.ingredients .missing { color:#af796c;border-color:#694238; }
.recipe-card .primary-button { float:right; margin-top:8px; }
.journal-entry { align-items:start; }.journal-entry details { margin-top:10px; }.journal-entry summary { cursor:pointer;color:#684a29; }.journal-entry details p { margin:7px 0; }.story-failure { border-left:5px solid #8d4737; }.story-success { border-left:5px solid #5e7f4b; }
.legacy-entry { opacity:.86;border-left:5px solid #746144;filter:sepia(.18); }
.civilization-card { cursor:pointer; }
.admin-workshop { max-width:1100px;margin:auto;color:#c4b69f; }.admin-summary { display:grid;grid-template-columns:repeat(5,1fr);gap:8px; }.admin-summary div { display:flex;flex-direction:column;padding:15px;border:1px solid var(--border);background:#181510;text-align:center; }.admin-summary strong { color:var(--gold-light);font:1.5rem var(--display);}.admin-summary span { color:#827766;font-size:.7rem; }.admin-actions { display:flex;gap:8px;margin:16px 0; }.admin-editor { display:grid;grid-template-columns:1fr 2fr;gap:8px; }.admin-editor textarea { grid-column:1/-1;padding:15px;color:#decfb3;border:1px solid #4e3a22;background:#0f0e0b;font:12px monospace; }.admin-editor select { padding:10px;color:#d4c5aa;border:1px solid #4e3a22;background:#17140f; }.admin-editor button { grid-column:2;justify-self:end; }.validation { margin:12px 0;padding:14px;border:1px solid #714337;background:#251715;}.validation.valid { border-color:#587247;background:#172115; }
.admin-map-preview { grid-column:1/-1; min-height:240px; padding:8px; border:1px solid #4e3a22; background:#08191e; }
.admin-map-preview svg { display:block; width:100%; height:240px; cursor:crosshair; }
.asset-uploader { display:flex;align-items:center;gap:10px;margin:18px 0;padding:16px;border:1px solid var(--border);background:#17140f; }
.asset-uploader h3 { margin:0 auto 0 0;color:#d7c7a9;font-family:var(--display); }
.asset-uploader input { max-width:260px;color:#9f927d; }.asset-uploader output { color:#8fac7c;font-size:.7rem; }

@media (max-width:1280px){.audio-controls span,.audio-controls input{display:none}.class-grid{grid-template-columns:repeat(3,1fr)}.item-grid,.recipe-grid{grid-template-columns:repeat(2,1fr)}.character-layout{grid-template-columns:1fr}}
@media (max-width:780px){.audio-controls{display:none}.class-grid,.item-grid,.recipe-grid,.companion-grid{grid-template-columns:1fr}.character-sheet{grid-template-columns:1fr}.character-sheet>img{width:100%;height:300px}.map-heading-row{align-items:flex-start}.map-actions{flex-wrap:wrap}.map-layout{height:calc(100% - 115px)}.region-panel{left:8px;right:8px;top:auto;height:43%;width:auto}.atlas-country-label{font-size:12px}.journal-entry{grid-template-columns:1fr}.journal-rewards{white-space:normal}.admin-summary{grid-template-columns:repeat(2,1fr)}.admin-editor{grid-template-columns:1fr}.admin-editor button{grid-column:1}.wide-modal{padding:20px}}

@media (max-width: 780px) {
  body { overflow: auto; }
  .mobile-only { display: grid !important; }
  .auth-screen { grid-template-columns: 1fr; }
  .auth-story { min-height: 42vh; padding: 45px 20px 30px; border: 0; }
  .auth-story h1 { font-size: 3.4rem; }
  .crest { width: 66px; height: 76px; margin-bottom: 12px; font-size: 28px; }
  .world-omens div { min-width: 91px; padding: 10px; }
  .auth-story blockquote { display: none; }
  .auth-card { padding: 20px 16px 40px; }
  .auth-card-inner { padding: 35px 25px 28px; }
  .torch { display: none; }
  .game-shell { grid-template-columns: 1fr; grid-template-rows: 62px minmax(0,1fr); height: 100dvh; }
  .topbar { padding: 0 10px; gap: 8px; }
  .mini-brand { width: auto; margin-right: auto; }
  .mini-brand small, .mini-crest, .online-indicator { display: none; }
  .player-stats { position: fixed; z-index: 12; left: 0; right: 0; bottom: 0; height: 55px; justify-content: center; border-top: 1px solid #493722; background: #171510; }
  .player-stats > div { min-width: 92px; padding: 7px 12px; }
  .sidebar { position: fixed; z-index: 30; top: 62px; bottom: 55px; left: 0; width: 250px; transform: translateX(-102%); transition: transform .25s ease; }
  .sidebar.open { transform: translateX(0); }
  .content-area { grid-column: 1; grid-row: 2; padding-bottom: 55px; }
  .view { padding: 18px 14px; }
  .map-heading-row { align-items: start; }
  .map-actions { flex-direction: column; }
  #view-map { overflow: auto; }
  .map-layout { height: calc(100% - 92px); min-height: 520px; }
  .region-panel { top: auto; left: 8px; right: 8px; bottom: 8px; width: auto; max-height: 45%; }
  .map-hint { display: none; }
  .region-list { left: 8px; right: auto; top: 8px; width: calc(100% - 16px); max-height: 44%; }
  .civilization-grid, .profile-grid { grid-template-columns: 1fr; }
  .profile-card { grid-row: auto; }
  .journal-entry { grid-template-columns: 1fr; gap: 8px; }
  .quest-modal { padding: 38px 25px 30px; }
  .chat-drawer { top: 62px; bottom: 55px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Eldoria V3 — yaşayan harita, köken, ustalık ve savaş */
.map-layer-switches{display:flex;flex-wrap:wrap;gap:5px;max-width:420px}.map-layer-switches label{padding:5px 7px;color:#aa9a80;border:1px solid rgba(201,155,75,.18);background:#15120e;font-size:.62rem;cursor:pointer}.map-layer-switches input{accent-color:var(--gold)}
.atlas-route{fill:none;stroke:#bf8e57;stroke-width:2;stroke-dasharray:5 4;opacity:.58;pointer-events:none}.atlas-route.sea,.atlas-route.trade{stroke:#80c2cf;stroke-dasharray:8 5}.atlas-structure text,.atlas-weather,.atlas-ship{font:700 18px var(--serif);text-anchor:middle;paint-order:stroke;stroke:#13100c;stroke-width:4;cursor:help}.atlas-structure text{fill:#efd085}.atlas-weather{fill:#d9f0ef;font-size:23px}.atlas-ship{fill:#f1ddab;font-size:20px}.atlas-anomaly circle{fill:none;stroke:#dc76ff;stroke-width:3;animation:anomalyPulse 1.8s ease-in-out infinite}.atlas-anomaly text{fill:#f2acff;font:700 18px var(--display);text-anchor:middle;dominant-baseline:central}.atlas-player circle{fill:#153f3d;stroke:#8effd9;stroke-width:2}.atlas-player text{fill:#d5fff2;font:700 13px var(--serif);text-anchor:middle;dominant-baseline:central}@keyframes anomalyPulse{50%{opacity:.3;transform:scale(1.18)}}
.atlas-route{fill:none;stroke:#bf8e57;stroke-width:2;stroke-dasharray:5 4;opacity:.58;pointer-events:none}.atlas-route.sea,.atlas-route.trade{stroke:#80c2cf;stroke-dasharray:8 5}.atlas-feature{fill:none;pointer-events:none;opacity:.72}.feature-river{stroke:#7fc7d8;stroke-width:2.4}.feature-road{stroke:#8d673f;stroke-width:2;stroke-dasharray:4 3}.feature-forest{stroke:#4a7e50;stroke-width:7;stroke-linecap:round;stroke-dasharray:2 8}.feature-mountain{stroke:#c2b196;stroke-width:4;stroke-linejoin:bevel}.atlas-structure text,.atlas-weather,.atlas-ship{font:700 18px var(--serif);text-anchor:middle;paint-order:stroke;stroke:#13100c;stroke-width:4;cursor:help}.atlas-structure text{fill:#efd085}.atlas-weather{fill:#d9f0ef;font-size:23px}.atlas-ship{fill:#f1ddab;font-size:20px}.atlas-anomaly circle{fill:none;stroke:#dc76ff;stroke-width:3;animation:anomalyPulse 1.8s ease-in-out infinite}.atlas-anomaly text{fill:#f2acff;font:700 18px var(--display);text-anchor:middle;dominant-baseline:central}.atlas-player circle{fill:#153f3d;stroke:#8effd9;stroke-width:2}.atlas-player text{fill:#d5fff2;font:700 13px var(--serif);text-anchor:middle;dominant-baseline:central}@keyframes anomalyPulse{50%{opacity:.3;transform:scale(1.18)}}
.race-grid{display:grid;grid-template-columns:repeat(4,minmax(190px,1fr));gap:10px;margin-top:20px}.race-card{display:flex;flex-direction:column;padding:18px;border:1px solid color-mix(in srgb,var(--race-color),#3d2918 55%);background:linear-gradient(145deg,rgba(255,249,225,.44),rgba(116,80,38,.13))}.race-symbol{display:grid;place-items:center;width:58px;height:58px;margin:auto;color:var(--race-color);border:2px solid var(--race-color);border-radius:50%;font-size:2rem;box-shadow:0 0 22px color-mix(in srgb,var(--race-color),transparent 55%)}.race-card h3{font:1.3rem var(--display);text-align:center}.race-card p{color:#624b31;font-size:.75rem;line-height:1.5}.race-card small{display:block;color:#704f2e;line-height:1.5}.race-card .primary-button{margin-top:auto}.race-chat-symbol{color:#d9b966;font-size:1rem}
.v3-character-summary{display:grid;grid-template-columns:70px 1fr auto;gap:14px;align-items:center;max-width:1200px;margin:0 auto 15px;padding:15px;color:#b8aa92;border:1px solid #4b3b25;background:linear-gradient(100deg,#211a12,#12110e)}.race-seal{display:grid;place-items:center;width:58px;height:58px;color:#eed187;border:2px solid #9e7741;border-radius:50%;font-size:2rem}.v3-character-summary h3{margin:2px 0;color:#e6d7ba;font-family:var(--display)}.v3-character-summary p{margin:4px 0}.allocate-points{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:5px}.allocate-points strong{width:100%;color:#d8b971;text-align:right}.allocate-points button{padding:6px 8px;font-size:.65rem}
.v3-dashboard{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;max-width:1200px;margin:0 auto 20px}.v3-card,.reading-progress{padding:18px;color:#b9ac96;border:1px solid #493a26;background:linear-gradient(145deg,#201b14,#12100d)}.v3-card h3{margin:4px 0;color:#ebdcc0;font-family:var(--display)}.meter,.health{position:relative;height:16px;overflow:hidden;border:1px solid #4a3a28;background:#0c0b09}.meter i,.health i{display:block;height:100%;background:linear-gradient(90deg,#617d45,#c7b254);transition:width .4s}.travel-grid,.enemy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:1200px;margin:auto}.travel-card{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:13px;color:#aa9e8a;border:1px solid #433522;background:#17140f}.travel-card>span{color:#e5c578;font-size:1.7rem;text-align:center}.travel-card h3,.resource-card h4{margin:0;color:#e3d4b8;font-family:var(--display)}.travel-card p{font-size:.7rem;line-height:1.4}.travel-card small{color:#88775d}.resource-grid{display:flex;flex-wrap:wrap;gap:10px;max-width:1200px;margin:auto}.resource-card{display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:10px;min-width:310px;padding:11px;border:1px solid #403522;background:#15130f}.resource-card img{width:38px;height:38px}.resource-card p{margin:3px 0;color:#887c69;font-size:.68rem}
.workbench-layout{display:grid;grid-template-columns:250px minmax(430px,1fr) 250px;gap:14px;max-width:1200px;margin:auto}.material-palette,.craft-archive,.animated-forge,.rune-workshop,.job-queue{padding:16px;color:#aa9d88;border:1px solid #493821;background:#17140f}.material-palette h3,.craft-archive h3,.job-queue h3,.rune-workshop h2{color:#e2d1b0;font-family:var(--display)}.material-token{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:7px;width:100%;margin:5px 0;padding:8px;color:#c6b99f;border:1px solid #443822;border-left:4px solid #89755a;background:#211c14;text-align:left;cursor:grab}.material-token img{width:30px;height:30px}.material-token small{color:#7f735f}.animated-forge{position:relative;display:grid;place-items:center;min-height:380px;overflow:hidden;background:radial-gradient(circle at 50% 65%,#613119,#17120e 55%,#0d0c0a)}.forge-glow{position:absolute;bottom:45px;width:220px;height:100px;border-radius:50%;background:radial-gradient(ellipse,#ff9a35aa,transparent 70%);filter:blur(9px);animation:forgeBreath 1.5s ease-in-out infinite}.ingredient-slots{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.ingredient-slot{display:grid;place-items:center;width:88px;height:88px;color:#9d8c71;border:2px dashed #655036;border-radius:50%;background:#17130f;cursor:pointer}.ingredient-slot b{font-size:1.4rem}.ingredient-slot small{max-width:75px}.ingredient-slot.filled{color:#f2d88a;border-style:solid;border-color:#c79246;box-shadow:0 0 18px #d7772144}.craft-arrow{position:relative;z-index:1;color:#e9a851;font-size:2rem}.craft-result{position:relative;z-index:1;display:grid;place-items:center;width:130px;height:130px;color:#e4c177;border:2px solid #a47434;border-radius:50%;background:#1e1710;box-shadow:0 0 30px #ff8b2e33}.craft-result strong{font:3rem var(--display)}.animated-forge>.primary-button{position:relative;z-index:1}.animated-forge>p{position:relative;z-index:1;max-width:470px;font-size:.7rem;text-align:center}.craft-archive article{display:flex;flex-direction:column;padding:8px;border-bottom:1px solid #3d3222}.craft-archive small{color:#89775d}.job-queue{max-width:1200px;margin:15px auto}.job-queue article{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:9px;border-bottom:1px solid #3d3222}.job-queue b{color:#d4b26b}@keyframes forgeBreath{50%{transform:scale(1.18);opacity:.72}}
.rune-workshop{max-width:1200px;margin:15px auto;background:radial-gradient(circle at 10% 10%,#291b36,#15110e 55%)}.rune-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rune-columns>div{padding:13px;border:1px solid #4d3855;background:#141014}.rune-token,.rune-equipment{display:flex;justify-content:space-between;width:100%;margin:5px 0;padding:9px;color:#c8b4d3;border:1px solid #4d3855;background:#201725;cursor:pointer}.rune-token.selected,.rune-equipment.selected{border-color:#d793ed;box-shadow:0 0 12px #b45bd044}.rune-columns select{width:100%;margin:10px 0;padding:8px;color:#d8c5dd;background:#171019;border:1px solid #62466d}
.library-shelves{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1200px;margin:auto}.library-shelves>section{padding:15px;border:1px solid #473a28;background:linear-gradient(90deg,#16120e,#211a12)}.library-shelves h3{color:#e4d0aa;font-family:var(--display)}.book-card{display:grid;grid-template-columns:35px 1fr auto;gap:8px;align-items:center;margin:7px 0;padding:10px;border:1px solid #403323;border-left:4px solid #87745a;background:#201a13}.book-card>span{color:#d9ba75;font-size:1.5rem}.book-card h4{margin:0;color:#dfd1b5}.book-card p{font-size:.65rem}.book-card small{color:#947f60}.reading-progress{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto 15px}.book-inventory{display:flex;flex-wrap:wrap;gap:8px;max-width:1200px;margin:auto}.book-inventory article{display:flex;flex-direction:column;gap:6px;min-width:240px;padding:12px;border:1px solid #463924;background:#17140f}.book-inventory small{color:#8d7d65}
.enemy-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.enemy-card{display:flex;flex-direction:column;overflow:hidden;color:#aa9d88;border:1px solid #433522;border-left:4px solid #87745a;background:#17140f}.enemy-card img{width:100%;aspect-ratio:1/1;object-fit:contain;background:radial-gradient(circle,#30251a,#0d0c0a 70%)}.enemy-card>div{flex:1;padding:12px}.enemy-card h3{color:#ead8b7;font-family:var(--display)}.enemy-card p{font-size:.72rem}.enemy-card .primary-button{margin:0 12px 12px}.combat-stage{display:grid;grid-template-columns:1fr 100px 1fr;align-items:center;gap:15px;max-width:900px;margin:auto}.fighter{padding:20px;color:#c7b99f;border:1px solid #4b3a25;background:#17140f;text-align:center}.fighter>span{font-size:8rem}.fighter img{width:min(280px,100%);height:280px;object-fit:contain}.fighter h3{color:#e8d7b7;font:1.5rem var(--display)}.health{height:25px}.health i{background:linear-gradient(90deg,#6e1e1e,#c6573e)}.health b{position:absolute;inset:3px;color:#fff;font-size:.72rem}.versus{display:flex;flex-direction:column;color:#d7ad5a;font-size:3rem;text-align:center}.versus small{font-size:.7rem}.combat-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:18px}.combat-log{max-width:900px;max-height:230px;overflow:auto;margin:auto;padding:15px;color:#a99c87;border:1px solid #483924;background:#11100d}.combat-log p{margin:5px;font-size:.78rem}
@media(max-width:1100px){.race-grid{grid-template-columns:repeat(2,1fr)}.workbench-layout{grid-template-columns:1fr 1fr}.animated-forge{grid-row:1/3}.craft-archive{grid-column:1}.travel-grid,.enemy-grid,.library-shelves{grid-template-columns:repeat(2,1fr)}}
@media(max-width:780px){.map-layer-switches{display:none}.race-grid,.v3-dashboard,.travel-grid,.enemy-grid,.library-shelves,.workbench-layout,.rune-columns,.v3-character-summary{grid-template-columns:1fr}.race-seal{margin:auto}.allocate-points{justify-content:flex-start}.allocate-points strong{text-align:left}.animated-forge{grid-row:auto}.combat-stage{grid-template-columns:1fr}.versus{font-size:2rem}.travel-card{grid-template-columns:36px 1fr}.travel-card button{grid-column:1/-1}.fighter img{height:210px}}

/* Eldoria V3.1 — katmanlı topoğrafik dünya */
.map-stage{isolation:isolate;background:radial-gradient(circle at 44% 38%,#17333a 0,#07161c 46%,#02080b 100%);box-shadow:inset 0 0 90px #000,0 16px 44px rgba(0,0,0,.42)}
.map-stage::before{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,216,145,.055),transparent 28%,transparent 72%,rgba(0,0,0,.3)),repeating-linear-gradient(0deg,rgba(255,255,255,.011) 0 1px,transparent 1px 4px);mix-blend-mode:screen}
#map-canvas{z-index:0}.map-tooltip,.map-chronometer,.map-legend,.map-hint{z-index:4}
.map-chronometer{position:absolute;top:18px;right:18px;display:flex;flex-direction:column;min-width:190px;padding:11px 15px 10px;color:#bba980;border:1px solid rgba(218,181,103,.36);border-radius:2px;background:linear-gradient(135deg,rgba(36,27,16,.94),rgba(11,17,17,.88));box-shadow:0 9px 28px #000,inset 0 0 22px rgba(207,155,62,.08);text-align:right;pointer-events:none}
.map-chronometer::before{content:"✦";position:absolute;left:11px;top:10px;color:#98713d;font-size:1rem}.map-chronometer span{color:#8c7a5c;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase}.map-chronometer strong{margin:2px 0;color:#f0d99e;font:700 .9rem var(--display);letter-spacing:.04em}.map-chronometer small{color:#7f958a;font-size:.62rem}
.map-legend{position:absolute;left:17px;bottom:48px;width:178px;color:#a89a80;border:1px solid rgba(200,169,103,.26);background:rgba(8,14,14,.88);box-shadow:0 8px 22px rgba(0,0,0,.48);font-size:.62rem}.map-legend summary{padding:8px 10px;color:#d8c28b;cursor:pointer;font:700 .66rem var(--display);letter-spacing:.08em}.map-legend>div{display:grid;grid-template-columns:1fr 1fr;gap:7px 9px;padding:0 10px 10px}.map-legend span{display:flex;align-items:center;gap:6px;white-space:nowrap}.map-legend i{display:inline-grid;place-items:center;width:17px;height:12px;color:#75a56c;font-style:normal}.legend-height{border-radius:50%;background:repeating-radial-gradient(ellipse,#9c8e6d 0 1px,transparent 1px 3px)}.legend-river{border-top:3px solid #66bfd8}.legend-road{border-top:3px dashed #d0a26b}.legend-player{border:1px solid #6fffd3;border-radius:50%;color:#d8ffef!important}.legend-weather{color:#a98bff!important;text-shadow:0 0 7px #876ad8}
.map-hint{bottom:13px;max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(194,163,99,.14);background:rgba(6,11,11,.82);box-shadow:0 5px 16px #000;color:#a69a83}
.atlas-svg{filter:drop-shadow(0 17px 32px rgba(0,0,0,.68)) saturate(1.06)}.sea-contour{fill:none;stroke:#6ea4ad;stroke-width:1.2;opacity:.1}.atlas-grid{stroke:#b8d3d0;stroke-width:.75;opacity:.105}.atlas-coast-shadow{fill:none;stroke:#031013;stroke-width:12;opacity:.72;pointer-events:none}.atlas-country{stroke:#c9aa68;stroke-width:1.8;opacity:.99;filter:none}.atlas-country:hover,.atlas-country:focus,.atlas-country.selected{stroke:#ffe9a3;stroke-width:3.5;filter:drop-shadow(0 0 9px rgba(255,214,119,.72)) brightness(1.12)}.atlas-relief-contour{fill:none;stroke:#f0e0b7;stroke-width:1;opacity:.12;pointer-events:none}.terrain-symbols{pointer-events:none}.terrain-symbols text{fill:#102516;font:700 12px Georgia;opacity:.28;text-anchor:middle}.terrain-symbols.biome-mountain text{fill:#e1d7c1;font-size:11px;opacity:.36}.terrain-symbols.biome-desert text{fill:#5b351d;font-size:16px;opacity:.28}.terrain-symbols.biome-swamp text{fill:#17271e;opacity:.34}.terrain-symbols.biome-coast text{fill:#a9ddd2;opacity:.25}.atlas-country-label{fill:#fff1c5;font-size:13px;letter-spacing:.14em;stroke:#11150f;stroke-width:4.5}.atlas-biome-label{fill:#d3c59f;font:italic 9px var(--serif);text-anchor:middle;paint-order:stroke;stroke:#14150f;stroke-width:3;pointer-events:none;opacity:.82}
.atlas-feature{fill:none;pointer-events:none}.river-shadow{stroke:#071821;stroke-width:6;opacity:.58}.feature-river{stroke:#77cbe0;stroke-width:2.5;filter:drop-shadow(0 0 2px #4ca3bd)}.road-shadow{stroke:#23180e;stroke-width:5;opacity:.62}.feature-road{stroke:#d2a46e;stroke-width:1.8;stroke-dasharray:5 2}.feature-mountain{stroke:#e3d7bb;stroke-width:1.2;opacity:.42}.mountain-mark path{fill:#a9a18f;stroke:#ded6c5;stroke-width:.7;opacity:.8;filter:drop-shadow(0 2px 2px #1a1712)}.forest-cluster path{fill:#1c522f;stroke:#89a76c;stroke-width:.5;opacity:.9;filter:drop-shadow(0 2px 2px #09150d)}
.atlas-route-under{fill:none;stroke:#171008;stroke-width:6;opacity:.55;pointer-events:none}.atlas-route{stroke:#e0ae73;stroke-width:2;stroke-dasharray:7 4;opacity:.8;animation:routeMarch 3s linear infinite}.atlas-route.trade,.atlas-route.sea{stroke:#7fd0df}.atlas-ship text{fill:#f6e7be;font-size:19px}.ship-wake{fill:none;stroke:#8cc9d0;stroke-width:1.4;opacity:.58}.atlas-structure circle{fill:#16130d;stroke:#d0a75f;stroke-width:1.6;opacity:.94}.atlas-structure text{font-size:15px;paint-order:stroke;stroke:#151009;stroke-width:3}.structure-port circle{stroke:#68c1ce}.structure-dungeon circle{stroke:#ad5b50}.atlas-weather circle{fill:rgba(12,18,18,.78);stroke:#9d8ad0;stroke-width:1.4}.atlas-weather text{fill:#e7e2ff;font:700 18px var(--serif);text-anchor:middle;paint-order:stroke;stroke:#13100c;stroke-width:3}.atlas-anomaly circle:first-child{stroke-width:2}.atlas-anomaly circle:nth-child(2){fill:rgba(176,77,216,.13);stroke:#b85ede;stroke-width:1}
.atlas-player{transition:transform 4.7s linear}.atlas-player .player-pulse{fill:none;stroke:#75ffd7;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:travelerPulse 1.8s ease-out infinite}.atlas-player circle:nth-child(2){fill:#173f35;stroke:#c4ffe9;stroke-width:2}.atlas-player text{fill:#effff8;font-size:11px}.player-travel-trail{fill:none;stroke:#71ffd6;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:3 5;opacity:.72;filter:drop-shadow(0 0 4px #4df0bd)}
.atlas-compass circle{fill:rgba(9,15,15,.78);stroke:#c8aa68;stroke-width:1.4}.atlas-compass path:nth-child(2){fill:#a34e38;stroke:#e5cf9c;stroke-width:.7}.atlas-compass path:nth-child(3){fill:#81745b;stroke:#ddc78f;stroke-width:.7}.atlas-compass text{fill:#d9c391;font:700 9px var(--display);text-anchor:middle}.map-layer-switches{display:flex;align-items:center;gap:7px;flex-wrap:wrap;max-width:620px}.map-layer-switches label{display:flex;align-items:center;gap:4px;padding:5px 7px;color:#94866d;border:1px solid rgba(183,147,81,.16);background:#12130f;font-size:.62rem;cursor:pointer}.map-layer-switches label:has(input:checked){color:#e0cfaa;border-color:rgba(204,166,90,.38);background:#242017}.map-layer-switches input{accent-color:#b7833b}
.atlas-route.trade{stroke:#d5a459}.atlas-route.sea{stroke:#7fd0df}
@keyframes routeMarch{to{stroke-dashoffset:-22}}@keyframes travelerPulse{0%{opacity:.9;transform:scale(.7)}100%{opacity:0;transform:scale(1.65)}}
@media(max-width:1100px){.map-chronometer{left:12px;right:auto}.map-legend{left:12px}.map-actions{align-items:flex-end;flex-wrap:wrap;justify-content:flex-end}.map-layer-switches{max-width:420px}.region-panel:has(.empty-region){top:auto;bottom:10px;width:255px;height:142px}.region-panel:has(.empty-region) .empty-region{grid-template-columns:40px 1fr;grid-template-rows:auto auto;align-content:center;justify-items:start;column-gap:10px;padding:14px;text-align:left}.region-panel:has(.empty-region) .ornament{grid-row:1/3}.region-panel:has(.empty-region) h3{margin:0}.region-panel:has(.empty-region) p{margin:4px 0 0;font-size:.7rem}}
@media(max-width:780px){.map-chronometer{top:10px;left:10px;right:auto;min-width:160px}.map-legend{display:none}.map-hint{display:none}}
.map-point-menu{position:fixed;z-index:1000;display:grid;gap:10px;padding:16px;width:280px;max-width:90vw;background:#19170f;border:1px solid #b99855;box-shadow:0 12px 40px #000b;color:#ecd5a0;border-radius:8px}.map-point-menu.hidden{display:none}.map-point-menu strong{font-size:13px}.map-point-menu button{text-align:left}.player-camp{cursor:help}
.graphics-quality{font-size:.75rem;color:#d8c599;white-space:nowrap}.graphics-quality select{background:#211e16;color:#ead4a0;border:1px solid #685533;padding:7px}.view:not(.active) *{animation-play-state:paused!important}.travel-card,.enemy-card,.recipe-card,.item-card,.civilization-card{content-visibility:auto;contain-intrinsic-size:auto 240px}body[data-graphics="low"] .atlas-svg,body[data-graphics="low"] .atlas-feature,body[data-graphics="low"] .forest-cluster path,body[data-graphics="low"] .player-travel-trail{filter:none}body[data-graphics="low"] .atlas-route,body[data-graphics="low"] .player-pulse{animation:none}@media(prefers-reduced-motion:reduce){.atlas-route,.player-pulse,.forge-glow{animation:none!important}}
*{scrollbar-width:thin;scrollbar-color:#8f7041 #171611}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#171611}::-webkit-scrollbar-thumb{background:#8f7041;border:2px solid #171611;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#c3a165}.map-heading-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.map-heading-row h2{font-size:clamp(1.35rem,2.1vw,2rem);line-height:1.2;margin:4px 0}.map-heading-row .eyebrow{margin:0;font-size:.65rem}.map-actions{gap:8px;flex-wrap:wrap;justify-content:flex-end}.map-actions>.secondary-button{padding:9px 12px;min-height:38px;white-space:nowrap}.map-layer-switches{display:grid;grid-template-columns:repeat(3,max-content);gap:5px 12px}.map-layout{height:calc(100% - 105px)}@media(max-width:1100px){.map-actions{justify-content:flex-start}.map-layout{height:calc(100% - 145px)}}