:root {
  --ivory: #f1efe9;
  --paper: #faf9f5;
  --sand: #c9c1b5;
  --taupe: #746f67;
  --graphite: #292d2b;
  --gold: #8b6846;
  --gold-light: #bcae95;
  --copper: #875b43;
  --sage: #52605a;
  --ink: #252827;
}
* { box-sizing: border-box; }
::selection { background: rgba(184,137,46,.24); color: #292722; }
body { overflow-x: hidden; }
button:disabled { cursor: not-allowed; opacity: .45; filter: saturate(.65); }
.anime-world-bg {
  background:
    linear-gradient(120deg, rgba(255,253,248,.96), rgba(241,236,227,.88)),
    repeating-linear-gradient(135deg, transparent 0 36px, rgba(63,57,49,.025) 36px 38px);
}
.anime-gradient-text {
  background: linear-gradient(90deg, #39413e, #806148 52%, #53615a);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.anime-panel {
  border: 1px solid rgba(255,255,255,.88);
  border-radius: 1.15rem;
  background: linear-gradient(145deg, rgba(250,249,245,.97), rgba(232,230,224,.90));
  box-shadow: 0 14px 42px rgba(35,39,37,.12), inset 0 1px 0 rgba(255,255,255,.78);
  backdrop-filter: blur(10px);
}
.anime-panel--hover { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.anime-panel--hover:hover { transform: translateY(-4px); border-color: rgba(184,137,46,.44); box-shadow: 0 24px 70px rgba(48,43,37,.17); }
.eyebrow { font-size: .68rem; font-weight: 900; text-transform: uppercase; letter-spacing: .2em; color: #8a6730; }
.section-title { font-family: Unbounded, sans-serif; font-size: 1rem; font-weight: 800; color: #292722; }
.anime-button {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 2.55rem; border: 0; border-radius: .72rem; padding: .7rem 1.15rem;
  background: linear-gradient(135deg, #2f3532, #4f5b55 58%, #875b43);
  color: #fffdf8; font-size: .76rem; font-weight: 900; line-height: 1; text-decoration: none;
  box-shadow: 0 9px 22px rgba(35,39,37,.22), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.anime-button:hover:not(:disabled) { transform: translateY(-2px); filter: brightness(1.08); box-shadow: 0 15px 34px rgba(62,53,42,.29); }
.anime-button:active:not(:disabled) { transform: translateY(0) scale(.98); }
.anime-button--ghost { background: rgba(255,253,248,.84); color: #51483d; border: 1px solid rgba(105,93,76,.22); box-shadow: 0 7px 20px rgba(48,43,37,.08); }
.anime-button--gold { background: linear-gradient(135deg, #4d5651, #78634f 56%, #875b43); }
.anime-button--danger { background: linear-gradient(135deg, #9f3f36, #4b4039); }
.anime-button--small { min-height: 2.05rem; border-radius: .62rem; padding: .5rem .75rem; font-size: .68rem; }
.anime-button--xl { min-height: 3.2rem; border-radius: .85rem; padding: 1rem 1.45rem; font-size: .86rem; }
.anime-label { display: block; color: #4a443c; font-size: .76rem; font-weight: 900; }
.anime-input {
  width: 100%; border: 1px solid rgba(107,96,80,.2); border-radius: 1rem; background: rgba(255,253,248,.87);
  padding: .78rem .92rem; color: #292722; font-size: .82rem; font-weight: 650; outline: 0;
  box-shadow: inset 0 1px 2px rgba(41,39,34,.04); transition: border-color .16s, box-shadow .16s, background .16s;
}
.anime-input:focus { border-color: rgba(184,137,46,.56); background: #fff; box-shadow: 0 0 0 4px rgba(184,137,46,.11); }
.anime-placeholder {
  position: relative; display: grid; min-height: 340px; place-items: center; overflow: hidden; border-radius: 1rem;
  border: 1px solid rgba(255,255,255,.82); padding: 2rem; text-align: center; color: #51483d; font-size: .78rem; font-weight: 900; line-height: 1.6;
  background:
    linear-gradient(160deg, rgba(255,255,255,.55), transparent 42%),
    repeating-linear-gradient(135deg, transparent 0 28px, rgba(47,53,50,.035) 28px 30px),
    linear-gradient(145deg, #e4e2dc, #d5d5cf 46%, #c8cec9);
  box-shadow: inset 0 0 50px rgba(255,255,255,.65), 0 20px 50px rgba(48,43,37,.13);
}
.anime-placeholder::before, .anime-placeholder::after { content: ""; position: absolute; width: 2.1rem; height: 2.1rem; border-color: rgba(47,53,50,.28); }
.anime-placeholder::before { left: .8rem; top: .8rem; border-left: 2px solid; border-top: 2px solid; }.anime-placeholder::after { right: .8rem; bottom: .8rem; border-right: 2px solid; border-bottom: 2px solid; }
.anime-placeholder--compact { min-height: 180px; padding: 1rem; font-size: .67rem; }
.anime-placeholder--portrait { background: radial-gradient(circle at 50% 24%, rgba(255,255,255,.96), transparent 20%), linear-gradient(145deg,#eee6d9,#d9cfbf 52%,#d7ddd7); }
.anime-placeholder--location { background: radial-gradient(circle at 70% 20%,rgba(232,211,155,.55),transparent 22%),linear-gradient(145deg,#dce0d8,#e9e1d5 48%,#d9ccb9); }
.anime-placeholder--effect { background: radial-gradient(circle,rgba(255,255,255,.92),transparent 18%),conic-gradient(from 45deg,#c4b79f,#8e8170,#78867c,#e2c77f,#c4b79f); }
.anime-placeholder__shine { position: absolute; inset: 0; background: linear-gradient(120deg,transparent 0 46%,rgba(255,255,255,.18) 50%,transparent 54%); opacity:.55; }
.top-resource { display: flex; align-items: center; gap: .35rem; border: 1px solid rgba(107,96,80,.14); border-radius: .85rem; background: rgba(255,253,248,.8); padding: .5rem .7rem; font-size: .7rem; color: #6b645b; }
.top-resource b { color: #4b4338; }
.side-link { display: flex; align-items: center; gap: .75rem; border-radius: 1rem; padding: .7rem .8rem; color: #625b52; transition: .16s; }
.side-link:hover { background: rgba(239,234,225,.94); color: #7b5d2c; transform: translateX(2px); }
.side-link--active { background: linear-gradient(135deg,rgba(239,232,218,.96),rgba(225,218,205,.94)); color: #6e5227; box-shadow: inset 3px 0 #b8892e; }
.progress-gold { background: linear-gradient(90deg,#8f6b2d,#d4ad55); }
.progress-sage { background: linear-gradient(90deg,#65746a,#a9b2a6); }
.progress-bronze { background: linear-gradient(90deg,#79533b,#b9855a); }
.stat-chip { display: inline-flex; align-items: center; gap: .45rem; border-radius: .8rem; background: rgba(255,253,248,.8); padding: .5rem .7rem; color: #6b645b; font-size: .68rem; font-weight: 800; }
.stat-chip b { color: #5b4931; }
.stat-box { border: 1px solid rgba(255,255,255,.82); border-radius: 1rem; background: rgba(255,253,248,.76); padding: .72rem; }
.stat-box b { display: block; color: #5b4931; font-size: .9rem; font-weight: 900; }.stat-box span { display: block; margin-top: .2rem; color: #71695f; font-size: .62rem; font-weight: 800; }
.stat-box--large { padding: 1rem; text-align: center; }.stat-box--large b { font-family: Unbounded,sans-serif; font-size: 1.12rem; }
.mini-tag { display: inline-flex; align-items: center; border-radius: 999px; background: rgba(229,222,211,.9); padding: .27rem .55rem; color: #5d5143; font-size: .57rem; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.rarity { display: inline-flex; border-radius: 999px; padding: .25rem .55rem; font-size: .57rem; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.rarity-common{background:#f1f0ed;color:#57534e}.rarity-uncommon{background:#e4ece5;color:#3f6250}.rarity-rare{background:#dfe5df;color:#4f6256}.rarity-epic{background:#e8e0d5;color:#70543b}.rarity-legendary{background:#f4e7bd;color:#8a5d14}.rarity-mythic{background:linear-gradient(90deg,#eee7db,#d6c39b,#d9ddd7);color:#51402b}
.flash-card { display:flex; align-items:flex-start; gap:.75rem; border:1px solid rgba(255,255,255,.82); border-radius:1.1rem; padding:.9rem 1rem; background:rgba(255,253,248,.96); box-shadow:0 18px 45px rgba(41,39,34,.17); font-size:.76rem; font-weight:800; backdrop-filter:blur(16px); }
.flash-success{border-left:4px solid #4d7b5a}.flash-error{border-left:4px solid #a63f38}.flash-loot{border-left:4px solid #b8892e;background:linear-gradient(90deg,#fff8e5,#fffdf8)}.flash-forge{border-left:4px solid #9a6a45}.flash-battle{border-left:4px solid #61564a}
.choice-card { cursor:pointer; border:1px solid rgba(77,84,80,.18); border-radius:.9rem; background:rgba(255,253,248,.76); padding:1rem; transition:.18s; }
.choice-card:hover { transform:translateY(-3px); box-shadow:0 16px 38px rgba(48,43,37,.13); }.choice-card--active { border-color:#b8892e; box-shadow:0 0 0 3px rgba(184,137,46,.12),0 18px 45px rgba(48,43,37,.15); background:rgba(255,253,248,.97); }
.world-map-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; }
.world-node { position:relative; min-height:230px; border:1px solid rgba(107,96,80,.16); border-radius:1.4rem; background:linear-gradient(145deg,rgba(255,253,248,.94),rgba(235,229,219,.79)); padding:1rem; transition:.18s; }
.world-node:hover { transform:translateY(-3px); border-color:rgba(101,116,106,.46); box-shadow:0 18px 40px rgba(65,75,68,.12); }.world-node--current { border-color:#b8892e; box-shadow:0 0 0 3px rgba(184,137,46,.11); }.world-node--locked { filter:saturate(.55); opacity:.75; }
.status-pill { display:inline-flex; border-radius:999px; background:#e8e1d7; padding:.22rem .5rem; color:#5f5141; font-size:.56rem; font-weight:900; }.status-pill--threat { background:#f1ded9;color:#8c352e; }
.combat-unit { border:1px solid rgba(107,96,80,.16); border-radius:1.35rem; background:rgba(255,253,248,.82); padding:.9rem; transition:.16s; }.combat-unit--player{box-shadow:inset 3px 0 #b8892e}.combat-unit--enemy{box-shadow:inset -3px 0 #51483d}.combat-unit--enemy:hover{transform:translateX(-2px);border-color:rgba(81,72,61,.38)}.combat-unit--target{border-color:#a5633f;box-shadow:0 0 0 3px rgba(165,99,63,.14),inset -3px 0 #a5633f}
.combat-avatar { display:grid; width:3rem; height:3rem; flex-shrink:0; place-items:center; border-radius:1rem; background:linear-gradient(145deg,#eee4d4,#d9c8ab); color:#7c5b25; font-size:1.3rem; }.combat-avatar--enemy{background:linear-gradient(145deg,#ddd7ce,#c8c0b5);color:#4d463e}
.combat-action,.ability-action { border:1px solid rgba(107,96,80,.16); border-radius:1.15rem; background:rgba(255,253,248,.84); padding:.9rem; text-align:left; transition:.16s; }.combat-action{display:flex; min-height:110px; flex-direction:column; gap:.35rem}.combat-action b{font-size:.76rem}.combat-action small{color:#71695f;font-size:.62rem}.combat-action:hover:not(:disabled),.ability-action:hover:not(:disabled){transform:translateY(-2px);border-color:rgba(184,137,46,.46);box-shadow:0 12px 28px rgba(48,43,37,.13)}
.ability-action{width:100%;}.battle-log{scrollbar-width:thin;scrollbar-color:#b9ad9c transparent}.battle-effect{border:1px solid rgba(184,137,46,.4);border-radius:1.2rem;background:linear-gradient(90deg,rgba(250,239,205,.96),rgba(236,229,218,.96));padding:1rem;text-align:center;color:#68451f;font-size:.75rem;font-weight:900;animation:pulse-effect .65s ease}
.item-card { border:1px solid rgba(120,113,105,.18); border-radius:1.35rem; background:rgba(255,253,248,.82); padding:1rem; box-shadow:inset 0 1px 0 rgba(255,255,255,.92); }.item-card--uncommon{border-color:rgba(75,112,82,.27)}.item-card--rare{border-color:rgba(86,107,92,.31)}.item-card--epic{border-color:rgba(123,91,60,.34)}.item-card--legendary{border-color:rgba(184,137,46,.45);background:linear-gradient(145deg,rgba(255,249,229,.93),rgba(255,253,248,.84))}.item-card--mythic{border-color:rgba(96,80,57,.43);background:linear-gradient(145deg,rgba(239,232,218,.9),rgba(222,208,180,.82),rgba(218,224,217,.76))}
.ability-node { position:relative; border:1px solid rgba(120,113,105,.18); border-radius:1.25rem; background:rgba(255,253,248,.82); padding:.9rem; }.ability-node--locked{opacity:.6;filter:saturate(.55)}.ability-node--known{border-color:rgba(184,137,46,.28);box-shadow:0 10px 26px rgba(48,43,37,.09)}
.forge-hero { background:radial-gradient(circle at 90% 20%,rgba(224,190,98,.3),transparent 30%),radial-gradient(circle at 15% 80%,rgba(154,106,69,.16),transparent 33%),linear-gradient(145deg,rgba(255,253,248,.96),rgba(245,236,221,.8)); }.forge-stat{display:inline-flex;gap:.35rem;border:1px solid rgba(184,137,46,.24);border-radius:999px;background:rgba(255,248,226,.88);padding:.45rem .7rem;color:#795421;font-size:.64rem;font-weight:800}.forge-stat b{color:#6d4b2d}
.tab-button{min-height:2.6rem;flex-shrink:0;border-radius:1rem;padding:.65rem 1rem;color:#71695f;font-size:.72rem;font-weight:900;transition:.16s}.tab-button:hover{background:rgba(239,234,225,.86);color:#6f5228}.tab-button--active{background:linear-gradient(135deg,#eee5d6,#ddd2c1);color:#6c5028;box-shadow:inset 0 0 0 1px rgba(184,137,46,.18)}
.chat-drawer { position:fixed; right:-430px; top:0; z-index:70; display:flex; width:min(420px,100vw); height:100dvh; flex-direction:column; border-left:1px solid rgba(255,255,255,.78); background:linear-gradient(160deg,rgba(255,253,248,.97),rgba(239,234,225,.95)); box-shadow:-24px 0 70px rgba(48,43,37,.2); backdrop-filter:blur(20px); transition:right .22s ease; }.chat-drawer--open{right:0}.chat-channel{flex-shrink:0;border-radius:.8rem;padding:.5rem .65rem;color:#71695f;font-size:.62rem;font-weight:900}.chat-channel--active{background:linear-gradient(135deg,#eee5d6,#ddd2c1);color:#6c5028}.chat-message{border-radius:1rem;background:rgba(255,253,248,.82);padding:.65rem .75rem;font-size:.72rem}.chat-message__meta{display:flex;justify-content:space-between;color:#8a8278;font-size:.56rem;font-weight:800}.chat-message__name{color:#7b5d2c}.chat-message__text{margin-top:.25rem;overflow-wrap:anywhere;color:#403b35;line-height:1.45}
@keyframes shimmer{0%{transform:translateX(-35%) rotate(22deg)}100%{transform:translateX(35%) rotate(22deg)}}
@keyframes float-spark{0%,100%{transform:translateY(0) rotate(0);opacity:.45}50%{transform:translateY(-12px) rotate(16deg);opacity:1}}
@keyframes pulse-effect{0%{transform:scale(.98);opacity:.5}100%{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media(max-width:640px){.anime-panel{border-radius:1.25rem}.anime-placeholder{min-height:250px}.anime-button--xl{width:100%}.section-title{font-size:.9rem}}

/* v1.3 mobile-first shell -------------------------------------------------- */
[x-cloak]{display:none!important}
.mobile-header{position:sticky;top:0;z-index:55;border-bottom:1px solid rgba(255,255,255,.78);background:rgba(255,253,248,.9);box-shadow:0 10px 34px rgba(48,43,37,.08);backdrop-filter:blur(18px);padding-top:env(safe-area-inset-top)}
.mobile-header__inner{display:flex;min-height:58px;align-items:center;gap:.55rem;width:min(100%,1100px);margin:0 auto;padding:.45rem .7rem}
.mobile-brand{display:flex;min-width:0;align-items:center;gap:.55rem;color:var(--ink)}.mobile-brand__mark{display:grid;width:2.25rem;height:2.25rem;flex:none;place-items:center;border-radius:.85rem;background:linear-gradient(145deg,#3c3933,#b8892e);color:#fff;box-shadow:0 8px 20px rgba(48,43,37,.16)}.mobile-brand b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Unbounded,sans-serif;font-size:.72rem}.mobile-brand small{display:block;margin-top:.1rem;color:#8a7d6c;font-size:.53rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.header-actions{display:flex;align-items:center;gap:.35rem;margin-left:auto}.header-chip{display:inline-flex;min-height:2.2rem;align-items:center;gap:.25rem;border:1px solid rgba(120,113,105,.16);border-radius:.8rem;background:rgba(255,255,255,.72);padding:.35rem .48rem;font-size:.65rem;font-weight:900}.header-chip i{color:#8a6a2b;font-style:normal;font-size:.55rem}.header-badge{position:absolute;right:-.15rem;top:-.2rem;border-radius:999px;background:#a33d35;color:white;padding:.05rem .3rem;font-size:.48rem}
.icon-button{position:relative;display:grid;width:2.4rem;height:2.4rem;flex:none;place-items:center;border:1px solid rgba(120,113,105,.16);border-radius:.85rem;background:rgba(255,255,255,.78);color:#4d463e;font-size:1.05rem;font-weight:900;transition:.16s}.icon-button:hover{border-color:#b8892e;transform:translateY(-1px)}
.mobile-vitals{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.35rem;width:min(100%,1100px);margin:0 auto;padding:0 .7rem .48rem}.vital-line{position:relative;height:1.25rem;overflow:hidden;border-radius:.55rem;background:#e7e1d8}.vital-line span{position:absolute;inset:0 auto 0 0;border-radius:inherit}.vital-line b{position:relative;z-index:1;display:block;padding:.18rem .35rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5);font-size:.53rem;text-align:center}.vital-health span{background:linear-gradient(90deg,#80683f,#b8892e)}.vital-mana span{background:linear-gradient(90deg,#53645a,#809284)}.vital-currency{display:flex;align-items:center;border-radius:.55rem;background:#fff8e5;padding:0 .5rem;color:#75551d;font-size:.58rem;font-weight:900}
.app-main{width:min(100%,1100px);min-height:calc(100dvh - 74px);margin:0 auto;padding:1rem max(.75rem,env(safe-area-inset-right)) calc(2rem + env(safe-area-inset-bottom)) max(.75rem,env(safe-area-inset-left))}.app-main--public{width:100%;max-width:none;padding-left:0;padding-right:0}
.nav-backdrop{position:fixed;inset:0;z-index:69;visibility:hidden;background:rgba(31,29,26,.45);opacity:0;backdrop-filter:blur(3px);transition:.2s}.nav-backdrop--open{visibility:visible;opacity:1}.nav-drawer{position:fixed;left:0;top:0;z-index:70;display:flex;width:min(86vw,340px);height:100dvh;transform:translateX(-105%);flex-direction:column;border-right:1px solid rgba(255,255,255,.85);background:linear-gradient(160deg,#fffdf8,#eee8de);box-shadow:24px 0 70px rgba(48,43,37,.22);transition:transform .22s ease;padding-top:env(safe-area-inset-top)}.nav-drawer--open{transform:translateX(0)}.nav-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border-bottom:1px solid rgba(120,113,105,.12);padding:.9rem}.nav-drawer__head b{display:block;font-family:Unbounded,sans-serif;font-size:.76rem}.nav-drawer__head small{display:block;margin-top:.2rem;color:#786f65;font-size:.6rem}.drawer-profile{display:flex;align-items:center;gap:.7rem;margin:.75rem .75rem 0;border-radius:1rem;background:rgba(255,255,255,.68);padding:.7rem}.drawer-avatar{display:grid;width:2.7rem;height:2.7rem;flex:none;place-items:center;border-radius:.9rem;background:linear-gradient(145deg,#ded3c2,#f5e9c7);color:#896326;font-size:1.25rem}.drawer-profile b,.drawer-profile small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drawer-profile b{font-size:.75rem}.drawer-profile small{margin-top:.15rem;color:#766e64;font-size:.56rem}.drawer-nav{min-height:0;flex:1;overflow-y:auto;padding:.7rem}.drawer-link{display:flex;min-height:2.85rem;align-items:center;gap:.7rem;width:100%;border-radius:.85rem;padding:.65rem .75rem;color:#514b43;text-align:left;font-size:.72rem;transition:.15s}.drawer-link span{display:grid;width:1.55rem;place-items:center;color:#8a6728;font-size:.95rem}.drawer-link:hover,.drawer-link--active{background:rgba(255,255,255,.82);color:#2f2b26;box-shadow:inset 3px 0 #b8892e}.drawer-divider{margin:.85rem .7rem .35rem;color:#978d80;font-size:.52rem;font-weight:900;text-transform:uppercase;letter-spacing:.13em}.nav-drawer__logout{border-top:1px solid rgba(120,113,105,.12);padding:.65rem calc(.65rem + env(safe-area-inset-bottom))}
.flash-stack{position:fixed;right:.65rem;top:calc(66px + env(safe-area-inset-top));z-index:80;width:min(390px,calc(100vw - 1.3rem));display:grid;gap:.45rem}
.mobile-page{width:100%}.page-hero{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid rgba(255,255,255,.82);border-radius:1rem;background:linear-gradient(145deg,rgba(255,253,248,.96),rgba(235,229,219,.82));box-shadow:0 14px 38px rgba(48,43,37,.1);padding:1rem}.compact-hero{min-height:112px}.page-title{margin-top:.3rem;font-family:Unbounded,sans-serif;font-size:clamp(1.2rem,5vw,2.1rem);font-weight:900;letter-spacing:-.04em}.page-copy{margin-top:.35rem;max-width:650px;color:#6f675e;font-size:.72rem;line-height:1.55}.hero-symbol{display:grid;width:3.4rem;height:3.4rem;flex:none;place-items:center;border-radius:.75rem;background:linear-gradient(145deg,#39413e,#59645e);color:#f2eee6;font-size:1.35rem;box-shadow:inset 0 1px rgba(255,255,255,.14)}.mobile-panel{padding:1rem}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem}.section-copy{margin-top:.25rem;color:#746d64;font-size:.67rem;line-height:1.5}.compact-tabs{display:flex;gap:.35rem;overflow-x:auto;padding:.15rem;scrollbar-width:none}.compact-tabs::-webkit-scrollbar{display:none}.compact-tab{min-height:2.45rem;flex:none;border:1px solid rgba(80,87,83,.18);border-radius:.65rem;background:rgba(255,255,255,.68);padding:.55rem .75rem;color:#726a60;font-size:.66rem;font-weight:900}.compact-tab--active{border-color:rgba(82,96,90,.45);background:#e7ebe7;color:#35413b;box-shadow:0 7px 18px rgba(48,43,37,.08)}
.mobile-details{border-radius:1rem}.mobile-details>summary{display:flex;min-height:2.5rem;cursor:pointer;align-items:center;justify-content:space-between;gap:.6rem;list-style:none;font-size:.72rem;font-weight:900}.mobile-details>summary::-webkit-details-marker{display:none}.mobile-details>summary::after{content:'+';color:#8b682b;font-size:1rem}.mobile-details[open]>summary::after{content:'−'}
.sticky-action-bar{position:sticky;bottom:calc(.5rem + env(safe-area-inset-bottom));z-index:12;display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1px solid rgba(255,255,255,.9);border-radius:1rem;background:rgba(255,253,248,.94);box-shadow:0 14px 36px rgba(48,43,37,.16);padding:.65rem .75rem;backdrop-filter:blur(15px)}.sticky-action-bar b{font-size:.8rem}.sticky-action-bar small{color:#756d63;font-size:.62rem}
.ingredient-grid{display:grid;gap:.65rem}.ingredient-card{display:flex;position:relative;align-items:flex-start;gap:.65rem;border:1px solid rgba(120,113,105,.14);border-radius:1rem;background:rgba(255,255,255,.66);padding:.75rem;transition:.15s}.ingredient-card:has(input:checked){border-color:#b8892e;background:#fff8e6;box-shadow:0 0 0 2px rgba(184,137,46,.12)}.ingredient-card:has(input:disabled){opacity:.48}.ingredient-card__visual{display:grid;width:3rem;height:3rem;flex:none;overflow:hidden;place-items:center;border-radius:.85rem;background:#eee8de;color:#7c6d5b;font-size:.5rem;text-align:center}.ingredient-card__count{position:absolute;right:.55rem;top:.5rem;border-radius:999px;background:#3e3933;color:white;padding:.15rem .4rem;font-size:.55rem;font-weight:900}.potion-orb{display:grid;width:3.2rem;height:3.2rem;flex:none;place-items:center;border-radius:1rem;background:radial-gradient(circle at 35% 25%,#fff,#d6c092 48%,#7c6340);color:#fff;font-size:1.35rem}.effect-line{border-radius:.75rem;background:rgba(255,255,255,.7);padding:.55rem .65rem;font-size:.65rem;font-weight:800}.empty-state{text-align:center;color:#736c64;padding:1.2rem}.empty-state b{display:block;color:#3f3b36;font-size:.8rem}.empty-state p{margin-top:.35rem;font-size:.67rem;line-height:1.55}
.admin-metric{display:flex;min-height:92px;flex-direction:column;justify-content:center;border:1px solid rgba(255,255,255,.85);border-radius:1rem;background:rgba(255,253,248,.82);padding:.75rem;box-shadow:0 10px 24px rgba(48,43,37,.08)}.admin-metric b{font-family:Unbounded,sans-serif;font-size:1.2rem;color:#72521e}.admin-metric span{margin-top:.25rem;color:#756d63;font-size:.58rem;font-weight:800}.admin-category-grid{display:grid;gap:.55rem}.admin-category-card,.batch-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1px solid rgba(120,113,105,.12);border-radius:.9rem;background:rgba(255,255,255,.65);padding:.7rem .8rem}.admin-category-card b,.batch-row b{display:block;font-size:.7rem}.admin-category-card small,.batch-row small{display:block;margin-top:.18rem;color:#7b746a;font-size:.55rem}.admin-category-card strong{font-family:Unbounded,sans-serif;color:#8b6728;font-size:.8rem}.admin-record>summary{display:flex;align-items:center;justify-content:space-between;gap:.6rem;cursor:pointer;list-style:none}.admin-record>summary::-webkit-details-marker{display:none}.admin-record>summary b,.admin-record>summary small{display:block}.admin-record>summary b{font-size:.72rem}.admin-record>summary small{margin-top:.2rem;color:#7a7268;font-size:.57rem}.admin-record>summary>span:last-child{color:#8b6728;font-size:.6rem;font-weight:900}.admin-field{display:block}.admin-field>span{display:flex;justify-content:space-between;margin-bottom:.35rem;color:#665e55;font-size:.62rem;font-weight:900}.admin-field small{color:#a09281;font-size:.5rem}.admin-switch{display:flex;min-height:2.6rem;align-items:center;gap:.6rem;border-radius:.85rem;background:rgba(255,255,255,.58);padding:.55rem .7rem;color:#5c554d;font-size:.65rem;font-weight:800}.admin-switch input{width:1.05rem;height:1.05rem;accent-color:#b8892e}.anime-file{display:block;width:100%;border:1px dashed rgba(120,113,105,.35);border-radius:.85rem;background:rgba(255,255,255,.65);padding:.65rem;font-size:.62rem}.asset-admin-card .generated-game-asset{width:100%;height:100%;object-fit:cover}.asset-thumb{width:5rem;height:5rem;flex:none;border-radius:1rem;object-fit:cover;background:#e9e3d9}.asset-thumb--placeholder{display:grid;place-items:center;border:1px dashed #aa9d8b;color:#8a7d6c;font-size:.7rem;font-weight:900}.asset-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.asset-result{display:flex;min-width:0;flex-direction:column;gap:.45rem;border:1px solid rgba(120,113,105,.13);border-radius:1rem;background:rgba(255,255,255,.62);padding:.6rem}.asset-result__image{display:grid;aspect-ratio:1;place-items:center;overflow:hidden;border-radius:.75rem;background:#ebe5dc;color:#7a7166;font-size:.65rem}.asset-result__image img{width:100%;height:100%;object-fit:cover}.asset-result b{font-size:.62rem;line-height:1.35}.asset-result small{display:-webkit-box;overflow:hidden;color:#7a7269;font-size:.52rem;line-height:1.35;-webkit-line-clamp:3;-webkit-box-orient:vertical}.admin-prompt{max-height:65dvh;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:.9rem;background:#2e2b27;color:#eee6d8;padding:.8rem;font-size:.58rem;line-height:1.55}.log-line{display:grid;gap:.2rem;border-left:3px solid #9f927f;border-radius:.6rem;background:rgba(255,255,255,.6);padding:.55rem .65rem}.log-line time{color:#8d8377;font-size:.5rem}.log-line span{font-size:.62rem;font-weight:700}.log-warning{border-left-color:#b8892e}.log-error{border-left-color:#a33d35}.status-completed{background:#e3ede5;color:#3d6747}.status-failed{background:#f2dfdc;color:#923a32}.status-running,.status-queued{background:#f6e9c9;color:#805e20}.anime-button--danger{background:linear-gradient(135deg,#8f3b35,#b2584d)!important;color:white!important}.generated-game-asset{display:block;width:100%;height:100%;max-height:420px;border-radius:inherit;object-fit:cover}
@media(min-width:640px){.app-main{padding-top:1.25rem}.mobile-panel{padding:1.2rem}.ingredient-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.asset-result-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.page-hero{padding:1.3rem 1.5rem}}
@media(max-width:420px){.mobile-brand small{display:none}.header-chip:first-child{display:none}.page-hero{align-items:flex-start}.hero-symbol{width:2.8rem;height:2.8rem;font-size:1.2rem}.anime-panel{border-radius:1.1rem}.mobile-panel{padding:.8rem}.page-title{font-size:1.18rem}.asset-thumb{width:4.3rem;height:4.3rem}.flash-stack{top:calc(94px + env(safe-area-inset-top))}}
.admin-readonly{display:grid;gap:.55rem}.admin-readonly>div{min-width:0;border-radius:.75rem;background:rgba(255,255,255,.62);padding:.55rem .65rem}.admin-readonly dt{color:#857a6d;font-size:.52rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.admin-readonly dd{margin-top:.25rem}.admin-readonly pre{max-height:12rem;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;color:#413c36;font-size:.58rem;line-height:1.45}
.alchemy-slots{display:grid;gap:.65rem}.alchemy-slot{border:1px solid rgba(120,113,105,.13);border-radius:1rem;background:rgba(255,255,255,.62);padding:.7rem}.alchemy-slot .anime-input{font-size:.7rem}

.gender-card{display:flex;min-height:7.1rem;cursor:pointer;flex-direction:column;align-items:flex-start;justify-content:center;border:1px solid rgba(82,91,86,.22);border-radius:.75rem;background:rgba(250,249,246,.76);padding:.85rem;transition:.16s}.gender-card:hover{transform:translateY(-2px);border-color:rgba(89,101,94,.44)}.gender-card--active{border-color:#59655e;background:linear-gradient(145deg,#f7f6f2,#e5e8e4);box-shadow:0 0 0 3px rgba(89,101,94,.12)}.gender-card__icon{display:grid;width:2rem;height:2rem;place-items:center;border-radius:.65rem;background:#373b38;color:#f8f5ef;font-family:Unbounded,sans-serif;font-size:.72rem;font-weight:900}.gender-card b{margin-top:.55rem;font-size:.76rem}.gender-card small{margin-top:.2rem;color:#766f66;font-size:.56rem;line-height:1.35}

/* Character creation v1.3.4: every confirmed choice uses one consistent gold signal. */
.gender-card--active,
.portrait-choice--active {
  border-color:#b8892e !important;
  background:linear-gradient(145deg,#fffdf8,#f2ead9) !important;
  box-shadow:0 0 0 3px rgba(184,137,46,.18),0 14px 34px rgba(48,43,37,.14) !important;
}
.gender-card--active .gender-card__icon{background:#8a641e;color:#fffaf0}
.portrait-choice{display:flex;min-width:0;cursor:pointer;flex-direction:column;border:1px solid rgba(77,84,80,.18);border-radius:.9rem;background:rgba(255,253,248,.78);padding:.5rem;transition:.18s}
.portrait-choice:hover{transform:translateY(-2px);border-color:rgba(184,137,46,.55)}
.portrait-choice .anime-placeholder{min-height:9.5rem;border-radius:.65rem}
.portrait-choice__copy{display:flex;min-width:0;flex-direction:column;padding:.65rem .35rem .35rem}
.portrait-choice__copy b{font-size:.72rem;line-height:1.3}
.portrait-choice__copy small{margin-top:.25rem;color:#766f66;font-size:.58rem;line-height:1.4}
[x-cloak]{display:none!important}
@media (max-width:420px){.portrait-choice .anime-placeholder{min-height:8.2rem}.portrait-choice{padding:.4rem}.portrait-choice__copy{padding:.55rem .25rem .25rem}}
.route-card{border:1px solid rgba(77,84,80,.18);border-radius:.8rem;background:rgba(255,253,248,.72);padding:1rem}
.route-card--locked{border-color:rgba(184,137,46,.48);background:rgba(250,242,220,.7)}

.bot-admin-badge{display:inline-flex;margin-left:.35rem;align-items:center;border:1px solid #9a6b2f;border-radius:999px;background:#332f29;color:#f6dca6;padding:.12rem .38rem;font-size:.48rem;font-weight:950;letter-spacing:.08em;vertical-align:middle}
