:root{color:#24352e;background:#f5f7f6;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}header{background:#fff;border-bottom:1px solid #cbd5ce;flex-wrap:wrap;gap:24px;padding:16px 24px;display:flex}nav{flex-wrap:wrap;gap:16px;display:flex}a{color:#236146}main{padding:24px}h1{margin:0 0 12px;font-size:24px}#stage{background:#14262b;width:100%;height:400px;position:relative;overflow:hidden}canvas{width:100%;height:100%;display:block}#portrait{z-index:1;text-align:center;color:#e9f0ff;width:136px;height:160px;position:absolute;top:120px;left:32px}#portrait span{background:#263c49;border:2px solid #819cac;border-radius:16px;justify-content:center;align-items:center;width:96px;height:96px;font-size:28px;display:flex;position:absolute;top:16px;left:20px}#speaker{width:136px;font-size:13px;position:absolute;top:128px;left:0}#dialogue{color:#edf3f7;z-index:2;background:#182c36;border:1px solid #536b77;min-height:144px;padding:24px;line-height:1.6;position:absolute;top:120px;left:208px;right:32px}#dialogue p{margin:8px 0 0}#game-button{z-index:2;color:#213b2f;background:#edf3ef;border-radius:5px;width:160px;height:44px;font-weight:600;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#game-button:focus-visible{outline-offset:4px;outline:3px solid #f6c45a}.controls{flex-wrap:wrap;align-items:center;gap:16px;margin:16px 0;display:flex}button,select{font:inherit;background:#fff;border:1px solid #82958a;border-radius:4px;padding:8px 12px}button{cursor:pointer}button:disabled{opacity:.5}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}[hidden]{display:none!important}@media (width<=600px){main,header{padding:14px}h1{font-size:21px}#portrait{top:28px;left:calc(50% - 68px)}#dialogue{padding:16px;font-size:14px;top:216px;left:20px;right:20px}}