/* Existing screen layouts and interaction states. Appearance is centralized in veynord.css.
   Keep this entire baseline in the lower layer: never load the old individual sheets alongside it. */
@layer layout, theme;
@layer layout {
:root{color-scheme:dark;--bg:#101310;--panel:#181d19;--panel2:#202620;--border:#343c32;--gold:#d8b77b;--text:#efeee4;--muted:#a8afa3;--green:#a7c5a5;font-size:16px}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top right,#243023 0,transparent 50%),var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.6;min-height:100vh}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;background:var(--panel2);border:1px solid #59614e;color:var(--text);padding:.65rem 1rem;border-radius:3px;min-height:44px;transition:background .15s,border-color .15s}button:hover{border-color:var(--gold);background:#2d3529}button:disabled{opacity:.48;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}a{color:inherit}.top{max-width:1300px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:26px 36px;border-bottom:1px solid var(--border)}.brand{text-decoration:none;font-family:Georgia,serif;font-size:2rem;letter-spacing:.18em;color:var(--gold);line-height:1.2}.brand span{display:block;font-family:system-ui,sans-serif;font-size:.75rem;letter-spacing:.24em;color:var(--muted);margin-top:8px}.wallet{display:flex;gap:32px}.wallet span{display:grid}.wallet small{font-size:.75rem;letter-spacing:.1em;color:var(--muted)}.wallet strong{font-size:1.35rem;font-weight:500;color:var(--gold)}main{max-width:1300px;padding:32px 36px;margin:auto}.layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:28px;align-items:start}.hero{background:var(--panel);border:1px solid var(--border)}.portrait{position:relative;height:390px;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}.portrait:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,#111811 100%)}.portrait-caption{position:absolute;bottom:24px;left:24px;right:20px;z-index:1}.eyebrow{font-size:.75rem;letter-spacing:.13em;font-weight:600;color:var(--gold)}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.2}h1{font-size:2.1rem;overflow-wrap:anywhere;margin:8px 0}h2{font-size:2.25rem;margin:10px 0 16px}h3{font-size:1.3rem}.level{color:#d4dccc;font-size:.875rem}.hero-body{padding:22px}.line{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.hero-body .line{font-size:.875rem;color:var(--muted)}.hero-body .line strong{font-weight:400;color:var(--text)}progress{display:block;appearance:none;width:100%;height:5px;border:0;background:#363d31;color:var(--gold);accent-color:var(--gold);margin:12px 0 24px}progress::-webkit-progress-bar{background:#363d31}progress::-webkit-progress-value{background:var(--gold)}progress::-moz-progress-bar{background:var(--gold)}.mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px}.mini-stats div{display:flex;align-items:center;gap:10px}.mini-stats strong{font-family:Georgia,serif;font-size:1.6rem;font-weight:400}.mini-stats span{font-size:.875rem;color:var(--muted)}.equipped{border-top:1px solid var(--border);padding-top:18px;display:grid;gap:4px}.equipped span{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.equipped strong{font-weight:400;font-size:.875rem;margin-bottom:12px}.rename{font-size:.875rem;color:var(--muted)}summary{cursor:pointer;min-height:44px;padding:8px 0}.rename form{display:grid;gap:8px;margin-top:8px}input{min-width:0;background:var(--bg);border:1px solid var(--border);color:var(--text);padding:10px}.workspace{min-width:0}.workspace nav{display:flex;border-bottom:1px solid var(--border);gap:2px;margin-bottom:28px}.workspace nav button{background:none;border:none;border-bottom:2px solid transparent;border-radius:0;color:var(--muted);padding:12px 18px}.workspace nav button.active{color:var(--gold);border-bottom-color:var(--gold)}.section-head{margin-bottom:25px}.section-head p{color:var(--muted);max-width:620px}.enemy-list{display:grid;gap:12px}.enemy{display:flex;align-items:center;text-align:left;width:100%;gap:20px;border:1px solid var(--border);background:#191f19;padding:20px}.enemy.selected{border-color:#b09361;background:linear-gradient(100deg,#2b3023,#1d241c)}.enemy-number{font-family:Georgia,serif;font-size:2rem;color:#b6a075;width:42px;flex-shrink:0}.enemy>span:nth-child(2){display:grid;gap:3px}.enemy small{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}.enemy strong{font-family:Georgia,serif;font-size:1.35rem;font-weight:400}.enemy>span>span{color:var(--muted);font-size:.875rem}.selection-mark{margin-left:auto;color:var(--gold);font-size:.75rem}.contract{background:var(--panel);border:1px solid var(--border);padding:24px;margin-top:24px}.contract p{color:var(--muted);font-size:.875rem;margin-top:8px}.durations{border:0;padding:0;margin:20px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.durations label{border:1px solid var(--border);padding:12px;cursor:pointer;display:grid;grid-template-columns:20px 1fr;gap:2px 8px}.durations input{grid-row:span 2;align-self:center;accent-color:var(--gold);width:16px;height:16px;padding:0}.durations strong{font-weight:500}.durations span{font-size:.75rem;color:var(--muted)}.durations .chosen{border-color:var(--gold);background:#282f23}.contract-note,.hint{color:var(--muted);font-size:.875rem;margin:16px 0 22px}.primary{display:block;width:100%;background:var(--gold);border-color:var(--gold);color:#1a2017;font-weight:650;padding:14px}.primary:hover{background:#e4c895;color:#13180f}.subheading{margin:28px 0 15px;color:var(--gold)}.item-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.item{border:1px solid var(--border);background:var(--panel);padding:20px;display:flex;flex-direction:column}.item.is-equipped{border-color:#a18b61}.item .rank{color:var(--gold);font-family:Georgia,serif}.item h3{margin:15px 0 12px}.item p{font-size:.875rem;color:var(--muted);min-height:3rem}.item dl{margin:14px 0;display:grid;gap:4px;font-size:.875rem}.item dl div{display:flex;justify-content:space-between;gap:8px}.item dt{color:var(--muted)}.item dd{margin:0}.item-actions{display:grid;gap:8px;margin-top:auto}.item-actions button{font-size:.875rem;padding:10px 8px}.item small{font-size:.75rem;color:var(--muted);margin-top:12px}.secondary{background:none}.training-list{display:grid;gap:12px}.training{display:flex;gap:20px;align-items:center;padding:22px;background:var(--panel);border:1px solid var(--border)}.stat-value{font-family:Georgia,serif;font-size:2rem;width:50px;color:var(--gold)}.training p{font-size:.875rem;color:var(--muted);margin-top:6px}.training button{margin-left:auto;white-space:nowrap;font-size:.875rem}.report{background:var(--panel);border:1px solid var(--border);padding:24px;margin-bottom:18px}.report time{font-size:.75rem;color:var(--muted)}.report h3{font-size:1.6rem;margin:14px 0 8px}.report>p{color:var(--muted);font-size:.875rem}.rewards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:20px 0;padding:16px 0}.rewards span{display:grid;color:var(--muted);font-size:.75rem}.rewards strong{font-size:1.6rem;color:var(--gold);font-family:Georgia,serif;font-weight:400}.battle{border-bottom:1px solid var(--border);font-size:.875rem}.battle summary{display:flex;gap:12px;align-items:center;padding:12px 0;flex-wrap:wrap}.battle summary:before{content:'+';color:var(--gold)}.battle[open] summary:before{content:'−'}.battle summary>span:last-child{margin-left:auto;color:var(--muted)}.win{color:var(--green)}.loss{color:#d4a498}.combat-log{padding:0 12px 14px}.combat-round{border-left:1px solid var(--border);padding:10px 16px}.combat-round strong{color:var(--gold);font-weight:500}.combat-round p{font-size:.875rem;color:#c8cec1}.combat-round small{color:var(--muted)}.mission-running{padding:36px;text-align:center;background:var(--panel);border:1px solid var(--border)}.rune-number{font-family:Georgia,serif;font-size:4rem;color:var(--gold);display:block}.mission-running h3{font-size:1.8rem}.mission-running p{color:var(--muted);margin:14px 0;font-size:.875rem}.countdown{display:block;margin:32px 0 20px;font-size:2rem;font-weight:400}.empty,.initial{padding:40px;background:var(--panel);border:1px solid var(--border)}.empty p{margin:12px 0 24px;color:var(--muted)}footer{color:var(--muted);text-align:center;font-size:.75rem;padding:20px}.notice{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#d8b77b;color:#172012;padding:14px 20px;box-shadow:0 8px 32px #0005;z-index:9;opacity:0;pointer-events:none;transition:.2s;max-width:90vw}.notice.show{opacity:1;transform:translate(-50%,0)}.connection{position:fixed;bottom:20px;left:20px;right:20px;max-width:550px;margin:auto;background:#38281f;border:1px solid #b59572;padding:20px;z-index:10;box-shadow:0 8px 40px #0008}.connection p{margin-bottom:12px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1000px){.layout{grid-template-columns:280px minmax(0,1fr);gap:20px}.top,main{padding-left:22px;padding-right:22px}.item-grid{grid-template-columns:1fr}.workspace nav button{padding:12px}.selection-mark{display:none}.training{flex-wrap:wrap}.training button{width:100%;margin-left:0}.portrait{height:350px}}@media(max-width:720px){.top{padding:18px 16px}.brand{font-size:1.5rem}.brand span{font-size:.7rem}.wallet{gap:16px}.wallet strong{font-size:1.1rem}main{padding:18px 14px}.layout{grid-template-columns:1fr}.hero{display:grid;grid-template-columns:125px minmax(0,1fr)}.portrait{height:100%;min-height:225px}.portrait img{object-position:50% 30%}.portrait-caption{bottom:14px;left:10px;right:8px}.portrait-caption .eyebrow{display:none}h1{font-size:1.25rem;line-height:1.3}.level{font-size:.75rem}.hero-body{padding:16px}.mini-stats{gap:6px;margin-bottom:12px}.mini-stats strong{font-size:1.15rem}.mini-stats span{font-size:.75rem}.hero-body progress{margin-bottom:12px}.hero-body .line{font-size:.75rem}.equipped{gap:0;padding-top:10px}.equipped span{font-size:.7rem}.equipped strong{font-size:.75rem;margin-bottom:5px}.rename{margin-top:8px}.rename summary{font-size:.75rem}.workspace nav{position:sticky;top:0;background:var(--bg);z-index:3;justify-content:space-between;margin-bottom:24px}.workspace nav button{font-size:.875rem;padding:12px 8px}h2{font-size:1.8rem}.section-head p{font-size:1rem}.enemy{padding:16px;gap:10px}.enemy-number{width:30px;font-size:1.5rem}.enemy strong{font-size:1.2rem}.contract,.report{padding:18px}.durations{gap:6px}.durations label{padding:9px 6px;gap:2px}.durations span{font-size:.7rem}.mission-running{padding:24px 18px}.training{gap:14px}.training h3{font-size:1.2rem}.item-grid{grid-template-columns:1fr}footer{padding:18px 16px 65px}.report time{font-size:.7rem}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* C02: graphical inventory, separate merchant, portraits and bulk training. */
.quest-card{padding:22px;margin:20px 0;border:1px solid var(--border);background:var(--panel)}.quest-card h3{margin:12px 0}.quest-card p{line-height:1.65}.quest-card li{margin:10px 0}.quest-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}.quest-choices>div{padding:16px;border:1px solid var(--border)}
.quality-common{--quality:#b9c0b3}.quality-uncommon{--quality:#80cc8c}.quality-rare{--quality:#79b5ff}.quality-epic{--quality:#ff8585}
.item-slot[class*=quality-],.item-detail[class*=quality-],.loot-list button[class*=quality-]{border-color:var(--quality)}
.item-slot .rarity-mark{background:var(--quality,#b9c0b3)}.item-detail .rarity-label,.item-detail h3,.loot-list button[class*=quality-] strong{color:var(--quality,var(--text))}
.epic-power{color:#ff8585!important}.socket-info{padding:12px;border:1px dashed var(--border)}
.bag-tools{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.bag-tools label{flex:1;min-width:120px;color:var(--muted);font-size:.8rem}.bag-tools select{display:block;width:100%;min-height:44px;margin-top:6px;padding:8px;background:var(--panel);color:var(--text);border:1px solid var(--border);font:inherit}
.equipped-reference{display:flex;align-items:center;gap:12px;padding:12px;background:#111711;border:1px solid var(--border);margin-top:16px}.equipped-reference img{width:64px;height:64px;object-fit:contain}.equipped-reference small{display:block;color:var(--muted);font-size:.7rem;margin-bottom:6px}.equipped-reference strong{display:block;font-weight:500}
.workspace nav{overflow-x:auto;justify-content:flex-start;scrollbar-width:thin}
.workspace nav button{flex-shrink:0}
.inventory-layout{grid-template-columns:minmax(0,1fr)}
.inventory-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:start}
.paperdoll,.backpack,.item-detail{background:var(--panel);border:1px solid var(--border);padding:24px;min-width:0}
.paperdoll>.line,.backpack>.line{padding-bottom:16px;border-bottom:1px solid var(--border)}
.paperdoll>.line span,.backpack>.line span{color:var(--muted);font-size:.875rem}
.body-layout{position:relative;max-width:420px;margin:20px auto 0;isolation:isolate}
.body-portrait{display:block;width:100%;height:460px;object-fit:cover;object-position:50% 25%;opacity:.85}
.body-layout:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(0deg,#101710,transparent 28%,transparent 85%,#18201955)}
.body-slot{position:absolute;z-index:1;width:96px;filter:drop-shadow(0 4px 12px #0009)}
.body-slot.weapon{left:10px;top:49%}.body-slot.armor{right:10px;top:27%}
.body-slot>span{display:block;text-align:center;font-size:.75rem;letter-spacing:.1em;padding:4px;background:#111811e8;color:var(--gold)}
.body-caption{position:absolute;z-index:1;bottom:16px;left:0;right:0;text-align:center;letter-spacing:.14em;font-size:.75rem;color:var(--gold)}
.inventory-hint,.bag-empty-message{color:var(--muted);font-size:.875rem;margin:14px 0}
.item-slot{display:block;position:relative;width:100%;aspect-ratio:1;padding:0;overflow:hidden;border:1px solid #64705b;background:#111610;border-radius:3px;min-height:0}
.item-slot img{display:block;width:100%;height:100%;object-fit:contain}
.item-slot:hover{border-color:var(--gold)}
.item-slot.slot-selected{outline:2px solid var(--gold);outline-offset:2px;border-color:var(--gold)}
.slot-rank{position:absolute;right:3px;top:3px;padding:0 5px;background:#111b12e8;font-size:.75rem;line-height:1.6;color:var(--gold)}
.rarity-mark{position:absolute;left:6px;bottom:6px;width:6px;height:6px;border-radius:50%;background:#b9c0b3;box-shadow:0 0 0 2px #101610}
.empty-slot,.bag-empty{aspect-ratio:1;border:1px solid #30392d;background:linear-gradient(135deg,#11170f,#1b2218);border-radius:3px}
.empty-slot{display:grid;place-items:center;text-align:center;color:var(--muted);font-size:.75rem;background:#111710ed}
.bag-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:20px}
.bag-pages{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:20px;font-size:.875rem}
.item-detail{margin-top:24px;max-width:850px}
.empty-detail{color:var(--muted)}.empty-detail h3{color:var(--text);margin-bottom:12px}
.detail-heading{display:flex;align-items:center;gap:20px;margin-bottom:20px}
.detail-heading h3{font-size:1.7rem;margin:7px 0}
.detail-art{width:112px;height:112px;object-fit:contain;background:#111711;border:1px solid #64705b;flex-shrink:0}
.rarity-label,.item-detail>p,.item-detail>small,.muted{color:var(--muted);font-size:.875rem}
.comparison-head,.comparison>div{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:10px}
.comparison-head{margin-top:24px;color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.07em}
.comparison{font-size:.875rem;margin:8px 0 12px}.comparison>div{padding:10px 0;border-bottom:1px solid var(--border)}
.comparison dd{margin:0}.comparison-head>span:not(:first-child),.comparison dd{text-align:right}
.detail-actions{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 12px}.detail-actions button{flex:1;min-width:200px}.detail-actions .primary{width:auto}
.merchant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.merchant-card{padding:12px;display:flex;flex-direction:column;align-items:start;text-align:left;gap:8px;border-color:var(--border);min-width:0}
.merchant-card img{width:100%;aspect-ratio:1;object-fit:contain;display:block;background:#141914}
.merchant-card strong{font-family:Georgia,serif;font-size:1.15rem;font-weight:400}.merchant-card span{color:var(--gold);font-size:.875rem}
.merchant-card.selected{border-color:var(--gold)}
.enemy-avatar{width:82px;height:82px;object-fit:cover;border:1px solid #555e4b;flex-shrink:0}
.active-monster{width:180px;height:180px;object-fit:cover;border:1px solid #7b785b;display:block;margin:0 auto 24px}
.report-monster{display:flex;align-items:center;gap:20px}.report-monster>img{width:124px;height:124px;object-fit:cover;border:1px solid #555e4b;flex-shrink:0}
.report-monster p{color:var(--muted);font-size:.875rem}.report-monster h3{margin-top:8px}
.loot{margin:20px 0 24px}.loot h4{font-weight:500;margin:0 0 12px}.loot>p{color:var(--muted);font-size:.875rem}
.loot-list{display:grid;gap:8px}.loot-list button{display:flex;align-items:center;gap:14px;padding:8px;text-align:left}
.loot-list img{width:68px;height:68px;object-fit:contain;background:#141914}.loot-list strong{font-weight:500}.loot-list small{display:block;color:var(--muted);font-size:.75rem}
.training-amount{border:0;padding:0;display:flex;gap:10px;margin:0}.training-amount legend{margin-bottom:12px;color:var(--muted);font-size:.875rem}
.training-amount label{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;min-width:64px;flex:1;border:1px solid var(--border);padding:10px;cursor:pointer}
.training-amount label.chosen{border-color:var(--gold);background:#2b3023;color:var(--gold)}
.training-amount input{accent-color:var(--gold);width:16px;height:16px;margin:0}.training small{color:var(--gold);font-size:.875rem}
.stat-value{width:auto;min-width:50px;flex-shrink:0}.missing-gear{color:#e2b19b!important;margin-bottom:16px}
@media(max-width:1000px){.inventory-layout{grid-template-columns:minmax(0,1fr)}.inventory-shell{gap:18px}.paperdoll,.backpack{padding:18px}.bag-grid{gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}.merchant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.inventory-shell{grid-template-columns:1fr}.body-portrait{height:410px}.bag-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.item-detail{padding:18px}.detail-art{width:84px;height:84px}.detail-heading{gap:14px}.detail-heading h3{font-size:1.4rem}.enemy-avatar{width:62px;height:72px}.report-monster{gap:14px}.report-monster>img{width:86px;height:106px}.report-monster h3{font-size:1.35rem}.training-amount{gap:6px}.training-amount label{padding:8px;min-width:0}.detail-actions button{min-width:0;flex-basis:100%}.bag-pages button{padding:8px}.comparison-head,.comparison>div{gap:8px}.comparison{font-size:.8125rem}}

/* C03: touch controls and iOS standalone safe areas. No viewport zoom lock. */
dialog{color:var(--text);background:var(--panel);border:1px solid var(--gold);border-radius:6px;padding:24px;width:min(480px,calc(100vw - 28px));max-height:85svh;overflow:auto}
dialog::backdrop{background:#000b}
dialog h2{font-size:1.6rem}dialog p{font-size:.875rem;color:var(--muted);margin:14px 0}
dialog form{display:grid;gap:14px}dialog label{display:grid;gap:6px;font-size:.875rem}
dialog input{width:100%;font-size:1rem}dialog button{min-height:48px}
.auth-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.auth-links button{flex:1;font-size:.875rem}
.auth-error{color:#edb4a5!important}.recovery-secret{font-family:monospace;overflow-wrap:anywhere;background:var(--bg);padding:16px;user-select:all;font-size:1rem}
#account-button{font-size:.875rem;white-space:nowrap}
@media(max-width:720px){.top{flex-wrap:wrap}#account-button{margin-left:auto;min-height:44px}.top .wallet{margin-left:auto}dialog{padding:20px}.auth-links button{flex-basis:100%}}
html{scroll-padding-bottom:110px}
/* M03: shared illustrated navigation, with accessible names but no visible labels. */
.workspace nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;padding:6px;background:#141b15}
.workspace nav button.nav-art-button{position:relative;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:72px;padding:3px;border:1px solid transparent;border-radius:6px;overflow:hidden}
.workspace nav .nav-art-button img{display:block;width:64px;height:64px;object-fit:cover;border-radius:4px;pointer-events:none}
.workspace nav button.nav-art-button.active{border-color:var(--gold);background:#354039}
.workspace nav .nav-art-button.active::after{content:'';position:absolute;bottom:2px;left:calc(50% - 11px);width:22px;height:3px;border-radius:2px;background:var(--gold)}
.workspace nav button.nav-art-button:focus-visible{outline:2px solid var(--gold);outline-offset:-3px}
@media(hover:hover){.workspace nav button.nav-art-button:hover{background:#354039;border-color:#737258}}
body{min-height:100svh;padding-top:env(safe-area-inset-top,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
button,summary{touch-action:manipulation}
input{font-size:1rem}
.install-help{max-width:560px;margin:10px auto 0;font-size:.875rem;text-align:left}
.install-help summary{text-align:center;color:var(--gold)}
.install-help p{margin:12px 0}
.detail-back{display:none}
.item-detail:focus{outline:2px solid var(--gold);outline-offset:3px}
.connection{max-height:65svh;overflow:auto}
@media(max-width:720px){
 main{padding-bottom:24px}
 .top{gap:12px}.brand{font-size:1.35rem}.brand span{font-size:.75rem;letter-spacing:.08em}
 .wallet{gap:12px}.wallet strong{font-size:1.1rem;overflow-wrap:anywhere}.wallet small{font-size:.75rem}
 .hero{grid-template-columns:90px minmax(0,1fr)}
 .portrait{min-height:180px}.portrait-caption{left:8px;bottom:12px}.portrait-caption h1{font-size:1rem}.portrait-caption>span{font-size:.75rem}
 .hero-body{padding:12px}.hero-body>.line,.mini-stats span{font-size:.875rem}.mini-stats{gap:8px}
 .hero-body>button{display:none}.rename summary{font-size:.875rem}.rename input{width:100%}
 .workspace nav{position:fixed;top:auto;bottom:0;left:0;right:0;margin:0;z-index:5;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);border-top:1px solid #59614e;border-bottom:0;background:#141b15;box-shadow:0 -5px 24px #0005;overflow:visible}
 .workspace nav button{min-width:0;min-height:56px;padding:10px 2px;font-size:.875rem;border-bottom:0;border-top:3px solid transparent;overflow-wrap:anywhere}
 .workspace nav button.active{border-top-color:var(--gold);background:#252d21}
 footer{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px));font-size:.75rem}
 .notice{bottom:calc(74px + env(safe-area-inset-bottom,0px));width:max-content;max-width:calc(100vw - 28px);font-size:.875rem}
 .connection{bottom:calc(72px + env(safe-area-inset-bottom,0px));left:14px;right:14px}
 .connection button{width:100%}
 .section-head{margin-bottom:20px}.section-head h2{font-size:1.7rem}
 .enemy small,.durations span{font-size:.75rem;letter-spacing:.03em}
 .body-portrait{height:340px}.paperdoll,.backpack{padding:16px}
 .bag-grid{gap:8px}.item-slot{min-height:44px}
 .inventory-shell{gap:16px}.item-detail{scroll-margin-top:16px;scroll-margin-bottom:100px}
 .detail-back{display:block;width:100%;margin-bottom:18px;color:var(--gold);background:none}
 .detail-heading{align-items:flex-start}.detail-heading>div{min-width:0}.detail-heading h3{overflow-wrap:anywhere}
 .training{display:grid;grid-template-columns:auto minmax(0,1fr);padding:18px;gap:12px}
 .training>button{grid-column:1/-1;min-height:48px;font-size:1rem}.training small{display:block}
 .training-amount label{min-height:48px}
 .rewards strong{font-size:1.4rem;overflow-wrap:anywhere}
 .report-monster>div{min-width:0}.loot-list button{min-width:0}.loot-list button>span{min-width:0;overflow-wrap:anywhere}
 .comparison-head{letter-spacing:0}.comparison{font-size:.875rem}
 body.keyboard-open .workspace nav{display:none}
}
@media(max-width:359px){.workspace nav button{font-size:.75rem}.brand{font-size:1.15rem}.wallet{gap:8px}.detail-art{width:68px;height:68px}}
@media(max-height:500px) and (max-width:720px){.body-portrait{height:260px}.connection{max-height:50svh}}
@media(max-width:720px){
 .workspace nav{gap:3px;padding-top:4px;padding-left:max(4px,env(safe-area-inset-left,0px));padding-right:max(4px,env(safe-area-inset-right,0px))}
 .workspace nav button.nav-art-button{height:64px;min-height:64px;padding:0}
 .workspace nav .nav-art-button img{width:100%;height:100%;object-fit:contain;border-radius:4px}
 footer{padding-bottom:calc(94px + env(safe-area-inset-bottom,0px))}
 .notice{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
 .connection{bottom:calc(82px + env(safe-area-inset-bottom,0px))}
}

/* M04 — compact, illustrated character card shared with the native visual system. */
/* M05: five equipment slots and illustrated training. */
.paperdoll,.backpack,.training.illustrated-training{border-color:#766647;border-radius:12px;background:linear-gradient(145deg,#222a20,#141b15 70%)}
.paperdoll .body-layout{margin-bottom:18px;border-radius:10px;overflow:hidden}
.paperdoll .body-portrait{height:460px;object-position:50% 25%}
.paperdoll .body-slot{width:82px;position:absolute;bottom:auto;right:auto;left:auto;top:auto}
.paperdoll .body-slot>span{font-size:.75rem;letter-spacing:.03em;text-transform:none;display:block;text-align:center}
.paperdoll .body-slot.weapon{left:8px;top:30%}.paperdoll .body-slot.shield{left:8px;top:64%}
.paperdoll .body-slot.necklace{right:8px;top:5%}.paperdoll .body-slot.armor{right:8px;top:35%}.paperdoll .body-slot.ring{right:8px;top:66%}
.paperdoll .body-slot .empty-slot{width:100%;height:82px;min-height:0;padding:0;display:grid;place-items:center;position:relative;border:1px dashed #766647;border-radius:6px;background:#141b15}
.paperdoll .empty-slot img{width:100%;height:100%;object-fit:contain;opacity:.3}.paperdoll .empty-slot small{position:absolute;bottom:2px;font-size:.75rem;color:#efeee4}
.paperdoll .body-caption{font-size:.75rem;letter-spacing:.1em}
.training.illustrated-training{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;padding:18px;align-items:center}
.training-symbol{display:grid;justify-items:center;gap:4px}.training-symbol img{width:76px;height:76px;object-fit:contain;border-radius:8px}
.training-symbol strong{font-family:Georgia,serif;font-size:1.8rem;color:var(--gold);font-weight:400;line-height:1.2}
.training-copy{min-width:0}.training-copy h3{font-size:1.2rem;overflow-wrap:anywhere}.training-copy small{display:block;margin-top:8px;font-size:.875rem;color:var(--gold)}
.training.illustrated-training>button{grid-column:1/-1;width:100%;margin:0;white-space:normal;border-color:#8b754c;background:#303627}
.hero.hero-card{display:block;min-width:0;border:1px solid #766647;border-radius:12px;background:linear-gradient(145deg,#222a20,#141b15 70%);box-shadow:0 8px 28px #0003;overflow:hidden}
.hero-card-header{display:flex;align-items:center;gap:16px;padding:16px;border-bottom:1px solid #414635;background:linear-gradient(115deg,#303627,#192018)}
.hero-avatar{display:block;flex:0 0 88px;width:88px;height:112px;object-fit:cover;object-position:50% 24%;border:1px solid #8b754c;border-radius:7px}
.hero-identity{min-width:0;flex:1}
/* M06: direct equipment actions and local, read-only item previews. */
[data-quick-item]{touch-action:pan-y pinch-zoom;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
[data-quick-item] img{pointer-events:none;-webkit-user-drag:none}
[data-quick-item]:disabled{opacity:.6}
.equipment-help{font-size:.85rem;color:var(--muted);line-height:1.5}
.item-hover-preview{position:fixed;z-index:80;width:min(360px,calc(100vw - 16px));max-height:calc(100dvh - 16px);overflow:auto;pointer-events:auto;filter:drop-shadow(0 8px 24px #000a)}
.item-hover-preview .item-detail,.item-inspect-dialog .item-detail{margin:0;min-width:0;padding:16px;background:#161e16;border:1px solid #b99b60;border-radius:12px;font-size:.85rem}
.item-hover-preview .detail-art{width:64px;height:64px;object-fit:contain}
.item-hover-preview h3{font-size:1.2rem;margin:4px 0}
.item-hover-preview .detail-heading{gap:12px}
.item-hover-preview .detail-actions,.item-inspect-dialog .detail-actions{display:none}
.item-inspect-dialog{width:min(480px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;padding:12px;background:#10170f;color:var(--text);border:1px solid #b99b60;border-radius:16px;overscroll-behavior:contain}
.item-inspect-dialog::backdrop{background:#000b}
.item-inspect-dialog .detail-back{position:sticky;top:0;z-index:1;width:100%;margin:0 0 12px;background:#263021;min-height:44px}
.hero-kicker{display:block;font-size:.75rem;font-weight:600;letter-spacing:.09em;color:var(--gold);line-height:1.5}
.hero-identity h1{margin:7px 0 12px;font-size:1.5rem;line-height:1.2;overflow-wrap:anywhere}
.hero-level{display:inline-flex;align-items:center;flex-wrap:wrap;gap:10px;padding:4px 12px;border:1px solid #7e6945;border-radius:5px;background:#10170f;color:#d6c9aa;font-size:.875rem}
.hero-level strong{font-family:Georgia,serif;font-size:1.3rem;color:var(--gold);font-weight:400;line-height:1.3}
.hero-card-content{padding:16px}
.hero-xp{margin-bottom:16px}
.hero-xp>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 10px;font-size:.875rem;color:var(--muted)}
.hero-xp strong{color:var(--text);font-weight:500;font-variant-numeric:tabular-nums}
.hero-xp progress{height:8px;margin:9px 0 0;border:1px solid #55553b;border-radius:8px;overflow:hidden}
.hero-xp progress::-webkit-progress-bar{background:#10160f}
.hero-xp progress::-webkit-progress-value{background:linear-gradient(90deg,#98783e,#e0bf79)}
.hero-attributes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.hero-attribute{min-width:0;padding:10px;border:1px solid #3e4636;border-radius:7px;background:linear-gradient(145deg,#252d21,#151c16)}
.hero-attribute-top{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px}
.hero-attribute-top img{width:44px;height:44px;flex-shrink:0;object-fit:contain;border-radius:5px}
.hero-attribute-top strong{min-width:0;font-family:Georgia,serif;font-size:1.8rem;font-weight:400;line-height:1.1;color:var(--gold);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.hero-attribute-name{display:block;font-size:.875rem;line-height:1.4;color:var(--text);overflow-wrap:anywhere}
.hero-attribute-breakdown{display:flex;flex-wrap:wrap;gap:2px 8px;margin-top:5px;font-size:.75rem;line-height:1.5;color:var(--muted)}
.hero-attribute-breakdown span{white-space:nowrap}.hero-attribute-breakdown b{font-weight:500;color:#b9c6a6}
.hero-card .hero-rename{margin-top:14px;border-top:1px solid #3e4636;padding-top:5px;font-size:.875rem}
.hero-card .hero-rename summary{font-size:.875rem;padding:9px 0;min-height:44px}
.hero-card .hero-rename input{width:100%}
@media(min-width:721px) and (max-width:1000px){.hero-card-header{gap:12px;padding:12px}.hero-avatar{width:72px;flex-basis:72px;height:104px}.hero-card-content{padding:12px}.hero-identity h1{font-size:1.3rem}}
@media(max-width:359px){.hero-card-header{gap:12px;padding:12px}.hero-avatar{width:72px;flex-basis:72px;height:104px}.hero-card-content{padding:12px}.hero-identity h1{font-size:1.25rem}}

/* M07: character information belongs to inventory, other sections use full width. */
.layout{grid-template-columns:minmax(0,1fr)}
.inventory-character-info{margin-top:20px}
.inventory-character-info .hero-rename{margin-top:16px;border-top:1px solid var(--border);padding-top:8px}
.inventory-character-info .hero-rename input{width:100%}
.top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px 24px;padding-top:12px;padding-bottom:12px}
.brand{display:block;line-height:0;min-width:0}
.brand img{display:block;width:210px;height:70px;max-width:100%;object-fit:contain}
.top .wallet{justify-self:end;margin:0;flex-wrap:wrap;gap:8px 24px}
.top .wallet span{display:flex;align-items:baseline;gap:8px}
.top .wallet small{font-size:.875rem;letter-spacing:0}
.top .wallet strong{font-size:1.1rem;font-variant-numeric:tabular-nums}
@media(max-width:720px){.top{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px}.brand{grid-column:1;grid-row:1}.brand img{width:168px;height:56px}#account-button{grid-column:2;grid-row:1}.top .wallet{grid-column:1/-1;grid-row:2;justify-self:start;gap:8px 20px}}

/* M08 — Veynord type and forged-metal controls. Fonts are served locally. */
@font-face{font-family:VeynordDisplay;src:url('/fonts/VeynordDisplay-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:VeynordText;src:url('/fonts/VeynordText-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:VeynordText;src:url('/fonts/VeynordText-SemiBold.woff2') format('woff2');font-weight:600 900;font-style:normal;font-display:swap}
:root{--font-display:VeynordDisplay,Georgia,serif;--font-body:VeynordText,Georgia,serif}
body{font-family:var(--font-body);font-size:1.0625rem;line-height:1.6}
button,input,select,textarea{font-family:var(--font-body)}
h1,h2,h3,h4,.enemy strong,.report h3,.hero-attribute-top strong,.hero-level strong,.training-symbol strong,.rewards strong,.countdown{font-family:var(--font-display);font-weight:600;letter-spacing:.015em}
.merchant-card strong{font-family:var(--font-display);font-weight:600;line-height:1.45}
h1,h2,h3,h4{line-height:1.35;overflow-wrap:anywhere}
h2{font-size:2rem}h3{font-size:1.25rem}
.eyebrow,.hero-kicker,.body-caption,.body-slot>span,.comparison-head,.rarity-label,.training-amount legend{font-family:var(--font-display);font-weight:600;letter-spacing:.055em}
.eyebrow{font-size:.8125rem}
.quest-card>p{font-size:1.0625rem;line-height:1.65;margin:12px 0}
.quest-card>h3{margin:10px 0 16px}
.quest-card>button+button{margin-top:12px}
.quest-card>button{margin-top:14px}
.detail-actions{gap:12px}
.training-copy p,.section-head p{font-size:1.0625rem}
.training-copy h3{font-family:var(--font-display);font-size:1.125rem;line-height:1.45}
.training-copy small{font-size:1rem;line-height:1.5}
.hero-attribute-name{font-family:var(--font-body);font-size:1rem}
.hero-attribute-breakdown,.body-slot small{font-size:.8125rem}

/* Image navigation, inventory tiles and offer/enemy cards keep their own art. */
body button:not(.nav-art-button):not(.item-slot):not(.empty-slot):not(.enemy):not([data-offer]):not([data-loot]):not([data-preview-type]):not([data-shop-quality]):not([data-quality]){
 position:relative;isolation:isolate;min-height:50px;padding:14px 18px;
 border:1px solid #99804f;border-top-color:#c7ad73;border-bottom-color:#685333;border-radius:5px;
 background:linear-gradient(180deg,#374335 0%,#253025 12%,#19231c 55%,#111a14 100%);
 color:#ead6aa;box-shadow:inset 0 1px 0 #f0d49a26,inset 0 -2px 0 #080e09,0 3px 8px #0003;
 font-family:var(--font-display);font-size:.875rem;font-weight:600;letter-spacing:.035em;line-height:1.5;
 text-align:center;white-space:normal;overflow-wrap:anywhere;transition:background .15s,border-color .15s,transform .1s;
}
body button:not(.nav-art-button):not(.item-slot):not(.empty-slot):not(.enemy):not([data-offer]):not([data-loot]):not([data-preview-type]):not([data-shop-quality]):not([data-quality])::before{
 content:'';position:absolute;inset:3px;border:1px solid #bda36b33;border-radius:2px;pointer-events:none;
}
body button.primary:not(.nav-art-button):not(.item-slot){
 color:#ffedc2;border-color:#c4a468;border-top-color:#ebcc8b;
 background:linear-gradient(180deg,#78623c 0%,#51462e 13%,#383526 50%,#242a1e 100%);
}
body button[data-act='sell'],body button[data-act='dismantle']{color:#edc5b6;border-color:#a87962}
@media(hover:hover){body button:not(.nav-art-button):not(.item-slot):not(.empty-slot):not(.enemy):not([data-offer]):not([data-loot]):not([data-preview-type]):not([data-shop-quality]):not([data-quality]):hover:not(:disabled){border-color:#ead099;background:linear-gradient(180deg,#586049,#303b2b 28%,#1b291d);color:#fff0cc}}
body button:not(.nav-art-button):not(.item-slot):not(.empty-slot):not(.enemy):not([data-offer]):not([data-loot]):not([data-preview-type]):not([data-shop-quality]):not([data-quality]):active:not(:disabled){transform:translateY(1px);background:#162017;box-shadow:inset 0 2px 5px #0008}
body button:disabled{opacity:.42;cursor:not-allowed}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #f2d69a;outline-offset:3px}
input:not([type='radio']),select,textarea{font-family:var(--font-body);font-size:1rem;line-height:1.5;border:1px solid #71664c;border-radius:4px;background:#111a14;color:#efe9dd;padding:10px 12px}
.durations label,.training-amount label{border-radius:4px;background:linear-gradient(180deg,#273124,#151e17);border-color:#5a604a;font-family:var(--font-display);font-size:.9375rem;line-height:1.4;min-height:48px}
.durations .chosen,.training-amount .chosen{border-color:#d8b77b;background:linear-gradient(180deg,#50482f,#273123);box-shadow:inset 0 0 0 3px #bda36b1a;color:#f0d7a5}
.durations span{font-family:var(--font-body)}
.route-list{display:grid;gap:26px}.route-group{padding:18px;border:1px solid #48523d;border-radius:10px;background:linear-gradient(120deg,#182117,#111811)}.route-heading{display:grid;gap:6px;margin-bottom:14px}.route-heading h3{margin:0;font-size:1.4rem}.route-heading p{margin:0;color:var(--muted);font-size:1rem}.enemy.locked{opacity:.72}.enemy em{display:block;margin-top:5px;font-size:.8rem;font-style:normal;color:#d8b77b}
input[type='radio']{accent-color:#d8b77b}
.rename summary,.battle summary,.install-help summary{font-family:var(--font-display);font-size:.875rem;line-height:1.5}
.top .wallet{font-family:var(--font-body)}
.top .wallet strong{font-weight:600}
.item-inspect-dialog .detail-back{display:block}
#account-button{font-size:.8125rem;padding:10px 14px}
@media(max-width:720px){.section-head h2{font-size:1.65rem}.quest-card>p{font-size:1.0625rem}.training-amount{gap:8px}.training-amount label{padding:9px 5px}.training.illustrated-training{gap:14px}.training-copy h3{font-size:1.0625rem}}
@media(prefers-reduced-motion:reduce){button{transition:none!important}}
/* M10: enemy dossiers, real loot pools, server-backed combat replay. */
.enemy-card{border:1px solid #786747;border-radius:12px;padding:12px;background:#182017;min-width:0}
.enemy-card .enemy{width:100%;margin-bottom:12px}
.possible-loot{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
.possible-loot figure{margin:0;width:76px;border:1px solid #786747;border-radius:8px;padding:5px;background:#0e160f}
.possible-loot img{display:block;width:64px;height:64px;object-fit:cover;border-radius:5px}
.possible-loot figcaption{font-size:11px;line-height:1.3;margin-top:5px;overflow-wrap:anywhere}
.encounter-panel{max-width:760px;margin:20px auto;padding:20px;border:1px solid #a18a59;border-radius:12px;background:#182017}
.encounter-art{width:100%;max-height:480px;object-fit:contain;border-radius:10px;background:#10170f}
.encounter-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0;color:#d8b77b;text-align:center}
.encounter-facts small{display:block;color:#aeb5a3;font-size:12px}
.encounter-attack{position:sticky;bottom:112px;padding:10px 0;background:#182017;z-index:2}
.encounter-attack button{width:100%;min-height:56px}
.duel-stage{display:grid;grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr);gap:10px;align-items:center;text-align:center}
.duel-stage img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid #9e8756;border-radius:12px}
.duel-stage h3{font-size:clamp(14px,3vw,22px);overflow-wrap:anywhere}
.duel-vs{color:#d8b77b;font-family:VeynordDisplay,serif}
.duel-round{padding:14px;margin:12px 0;border-left:2px solid #d8b77b;background:#11190f;animation:duel-pulse .4s ease-out}
@keyframes duel-pulse{from{background:#48402a}to{background:#11190f}}
@media(prefers-reduced-motion:reduce){.duel-round{animation:none}}
@media(max-width:480px){.encounter-panel{padding:12px}.possible-loot{gap:6px}.duel-stage{gap:6px}}

/* M13–15: compact actionable loot, readable chapter and contract spacing. */
/* Preview tiles own their layout; generic forged action buttons must not style them. */
.possible-loot.loot-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:8px;width:100%;max-width:480px;align-items:stretch}
.possible-loot button[data-preview-type]{display:flex;flex-direction:column;align-items:stretch;gap:6px;width:100%;min-width:0;min-height:44px;margin:0;padding:6px;text-align:center;border-radius:8px;background:linear-gradient(160deg,#293327,#101911);border:1px solid #786747;box-shadow:inset 0 1px 0 #ead6aa18;color:#ead6aa;font-family:var(--font-body);font-size:12px;font-weight:400;letter-spacing:0;line-height:1.35;white-space:normal;overflow-wrap:normal;word-break:normal}
.possible-loot button[data-preview-type] img{display:block;width:100%;max-width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:5px}
.loot-preview-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.7em;font:inherit;overflow-wrap:normal;word-break:normal}
@media(hover:hover){.possible-loot button[data-preview-type]:hover{border-color:#d8b77b;background:#293327}}
.possible-loot button[data-preview-type]:active{background:#35402d}
@media(max-width:480px){.route-group{padding:12px}.enemy-card{padding:10px}}
.quest-card article{padding:16px 0;border-bottom:1px solid #343d30}
.quest-card article:last-child{border-bottom:0}.quest-card button{margin:6px 6px 6px 0}
.quest-card summary{cursor:pointer;line-height:1.5;padding:8px 0;color:#d5ba7a}
.quest-card details{margin-top:14px}.quest-card .active-monster{width:min(100%,340px);height:auto;aspect-ratio:1;object-fit:cover;border-radius:12px}
.item-detail>img.detail-art{width:160px;height:160px;object-fit:cover;border-radius:12px}
@media(prefers-reduced-motion:reduce){.surface{animation:none!important}}

/* M16A — rarity is visible in offers, previews and actual battle rewards. */
.possible-loot figure[class*=quality-]{border-color:var(--quality);box-shadow:inset 0 0 0 1px var(--quality)}
.possible-loot figure[class*=quality-] figcaption{color:var(--quality)}
.rarity-legend,.shop-quality-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.quality-chip{display:inline-flex;align-items:center;gap:5px;color:var(--quality);font-size:12px;line-height:1.4}
.quality-chip:before{content:'';width:7px;height:7px;border-radius:50%;background:var(--quality);flex-shrink:0}
.shop-quality-tabs button,.loot-preview-dialog button[data-quality]{min-height:44px;padding:8px 12px;font-family:var(--font-body);font-size:14px;line-height:1.4;color:var(--quality);border:1px solid var(--quality);border-radius:6px;background:#121c15;white-space:normal}
.shop-quality-tabs button[aria-pressed=true],.loot-preview-dialog button[data-quality][aria-pressed=true]{box-shadow:inset 0 -3px 0 var(--quality);background:#2d382b}
.merchant-card[class*=quality-]{border-color:var(--quality);border-top-width:3px;gap:6px}
.merchant-card[class*=quality-] strong,.merchant-card .shop-rarity{color:var(--quality)}
.merchant-card strong{font-size:1rem;overflow-wrap:normal;word-break:normal}
.merchant-card small{font-family:var(--font-body);font-size:12px;color:var(--muted)}
.merchant-card.selected{outline:2px solid var(--quality);outline-offset:2px}
.emerald-wallet{border:1px solid #477f60;border-radius:12px;padding:18px;margin-bottom:18px;background:linear-gradient(135deg,#23372a,#111c15)}
.emerald-wallet>div{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.emerald-wallet>div>strong{font-family:var(--font-display);font-size:1.6rem;color:#8bdbad}
.emerald-wallet>p,.shop-caption,.emerald-note{font-size:.875rem;color:#b8c8b8;line-height:1.55;margin:10px 0}
.emerald-rewards{margin-top:12px;border-top:1px solid #3e5846}
.emerald-rewards summary{color:#a2dfb6}
.emerald-rewards p{font-size:.875rem;margin:10px 0}
.emerald-rewards article{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:12px 0;border-top:1px solid #334b3b}
.emerald-rewards article>div{flex:1;min-width:140px}
.emerald-rewards small{display:block;color:var(--muted)}
.wallet .emerald-balance strong{color:#8bdbad}
.top .wallet{flex-wrap:wrap;gap:10px 20px}
@media(max-width:480px){.top{flex-wrap:wrap;gap:12px}.top .wallet{width:100%;order:3;justify-content:space-between;gap:8px}.merchant-grid{gap:10px}.merchant-card{padding:8px}.merchant-card strong{font-size:.875rem}.emerald-wallet{padding:12px}}

/* M17 — a compact hunt, shared battle status and deliberate equipment choices. */
.route-picker{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0 0 24px}
.route-picker button{min-width:0;padding:12px 8px;text-align:left;font-family:var(--font-body);font-size:.9rem;letter-spacing:0;line-height:1.35}
.route-picker strong,.route-picker small{display:block;overflow-wrap:break-word}.route-picker small{font-size:.75rem;color:var(--muted);margin-top:6px}
.route-picker [aria-pressed=true],.merchant-modes [aria-pressed=true]{border-color:var(--gold);background:linear-gradient(150deg,#38402b,#172017);box-shadow:inset 0 -3px #d8b77b}
.route-group{min-width:0}.route-group .enemy-list{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.route-group .enemy-card{min-width:0;padding:12px}.route-group .enemy{padding:10px;gap:12px}.route-group .enemy strong{font-size:1.05rem}.route-group .enemy-avatar{width:76px;height:96px;object-fit:cover;flex-shrink:0}
.route-group .enemy>span{min-width:0}.loot-more{font-family:var(--font-body);font-size:.8rem;width:100%;margin-bottom:12px}
.hunt-progress{display:flex;align-items:flex-start;gap:10px;padding:12px 0;border-top:1px solid #82704766;margin-top:12px;font-size:.8rem;line-height:1.45}
.hunt-progress>img{width:48px;height:48px;object-fit:contain;border-radius:6px}.hunt-progress>div{min-width:0;flex:1}.hunt-progress strong{display:block;color:var(--gold)}.hunt-progress p{margin:5px 0}.hunt-progress progress{margin:8px 0}.hunt-progress button{font-family:var(--font-body);font-size:.8rem;padding:6px 10px;min-height:44px}
.battle-dock{position:fixed;bottom:18px;right:24px;width:min(410px,calc(100vw - 32px));z-index:12;border:1px solid #ad925e;border-radius:10px;background:#111c14;box-shadow:0 6px 30px #0009}
.battle-dock button{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px;min-height:64px;text-align:left;background:none;border:0;box-shadow:none;letter-spacing:0;font-family:var(--font-body);font-size:.85rem}
.battle-dock img{width:42px;height:42px;border-radius:6px;object-fit:cover}.battle-dock span{min-width:0;flex:1}.battle-dock strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.battle-dock small{display:block;color:var(--muted)}.battle-dock b{color:var(--gold);font-variant-numeric:tabular-nums;white-space:nowrap}
.encounter-attack{position:static;padding:12px 0 20px;background:none}.has-battle main{padding-bottom:100px}
.reward-item{width:148px;max-width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;border:1px solid var(--quality);padding:10px;font-family:var(--font-body);font-size:.85rem;letter-spacing:0;line-height:1.4;text-align:center}.reward-item span{color:var(--quality)}.reward-item small{font-size:.75rem}.possible-loot .reward-item img{width:86px;height:86px;object-fit:contain}
.loadout-grid,.growth-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:16px}.loadout-grid>section,.growth-grid>article{padding:14px;border:1px solid #706248;border-radius:8px;min-width:0;background:linear-gradient(150deg,#253023,#131b15)}
.loadout-grid form{display:grid;gap:8px}.loadout-grid input{width:100%}.loadout-grid button{width:100%;font-family:var(--font-body);letter-spacing:0;font-size:.85rem;margin-top:6px}.loadout-grid p{font-size:.8rem;margin-top:8px}.loadout-items{display:flex;flex-wrap:wrap;gap:4px}.loadout-items img{width:34px;height:34px;object-fit:contain}.growth-grid strong{display:block;margin:10px 0}.growth-grid p{font-size:.85rem}.growth-grid .unlocked{border-color:var(--gold)}
.build-warning{color:#ebc27b;padding:10px;border-left:3px solid #ac8545;background:#312b1d;margin:12px 0!important;font-size:.9rem}
.battle-insight{padding:18px 0;border-top:1px solid #766747;margin-top:18px}.battle-insight dl>div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #3a4334;padding:8px 0;font-size:.9rem}.battle-insight dt{min-width:0}.battle-insight dd{margin:0;color:var(--gold)}.battle-insight button{margin:8px 8px 0 0}
.merchant-modes{display:flex;gap:8px;margin-bottom:18px}.merchant-modes button{flex:1;min-width:0}.emerald-wallet p{font-size:.85rem}.scene-choices{display:grid;gap:12px;margin:20px 0}.scene-choices button{text-align:left;font-size:.95rem;line-height:1.5}.investigation>p{margin:18px 0}.scene-outcome,.hero-title{color:var(--gold);border-left:3px solid #a58b56;padding:12px;margin:12px 0!important}.effect-description p{font-size:.9rem;margin:8px 0}
@media(max-width:1100px){.route-group .enemy-list{grid-template-columns:1fr}.route-group .enemy-avatar{width:88px;height:100px}.route-picker{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.route-picker{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.route-picker button{min-height:70px}.battle-dock{left:8px;right:8px;width:auto;bottom:calc(76px + env(safe-area-inset-bottom,0px))}.battle-dock button{min-height:58px}.has-battle main{padding-bottom:calc(168px + env(safe-area-inset-bottom,0px))}.has-battle .notice,.has-battle .connection{bottom:calc(146px + env(safe-area-inset-bottom,0px))}body.keyboard-open .battle-dock{display:none}.loadout-grid{grid-template-columns:1fr}.growth-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.route-group .enemy strong{font-size:1.1rem}.merchant-modes button{padding:10px 5px;font-size:.9rem}.battle-insight button{width:100%;margin:8px 0 0}}
@media(max-width:359px){.growth-grid{grid-template-columns:1fr}.route-group .enemy-avatar{width:64px;height:82px}}
.rarity-comparison{margin:14px 0;border-top:1px solid #736449;padding-top:8px}.rarity-comparison>p,.item-model{font-size:.8rem;color:var(--muted)}.item-model{display:block;margin-top:8px}.rarity-rows>div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;padding:12px 8px;border-left:3px solid var(--quality);margin:8px 0;background:#101a12;font-size:.85rem}.rarity-rows strong{color:var(--quality)}.rarity-rows span{overflow-wrap:break-word}@media(max-width:480px){.rarity-rows>div{grid-template-columns:1fr;gap:4px}}

/* M18: readable catalogs, shared by merchant, smith and inventory. */
.catalog-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.catalog-tools label{display:flex;flex-direction:column;gap:6px;min-width:0;color:var(--muted,#adb3a3);font-size:.9rem}
.catalog-tools select,.catalog-tools input{width:100%;min-width:0;min-height:44px;box-sizing:border-box;background:#172018;color:#eeeadd;border:1px solid #746749;border-radius:8px;padding:10px;font:inherit}
.catalog-tools .catalog-search{grid-column:1/-1}
.catalog-tools input:focus-visible,.catalog-tools select:focus-visible{outline:2px solid #d9ba79;outline-offset:2px}
.catalog-pages{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:12px 0 20px}
.catalog-pages>span{margin-right:auto;color:#b9bcae}
.catalog-pages button{min-height:44px}
.recipe-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.recipe-grid>.quest-card{min-width:0;margin:0;padding:16px}
.recipe-grid .detail-art{width:64px;height:64px;flex:0 0 64px;object-fit:contain}
.recipe-grid h3{font-size:1.05rem;overflow-wrap:break-word}
.recipe-grid p{font-size:.9rem}
.loot-preview-grid>button>small{font-size:.72rem;line-height:1.3;color:#bcbba8;white-space:normal}
.backpack .bag-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.backpack .bag-tools label,.backpack .bag-tools select{min-width:0;width:100%;box-sizing:border-box}
@media(max-width:720px){.recipe-grid{grid-template-columns:minmax(0,1fr)}.catalog-tools{gap:10px}.catalog-tools select{font-size:16px}.catalog-search input{font-size:16px}.catalog-pages button{padding:10px 14px}}
.item-slot .slot-level{position:absolute;right:4px;bottom:4px;padding:2px 4px;background:#10160fe8;color:#eee7d4;border-radius:3px;font:600 10px/1.2 VeynordText,serif;pointer-events:none}

/* M18.1: the selected item's effective quality is visible before comparison. */
.quality-impact{color:var(--quality,#d8b77b);margin:16px 0;padding:16px;border:1px solid currentColor;border-radius:10px;background:#101910}
.quality-impact small{display:block;font-size:.82rem;color:inherit}
.quality-impact strong{display:block;margin:5px 0;font-family:VeynordDisplay,serif;font-size:1.9rem;line-height:1.2}
.quality-impact p{margin:6px 0 0;font-size:.9rem;line-height:1.45;color:#e2e0d3}

}

/* M27: the forge has one clear goal and a distinct relic wallet. */
.smith-portrait{display:grid;grid-template-columns:minmax(160px,280px) 1fr;gap:24px;align-items:center;margin:0 0 24px;padding:20px;border:1px solid #9e7138;border-radius:14px;background:#211914}
.smith-portrait>img{width:100%;max-height:320px;object-fit:cover;border-radius:10px}
.smith-portrait h2{font-size:36px;margin:6px 0}
.divine-forge .recipe-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.divine-piece{display:flex;flex-direction:column;align-items:stretch}
.divine-piece .detail-art{width:100%;height:150px;object-fit:contain}
.divine-piece h4{min-height:2.5em}
.divine-piece button{margin-top:auto}
.relic-wallet{color:#edc982;font-size:18px}
.divine-bonuses{margin-top:18px;padding:16px;border-left:3px solid #be914b;background:#201b16}
.relic-event{border-color:#9e7138;margin-bottom:20px}
@media(max-width:600px){.smith-portrait{grid-template-columns:1fr;gap:12px;padding:14px}.smith-portrait>img{max-height:260px;object-position:center 35%}.divine-forge .recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.divine-piece{padding:10px;min-width:0}.divine-piece .detail-art{height:112px}}
@media(max-width:360px){.divine-forge .recipe-grid{grid-template-columns:1fr}}


/* M29: atlas first, compact loot, visible training. */
.route-atlas{display:flex!important;flex-direction:column;gap:14px;width:100%}.route-atlas .route-banner{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px;width:100%;min-height:142px;padding:22px 24px;text-align:left;background:linear-gradient(110deg,#394334,#111c15);border:1px solid #bda16b;border-radius:12px;box-shadow:inset 0 0 30px #bca5670a}.route-atlas .route-banner strong{font-family:var(--font-display,serif);font-size:clamp(25px,6vw,36px);font-weight:600;line-height:1.15}.route-banner>span:last-child{font-size:14px;line-height:1.4;color:#bdc2b2}.route-banner:disabled{opacity:.55}.route-banner:nth-child(even){background:linear-gradient(250deg,#414535,#13201b)}.training-entry{display:flex;flex-direction:column;width:100%;gap:5px;text-align:left;padding:16px;margin:18px 0;font-size:20px}.training-entry span{font-size:13px;color:#b9beaf}.screen-expeditions .loot-preview-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.screen-expeditions .loot-preview-grid .loot-card{padding:3px;min-width:0;min-height:44px;border-radius:6px}.screen-expeditions .loot-preview-grid .loot-card img{width:100%;height:auto;aspect-ratio:1;object-fit:contain}.screen-expeditions .loot-preview-grid .loot-preview-name,.screen-expeditions .loot-preview-grid .loot-card small{display:none}.guide-bubble{position:relative;margin:20px 0;padding:18px 45px 18px 18px;border:1px solid #88774e;border-radius:18px;background:#2b3425;font-size:15px}.guide-bubble:before{content:'';position:absolute;top:-9px;left:24px;width:16px;height:16px;background:#2b3425;border-left:1px solid #88774e;border-top:1px solid #88774e;transform:rotate(45deg)}.guide-close{position:absolute;right:4px;top:4px;width:40px;height:40px;min-height:40px;padding:0;font-size:25px;border:0;background:transparent}.section-tabs{position:relative;z-index:1}.section-tabs [data-tab=training]{font-size:18px;border-width:2px}

.guide-bubble{position:fixed;z-index:40;left:16px;right:16px;bottom:100px;width:auto;max-width:380px;margin:0;box-shadow:0 8px 30px #0008}.guide-bubble p{font-size:14px;line-height:1.4;margin:8px 0}.guide-bubble:before{top:auto;bottom:-9px;transform:rotate(225deg)}

.atlas-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:18px}.atlas-heading .section-head{margin-bottom:0}.training-shortcut{font-size:15px;padding:10px 14px;min-height:44px}

.attribute-label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}.attribute-label .hero-attribute-name{min-width:0;overflow-wrap:anywhere}.stat-plus{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;font-size:28px;line-height:1;border-color:var(--gold);border-radius:8px}.stat-cost{display:block;color:var(--gold);font-size:12px;margin:6px 0}.character-talents{margin-top:18px;padding:12px 0;border-top:1px solid var(--line)}

@media(max-width:420px){.attribute-label{flex-wrap:wrap;gap:4px}.attribute-label .hero-attribute-name{flex:1 0 100%;overflow-wrap:normal}.attribute-label .stat-plus{margin-left:auto}}

/* Locale selection stays available before sign-in and inside account dialogs. */
.language-picker{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--gold,#d5b67b);margin:4px 0}
.language-picker select{min-height:44px;max-width:130px;padding:6px 10px;font:inherit;color:inherit;background:#172117;border:1px solid #a68e59;border-radius:8px}
.top>.language-picker{grid-column:1/-1;justify-self:end}
#account-dialog>.language-picker{justify-content:flex-end}
html[lang=de] button,html[lang=de] h2,html[lang=de] h3{overflow-wrap:anywhere;hyphens:auto}
html[lang=de] .resource-label{font-size:.9em}
/* Long German names must shrink inside the portrait/text flex row. */
html[lang=de] .enemy-list{grid-template-columns:minmax(0,1fr);min-width:0}
html[lang=de] .enemy>span{min-width:0;flex:1}
html[lang=de] .enemy strong,html[lang=de] .enemy>span>span,html[lang=de] .enemy em,html[lang=de] .hero-attribute-name{overflow-wrap:anywhere;hyphens:auto}
/* Bottom navigation stays tappable above the sticky attack control. */
@media(max-width:720px){.workspace nav{z-index:30}}
/* German compound words may also occur in merchant descriptions and labels. */
html[lang=de] p,html[lang=de] summary,html[lang=de] label,html[lang=de] small{overflow-wrap:anywhere;hyphens:auto}
/* Explicit select sizing avoids native WebKit control overflow in narrow filters. */
html .catalog-tools select{max-width:100%;min-width:0;-webkit-appearance:none;appearance:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,#d8b77b 50%),linear-gradient(135deg,#d8b77b 50%,transparent 50%);background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%;background-size:5px 5px;background-repeat:no-repeat}