/* M41: illustrated places, restrained controls and correspondence outside the game flow. */
.scene-heading{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:210px;padding:26px;margin:0 0 24px;border-radius:14px;background-size:cover;background-position:center 56%;border:1px solid #af95613d}
.scene-heading::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#09140ef5, #0b160b44 85%)}
.scene-heading h2{font-size:clamp(28px,4vw,40px);line-height:1.15;margin:8px 0 0}.scene-heading p{margin:8px 0 0;max-width:45ch;color:#d3d5c4;font-size:15px}
.scene-market{background-image:url('/scenes/market-m41.webp')}.scene-mail,.scene-gear{background-image:url('/scenes/courier-m41.webp')}.scene-gear{background-position:center 68%}
header.top{grid-template-columns:280px minmax(0,1fr) 96px;column-gap:24px}
header.top .header-actions{display:flex;flex-direction:row;align-items:center;gap:8px}
header.top #inbox-button{position:relative;display:grid;place-items:center;width:44px;min-width:44px;height:44px;padding:0;border:1px solid #b49a6540;border-radius:50%;background:#ffffff04;color:#dbc28e;box-shadow:none}
header.top #inbox-button[hidden]{display:none}#inbox-button svg{fill:none;stroke:currentColor;stroke-width:1.4;pointer-events:none}
.inbox-badge{position:absolute;top:-3px;right:-4px;min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;border-radius:10px;background:#d4b478;color:#101a12;font:700 11px/1 system-ui,sans-serif;box-shadow:0 0 0 2px #142018}.inbox-badge[hidden]{display:none}
.adv-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 22px}
.adv-tabs button,.merchant-modes button{position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:84px;padding:16px 12px;border:1px solid #b9a16a55;border-radius:10px;background-size:cover;background-position:center;box-shadow:none;color:#e9dec0;font:600 18px/1.2 var(--font-body);text-shadow:0 2px 8px #000}
.adv-tabs button::before,.merchant-modes button::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#0b160de8,#0d1c1260)}
.adv-tabs [aria-pressed=true],.merchant-modes [aria-pressed=true]{border-color:#d4b478;box-shadow:inset 0 -3px #d4b478;color:#fff0c8}
.adv-tabs [aria-pressed=true]::before,.merchant-modes [aria-pressed=true]::before{background:linear-gradient(0deg,#152519c9,#17291835)}
.merchant-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 20px}
.adv-travel{position:relative;isolation:isolate;overflow:hidden;padding:16px;gap:10px 14px;border:1px solid #b49a6545;border-radius:12px;background:#142319e8}
.adv-travel-art{position:absolute;inset:0 0 0 auto;width:55%;height:100%;object-fit:cover;opacity:.2;z-index:-1;mask-image:linear-gradient(90deg,transparent,#000)}
.adv-travel>div{min-width:140px}.adv-travel h3{font-size:18px;margin:4px 0;line-height:1.25}.adv-travel .eyebrow{font-size:11px}.adv-travel .adv-clock{font-size:16px}.adv-travel .adv-claim{font-size:13px;min-height:44px;padding:8px 12px;flex:0 1 auto;width:auto;box-shadow:none}
.adv-heading h2{font-size:clamp(25px,3vw,34px)}.adv-heading p{font-size:15px}.adv-detail{border-color:#b49a6545;background:linear-gradient(145deg,#213328bb,#0b160ee8);padding:18px}.adv-detail h3{font-size:26px}.adv-detail p{font-size:16px;line-height:1.6}
.adv-detail p.adv-detail-clock{font-size:14px;line-height:1.5}.adv-task-group{border:0;padding:0;margin:28px 0}.adv-task-group>h3{font-size:23px}.adv-task h4{font-size:18px}.adv-task{padding:16px 0;border-color:#afbd9433}.adv-task-reward button{font-size:13px;min-height:44px}
.route-quests{margin-top:32px;border-top:1px solid #b49a6555;padding-top:16px}.route-quests>summary{font-size:21px;color:#ddc48d}.route-quests .section-head h2{font-size:26px}
.screen-equipment .backpack,.screen-equipment .paperdoll{background:linear-gradient(145deg,#233126a6,#122015bd);border:1px solid #b49a653b;border-radius:14px;padding:16px;box-shadow:none}
.screen-equipment .backpack>.line,.screen-equipment .paperdoll>.line{border-bottom:1px solid #b49a6530;padding-bottom:12px;margin-bottom:16px}.screen-equipment .line h3{font-size:25px}
.screen-equipment .equipment-help{margin:0 0 18px;font-size:14px}.screen-equipment .bag-filters{margin:0 0 18px;border-block:1px solid #b49a6533;padding:12px 0}.bag-filters summary{font-size:15px;color:#d6c295;min-height:24px}.bag-filters[open] summary{margin-bottom:14px}
.screen-equipment .bag-tools{gap:12px}.screen-equipment .bag-tools label{font-size:13px}.screen-equipment .bag-tools select{font-size:14px;min-height:44px;width:100%;padding:8px;line-height:1.4}
.screen-equipment .hero-attributes{gap:10px}.screen-equipment .hero-attribute{padding:12px;background:#11211666;border:0;border-radius:10px}.screen-equipment .hero-attribute-top strong{font-size:29px}.screen-equipment .hero-attribute-name{font-size:15px}.screen-equipment .hero-attribute .stat-plus{width:44px;height:44px;min-height:44px;font-size:25px;border-width:1px;background:#213829}.screen-equipment .hero-attribute-breakdown{font-size:12px;gap:7px}.screen-equipment .stat-cost{font-size:12px}
.screen-equipment .character-talents,.screen-equipment .hero-rename,.equipment-builds{border:0;border-top:1px solid #b49a653b;border-radius:0;background:none;box-shadow:none;padding:16px 0;margin:12px 0}.screen-equipment .character-talents>summary,.screen-equipment .hero-rename>summary,.equipment-builds>summary{font-size:18px}.screen-equipment .inventory-hint{font-size:13px;color:#b5bcae}
.screen-equipment .paperdoll>button[data-tab=smith]{background:linear-gradient(90deg,#0d1911e8,#0d191150),url('/thumb/720/art/borun.webp') center 40%/cover;padding:14px 18px;min-height:58px;width:100%;text-align:left;border:1px solid #b49a6555;border-radius:10px;font-size:17px}
.shop-quality-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}.shop-quality-tabs button{flex:0 1 auto;min-height:44px;padding:9px 11px;font-size:13px;line-height:1.2;border:0;border-bottom:2px solid transparent;border-radius:6px;background:#132118a3;box-shadow:none}.shop-quality-tabs [aria-pressed=true]{border-bottom-color:currentColor;background:#304433;box-shadow:none}
.compact-wallet{padding:12px 0;border:0;border-block:1px solid #b49a653b;border-radius:0;background:none;box-shadow:none;margin:0 0 12px}.compact-wallet summary{font-size:15px;line-height:1.5}.compact-wallet summary small{font-size:12px}.compact-wallet summary strong{font-size:16px}.compact-wallet p{font-size:14px}
.shop-filters{margin:12px 0;border-color:#b49a653b;padding:12px 0}.shop-filters summary{font-size:15px}.catalog-tools label{font-size:13px}.catalog-tools select,.catalog-tools input{font-size:14px;padding:9px;min-height:44px}
.catalog-pages{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px;margin:14px 0}.catalog-pages>span{flex:1;min-width:130px;font-size:13px;color:#bdc3b3}.catalog-pages button{min-height:44px;padding:8px 10px;font-size:12px;background:#183020;border:1px solid #b49a6545;box-shadow:none}
.merchant-grid{gap:12px}.merchant-card{border:1px solid #b49a6529;border-bottom:2px solid var(--quality,#aaa);border-radius:10px;background:linear-gradient(145deg,#26382a8c,#0c17108c);padding:12px;box-shadow:none}.merchant-card strong{font-size:16px;line-height:1.35}.merchant-card .shop-rarity{font-size:12px}.merchant-card small{font-size:12px}.merchant-card>span:not(.shop-rarity){font-size:14px}
.mail-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:20px 0}.quiet-tabs{display:flex;gap:6px;flex-wrap:wrap}.quiet-tabs button,.quiet-action{min-height:44px;padding:8px 11px;font-size:13px;border:1px solid #b49a6545;background:#16281d;box-shadow:none}.quiet-tabs [aria-pressed=true]{border-color:#c0a66d;color:#f0dfb3}.quiet-action{background:transparent}
.mail-list{border-top:1px solid #b49a6545}.mail-row{width:100%;display:flex;align-items:center;gap:14px;min-height:100px;padding:16px 4px;text-align:left;border:0;border-bottom:1px solid #b49a6538;border-radius:0;background:transparent;box-shadow:none;color:#d4d9c8}.mail-row.unread{background:linear-gradient(90deg,#be9d4912,transparent)}.mail-row>img{width:64px;height:64px;flex:none;object-fit:cover;border-radius:9px}.mail-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.mail-copy small{font-size:12px;color:#aeb9a7}.mail-copy strong{font-size:19px;line-height:1.25}.mail-copy>span{font-size:13px;color:#b5bea9}.mail-dot{color:#dbb974;font-size:12px}.mail-row:not(.unread) .mail-dot{font-size:25px;color:#8e9e87}
.mail-empty{padding:28px 6px}.mail-empty h3{font-size:24px}.mail-empty p{font-size:15px;line-height:1.65;max-width:50ch;color:#b9c2b1}.mail-retention{font-size:12px;color:#a3ad9b;margin-top:18px}.mail-letter{padding:22px 0}.mail-letter-heading{display:flex;gap:18px;align-items:center}.mail-letter-heading>img{width:90px;height:90px;object-fit:cover;border-radius:12px}.mail-letter-heading h3{font-size:27px;margin:5px 0}.mail-letter time{font-size:13px;color:#aeb9a7}.mail-letter p{font-size:15px;line-height:1.6}.mail-outcome{padding-top:18px;border-top:1px solid #b49a6545}.mail-rewards{display:flex;gap:12px 24px;flex-wrap:wrap;margin:20px 0}.mail-rewards>span{font-size:14px}.mail-rewards strong{color:#dcc087}.mail-loot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mail-loot>button{display:flex;gap:12px;align-items:center;text-align:left;min-width:0;padding:12px;background:#15251a;border:1px solid #b49a6540;box-shadow:none}.mail-loot img{width:64px;height:64px;object-fit:contain}.mail-loot span{min-width:0;font-size:15px}.mail-loot small{display:block;font-size:12px;color:#b5bea9;margin-top:5px}.text-back{font-size:14px;min-height:44px}
@media(max-width:1100px) and (min-width:721px){header.top{grid-template-columns:200px minmax(0,1fr) 96px;column-gap:14px}}
@media(max-width:720px){header.top{grid-template-columns:minmax(0,1fr) 96px;column-gap:8px}.scene-heading{min-height:180px;padding:20px;margin-bottom:18px}.adv-tabs{gap:10px}.adv-tabs button{min-height:76px;font-size:17px}.merchant-modes{gap:8px}.merchant-modes button{min-height:72px;font-size:15px;padding:12px 8px}.screen-equipment .backpack,.screen-equipment .paperdoll{padding:14px}.mail-toolbar{gap:8px}.mail-letter-heading{gap:12px}.mail-letter-heading>img{width:64px;height:64px}.mail-letter-heading h3{font-size:23px}.mail-loot{grid-template-columns:1fr}}
@media(max-width:359px){.scene-heading{padding:16px;min-height:160px}.shop-quality-tabs button{font-size:12px;padding-inline:8px}.mail-copy strong{font-size:17px}.mail-row{gap:10px}.mail-row>img{width:52px;height:52px}.adv-travel .adv-claim{flex-basis:100%}}

@media(max-width:720px){.scene-market,.scene-gear{min-height:108px;padding:16px 18px}.scene-market h2,.scene-gear h2{font-size:28px}.shop-quality-tabs{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:3px;scrollbar-width:thin}.shop-quality-tabs button{flex:none}.merchant-modes button{min-height:64px}.catalog-pages{margin:10px 0}.shop-filters{padding:10px 0}}
@media(max-width:359px){header.top{grid-template-columns:minmax(0,1fr) 88px;column-gap:0}header.top .header-actions{gap:0}}

/* M52: reachable actions and compact secondary information. */
.nav-art-button{position:relative}.nav-task-dot{position:absolute;top:5px;right:5px;width:9px;height:9px;background:#e4c27a;border-radius:50%;box-shadow:0 0 0 2px #142419}
#character-training{scroll-margin-top:30px}.training-shortcut{margin-bottom:10px;min-height:44px}
.guide-bubble{position:relative;inset:auto;width:auto;max-width:none;margin:14px 0;z-index:auto;transform:none}
@media(max-width:720px){.encounter-panel .encounter-art{height:min(25vh,190px);max-height:190px;min-height:0;object-fit:contain}.encounter-panel{padding:14px}.encounter-facts{margin:10px 0}.screen-expeditions>.section-head{margin:10px 0}.screen-expeditions>.section-head h2{font-size:27px}.encounter-attack{margin-top:10px}}
@media(min-width:721px){.screen-equipment>.scene-heading{min-height:90px;padding-block:16px}body .screen-equipment>.ostoya-entry.ostoya-feature{min-height:96px;max-height:112px;padding:12px 18px}.screen-equipment>.ostoya-entry .ostoya-entry-copy{padding:12px 18px}}

@media(min-width:721px){body .screen-equipment>.ostoya-entry.ostoya-feature{align-items:center;max-height:none;min-height:112px}.screen-equipment>.ostoya-entry .ostoya-entry-copy{gap:4px;padding:0}.screen-equipment>.ostoya-entry .ostoya-entry-copy>strong{font-size:28px}.screen-equipment>.ostoya-entry .ostoya-entry-copy>span{font-size:14px}.screen-equipment>.ostoya-entry .ostoya-entry-copy>.eyebrow{display:none}}

@media(min-width:721px){.screen-equipment>.equipment-help{margin-bottom:8px}.screen-equipment .inventory-shell{margin-top:12px}}
