:root{font-family:Georgia,serif;font-size:16px;color:#f3e7cb;background:#080e1c}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{background:#213852;color:inherit;border:2px solid #b48960;padding:.45rem .7rem;min-height:44px;cursor:pointer}button:hover,button:focus-visible{outline:2px solid #9de0eb;outline-offset:1px;background:#335370}button:disabled{opacity:.56;cursor:not-allowed}button small{display:block;color:#b8d8df;font:12px sans-serif}.app{width:min(100%,1100px);margin:auto;padding:8px;display:grid;gap:7px}.frame{background:#101d32;border:3px double #d8ac78;box-shadow:inset 0 0 0 2px #457383}.title{min-height:calc(100vh - 16px);display:grid;place-items:center;text-align:center;background:repeating-linear-gradient(135deg,#15253c 0 4px,#172a40 4px 8px)}.title h1{font-size:clamp(2rem,6vw,4rem);color:#f1d3a0;text-shadow:3px 3px #394056}.title nav{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem}.top{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem 1rem;padding:.5rem .7rem}.top strong{color:#ade2e7}.layout{display:grid;grid-template-columns:minmax(210px,30%) minmax(0,1fr);gap:7px}.scene{min-height:330px;position:relative;overflow:hidden;background:repeating-linear-gradient(45deg,#263d4d 0 3px,#304b58 3px 6px)}.scene h2{position:relative;z-index:1;margin:.5rem;padding:.3rem;background:#101d32dd;font-size:1rem}.portrait{width:100%;height:280px;object-fit:contain;object-position:center bottom;image-rendering:pixelated}.main-panel{min-width:0;padding:.6rem}.tabs,.actions,.toolbar{display:flex;gap:.35rem;flex-wrap:wrap}.tabs button{flex:1 1 95px}.actions{margin-top:.5rem}.actions button{flex:1 1 165px;text-align:left}.actions button span{display:block}.actions .reason{font-size:.8rem;color:#e9c697}.content{line-height:1.8}.content h2,.content h3{font-size:1.05rem;color:#9edbe5;margin:.3rem 0}.content p{margin:.35rem 0}.content ul{padding-left:1.3rem;margin:.3rem 0}.scroll{max-height:250px;overflow:auto}.log{max-height:150px;overflow:auto}.notice{padding:.4rem .6rem;color:#ffdfa5}.token{display:inline;min-height:0;padding:0;border:0;background:transparent;color:var(--word,#f3e7cb);line-height:2;cursor:pointer}.token:hover,.token:focus-visible{outline:1px solid #9de0eb;background:#304961}ruby{ruby-position:over}rt{font:12px sans-serif;color:#d5f5ff}.order{display:flex;gap:.3rem;overflow:auto}.order span{background:#29445b;padding:.3rem;white-space:nowrap}.unit-grid{display:flex;gap:.4rem;flex-wrap:wrap}.unit{background:#20374b;border:1px solid #a88d6e;padding:.4rem;min-width:130px}.unit strong{color:#a7e0e7}.toolbar button{flex:1}.settings{display:grid;gap:.6rem}label{display:flex;align-items:center;gap:.5rem}input[type=checkbox]{width:20px;height:20px}input[type=file]{max-width:100%}.gba{--frame:#9fc5ca}.gba .frame{background:#173a4b;border:4px solid #e8d2a1;box-shadow:inset 0 0 0 3px #5290a1}.gba button{background:#346478;border:3px solid #e4d49f;box-shadow:2px 2px #09182c}.gba .scene{background:repeating-linear-gradient(90deg,#4a827d 0 20px,#58938a 20px 40px)}.gba .portrait{height:220px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:650px){.app{padding:4px}.layout{grid-template-columns:1fr}.scene{min-height:170px;max-height:220px}.portrait,.gba .portrait{height:170px}.top{font-size:1rem}.tabs{flex-wrap:nowrap;overflow:auto}.tabs button{flex:0 0 auto}.actions button{flex-basis:46%;min-width:0}.main-panel{padding:.5rem}.battle-actions{position:static;max-height:180px;overflow-y:auto;padding:.35rem}.log{max-height:120px}.unit{min-width:110px;flex:1}.order span:nth-child(n+5){display:none}.order.expanded span:nth-child(n+5){display:block}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.gba .order:not(.expanded) span:nth-child(n+5){display:none}

.settings label small{font:12px sans-serif;color:#b8d8df}

.gba button.token{display:inline;min-height:0;padding:0;border:0;background:transparent;box-shadow:none;color:var(--word,#f3e7cb)}
.gba button.token:hover,.gba button.token:focus-visible{background:#304961;outline:1px solid #9de0eb;outline-offset:1px}
.order-label small{display:block;color:#b8d8df;font:12px sans-serif}
