@import url('/overlay.css');
*{box-sizing:border-box}html,body{margin:0;overflow:auto;background:#f7f7f7!important;color:#222;font:14px/1.4 Arial,sans-serif}main{max-width:960px;margin:24px auto;padding:0 16px}button,input,select{font:inherit}button,.file-button{display:inline-block;background:#fff;color:#222;border:1px solid #aaa;border-radius:3px;padding:8px 12px;cursor:pointer;text-decoration:none}button:hover,.file-button:hover{background:#eee}button:disabled{opacity:.4;cursor:default}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}#cat-count{margin-left:4px;color:#555}#connection{margin-left:auto;color:#666;font-size:12px}#connection.offline{color:#a00}.instructions{margin:12px 0;color:#555;font-size:13px}#editor{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:12px 0}#editor>span{margin-right:8px}#save-layout{background:#222;color:#fff;border-color:#222}#layout-validation{width:100%;font-size:12px;color:#a00}#layout-validation.valid{display:none}#layout-validation ul{margin:4px 0}#viewport{overflow:auto;border:1px solid #bbb;background:#e8e8e8}#stage-space{position:relative;margin:auto}#stage{position:absolute;top:0;left:0;transform-origin:0 0;overflow:hidden;background-color:#eee;background-image:linear-gradient(45deg,#e4e4e4 25%,transparent 25%),linear-gradient(-45deg,#e4e4e4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e4e4e4 75%),linear-gradient(-45deg,transparent 75%,#e4e4e4 75%);background-size:40px 40px;background-position:0 0,0 20px,20px -20px,-20px 0}#scene-background{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}#stage #cat-layer .cat{pointer-events:auto;cursor:grab;touch-action:none}#guides{pointer-events:none}#guides .slot-guide,#guides .zone-guide{pointer-events:auto;touch-action:none;cursor:grab}#guides .slot-guide{border:1px dashed #555}#guides .slot-guide img{opacity:1}#guides .slot-guide span{font:16px Arial;background:#333;color:#fff;border-radius:0;padding:2px 4px;top:0;left:0}#guides .selected{outline:2px solid #333}#guides .invalid{border-color:#a00}#settings{margin-top:16px;border-top:1px solid #ddd;padding:12px 0}summary{cursor:pointer;width:fit-content}#settings[open]>summary{margin-bottom:16px}.fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:12px;max-width:700px}.fields label{font-size:12px}.fields input{display:block;width:100%;margin-top:4px}input[type=number],select{padding:6px;border:1px solid #aaa;background:#fff;color:#222;min-width:0}.file-button input{display:none}.file-button{margin:8px 0}.toolbar,.selection,.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0}.selection input{width:85px}.selection label{display:flex;align-items:center;gap:4px}h3{font-size:14px;margin:22px 0 8px;font-weight:600}code{display:block;font:12px monospace;margin:8px 0;overflow-wrap:anywhere}#notice{font-size:13px;padding:8px;border:1px solid #b99;background:#fff3f3;margin-bottom:12px}#notice.good{border-color:#bbb;background:#fff}[hidden]{display:none!important}@media(max-width:600px){main{margin-top:12px}.fields{grid-template-columns:1fr 1fr}button{padding:9px}#connection{margin-left:0;width:100%}}

#slot-sizes{border:1px solid #ccc;background:#fff;padding:12px;margin:10px 0}.size-row{display:flex;align-items:center;gap:10px;margin:10px 0;max-width:600px}.size-row label{width:85px;flex-shrink:0}.size-row input[type=range]{flex:1;min-width:60px;accent-color:#333}.size-row input[type=number]{width:78px}#slot-sizes small{display:block;color:#666;margin-top:8px}#default-slot-sizes{font-size:12px;padding:5px 8px}