:root{font-family:"Nunito",system-ui,"Noto Sans",sans-serif;color:#26343c;background:#fff4d9;color-scheme:light}*{box-sizing:border-box}body{margin:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}button,select{font:inherit;min-height:44px;max-width:100%;border:2px solid #26343c;border-radius:9px;background:#fff5dc;color:inherit;padding:7px 11px;cursor:pointer;transition:transform .12s}button:hover{background:#ffe8ac}button:active{transform:scale(.96)}button:disabled{opacity:.5;cursor:default}button:focus-visible,select:focus-visible{outline:3px solid #e76b40;outline-offset:2px}[hidden]{display:none!important}#stage{height:100dvh;display:flex;flex-direction:column;max-width:1440px;margin:auto}header{display:flex;align-items:center;gap:8px;padding:7px;background:#8bcebe;border-bottom:3px solid #26343c}header>div{flex:1;min-width:0;font-size:11px;text-align:center}header strong{display:block;font-size:20px}header button{padding:6px 8px}#arena{display:flex;flex:1;min-height:0;gap:8px;padding:8px}#board{position:relative;flex:1;min-width:0;border:2px solid #26343c;border-radius:12px;overflow:hidden;background:#e9c49b}canvas{display:block;width:100%;height:100%;outline:none}#threat{position:absolute;inset:auto 5px 5px;background:#fff5dcde;border:1px solid #26343c;border-radius:7px;padding:5px;margin:0;font-size:12px;pointer-events:none}aside{width:300px;flex-shrink:0;overflow:auto;padding:0 3px}.hero{border:2px solid #26343c;background:#fff5dc;border-radius:10px;padding:7px;margin-bottom:7px}.hero.selected{border-color:#d16b31;box-shadow:0 0 0 1px #d16b31}.heroTop{display:flex;align-items:center;gap:6px}.heroTop img{width:48px;height:48px;object-fit:contain}.heroTop select{flex:1;min-width:0}.jobrow{display:flex;gap:5px;margin-top:5px}.jobrow select{flex:1;min-width:0}.hero p{font-size:11px;line-height:1.3;margin:5px 0 0}.actions{display:flex;flex-wrap:wrap;gap:5px}.actions button{flex:1}#encore{background:#ffc85c}#status,#notice{font-size:12px;line-height:1.4}.cover{width:100%;max-height:180px;object-fit:cover;border-radius:11px 11px 0 0}dialog{padding:0;border:3px solid #26343c;border-radius:15px;max-width:min(94vw,560px);max-height:94dvh;overflow:auto;background:#fff4d9;color:#26343c}dialog::backdrop{background:#26343c99}.body{padding:16px}.body p{line-height:1.5;font-size:14px;overflow-wrap:anywhere}.body h1,.body h2{margin:0 0 8px}.row{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0}.row label{display:flex;align-items:center;gap:5px;min-height:44px;max-width:100%}.row label select{min-width:0;max-width:200px}input[type=checkbox]{width:18px;height:18px;accent-color:#168c73}#resultArt{display:block;width:125px;height:125px;object-fit:contain;margin:auto}.body button{margin:3px}
@media(max-width:600px) and (orientation:portrait){header{gap:4px}header button{font-size:11px;padding:5px;min-width:44px}header>div{font-size:9px}header strong{font-size:16px}#arena{flex-direction:column;padding:5px;gap:5px}#board{min-height:210px;flex:1}aside{width:100%;max-height:340px;flex-shrink:0}.hero{padding:4px;margin-bottom:4px}.heroTop img{width:40px;height:40px}.heroTop select{font-size:13px}.jobrow{margin:3px 0}.hero p{font-size:10px}.actions{position:sticky;bottom:0;background:#fff4d9;padding:3px}#status{margin:3px 0}.body{padding:12px}.cover{max-height:150px}}
@media(max-height:480px) and (orientation:landscape){aside{width:270px}header{padding:3px}header strong{font-size:16px}.hero p{font-size:10px}.hero{padding:4px}.heroTop img{width:32px;height:32px}.cover{max-height:95px}.body{padding:12px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}

.actions{position:sticky;top:0;bottom:auto;z-index:2;background:#fff4d9;padding:3px;margin-bottom:5px}.actions button{min-width:75px;overflow-wrap:anywhere}
.selectSlot{min-width:44px;padding:6px}header span{display:block;overflow-wrap:anywhere;line-height:1.1}
header button{min-width:44px}
