.arena-game { margin: 0; height: 100dvh; overflow: hidden; background: #0a100e; color: #f3ead1; font: 14px/1.5 'Pretendard Variable', sans-serif; color-scheme: dark; word-break: keep-all; }
.arena-game *, .arena-game *::before, .arena-game *::after { box-sizing: border-box; }
.arena-game [hidden] { display: none !important; }
.arena-game .ar-field-notice {
    position: absolute;
    top: 46px;
    right: 10px;
    max-width: min(290px, calc(100% - 20px));
    padding: 7px 10px;
    border: 1px solid #e3bc6d;
    border-radius: 4px;
    background: #18251cf2;
    color: #fff0bc;
    box-shadow: 0 3px 10px #0008;
    font-size: 11px;
    text-align: center;
    pointer-events: none;
    z-index: 1;
}
@media (max-width: 680px), (max-height: 500px) {
    .arena-game .ar-field-notice { top: 42px; right: 6px; max-width: min(240px, calc(100% - 12px)); padding: 5px 7px; font-size: 10px; }
}
.arena-game .ar-field:has(.ar-boss:not([hidden])) .ar-field-notice { top: 100px; }
.arena-game .ar-choice-panel:has(.ar-route-header) { display: block; padding: 14px 20px; width: min(100%, 900px); }
.arena-game .ar-choice-panel:has(.ar-route-header) h1 { font-size: clamp(22px, 3vw, 32px); margin: 4px 0; }
.arena-game .ar-choice-panel:has(.ar-route-header) > p { margin: 5px 0; }
.arena-game .ar-route-track { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; font-size: 11px; color: #788d85; }
.arena-game .ar-route-track .ar-current-region { color: #ffe4a3; font-weight: 800; }
.arena-game .ar-route-caption { margin: 6px 0; color: #c2d7c5; font-size: 12px; }
.arena-game .ar-route-overview { max-height: min(220px, 30dvh); overflow: auto; overscroll-behavior: contain; border: 1px solid #6e826055; border-radius: 5px; background: radial-gradient(ellipse at 50% 50%, #34473877, #101d21); scrollbar-width: thin; scrollbar-color: #b79b62 #172723; }
.arena-game .ar-expedition-map { display: block; width: 100%; min-width: 260px; }
.arena-game .ar-map-link { fill: none; stroke: #738778; stroke-width: 2; stroke-dasharray: 5 7; opacity: .45; }
.arena-game .ar-map-node { fill: #182b2b; stroke: #738778; stroke-width: 2; }
.arena-game .ar-map-node text { fill: #d5d8b4; stroke: none; text-anchor: middle; font: bold 17px sans-serif; }
.arena-game .ar-map-node[data-kind="elite"] { stroke: #e29b79; }
.arena-game .ar-map-node[data-kind="treasure"] { stroke: #edcc82; }
.arena-game .ar-map-node[data-kind="event"] { stroke: #b4a0dd; }
.arena-game .ar-map-node[data-kind="camp"] { stroke: #9fd4a3; }
.arena-game .ar-map-node[data-kind="boss"] { stroke: #f18e76; stroke-width: 3; }
.arena-game .ar-map-node[data-state="past"], .arena-game .ar-map-node[data-state="locked"] { opacity: .25; }
.arena-game .ar-map-node[data-state="visited"] { fill: #655538; stroke: #eed5a1; }
.arena-game .ar-map-node[data-state="reachable"] { fill: #3f4e35; stroke: #fff1bd; stroke-width: 3; filter: drop-shadow(0 0 4px #e8c57466); }
.arena-game .ar-choices.ar-route-map { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; padding-bottom: 85px; min-height: 280px; isolation: isolate; }
.arena-game .ar-route-terrain { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; fill: none; pointer-events: none; }
.arena-game .ar-route-branch-back { stroke: #0b171b; stroke-width: 12; }
.arena-game .ar-route-branch { stroke: #bbba83; stroke-width: 3; stroke-dasharray: 6 9; opacity: .7; }
.arena-game .ar-route-destination, .arena-game .ar-route-player-dot { fill: #8b9c6e; stroke: #dfcb8d; stroke-width: 2; }
.arena-game .ar-route-tree, .arena-game .ar-route-ruin, .arena-game .ar-route-rock { fill: #56756333; stroke: #83a59044; stroke-width: 2; }
.arena-game .ar-route-tree-trunk { stroke: #83a59055; stroke-width: 3; }
.arena-game .ar-choices .ar-route-node { position: relative; min-height: 170px; padding: 5px 8px; border: 0; background: transparent; box-shadow: none; gap: 4px; }
.arena-game .ar-choices .ar-route-node:hover, .arena-game .ar-choices .ar-route-node:focus-visible { background: #35493855; box-shadow: none; border-radius: 6px; }
.arena-game .ar-route-node > b { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; border: 2px solid #aab681; background: #1d3331; color: #e7dfad; font-size: 25px; box-shadow: 0 0 0 4px #101f1d, 0 3px 8px #0008; }
.arena-game .ar-route-node[data-route="elite"] > b { border-color: #e29b79; color: #ffbc93; }
.arena-game .ar-route-node[data-route="camp"] > b { border-color: #9fd4a3; color: #bdeabc; }
.arena-game .ar-route-node[data-route="treasure"] > b { border-color: #edcc82; color: #ffe6a2; }
.arena-game .ar-route-node[data-route="event"] > b { border-color: #b4a0dd; color: #d6c2ff; }
.arena-game .ar-route-node[data-route="boss"] > b { border-color: #f18e76; color: #ffc0a4; }
.arena-game .ar-route-node > strong { font-size: 14px; color: #f6e4b5; }
.arena-game .ar-route-node > span { font-size: 11px; }
.arena-game .ar-route-kind { color: #9eb9a8; font-size: 10px; }
.arena-game .ar-route-reward { color: #ecd28c; font-size: 10px; }
.arena-game .ar-route-position { position: absolute; left: 50%; bottom: 4px; transform: translateX(-50%); display: grid; gap: 4px; justify-items: center; color: #d9e8ba; font-size: 10px; }
.arena-game .ar-route-position b { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #b8c596; border-radius: 50%; background: #172e28; font-size: 20px; }
.arena-game .ar-choices.ar-route-map-expanded { min-height: 0; padding-bottom: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 110px), 1fr)); }
.arena-game .ar-route-map-expanded .ar-route-node { min-height: 145px; }
@media (max-width: 680px), (max-height: 500px) {
    .arena-game .ar-choice-panel:has(.ar-route-header) { padding: 10px; }
    .arena-game .ar-route-track { font-size: 10px; gap: 5px; }
    .arena-game .ar-route-overview { max-height: min(160px, 30dvh); }
    .arena-game .ar-choices .ar-route-node { padding: 5px 3px; }
    .arena-game .ar-route-node > strong { font-size: 12px; }
    .arena-game .ar-route-node > span { font-size: 10px; }
    .arena-game .ar-route-node > b { width: 42px; height: 42px; font-size: 22px; }
    .arena-game .ar-route-map-expanded .ar-route-node { min-height: 130px; }
}
.arena-game .ar-top {background:linear-gradient(90deg,#101a20,#172b28,#101a20);border-bottom-color:#a98d52;box-shadow:0 3px 12px #0007;}
.arena-game .ar-top a {text-shadow:0 0 16px #f1bd5566;}
.arena-game .ar-shell {background:radial-gradient(ellipse at 50% 0,#29403544,transparent 60%);}
.arena-game .ar-hud {background:linear-gradient(110deg,#142923,#122028);border-color:#93805a;box-shadow:inset 0 1px #ead2a51c,0 3px 12px #0005;}
.arena-game .ar-hud strong {font-variant-numeric:tabular-nums;color:#fff2c9;text-shadow:0 2px 2px #000;}
.arena-game .ar-vital .ar-track {height:8px;border:1px solid #54715b;box-shadow:inset 0 2px 4px #0008;}
.arena-game .ar-vital .ar-track i {background:linear-gradient(90deg,#34835b,#8ed48a);}
.arena-game .ar-field {border-color:#ae935c;box-shadow:inset 0 0 24px #0008,0 0 0 1px #1c140d,0 5px 18px #0006;}
.arena-game .ar-choice-panel {background:linear-gradient(145deg,#20332ded,#111e24f5);border-color:#cead6e;box-shadow:inset 0 0 0 3px #0a141b,0 18px 70px #000b;}
.arena-game .ar-choice-panel h1 {color:#fff0bc;text-shadow:0 3px #081415,0 0 24px #ddb46d33;}
.arena-game .ar-choices button {background:linear-gradient(160deg,#263d38,#11242c);box-shadow:inset 0 1px #ffffff16,0 4px 8px #0005;transition:border-color .15s,box-shadow .15s;}
.arena-game .ar-choices button:hover {background:linear-gradient(160deg,#36574a,#1d3440);box-shadow:inset 0 1px #ffffff24,0 0 16px #dfbd5544;}
.arena-game .ar-controls>div {background:linear-gradient(#192e2b,#11201f);border-color:#526b61;}
.arena-game .ar-controls>button {background:linear-gradient(#6b5634,#2b2521);box-shadow:inset 0 1px #ffe2a855,0 3px 8px #0005;}
.arena-game #ar-dash {background:linear-gradient(#315861,#162d3b);border-color:#74b8c7;}
.arena-game #ar-dash strong {color:#c6f2ff;}
.arena-game #ar-dash::after {background:#8be0ee;}
.arena-game .ar-boss {background:linear-gradient(90deg,#29131fee,#49231eee,#29131fee);border-color:#e2a071;box-shadow:0 0 16px #ba4f3933;}
.arena-game .ar-slot {box-shadow:inset 0 0 0 2px #071515,0 2px 6px #0007;}
@media(prefers-reduced-motion:reduce){.arena-game .ar-choices button{transition:none;}}
.arena-game .ar-choices button[data-rarity] { border-color: var(--ar-rarity); }.arena-game .ar-rarity { color: var(--ar-rarity); font-size: 10px; font-style: normal; font-weight: 800; }.arena-game .ar-choices button[data-rarity="unique"] { background: linear-gradient(#483250,#17261c); }
.arena-game .ar-loadout { position: absolute; left: 10px; bottom: 64px; z-index: 1; display: grid; gap: 4px; }
.arena-game .ar-xp {position:absolute;right:10px;bottom:64px;width:min(170px,42%);z-index:1;padding:6px 8px;background:#14231de6;border:1px solid #526657;border-radius:6px;pointer-events:none;font-size:11px;color:#b8eeff;}
.arena-game .ar-xp .ar-track {height:5px;margin-top:4px;}
.arena-game .ar-xp .ar-track i {background:#8ad9ff;}
@media(max-width:480px){.arena-game .ar-xp{bottom:112px;width:132px;}}
.arena-game .ar-loadout > div { display: flex; gap: 4px; }
.arena-game .ar-slot { width: 40px; height: 40px; position: relative; padding: 0; border: 1px solid #c1aa6d; border-radius: 3px; color: #ffe6a1; background: #12211de6; overflow: hidden; }
.arena-game .ar-slot::before { content: ''; position: absolute; bottom: 0; left: 0; height: 3px; width: var(--ar-slot-charge,100%); background: #f4ca75; }
.arena-game .ar-slot.ar-evolved {border-color:#ffe38a!important;background:linear-gradient(#62552b,#182b24);box-shadow:0 0 8px #ffe38a55;}
.arena-game .ar-choice-actions:not(:empty){margin-top:10px;}
.arena-game .ar-choice-actions:empty {display:none;}
.arena-game .ar-choice-actions details {margin-top:8px;text-align:left;padding:8px;border:1px solid #66765c;border-radius:6px;}
.arena-game .ar-choice-actions summary {cursor:pointer;color:#ead7a6;font-size:13px;}
.arena-game .ar-choice-actions details p {font-size:12px;line-height:1.5;margin:8px 0;color:#c5cebd;}
.arena-game .ar-choice-actions details button {margin:3px;}
.arena-game .ar-damage-list {padding:0;list-style:none;}
.arena-game .ar-damage-list li {margin:8px 0;padding:6px 8px;border:1px solid #526657;border-radius:4px;}
.arena-game .ar-damage-list i {display:block;height:4px;margin-top:3px;background:#93cfb4;border-radius:2px;}
.arena-game .ar-choice-actions button {min-height:30px;padding:4px 12px;background:#26372e;border:1px solid #8d946a;border-radius:4px;color:#ead7a6;font-size:12px;}
.arena-game .ar-choice-actions > button {margin:3px;}
.arena-game .ar-choice-actions > span {display:inline-block;padding:4px 8px;font-size:12px;color:#c9d2ae;}
.arena-game .ar-slot b { display: block; font-size: 19px; line-height: 23px; }.arena-game .ar-slot small { position: absolute; top: 0; right: 3px; font-size: 9px; }.arena-game .ar-slot span { display: block; font-size: 9px; color: #c8d9b5; }
.arena-game .ar-icon-host {display:flex;align-items:center;justify-content:center;}
.arena-game .ar-pixel-icon {display:block;width:32px;height:32px;flex:none;image-rendering:pixelated;}
.arena-game .ar-atlas-icon {background-image:url('/static/ai/ember-route/assets/0x72/0x72_DungeonTilesetII_v1.7.png');background-size:1024px 1024px;}
.arena-game .ar-slot b.ar-icon-host {display:flex;height:23px;}
.arena-game .ar-slot .ar-pixel-icon {transform:scale(.75);}
.arena-game .ar-choices button {position:relative;}
.arena-game .ar-choice-key {position:absolute;right:7px;top:6px;font:11px monospace;padding:1px 5px;border:1px solid #c4b274;color:#eed8a7;background:#101d17;border-radius:3px;}
@media(pointer:coarse){.arena-game .ar-choice-key {display:none;}}
.arena-game button { font: inherit; cursor: pointer; touch-action: manipulation; }
.arena-game button:disabled { opacity: .55; cursor: default; }
.arena-game :focus-visible { outline: 3px solid #ffcc73; outline-offset: 3px; }
.ar-top { height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; background: #111c18; border-bottom: 1px solid #566146; }
.ar-top a { color: #efd29c; text-decoration: none; font-weight: 850; letter-spacing: 1px; }.ar-top small { font-size: 10px; color: #9bb198; margin-left: 12px; }
.ar-top button, #ar-dialog button { border: 1px solid #6c7750; color: #eadcb8; background: #253324; border-radius: 4px; min-height: 34px; padding: 5px 12px; }
.ar-shell { height: calc(100dvh - 44px); display: flex; flex-direction: column; padding: 8px 12px max(8px, env(safe-area-inset-bottom)); gap: 8px; }
.ar-hud { display: grid; grid-template-columns: minmax(120px, 2fr) repeat(3, 1fr); gap: 18px; padding: 8px 16px; background: #1d2d22; border: 1px solid #536746; border-radius: 4px; }
.ar-hud span { display: block; font-size: 10px; color: #adb99b; }.ar-hud strong { display: block; font-size: 19px; }.ar-vital { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3px 8px; }.ar-track { grid-column: 1/-1; height: 5px; background: #0e1810; border-radius: 4px; overflow: hidden; }.ar-track i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #a1bd64, #d6e49a); }
.ar-field { flex: 1; min-height: 0; position: relative; display: flex; align-items: center; justify-content: center; container-type: size; background: radial-gradient(ellipse, #354130, #101d17); border: 2px solid #746d4d; border-radius: 4px; overflow: hidden; }
#ar-canvas { width: 100%; height: 100%; image-rendering: pixelated; touch-action: none; outline-offset: -3px; }
.ar-banner { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); padding: 5px 12px; border: 1px solid #b69b6255; border-radius: 20px; background: #111c18c9; color: #eed8a3; font-size: 11px; white-space: nowrap; pointer-events: none; }
.ar-controls { display: grid; grid-template-columns: 1fr 1.4fr 1fr 1fr; gap: 8px; flex: 0 0 auto; }.ar-controls > div, .ar-controls > button { min-height: 62px; padding: 8px 12px; border: 1px solid #665f43; border-radius: 4px; background: #1c2a20; color: #eee1be; }.ar-controls strong, .ar-controls span { display: block; }.ar-controls span { color: #a8b79a; font-size: 10px; margin-top: 2px; }.ar-controls button { position: relative; border-bottom-width: 4px; background: linear-gradient(#68522e, #352d1d); border-color: #c7a267; }.ar-controls button strong { color: #ffe3a5; font-size: 16px; }.ar-controls button span { color: #d6c19c; }.ar-controls button:not(:disabled):active { transform: translateY(2px); }.ar-controls .ar-ready { box-shadow: 0 0 16px #dc9a3238; border-color: #f1c77f; }
.ar-overlay { position: absolute; inset: 0; background: #060e09b8; display: grid; place-items: center; overflow: auto; padding: 20px; backdrop-filter: blur(3px); }
.ar-choice-panel { width: min(100%, 860px); text-align: center; padding: 28px; background: linear-gradient(135deg, #2b3b28, #15261c); border: 2px solid #b39a62; border-radius: 6px; box-shadow: 0 15px 60px #0008; }
.ar-choice-panel > p:first-child { color: #d6b878; font-size: 11px; letter-spacing: 3px; }.ar-choice-panel h1 { font-size: clamp(24px, 4vw, 44px); margin: 5px 0 12px; }.ar-choice-panel p { color: #b8c7ac; }.ar-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; margin-top: 24px; }.ar-choices button { display: flex; flex-direction: column; align-items: center; gap: 8px; min-height: 120px; padding: 18px 12px; border: 2px solid #8c7951; border-radius: 4px; color: #f5e6bf; background: linear-gradient(#35452e, #17261c); }.ar-choices button:hover { border-color: #ffd689; background: #3e4e30; }.ar-choices button b { color: #ffc975; font-size: 28px; }.ar-choices button strong { font-size: 17px; }.ar-choices button span { font-size: 12px; color: #b7c4a7; }
#ar-dialog { width: min(680px, calc(100% - 24px)); max-height: calc(100dvh - 24px); overflow: auto; padding: 20px; border: 2px solid #b79b62; border-radius: 6px; background: #18281d; color: #e9e0c5; }.arena-game #ar-dialog::backdrop { background: #050b09bd; backdrop-filter: blur(5px); }#ar-dialog header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }#ar-dialog h2 { margin: 0; font-size: 21px; }#ar-dialog p, #ar-dialog li { font-size: 13px; line-height: 1.8; }#ar-dialog a { color: #edc781; }#ar-dialog label { display: block; margin: 12px 0; }#ar-dialog input { accent-color: #ddba74; }
.ar-stick { display: none; position: absolute; width: 88px; height: 88px; border-radius: 50%; border: 2px solid #ebd29b88; background: #0c181788; pointer-events: none; }.ar-stick i { position: absolute; left: 23px; top: 23px; width: 38px; height: 38px; border-radius: 50%; background: #d9c991aa; }.ar-stick.ar-visible { display: block; }
.ar-warning { margin: 0; font-size: 11px; color: #f7bf8a; }
.ar-goal { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); width: min(340px, calc(100% - 24px)); padding: 7px 12px; background: #0b171bd9; border: 1px solid #8c9b6855; text-align: center; pointer-events: none; font-size: 10px; color: #d3dfb6; border-radius: 4px; }
.ar-goal .ar-track { margin-top: 4px; height: 3px; }.ar-goal .ar-track i { width: 0; background: #d6b575; }
.ar-boss { position: absolute; top: 48px; left: 50%; transform: translateX(-50%); width: min(340px, calc(100% - 24px)); padding: 6px 12px; background: #301b1bea; border: 1px solid #c37757; text-align: center; pointer-events: none; font-size: 11px; }.ar-boss .ar-track i { background: #e3916d; }
.ar-overlay { z-index: 2; }.ar-top > div { display: flex; gap: 6px; }
.ar-perks { display: grid; gap: 8px; }.arena-game .ar-perks button { text-align: left; padding: 10px; }
.ar-profile-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin: 12px 0; }.ar-profile-stats > div { padding: 10px 6px; border: 1px solid #65754b; background: #233423; text-align: center; border-radius: 4px; }.ar-profile-stats span { display: block; font-size: 10px; color: #bbcca7; }.ar-profile-stats strong { display: block; font-size: clamp(15px,3vw,23px); color: #f4dda3; }.arena-game .ar-perks button:disabled { opacity: .8; }
.ar-growth-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.arena-game .ar-perk-card { display: flex; flex-direction: column; gap: 6px; align-items: center; text-align: center; background: linear-gradient(#38402a,#1d2d23); padding: 16px 10px; border-color: #9c8854; }.ar-perk-card b { font-size: 26px; color: #efce7f; }.ar-perk-card strong { font-size: 14px; }.ar-perk-card span { font-weight: 800; color: #f8e7b5; }.ar-perk-card small { font-size: 11px; color: #bfcead; }.ar-perk-card em { margin-top: auto; font-style: normal; font-size: 11px; line-height: 1.5; color: #d0c4a0; }
.ar-confirm-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ar-difficulty { grid-column: 1/-1; font-size: 12px; color: #d7cba9; }.ar-difficulty select { font: inherit; min-height: 36px; padding: 5px 28px 5px 12px; margin-left: 8px; border: 1px solid #a09262; background: #17281f; color: #ffe5af; border-radius: 4px; }
.arena-game .ar-record-filters { display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0; }
.arena-game .ar-record-filters label { display: grid; gap: 6px; flex: 1 1 120px; font-size: 12px; color: #d7cba9; min-width: 0; }
.arena-game .ar-record-filters select { width: 100%; min-height: 40px; font: inherit; padding: 6px 32px 6px 12px; border: 1px solid #a09262; background: #17281f; color: #ffe5af; border-radius: 4px; }
.ar-choices button:only-child { grid-column: 1/-1; }
#ar-dialog header { position: sticky; top: -20px; z-index: 1; background: #18281d; padding: 8px 0; }
.ar-menu-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }.arena-game .ar-menu-tabs button { padding: 5px 10px; }.arena-game .ar-menu-tabs button[aria-pressed="true"] { background: #655c32; border-color: #edc87f; color: #fff1bf; }
.ar-touch-hint { display: none; position: absolute; left: 10px; bottom: 58px; padding: 5px 9px; border-radius: 4px; border: 1px solid #d9bf7866; background: #102018ca; color: #eadab2; font-size: 11px; pointer-events: none; }.ar-field.ar-touch-used .ar-touch-hint { display: none; }
.ar-choices button[data-weapon] { border-top-width: 4px; }
.ar-choices.ar-class-choices { grid-template-columns: repeat(3, minmax(0,1fr)); }
.arena-game .ar-choices button[data-weapon="frostMage"] b {background-position:-384px -396px;}
.arena-game .ar-choices button[data-weapon="warden"] b {background-position:-384px -876px;}
.arena-game .ar-choices button[data-weapon="shadow"] b {background-position:-384px -684px;}
.arena-game .ar-choices button[data-weapon="druid"] b {background-position:-384px -588px;}
.arena-game .ar-choices button[data-weapon="oracle"] b {background-position:-384px -204px;}
.arena-game .ar-choices button[data-weapon="ranger"] b {background-position:-384px -12px;}
.arena-game .ar-choices button[data-weapon="summoner"] b {background-position:-384px -396px;filter:hue-rotate(45deg) drop-shadow(0 6px 3px #0008);}
.arena-game .ar-choices button[data-weapon="engineer"] b {background-position:-384px -876px;filter:hue-rotate(150deg) drop-shadow(0 6px 3px #0008);}
.arena-game .ar-choices button[data-weapon="alchemist"] b {background-position:-384px -588px;filter:hue-rotate(35deg) drop-shadow(0 6px 3px #0008);}
.arena-game .ar-choices button[data-weapon="frostMage"] {border-top-color:#99ddff;}
.arena-game .ar-choices button[data-weapon="warden"] {border-top-color:#e5b98c;}
.arena-game .ar-choices button[data-weapon]:disabled {opacity:.65;}
.ar-choice-panel:has(.ar-class-choices) { padding: 20px; }
.ar-choices button[data-weapon="ember"] { border-top-color: #eaa061; }
.ar-choices button[data-weapon="bow"] { border-top-color: #8ddcc3; }
.ar-choices button[data-weapon="blade"] { border-top-color: #abcfea; }
.ar-choices button[data-weapon] b { width: 48px; height: 84px; font-size: 0; background-image: url('/static/ai/ember-route/assets/0x72/0x72_DungeonTilesetII_v1.7.png'); background-size: 1536px 1536px; image-rendering: pixelated; filter: drop-shadow(0 6px 3px #0008); }
.ar-choices button[data-weapon="ember"] b { background-position: -384px -492px; }
.ar-choices button[data-weapon="bow"] b { background-position: -384px -108px; }
.ar-choices button[data-weapon="blade"] b { background-position: -384px -300px; }
.ar-controls > button::after { content: ''; position: absolute; bottom: 0; left: 0; height: 3px; width: var(--ar-charge, 100%); background: #f4cf79; pointer-events: none; }
@media(max-width: 680px) {
    .arena-game .ar-choices button[data-weapon="shadow"] b {background-position:-256px -456px;}
    .arena-game .ar-choices button[data-weapon="druid"] b {background-position:-256px -392px;}
    .arena-game .ar-choices button[data-weapon="oracle"] b {background-position:-256px -136px;}
    .arena-game .ar-choices button[data-weapon="ranger"] b {background-position:-256px -8px;}
    .arena-game .ar-choices.ar-class-choices {grid-template-columns:repeat(3,minmax(0,1fr));}
    .arena-game .ar-choice-panel:has(.ar-class-choices) #ar-description {display:none;}
    .arena-game .ar-choice-panel:has(.ar-class-choices) {padding:10px;}
    .arena-game .ar-choices button[data-weapon="frostMage"] b {background-position:-256px -264px;}
    .arena-game .ar-choices button[data-weapon="warden"] b {background-position:-256px -584px;}
    .arena-game .ar-choices button[data-weapon="summoner"] b {background-position:-256px -264px;filter:hue-rotate(45deg);}
    .arena-game .ar-choices button[data-weapon="engineer"] b {background-position:-256px -584px;filter:hue-rotate(150deg);}
    .arena-game .ar-choices button[data-weapon="alchemist"] b {background-position:-256px -392px;filter:hue-rotate(35deg);}
    .ar-growth-grid { grid-template-columns: 1fr; }.arena-game .ar-perk-card { display: grid; grid-template-columns: 32px 1fr; align-items: center; text-align: left; gap: 4px 8px; padding: 10px; }.ar-perk-card b { grid-row: 1/5; }.ar-perk-card em { margin: 0; }
    .ar-touch-hint { display: block; }
    .ar-choices button[data-weapon] b { width: 32px; height: 56px; font-size: 0; background-size: 1024px 1024px; }
    .ar-choices button[data-weapon="ember"] b { background-position: -256px -328px; }
    .ar-choices button[data-weapon="bow"] b { background-position: -256px -72px; }
    .ar-choices button[data-weapon="blade"] b { background-position: -256px -200px; }
    .ar-top { padding: 0 8px; font-size: 12px; }.ar-top small { display: none; }.ar-top button { padding: 4px 8px; font-size: 11px; }
    .ar-shell { padding: 5px 6px; gap: 5px; }.ar-hud { grid-template-columns: 1.7fr 1fr .65fr 1fr; gap: 8px; padding: 6px 8px; }.ar-hud strong { font-size: 15px; }.ar-hud span { font-size: 9px; }
    .ar-controls { grid-template-columns: 1fr 1fr; gap: 5px; }.ar-controls > div { display: none; }.ar-controls button { min-height: 58px; padding: 6px; }.ar-controls button strong { font-size: 14px; }
    .ar-banner { font-size: 9px; max-width: calc(100% - 12px); white-space: normal; text-align: center; width: max-content; }
    .ar-overlay { padding: 8px; }.ar-choice-panel { padding: 12px; }.ar-choice-panel p { font-size: 11px; }.ar-choices { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; margin-top: 12px; }.ar-choices button { min-height: 95px; padding: 10px 5px; gap: 4px; }.ar-choices button b { font-size: 21px; }.ar-choices button strong { font-size: 12px; }.ar-choices button span { font-size: 10px; }
}
@media(max-height: 500px) { .ar-top { height: 34px; }.ar-shell { height: calc(100dvh - 34px); }.ar-hud { padding: 3px 10px; }.ar-controls > div, .ar-controls > button { min-height: 44px; padding: 4px; }.ar-controls span { font-size: 9px; } }
@media(max-height: 500px) and (min-width: 600px) {
    .arena-game .ar-choices button[data-weapon="summoner"] b {background-position:-256px -264px;}
    .arena-game .ar-choices button[data-weapon="engineer"] b {background-position:-256px -584px;}
    .arena-game .ar-choices button[data-weapon="alchemist"] b {background-position:-256px -392px;}
    .arena-game .ar-choices button[data-weapon="shadow"] b {background-position:-256px -456px;}
    .arena-game .ar-choices button[data-weapon="druid"] b {background-position:-256px -392px;}
    .arena-game .ar-choices button[data-weapon="oracle"] b {background-position:-256px -136px;}
    .arena-game .ar-choices button[data-weapon="ranger"] b {background-position:-256px -8px;}
    .arena-game .ar-choices button[data-weapon="frostMage"] b {background-position:-256px -264px;}
    .arena-game .ar-choices button[data-weapon="warden"] b {background-position:-256px -584px;}
    .ar-overlay { padding: 6px; }
    .ar-choice-panel, .ar-choice-panel:has(.ar-class-choices) { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.4fr); column-gap: 12px; padding: 10px; }
    .ar-choice-panel > p:first-child { grid-column: 1; grid-row: 1; font-size: 9px; letter-spacing: 1px; margin: 0; }
    .ar-choice-panel h1 { grid-column: 1; grid-row: 2; font-size: 25px; margin: 2px 0; }
    .ar-choice-panel > p:not(:first-child) { grid-column: 1; grid-row: 3; font-size: 10px; margin: 2px 0; }
    .ar-choices { grid-column: 2; grid-row: 1/4; margin: 0; gap: 6px; grid-template-columns: repeat(3,minmax(0,1fr)); }
    .arena-game .ar-choice-actions {grid-column:1;grid-row:4;}
    .ar-choices button { padding: 6px; gap: 4px; min-height: 90px; }.ar-choices button strong { font-size: 12px; }.ar-choices button span { font-size: 10px; line-height: 1.35; }.ar-choices button b { font-size: 21px; }
    .ar-difficulty select { min-height: 28px; padding-top: 2px; padding-bottom: 2px; }
    .ar-choices button[data-weapon] b { width: 32px; height: 56px; font-size: 0; background-size: 1024px 1024px; }
    .ar-choices button[data-weapon="ember"] b { background-position: -256px -328px; }
    .ar-choices button[data-weapon="bow"] b { background-position: -256px -72px; }
    .ar-choices button[data-weapon="blade"] b { background-position: -256px -200px; }
}
.ar-choices .ar-evolution-hint { display: block; color: #ecd99e; font-size: 11px; line-height: 1.45; word-break: keep-all; }
.arena-game .ar-evolution-goals { padding: 12px; border: 1px solid #776844; border-radius: 8px; background: #203127; }
.arena-game .ar-evolution-goals h3 { margin: 0 0 8px; color: #ecd99e; font-size: 15px; }
.arena-game .ar-evolution-goals p { margin: 8px 0; }
.arena-game .ar-evolution-goals strong, .arena-game .ar-evolution-goals span { display: block; }
.arena-game .ar-evolution-goals span { color: #d0d7c1; font-size: 12px; }
.arena-game .ar-evolution-notice { position: absolute; top: 52px; left: 50%; transform: translateX(-50%); z-index: 5; width: max-content; max-width: calc(100% - 24px); padding: 12px 18px; border: 1px solid #f2d284; border-radius: 8px; background: #26382af2; color: #ffedb2; text-align: center; font-weight: 800; pointer-events: none; box-shadow: 0 4px 18px #0006; }
.arena-game .ar-build-capacity { padding: 10px; border: 1px solid #596d53; border-radius: 8px; color: #e9dca7; }
.arena-game .ar-build-group h3 { margin: 14px 0 8px; font-size: 15px; }
.arena-game .ar-build-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.arena-game .ar-build-card { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 5px 8px; padding: 10px; border: 1px solid; border-radius: 8px; background: #243329; }
.arena-game .ar-build-card b { grid-row: span 3; }
.arena-game .ar-build-card strong { font-size: 13px; }
.arena-game .ar-build-card span, .arena-game .ar-build-card small { grid-column: 2; color: #d3d9c5; font-size: 11px; }
@media(max-width:480px){.arena-game .ar-build-grid { grid-template-columns: minmax(0,1fr); }}
.arena-game .ar-run-recap { grid-column: 1/-1; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; text-align: left; }
.arena-game .ar-run-recap>div { padding: 10px; border: 1px solid #687450; border-radius: 8px; background: #17291fe8; }
.arena-game .ar-run-recap small, .arena-game .ar-run-recap strong { display: block; }
.arena-game .ar-run-recap small { color: #b8c6ac; font-size: 11px; }
.arena-game .ar-run-recap strong { color: #f1dfa5; font-size: 14px; }
.arena-game .ar-choices.ar-result-choices { grid-template-columns: repeat(2,minmax(0,1fr)); }
.arena-game .ar-result-choices>button { grid-column: auto; min-height: 46px; display: flex; flex-direction: row; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; padding: 10px; }
.arena-game .ar-result-choices>button b { width: 24px; height: 24px; font-size: 22px; margin: 0; }
.arena-game .ar-result-choices>button strong { margin: 0; }
.arena-game .ar-upgrade-overlay .ar-choice-panel { padding: 16px; }
.arena-game .ar-upgrade-overlay h1 { font-size: clamp(22px,3vw,30px); margin: 4px 0; }
.arena-game .ar-upgrade-overlay .ar-choice-panel>p { margin: 6px 0; }
.arena-game .ar-upgrade-overlay .ar-choices { margin-top: 12px; }
.arena-game .ar-upgrade-choice { text-align: left; align-items: flex-start; justify-content: flex-start; min-height: 190px; padding: 14px; gap: 7px; }
.arena-game .ar-upgrade-choice strong { font-size: 21px; line-height: 1.3; }
.arena-game .ar-upgrade-choice>span { color: #eef1e4; font-size: 15px; line-height: 1.65; white-space: pre-line; word-break: keep-all; }
.arena-game .ar-upgrade-choice .ar-choice-kind { color: #b9c9bd; font-size: 12px; }
.arena-game .ar-upgrade-choice .ar-rarity { font-size: 12px; }
.arena-game .ar-upgrade-choice .ar-evolution-hint { font-size: 12px; line-height: 1.4; }
.arena-game .ar-codex-entry { border: 1px solid #657761; border-radius: 8px; padding: 12px; margin: 10px 0; background: #14251f; }
.arena-game .ar-codex-entry summary { cursor: pointer; color: #ffe7aa; font-weight: 700; }
.arena-game .ar-codex-entry p { color: #d7e0d2; line-height: 1.7; word-break: keep-all; }
.arena-game .ar-screen-status { position: fixed; right: 8px; top: 45px; z-index: 20; max-width: calc(100vw - 16px); margin: 0; padding: 5px 10px; border: 1px solid #967c4c; border-radius: 6px; background: #142722ed; color: #ffe4a5; font-size: 11px; pointer-events: none; }
.arena-game .ar-screen-status:empty { display: none; }
@media(orientation:landscape){.arena-game .ar-screen-status { display: none; }}
@media(orientation:portrait) and (max-width:680px){.arena-game .ar-shell { padding-top: 32px; }}
@media(orientation:landscape) and (max-height:500px){
  .arena-game .ar-top { padding-left: max(8px,env(safe-area-inset-left)); padding-right: max(8px,env(safe-area-inset-right)); }
  .arena-game .ar-overlay { position: fixed; top: 34px; bottom: 0; z-index: 30; padding: 6px max(8px,env(safe-area-inset-right)) 6px max(8px,env(safe-area-inset-left)); }
  .arena-game .ar-upgrade-overlay .ar-choice-panel { padding: 8px 12px; }
  .arena-game .ar-upgrade-overlay h1 { font-size: 22px; }
  .arena-game .ar-upgrade-overlay .ar-choice-panel>p { margin: 3px 0; font-size: 10px; }
  .arena-game .ar-upgrade-overlay .ar-choices { grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 8px; gap: 8px; }
  .arena-game .ar-upgrade-choice { min-height: 0; padding: 10px; gap: 3px; }
  .arena-game .ar-upgrade-choice>b { display: none; }
  .arena-game .ar-upgrade-choice strong { font-size: 17px; }
  .arena-game .ar-upgrade-choice>span { font-size: 13px; line-height: 1.5; }
  .arena-game .ar-choice-actions { margin-top: 8px; gap: 5px; }
  .arena-game .ar-choice-actions>details { padding: 5px 8px; }
}
@media(max-width:600px){.arena-game .ar-upgrade-overlay .ar-choices { grid-template-columns: 1fr; gap: 8px; }.arena-game .ar-upgrade-overlay .ar-choice-panel { padding: 12px; }.arena-game .ar-upgrade-choice { min-height: 0; padding: 10px; gap: 3px; }.arena-game .ar-upgrade-choice>b { display: none; }.arena-game .ar-upgrade-choice strong { font-size: 17px; }.arena-game .ar-upgrade-choice>span { font-size: 13px; }.arena-game .ar-result-choices { grid-template-columns: 1fr; }}

/* Expedition preparation and the battlefield have distinct visual roles. */
.arena-game .ar-shell { position: relative; padding: 8px; }
.arena-game .ar-field { border-width: 1px; border-radius: 8px; }
.arena-game .ar-hud {
  position: absolute; top: 22px; left: 22px; z-index: 1;
  width: min(490px,calc(100% - 44px)); grid-template-columns: minmax(130px,1.8fr) 1fr .65fr 1fr;
  gap: 12px; padding: 9px 14px; border-color: #78907677; border-radius: 8px;
  background: linear-gradient(110deg,#102722ed,#111e26ed); box-shadow: 0 4px 20px #0005;
  pointer-events: none;
}
.arena-game .ar-hud span { color: #adc3b4; font-size: 10px; }
.arena-game .ar-hud strong { font-size: 19px; }
.arena-game .ar-vital-caption { display: grid; justify-items: start; gap: 2px; line-height: 1; }
.arena-game .ar-hud .ar-difficulty-badge { padding: 2px 5px; border: 1px solid #a98c4e; border-radius: 3px; background: #51472b; color: #ffe6a5; font-size: 9px; font-weight: 750; white-space: nowrap; }
.arena-game #ar-dialog[data-menu-group="options"] { border-color: #86afae; }
.arena-game #ar-dialog[data-menu-group="options"] .ar-menu-tabs button[aria-pressed="true"] { background: #345553; border-color: #a2d6cf; color: #e4fff5; }
.arena-game .ar-xp { top: 82px; bottom: auto; left: 14px; right: auto; width: 260px; padding: 4px 9px; border: 0; background: #10211bbf; }
.arena-game .ar-loadout { left: 16px; bottom: 20px; gap: 6px; }
.arena-game .ar-slot { width: 44px; height: 44px; border-radius: 6px; }
.arena-game .ar-controls { position: absolute; z-index: 1; right: 24px; bottom: 24px; width: min(350px,40%); grid-template-columns: 1fr 1fr; gap: 8px; }
.arena-game .ar-controls > div { display: none; }
.arena-game .ar-controls > button { min-height: 62px; border-radius: 8px; padding: 8px; }
.arena-game .ar-controls button strong { font-size: 14px; }
.arena-game .ar-controls button span { font-size: 10px; }
.arena-game .ar-banner { top: 110px; border: 0; background: #0b171bca; }
.arena-game .ar-goal { bottom: 18px; width: min(280px,27%); border: 0; background: #0b171bb3; }
.arena-game .ar-boss { top: 14px; right: 14px; left: auto; transform: none; width: min(360px,36%); border-radius: 8px; padding: 10px 14px; }
.arena-game .ar-boss.ar-enraged { border-color: #ff765d; box-shadow: 0 0 20px #f45d3433; }
.arena-game .ar-touch-hint { bottom: 126px; }
.arena-game .ar-screen-status { display: none; }
.arena-game.ar-preparing .ar-shell { padding: 0; }
.arena-game.ar-preparing .ar-field { border: 0; border-radius: 0; }
.arena-game.ar-preparing .ar-hud,
.arena-game.ar-preparing .ar-controls,
.arena-game.ar-preparing .ar-banner,
.arena-game.ar-preparing .ar-goal,
.arena-game.ar-preparing .ar-touch-hint,
.arena-game.ar-preparing .ar-loadout,
.arena-game.ar-preparing .ar-xp { display: none; }
.arena-game .ar-preparation {
  padding: 30px; backdrop-filter: none;
  background: radial-gradient(ellipse at 24% 50%,#94703738,transparent 48%),linear-gradient(135deg,#102624f7,#080e19f7);
}
.arena-game .ar-preparation::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .32;
  background: repeating-linear-gradient(100deg,transparent 0 80px,#030b10 81px 94px,transparent 95px 180px);
  mask-image: linear-gradient(transparent,#000);
}
.arena-game .ar-preparation .ar-choice-panel {
  position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr);
  gap: 16px 32px; width: min(1060px,100%); padding: 28px 36px; text-align: left;
  background: linear-gradient(135deg,#172c27e8,#111a26ed); border: 1px solid #8d79504d;
  box-shadow: 0 24px 90px #0007; border-radius: 12px;
}
.arena-game .ar-preparation #ar-kicker { grid-column: 1/-1; margin: 0; font-size: 10px; letter-spacing: .24em; color: #d7b873; }
.arena-game .ar-preparation #ar-title { grid-column: 1/-1; margin: 0; font: 700 clamp(34px,5vw,58px)/1.15 Georgia,serif; letter-spacing: -.05em; }
.arena-game .ar-preparation .ar-choice-panel #ar-description { grid-column: 1/-1; display: block; margin: 0 0 4px; color: #b5c8be; font-size: 13px; }
.arena-game .ar-prep-hero { grid-column: 1; grid-row: 4/6; display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 18px; min-width: 0; }
.arena-game .ar-prep-portrait {
  position: relative; height: 160px; flex: 0 0 110px; display: grid; place-items: center; overflow: hidden;
  background: radial-gradient(ellipse at 50% 80%,#e9b15c44,transparent 62%); border-bottom: 1px solid #d7b87333;
}
.arena-game .ar-prep-portrait::before { content: ''; position: absolute; left: 50%; bottom: 14px; width: 100px; height: 24px; transform: translateX(-50%); border: 1px solid #e8c78066; border-radius: 50%; box-shadow: 0 0 32px #e9b15c33; }
.arena-game .ar-prep-portrait::after { content: '✦'; position: absolute; right: 0; top: 20%; font-size: 26px; color: #ffda8b; text-shadow: 0 0 22px #ffa540; }
.arena-game .ar-prep-portrait > b {
  position: relative; display: block; width: 64px; height: 112px;
  background-image: url('/static/ai/ember-route/assets/0x72/0x72_DungeonTilesetII_v1.7.png');
  background-size: 2048px 2048px; image-rendering: pixelated; font-size: 0; filter: drop-shadow(0 8px 5px #0008);
}
.arena-game .ar-prep-portrait[data-weapon="ember"] > b { background-position: -512px -656px; }
.arena-game .ar-prep-portrait[data-weapon="bow"] > b { background-position: -512px -144px; }
.arena-game .ar-prep-portrait[data-weapon="blade"] > b { background-position: -512px -400px; }
.arena-game .ar-prep-portrait[data-weapon="frostMage"] > b { background-position: -512px -528px; }
.arena-game .ar-prep-portrait[data-weapon="warden"] > b { background-position: -512px -1168px; }
.arena-game .ar-prep-portrait[data-weapon="shadow"] > b { background-position: -512px -912px; }
.arena-game .ar-prep-portrait[data-weapon="druid"] > b { background-position: -512px -784px; }
.arena-game .ar-prep-portrait[data-weapon="oracle"] > b { background-position: -512px -272px; }
.arena-game .ar-prep-portrait[data-weapon="ranger"] > b { background-position: -512px -16px; }
.arena-game .ar-prep-portrait[data-weapon="summoner"] > b { background-position: -512px -528px; filter: hue-rotate(45deg) drop-shadow(0 8px 5px #0008); }
.arena-game .ar-prep-portrait[data-weapon="engineer"] > b { background-position: -512px -1168px; filter: hue-rotate(150deg) drop-shadow(0 8px 5px #0008); }
.arena-game .ar-prep-portrait[data-weapon="alchemist"] > b { background-position: -512px -784px; filter: hue-rotate(35deg) drop-shadow(0 8px 5px #0008); }
.arena-game .ar-prep-copy { min-width: 0; }
.arena-game #ar-prep-name { display: block; margin: 0; font-size: 25px; color: #ffdf9f; }
.arena-game #ar-prep-detail { margin: 5px 0 12px; color: #c2d1c7; font-size: 13px; }
.arena-game .ar-prep-active { margin: 8px 0; color: #f2d195; font-size: 12px; }
.arena-game .ar-prep-stats { display: flex; gap: 14px; color: #bad1c5; font-size: 12px; }
.arena-game .ar-prep-starter { display: flex; align-items: center; gap: 8px; margin: 10px 0; padding: 8px 10px; background: #08171077; border-radius: 6px; font-size: 12px; }
.arena-game .ar-prep-status { margin: 6px 0 0; font-size: 11px; color: #c0b389; }
.arena-game .ar-prep-skill-list { display: flex; flex-wrap: wrap; gap: 6px; }
.arena-game .ar-prep-skill-list > * { font-size: 10px; color: #b4c8bf; padding: 3px 6px; border: 1px solid #526f5e66; border-radius: 4px; }
.arena-game .ar-prep-settings { grid-column: 2; grid-row: 4; display: flex; gap: 12px; align-items: end; }
.arena-game .ar-prep-settings .ar-difficulty { flex: 1; display: grid; gap: 6px; font-size: 11px; }
.arena-game .ar-prep-settings select { margin: 0; width: 100%; min-height: 40px; background: #0d201c; border-color: #65734f; border-radius: 6px; }
.arena-game .ar-preparation .ar-choices { grid-column: 2; grid-row: 5; margin: 0; align-self: start; gap: 8px; }
.arena-game .ar-preparation .ar-choices button[data-weapon] { min-height: 190px; padding: 14px 8px; border: 1px solid #69857266; border-top-width: 3px; border-radius: 8px; background: #11251fe6; }
.arena-game .ar-preparation .ar-choices button strong { font-size: 14px; }
.arena-game .ar-preparation .ar-choices button span { font-size: 11px; }
.arena-game .ar-preparation .ar-choices .ar-class-selected { border-color: #f0cc81; background: linear-gradient(#34402a,#172b23); box-shadow: inset 0 0 0 1px #f0cc8155,0 0 20px #c7a65b22; }
.arena-game .ar-preparation .ar-choice-actions { grid-column: 1/-1; grid-row: 6; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; border-top: 1px solid #8d795033; padding-top: 16px; margin: 0; }
.arena-game .ar-preparation .ar-choice-actions > button { margin: 0; min-height: 36px; }
.arena-game .ar-preparation .ar-choice-actions > .ar-expedition-start { margin-left: auto; padding: 13px 30px; min-height: 48px; font-size: 17px; font-weight: 800; color: #ffedbe; border-color: #dab46b; background: linear-gradient(135deg,#806039,#493322); box-shadow: 0 4px 20px #0005; }
.arena-game .ar-upgrade-choice .ar-synergy-hint { color: #a4e7ca; font-size: 12px; line-height: 1.5; }
.arena-game .ar-story { width: min(680px,calc(100vw - 24px)); max-height: 85dvh; overflow: auto; padding: 32px; background: linear-gradient(145deg,#122827,#171b26); color: #f8ebc9; border: 1px solid #b89b55; border-radius: 14px; box-shadow: 0 24px 80px #000b; }
.arena-game .ar-story::backdrop { background: #071210bd; backdrop-filter: blur(3px); }
.arena-game .ar-story h2 { margin: 12px 0 24px; font-size: clamp(24px,5vw,36px); color: #ffdb95; }
.arena-game .ar-story p { min-height: 150px; white-space: pre-line; line-height: 1.9; word-break: keep-all; font-size: 17px; }
.arena-game .ar-story small { letter-spacing: .14em; color: #b7ae89; }
.arena-game .ar-story div { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 24px; }
.arena-game .ar-story button { padding: 12px 18px; border: 1px solid #b89b55; border-radius: 6px; background: #324334; color: #fff1cb; }
@media(max-width:1000px) {
  .arena-game .ar-boss { top: 114px; left: 50%; right: auto; transform: translateX(-50%); width: min(340px,80%); }
  .arena-game .ar-field:has(.ar-boss:not([hidden])) .ar-banner { display: none; }
  .arena-game .ar-goal { bottom: 100px; width: min(280px,80%); }
}
@media(max-width:680px) {
  .arena-game .ar-shell { padding: 4px; }
  .arena-game .ar-hud { top: 12px; left: 12px; width: calc(100% - 24px); padding: 7px 9px; gap: 8px; }
  .arena-game .ar-hud strong { font-size: 15px; }
  .arena-game .ar-hud span { font-size: 9px; }
  .arena-game .ar-xp { top: 69px; left: 10px; width: min(240px,65%); }
  .arena-game .ar-controls { right: 14px; bottom: 14px; width: 52%; gap: 6px; }
  .arena-game .ar-controls > button { min-height: 56px; padding: 6px 3px; }
  .arena-game .ar-controls button strong { font-size: 12px; }
  .arena-game .ar-controls button span { font-size: 9px; }
  .arena-game .ar-loadout { bottom: 16px; left: 10px; }
  .arena-game .ar-slot { width: 32px; height: 32px; }
  .arena-game .ar-slot .ar-pixel-icon { transform: scale(.6); }
  .arena-game .ar-slot span { font-size: 8px; }
  .arena-game .ar-goal { bottom: 92px; }
  .arena-game .ar-preparation { padding: 12px; }
  .arena-game .ar-preparation .ar-choice-panel { display: grid; grid-template-columns: 1fr; gap: 6px; padding: 12px; border-radius: 10px; }
  .arena-game .ar-preparation #ar-title { font-size: 32px; }
  .arena-game .ar-preparation #ar-kicker { font-size: 9px; }
  .arena-game .ar-preparation .ar-choice-panel #ar-description { font-size: 10px; }
  .arena-game .ar-prep-hero { grid-column: 1; grid-row: auto; flex-direction: row; gap: 10px; align-items: center; }
  .arena-game .ar-prep-portrait { flex: 0 0 84px; height: 112px; border: 0; }
  .arena-game .ar-prep-portrait > b { transform: scale(.8); }
  .arena-game .ar-prep-portrait::after { right: 0; font-size: 20px; }
  .arena-game .ar-prep-portrait::before { width: 76px; }
  .arena-game #ar-prep-name { font-size: 21px; }
  .arena-game #ar-prep-detail { font-size: 11px; margin: 3px 0 5px; }
  .arena-game .ar-prep-active { font-size: 10px; margin: 4px 0; }
  .arena-game .ar-prep-stats { gap: 8px; font-size: 10px; flex-wrap: wrap; }
  .arena-game .ar-prep-starter { font-size: 10px; padding: 3px 6px; margin: 5px 0; }
  .arena-game .ar-prep-starter .ar-pixel-icon { width: 20px; height: 20px; }
  .arena-game .ar-prep-skill-list { display: none; }
  .arena-game .ar-prep-status { display: none; }
  .arena-game .ar-prep-settings { grid-column: 1; grid-row: auto; gap: 8px; }
  .arena-game .ar-prep-settings select { min-height: 34px; font-size: 11px; }
  .arena-game .ar-preparation .ar-choices { grid-column: 1; grid-row: auto; gap: 6px; }
  .arena-game .ar-preparation .ar-choices button[data-weapon] { min-height: 116px; padding: 6px 4px; gap: 4px; }
  .arena-game .ar-preparation .ar-choices button strong { font-size: 12px; }
  .arena-game .ar-preparation .ar-choices button span { font-size: 9px; }
  .arena-game .ar-preparation .ar-choice-actions { grid-row: auto; padding-top: 10px; gap: 4px; }
  .arena-game .ar-preparation .ar-choice-actions > button { font-size: 10px; padding: 4px 8px; min-height: 30px; }
  .arena-game .ar-preparation .ar-choice-actions > span { font-size: 10px; padding: 3px; }
  .arena-game .ar-preparation .ar-choice-actions > .ar-expedition-start { width: 100%; margin: 6px 0 0; min-height: 44px; padding: 8px; font-size: 16px; }
  .arena-game .ar-prep-hint { display: none; }
  .arena-game .ar-story { padding: 20px; }
}
@media(orientation:landscape) and (max-height:500px) {
  .arena-game .ar-hud { top: 10px; left: 12px; padding: 4px 9px; width: min(450px,58%); }
  .arena-game .ar-hud strong { font-size: 14px; }
  .arena-game .ar-xp { top: 55px; }
  .arena-game .ar-controls { bottom: 12px; right: 16px; width: 30%; }
  .arena-game .ar-controls > button { min-height: 44px; padding: 4px; }
  .arena-game .ar-loadout { bottom: 10px; }
  .arena-game .ar-goal { bottom: 10px; width: 28%; }
  .arena-game .ar-boss { top: 10px; left: auto; right: 12px; transform: none; width: 34%; padding: 5px 10px; }
  .arena-game .ar-banner { top: 75px; }
  .arena-game .ar-preparation { padding: 8px 16px; }
  .arena-game .ar-preparation .ar-choice-panel { grid-template-columns: minmax(0,1fr) minmax(0,1.25fr); gap: 4px 18px; padding: 12px 18px; }
  .arena-game .ar-preparation #ar-kicker { grid-column: 1; grid-row: 1; }
  .arena-game .ar-preparation #ar-title { grid-column: 1; grid-row: 2; font-size: 30px; }
  .arena-game .ar-preparation .ar-choice-panel #ar-description { grid-column: 1; grid-row: 3; font-size: 10px; }
  .arena-game .ar-prep-hero { grid-column: 1; grid-row: 4/6; flex-direction: row; gap: 8px; }
  .arena-game .ar-prep-portrait { flex: 0 0 60px; height: 120px; }
  .arena-game .ar-prep-portrait > b { transform: scale(.7); }
  .arena-game #ar-prep-name { font-size: 18px; }
  .arena-game #ar-prep-detail { font-size: 10px; }
  .arena-game .ar-prep-stats { font-size: 9px; gap: 8px; flex-wrap: wrap; }
  .arena-game .ar-prep-active { font-size: 10px; }
  .arena-game .ar-prep-skill-list { display: none; }
  .arena-game .ar-prep-settings { grid-column: 2; grid-row: 1/3; }
  .arena-game .ar-prep-settings select { min-height: 30px; }
  .arena-game .ar-preparation .ar-choices { grid-column: 2; grid-row: 3/6; }
  .arena-game .ar-preparation .ar-choices button[data-weapon] { min-height: 125px; padding: 8px 5px; gap: 4px; }
  .arena-game .ar-preparation .ar-choices button strong { font-size: 12px; }
  .arena-game .ar-preparation .ar-choices button span { font-size: 10px; }
  .arena-game .ar-preparation .ar-choice-actions { grid-row: 6; padding-top: 8px; gap: 4px; }
  .arena-game .ar-preparation .ar-choice-actions > .ar-expedition-start { width: auto; margin-left: auto; min-height: 36px; padding: 6px 20px; font-size: 14px; }
}