.yazawin {
  --bg:#101318;
  --nav:#15171b;
  --panel:#292c31;
  --text:#f1e0c5;
  --muted:#c4b49b;
  --gold:#c9a45c;
  --warm:#e0b774;
  --line:#514432;
  --war:#963e3e;
  --jade:#397f70;
  --royal-gold:linear-gradient(180deg,#f6df9e 0%,#e5b969 50%,#bd8541 100%);
  font-family:system-ui,"Noto Sans Myanmar","Myanmar Text",sans-serif;
  color:var(--text);
  background:radial-gradient(ellipse at 50% 0%,#211d19,var(--bg) 55%);
}
.yazawin [lang="my"],html[lang="my"] .yazawin h2,html[lang="my"] .yazawin h3 {
  font-family:"Noto Sans Myanmar","Myanmar Text",system-ui,sans-serif;
}
.yazawin .brand { gap:.65rem; }
.yazawin .brand img { flex:none; }
.yazawin .brand-name { color:#f1ce83; font:700 1.24rem/1.05 Georgia,serif; letter-spacing:.055em; }
.yazawin .brand-my { display:block; margin-top:.25rem; color:var(--text); font-size:.7rem; letter-spacing:0; line-height:1.45; }
.yazawin aside { background:linear-gradient(160deg,#211a15,#121419 65%); }
.yazawin #nav a[aria-current="page"] {
  color:#ffe5ab;
  border-color:#7a5d39;
  background:linear-gradient(90deg,#4b3422,#221b18);
  box-shadow:inset 2px 0 #d4aa61;
}
.yazawin .panel,.yazawin .cards>article,.yazawin .resources>div,.yazawin .places>a {
  background:linear-gradient(145deg,#29282a,#1b1d21);
  border-color:var(--line);
}
.yazawin .command-bar { border-color:var(--line); }
.yazawin .recovery-strip>div {
  background:linear-gradient(150deg,#272522,#171a1e);
  border-color:#695438;
  color:#eddbba;
}
.yazawin .hero { border-color:#96713c; }
.yazawin .hero::after {
  background:linear-gradient(90deg,#191315de,transparent 86%),linear-gradient(0deg,#100f12d9,transparent 73%);
}
.yazawin .hero h1,.yazawin h2 { color:#f5e1bb; }
.yazawin .eyebrow { color:#e3bd75; }
.yazawin .city-shortcuts {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,126px),1fr));
  gap:8px;
  margin-block:1rem;
}
.yazawin .city-shortcuts a {
  display:flex;
  gap:.55rem;
  align-items:center;
  min-width:0;
  padding:.7rem;
  color:#f1d69d;
  border:1px solid #7b5b34;
  border-radius:6px;
  background:linear-gradient(145deg,#3c2b21,#1c1819);
}
.yazawin .city-shortcuts a:hover { border-color:#e0b774; background:#443120; }
.yazawin .city-shortcuts .icon { width:28px; height:28px; flex:none; }
.yazawin .city-shortcuts span:last-child { overflow-wrap:anywhere; }
.yazawin.entry-screen {
  min-height:100vh;
  background:linear-gradient(180deg,#10131875,#1013186e 34%,#101318ed 85%,#101318),url("/assets/bagan-cinematic.png") center 42%/cover no-repeat fixed;
}
.entry-screen .layout { display:block; max-width:1440px; }
.entry-screen aside {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  position:relative;
  height:auto;
  margin:0 auto;
  padding:.7rem clamp(12px,3vw,28px);
  border:0;
  border-bottom:1px solid #c9a45c66;
  background:#101318bc;
}
.entry-screen .brand,.entry-screen .controls { margin:0; padding:0; border:0; }
.entry-screen main { padding:clamp(12px,3vw,32px) 14px; }
.login-brand { text-align:center; margin:0 auto 1rem; text-shadow:0 2px 12px #000; }
.login-crown { display:block; width:clamp(134px,32vw,240px); height:auto; margin:0 auto -.12rem; filter:drop-shadow(0 4px 4px #000); }
.login-brand h1 {
  margin:0;
  font:700 clamp(2.8rem,10vw,6.9rem)/.96 Georgia,serif;
  letter-spacing:.035em;
  color:#efc780;
  background:var(--royal-gold);
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
  filter:drop-shadow(0 3px 1px #422616) drop-shadow(0 7px 12px #000);
}
.login-subtitle {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.7rem;
  color:#f3d395;
  margin-top:.5rem;
  font-size:clamp(1rem,3vw,1.75rem);
  line-height:1.55;
}
.login-subtitle::before,.login-subtitle::after {
  content:"";
  width:clamp(26px,10vw,106px);
  height:1px;
  background:linear-gradient(90deg,transparent,#e5b969);
}
.login-subtitle::after { transform:scaleX(-1); }
.login-tagline { margin:.15rem 0; color:#f3d7a1; font-size:clamp(.95rem,2vw,1.3rem); }
html[lang="en"] .login-tagline { font-family:Georgia,serif; font-style:italic; letter-spacing:.08em; }
.login-genre { margin:.4rem 0; color:#f1e0c5; font-size:.82rem; letter-spacing:.05em; }
.yazawin.entry-screen #auth,.yazawin.entry-screen #creation,.yazawin.entry-screen #notice {
  width:min(100%,460px);
  margin:1rem auto;
  border-color:#a58149;
  background:linear-gradient(165deg,#2d241cee,#141418fa);
  box-shadow:0 16px 44px #0009,inset 0 0 0 3px #1413167d;
}
.entry-screen #auth h2,.entry-screen #creation h2 { margin-top:0; }
.entry-screen input,.entry-screen select { background:#111318; border-color:#765938; }
.yazawin.entry-screen #auth-submit,.yazawin.entry-screen #character-form button {
  background:linear-gradient(180deg,#973d34,#651f27);
  border-color:#cf9f59;
  color:#fff0d3;
}
.yazawin.entry-screen #auth-submit:hover,.yazawin.entry-screen #character-form button:hover { background:linear-gradient(180deg,#b24e3c,#78282a); }
.yazawin.entry-screen footer { text-align:center; color:#e5ceb0; }
@media(max-width:540px) {
  .entry-screen .brand img { width:34px; height:34px; }
  .entry-screen .login-brand { margin-top:.6rem; }
  .yazawin.entry-screen { background-attachment:scroll; }
}

/* Lucky Wheel: the numbered sectors map to the accessible odds cards. */
.lucky-wheel-panel{max-width:1100px;margin-bottom:24px}.lucky-wheel-stage{position:relative;display:grid;place-items:center;margin:28px auto;width:min(290px,75vw);aspect-ratio:1}.lucky-wheel{width:100%;height:100%;border:8px double #c9a45c;border-radius:50%;background:repeating-conic-gradient(from 0deg,#632927 0deg 30deg,#b18a48 30deg 60deg);box-shadow:0 0 0 6px #101318,0 15px 45px #0009;transition:transform 1.8s cubic-bezier(.12,.65,.14,1);position:relative}.lucky-wheel:after{content:'Y';position:absolute;inset:37%;display:grid;place-items:center;border:2px solid #c9a45c;border-radius:50%;background:#101318;color:#e8dcc3;font:bold 35px Georgia}.lucky-wheel>span{position:absolute;left:calc(50% - 14px);top:calc(50% - 14px);width:28px;height:28px;text-align:center;color:#fff9df;font-weight:bold;transform:rotate(calc(var(--segment)*30deg + 15deg)) translateY(-104px) rotate(calc(var(--segment)*-30deg - 15deg))}.wheel-pointer{position:absolute;top:-15px;z-index:1;font-size:32px;color:#f8dda1;text-shadow:0 2px 4px #000}.wheel-result{min-height:30px;color:#f5d79b}.wheel-prizes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;margin:16px 0}.wheel-prize{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px;background:#101318;border:1px solid #c9a45c40;border-radius:6px}.wheel-prize strong{display:flex;align-items:center;gap:8px}.booster-meter{min-width:180px;max-width:340px;font-size:12px}.booster-meter progress{width:100%;accent-color:#8bb2aa}.booster-meter small{display:block}@media(prefers-reduced-motion:reduce){.lucky-wheel{transition:none}}

/* Reward portraits stay aligned with the twelve server-defined prize sectors. */
.lucky-wheel-stage{width:min(420px,100%);container-type:inline-size}
.wheel-segment{position:absolute;left:50%;top:50%;width:14cqw;height:14cqw;transform:translate(-50%,-50%) rotate(calc(var(--segment)*30deg + 15deg)) translateY(-34cqw) rotate(calc(var(--segment)*-30deg - 15deg));border:1px solid #e8c886;border-radius:10px;background:#101318;box-shadow:0 3px 8px #0009}
.wheel-segment .wheel-reward-art{display:block;width:100%;height:100%;min-width:0;border:0;border-radius:9px;object-fit:cover}
.wheel-segment-index,.wheel-segment-amount{position:absolute;background:#101318ed;border:1px solid #c9a45c;color:#fff2d3;font-size:clamp(9px,3cqw,12px);line-height:1.3;padding:1px 4px;border-radius:4px;font-weight:bold}
.wheel-segment-index{left:-5px;top:-6px}.wheel-segment-amount{right:-5px;bottom:-6px}.wheel-segment-legendary{border-color:#ffde81;box-shadow:0 0 12px #ffd36c88}
.wheel-prize .wheel-reward-art,.wheel-result .wheel-reward-art{display:inline-block;width:36px;height:36px;min-width:36px;object-fit:cover;border-radius:6px;margin:0}

.training-cover{display:block;width:100%;height:auto;border-radius:10px;margin-bottom:1rem}
.work-rewards,.territory-intel{background:#161719;border:1px solid #aa884950;border-radius:8px;padding:.75rem;margin:.65rem 0}
.work-rewards .reward{margin:.25rem 0 0}.territory-intel summary{cursor:pointer;color:#efd196;font-weight:700}.territory-intel h4{margin:.8rem 0 .3rem}

/* The desktop sidebar also serves as the mobile navigation drawer. */
.mobile-game-header { display:none; }
@media (max-width:900px) {
  .yazawin .layout { display:block; }
  .yazawin:not(.entry-screen) .layout > #game-sidebar { display:none; }
  .mobile-game-header {
    position:sticky; top:0; z-index:210; display:flex;
    align-items:center; justify-content:space-between; gap:12px;
    padding:calc(8px + env(safe-area-inset-top)) 14px 8px;
    background:#17171a; border-bottom:1px solid var(--line);
  }
  .mobile-game-header .brand { padding:0; border:0; }
  .mobile-game-header button, .mobile-menu-heading button { min-height:44px; }
  #game-menu {
    position:fixed; inset:0 auto 0 0; margin:0; padding:0;
    width:min(340px,calc(100% - 36px)); max-width:none;
    height:100dvh; max-height:none; border:0; border-right:1px solid var(--line);
    background:#17171a; color:var(--text);
  }
  #game-menu[open] { display:flex; flex-direction:column; }
  #game-menu::backdrop { background:#000a; }
  body:has(#game-menu[open]) { overflow:hidden; }
  .mobile-menu-heading {
    display:flex; align-items:center; justify-content:space-between;
    padding:calc(10px + env(safe-area-inset-top)) 14px 10px;
    border-bottom:1px solid var(--line);
  }
  #game-menu #game-sidebar {
    position:static; display:flex; flex:1; min-height:0; height:auto;
    padding:12px 14px calc(12px + env(safe-area-inset-bottom));
    gap:12px; border:0;
  }
  #game-menu #nav {
    display:grid; gap:4px; min-height:0; flex:1; overflow:auto;
    overscroll-behavior:contain; align-content:start;
  }
  #game-menu #nav a { min-height:44px; font-size:.875rem; white-space:normal; }
  #game-menu .controls { margin:0; justify-content:flex-start; }
  .yazawin main { padding-inline:clamp(12px,3vw,24px); overflow-wrap:anywhere; }
  .yazawin main img { max-width:100%; }
  .yazawin main input, .yazawin main select, .chat-compose textarea { font-size:16px; }
  .yazawin main input, .yazawin main select, .yazawin main form label { min-width:0; }
  .yazawin main button { min-height:44px; white-space:normal; }
  .yazawin .cards > *, .yazawin .resources > *, .yazawin .panel { min-width:0; }
  .yazawin .profile-layout { grid-template-columns:minmax(0,1fr); }
  .wheel-prizes { grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); }
  #chat-root { right:12px; bottom:calc(10px + env(safe-area-inset-bottom)); }
  .chat-launcher { flex-wrap:wrap; }
  .chat-launcher button { min-height:44px; flex:1; }
  .chat-panel { max-height:calc(100dvh - 135px - env(safe-area-inset-bottom)); }
  .bank-scroll, .hall-table-scroll { max-width:100%; }
}
@media (max-width:420px) {
  .yazawin .campaign-front .buttons, .yazawin .defense-grid { grid-template-columns:minmax(0,1fr); }
  .hall-animal-choices .hall-animal { width:min(58px,13vw); height:min(58px,13vw); flex-basis:auto; }
  .yazawin .hall-table, .yazawin .hall-panel { padding:12px; }
}