:root{color-scheme:dark;--bg: #0e0e10;--panel: #16161a;--line: #26262d;--line-soft: #202027;--text: #e6e6ea;--muted: #9a9aa2;--accent: #f0803c}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:400 13px/1.45 system-ui,sans-serif;font-family:var(--font-family, system-ui, sans-serif);font-size:var(--font-size, 13px);overflow:hidden}body{position:relative;height:100vh}main{position:absolute;inset:0;min-width:0}.canvas-box{position:relative;width:100%;height:100%}canvas[data-canvas-3d]{display:block;width:100%;height:100%}.hint{position:absolute;left:50%;bottom:1.5rem;transform:translate(-50%);margin:0;padding:.5rem .9rem;border-radius:8px;color:var(--muted);background:var(--glass, rgba(20, 20, 24, .7));backdrop-filter:blur(6px);pointer-events:none;user-select:none}.hint code{color:var(--text);background:#80808029;padding:0 .3em;border-radius:4px}.sidebar{position:fixed;top:14px;right:calc(14px + env(safe-area-inset-right,0px));width:var(--panel-w, 300px);max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 32px #00000059;overflow:hidden;z-index:4;transform:translate(0);transition:transform .22s ease-out}body[data-panel-closed] .sidebar{transform:translate(calc(100% + 28px))}body[data-panel=left] .sidebar{left:calc(14px + env(safe-area-inset-left,0px));right:auto}body[data-panel=left][data-panel-closed] .sidebar{transform:translate(calc(-100% - 28px))}.sidebar-header{position:relative;flex:0 0 auto;display:flex;align-items:center;height:38px;padding:0 40px;border-bottom:1px solid var(--line-soft)}.sidebar-title{flex:1 1 auto;min-width:0;font-size:12px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-title:empty{display:none}.sidebar-collapse,.sidebar-close{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;color:var(--muted);border-radius:6px;cursor:pointer;transition:background .12s,color .12s}.sidebar-collapse{left:6px}.sidebar-close{right:6px;font-size:15px;line-height:1}.sidebar-collapse:hover,.sidebar-close:hover{background:var(--line-soft);color:var(--text)}.sidebar-collapse svg{width:16px;height:16px;transition:transform .16s ease-out}body[data-panel-collapsed] .sidebar-collapse svg{transform:rotate(-90deg)}.sidebar-body{flex:1 1 auto;min-height:0;overflow-y:auto}body[data-panel-collapsed] .sidebar-body{display:none}.sidebar-handle{position:fixed;top:14px;right:calc(14px + env(safe-area-inset-right,0px));width:32px;height:32px;display:none;align-items:center;justify-content:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 16px #0000004d;color:var(--muted);cursor:pointer;z-index:4;transition:color .12s}.sidebar-handle svg{width:18px;height:18px}.sidebar-handle:hover{color:var(--text)}body[data-panel-closed] .sidebar-handle{display:flex}body[data-panel=left] .sidebar-handle{left:calc(14px + env(safe-area-inset-left,0px));right:auto;transform:scaleX(-1)}.tool-panel{padding:.9rem}.tool-panel h3{display:flex;align-items:center;justify-content:space-between;margin:0 0 .8rem;font-size:14px;font-weight:600}.tool-panel-body{display:flex;flex-direction:column;gap:.7rem}.menu-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#6d6d76;margin-top:.2rem}.panel-hint{margin:.2rem 0;color:var(--muted);font-size:12px}.bg-image-actions{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.decals-upload-row{margin-top:.15rem}.bg-image-upload{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px dashed var(--line);border-radius:7px;color:var(--muted);cursor:pointer}.bg-image-upload:hover{color:var(--text);border-color:#3a3a44}.decals-upload-label{color:var(--muted);cursor:pointer;font-size:12px}.env-row{display:flex;align-items:center;gap:.5rem;padding:.35rem;border:1px solid transparent;border-radius:7px;cursor:pointer;width:100%;box-sizing:border-box}.env-row:hover{background:var(--line-soft)}.env-row[data-on=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.bg-image-thumb{flex:0 0 auto;width:34px;height:34px;border-radius:5px;overflow:hidden;background:#0c0c0f conic-gradient(from 45deg,#1b1b20 25%,#141418 0 50%,#1b1b20 0 75%,#141418 0) 0 0 / 12px 12px;display:grid;place-items:center}.bg-image-thumb img{max-width:100%;max-height:100%;object-fit:contain}.env-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.env-row-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.env-pill-row{display:flex}.env-pill{font:10px/1.3 ui-monospace,monospace;color:#6d6d76}.env-del,.decals-row-del{flex:0 0 auto;width:22px;height:22px;border:0;background:transparent;color:var(--muted);font-size:15px;line-height:1;border-radius:5px;cursor:pointer}.env-del:hover,.decals-row-del:hover{background:#ff5a5a26;color:#ff8a8a}.decals-controls{display:flex;flex-direction:column;gap:.5rem;padding:.6rem;border:1px solid var(--line);border-radius:8px;background:#ffffff05}.param-row{display:flex;align-items:center;gap:.5rem}.param-row>label{flex:0 0 62px;color:var(--muted);font-size:12px}.param-row input[type=range]{flex:1;min-width:0;accent-color:var(--accent)}.param-row input[type=number]{width:56px;background:#101014;border:1px solid var(--line);border-radius:5px;color:var(--text);padding:.25rem .35rem;font:inherit}.param-row .unit{color:var(--muted);font-size:12px}.chk-row{display:flex;align-items:center;gap:.45rem;color:var(--muted);font-size:12px;cursor:pointer}.chk-row input{accent-color:var(--accent)}.decals-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}.decals-row{display:flex;align-items:center;gap:.5rem;padding:.35rem;border:1px solid transparent;border-radius:7px;cursor:pointer}.decals-row:hover{background:var(--line-soft)}.decals-row[data-on=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.decals-row-thumb{flex:0 0 auto;width:30px;height:30px;border-radius:5px;overflow:hidden;background:#0c0c0f;display:grid;place-items:center}.decals-row-thumb img{max-width:100%;max-height:100%;object-fit:contain}.decals-row-name{flex:1;min-width:0;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.materials-panel,.scene-panel{border-top:1px solid var(--line)}body[data-hide-spotlight] .scene-panel{display:none}.scene-panel .param-row input[type=range],.materials-panel .param-row input[type=range]{flex:1;min-width:0;accent-color:var(--accent)}.mat-strip{display:flex;flex-wrap:wrap;gap:6px}.mat-chip{padding:.32rem .6rem;background:transparent;border:1px solid var(--line);border-radius:6px;color:var(--muted);font:inherit;font-size:12px;line-height:1.2;cursor:pointer;transition:color .12s,border-color .12s,background .12s,box-shadow .12s}.mat-chip:hover{color:var(--text);background:var(--line-soft)}.mat-chip[data-on=true]{color:var(--text);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatch{width:26px;height:26px;flex-shrink:0;padding:0;border:none;border-radius:6px;cursor:pointer;box-shadow:inset 0 0 0 1px #00000059,0 0 0 1px #ffffff38;transition:transform .12s cubic-bezier(.4,0,.2,1),box-shadow .12s}.swatch:hover{transform:scale(1.08);box-shadow:inset 0 0 0 1px #00000059,0 0 0 2px var(--accent)}.tex-swatch{background-size:cover;background-position:center;background-repeat:no-repeat}.swatch-none{display:grid;place-items:center;background:var(--line-soft);color:var(--muted);font-size:14px}.mat-reset{align-self:flex-start;background:#1d1d22;border:1px solid var(--line);border-radius:6px;color:var(--muted);padding:.35rem .6rem;font:inherit;cursor:pointer}.mat-reset:hover{color:var(--text)}body[data-panel=hidden] .sidebar,body[data-panel=hidden] .sidebar-handle,body[data-off-stickers][data-off-colours][data-hide-spotlight] .sidebar,body[data-off-stickers][data-off-colours][data-hide-spotlight] .sidebar-handle,body[data-off-stickers] .decals-panel,body[data-off-colours] .materials-panel{display:none}body[data-off-stickers] .materials-panel,body[data-off-stickers][data-off-colours] .scene-panel{border-top:0}body[data-off-library] [data-decals-upload-grid],body[data-off-library] [data-decals-empty-library],body[data-off-upload] .decals-upload-row,body[data-off-library][data-off-upload] [data-decals-lib-label],body[data-off-library][data-off-upload] .decals-image-row,body[data-off-size] [data-decals-row-size],body[data-off-rotation] [data-decals-row-rotation],body[data-off-snap] [data-decals-row-snap],body[data-off-size][data-off-rotation][data-off-snap] [data-decals-controls],body[data-off-placed] [data-decals-list],body[data-off-placed] [data-decals-list-label],body[data-off-reset] [data-mat-reset]{display:none}body:not([data-show-numeric]) .param-row input[type=number]{display:none}body:not([data-show-degrees]) .param-row .unit{display:none}body:not([data-show-roughness]) [data-mat-row-rough]{display:none}body:not([data-show-metalness]) [data-mat-row-metal]{display:none}body[data-bg-transparent] .sidebar{color-scheme:dark}body[data-canvas-fixed] main{display:grid;place-items:center}body[data-canvas-fixed] .canvas-box{width:var(--canvas-w, 100%);height:var(--canvas-h, 100%);max-width:100%;max-height:100%}.view-toolbar,body.inni-readonly .sidebar,body.inni-readonly .sidebar-handle{display:none}body.inni-readonly .view-toolbar{display:flex;align-items:center;gap:.7rem;position:absolute;left:50%;bottom:1.5rem;transform:translate(-50%);padding:.4rem .5rem .4rem .85rem;border-radius:10px;background:var(--glass, rgba(20, 20, 24, .82));border:1px solid var(--line);backdrop-filter:blur(8px)}.view-readout{font-size:12px;color:var(--muted);white-space:nowrap}.view-presets{display:flex;gap:.3rem}.view-presets button{background:var(--panel);border:1px solid var(--line);border-radius:6px;color:var(--text);padding:.35rem .55rem;font:12px/1 system-ui,sans-serif;font-family:var(--font-family, system-ui, sans-serif);cursor:pointer}.view-presets button:hover{background:var(--line-soft)}
