:root,[data-theme=dark]{--bg: #0b0b0b;--bg-elevated: #1a1a1a;--bg-panel: #1e1e1e;--border: #2a2a2a;--text: #ffffff;--text-dim: #888888;--accent: #E1FF3F;--accent-hot: #d4e535;--danger: #FF6B6B;--radius: 12px;--radius-sm: 8px;--shadow: 0 4px 24px rgba(0, 0, 0, .35);--canvas-bg: radial-gradient(circle at 50% 30%, #1a1a24 0, #0d0d0f 60%);--btn-hover: #25252c;--chip-bg: var(--bg-panel);--overlay-bg: rgba(0,0,0,.65);--overlay-text: #fff;color-scheme:dark}[data-theme=light]{--bg: #f2f2f7;--bg-elevated: #ffffff;--bg-panel: #f8f8fa;--border: #d1d1d6;--text: #1c1c1e;--text-dim: #6e6e73;--accent: #34C759;--accent-hot: #2db84e;--danger: #FF3B30;--radius: 12px;--radius-sm: 8px;--shadow: 0 4px 24px rgba(0, 0, 0, .1);--canvas-bg: radial-gradient(circle at 50% 30%, #e8e8ef 0, #d8d8e0 60%);--btn-hover: #e0e0e5;--chip-bg: #eaeaef;--overlay-bg: rgba(0,0,0,.55);--overlay-text: #fff;color-scheme:light}*{box-sizing:border-box}.slides-row::-webkit-scrollbar{display:none}html,body,#root{height:100%;margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased;overscroll-behavior:none;touch-action:manipulation}button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}.app{display:flex;flex-direction:column;height:100%;min-height:0}.topbar{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--bg-elevated);border-bottom:1px solid var(--border);flex-shrink:0}.topbar h1{font-size:16px;margin:0;font-weight:600}.topbar .spacer{flex:1}.topbar .icon-btn{width:36px;height:36px;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;background:var(--bg-panel);border:1px solid var(--border)}.topbar .icon-btn:disabled{opacity:.4;cursor:not-allowed}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:var(--radius-sm);background:var(--bg-panel);border:1px solid var(--border);transition:background .15s,transform .05s;text-align:center}.btn:hover{background:var(--btn-hover)}.btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#000}.btn.primary:hover{background:var(--accent-hot)}.btn.danger{color:var(--danger)}.screen{flex:1;display:flex;min-height:0}@media (max-width: 800px){.screen{flex-direction:column}}.canvas-area{flex:1;display:flex;align-items:center;justify-content:center;padding:16px;min-width:0;min-height:0;background:var(--canvas-bg, radial-gradient(circle at 50% 30%, #1a1a24 0, #0d0d0f 60%))}.panel{width:320px;padding:16px;background:var(--bg-elevated);border-left:1px solid var(--border);overflow-y:auto;overflow-x:hidden;flex-shrink:0}@media (max-width: 800px){.panel{width:100%;border-left:none;border-top:1px solid var(--border);max-height:45vh}}.panel h3{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin:20px 0 8px}.panel h3:first-child{margin-top:0}.row{display:flex;flex-wrap:wrap;gap:6px}.chip{padding:6px 10px;border-radius:999px;background:var(--bg-panel);border:1px solid var(--border);font-size:12px}.chip.active{background:var(--accent);border-color:var(--accent);color:#0b0b0b}.slider-row{display:flex;align-items:center;gap:6px;margin:8px 0;font-size:12px;color:var(--text-dim)}.slider-row label{width:66px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slider-row input[type=range]{flex:1;min-width:0;accent-color:var(--accent)}.slider-row .val{width:38px;flex-shrink:0;text-align:right;color:var(--text);font-variant-numeric:tabular-nums}.home{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:24px;max-width:960px;margin:0 auto;width:100%}.home .card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);padding:24px;text-align:left;cursor:pointer;transition:transform .1s,border-color .15s}.home .card:hover{border-color:var(--accent);transform:translateY(-2px)}.home .card .emoji{font-size:32px;margin-bottom:8px}.home .card h2{margin:0 0 6px;font-size:18px}.home .card p{margin:0;color:var(--text-dim);font-size:13px;line-height:1.4}.canvas-stage{position:relative;background:#000;box-shadow:var(--shadow);max-width:100%;max-height:100%;overflow:hidden;touch-action:none}.canvas-stage canvas{display:block;touch-action:none;user-select:none}.slice-lines{position:absolute;inset:0;pointer-events:none}.slice-lines div{position:absolute;top:0;bottom:0;width:2px;background:#ffffffd9;box-shadow:0 0 0 1px #0006}.dialog-backdrop{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:9999;backdrop-filter:blur(4px)}.dialog{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);padding:24px;width:min(440px,92vw);box-shadow:var(--shadow)}.dialog h2{margin:0 0 16px;font-size:18px}.dialog .actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;height:100%;color:var(--text-dim)}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;padding:24px;overflow-y:auto;width:100%}.projects-grid .proj{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}.projects-grid .proj img{width:100%;aspect-ratio:1 / 1;object-fit:cover;background:#000}.projects-grid .proj .meta{padding:10px 12px;font-size:13px;display:flex;justify-content:space-between;align-items:center}.projects-grid .proj .name{font-weight:500}.projects-grid .proj .kind{color:var(--text-dim);font-size:11px;text-transform:uppercase}.projects-grid .proj .row2{display:flex;border-top:1px solid var(--border)}.projects-grid .proj .row2 button{flex:1;padding:8px;font-size:12px}.projects-grid .proj .row2 button+button{border-left:1px solid var(--border)}.free-canvas{position:relative;background:#000;box-shadow:var(--shadow);overflow:hidden;touch-action:none;user-select:none}.free-item{position:absolute;transform-origin:center center;user-select:none;touch-action:none;will-change:transform}.free-item.selected{outline:2px solid var(--accent);outline-offset:2px}.free-item img{display:block;width:100%;height:100%;pointer-events:none}