/* M1.3 — VARDENYX interface polish. Greyscale stone, ink and restrained gold. */
/* Spatial rhythm */
:root{--ux-ink:#26343d;--ux-paper:#f3f6f6;--ux-edge:#bdc9ce;--ux-gold:#c99f60}
body{background:radial-gradient(ellipse at 52% 9%,#f5f7f7 0%,#d7dcde 75%);color:var(--ux-ink)}
.main-shell{width:100%;min-width:0}
.content{width:100%;max-width:1580px;padding:clamp(12px,1.7vw,26px) clamp(14px,2.7vw,38px) 36px}
.topbar{position:sticky;top:0;z-index:105;min-height:57px;height:57px;
 padding:0 clamp(12px,2vw,34px);gap:13px;border-bottom:1px solid #a9b6bb;
 background:linear-gradient(#fafbfbf8,#e8eeeff5);box-shadow:0 3px 12px #35424b14;
 backdrop-filter:blur(12px)}
.topbar .brand-horizontal{flex:0 0 auto;min-width:0;margin:0}
.topbar .brand-crest{width:34px;height:34px}
.topbar .brand-name{color:#2f3840;font-size:16px;letter-spacing:1.6px}
.topbar .brand-tag{color:#708087;font-size:7px;letter-spacing:1.4px;margin-top:1px}
.top-nav{display:flex;flex:1;align-items:center;justify-content:center;gap:6px;min-width:0}
.top-nav .nav-link{min-height:37px;padding:8px 15px;border:1px solid transparent;
 color:#4a5860;border-radius:9px;font-size:12px;font-weight:750;white-space:nowrap;gap:9px}
.top-nav .nav-link:hover:not(.active){background:#e0e7e9;border-color:#b4c1c6}
.top-nav .nav-link.active{color:#fff;background:#2d3a42;border-color:#394850;box-shadow:0 3px 9px #192a3440}
.topbar .screen-mode-btn,.topbar .header-hide-btn{flex:0 0 auto}
.silver-wallet{order:0;background:#f9faf8;border-color:#b0bfc4;padding:7px 12px;min-height:37px;gap:7px}
.silver-wallet strong{font-size:15px}
.screen-mode-btn,.header-hide-btn{border-radius:8px!important;min-height:37px!important}
.app-shell.header-collapsed .content{padding-top:clamp(10px,1.6vw,23px)}
/* Locations share one visual hierarchy */
.location-heading{margin-bottom:10px;min-height:45px}
.location-heading h1{font-size:clamp(23px,2.4vw,33px);line-height:1.1;margin:4px 0 0}
.location-crumb{font-size:9px;letter-spacing:1.2px;color:#667982}
.location-status{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;
 background:#f5f9f6;border:1px solid #b4c8bd;border-radius:7px;color:#3d7154;
 font-size:11px;font-weight:750;white-space:nowrap}
.status-pulse{width:8px;height:8px;border-radius:50%;background:#3ca271;box-shadow:0 0 0 3px #3ca27122}
.world-back-button{border-color:#42525a;background:#303e46;box-shadow:0 2px 6px #2230382c}
.world-back-button:hover{background:#4a606c}
.adventure-hud{margin-bottom:12px;gap:13px;background:#f6f9f9;border:1px solid #b6c5ca;
 box-shadow:0 4px 12px #25363e10}
.adventure-resource>span{font-size:11px}
.adventure-resource-track{height:9px}
.quest-hint{min-height:37px;background:#e8eff0;border-color:#c5d0d4;font-size:11px}
.quest-hint strong{color:#3b6954}
.city-panorama,.wilderness-panorama{border:1px solid #8b9ca2;border-radius:13px;
 height:clamp(300px,55dvh,580px);box-shadow:0 12px 26px #293c472b}
.city-panorama-art,.wilderness-scene-art{filter:saturate(.9) contrast(1.04)}
.city-poi{min-height:45px;border-radius:9px;box-shadow:0 4px 15px #101c2795;
 border-color:#e0eeee9e}
.city-poi:focus-visible,.world-mob:focus-visible,.world-cache:focus-visible{
 outline:3px solid #ffdf9a;outline-offset:3px}
.city-scene-label{font-size:9px;opacity:.85}
.location-paths{margin-top:21px}
.paths-heading{font-size:11px;letter-spacing:.6px}
.path-grid{gap:11px}
.path-choice{min-height:72px;padding:12px;box-shadow:0 3px 11px #192f3614}
.path-choice strong{font-size:13px}
.path-choice small{font-size:10px}
.path-choice:hover,.path-choice:focus-visible{border-color:#68858e;box-shadow:0 7px 17px #19353c29}
.world-cache{left:13%;top:79%;z-index:9}
.wilderness-panorama{height:clamp(315px,60dvh,620px)}
/* Legible dialogs with stable scene underneath */
.game-modal-backdrop{padding:clamp(7px,1.6vw,22px);background:#0e1820c9}
.service-window,.battle-window{border-radius:13px;box-shadow:0 22px 76px #101820b3}
.service-window{width:min(900px,100%);padding:clamp(12px,2vw,23px)}
.service-intro h2{font-size:clamp(19px,2.1vw,26px)}
.service-body{scrollbar-color:#84969e #e2e9ea;scrollbar-width:thin}
.service-window>.world-modal-close,.battle-window-header .world-modal-close{min-width:39px;min-height:39px}
.trade-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.trade-item{min-width:0}
.trade-item strong,.teacher-skill strong{font-size:12px}
.trade-button,.world-modal-close{transition:background .15s ease,transform .15s ease}
.trade-button:hover:not(:disabled){transform:translateY(-1px)}
.teacher-branches{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.teacher-skill{min-height:66px}
.quest-contract{padding:14px}
.quest-contract h3{margin:5px 0 7px}
.quest-reward{padding-top:11px}
.inn-option{align-items:center}
.battle-window{width:min(1320px,100%);padding:clamp(6px,1vw,13px)}
.battle-window-header{padding:3px 4px 9px}
.battle-window .battle-frame{padding:clamp(5px,1vw,11px)}
.battle-window .battle-stage{grid-template-columns:minmax(85px,.95fr) minmax(235px,1.45fr) minmax(85px,.95fr);
 gap:clamp(4px,1vw,13px);min-height:0}
.battle-window .battle-center{padding:clamp(7px,1vw,11px)}
.battle-window .combat-log{max-height:120px;overflow-y:auto;scrollbar-width:thin}
.battle-window .combat-log ul{margin-top:7px}
.battle-window .battle-turn{min-height:42px}
.game-modal-backdrop .toast{z-index:230}
.app-shell>.toast{position:fixed;left:50%;bottom:max(15px,env(safe-area-inset-bottom));z-index:240;
 transform:translateX(-50%);max-width:min(90vw,690px);width:max-content;
 border-radius:10px;box-shadow:0 11px 32px #0a1c2799;font-size:12px;pointer-events:none}
.world-cache:not(:disabled){min-height:74px;min-width:91px}
.hero-columns{grid-template-columns:minmax(300px,.98fr) minmax(0,1.92fr);gap:15px}
.hero-column{border-color:#b6c5cb;box-shadow:0 8px 25px #24384013}
.hero-left,.hero-bag-column{padding:clamp(11px,1.2vw,17px)}
.hero-paperdoll{grid-template-columns:51px minmax(0,1fr) 51px}
.inventory-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.inventory-slot{min-width:0;min-height:42px}
.hero-stat-row{min-height:52px}
.hero-stat-copy small{font-size:10px;line-height:1.45}
.hero-stat-copy strong{font-size:12px}
.hero-extra-stat{min-height:70px}
.inventory-detail{position:relative}
@media(hover:none),(pointer:coarse){
 .inventory-tooltip,.equipment-slot .gear-tooltip{display:none!important}
 .path-choice:hover{transform:none}
}
/* Horizontal phones and narrow tablets */
@media(max-width:950px){
 .content{padding:10px 10px 25px}
 .topbar{height:50px;min-height:50px;padding:0 9px;gap:7px}
 .topbar .brand-crest{width:26px;height:26px}
 .topbar .brand-name{font-size:12px;letter-spacing:.8px}
 .topbar .brand-tag{display:none}
 .top-nav{gap:3px}
 .top-nav .nav-link{padding:6px 10px;gap:5px;min-height:34px;font-size:10px}
 .silver-wallet{min-height:34px;padding:5px 8px;gap:4px}
 .silver-wallet strong{font-size:12px}
 .silver-wallet small{display:none}
 .location-heading h1{font-size:24px}
 .city-panorama{height:clamp(245px,52dvh,480px)}
 .wilderness-panorama{height:clamp(260px,58dvh,490px)}
 .adventure-hud{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr);gap:6px}
 .hero-columns{grid-template-columns:minmax(248px,.97fr) minmax(0,1.45fr);gap:9px}
 .hero-paperdoll{grid-template-columns:42px minmax(0,1fr) 42px}
 .hero-stat-copy small{font-size:9px}
 .inventory-grid{gap:5px}
 .battle-window .battle-stage{grid-template-columns:minmax(80px,.7fr) minmax(230px,1.5fr) minmax(80px,.7fr);gap:5px}
 .battle-window .combat-figure{max-height:clamp(95px,27dvh,200px)}
 .battle-window .combat-log{max-height:80px}
 .battle-window-header{padding:0 1px 4px}
 .battle-window .battle-turn{min-height:37px}
}
@media(max-width:700px){
 .content{padding:9px 7px 20px}
 .topbar{height:46px;min-height:46px;gap:4px;padding:0 6px}
 .top-nav .nav-link{padding:5px 8px}
 .topbar .screen-mode-btn,.topbar .header-hide-btn{min-width:30px!important;min-height:32px!important;padding:4px 5px!important}
 .location-heading h1{font-size:20px}
 .location-crumb{font-size:8px;letter-spacing:.65px}
 .location-status{font-size:9px;padding:5px 7px}
 .adventure-hud{padding:5px;gap:5px}
 .adventure-resource>span{font-size:9px}
 .adventure-resource strong{font-size:8px}
 .adventure-resource-track{height:6px}
 .quest-hint{min-height:29px;padding:5px;font-size:9px}
 .city-panorama{height:clamp(218px,53dvh,390px)}
 .wilderness-panorama{height:clamp(225px,58dvh,420px)}
 .city-poi{min-height:36px;padding:5px 7px}
 .city-poi strong{font-size:9px}
 .city-poi small{font-size:7px}
 .path-grid{gap:6px}
 .path-choice{padding:8px 6px;gap:4px;min-height:60px}
 .path-choice strong{font-size:10px}
 .path-choice small{font-size:8px}
 .hero-columns{grid-template-columns:minmax(225px,1fr) minmax(0,1.4fr);gap:6px}
 .hero-left,.hero-bag-column{padding:8px}
 .hero-paperdoll{grid-template-columns:37px minmax(0,1fr) 37px}
 .hero-stat-copy small{font-size:9px}
 .inventory-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
 .inventory-slot{min-height:35px}
 .battle-window .battle-stage{grid-template-columns:minmax(70px,.67fr) minmax(205px,1.5fr) minmax(70px,.67fr)}
 .battle-window .fighter-summary{padding:5px 3px}
 .battle-window .combat-figure{max-height:112px}
 .battle-window .combat-log{max-height:65px}
 .service-window{padding:10px}
 .service-intro h2{font-size:18px}
 .teacher-branches{gap:7px}
 .quest-contract{padding:10px}
}
@media(max-width:580px){
 .hero-columns{grid-template-columns:1fr}
 .hero-paperdoll{grid-template-columns:50px minmax(0,1fr) 50px}
 .hero-character-art img{max-height:280px}
 .inventory-grid{grid-template-columns:repeat(7,minmax(0,1fr))}
 .path-choice .path-arrow{display:none}
 .topbar .brand-name{font-size:10px}
}
@media(max-height:420px) and (orientation:landscape){
 .topbar{height:43px;min-height:43px}
 .content{padding-top:7px}
 .location-heading{min-height:34px;margin-bottom:5px}
 .location-heading h1{font-size:21px}
 .adventure-hud{margin-bottom:6px}
 .city-panorama{height:230px}
 .wilderness-panorama{height:245px}
 .battle-window .battle-center{gap:4px}
 .battle-window .battle-stage{min-height:210px}
 .battle-window .combat-log{max-height:55px}
 .game-modal-backdrop{padding:4px}
}
@media(prefers-reduced-motion:reduce){
 .path-choice,.city-poi{transition:none!important}
}