*{box-sizing:border-box}:root{--game-aspect: calc(844 / 390)}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;background:#050b14}body{font-family:Inter,system-ui,sans-serif;display:grid;place-items:center}#app{display:grid;place-items:center}canvas{display:block;margin:auto;width:min(100vw,calc(100vh * var(--game-aspect)));height:min(100vh,calc(100vw / var(--game-aspect)));aspect-ratio:var(--game-aspect);border-radius:clamp(10px,1.7vw,18px);touch-action:none;box-shadow:0 0 60px #000000a6}#app.battle-layout-editor-host{display:block;overflow:auto}body:has(#app.battle-layout-editor-host){display:block;overflow:auto}.battle-layout-editor{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;padding:16px;color:#d9e8f7;background:radial-gradient(circle at 18% 18%,rgba(54,118,180,.28),transparent 32%),radial-gradient(circle at 76% 12%,rgba(126,76,180,.18),transparent 30%),#06101c}.battle-layout-editor__workspace,.battle-layout-editor__panel{border:1px solid rgba(128,184,224,.28);border-radius:18px;background:#07121fd1;box-shadow:0 18px 50px #00000059}.battle-layout-editor__workspace{padding:18px}.battle-layout-editor__panel{display:flex;flex-direction:column;gap:12px;padding:16px;overflow:hidden}.battle-layout-editor__header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}.battle-layout-editor__eyebrow{margin:0 0 4px;color:#89b6d9;font-size:11px;letter-spacing:.18em;text-transform:uppercase}.battle-layout-editor h1,.battle-layout-editor h2{margin:0;color:#f2d99c;font-family:Georgia,Times New Roman,serif}.battle-layout-editor h1{font-size:26px}.battle-layout-editor h2{font-size:17px}.battle-layout-editor__actions{display:flex;gap:10px}.battle-layout-editor button{color:#f9e7bb;border:1px solid rgba(236,191,112,.72);border-radius:10px;background:linear-gradient(180deg,#304e69eb,#192a3ef0);font:inherit}.battle-layout-editor__actions button,.battle-layout-editor__inspector button{min-height:36px;padding:0 14px}.battle-layout-editor button:hover{border-color:#ffe096f5;filter:brightness(1.08)}.battle-layout-editor__canvas-shell{width:100%;overflow:auto;padding:12px;border-radius:16px;background:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),#020810c2;background-size:20px 20px}.battle-layout-editor__canvas{position:relative;width:844px;height:390px;max-width:none;border:1px solid rgba(131,190,235,.36);border-radius:14px;overflow:hidden;background:linear-gradient(180deg,#10263feb,#060e1af5),radial-gradient(circle at 32% 52%,rgba(65,114,172,.35),transparent 36%);box-shadow:inset 0 0 0 1px #ffffff0d;touch-action:none}.battle-layout-editor__canvas:before{content:"844 × 390";position:absolute;right:10px;top:8px;color:#dcebff70;font:12px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.battle-layout-editor__canvas:after{content:"手机横版安全区";position:absolute;top:8px;right:8px;bottom:8px;left:8px;display:grid;place-items:center;pointer-events:none;color:#ffe6a56b;border:2px solid rgba(255,222,139,.62);border-radius:12px;box-shadow:inset 0 0 0 1px #ffffff24}.battle-layout-editor__help{margin:12px 0 0;color:#9cb7cc;font-size:13px}.layout-editor-box{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:4px;cursor:move;color:#06101c;border:2px solid rgba(255,255,255,.74);border-radius:8px;background:var(--box-color);box-shadow:0 0 0 1px #00000061,0 8px 24px #00000042;font-weight:800;line-height:1.1;text-align:center;-webkit-user-select:none;user-select:none}.layout-editor-box.is-selected{z-index:20;outline:3px solid rgba(255,225,120,.92);outline-offset:2px}.layout-editor-box__label{max-width:100%;overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.layout-editor-box__meta{opacity:.7;font:10px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.layout-editor-box__handle{position:absolute;right:-4px;bottom:-4px;width:14px;height:14px;cursor:nwse-resize;border:1px solid rgba(4,15,26,.75);border-radius:4px;background:#ffe38d}.battle-layout-editor__list{display:grid;gap:8px;max-height:190px;overflow:auto;padding-right:4px}.layout-editor-list-item{display:grid;grid-template-columns:14px 1fr;gap:8px;align-items:center;min-height:32px;padding:0 10px;text-align:left}.layout-editor-list-item span{width:14px;height:14px;border:1px solid rgba(255,255,255,.7);border-radius:4px}.layout-editor-list-item.is-selected{background:linear-gradient(180deg,#7b5520f2,#483016f2)}.battle-layout-editor__inspector{display:grid;gap:10px;padding-top:4px}.battle-layout-editor__inspector label{display:grid;grid-template-columns:42px 1fr;gap:8px;align-items:center;color:#a9c1d3;font-size:13px}.battle-layout-editor__inspector input{width:100%;min-height:32px;color:#f4e6bf;border:1px solid rgba(128,184,224,.34);border-radius:8px;background:#02080fb8;padding:0 8px}.battle-layout-editor__inspector .danger{color:#ffe1dc;border-color:#ff7060bf;background:linear-gradient(180deg,#802e2df2,#461a1ff2)}.battle-layout-editor__export{flex:1;min-height:180px;resize:none;color:#d8edf9;border:1px solid rgba(128,184,224,.32);border-radius:12px;background:#02080fd1;padding:12px;font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace}@media(max-width:980px){.battle-layout-editor{grid-template-columns:1fr}.battle-layout-editor__panel{min-height:480px}}