html,body{overscroll-behavior:none}button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}#world,#touch{touch-action:none}#joystick{position:relative;width:180px;height:166px;flex-shrink:0;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#stick-base{position:absolute;left:var(--stick-origin-x,50%);top:var(--stick-origin-y,50%);width:112px;height:112px;transform:translate(-50%,-50%);border:2px solid #c9c39780;border-radius:50%;background:radial-gradient(circle,#1b3430aa 0 34%,#0a222799 35% 68%,#c7c09644 69% 70%,#10282baa 71%);box-shadow:0 4px 16px #0004;pointer-events:none}
#stick-nub{position:absolute;left:calc(50% - 28px);top:calc(50% - 28px);width:56px;height:56px;border-radius:50%;border:3px solid #adbd95;background:radial-gradient(circle at 35% 25%,#768968,#2e514d);box-shadow:0 4px #071f27a6;transform:translate(var(--stick-x,0px),var(--stick-y,0px));pointer-events:none;z-index:2}
#joystick.engaged #stick-base{border-color:#dce6b3;box-shadow:0 0 0 4px #b6c79818,0 4px 16px #0004}
.stick-label{position:absolute;bottom:0;left:0;right:0;text-align:center;color:#d0d7b3;font:12px ui-monospace,monospace;letter-spacing:.12em;pointer-events:none}
#joystick.engaged .stick-label{opacity:0}
.touch-actions{position:relative;width:172px;height:140px}.touch-actions button{position:absolute;text-align:center;padding:0;border:2px solid #c6bc86;box-shadow:0 4px #071c22a8;font:13px Georgia,serif;user-select:none;touch-action:none}.touch-actions #touch-attack{width:80px;height:80px;bottom:0;right:0;background:#516440;border-radius:50%;display:grid;place-content:center;gap:4px}.touch-actions #touch-dash{width:62px;height:62px;bottom:6px;left:8px;background:#233f48;border-radius:50%}.touch-actions #touch-interact{width:60px;height:52px;top:0;right:19px;background:#3a4143;border-radius:16px}.touch-actions button.pressed{filter:brightness(1.4);transform:translateY(2px)}.touch-actions img{width:27px;height:27px;image-rendering:pixelated;margin:auto}.touch-mode#game-shell{width:100vw;height:100dvh;height:var(--viewport-height,100dvh);max-height:100dvh}.touch-mode #world{object-fit:cover}.touch-mode #touch{position:absolute;inset:auto max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));display:flex;justify-content:space-between;align-items:end;pointer-events:none;z-index:5}.touch-mode #touch>*{pointer-events:auto}.touch-mode #hud{top:max(8px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));gap:8px}.touch-mode .vitals{width:27%;min-width:135px;padding:6px 9px}.touch-mode #hero-name{font-size:12px}.touch-mode .room-heading{max-width:42%;padding:0}.touch-mode .room-heading strong{font-size:18px}.touch-mode #act-text{font-size:9px}.touch-mode .room-heading small{font-size:10px}.touch-mode .wallet{padding:3px;border:0;background:none}.touch-mode .wallet>span{display:none}.touch-mode #pause-button{min-height:44px;font-size:12px;padding:8px}.touch-mode #combat-bar{bottom:max(10px,env(safe-area-inset-bottom));left:185px;right:200px;justify-content:center;z-index:5}.touch-mode .basic-controls{display:none}.touch-mode .skills{display:grid;width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.touch-mode .skills button{height:49px;min-height:49px;padding:4px;border-width:1px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0}.touch-mode .skills button kbd{display:none}.touch-mode .skills button>img,.touch-mode .skills button>.rift-icon{display:none}.touch-mode .skills button>span:not(.rift-icon){font-size:10px;line-height:1.15;max-width:100%;white-space:normal;text-align:center}.touch-mode .skills button>b{font-size:8px;line-height:1.2}.touch-mode .skills #build-button{font-size:11px}.touch-mode #contract-hud,.touch-mode #story-goal{display:none}.touch-mode #boss-hud{top:85px;left:28%;width:44%}.touch-mode #toast{left:18%;right:18%;bottom:160px;font-size:12px;padding:8px}.touch-mode #room-ribbon{top:30%;left:10%;right:10%;font-size:25px}.touch-mode #overlay{padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}.touch-mode #panel{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding:20px;max-height:100%;font-size:15px}.touch-mode #panel::-webkit-scrollbar{display:none}.touch-mode #overlay.home #panel{width:min(440px,100%);max-width:100%;padding:20px}.touch-mode #panel .logo{font-size:38px}.touch-mode .eyebrow{font-size:11px}.touch-mode .online-toast{top:86px;right:12px;font-size:10px}.touch-mode #connection-status{bottom:135px;max-width:95%;white-space:normal;text-align:center}.touch-mode .roster-choices{grid-template-columns:repeat(4,minmax(0,1fr))}.touch-mode .roster-card{padding:5px;grid-template-columns:42px 1fr}.touch-mode .roster-card canvas{width:42px;height:55px}.touch-mode .roster-card strong{font-size:12px}.touch-mode .roster-card small{font-size:9px}.touch-mode .roster-card kbd{display:none}.touch-mode .roster-abilities{grid-template-columns:repeat(2,1fr)}
@media(orientation:portrait){.touch-mode #world{top:85px;bottom:137px;height:calc(100% - 222px)}.touch-mode #touch{bottom:calc(139px + env(safe-area-inset-bottom))}.touch-mode .touch-actions{transform:scale(.9);transform-origin:bottom right}.touch-mode #combat-bar{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom))}.touch-mode .skills{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.touch-mode .skills button{height:52px;min-height:52px}.touch-mode .skills button>span:not(.rift-icon){font-size:11px}.touch-mode #hud{align-items:start}.touch-mode .vitals{width:48%;min-width:0}.touch-mode .room-heading{position:absolute;top:59px;left:0;right:0;max-width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;background:#0b2027e8;padding:7px 9px}.touch-mode .room-heading strong{font-size:13px}.touch-mode .room-heading small{display:none}.touch-mode .room-heading #act-text{font-size:10px}.touch-mode .wallet{margin-left:auto}.touch-mode #boss-hud{top:112px;left:16%;width:68%}.touch-mode #toast{bottom:292px;left:5%;right:5%;font-size:12px}.touch-mode #room-ribbon{top:24%;font-size:24px}.touch-mode #connection-status{bottom:268px}.touch-mode .online-toast{top:150px;right:12px;max-width:200px}.touch-mode #overlay.home{place-items:center;background:linear-gradient(#091e26b0,#091e26eb)}.touch-mode #overlay.home #panel{background:#0e2529d9;border:1px solid #a79a6550}.touch-mode .roster-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.touch-mode .roster-card{min-height:62px}.touch-mode h2{font-size:26px}.touch-mode .choices{grid-template-columns:1fr;gap:10px}.touch-mode .choice-card{min-height:0;padding:14px;display:grid;grid-template-columns:56px 1fr;column-gap:12px}.touch-mode .choice-card .upgrade-icon{grid-row:1/4;width:50px;height:58px}.touch-mode .choice-card strong{font-size:19px;margin:0}.touch-mode .choice-card small{margin:4px 0;font-size:12px}.touch-mode .choice-card .tag{margin:5px 0 0}.touch-mode .guide-grid,.touch-mode .story-opening{grid-template-columns:1fr}.touch-mode .story-portrait{display:none}.touch-mode .champion-detail{display:block}.touch-mode .champion-detail button{width:100%}.touch-mode .stats-row{grid-template-columns:repeat(2,1fr)}.touch-mode .dialogue-scene{grid-template-columns:76px 1fr}.touch-mode .dialogue-portrait canvas{width:76px;height:100px}.touch-mode #panel p{line-height:1.5}.touch-mode .ember-seals{display:none}.touch-mode .online-modes button{min-height:68px}}
@media(orientation:landscape) and (max-height:500px){.touch-mode #hud .room-heading small{display:none}.touch-mode .vitals{padding:4px 8px}.touch-mode #hero-name{font-size:11px}.touch-mode .touch-actions{transform:scale(.82);transform-origin:bottom right}.touch-mode #combat-bar{left:150px;right:169px;bottom:10px}.touch-mode .skills button{height:43px;min-height:43px}.touch-mode #panel{padding:14px 20px}.touch-mode #overlay.home .menu-stack{gap:5px}.touch-mode #overlay.home .title-copy{margin-bottom:10px;font-size:13px}.touch-mode #overlay.home .logo{font-size:30px;margin:7px 0}.touch-mode #overlay.home .menu-stack button{min-height:39px;font-size:15px}.touch-mode .home-footer{margin-top:10px}.touch-mode .profile-line{font-size:10px}.touch-mode .online-columns{grid-template-columns:1fr 1fr}.touch-mode .online-intro{padding-bottom:7px;margin-bottom:8px}.touch-mode #boss-hud{top:65px}.touch-mode .online-toast{top:65px}.touch-mode #connection-status{bottom:111px}}

#mobile-map{display:none;position:absolute;top:150px;left:max(12px,env(safe-area-inset-left));width:104px;height:59px;z-index:3;border:1px solid #b7b38d77;image-rendering:pixelated;pointer-events:none}@media(orientation:portrait){.touch-mode #mobile-map{display:block}}

.touch-mode .skills button{touch-action:none;-webkit-touch-callout:none}.touch-mode .skills button.pressed{filter:brightness(1.3);transform:translateY(2px)}.touch-actions #touch-interact.reviving{border-color:#a2e0bd;background:#375b48;font-size:11px;box-shadow:0 0 16px #95deaa44}.touch-actions #touch-dash.cooling{opacity:.65}

/* Keep the named combat controls readable at arm's length. */
.touch-mode #panel{font-size:16px}
.touch-mode #panel .note,.touch-mode .account-note{font-size:13px}
.touch-mode #pause-button,.touch-actions button{font-size:14px}
.touch-mode .skills #build-button{display:none}
.touch-mode .skills button{height:60px;min-height:60px}
.touch-mode .skills button>span:not(.rift-icon){font-size:14px;line-height:1.15;overflow-wrap:anywhere}
.touch-mode .skills button>b{font-size:12px;line-height:1.2;font-weight:normal}
.touch-mode .roster-card strong{font-size:14px}
.touch-mode .roster-card small{font-size:12px}
.touch-mode .roster-card{min-height:72px}
.touch-mode #hero-name{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.touch-mode .online-toast{font-size:12px}
@media(orientation:portrait){
 .touch-mode .skills{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .touch-mode .skills button{height:64px;min-height:64px}
 .touch-mode #world{top:94px;bottom:162px;height:calc(100% - 256px)}
 .touch-mode #touch{bottom:calc(166px + env(safe-area-inset-bottom))}
 .touch-mode .room-heading{top:65px}
 .touch-mode .room-heading #act-text{font-size:12px}
 .touch-mode #connection-status{bottom:300px}
 .touch-mode #toast{bottom:320px;font-size:14px}
 .touch-mode .online-modes button{font-size:17px}
 .touch-mode .online-modes small{font-size:13px}
}
@media(orientation:landscape) and (max-height:500px){
 .touch-mode .skills{grid-template-columns:repeat(3,minmax(0,1fr))}
 .touch-mode .skills button{height:53px;min-height:53px}
 .touch-mode .skills button>span:not(.rift-icon){font-size:13px}
 .touch-mode #connection-status{bottom:128px}
}

/* A playable handheld in portrait; the screen and controls have separate space. */
#handheld-housing,#handheld-system{display:none}
.touch-mode.handheld#game-shell{width:var(--pocket-width);height:var(--viewport-height);max-height:none;background:#b4b49e;border:0;border-radius:14px 14px 28px 14px;box-shadow:inset 2px 2px 0 #e3e0c5,inset -3px -4px 0 #687c71,0 8px 40px #0009;--pocket-top:max(0px,calc(env(safe-area-inset-top,0px) - 8px));--pocket-bottom:env(safe-area-inset-bottom,0px);--screen-bottom:calc(var(--pocket-deck) + var(--pocket-bottom) + 14px);--pocket-actions:min(214px,calc((var(--pocket-width) - 32px) / 2))}
.handheld #handheld-housing{display:block;position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(145deg,#d3d0b8 0%,#b9bea7 55%,#99aa96 100%)}
.handheld-brand{position:absolute;top:calc(10px + var(--pocket-top));left:16px;right:16px;display:flex;align-items:center;gap:8px;color:#394e49;font:bold 11px ui-monospace,monospace;letter-spacing:.13em}
.handheld-brand small{margin-left:auto;font-size:10px;letter-spacing:.1em;color:#5d6d5c}
.handheld-brand i{width:7px;height:7px;background:#729c59;border-radius:50%;box-shadow:0 0 0 2px #4f6350,0 0 8px #b6d27d}
.handheld-bezel{position:absolute;top:calc(30px + var(--pocket-top));left:6px;right:6px;bottom:calc(var(--pocket-deck) + var(--pocket-bottom) + 6px);border:6px solid #465750;border-radius:9px 9px 14px 9px;background:#0a2027;box-shadow:0 2px #e0dec2,inset 0 3px 9px #000a}
.handheld-speaker{position:absolute;right:22px;bottom:calc(12px + var(--pocket-bottom));width:40px;height:20px;transform:rotate(-18deg);background:repeating-linear-gradient(90deg,#607a6866 0 3px,transparent 3px 8px)}
.handheld #world{left:12px;right:12px;top:calc(38px + var(--pocket-top));bottom:var(--screen-bottom);width:calc(100% - 24px);height:calc(100% - var(--pocket-deck) - var(--pocket-top) - var(--pocket-bottom) - 52px);object-fit:cover;border-radius:3px;z-index:1}
.handheld.handheld-playing #world{top:calc(90px + var(--pocket-top));height:calc(100% - var(--pocket-deck) - var(--pocket-top) - var(--pocket-bottom) - 104px)}
.handheld #hud{top:calc(38px + var(--pocket-top));left:12px;right:12px;height:50px;gap:8px;padding:3px 6px;background:#0a2027;border:0;border-radius:0;z-index:4;align-items:center}
.handheld .vitals{padding:0;width:43%;min-width:0;border:0;background:none;box-shadow:none}
.handheld #hero-name{font-size:12px;margin-bottom:2px;color:#d6dfc0}
.handheld .vitals .meter{height:14px;margin:3px 0}
.handheld .vitals .meter.energy{height:5px}
.handheld #health-text{font-size:11px;line-height:14px}
.handheld .room-heading{position:static;display:block;flex:1;max-width:57%;padding:0;background:none;text-align:right;min-width:0}
.handheld .room-heading #act-text{font-size:11px;letter-spacing:0;line-height:1.25;max-height:24px;overflow:hidden}
.handheld .room-heading strong{font-size:13px;line-height:1.2;margin:4px 0 0}
.handheld .room-heading small,.handheld .wallet{display:none}
.handheld #touch{left:12px;right:12px;bottom:calc(48px + var(--pocket-bottom));z-index:5}
.handheld #joystick{width:min(200px,calc((var(--pocket-width) - 20px) / 2));height:calc(var(--pocket-deck) - 40px);border:0;background:none;box-shadow:none}
.handheld #stick-base{border:3px solid #6c8271;background:radial-gradient(circle,#5b7563 0 42%,#829780 43% 63%,#9bac9277 64%);box-shadow:inset 0 3px 6px #3c584666,0 1px 0 #dde2c3}
.handheld #stick-nub{border:3px solid #2e4a3e;border-radius:50%;background:radial-gradient(circle at 35% 30%,#7e927b,#405c4c);box-shadow:0 4px 0 #324d3f,inset 0 1px 0 #bdc7a755}
.handheld #joystick.engaged #stick-nub{background:radial-gradient(circle at 35% 30%,#b1c199,#607d60);box-shadow:0 2px 0 #324d3f,inset 0 0 0 2px #dce6b355}
.handheld #joystick.engaged #stick-base{border-color:#526f58;box-shadow:inset 0 3px 6px #3c584666,0 0 0 4px #e1e5bf40}
.stick-direction{display:none}
.handheld .stick-direction{display:block;position:absolute;width:0;height:0;z-index:1;pointer-events:none}
.handheld .stick-up{top:17px;left:calc(50% - 5px);border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:6px solid #aebca0}
.handheld .stick-down{bottom:17px;left:calc(50% - 5px);border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #aebca0}
.handheld .stick-left{left:17px;top:calc(50% - 5px);border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:6px solid #aebca0}
.handheld .stick-right{right:17px;top:calc(50% - 5px);border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:6px solid #aebca0}
.handheld #joystick[data-direction~="up"] .stick-up{border-bottom-color:#fff0bc}
.handheld #joystick[data-direction~="down"] .stick-down{border-top-color:#fff0bc}
.handheld #joystick[data-direction~="left"] .stick-left{border-right-color:#fff0bc}
.handheld #joystick[data-direction~="right"] .stick-right{border-left-color:#fff0bc}
.handheld .stick-label{font-size:12px;font-weight:bold;color:#435b4b}
.handheld .touch-actions{width:var(--pocket-actions);height:60px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:end;transform:none}
.handheld #touch .touch-actions button{position:relative;inset:auto;width:100%;min-width:0;padding:0;border-image:none;font-size:12px;-webkit-touch-callout:none}
.handheld .touch-actions #touch-attack{height:60px;background:#715665;border:3px solid #4c4653;border-radius:24px;box-shadow:0 4px 0 #495447;color:#fff0d1;gap:1px}
.handheld .touch-actions #touch-attack img{width:23px;height:23px}
.handheld .touch-actions #touch-dash{height:54px;background:#506c65;border:3px solid #344c48;border-radius:22px;box-shadow:0 4px 0 #617e68}
.handheld .touch-actions #touch-interact{height:44px;min-height:44px;border:2px solid #536759;border-radius:16px;background:#687c64;color:#f1e6c2}
.handheld #touch .touch-actions #touch-interact.reviving{font-size:10px;line-height:1.05}
.handheld #combat-bar{left:auto;right:12px;bottom:calc(116px + var(--pocket-bottom));width:var(--pocket-actions);max-width:none;padding:0;background:none;border:0;box-shadow:none;z-index:5}
.handheld .skills{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.handheld .skills button{position:relative;height:44px;min-height:44px;padding:2px 1px;border:2px solid #536854;border-image:none;border-radius:10px;background:#6d806a;box-shadow:0 3px 0 #607157;gap:1px;overflow:visible;color:#fff1ca}
.handheld .skills #heal{grid-column:1;grid-row:2}.handheld .skills #surge-button{grid-column:2;grid-row:2}.handheld .skills #rift-button{grid-column:3;grid-row:2}
.handheld .skills button>img,.handheld .skills button>.rift-icon{display:block;position:static;transform:none;width:21px;height:21px;object-fit:contain;margin:0;image-rendering:pixelated}
.handheld .skills button>span:not(.rift-icon),.handheld .skills button>b,.handheld .skills button kbd{display:none}
.handheld .skills button::after{content:attr(data-short);font:12px ui-monospace,monospace;line-height:14px;color:#fff0c5}
.handheld .skills button::before{content:attr(data-cooldown);position:absolute;right:-3px;top:-5px;background:#304b40;border-radius:4px;color:#ffe7ad;font:10px ui-monospace,monospace;padding:1px 2px;z-index:2}
.handheld .skills button[data-cooldown=""]::before{display:none}
.handheld .skills button.cooling{opacity:.58}
.handheld #handheld-system{position:absolute;bottom:calc(8px + var(--pocket-bottom));left:50%;transform:translateX(-50%);display:flex;gap:15px;z-index:5}
.handheld #handheld-system button{min-height:34px;width:57px;border:2px solid #566e5e;border-image:none;border-radius:18px;padding:6px 4px;background:#667f6d;color:#fff0ce;font:bold 12px ui-monospace,monospace;text-align:center;box-shadow:0 3px 0 #71836b;transform:rotate(-9deg)}
.handheld #handheld-system button:active{transform:rotate(-9deg) translateY(2px)}
.handheld #boss-hud{top:calc(97px + var(--pocket-top));left:94px;right:18px;width:auto;z-index:4}
.handheld #mobile-map{top:calc(99px + var(--pocket-top));left:18px;width:66px;height:38px;z-index:3;opacity:.8}
.handheld .online-toast{top:auto;bottom:calc(var(--pocket-deck) + var(--pocket-bottom) + 20px);left:18px;right:18px;max-width:none;font-size:11px;line-height:1.3;padding:4px 6px;z-index:4}
.handheld #connection-status{bottom:calc(var(--pocket-deck) + var(--pocket-bottom) + 64px);max-width:calc(100% - 36px);font-size:11px;z-index:6}
.handheld #toast{bottom:calc(var(--pocket-deck) + var(--pocket-bottom) + 100px);left:18px;right:18px;font-size:12px;z-index:6}
.handheld #room-ribbon{top:35%;left:22px;right:22px;font-size:20px}
.handheld #overlay{inset:calc(38px + var(--pocket-top)) 12px var(--screen-bottom);padding:8px;z-index:8;background:#0a2027ed;backdrop-filter:none}
.handheld #panel,.handheld #overlay.home #panel{width:100%;max-width:100%;padding:13px 10px;border-width:5px;box-shadow:none;font-size:16px}
.handheld #overlay.home #panel{background:transparent;border:0;padding:10px}
.handheld #panel .logo{font-size:clamp(25px,7vw,36px)}
.handheld #panel .title-copy{font-size:15px;margin-bottom:15px}
.handheld .menu-stack{gap:8px}.handheld .menu-stack button{font-size:17px;min-height:48px;padding:8px}
.handheld .home-footer{gap:12px;margin-top:15px;font-size:13px}
.handheld .online-intro h2{font-size:22px}.handheld .online-intro{gap:6px}
.handheld .online-modes{gap:6px}.handheld .online-modes button{font-size:14px;min-height:80px;padding:6px;border-width:5px}
.handheld .online-modes small{font-size:11px}.handheld .account-note{font-size:12px}
.handheld .rank-medal{min-width:86px;min-height:70px;padding:5px}.handheld .rank-medal small{font-size:10px}
.handheld .online-tabs button{font-size:13px}.handheld .online-status{font-size:11px}
@media(min-width:600px) and (orientation:portrait){.handheld #joystick{width:220px}.handheld #touch{left:24px;right:24px}.handheld #combat-bar{right:24px}.handheld .skills button{height:50px;min-height:50px}.handheld .skills button::after{font-size:12px}.handheld #hero-name{font-size:14px}.handheld .room-heading strong{font-size:17px}.handheld .room-heading #act-text{font-size:12px}}

/* Wide screens keep the arena open, with combat controls grouped by each thumb. */
.touch-mode.wide-touch #touch{bottom:max(18px,env(safe-area-inset-bottom))}
.touch-mode.wide-touch #joystick{width:clamp(168px,24vw,220px);height:clamp(148px,35vh,190px)}
.touch-mode.wide-touch #combat-bar{left:auto;right:max(20px,env(safe-area-inset-right));bottom:158px;width:204px;background:#10272b99;padding:5px;border:1px solid #8b987666;border-radius:12px}
.touch-mode.wide-touch .skills{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.touch-mode.wide-touch .skills button{height:48px;min-height:48px;border-radius:8px;border-image:none}
.touch-mode.wide-touch .skills button>span:not(.rift-icon){font-size:11px;max-height:26px;overflow:hidden}
.touch-mode.wide-touch .skills button>b{font-size:10px}
.touch-mode.wide-touch #connection-status{bottom:12px;max-width:40%;font-size:11px}
@media(orientation:landscape) and (max-height:440px){.touch-mode.wide-touch #combat-bar{bottom:137px;width:184px}.touch-mode.wide-touch .skills button{height:44px;min-height:44px}}

@media(max-width:350px){.handheld .skills button::after{font-size:11px}}

/* Keep the stopwatch in the existing casing instead of reducing the arena. */
.handheld-playing .handheld-brand small{visibility:hidden}
.handheld #run-clock{top:-28px;right:4px;padding:0;background:none;font-size:12px;line-height:16px;color:#394e49;text-shadow:none}
.handheld #run-clock time{color:#263e37}
.handheld #chamber-clock{display:none}
.handheld:not(.handheld-playing) #run-clock{display:none}
.wide-touch #run-clock{top:48px;right:0;font-size:12px}
.wide-touch .online-toast{top:90px}
@media(max-height:500px){.wide-touch #chamber-clock{display:none}}
