:root{--bg-dark: #0b0f0e;--bg-panel: #131a17;--bg-surface: #1a2320;--bg-card: #202b27;--bg-hover: #293833;--border: #2c3c35;--border-focus: #10b981;--text-main: #f0fdf4;--text-muted: #8e9f99;--primary: #10b981;--primary-hover: #059669;--accent-gold: #f59e0b;--accent-blue: #0ea5e9;--accent-purple: #8b5cf6;--danger: #ef4444;--danger-hover: #dc2626;--font-mono: "JetBrains Mono", "Fira Code", monospace;--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none}body.criador-app{width:100vw;height:100vh;overflow:hidden;background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-sans);display:flex;flex-direction:column}#criador-header{height:54px;background:var(--bg-panel);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 16px;gap:12px;z-index:50;flex-shrink:0}.header-brand{display:flex;align-items:center;gap:8px;color:#fff;font-size:15px;font-weight:700;letter-spacing:-.2px}.header-brand svg{color:var(--primary);width:22px;height:22px}.header-brand .badge{font-size:10px;background:#10b98126;color:var(--primary);border:1px solid rgba(16,185,129,.4);padding:2px 7px;border-radius:4px;font-family:var(--font-mono);font-weight:600;text-transform:uppercase}.header-image-select,.header-theme-select{display:flex;align-items:center;gap:8px;font-size:12px}.header-image-select label,.header-theme-select label{color:var(--text-muted);display:inline-flex;align-items:center;gap:4px}.header-image-select label svg,.header-theme-select label svg{width:14px;height:14px}select{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border);border-radius:6px;padding:5px 10px;font-size:12px;outline:none;cursor:pointer;transition:border-color .15s}select:focus{border-color:var(--border-focus)}.header-image-select button{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border);border-radius:6px;padding:5px 10px;font-size:12px;display:inline-flex;align-items:center;gap:5px;cursor:pointer;transition:all .15s}.header-image-select button:hover{background:var(--bg-hover);border-color:#44564f}.header-view-modes{display:flex;align-items:center;background:var(--bg-dark);border:1px solid var(--border);border-radius:8px;padding:3px;gap:3px}.mode-btn{background:transparent;color:var(--text-muted);border:none;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:all .15s ease}.mode-btn svg{width:14px;height:14px}.mode-btn:hover{color:var(--text-main);background:var(--bg-surface)}.mode-btn.active{background:var(--bg-card);color:#fff;box-shadow:0 1px 4px #0006}.mode-btn.play{background:#10b9812e;color:var(--primary);font-weight:700}.mode-btn.play:hover,.mode-btn.play.active{background:var(--primary);color:#000}.header-actions{display:flex;align-items:center;gap:6px}.header-actions button{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border);border-radius:6px;padding:6px 10px;font-size:12px;display:inline-flex;align-items:center;gap:5px;cursor:pointer;transition:all .15s}.header-actions button svg{width:14px;height:14px}.header-actions button:hover{background:var(--bg-hover);border-color:#4b5d55}.header-actions button.primary{background:#1e3a8a;border-color:#3b82f6;color:#dbeafe;font-weight:600}.header-actions button.primary:hover{background:#2563eb;color:#fff}.header-actions button.limiar{background:#064e3b;border-color:#10b981;color:#a7f3d0;font-weight:600}.header-actions button.limiar:hover{background:#059669;color:#fff}#criador-main{flex:1;display:flex;position:relative;overflow:hidden}#draw-toolbar{width:240px;background:var(--bg-panel);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:12px;gap:12px;overflow-y:auto;z-index:20;flex-shrink:0}.brush-size-panel{padding:8px!important}.brush-size-group{display:flex;gap:6px;margin-top:4px}.size-btn{flex:1;background:var(--bg-card);border:1px solid var(--border);color:var(--text-muted);padding:5px 0;font-size:11px;font-weight:600;border-radius:4px;cursor:pointer;transition:all .15s}.size-btn:hover{background:var(--bg-hover);color:var(--text-main)}.size-btn.active{background:var(--primary);color:#000;font-weight:700;border-color:var(--primary)}.tool-group{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.tool-btn{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border);border-radius:6px;padding:8px 4px;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;transition:all .15s ease}.tool-btn svg{width:16px;height:16px;color:var(--text-muted)}.tool-btn:hover{background:var(--bg-hover);border-color:#44564e}.tool-btn:hover svg{color:var(--text-main)}.tool-btn.active{background:#10b98133;border-color:var(--primary);color:#fff}.tool-btn.active svg{color:var(--primary)}.tool-btn.danger.active{background:#ef444440;border-color:var(--danger)}.tool-btn.danger.active svg{color:var(--danger)}.tool-subpanel{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:8px}.tool-subpanel label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;display:flex;justify-content:space-between}.tool-subpanel .subpanel-buttons{display:flex;flex-direction:column;gap:4px}.sub-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text-main);padding:6px 8px;font-size:11px;border-radius:4px;cursor:pointer;text-align:left;transition:all .15s}.sub-btn:hover{background:var(--bg-hover)}.sub-btn.active{background:var(--primary);color:#000;font-weight:700}.prop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.prop-item-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text-muted);padding:6px 2px;border-radius:6px;font-size:10px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:all .15s}.prop-item-btn svg{width:14px;height:14px}.prop-item-btn:hover{background:var(--bg-hover);color:var(--text-main)}.prop-item-btn.active{background:#f59e0b40;border-color:var(--accent-gold);color:#fff;font-weight:600}.prop-item-btn.active svg{color:var(--accent-gold)}.prop-rotation-row button{width:100%;display:flex;align-items:center;justify-content:center;gap:6px}.prop-rotation-row svg{width:14px;height:14px}.light-palette{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.color-dot{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .15s}.color-dot:hover{transform:scale(1.15)}.color-dot.active{border-color:#fff;box-shadow:0 0 6px currentColor}#light-custom-color{width:24px;height:24px;border:none;background:transparent;cursor:pointer}.check-label{font-size:11px;color:var(--text-main);display:flex;align-items:center;gap:6px;cursor:pointer}#wall-options input[type=range]{width:100%;accent-color:var(--primary)}#viewport-container{flex:1;position:relative;overflow:hidden;background:#080c0a}#three-canvas{width:100%;height:100%;display:block;outline:none}.floating-panel{position:absolute;top:16px;left:16px;width:280px;background:#141b18f2;border:1px solid var(--border-focus);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:8px;padding:14px;z-index:40;box-shadow:0 8px 32px #0009}.floating-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-size:13px}.floating-header strong{display:flex;align-items:center;gap:6px;color:var(--primary)}.floating-header svg{width:16px;height:16px}.close-btn{background:transparent;border:none;color:var(--text-muted);cursor:pointer;font-size:14px}.close-btn:hover{color:#fff}.floating-body p{font-size:11px;color:var(--text-muted);margin-bottom:8px;line-height:1.4}.trace-actions{margin-top:12px}.trace-actions button{width:100%;text-align:center}#cursor-hud{position:absolute;bottom:16px;left:16px;background:#121916e6;border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:6px 14px;border-radius:6px;display:flex;gap:16px;font-size:12px;font-family:var(--font-mono);color:var(--text-muted);pointer-events:none;z-index:10}#cursor-hud span{display:inline-flex;align-items:center}#hud-coord{color:var(--primary);font-weight:600}#hud-tool{color:#fff}#hud-theme{color:var(--accent-gold)}#play-hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:24px;z-index:30}#play-hud[hidden]{display:none}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:26px;color:#ffffffd9;font-weight:300;pointer-events:none}#play-instructions{background:#0d1110eb;border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:8px;padding:10px 20px;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:var(--text-muted);box-shadow:0 4px 20px #00000080}#play-instructions strong{color:var(--primary);font-size:13px;letter-spacing:1px}#play-instructions b{color:#ffd24d}#btn-exit-play{pointer-events:auto;background:#ef4444e6;color:#fff;border:none;border-radius:6px;padding:8px 18px;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;box-shadow:0 4px 12px #ef444466}#btn-exit-play:hover{background:var(--danger);transform:translateY(-1px)}#side-panel{width:250px;background:var(--bg-panel);border-left:1px solid var(--border);display:flex;flex-direction:column;padding:14px;gap:14px;overflow-y:auto;z-index:20;flex-shrink:0}.panel-section{display:flex;flex-direction:column;gap:10px;border-bottom:1px solid var(--border);padding-bottom:14px}.panel-section h3{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);display:flex;align-items:center;gap:6px}.panel-section h3 svg{width:14px;height:14px;color:var(--primary)}.field-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px}.field-row label{color:var(--text-muted);display:inline-flex;align-items:center;gap:6px}.field-row input[type=number],.field-row select{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border);border-radius:4px;padding:4px 8px;font-size:12px;width:100px}.field-row input[type=range]{flex:1;accent-color:var(--primary)}.stats-list{list-style:none;display:flex;flex-direction:column;gap:6px;font-size:12px}.stats-list li{display:flex;justify-content:space-between;color:var(--text-muted)}.stats-list li strong{color:var(--text-main);font-family:var(--font-mono)}.help-section{border-bottom:none}.help-section p{font-size:11px;line-height:1.5;color:var(--text-muted)}.help-section b{color:var(--text-main)}.toast{position:fixed;bottom:24px;right:24px;background:var(--bg-surface);border:1px solid var(--primary);color:#fff;padding:10px 18px;border-radius:6px;font-size:13px;opacity:0;transform:translateY(10px);transition:all .25s ease;pointer-events:none;z-index:100;box-shadow:0 6px 24px #000000b3}.toast.visible{opacity:1;transform:translateY(0)}