:root{color-scheme:dark;font-family:system-ui,-apple-system,"PingFang SC",sans-serif;color:#f4edcb;background:#0c211c}*{box-sizing:border-box}body{margin:0;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer;border:2px solid #a77a45;background:#314431;border-radius:8px;padding:10px;touch-action:manipulation}button:disabled{opacity:.45;cursor:default}button:active:not(:disabled){transform:translateY(1px);filter:brightness(1.2)}#game{width:100%;max-width:500px;height:100dvh;min-height:550px;margin:auto;display:flex;flex-direction:column;background:#1c332b;padding-top:env(safe-area-inset-top)}header{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;height:44px;background:#20382e}header strong{font-size:17px;letter-spacing:1px}header small{font-size:11px;color:#b6c4a5}header button{padding:1px 11px;height:30px}#hud{display:flex;justify-content:space-between;gap:4px;padding:6px 13px;font-size:12px;border-top:1px solid #4b5c42;border-bottom:2px solid #b08749;color:#f2db9e}#field{position:relative;flex:1;min-height:0;overflow:hidden;background:#71844b}canvas{width:100%;height:100%;display:block;object-fit:contain;image-rendering:pixelated;touch-action:none}#skills{display:flex;gap:5px;padding:7px 7px 3px;background:#24382b;flex-shrink:0}#skills button{position:relative;flex:1;min-width:0;height:68px;padding:3px 1px;font-size:11px;border-radius:5px;overflow:hidden;background:linear-gradient(#50643d,#253d2b)}#skills .role{display:block;font-weight:700;font-size:13px}#skills .cd{display:block;color:#f3d889;font-size:12px}#skills button.ready{border-color:#edc76c;box-shadow:inset 0 0 10px #bea64942}#skills button.dead{filter:grayscale(1)}#skills button span{position:relative;z-index:1}#skills .shade{position:absolute;bottom:0;left:0;right:0;background:#111c1abb;z-index:0}footer{font-size:10px;text-align:center;color:#c0c8aa;padding:4px 4px max(5px,env(safe-area-inset-bottom));flex-shrink:0}#toast{position:absolute;top:9px;left:10%;width:80%;text-align:center;pointer-events:none;color:#fff2ab;font-size:14px;text-shadow:1px 2px #173027;background:#173027c9;border-radius:5px;padding:5px;opacity:0;transition:opacity .15s}#modal:empty{display:none}#modal{position:absolute;inset:0;background:#081b19bf;display:flex;align-items:center;justify-content:center;padding:14px;z-index:5;overflow:auto}.panel{width:100%;max-height:100%;overflow:auto;background:#213c30;border:3px solid #c99550;border-radius:12px;box-shadow:0 8px 32px #0009;padding:16px}.panel h1,.panel h2{margin:0 0 8px;font-size:24px;color:#ffe5a3}.panel p{font-size:13px;line-height:1.65;color:#d2dfbe;margin:8px 0}.panel .sub{font-size:11px;color:#aab99c}.row{display:flex;gap:8px}.row>*{flex:1}.panel button{width:100%;margin-top:8px;min-height:43px}.panel button.primary{background:#546c37;border-color:#e6c269;font-weight:700}.choice{text-align:left;border-color:#829168;background:#304c3a}.choice strong{display:block;font-size:17px;color:#ffe19d}.choice small{display:block;font-size:12px;line-height:1.6;margin-top:4px}.chips{display:flex;gap:4px;flex-wrap:wrap;margin:10px 0}.chips span{font-size:11px;background:#3c5038;border:1px solid #8b8f57;padding:4px 7px;border-radius:5px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.stats div{background:#304c39;border-radius:6px;padding:10px;font-size:12px}.stats b{display:block;font-size:23px;color:#f3d277}a{color:#f2d384}#modal label{font-size:12px} .danger{border-color:#b97465!important}.panel details{font-size:12px;color:#adbd9e;margin-top:13px}.panel summary{cursor:pointer}.panel details p{font-size:11px}@media(max-height:680px){header{height:36px}#skills button{height:68px}.panel{padding:12px}.panel h1,.panel h2{font-size:20px}.panel p{margin:5px 0}footer{font-size:9px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
#skills .portrait{width:25px;height:25px;object-fit:contain;image-rendering:pixelated;float:left;margin:1px 1px 0 2px;position:relative;z-index:1}#skills .role{font-size:11px}#skills button>span:not(.role):not(.cd){font-size:11px;display:block;clear:both}
.choice .cardicon{width:40px;height:40px;object-fit:contain;image-rendering:pixelated;float:left;margin:3px 10px 5px 0}
#combos{display:flex;gap:5px;padding:5px 7px 0;background:#24382b;flex-shrink:0}#combos .combo-card{flex:1;min-width:0;height:51px;padding:4px 2px;border-color:#79846b;background:#304938}#combos .combo-card.locked{opacity:.72}#combos strong{font-size:12px;display:block;color:#f1dfab}#combos small{font-size:10px;display:block;margin-top:3px;line-height:1.2;color:#d1dbc0}#combos .combo-card.ready{border-color:#ffda7c;background:#695323;box-shadow:inset 0 0 12px #e9bb6d55}#skills .role{font-size:11px}#skills .portrait{width:21px;height:21px}

#combos .combo-card{border:2px solid #79846b;border-radius:6px;text-align:center}#skills button{height:82px}#skills .auto{display:block;font-size:9px;color:#a9d7e5}#skills button>span.auto{font-size:9px!important}
.choice strong{font-size:15px}.choice em{display:block;clear:both;font-style:normal;font-size:10px;line-height:1.4;color:#b8d6bd;margin-top:5px}
#comboLive{flex:1;display:flex;gap:5px;min-width:0}#combos #formation{width:62px;flex:none;font-size:11px;padding:3px;border-color:#c49b54;background:#4a5834}#comboLive .combo-card{height:51px;flex:1;min-width:0;padding:5px 2px}.formation-card{border:1px solid #778965;border-radius:7px;padding:9px;margin:9px 0;background:#2b4535}.formation-card>strong{font-size:15px;color:#ffe0a1}.formation-card>small{display:block;font-size:11px;color:#bdd3bb;margin-top:5px}.formation-card p{font-size:12px}
@media(max-width:350px){#skills .portrait{width:16px;height:16px;margin-left:0}#skills .role{font-size:9px;white-space:nowrap}#skills button{height:82px}#skills .cd{font-size:11px}}
.training-card .cardicon{float:left;width:38px;height:38px;object-fit:contain;image-rendering:pixelated;margin:0 9px 4px 0}.panel .warning{border:1px solid #dca273;padding:9px;color:#ffdab0}
/* Skill books are a paused inventory, not a sixth battle button. */
header .header-actions{display:flex;align-items:center;gap:6px}header #bookBag{font-size:11px;padding:2px 8px;min-width:54px}.book-intro{border-left:3px solid #d9b55e;padding-left:9px}.book-card{background:#294735;border:1px solid #879569;border-radius:8px;margin:10px 0;padding:10px}.book-card h3{font-size:16px;line-height:1.4;margin:0;color:#ffe1a0}.book-card small{display:block;font-size:11px;line-height:1.6;color:#c3d9ba}.book-card .book-kind{color:#9dd7e4}.book-card .book-status{color:#f2d384}.book-confirm{border:2px solid #d6a563;background:#433d29;padding:12px;border-radius:8px}.book-confirm ul{font-size:13px;line-height:1.65;padding-left:20px}.book-equipped{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0}.book-equipped span{font-size:11px;background:#314f40;border:1px solid #6e8c73;border-radius:5px;padding:5px}.book-actions{position:sticky;bottom:-1px;background:#213c30;padding:6px 0 0;z-index:2}.book-actions button{margin-top:0}.book-empty{padding:15px 7px;border:1px dashed #83936d;border-radius:8px}@media(max-width:350px){header{padding-left:8px;padding-right:8px}header strong{font-size:14px}header small{display:none}header #bookBag{font-size:10px;padding:2px 6px}.book-card{padding:8px}}
.book-members{display:flex;flex-direction:column;gap:5px;margin:9px 0}.book-members span{font-size:12px;display:flex;align-items:center;gap:7px;padding:5px 7px;background:#213c30;border-radius:5px}.book-members img{width:24px;height:24px;object-fit:contain;image-rendering:pixelated}.book-members .fulfilled{color:#b4e3b4}.book-members .unfulfilled{color:#e3c392}
/* v6: combination-first tactical planner; all controls remain reachable on phones. */
.book-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.book-top small{font-size:11px;color:#b8dfbd}.book-top h2{margin:4px 0}.panel .book-top button{width:40px;min-height:40px;flex:none;margin:0}.loadout-current{border:1px solid #7d9e70;background:#172f28;border-radius:8px;padding:10px;margin:10px 0}.loadout-current>small{color:#e8c874;font-size:11px}.loadout-current>div{border-top:1px solid #405b44;margin-top:7px;padding-top:7px}.loadout-current strong{font-size:13px}.loadout-current>div>span{float:right;font-size:11px;color:#bed1b7}.plan-members{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0}.plan-members span{display:flex;gap:3px;align-items:center;font-size:10px;white-space:nowrap;background:#15332b;border:1px solid #5b7756;border-radius:4px;padding:3px 5px}.plan-members img{width:20px;height:20px;object-fit:contain;image-rendering:pixelated}.plan-members .fulfilled{color:#b8e7bc}.plan-members .unfulfilled{color:#e7bc84;border-color:#7f6749}.book-tabs{display:flex;gap:6px;margin:10px 0}.panel .book-tabs button{font-size:12px;flex:1;margin:0;padding:8px 4px}.book-tabs b{display:inline-block;padding:1px 5px;background:#1e362a;border-radius:4px}.panel .selected{border-color:#efcc76;background:#596a39}.plan-filters{display:flex;gap:5px;flex-wrap:wrap;margin:8px 0}.panel .plan-filters button{width:auto;min-height:36px;margin:0;padding:6px 9px;font-size:11px;flex:1;white-space:nowrap}.loadout-plan{border:1px solid #8a9767;background:linear-gradient(135deg,#34513a,#203c32);border-radius:9px;padding:11px;margin:10px 0}.loadout-plan.equipped{border-color:#e6be64}.plan-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.plan-title>b{color:#ffe2a2;font-size:16px}.plan-title>span{font-size:10px;color:#d6dbad;white-space:nowrap}.loadout-plan section{border-top:1px solid #5f7550;padding-top:8px;margin-top:8px}.loadout-plan section>strong{font-size:13px;color:#f6e0aa}.loadout-plan section>small{display:block;font-size:10px;color:#a8d2d8;margin-top:3px}.loadout-plan p{font-size:11px}.missing{font-size:11px;line-height:1.65;border-left:2px solid #b38c51;padding-left:7px;color:#e4c298;margin:7px 0}.compact-book h3{font-size:14px}.compact-book p{font-size:11px}.panel .loadout-plan button{font-size:12px}.book-actions{padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -6px 10px #213c30}.panel button:focus-visible{outline:3px solid #cce7ff;outline-offset:2px}@media(max-width:350px){#modal{padding:8px}.panel{padding:10px}.loadout-plan{padding:8px}.plan-members span{padding:2px 4px}.plan-members img{width:18px;height:18px}.book-tabs{gap:4px}.panel .book-tabs button{font-size:11px}}
/* Compact battle planner: the primary 2+3 action stays above the fold. */
.book-top h2{font-size:19px;margin:1px 0}.book-top small{font-size:10px}.book-top{gap:6px}.panel .book-top button{min-height:32px;width:32px;padding:4px}.panel .book-intro{font-size:10px;line-height:1.4;margin:5px 0;padding-left:5px}.loadout-current{padding:5px 8px;margin:5px 0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}.loadout-current>small{font-size:10px;white-space:nowrap}.loadout-current>div{border:0;margin:0;padding:0;display:flex;gap:4px;align-items:center}.loadout-current strong{font-size:10px}.loadout-current>div>span{font-size:10px;float:none}.panel .loadout-current>p{font-size:10px;margin:0}.book-tabs{margin:5px 0}.panel .book-tabs button{min-height:34px;padding:5px 3px}.plan-filters{margin:5px 0}.panel .plan-filters button{min-height:30px;padding:4px 6px}.loadout-plan{margin:6px 0;padding:8px}.plan-title>b{font-size:14px}.loadout-plan .plan-skill-row{display:flex;align-items:center;gap:6px;padding-top:5px;margin-top:5px}.mini-heroes{display:flex;gap:1px;min-width:64px}.mini-heroes img{width:20px;height:20px;object-fit:contain;image-rendering:pixelated}.loadout-plan .plan-skill-row>strong{font-size:12px;flex:1}.loadout-plan .plan-skill-row>small{font-size:10px;margin:0}.panel .plan-detail{margin-top:5px;font-size:10px}.panel .plan-detail>summary{min-height:24px;display:flex;align-items:center;color:#b1c7a7}.panel .plan-detail>summary::before{content:'▸ ';margin-right:5px}.panel .plan-detail[open]>summary::before{content:'▾ '}.panel .loadout-plan>button{margin-top:5px;min-height:38px;padding:6px}.loadout-plan .missing{margin:5px 0;font-size:10px;line-height:1.4}.book-actions{padding-top:4px}.panel .book-actions button{min-height:36px;padding:6px;font-size:12px}
/* Touch targets never shrink below 44px; text density is reduced instead. */
.panel .book-top button{width:44px;min-height:44px}.panel .book-tabs button,.panel .plan-filters button,.panel .loadout-plan>button,.panel .book-actions button{min-height:44px}.panel .plan-detail>summary{min-height:32px}
/* Permanent camp progression is separate from the temporary battle book planner. */
.coin-label{font-size:14px;color:#ffdb7c;white-space:nowrap}.hero-tabs{display:flex;gap:5px;margin:8px 0}.panel .hero-tabs button{flex:1;min-width:0;margin:0;padding:5px 2px;min-height:66px;font-size:11px}.hero-tabs img{display:block;width:24px;height:24px;image-rendering:pixelated;object-fit:contain;margin:auto}.hero-tabs small{display:block;font-size:10px;color:#e9cc80}.camp-star{background:#19362b;border:1px solid #7a8e5d;border-radius:8px;padding:8px;margin:8px 0}.camp-star>strong{font-size:13px;color:#f1d798}.camp-star>small{display:block;font-size:10px;line-height:1.6;color:#c4d2b5}.panel .camp-star button{min-height:38px;margin:4px 0;padding:6px;font-size:12px}.equipment-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.panel .equipment-slots button{padding:5px 3px;margin:0;min-height:83px}.equipment-slots small{display:block;font-size:10px}.equipment-slots img{display:block;width:28px;height:28px;margin:4px auto;object-fit:contain;image-rendering:pixelated}.equipment-slots strong{display:block;font-size:10px;line-height:1.3}.empty-slot{display:block;font-size:23px;line-height:32px}.slot-locked{background:#28392e;color:#c4c4ac}.camp-category{display:flex;justify-content:space-between;align-items:center;gap:5px;margin:9px 0 5px}.camp-category h3{font-size:14px;color:#ffe1a0;margin:0}.camp-category span{font-size:10px;color:#b8c8ad}.equipment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.equipment-card{display:flex;flex-direction:column;min-width:0;border:1px solid #829464;border-radius:7px;padding:8px;background:#2c4836}.equipment-card.equipped{border-color:#e8c06b;background:#3d5134}.equipment-card>div{display:flex;align-items:center;gap:5px}.equipment-card img{width:28px;height:28px;object-fit:contain;image-rendering:pixelated}.equipment-card strong{font-size:12px}.panel .equipment-card p{font-size:11px;line-height:1.5;flex:1}.equipment-card small{font-size:10px;line-height:1.5;color:#e7ce89}.panel .equipment-card button{font-size:11px;padding:6px;min-height:44px}.panel .slot-notice{font-size:11px;border-left:2px solid #ca9b56;padding-left:7px}.reward-box{padding:9px;border:1px solid #d0af63;background:#455132;border-radius:7px;margin:10px 0}.reward-box strong{display:block;color:#ffe096;font-size:14px}.reward-box small{display:block;font-size:11px;line-height:1.6;color:#cbd8b7}@media(max-width:350px){.hero-tabs{gap:3px}.equipment-card{padding:6px}.equipment-card>div{flex-direction:column;align-items:flex-start;gap:3px}.equipment-grid{gap:5px}.equipment-slots strong{font-size:9px}}
/* Camp owns the screen: combat controls return automatically after leaving. */
#game:has(.hero-tabs) #skills,#game:has(.hero-tabs) #combos,#game:has(.hero-tabs)>footer,#game:has(.hero-tabs) #hud{display:none}
#game:has(.hero-tabs) #field{flex:1;min-height:0}
#game:has(.hero-tabs) #modal{padding:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
#game:has(.hero-tabs) .panel{padding:12px}
.panel .camp-star button{min-height:44px}
.equipment-slots img,.equipment-card img{object-fit:none;object-position:left top;flex-shrink:0}

.equipment-slots img.gear-static,.equipment-card img.gear-static{object-fit:contain;object-position:center;image-rendering:pixelated}
/* v8: real out-of-battle scene shell, never a battlefield modal. */
[hidden]{display:none!important}
#lobby{max-width:500px;margin:auto;height:100dvh;display:flex;flex-direction:column;background:#142b26;padding-top:env(safe-area-inset-top)}
.lobby-header{height:auto;min-height:64px;flex-shrink:0;gap:9px;padding:9px 12px;border-bottom:3px solid #80613c;background:#233e32}
.lobby-header>div{flex:1}.lobby-header small{display:block;color:#aebe9d;font-size:10px}.lobby-header strong{display:block;font-size:18px}.lobby-header button{height:44px;min-width:44px}.lobby-header>span{font-size:11px;color:#f3d482}
#lobbyContent{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;background:linear-gradient(#203b30,#142b26)}
#lobbyNav{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:7px 8px max(7px,env(safe-area-inset-bottom));flex-shrink:0;border-top:3px solid #85683d;background:#1a322b}
#lobbyNav button{min-height:48px;border-radius:5px;color:#b7c8ad;font-weight:700;border-color:#496245}
#lobbyNav button.selected{background:#b99c5c;border-color:#f6d591;color:#142920;box-shadow:inset 0 -4px #91703e}
#lobby .outer-panel{box-shadow:none;border:0;border-radius:0;max-height:none;overflow:visible;background:transparent;padding:16px 13px 24px}
#lobby .outer-panel>h1{font-size:26px}#lobby .outer-panel button{min-height:44px}
#lobbyToast{position:fixed;top:80px;left:50%;transform:translateX(-50%);width:min(88vw,430px);text-align:center;background:#10261fe8;color:#ffe9aa;border:1px solid #c6a76b;padding:10px;z-index:50;pointer-events:none;opacity:0;font-size:13px}
.camp-landscape{position:relative;border-bottom:4px solid #8e7744;background:#68894c}.camp-landscape canvas{display:block;width:100%;height:auto;aspect-ratio:1.4;image-rendering:pixelated}.camp-caption{position:absolute;top:10px;left:12px;color:#fff2be;text-shadow:2px 2px #263a26,0 0 8px #263a26;pointer-events:none}.camp-caption small{font-size:11px}.camp-caption h1{margin:3px 0;font-size:23px}
.camp-body{padding:12px 12px 22px}.camp-body h2{font-size:15px;color:#f1d89d;margin:15px 0 9px}.camp-body .sub{font-size:11px;line-height:1.7;color:#a8bda2}
.camp-records{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;border-bottom:1px solid #5c7049;padding-bottom:10px;gap:4px}.camp-records span{font-size:10px;color:#bbcaad}.camp-records b{display:block;color:#f0d697;font-size:20px}
.camp-party{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.camp-party button{min-width:0;padding:7px 2px;border:1px solid #687f53;background:#294434;border-radius:4px}.camp-party img{width:38px;height:38px;max-width:100%;image-rendering:pixelated;display:block;margin:auto}.camp-party strong,.camp-party small{display:block;font-size:11px}.camp-party small{font-size:9px;color:#b6c79d;margin-top:3px}
.camp-deploy{width:100%;min-height:52px;margin-top:15px;font-weight:700}.camp-links{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:7px}.camp-links button{font-size:11px;min-height:44px;padding:8px 4px}
.eyebrow{color:#b2c695;font-size:11px;display:block;margin-bottom:7px}.deploy-party{display:flex;gap:4px;margin:14px 0}.deploy-party>div{flex:1;text-align:center;min-width:0}.deploy-party img{display:block;width:36px;height:36px;margin:auto;image-rendering:pixelated}.deploy-party strong,.deploy-party small{display:block;font-size:10px;line-height:1.7}.deploy-party small{color:#a8bd9d}
.mode-card{margin:14px 0;border:2px solid #8fa05e;background:linear-gradient(125deg,#3d5738,#253f30);padding:13px;border-radius:8px}.mode-card>small{font-size:11px;color:#c5d39d}.panel .mode-card h2{font-size:22px;margin:4px 0}.mode-card>b{font-size:11px;color:#e6d28e}.endless-card{border-color:#9e7b9c;background:linear-gradient(125deg,#4a3953,#2a3045)}.endless-card>small{color:#dac2df}
.catalog-filters{display:flex;gap:5px;flex-wrap:wrap;margin:9px 0}.panel .catalog-filters button{width:auto;margin:0;padding:6px 9px;font-size:11px;min-height:44px}.catalog-grid{margin-top:13px}.catalog-grid .equipment-card{min-height:210px}.catalog-grid .equipment-card button{margin-top:auto}
@media(max-width:350px){.lobby-header{padding:7px 8px;gap:5px}.lobby-header strong{font-size:16px}.lobby-header>span{font-size:10px}#lobby .outer-panel{padding:12px 9px 20px}.camp-body{padding:10px 9px 18px}.camp-caption h1{font-size:20px}.camp-party{gap:3px}.camp-party small{font-size:8px}.camp-party img{width:32px;height:32px}}
/* Phone reading: item mechanics are content, not footnotes. */
#lobby .equipment-card p{font-size:13px;line-height:1.6}#lobby .equipment-card strong{font-size:14px}#lobby .equipment-card small{font-size:11px}#lobby .camp-star>small{font-size:12px}#lobby .equipment-card button{font-size:12px}
/* v9 concept translation: real interactive layers over scene art, no baked controls. */
#lobby{background:#082b2d;color:#ffe9af}#lobbyContent{background:transparent;background-position:center;background-size:cover;background-attachment:local}
#lobby[data-page=home] #lobbyContent{background-image:linear-gradient(#092e3410,#092e3466),url('assets/ui-camp-v9.webp')}
#lobby[data-page=deploy] #lobbyContent{background-image:linear-gradient(#092e3422,#092e3466),url('assets/ui-battle-v9.webp')}
#lobby[data-page=library] #lobbyContent{background-image:linear-gradient(#092e3433,#092e3466),url('assets/ui-library-v9.webp')}
.lobby-header,#lobbyNav{background:linear-gradient(120deg,#073038,#143c3a,#05272e);border-color:#bf964d;box-shadow:inset 0 1px #ffe3a0,inset 0 -1px #5a421f}.lobby-header strong{color:#ffe2a0}.lobby-header>span{background:#062b2f;padding:8px 6px;border:1px solid #bc9559;border-radius:4px}
#lobby button{border-radius:4px;border-color:#ae8a4c;box-shadow:inset 0 1px #e1be7660,inset 0 -3px #001f2777;background:linear-gradient(#164b4c,#082d35);color:#ffe5a5}
#lobby button.selected,#lobby button.primary{background:linear-gradient(#ffe8a3,#edb34c);color:#172f2d;border-color:#fff0b6;box-shadow:inset 0 -4px #b57b32,0 0 9px #c4974b44}
#lobbyNav button{font-size:14px;min-height:62px}.nav-mark{display:block;font-size:25px;line-height:26px;margin-bottom:3px;color:#edc785}#lobbyNav .selected .nav-mark{color:#304538}
#lobby .outer-panel{background:transparent}.camp-landscape{height:46vh;min-height:240px;max-height:370px;border:0;background:transparent}.camp-landscape canvas{height:100%;object-fit:cover;opacity:1}.camp-caption{top:14px;text-shadow:2px 2px #05272e}.camp-body{position:relative;background:linear-gradient(#082e33b8,#062a31f5);border-top:2px solid #b99350;box-shadow:0 -4px 20px #08292b44}.camp-records{border-color:#ab884b}.camp-party button{background:#123c3e;border-color:#af8b4b}.camp-body h2{color:#ffe7a6}.camp-links button{font-size:12px}
.hero-selector{display:flex;gap:5px;position:relative;z-index:2}.hero-selector button{flex:1;min-width:0;margin:0!important;padding:4px 2px!important}.hero-selector img{display:block;margin:auto;width:29px;height:29px;image-rendering:pixelated}.hero-selector span{font-size:10px}
.hero-stage{height:250px;position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 50% 75%,#80e0ee33,transparent 55%),linear-gradient(#0b3e42,#092f36);background-image:linear-gradient(#092e3422,#092e3422),url('assets/ui-hero-v9.webp');background-size:cover;background-position:center;border:1px solid #8c784d;margin-top:7px;overflow:hidden}
.ornate-title{position:absolute;top:10px;left:50%;transform:translateX(-50%);padding:6px 22px;border:2px solid #c59c54;background:#082f35e8;color:#ffe6a2;font-weight:700;white-space:nowrap;box-shadow:inset 0 0 0 2px #204943}
.hero-pedestal{margin-top:25px;display:grid;place-items:center;width:154px;height:154px;border-radius:50%;background:radial-gradient(ellipse,#68c6d95c,transparent 65%)}.hero-showcase{width:112px;height:112px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 10px 4px #011f2a88)}.hero-stars{font-size:30px;color:#ffd264;line-height:34px;letter-spacing:3px;text-shadow:0 2px #936020}.hero-stars span{color:#a9956a}
.hero-section-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:7px 0}.panel .hero-section-tabs button{margin:0;font-size:16px;font-weight:700}.hero-workbench{background:#082f35eb;border:2px solid #ae8c50;padding:10px;box-shadow:inset 0 0 0 2px #244a45}.hero-workbench .equipment-slots button{min-height:110px}.hero-workbench .equipment-slots img{width:42px;height:42px;margin:7px auto}.hero-workbench .equipment-slots .gear-frame{width:28px;height:28px;margin:14px auto}.hero-workbench .equipment-card{background:#103d40;border-color:#9d8657}.hero-workbench .equipment-card.equipped{box-shadow:0 0 8px #f8ca70;border-color:#ffe1a0}.hero-workbench .equipment-card small{color:#f2d192}.growth-track{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.growth-track>div{padding:12px 4px;border:1px solid #71663e;text-align:center;background:#0d3338}.growth-track b{display:block;font-size:23px;color:#e1bb65}.growth-track small{font-size:11px}.growth-track .fulfilled{border-color:#ffd98a;background:#365b48}.skill-description{border-left:2px solid #c49a55;background:#153d40;margin:8px 0;padding:8px}.skill-description h3{font-size:15px;margin:0;color:#ffe5a7}
#lobby[data-page=library] .outer-panel{margin-top:90px;background:#072d34ed;border:2px solid #b99754;min-height:calc(100% - 90px)}.catalog-grid .equipment-card{background:linear-gradient(#154146,#092f35);border:2px solid #907d51;min-height:230px}.catalog-grid .equipment-card>div{align-items:center;flex-direction:column;min-height:75px;justify-content:center}.catalog-grid .gear-static{width:52px;height:52px}.catalog-grid .equipment-card strong{font-size:14px}.catalog-grid .equipment-card p{font-size:12px}.catalog-filters{padding-bottom:5px;border-bottom:1px solid #8b7844}
#lobby[data-page=deploy] .outer-panel{background:linear-gradient(#07303955,#062c35cc)}.mode-card{background:linear-gradient(120deg,#174743ed,#062e35ee);border-color:#c49b54;box-shadow:inset 0 0 0 2px #294e47}.endless-card{background:linear-gradient(120deg,#47374ced,#132d42ee);border-color:#bda17e}.deploy-party{padding:8px 4px;background:#052c34d9;border:1px solid #9f8449}
#refreshItem{position:absolute;right:8px;top:85px;z-index:4;width:52px;min-height:68px;padding:4px 2px;background:linear-gradient(#376375,#163c51);border:2px solid #c3b074;box-shadow:0 2px 7px #061d28aa}#refreshItem>span{font-size:26px;line-height:27px;display:block;color:#b6f3ff}#refreshItem strong,#refreshItem small{display:block;font-size:10px}#refreshItem:disabled{opacity:.55}.partial-plan{border-color:#f4d07a!important}
@media(max-width:350px){.hero-stage{height:220px}.hero-showcase{width:96px;height:96px}.hero-workbench{padding:7px}.hero-workbench .equipment-slots button{min-height:100px}.hero-selector{gap:3px}.lobby-header>span{font-size:9px;padding:7px 4px}.camp-landscape{min-height:220px}.catalog-grid .equipment-card{padding:6px}#lobbyNav button{font-size:13px}}
.library-detail{background:#082c33;border:2px solid #c5a161;margin-top:12px;padding:12px;box-shadow:inset 0 0 0 2px #31514c}.library-detail>div{display:flex;align-items:center;gap:10px}.library-detail img{width:40px;height:40px;object-fit:none;object-position:left top;image-rendering:pixelated}.library-detail img.gear-static{object-fit:contain;object-position:center}.panel .library-detail h2{font-size:18px;margin:0}.library-detail small{font-size:11px;color:#cbb889}.catalog-grid .equipment-card.equipped{border-color:#ffe299;box-shadow:0 0 9px #e2b45488}
/* The generated scene contains no UI; every hotspot below is a real control. */
#lobby[data-page=home] #lobbyContent{background:#072d33;overflow:auto}
.camp-world{position:relative;min-height:600px;height:100%;background:url('assets/ui-camp-v9.webp') center center/cover no-repeat}
.camp-world .camp-caption{top:12px;left:14px}.camp-world .camp-caption h1{font-size:20px}.camp-hotspot{position:absolute!important;transform:translate(-50%,-50%);min-height:47px;padding:5px 11px!important;background:linear-gradient(#123a3de8,#072d34f5)!important;box-shadow:0 3px 9px #082225aa!important;white-space:nowrap}.camp-hotspot:active{transform:translate(-50%,-50%)!important}.camp-hotspot strong,.camp-hotspot small{display:block}.camp-hotspot strong{font-size:14px}.camp-hotspot small{font-size:9px;color:#d9c79b}.hotspot-library{left:50%;top:28%}.hotspot-training{left:17%;top:41%}.hotspot-forge{left:81%;top:43%}.camp-assembly{position:absolute;left:13%;right:13%;top:56%;text-align:center}.camp-assembly .camp-party{gap:3px}.camp-assembly .camp-party button{padding:3px;background:#0c3439bb!important;box-shadow:none!important}.camp-assembly .camp-party img{width:32px;height:32px}.camp-assembly>span{font-size:11px;color:#fff0bc;text-shadow:0 2px #082e32}.camp-bottom-plaque{position:absolute;bottom:12px;left:10px;right:10px;background:#062b32ed;border:2px solid #b49354;padding:9px;box-shadow:inset 0 0 0 2px #31534a}.camp-bottom-plaque .camp-records{grid-template-columns:1fr 1fr;padding-bottom:5px}.camp-bottom-plaque .camp-records b{font-size:18px}.camp-bottom-plaque .camp-deploy{margin-top:7px;min-height:46px}.camp-bottom-plaque>small{display:block;text-align:center;font-size:9px;color:#c0c6a5;margin-top:6px}
.hero-stage{background-image:linear-gradient(#092e3433,#092e3455),url('assets/ui-battle-v9.webp')}
#lobby[data-hero=mage] .hero-stage{background-image:url('assets/ui-mage-v9.webp');background-position:center 52%;height:290px}
#lobby[data-hero=mage] .hero-showcase{visibility:hidden}
#lobby[data-hero=mage] .hero-pedestal{background:none}
#lobby[data-hero=mage] .hero-stars{position:absolute;bottom:8px}
@media(max-width:350px){.camp-world{min-height:570px}.camp-hotspot{padding:4px 8px!important}.camp-hotspot strong{font-size:12px}.hotspot-training{left:18%}.hotspot-forge{left:80%}.camp-world .camp-caption h1{font-size:18px}#lobby[data-hero=mage] .hero-stage{height:250px}}
.camp-world{min-height:470px}.camp-assembly .camp-party button{border:0!important;background:transparent!important;box-shadow:none!important}.camp-assembly .camp-party img{width:40px;height:40px;filter:drop-shadow(0 3px 2px #092d31aa)}.camp-assembly .camp-party small{text-shadow:0 2px #082d32}.camp-bottom-plaque .camp-deploy{margin-top:0}.camp-bottom-plaque{background:#062b32c9}.camp-assembly{top:58%}@media(max-width:350px){.camp-world{min-height:470px}.camp-assembly .camp-party img{width:32px;height:32px}}
.camp-member{display:block;margin:auto;width:40px;height:40px;background-size:160px 40px;background-position:-40px 0;background-repeat:no-repeat;image-rendering:pixelated;filter:drop-shadow(0 3px 2px #092d31aa)}span.hero-showcase{display:block;background-size:448px 112px;background-position:-112px 0;background-repeat:no-repeat;image-rendering:pixelated}@media(max-width:350px){.camp-member{width:32px;height:32px;background-size:128px 32px;background-position:-32px 0}span.hero-showcase{background-size:384px 96px;background-position:-96px 0}}
/* Camp residents face the player; frame 1 is back-facing combat pose. */
.camp-member,span.hero-showcase{background-position:0 0}
#lobby[data-hero=mage] .hero-stage{background-position:center 12%}
/* Exact atlas-frame icons, with slot-specific book covers and weapon mounts. */
.gear-art{display:inline-flex!important;position:relative;align-items:center;justify-content:center;flex-shrink:0;width:46px;height:46px;margin:4px;vertical-align:middle;background:radial-gradient(#2f6a70,#12343e);border:1px solid #927744;box-shadow:inset 0 0 0 2px #13323a,0 2px 3px #001a23}
.gear-glyph{display:block;position:relative;z-index:1;background-repeat:no-repeat;image-rendering:pixelated;filter:drop-shadow(0 1px 1px #061d28)}
.gear-book,.gear-special{border-radius:2px 6px 6px 2px;border-left:5px solid #c39a55;background:linear-gradient(135deg,#346378,#163744 65%);box-shadow:inset 0 -4px #e0c38b,inset 0 -6px #6c5837,2px 3px 0 #001e29}
.gear-special{border-color:#e0b75b;border-left-color:#e6bf65;background:linear-gradient(135deg,#725986,#26384e 70%);box-shadow:inset 0 -4px #f0d99a,inset 0 0 0 2px #ad8747,0 0 6px #c9b26055}
.gear-weapon{border-radius:50%;background:radial-gradient(#67a8ac55,#0b2d3c 75%);border-color:#a28b59;box-shadow:inset 0 0 8px #173d4a,0 0 5px #75c2d333}
.gear-role-healer.gear-book{background:linear-gradient(135deg,#527a50,#1d443d 70%)}.gear-role-warrior.gear-book{background:linear-gradient(135deg,#7c5b43,#363a3a 70%)}.gear-role-archer.gear-book{background:linear-gradient(135deg,#5d7160,#273e3c 70%)}
.equipment-slots .gear-art{display:flex!important;margin:7px auto}.catalog-grid .gear-art{width:62px;height:62px;margin:4px auto}.catalog-grid .gear-glyph{transform:scale(1.25)}.library-detail .gear-art{width:56px;height:56px}.equipment-card>div{align-items:center}.panel .return-deploy{font-size:12px;margin:0 0 8px;text-align:left;min-height:44px}
.recording-download{display:block;padding:13px;margin:10px 0;min-height:44px;border:2px solid #d5b674;background:#1c4b48;color:#fff0af;text-align:center;text-decoration:underline}
/* v10 passive multi-combo growth: one compact summary, no extra combat buttons. */
.combo-summary{padding:4px 7px;min-height:40px}.combo-summary strong{display:block;font-size:12px;color:#f8dfa4}.combo-summary small{display:block;font-size:10px;color:#baceb0;margin-top:3px}.book-growth-card{padding:10px;border:1px solid #8d8054;background:#133b3f;margin:9px 0;border-radius:5px}.book-growth-card.learned{border-color:#dfb66c}.book-growth-card h3{font-size:15px;margin:0}.book-growth-card .plan-title span{font-size:10px}.book-cooldown{font-size:11px;color:#a8e8df;padding:6px;background:#082d34}.next-evolution{border-top:1px solid #7f7751;margin-top:8px;padding-top:7px}.next-evolution strong{font-size:12px;color:#e6c481}.panel .next-evolution p{font-size:12px;line-height:1.6;margin:5px 0}.next-evolution small{font-size:10px;line-height:1.6;color:#c9c6a6}.panel .max-evolution{font-size:11px;color:#b4dcaa}.book-growth-list .plan-members span{font-size:10px}
.choice-combo-art{display:flex;align-items:center;gap:1px;float:left;max-width:96px;margin-right:7px;flex-wrap:wrap}.choice-combo-art img{width:25px;height:25px;image-rendering:pixelated}.combo-summary{white-space:nowrap;overflow:hidden}.combo-summary strong,.combo-summary small{overflow:hidden;text-overflow:ellipsis}
/* Small-screen paused decisions own the viewport; inactive combat HUD is covered. */
@media(max-width:500px){
 #modal:has(.choice),#modal:has(.book-growth-list){position:fixed;left:50%;right:auto;top:env(safe-area-inset-top,0px);bottom:env(safe-area-inset-bottom,0px);width:min(100vw,500px);transform:translateX(-50%);padding:7px;z-index:30;align-items:stretch;background:#061e27f5}
 #modal:has(.choice)>.panel,#modal:has(.book-growth-list)>.panel{width:100%;height:100%;max-height:100%;padding:10px;overscroll-behavior:contain}
 #modal:has(.choice) h2{font-size:20px;margin-bottom:4px}
 #modal:has(.choice)>.panel>p{font-size:11px;line-height:1.4;margin:5px 0}
 #modal #choiceBooks{min-height:36px;margin:4px 0 6px;padding:6px;font-size:11px}
 #modal .choice{min-height:105px;margin:6px 0;padding:8px;display:block}
 #modal .choice strong{font-size:13px;line-height:1.35}
 #modal .choice small{font-size:11px;line-height:1.4;margin-top:4px}
 #modal .choice em{font-size:9px;line-height:1.3;margin-top:4px}
 #modal .choice .cardicon{width:30px;height:30px;margin-right:6px}
 #modal .choice-combo-art{max-width:70px}.choice-combo-art img{width:21px;height:21px}
}
/* v11 settlement ledger: five readable role cards, never an invented composite score. */
.contribution-section{margin:16px 0;border-top:1px solid #9b8554;padding-top:12px}.panel .contribution-section h2{font-size:19px}.contribution-heroes{display:grid;gap:8px}.contribution-hero{border:1px solid #927c4d;background:#0d333a;border-radius:5px;padding:8px}.contribution-hero header{height:auto;min-height:0;background:transparent;padding:0 0 7px;border-bottom:1px solid #48615a;gap:6px}.contribution-hero header strong{font-size:14px}.contribution-hero header small{font-size:10px;color:#e8c880}.contribution-hero dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 4px;margin:9px 0 0}.contribution-hero dl>div{min-width:0}.contribution-hero dt{font-size:10px;color:#b2c4af}.contribution-hero dd{font-size:14px;font-weight:700;margin:3px 0 0;color:#ffe1a2;overflow-wrap:anywhere}.contribution-definitions{margin-top:10px}.contribution-definitions summary{min-height:44px;display:flex;align-items:center;font-size:12px}.panel .contribution-definitions p{font-size:11px;line-height:1.6}
/* Unified pixel UI: opaque midnight-blue surfaces, stepped gold/wood trim. */
:root{--pixel-ink:#0b2632;--pixel-panel:#123747;--pixel-edge:#70502c;--pixel-gold:#c29a59;--pixel-light:#ffe5a4;--pixel-muted:#afbfbd}
#lobby{background:var(--pixel-ink);color:var(--pixel-light)}
#lobby .lobby-header,#lobbyNav{background:repeating-linear-gradient(0deg,#112e3c 0 4px,#132f3d 4px 8px);border-color:#b89052;box-shadow:inset 0 2px #e7c783,inset 0 -3px #5c452b}
#lobby button,.panel button,#refreshItem{border-radius:0!important;border:2px solid #b18b50;box-shadow:inset 2px 2px #49616a,inset -2px -3px #061e29,2px 2px 0 #051b25!important;background:#183c4a;color:#f7e0aa;filter:none}
#lobby button:hover:not(:disabled),.panel button:hover:not(:disabled){background:#245164}
#lobby button.primary,#lobby button.selected,.panel button.primary,.panel button.selected{background:linear-gradient(#f3cf83 0 8%,#d8ad5c 8% 84%,#b58239 84% 100%);border-color:#ffe5a3;color:#152f3b;box-shadow:inset 2px 2px #fff1bc,inset -2px -3px #8f612d,2px 2px 0 #061a25!important}
#lobby button:disabled,.panel button:disabled{opacity:.65;background:#263b43;color:#a7a89a;border-color:#77684c;box-shadow:inset 2px 2px #46565b,inset -2px -2px #172831!important}
#lobby button:focus-visible,.panel button:focus-visible{outline:3px solid #a7e6eb;outline-offset:2px}
#lobby .lobby-header>span{border-radius:0;background:#102c39;border:2px solid #bd995e;box-shadow:inset 2px 2px #41606b,inset -2px -2px #071e29;color:#f4d695}
#lobbyNav button{background:#173744;min-height:64px;box-shadow:inset 2px 2px #49626a,inset -2px -2px #071f2a!important}
.nav-art{display:block;width:28px;height:28px;position:relative;margin:0 auto 4px;background-repeat:no-repeat;image-rendering:pixelated}
.nav-art-deploy{background-image:url('assets/greatsword.png');background-position:center;background-size:12px 28px;transform:rotate(35deg)}
.nav-art-training{background:#d7b46b;clip-path:polygon(28% 0,72% 0,72% 14%,86% 14%,86% 43%,100% 43%,100% 86%,72% 86%,72% 100%,58% 100%,58% 57%,42% 57%,42% 100%,28% 100%,28% 86%,0 86%,0 43%,14% 43%,14% 14%,28% 14%)}
.nav-art-training:after{content:'';position:absolute;left:5px;right:5px;top:10px;height:6px;background:#18333e;border-bottom:2px solid #f5db96}
.nav-art-home{background:#dfbc75;clip-path:polygon(43% 0,57% 0,57% 14%,71% 14%,71% 28%,85% 28%,85% 43%,100% 43%,100% 57%,85% 57%,85% 100%,15% 100%,15% 57%,0 57%,0 43%,15% 43%,15% 28%,29% 28%,29% 14%,43% 14%)}
.nav-art-home:after{content:'';position:absolute;left:10px;top:16px;width:8px;height:12px;background:#18333e;border-top:2px solid #8b693d}
.nav-art-library{background:#a78043;border:3px solid #e5c480;box-shadow:inset 0 0 0 2px #594a32;top:2px;height:24px}
.nav-art-library:before{content:'';position:absolute;left:-3px;right:-3px;top:8px;height:3px;background:#efcc7f}.nav-art-library:after{content:'';position:absolute;width:6px;height:7px;background:#f8df99;left:8px;top:7px;border:2px solid #705432}
#lobby .camp-hotspot{background:#153844!important;border:2px solid #c49b5b;box-shadow:inset 2px 2px #52666a,inset -2px -2px #081e29,3px 3px 0 #061f2b!important}
#lobby .camp-bottom-plaque{background:#102f3d;border:2px solid #b78f51;box-shadow:inset 2px 2px #4a6064,inset -2px -2px #071e29}
#lobby .camp-assembly .camp-party button{background:transparent!important;border:0;box-shadow:none!important}
#lobby[data-page=library] .outer-panel{background:#102f3df5;border:2px solid #bb965a;box-shadow:inset 2px 2px #425b63,inset -2px -2px #071f2a}
#lobby .hero-workbench,#lobby .library-detail,#lobby .mode-card,#lobby .equipment-card,#lobby .reward-box,#lobby .contribution-hero,.book-growth-card{border-radius:0;background:#153746;border:2px solid #a68550;box-shadow:inset 2px 2px #38525b,inset -2px -2px #0a2430}
#lobby .equipment-card.equipped{background:#284a50;border-color:#e0bc73;box-shadow:inset 2px 2px #688378,inset -2px -2px #0d2b32}
#lobby .endless-card{background:#293549;border-color:#b99b6a}
#lobby .ornate-title{background:#0e2d3c;border-color:#d5b06c;box-shadow:inset 2px 2px #53666a,inset -2px -2px #061f2a}
#lobby .skill-description,#lobby .growth-track>div{background:#13313f;border-color:#a78952;border-radius:0;box-shadow:inset 2px 2px #304c56,inset -2px -2px #091f2b}
#lobby .deploy-party{background:#102e3c;border:2px solid #ae8c52;box-shadow:inset 2px 2px #3d5960,inset -2px -2px #061c28}
#lobby .gear-art{border-radius:0;filter:none;box-shadow:inset 2px 2px #799187,inset -2px -2px #061f2b,2px 2px 0 #091d25}
#lobby .gear-book,#lobby .gear-special{background:#294e60;border-left:5px solid #b59054;box-shadow:inset 0 -4px #e5ce96,inset 2px 2px #5d8290,2px 2px 0 #071e2a}
#lobby .gear-special{background:#51485f;border-color:#cfad69}#lobby .gear-weapon{background:#163a4b;border:2px solid #9ba98b}
.pixel-locked{position:relative;width:32px;height:32px;margin:4px auto}.pixel-locked:before{content:'';position:absolute;left:8px;top:1px;width:16px;height:16px;border:4px solid #c0a96e;border-bottom:0}.pixel-locked:after{content:'';position:absolute;left:4px;top:13px;width:24px;height:18px;background:linear-gradient(90deg,#af9252 0 42%,#253c45 42% 58%,#af9252 58%);border:2px solid #dec487}
#lobby .contribution-hero header{background:transparent;border-bottom:1px solid #67716a;box-shadow:none}.contribution-hero dd{font-variant-numeric:tabular-nums;color:#f1d595}
#lobby[data-page=result] #lobbyContent{background:repeating-linear-gradient(0deg,#0c2937 0 4px,#0d2c3a 4px 8px)}
#lobby[data-page=result] .stats{gap:6px}#lobby[data-page=result] .stats>div{border:1px solid #687367;background:#183b47;border-radius:0;box-shadow:inset 1px 1px #43606a}
.panel{border-radius:0;background:#133341;border-color:#b79559;box-shadow:inset 2px 2px #49616a,inset -2px -2px #09222e,4px 4px 0 #041923}
#lobby .outer-panel{box-shadow:none}.book-cooldown,.next-evolution{border-radius:0}.panel .book-growth-card.learned{border-color:#dab775}
/* v12 independent full portraits; every hero uses an empty scene, never a baked character. */
#lobby .hero-stage,#lobby[data-hero=mage] .hero-stage{height:330px;background-image:linear-gradient(#082b371f,#082b3744),url('assets/ui-battle-v9.webp');background-position:center 42%;background-size:cover}
#lobby .hero-pedestal,#lobby[data-hero=mage] .hero-pedestal{width:200px;height:254px;margin-top:30px;background:radial-gradient(ellipse at 50% 89%,#a1b9ba55 0 20%,transparent 22%);position:relative}
.hero-portrait-v12{display:block;width:170px;height:250px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(3px 4px 0 #05253366)}
#lobby .hero-stars,#lobby[data-hero=mage] .hero-stars{position:absolute;bottom:6px;font-size:26px;line-height:29px}
#lobby .camp-assembly{left:7%;right:7%;top:51%}.camp-assembly .camp-party{gap:0;align-items:end}.camp-assembly .camp-party button{padding:0!important;min-height:106px}
.camp-assembly .camp-party img.camp-member-portrait{display:block;width:100%;max-width:68px;height:88px;object-fit:contain;margin:auto;image-rendering:pixelated;filter:drop-shadow(2px 3px 0 #16332966)}
.camp-assembly .camp-party small{font-size:11px;line-height:16px;color:#ffe3a1;text-shadow:1px 2px #082d32}.camp-assembly>span{background:#102f3de8;padding:3px 10px;border-top:1px solid #c19d60;border-bottom:1px solid #785a32;display:inline-block}
#lobby .camp-hotspot{border-width:3px;border-color:#d3ad68;box-shadow:inset 2px 2px #f2d496,inset -2px -3px #5a452d,3px 3px 0 #061d28!important}
#lobby .camp-deploy{border:3px solid #ffdf94;min-height:52px;font-size:16px;letter-spacing:1px;box-shadow:inset 3px 3px #fff2bd,inset -3px -4px #95622e,3px 3px 0 #071f2a!important}
#lobby .ornate-title{border:3px solid #d2ad67;box-shadow:inset 2px 2px #708080,inset -2px -2px #061f2a,3px 3px 0 #09232f}
@media(max-width:350px){#lobby .hero-stage,#lobby[data-hero=mage] .hero-stage{height:300px}.hero-portrait-v12{width:150px;height:224px}#lobby .hero-pedestal,#lobby[data-hero=mage] .hero-pedestal{height:230px}.camp-assembly .camp-party img.camp-member-portrait{height:76px;max-width:56px}.camp-assembly .camp-party button{min-height:94px}#lobby .camp-assembly{top:50%}}
/* UI identity uses the new portraits; renderer battle sprite sheets remain untouched. */
.hero-selector img,.hero-tabs img,.deploy-party img,.plan-members img,.mini-heroes img,.choice-combo-art img,img.cardicon[src*="_portrait_v12"],#skills img.portrait{object-fit:cover;object-position:50% 12%;image-rendering:pixelated;background:#153643}
.hero-selector img{width:34px;height:34px}.deploy-party img{width:38px;height:38px}#skills img.portrait{width:32px;height:32px}
/* Real pixel spellbooks replace small effect-sheet glyphs, with legible edition marks. */
#lobby .gear-art.gear-realbook{position:relative;width:56px;height:62px;padding:2px;border:2px solid #8d9d8d;background:#112f3d;box-shadow:inset 1px 1px #6f7e77,2px 2px 0 #081e28}
#lobby .gear-realbook.gear-special{border:3px double #ffe0a0;background:#303343;box-shadow:inset 1px 1px #b89b65,2px 2px 0 #081e28}
#lobby .gear-art img.gear-book-image{display:block;width:100%;height:100%;margin:0;object-fit:contain;object-position:center;image-rendering:pixelated;filter:none}
.book-edition{position:absolute;bottom:-2px;right:-2px;padding:1px 3px;min-width:16px;font-size:10px;line-height:12px;background:#173746;color:#ffe4a0;border:1px solid #bd9f68}.gear-special .book-edition{background:#ad8542;color:#152c36}
#lobby .catalog-grid .gear-art.gear-realbook{width:64px;height:70px}.hero-workbench .equipment-slots button{min-height:120px}
/* Combat chrome shares the same midnight-blue / stepped gold visual system. */
#game{background:#102f3d}#game>header{height:48px;flex-shrink:0;background:repeating-linear-gradient(0deg,#112e3c 0 4px,#132f3d 4px 8px);border-bottom:2px solid #9d7e4c;box-shadow:inset 0 2px #d2b477;color:#ffe2a3}
#game>header strong{font-size:16px}#game>header small{color:#b1bdba;font-size:10px}
#game button{border-radius:0!important;border:2px solid #b18b50;background:#173b49;color:#f4dfa8;box-shadow:inset 2px 2px #4d6671,inset -2px -2px #061e29,1px 1px 0 #051b25;filter:none}
#game button:focus-visible{outline:3px solid #a7e6eb;outline-offset:1px}
#game>header button{height:36px;min-width:38px}#game #bookBag{font-size:11px;min-width:62px;padding:3px 6px}
#game #hud{background:#0c2936;border-top:1px solid #d0b075;border-bottom:2px solid #8a7046;color:#efd399;font-variant-numeric:tabular-nums;font-size:11px;min-height:30px;flex-shrink:0}
#game #combos{background:#112e3b;border-top:2px solid #a98b54;border-bottom:1px solid #6d694f;box-shadow:inset 0 1px #cbb37b;padding:3px 6px;min-height:48px;flex-shrink:0}
#game #formation{min-height:42px;min-width:46px;font-size:11px;padding:3px;line-height:15px}
#game #skills{background:#102c39;padding:5px 5px 3px;gap:4px;flex-shrink:0}
#game #skills button{height:103px;padding:3px 1px;font-size:10px;line-height:13px;background:#173847;border-color:#6e7c76;box-shadow:inset 1px 1px #4b6570,inset -2px -2px #061f2a;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:1px;overflow:hidden}
#game #skills button.ready{border-color:#dec080;box-shadow:inset 1px 1px #e9d398,inset -2px -2px #5c4b30;background:#254751}
#game #skills button.dead{background:#28333b;border-color:#60675f;opacity:.65}
#game #skills img.portrait{position:relative;z-index:1;width:28px;height:28px;margin:0;flex-shrink:0;object-fit:cover;object-position:50% 12%;border:1px solid #708581}
#game #skills .role{font-size:11px;line-height:14px;white-space:nowrap;max-width:100%}#game #skills .cd{font-size:10px;line-height:13px;color:#ebd29b}#game #skills .auto{font-size:9px;line-height:12px;white-space:nowrap;letter-spacing:-.2px;color:#b6c6c3}
#game #skills .shade{background:#071e2a99}#game>footer{background:#0d2835;color:#b6c4bd;font-size:9px;line-height:12px;border-top:1px solid #54645d}
#game #refreshItem{background:#193f51;border:2px solid #c9b67a;box-shadow:inset 1px 1px #91aaa5,inset -2px -2px #08222f,2px 2px 0 #071f2a;min-height:68px}
#toast,#lobbyToast{border-radius:0;background:#102e3eee;border:2px solid #be9b5f;color:#ffe4a4;box-shadow:inset 1px 1px #5b7075,2px 2px 0 #09202b;font-size:12px;text-shadow:none;padding:8px;line-height:1.4}
@media(max-width:350px){#game>header{padding:6px 8px}#game>header strong{font-size:14px}#game>header small{font-size:9px}#game #skills{gap:3px;padding:4px 4px 2px}#game #skills button{height:101px;font-size:9px}#game #skills .role{font-size:10px}#game #skills .auto{font-size:8px;letter-spacing:-.3px}#game #skills .cd{font-size:9px}.combo-summary strong{font-size:11px}.combo-summary small{font-size:9px}}
/* QA: the old 90px empty library reveal hid all books on short phones. */
#lobby[data-page=library] .outer-panel{margin-top:20px;min-height:calc(100% - 20px)}
@media(max-width:350px){#lobby[data-page=library] .outer-panel{margin-top:8px;min-height:calc(100% - 8px)}#lobby[data-page=library] .outer-panel>h1{font-size:23px;margin:6px 0}#lobby[data-page=library] .outer-panel>p{font-size:11px;line-height:1.45;margin:5px 0}.catalog-filters{gap:3px;margin:6px 0}.catalog-filters button{padding:5px 7px;font-size:10px}}
/* Keep active navigation glyphs legible on gold selected buttons. */
#lobbyNav button.selected .nav-art-home,#lobbyNav button.selected .nav-art-training{background:#173744}
#lobbyNav button.selected .nav-art-home:after,#lobbyNav button.selected .nav-art-training:after{background:#e6c274;border-color:#a67e3b}
#lobbyNav button.selected .nav-art-library{background:#173744;border-color:#173744;box-shadow:inset 0 0 0 2px #cfa45c}
#lobbyNav button.selected .nav-art-library:before{background:#cfa45c}
#game #field{background:#314c50}
#game>header{height:52px;min-height:52px;flex-shrink:0}#game>header button{height:44px;min-width:44px}

/* v13: the battle dock is for five manual tactics only. */
#game>header{padding:4px 8px;gap:6px;height:56px;min-height:56px}
#game>header>strong{font-size:14px;white-space:nowrap;letter-spacing:0}
#game>header>strong>small{display:block;font-size:10px;margin-top:2px}
#game .header-actions{display:flex;align-items:center;gap:4px}
#game>header button{height:44px;min-width:44px;margin:0;padding:2px 5px;line-height:15px;font-size:11px}
#game #bookBag{min-width:60px;font-size:11px;padding:2px 5px}
#game #bookBag small{display:block;font-size:10px;line-height:12px;color:#d1ddce}
#game #bookCount{color:#ffdb84}
#game #heroStatus{min-width:48px}
#game #skills{padding:7px 7px 4px;gap:5px;border-top:2px solid #ab8c55;box-shadow:inset 0 1px #d4b87c}
#game #skills button{height:72px;min-height:44px;min-width:44px;padding:3px 1px;gap:0;justify-content:center;border-width:2px}
#game #skills img.portrait{width:44px;height:44px;max-width:100%;border:0;object-position:50% 12%;z-index:0;float:none}
#game #skills .cd{display:block!important;clear:none;min-height:16px;font-size:11px!important;line-height:16px;font-weight:700;text-shadow:1px 1px #071e2a;z-index:2}
#game #skills .shade{z-index:1;pointer-events:none;background:#071b2ba8}
#game #skills button:disabled{opacity:.72}
#game #skills button.dead{opacity:.5}
#game>footer{font-size:10px;line-height:14px;border:0;padding:1px 4px max(5px,env(safe-area-inset-bottom))}
#game #refreshItem{width:52px;height:58px;min-height:44px;right:8px;top:70px;padding:3px 3px 1px;border-color:#bda06b;background:#173944;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}
#game #refreshItem img{width:30px;height:35px;image-rendering:pixelated;object-fit:contain}
#game #refreshItem small{font-size:11px;line-height:14px;color:#ffe6a6;font-weight:700;font-variant-numeric:tabular-nums}
#game #refreshItem:disabled{opacity:.5}
#game #refreshItem:not(:disabled){border-color:#f1d991;box-shadow:inset 1px 1px #92e2c9,inset -2px -2px #08222f,2px 2px #071f2a}
#game .panel button,#game .panel .book-top button{min-height:44px}
#game .panel .book-top button{min-width:44px}
#game .battle-inspect{display:flex;gap:6px;margin:6px 0}
#game .battle-inspect button{flex:1;min-width:0;min-height:44px!important;margin:0!important;font-size:12px!important}
#game #modal:has(.hero-status-panel){position:fixed;left:50%;right:auto;top:env(safe-area-inset-top,0px);bottom:env(safe-area-inset-bottom,0px);width:min(100vw,500px);transform:translateX(-50%);padding:7px;z-index:30;align-items:stretch;background:#061e27f5}
#game #modal:has(.hero-status-panel)>.panel{height:100%;max-height:100%;padding:0;overflow:hidden}
.hero-status-panel{height:100%;display:flex;flex-direction:column;min-height:0}
.status-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 12px 8px;border-bottom:1px solid #8c7b51;background:#153947;flex-shrink:0}
#game .status-top h2{font-size:21px;line-height:26px;margin:2px 0 0}
.status-top small{font-size:11px;line-height:15px;color:#bce4db}
#game .status-top button{width:44px;height:44px;min-width:44px;margin:0;padding:0;flex-shrink:0}
.status-toolbar{display:flex;align-items:center;gap:8px;justify-content:space-between;padding:6px 10px;background:#102d3a;flex-shrink:0}
.status-toolbar>span{font-size:10px;line-height:16px;color:#bdcdc8;max-width:48%}
#game .status-toolbar button{width:auto;min-width:116px;font-size:11px;margin:0;padding:5px 8px}
#heroStatusList{overflow:auto;overscroll-behavior:contain;min-height:0;padding:0 10px 8px;flex:1}
.hero-status-card{border:1px solid #647c79;background:#112e3c;padding:10px;margin-top:9px;box-shadow:inset 2px 2px #234a55}
.status-identity{display:flex;gap:8px;align-items:center}
.status-identity>img{width:44px;height:44px;object-fit:cover;object-position:50% 12%;image-rendering:pixelated;background:#173d49;border:1px solid #937f56;flex-shrink:0}
.status-identity>div{flex:1;min-width:0}
.status-identity h3{font-size:14px;line-height:19px;color:#ffe3a2;margin:0}
.status-identity h3 b{font-size:11px;color:#acd5cf;margin-left:8px;white-space:nowrap}
#game .status-identity p{font-size:11px;line-height:16px;margin:3px 0 0;color:#cbd5ba}
.status-identity>span{font-size:10px;color:#a4d7bb;white-space:nowrap}
.hero-status-card.fallen .status-identity>span{color:#dca8a0}
.hero-status-card.fallen img{filter:grayscale(1)}
.status-health{margin-top:8px;font-variant-numeric:tabular-nums}
.status-health>div{display:flex;justify-content:space-between;font-size:11px;color:#bbcebe}
.status-health strong{color:#e0e9c7;font-weight:600}
.status-health>i{display:block;height:5px;background:#091d26;margin:4px 0;border:1px solid #36534e}
.status-health>i>b{display:block;height:100%;background:#7cab82}
.status-health>small{display:block;font-size:10px;color:#a5d9df;margin-top:3px}
.hero-status-card dl{margin:8px 0 0}
.hero-status-card dl>div{display:grid;grid-template-columns:minmax(94px,.9fr) minmax(0,1.5fr);gap:8px;border-top:1px solid #39535a;padding:7px 0 0;margin-top:6px}
.hero-status-card dt{font-size:11px;line-height:15px}
.hero-status-card dt>span{display:block;font-size:10px;color:#a7bdba;margin-bottom:2px}
.hero-status-card dt>strong{font-weight:600;color:#e4d9b4}
.hero-status-card dd{margin:0;font-size:11px;line-height:16px;color:#e7d19f}
.hero-status-card dd>b{font-weight:600}
.hero-status-card dd>small{display:block;font-size:10px;line-height:15px;color:#a8c5c7;margin-top:2px;overflow-wrap:anywhere}
.status-actions{padding:5px 10px 10px;background:#153947;flex-shrink:0;border-top:1px solid #627670}
#game .status-actions button{margin:0}
@media(max-width:350px){#game>header>strong{font-size:12px}#game>header{padding:4px 7px;gap:4px}#game .header-actions{gap:3px}#game #skills{gap:4px;padding:6px 5px 3px}#game #skills button{height:70px}#game #skills img.portrait{width:42px;height:42px}#game #refreshItem{width:48px;right:6px;top:64px}.status-top{padding:9px}.status-toolbar{padding:5px 8px}#heroStatusList{padding:0 7px 7px}.hero-status-card{padding:8px}.status-identity{gap:6px}.status-identity h3 b{margin-left:5px}.hero-status-card dl>div{grid-template-columns:minmax(90px,.95fr) minmax(0,1.4fr);gap:5px}}
@media(max-height:550px){#game{min-height:0}#game>header{height:52px;min-height:52px}#game #skills button{height:64px}#game #skills img.portrait{height:38px;width:38px}}
.hero-status-card dd>em{display:block;font-size:10px;font-style:normal;color:#c7d9bb;line-height:15px;margin-top:1px}
/* Show the actual waiting reason, rather than repeating every unlock rule. */
.hero-status-card dd{font-size:12px;line-height:17px}
.hero-status-card dd>em{font-size:11px;line-height:16px;margin-top:3px}
.status-identity h3{font-size:15px}.status-health>div{font-size:12px}
/* v14 private test tools and concrete growth goals. */
.progress-hub{padding:18px 16px 28px;background:#111c29;color:#efe6c7}.test-mode-strip,.growth-goals{padding:16px;margin-bottom:14px;border:1px solid #7c704d;border-radius:12px;background:#1b2935}.test-mode-strip p,.growth-goals p{font-size:13px;line-height:1.6;color:#c8c4b3}.test-mode-strip button{width:100%;min-height:44px;background:#715b2c;color:#fff1bb;border:1px solid #b79a4e;border-radius:8px;padding:10px}.growth-goals h2{font-size:19px}.growth-goals>div{display:grid;gap:8px}.growth-goals button{display:flex;justify-content:space-between;gap:12px;text-align:left;align-items:center;padding:12px;border:1px solid #44515e;border-radius:8px;background:#14212d;color:#eee3c6;min-height:48px}.growth-goals button small{font-size:12px;max-width:68%;color:#b4c7cb}.test-resource-card{padding:20px;background:#20333f;border:1px solid #a18a4b;border-radius:12px;margin:16px 0;color:#e4dac0}.test-resource-card>b{display:block;font-size:42px;color:#f4d078}.test-resource-card>span{font-size:12px}.save-mode-label{padding:10px;border:1px solid #9b8046;border-radius:7px;color:#f5d17d!important}.route-picker{display:grid;gap:10px;margin:16px 0}.route-option{border:1px solid #6c674e!important;text-align:left!important;padding:12px!important}.route-option.selected{border-color:#e3be64!important;background:#504027!important}.route-option strong,.route-option small{display:block}.route-option small{font-size:12px;line-height:1.5;margin-top:5px}.route-progress{padding:12px;background:#263a40;border:1px solid #6f8b87;border-radius:9px;margin:10px 0;font-size:13px;line-height:1.6;color:#d9e6df}.route-progress strong{display:block}
#lobby .route-option.selected{color:#fff0bb!important}#lobby .route-option.selected small{color:#f6e5bc!important}
/* v15: friend portraits use a shared square pixel grid, with identity separate from job. */
.hero-portrait-v12{width:224px;height:224px;object-fit:contain}
.camp-assembly .camp-party img.camp-member-portrait{height:82px;width:82px;max-width:100%;object-fit:contain}
.camp-assembly .camp-party strong{font-size:12px;text-shadow:1px 2px #082d32}
.camp-assembly .camp-party small{font-size:10px}
.camp-fiction{display:block!important;margin:3px auto;color:#d1d9c5;font-size:9px;text-shadow:1px 1px #082d32}
.hero-selector button{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}
.hero-selector button small{font-size:9px;color:#b8c9c4}
.hero-selector img,.deploy-party img,.plan-members img,.choice-combo-art img,#skills img.portrait,.status-identity img{object-fit:contain;object-position:center}
#game #skills button{height:84px}
#game #skills .friend-skill-name{display:block;font-size:11px;line-height:14px;color:#f9e8b9;z-index:2}
#game #skills img.portrait{width:40px;height:40px;object-position:center}
.contribution-hero header strong small{font-size:10px;font-weight:400;color:#b9ccc3}
@media(max-width:350px){.hero-portrait-v12{width:192px;height:192px}.camp-assembly .camp-party img.camp-member-portrait{height:65px}.camp-assembly .camp-party strong{font-size:11px}.camp-assembly .camp-party small{font-size:9px}#game #skills button{height:80px}#game #skills img.portrait{width:36px;height:36px}}
@media(max-height:550px){#game #skills button{height:74px}#game #skills img.portrait{width:30px;height:30px}}
/* v16: compact inspectable hero templates, always separate from combat. */
.hero-template{background:#122e35;border:1px solid #557371;padding:12px;border-radius:10px;margin:12px 0;color:#dfecdd}.template-title{display:flex;flex-direction:column;gap:5px}.template-title small,.hero-template>small{color:#a8beb6;font-size:11px;line-height:1.55}.hero-template p{font-size:12px;line-height:1.6;margin:9px 0}.hero-template canvas{width:100%;height:auto;image-rendering:pixelated;background:#18363a;border-radius:5px;display:block;margin:10px 0}.template-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.template-actions button{min-width:0;padding:8px 4px;font-size:11px}.hero-gear-symbol{width:40px;height:40px;object-fit:contain;image-rendering:pixelated}.gear-special .hero-gear-symbol{width:38px;height:38px}#victoryScene{display:block;width:100%;height:auto;image-rendering:pixelated;margin:0 auto 8px;max-width:420px}

/* M0: explicit candidate gates at every participant, never color alone. */
.book-gates{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;font-size:11px}.book-gates span{border:1px solid #70867d;padding:4px 6px;background:#183842}.book-gates .met{color:#bbebc5}.book-gates .missing{color:#ffd0ad}.plan-members>span{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:44px;font-size:11px}.plan-members>span small{font-size:10px;white-space:nowrap}.plan-members .missing small{color:#ffceaa}.plan-members .met small{color:#c7e4b8}

/* v18: never crop SVG equipment as a sprite sheet. The explicit box is consistent in Safari and Chrome. */
#lobby .gear-art img.hero-gear-symbol,#lobby .gear-art img.gear-book-image{display:block;width:100%;height:100%;max-width:100%;max-height:100%;margin:0;object-fit:contain;object-position:center;image-rendering:pixelated;flex-shrink:0}
#lobby .equipment-slots button.selected{color:#152f3b}
#lobby .equipment-slots button.selected strong,#lobby .equipment-slots button.selected small{color:#152f3b}
#lobby button.selected:hover:not(:disabled){background:linear-gradient(#f3cf83 0 8%,#d8ad5c 8% 84%,#b58239 84% 100%);color:#152f3b}
/* v19: chapter cards reuse the established pixel camp palette. */
.chapter-heading{position:relative;padding:18px 16px;border:2px solid #9c865c;background:linear-gradient(120deg,#143744,#253f42);box-shadow:inset 0 0 0 3px #142731;margin-bottom:16px}
.chapter-heading h1{margin:8px 0;color:#f1d498}.chapter-heading p{max-width:38em;line-height:1.7;color:#d3dbc8}.chapter-badge{display:inline-block;padding:5px 10px;background:#304f4b;color:#f4dfa4;border:1px solid #9f9263;font-size:12px}
#lobby .loadout-reminder{padding:11px 12px;border-left:3px solid #dfbc6b;background:#353b34;color:#eee1b9;font-size:12px;line-height:1.7}
.route-planning{margin:20px 0}.route-planning>p{font-size:12px;line-height:1.7}.route-brief{border:1px solid #647e78;background:#183541;padding:13px;margin:12px 0}.route-brief>strong{color:#edd5a2}.route-brief p{font-size:12px;line-height:1.65}.route-brief dl{margin:8px 0 0}.route-brief dl>div{display:grid;grid-template-columns:36px 1fr;gap:9px;border-top:1px solid #416067;padding:8px 0}.route-brief dt{color:#d8c895;font-size:12px}.route-brief dd{margin:0;color:#cddbd0;font-size:12px;line-height:1.7}
.section-caption{margin:22px 0 12px}.section-caption h2{margin:0 0 5px}.section-caption>small{color:#b5c6bf;font-size:11px}.chapter-stage{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;margin:12px 0;padding:16px 13px;background:#1a3740;border:2px solid #627b70;box-shadow:inset 0 0 0 2px #102b35}.stage-iron-pass{border-color:#99836a;background:#373c3e}.stage-watch-ridge{border-color:#8a829d;background:#283545}.stage-number{width:42px;height:48px;display:grid;place-items:center;background:#203e40;border:2px solid #ac9564;box-shadow:3px 3px 0 #0e2530;color:#f2d9a0;font:700 22px monospace}.stage-copy>small{font-size:11px;color:#bbd1cb}.stage-copy h3{font-size:19px;color:#f2d8a0;margin:6px 0}.stage-copy p{font-size:12px;line-height:1.7;margin:7px 0}.stage-copy>strong{display:block;color:#d4e1b0;font-size:12px}.stage-copy>span{display:block;color:#acc4c8;font-size:11px;margin:4px 0 10px}#lobby .stage-copy button{min-height:44px;margin:0}.legacy-modes{margin:22px 0}#lobby details{font-size:12px;line-height:1.7}#lobby details summary{min-height:38px;padding:8px 0;cursor:pointer;color:#e4c995}
@media(max-width:380px){.chapter-stage{gap:9px;padding:14px 10px;grid-template-columns:35px minmax(0,1fr)}.stage-number{width:33px;height:42px;font-size:19px}.stage-copy h3{font-size:18px}.chapter-heading{padding:14px 12px}.route-brief{padding:10px}}

/* v25 read-only free-exploration guidance, no additional learning controls. */
.learning-guide{border:1px solid #6c8f8c;background:#102f3d;padding:7px 8px;margin:5px 0;overflow-wrap:anywhere;font-size:11px;line-height:1.4}
.learning-guide>header{height:auto;background:transparent;padding:0 0 4px;font-size:10px;color:#b1c8c4;display:block}
.learning-row>strong,.learning-row>span,.learning-row>small{display:block}.learning-row>strong{font-size:11px;color:#f7df9d}.learning-row>small{font-size:9px;color:#b8c7bb;margin-top:3px}
.learning-row.learning-offered{border-left:3px solid #e5bf72;padding-left:6px}.learning-guide details{margin-top:5px}.learning-guide summary{min-height:28px;padding:5px 0;font-size:10px}.learning-guide details .learning-row{margin-top:6px}
@media(max-width:500px){#modal .learning-guide{font-size:10px;padding:5px 7px}#modal .learning-guide>header{font-size:9px}#modal .learning-row>strong{font-size:10px}#modal .learning-row>small{font-size:9px}#modal .learning-guide details{font-size:10px}}