/* LOGGER II interface foundations. Native text/hit areas; imagegen materials
   are nine-sliced, never stretched as a screenshot of an entire interface. */
#game{
 --ui-font:system-ui,-apple-system,'Noto Sans KR','Malgun Gothic',sans-serif;
 --ui-ink:#eae6db;--ui-muted:#aab2a9;--ui-accent:#d3bd88;
 --ui-line:#a59a7640;--ui-surface:#111915;--ui-inset:#0b120f;
 --ui-body:14px;--ui-meta:12px;--ui-title:22px;--ui-section:16px;
 --ui-space:12px;--ui-pad:22px;--ui-control:40px;--ui-close:36px;
 --ui-frame:url('/public/assets/ui-window-v1.webp');
 --ui-button:url('/public/assets/ui-button-v1.webp');
 --ui-slot:url('/public/assets/ui-slot-v1.webp');
}
#game #modal{font-family:var(--ui-font);color:var(--ui-ink);text-shadow:none;letter-spacing:0;line-height:1.55;font-variant-numeric:tabular-nums}
#game #modal:not([data-kind=npc-dialogue]){
 box-sizing:border-box;display:flex;flex-direction:column;padding:var(--ui-pad);
 /* Component sheets still own their geometry; only the frame material is
    authoritative here, including highly-specific graph/world-map sheets. */
 border:8px solid transparent;border-image:var(--ui-frame) 32 fill / 8px / 0 stretch!important;
 background:var(--ui-surface)!important;border-radius:0;box-shadow:0 18px 60px #0009;
 max-height:94cqh;overflow:hidden;
}
#game #modal:not([data-kind=npc-dialogue])>header{
 flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;
 height:auto;min-height:44px;margin:0 0 16px;padding:0 0 12px;
 border-bottom:1px solid var(--ui-line);background:none;
}
#game #modal>header>div{min-width:0}
#game #modal #modal-title{font:600 var(--ui-title)/1.35 var(--ui-font);letter-spacing:0;margin:0;color:#f0e4c8;overflow-wrap:anywhere}
#game #modal #modal-kicker{display:block;margin:0 0 4px;font:400 var(--ui-meta)/1.4 var(--ui-font);letter-spacing:0;color:var(--ui-muted)}
#game #modal #modal-kicker:empty,#game #modal:is([data-kind=stats],[data-kind=pause],[data-kind=quickslots],[data-kind=community]) #modal-kicker{display:none}
#game #modal #modal-body{min-height:0;min-width:0;flex:1;font:400 var(--ui-body)/1.6 var(--ui-font);color:var(--ui-ink)}
#game #modal :is(#content-root,#community-root,#mailbox-root){font:400 var(--ui-body)/1.6 var(--ui-font)}
#game #modal :is(button,input,select,textarea){font-family:var(--ui-font);letter-spacing:0;text-shadow:none;box-sizing:border-box}
#game #modal button{cursor:pointer}
#game #modal button:disabled{cursor:default}
#game #modal :is(button,input,select,textarea):focus-visible{outline:2px solid #e0cc96;outline-offset:2px}
#game #modal :is(#modal-close,.npc-close){
 display:grid;place-items:center;flex:0 0 var(--ui-close);width:var(--ui-close);height:var(--ui-close);
 min-width:0;min-height:0;margin:0;padding:0;border:1px solid #bba77560;border-radius:0;
 background:#171f1b!important;box-shadow:none;color:#ded6c2;font:24px/1 var(--ui-font);
}
#game #modal :is(#modal-close,.npc-close):hover{background:#384033!important;color:#fff4d5}
#game #modal #modal-body .npc-close{flex-basis:44px;width:44px;height:44px}
/* Action buttons only: list rows, tabs and movable graph nodes keep their own
   semantics and geometry. No ornamental frame on every interactive element. */
#game #modal :is(.content-button,.inv-button,.community-button,.quick-entry,.quick-editor-footer button,.quick-key-row button,.quick-key-conflict button,.row-actions button,.attribute-add){
 border:5px solid transparent;border-image:var(--ui-button) 24 fill / 5px / 0 stretch;
 border-radius:0;background:var(--ui-surface)!important;background-image:none!important;
 min-height:var(--ui-control);min-width:0;margin:0;padding:6px 14px;
 font:500 var(--ui-body)/1.4 var(--ui-font);color:#e9dfc7;box-shadow:none;
}
#game #modal :is(.content-button,.inv-button,.community-button,.quick-entry,.quick-editor-footer button,.quick-key-row button,.quick-key-conflict button,.row-actions button,.attribute-add):hover:not(:disabled){filter:brightness(1.15)}
#game #modal :is(.content-button,.inv-button,.community-button,.quick-entry,.row-actions button,.attribute-add):active:not(:disabled){filter:brightness(.86);transform:translateY(1px)}
#game #modal button:disabled:not(.channel-card){opacity:.42;filter:saturate(.3)}
#game #modal :is(input:not([type=range]),select,textarea){border:1px solid #8f846255;border-radius:2px;background:#0b1310;color:var(--ui-ink);padding:8px 10px;font-size:var(--ui-body);min-height:var(--ui-control)}
#game #modal input::placeholder,#game #modal textarea::placeholder{color:#99a398;opacity:1}
#game #modal input[type=number]{appearance:textfield;-moz-appearance:textfield}
#game #modal input[type=number]::-webkit-inner-spin-button,#game #modal input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#game #modal :is(p,li){line-height:1.7;overflow-wrap:anywhere}
#game #modal :is(.content-card,.quest-story,.sheet-combat article,.sheet-attribute,.sheet-weapon){
 border:1px solid var(--ui-line);border-image:none;background:#0d1612!important;background-image:none!important;box-shadow:none;
}
#game #modal .content-card{padding:16px}
#game #modal .content-card :is(h3,p,ul){margin-block:0 12px}
#game #modal .content-card>:last-child{margin-bottom:0}
#game #modal :is(.content-card h3,.community-scroll h3,.quick-catalog h3){font-size:var(--ui-section);font-weight:600;line-height:1.45;letter-spacing:0}
#game #modal :is(.content-card p,.content-card li,.content-item strong,.community-form,.community-person strong,.channel-window,.quest-index strong){font-size:var(--ui-body)}
#game #modal :is(.content-card small,.content-tag,.community-person small,.community-empty,.content-card footer,.guild-heading small,.channel-window footer){font-size:var(--ui-meta);line-height:1.6;letter-spacing:0}
#game #modal :is(.content-tabs,.content-actions,.row-actions,.community-form,.community-actions,.inv-item-actions){gap:var(--ui-space)}
#game #modal .row-actions{display:flex;flex-wrap:wrap;margin:20px 0}
#game #modal .row-actions button{flex:1 1 auto}
/* Common item sockets: no painter's padding and no icon/frame misalignment. */
#game #modal :is(.inv-slot,.inv-slot-empty,.inv-item-large,.skill-entry-icon,.community-avatar,.guild-seal){background:var(--ui-slot) center/100% 100% no-repeat!important;border-image:none;border-radius:0;box-shadow:none}
#game #modal .inv-slot[aria-pressed=true]{outline:2px solid #dbc38c;outline-offset:0;box-shadow:none}
#game #modal .inv-slot-empty{opacity:.5}
#game #modal .rpg-bag-window{gap:20px;font:400 var(--ui-body)/1.55 var(--ui-font)}
#game #modal .inv-detail{padding:16px;background:#0b1310d9;border-color:var(--ui-line)}
#game #modal .inv-categories{margin-bottom:12px}
#game #modal .inv-toolbar{margin-bottom:12px;gap:10px}
#game #modal :is(.inv-categories button,.inv-pages,.inv-footer,.inv-item-heading small,.inv-item-heading span,.inv-stat-list>div,.inv-requirement,.inv-compare-current,.equipment-position>span,.equipment-identity span){font-size:var(--ui-meta);line-height:1.5}
#game #modal .inv-categories button{min-height:var(--ui-control);padding:8px 4px;font-size:var(--ui-body)}
#game #modal .inv-toolbar select{width:116px}
#game #modal .inv-item-heading h3{font-size:var(--ui-section);line-height:1.5;margin:4px 0}
#game #modal :is(.inv-use-description,.inv-detail-empty,.inv-ring-choice){font-size:var(--ui-body);line-height:1.6}
#game #modal .inv-item-actions>span{font-size:var(--ui-meta);line-height:1.6}
#game #modal .inv-item-body h4{font-size:var(--ui-body);line-height:1.5;margin:16px 0 8px;padding-top:16px}
#game #modal .inv-stat-list>div{padding-block:6px;gap:12px}
#game #modal .inv-pages{margin-top:12px;gap:16px}
#game #modal .inv-count[data-full=true]{color:#e1b78c}
#game #modal .inv-pages .inv-button{padding:2px 10px;min-height:32px}
#game #modal .equipment-identity strong{font-size:var(--ui-section)}
/* Quiet stat cards make the actual numbers, not repeated gold trim, lead. */
#game #modal .character-sheet{padding:0;gap:20px}
#game #modal .sheet-details{padding:0 18px 6px 0}
#game #modal .sheet-attribute{padding:10px;gap:10px}
#game #modal .sheet-attribute :is(span,small){font-size:var(--ui-meta);letter-spacing:0}
#game #modal .sheet-attribute>b{font-size:18px}
#game #modal .attribute-add{padding:0;min-width:36px;width:36px;height:36px;min-height:36px;font-size:22px}
#game #modal .sheet-combat article{padding:14px 16px}
#game #modal .sheet-combat strong{font-size:28px;line-height:1.3}
#game #modal :is(.sheet-section-heading h3,.sheet-weapon strong,.sheet-identity>span,.sheet-secondary>div,.sheet-combat article>span,.sheet-bonuses dt,.sheet-bonuses dd,.sheet-vitals>div>span,.sheet-vitals b){font-size:var(--ui-meta);line-height:1.5}
#game #modal .sheet-bonuses dd>span{min-width:0}
#game #modal .sheet-weapon{padding:12px;gap:12px}
/* Tabs have one baseline and a restrained active underline. */
#game #modal :is(.community-tabs,.content-tabs){gap:8px;margin:0 0 16px;padding:0;border-bottom:1px solid var(--ui-line)}
#game #modal :is(.community-tabs button,.content-tabs button,.quest-filters button){border-image:none;background-image:none!important;font-size:var(--ui-body);line-height:1.4;min-height:var(--ui-control);padding:8px 14px;margin:0;box-shadow:none}
#game #modal .community-tabs button{flex:1}
#game #modal .community-scroll{padding-right:14px}
#game #modal .community-empty{padding:32px 12px;color:var(--ui-muted)}
#game #modal .community-person{padding:16px 0;gap:12px}
#game #modal .community-form{margin:12px 0 24px}
#game #modal .channel-grid{gap:12px}
#game #modal .channel-server{margin-bottom:16px}
#game #modal .channel-server>span,#game #modal .channel-population,#game #modal .channel-card-top small{font-size:var(--ui-meta)}
#game #modal .channel-card{padding:16px;border-radius:0;box-shadow:none}
#game #modal .channel-card[aria-pressed=true]{box-shadow:inset 3px 0 #c7b17c}
#game #modal .quest-filters{gap:8px;margin-bottom:10px}
#game #modal .quest-list-heading{margin:0 0 12px;font-size:var(--ui-meta)}
#game #modal .quest-index{padding-right:12px}
#game #modal .quest-index button{padding:12px;gap:6px}
#game #modal .quest-row-meta small,#game #modal .quest-row-status,#game #modal .quest-filters small{font-size:var(--ui-meta)}
#game #modal .quest-journal{gap:20px}
#game #modal .quest-detail{padding-right:14px}
/* The catalog scrolls independently; long lists must not stretch slot rows. */
#game #modal[data-kind=quickslots]{height:min(600px,94cqh)}
#game #modal[data-kind=quickslots] #modal-body{overflow:hidden}
#game #modal .quick-editor{height:100%;min-height:0;grid-template-rows:200px auto 1fr;gap:16px 20px;align-items:start;padding:0}
#game #modal .quick-editor-slots{grid-template-rows:repeat(2,96px);align-content:start;gap:8px}
#game #modal .quick-choice{height:96px;background:var(--ui-slot) center/100% 100% no-repeat!important;border:0}
#game #modal .quick-choice :is(kbd,span:last-child){font-size:var(--ui-meta)}
#game #modal .quick-choice>span:last-child{padding:0 4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#game #modal .quick-catalogs{grid-row:1/-1;height:100%;overflow-y:auto;min-height:0;padding-right:14px;gap:20px;align-self:stretch;overscroll-behavior:contain}
#game #modal .quick-entry{padding:10px 10px 10px 60px;min-height:68px;text-align:left}
#game #modal .quick-entry{align-items:flex-start}
#game #modal .quick-entry strong{font-size:var(--ui-body);line-height:1.4}
#game #modal .quick-entry span{font-size:var(--ui-meta);line-height:1.4}
#game #modal .quick-catalog>div{gap:8px}
#game #modal .quick-editor-footer{justify-content:flex-start;flex-wrap:wrap}
/* Dialogue keeps its portrait stage, with just its reading panel framed. */
#game #modal .npc-conversation{border:8px solid transparent;border-image:var(--ui-frame) 32 fill / 8px / 0 stretch;background:#111915;padding:20px 24px;box-sizing:border-box}
#game #modal .npc-speaker{padding-bottom:12px;margin-bottom:4px;border-bottom:1px solid var(--ui-line)}
#game #modal .npc-speaker h3{font-size:18px;line-height:1.4}
#game #modal .npc-speaker-info>span,#game #modal .npc-topic,#game #modal .npc-facts,#game #modal .npc-response{font-size:var(--ui-meta);line-height:1.6}
#game #modal .npc-speech{font:400 16px/1.85 var(--ui-font);padding:12px 0 16px}
#game #modal .npc-choices{gap:6px;padding-top:12px}
#game #modal .npc-choices button{font-size:var(--ui-body);line-height:1.5;padding:10px 12px;gap:12px}
/* Existing GameScrollbars owns all rails; do not reintroduce native chrome. */
/* Companion windows use the same type rhythm without changing map/node art. */
#game #modal :is(.atlas-control,.town-destination,.mail-letter,.mail-body,.mail-compose label,.mail-attachment strong,.mail-compose-footer strong){font-size:var(--ui-body);line-height:1.55;letter-spacing:0}
#game #modal :is(.atlas-detail p,.atlas-detail h4,.atlas-detail>small,.atlas-navigation>span,.town-destination span,.mail-letter small,.mail-letter time,.mail-detail header small,.mail-attachment small,.mail-compose-footer small,.mail-pages){font-size:var(--ui-meta);line-height:1.6}
#game #modal .atlas-detail h3{font-size:var(--ui-section);margin:8px 0 16px;line-height:1.5}
#game #modal .atlas-control{min-height:var(--ui-control);padding:8px 12px}
#game #modal .atlas-workspace{grid-template-columns:minmax(0,1fr) 230px;gap:20px}
#game #modal .mail-detail h3{font-size:var(--ui-section)!important}
#game #modal .mail-compose fieldset{gap:20px}
#game #modal .mail-compose label{margin-bottom:16px}
#game #modal .mail-attachment{padding-block:10px;gap:12px}
#game #modal .mail-attachment img{background:var(--ui-slot) center/100% 100%}
#game #modal .skill-tree-detail :is(p,.skill-entry-main>small,.skill-unlock,.skill-mastery,.skill-milestone){font-size:var(--ui-meta);line-height:1.7}
#game #modal .skill-tree-detail .skill-entry-title h3{font-size:var(--ui-section)}
#game #modal .skill-tree-detail .skill-entry-action>button{font-size:var(--ui-body);min-height:var(--ui-control)}
/* Field instruments share materials, not the heavy management-window layout.
   Controller circles, chat hitboxes and native SVG glyphs remain unchanged. */
#game #hud .tools{background:none!important;background-image:none!important;border-image:none;box-shadow:none}
#game #top-menu-actions{border-image:var(--ui-frame) 32 fill / 6px / 0 stretch;background:#111915}
#game #hud .tools :is(#pause-btn,#top-menu-actions button){border:4px solid transparent;border-image:var(--ui-button) 24 fill / 4px / 0 stretch;background:#111915!important;background-image:none!important;box-shadow:none;border-radius:0;text-shadow:none;letter-spacing:0}
#game #bottom-bar .vitals{border:4px solid transparent;border-image:var(--ui-frame) 32 fill / 4px / 0 stretch;background:#111915!important;box-shadow:none}
#game #bottom-bar .vitals::before{display:none}
#game #action-bar>.quick-slot{background:var(--ui-slot) center/100% 100% no-repeat!important;border-image:none;box-shadow:none;border-radius:0}
#game #quest-tracker .tracked-quest{padding:12px;line-height:1.6}
#game #quest-tracker .tracked-heading{margin-bottom:8px}
#game #quest-tracker .tracked-objective{margin-block:4px;gap:12px}
#game #toast{border:1px solid #b4a07560;background:#111915ed;box-shadow:0 4px 14px #0005;color:#eee6d2;line-height:1.5}
/* Login retains its landscape composition. A generated button face belongs on
   primary actions, never on consent text or every navigation link. */
#game .lobby-screen .lobby-button:not(.lobby-link):not(.character-slot):not(.empty-character){border:5px solid transparent;border-image:var(--ui-button) 24 fill / 5px / 0 stretch;background:#18221c!important;color:#eee4ce;border-radius:0}
#game .lobby-screen .lobby-primary{color:#f7e3b0;font-weight:600}
#game .lobby-card :is(label,input,button,small){letter-spacing:0}
/* On phones, windows use the available landscape width, and type is sized in
   physical pixels. The world and combat HUD still use the existing scale. */
body.gamepad #game{
 --ui-body:calc(11px * var(--inverse-ui-scale));--ui-meta:calc(10px * var(--inverse-ui-scale));
 --ui-title:calc(16px * var(--inverse-ui-scale));--ui-section:calc(12px * var(--inverse-ui-scale));
 --ui-pad:calc(12px * var(--inverse-ui-scale));--ui-space:calc(8px * var(--inverse-ui-scale));
 --ui-control:calc(30px * var(--inverse-ui-scale));--ui-close:calc(34px * var(--inverse-ui-scale));
}
body.gamepad #game #modal:not([data-kind=npc-dialogue]){width:94cqw;max-height:94cqh;border-width:6px;border-image-width:6px}
body.gamepad #game #modal:not([data-kind=npc-dialogue])>header{min-height:var(--ui-close);margin-bottom:var(--ui-space);padding-bottom:var(--ui-space)}
body.gamepad #game #modal :is(#modal-close,.npc-close){font-size:calc(22px * var(--inverse-ui-scale))}
body.gamepad #game #modal #modal-body .npc-close{flex-basis:var(--ui-close);width:var(--ui-close);height:var(--ui-close)}
body.gamepad #game #modal :is(.rpg-bag-window,.character-sheet,.quest-journal){gap:var(--ui-space)}
body.gamepad #game #modal .inv-toolbar select{width:calc(85px * var(--inverse-ui-scale))}
body.gamepad #game #modal .rpg-bag-window{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
body.gamepad #game #modal .inv-detail{padding:var(--ui-space)}
body.gamepad #game #modal :is(.inv-toolbar,.inv-categories){margin-bottom:var(--ui-space)}
body.gamepad #game #modal .inv-grid{gap:8px}
body.gamepad #game #modal .inv-stack,body.gamepad #game #modal .inv-equipped-mark{font-size:var(--ui-meta)}
body.gamepad #game #modal .inv-slot .content-item-image{inset:14%;width:72%;height:72%}
body.gamepad #game #modal .inv-item-large{width:calc(42px * var(--inverse-ui-scale));height:calc(42px * var(--inverse-ui-scale))}
body.gamepad #game #modal .inv-item-large img{width:75%;height:75%}
body.gamepad #game #modal :is(.inv-pages,.inv-footer){padding-top:8px;margin-top:8px}
body.gamepad #game #modal .inv-pages .inv-button{min-height:var(--ui-control);padding:0 14px}
body.gamepad #game #modal .equipment-stage{min-height:300px}
body.gamepad #game #modal .equipment-position{width:calc(30px * var(--inverse-ui-scale))}
body.gamepad #game #modal .equipment-position>span{position:absolute;top:50%;left:calc(100% + 8px);transform:translateY(-50%);white-space:nowrap;font-size:var(--ui-meta);margin:0}
body.gamepad #game #modal :is(.equipment-position-4,.equipment-position-5,.equipment-position-6,.equipment-position-7)>span{left:auto;right:calc(100% + 8px)}
body.gamepad #game #modal .equipment-stage canvas{width:70%;height:94%;bottom:3%}
body.gamepad #game #modal .sheet-attribute{padding:10px;gap:8px}
body.gamepad #game #modal .sheet-attribute>b{font-size:var(--ui-section)}
body.gamepad #game #modal .attribute-add{width:var(--ui-control);min-width:var(--ui-control);height:var(--ui-control);min-height:var(--ui-control)}
body.gamepad #game #modal .sheet-identity h3{font-size:var(--ui-section)}
body.gamepad #game #modal .sheet-weapon small,body.gamepad #game #modal .sheet-section-heading>span{font-size:var(--ui-meta)}
body.gamepad #game #modal .sheet-attributes{gap:10px;margin-bottom:14px}
body.gamepad #game #modal .sheet-combat strong{font-size:calc(22px * var(--inverse-ui-scale))}
body.gamepad #game #modal .sheet-secondary>div{padding-block:12px}
body.gamepad #game #modal .content-card{padding:var(--ui-space)}
body.gamepad #game #modal .quest-filters button{font-size:var(--ui-body);min-height:var(--ui-control);padding:8px 14px}
body.gamepad #game #modal :is(.quest-index strong,.quest-group h3,.quest-detail p,.quest-detail li,.quest-detail footer,.quest-detail .quest-next span){font-size:var(--ui-body)}
body.gamepad #game #modal .quest-detail :is(h3,.quest-next strong){font-size:var(--ui-section)}
body.gamepad #game #modal .community-person footer{max-width:60%}
body.gamepad #game #modal .channel-card-top strong{font-size:var(--ui-section)}
body.gamepad #game #modal .channel-card-top b{font-size:calc(20px * var(--inverse-ui-scale))}
body.gamepad #game #modal .channel-server h3{font-size:calc(18px * var(--inverse-ui-scale))}
body.gamepad #game #modal .channel-card{min-height:calc(80px * var(--inverse-ui-scale));padding:var(--ui-space)}
body.gamepad #game #modal[data-kind=quickslots]{height:94cqh}
body.gamepad #game #modal .quick-editor{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-rows:200px auto 1fr;gap:var(--ui-space)}
body.gamepad #game #modal .quick-entry{padding-left:70px;min-height:80px}
body.gamepad #game #modal .quick-entry{padding-left:calc(42px * var(--inverse-ui-scale))}
body.gamepad #game #modal .quick-entry .quick-icon{width:calc(26px * var(--inverse-ui-scale));height:calc(26px * var(--inverse-ui-scale));left:12px;top:50%;transform:translateY(-50%)}
body.gamepad #game #modal .quick-key-row strong,body.gamepad #game #modal .quick-key-row select{font-size:var(--ui-meta)}
body.gamepad #game #modal .quick-key-row{gap:10px}
body.gamepad #game #modal .npc-conversation{margin-left:27%;width:73%;padding:var(--ui-space);max-height:calc(100% - 24px)}
body.gamepad #game #modal .npc-portrait{width:27%}
body.gamepad #game #modal .npc-speaker h3{font-size:var(--ui-section)}
body.gamepad #game #modal .npc-speech{font-size:var(--ui-body);min-height:70px;padding:10px 0}
body.gamepad #game #modal .npc-choices{max-height:240px;gap:6px;padding-top:10px}
body.gamepad #game #modal .npc-choices button{min-height:var(--ui-control);padding:10px}
body.gamepad #game #modal .npc-choices button small{font-size:var(--ui-meta);min-width:90px}
body.gamepad #game #modal .audio-settings label{font-size:var(--ui-body);min-height:var(--ui-control)}
body.gamepad #game #modal[data-kind=pause] #modal-body>p{font-size:var(--ui-body)}
body.gamepad #game #modal[data-kind=pause]{width:min(94cqw,calc(650px * var(--inverse-ui-scale)))}
body.gamepad #game #modal .atlas-workspace{grid-template-columns:minmax(0,1fr) minmax(220px,.36fr);gap:var(--ui-space)}
body.gamepad #game #modal .skill-tree-book{grid-template-columns:minmax(0,1fr) minmax(280px,.46fr);gap:var(--ui-space)}
body.gamepad #game #modal .skill-tree-detail .skill-entry-title h3{font-size:var(--ui-section)}
body.gamepad #game #modal .skill-tree-toolbar{font-size:var(--ui-meta)}
body.gamepad #game #modal .skill-tree-toolbar button{font-size:var(--ui-meta);min-height:var(--ui-control);padding:4px 10px}
body.gamepad #game #modal .skill-tree-toolbar{height:calc(var(--ui-control) + 12px)}
body.gamepad #game #modal .mail-add{gap:var(--ui-space)}
/* The launcher is not an image of a desktop form scaled to half-size. */
body.gamepad #game .lobby-screen{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:4cqw;padding:calc(16px * var(--inverse-ui-scale)) calc(24px * var(--inverse-ui-scale))}
body.gamepad #game .lobby-card{max-height:calc(100cqh - 32px * var(--inverse-ui-scale));overflow-y:auto;overflow-x:hidden;padding-right:calc(8px * var(--inverse-ui-scale));overscroll-behavior:contain}
body.gamepad #game .lobby-card h2{font-size:var(--ui-title);margin-bottom:calc(12px * var(--inverse-ui-scale));line-height:1.4;letter-spacing:0}
body.gamepad #game .lobby-card form{gap:calc(8px * var(--inverse-ui-scale))}
body.gamepad #game .lobby-card label{font-size:var(--ui-body);gap:calc(4px * var(--inverse-ui-scale));line-height:1.45}
body.gamepad #game .lobby-card input:not([type=checkbox]):not([type=radio]){font-size:max(16px,calc(13px * var(--inverse-ui-scale)));min-height:calc(32px * var(--inverse-ui-scale));padding:calc(6px * var(--inverse-ui-scale)) calc(10px * var(--inverse-ui-scale))}
body.gamepad #game .lobby-card input::placeholder{font-size:var(--ui-meta)}
body.gamepad #game .lobby-card :is(small,.lobby-note,.privacy-consent){font-size:calc(9px * var(--inverse-ui-scale));line-height:1.6}
body.gamepad #game .lobby-screen .lobby-button{font-size:var(--ui-body);min-height:calc(32px * var(--inverse-ui-scale));padding:calc(7px * var(--inverse-ui-scale)) calc(12px * var(--inverse-ui-scale));line-height:1.5}
body.gamepad #game .lobby-screen .lobby-link{min-height:calc(26px * var(--inverse-ui-scale));padding:calc(5px * var(--inverse-ui-scale)) 0}
body.gamepad #game .lobby-switch{margin-top:calc(4px * var(--inverse-ui-scale))}
body.gamepad #game .lobby-guest{margin-top:calc(12px * var(--inverse-ui-scale))}
body.gamepad #game .lobby-card .privacy-consent label{font-size:calc(9px * var(--inverse-ui-scale))}
@media(prefers-reduced-motion:reduce){#game #modal button:active:not(:disabled){transform:none}}