:root{--bg:#f4f1ea;--ink:#15141a;--accent:#ff5a7a;--accent-2:#ffb347;--muted:#6b6a73;--line:#ddd8cc;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}a{color:inherit}.site-header{border-bottom:1px solid var(--line);background:var(--bg);align-items:center;gap:1.25rem;padding:.9rem 1.25rem;display:flex}.site-header .brand{align-items:baseline;gap:.35rem;font-size:1.15rem;font-weight:700;text-decoration:none;display:flex}.site-header .brand small{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.65rem;font-weight:500}.site-header nav{flex:1;gap:1rem;display:flex}.site-header nav a{color:var(--muted);font-size:.95rem;text-decoration:none}.site-header nav a.active{color:var(--ink);font-weight:600}.header-actions{align-items:center;gap:.6rem;display:flex}tcc-suite-menu{flex:none;width:36px;height:36px;display:inline-block}.cta,.install-btn{background:var(--ink);color:var(--bg);cursor:pointer;border:none;border-radius:8px;padding:.5rem .9rem;font-size:.9rem;text-decoration:none}.landing main{max-width:860px;margin:0 auto;padding:2.5rem 1.25rem 4rem}.hero h1{margin-bottom:.75rem;font-size:2.3rem;line-height:1.15}.hero .lede{color:#333;max-width:60ch;font-size:1.05rem}.hero-actions{margin:1.5rem 0}.honest-note{color:var(--muted);max-width:60ch;font-size:.9rem}.features{margin-top:3rem}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;padding:0;list-style:none;display:grid}.feature-grid li{border:1px solid var(--line);border-radius:10px;padding:1rem}.feature-grid h3{margin:0 0 .4rem}.feature-grid p{color:#333;margin:0;font-size:.92rem}.honest{border-top:1px solid var(--line);margin-top:3rem;padding-top:1.5rem}.honest p{color:var(--muted);max-width:65ch}.page-simple main{max-width:700px;margin:0 auto;padding:2rem 1.25rem}.site-footer{color:var(--muted);border-top:1px solid var(--line);justify-content:space-between;padding:1.25rem;font-size:.85rem;display:flex}.site-footer nav{gap:1rem;display:flex}.pwa-toast{z-index:1000;background:var(--ink);max-width:min(320px,100vw - 2rem);color:var(--bg);border-radius:10px;align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex;position:fixed;top:4.5rem;right:1rem;box-shadow:0 6px 20px #00000040}.pwa-toast-action{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:.3rem .7rem}.pwa-toast-dismiss{color:var(--bg);cursor:pointer;background:0 0;border:none;font-size:1rem}@media (width<=600px){.site-header{flex-wrap:wrap;gap:.75rem}.site-header .header-actions{margin-left:auto}}.studio{flex-direction:column;height:100%;display:flex}.studio-toolbar{border-bottom:1px solid var(--line);background:#fff;flex-wrap:wrap;align-items:center;gap:.9rem;padding:.6rem 1rem;display:flex}.tool-group{gap:.3rem;display:flex}.tool-group button,.studio-toolbar button,.file-actions button{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:6px;padding:.35rem .7rem;font-size:.85rem}.tool-group button.active{background:var(--ink);color:#fff;border-color:var(--ink)}.tool-color,.tool-size{color:var(--muted);align-items:center;gap:.4rem;font-size:.8rem;display:flex}.project-name{border:1px solid var(--line);border-radius:6px;min-width:160px;padding:.3rem .5rem;font-size:.85rem}.file-actions{flex-wrap:wrap;gap:.4rem;margin-left:auto;display:flex}.btn-export{background:var(--accent);color:#fff;border-color:var(--accent)}.studio-main{flex:1;grid-template-columns:220px 1fr 280px;gap:.75rem;min-height:0;padding:.75rem;display:grid}.panel{border:1px solid var(--line);background:#fff;border-radius:10px;padding:.75rem;overflow:auto}.panel-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.panel-header h2{margin:0;font-size:.95rem}.panel-actions{gap:.3rem;display:flex}.panel-actions button{border:1px solid var(--line);cursor:pointer;background:#fafafa;border-radius:6px;padding:.25rem .45rem;font-size:.72rem}.layer-list{flex-direction:column;gap:.3rem;margin:0;padding:0;list-style:none;display:flex}.layer-list li{border-radius:6px;align-items:center;gap:.3rem;padding:.3rem;display:flex}.layer-list button{cursor:pointer;background:0 0;border:none;font-size:.9rem}.layer-name{background:0 0;border:none;flex:1;min-width:0;font-size:.85rem}.layer-remove{color:var(--accent)}.canvas-wrap{background:#efece3;border-radius:10px;justify-content:center;align-items:center;min-height:0;display:flex;overflow:auto}.canvas-wrap canvas{touch-action:none;background:#fff;max-width:100%;max-height:100%;box-shadow:0 4px 24px #0000001f}.tween-table{border-collapse:collapse;width:100%;font-size:.78rem}.tween-table th,.tween-table td{text-align:left;border-bottom:1px solid var(--line);padding:.25rem .2rem}.timeline-panel{margin:0 .75rem .75rem;padding:.6rem .75rem}.timeline-transport{flex-wrap:wrap;align-items:center;gap:.9rem;margin-bottom:.5rem;font-size:.82rem;display:flex}.timeline-transport label{align-items:center;gap:.3rem;display:flex}.timeline-transport input[type=number]{width:3rem}.timeline-frames{flex-wrap:wrap;gap:.3rem;display:flex}.frame-cell{border:1px solid var(--line);cursor:pointer;background:#fafafa;border-radius:6px;padding:.4rem .7rem;font-size:.8rem;position:relative}.frame-cell.current{background:var(--accent);color:#fff;border-color:var(--accent)}.frame-remove{border:1px solid var(--line);background:#fff;border-radius:50%;width:16px;height:16px;font-size:.65rem;line-height:14px;position:absolute;top:-6px;right:-6px}.frame-add{border:1px dashed var(--line);cursor:pointer;background:#fff;border-radius:6px;padding:.4rem .8rem}.modal-backdrop{z-index:2000;background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:12px;width:min(480px,92vw);max-height:85vh;padding:1.25rem;overflow:auto}.modal-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.modal-header button{cursor:pointer;background:0 0;border:none;font-size:1.2rem}.export-grid{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.export-grid button{border:1px solid var(--line);cursor:pointer;background:#fafafa;border-radius:8px;padding:.6rem}.export-status{color:var(--muted);font-size:.85rem}.export-result{border-top:1px solid var(--line);margin-top:1rem;padding-top:.75rem;font-size:.85rem}.export-result-actions{flex-wrap:wrap;gap:.5rem;margin-top:.5rem;display:flex}.export-result-actions button{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:6px;padding:.35rem .7rem}@media (width<=860px){.studio-main{grid-template-columns:1fr;grid-auto-rows:auto}.canvas-wrap{order:-1;min-height:260px}}.studio{--accent:#ff8529;--bg:#faf7f2;--line:#e7e0d8;background:var(--bg);height:auto;min-height:100vh}.studio .site-header{background:#fcfaf7;padding:14px 20px}.studio .studio-toolbar{background:#fffcf8;gap:10px;padding:12px 18px}.studio-toolbar button,.file-actions button{border-radius:9px;min-height:40px;font-size:12px}.studio-toolbar .btn-export{background:var(--accent);color:#fff;border-color:var(--accent)}.project-name{background:0 0;border-color:#0000;flex:1;min-width:140px;max-width:280px;font-weight:600}.studio-main{grid-template-columns:140px minmax(0,1fr) 310px;align-items:start;gap:12px;min-height:540px}.drawing-tools{border:1px solid var(--line);background:#fffcf9;border-radius:12px;flex-direction:column;gap:20px;padding:12px;display:flex}.drawing-tools .tool-group{flex-direction:column}.drawing-tools button{text-align:left;background:0 0;border:0;border-radius:9px;min-height:44px;padding:10px 12px;font-size:14px}.drawing-tools button.active{color:#9b4300;background:#ff852920}.drawing-tools .tool-color,.drawing-tools .tool-size{flex-wrap:wrap;gap:8px;display:flex}.drawing-tools input[type=range]{width:100%;min-width:0;accent-color:var(--accent)}.drawing-tools input[type=color]{background:0 0;border:0;width:36px;height:36px;padding:0}.canvas-wrap{background:#eee7dc;border:1px solid #e6ded2;border-radius:12px;height:100%;min-height:510px;padding:12px}.canvas-wrap canvas{object-fit:contain;width:100%;height:auto;max-height:600px}.studio-inspector{flex-direction:column;gap:12px;min-width:0;display:flex}.studio-inspector .panel{border-color:var(--line);background:#fffcf9;border-radius:12px}.layer-list li.selected{background:#ff85291a}.panel-actions button{min-height:36px}.layer-list button{min-width:32px;min-height:36px}.layer-name{min-height:36px}.tween-panel{overflow-x:auto}.tween-table{font-size:11px}.tween-table input,.tween-table select{border:1px solid var(--line);background:#fff;border-radius:5px;max-width:85px;min-height:30px;font-size:11px}.tween-table input[type=number]{width:55px}.timeline-panel{background:#fffcf9;border-radius:12px;padding:14px}.timeline-transport{gap:16px}.timeline-transport button,.timeline-transport select,.timeline-transport input[type=number]{border:1px solid var(--line);background:#fff;border-radius:7px;min-height:36px;padding:5px 9px}.timeline-frames{flex-wrap:nowrap;gap:10px;padding:10px 3px;overflow-x:auto}.frame-item{flex:0 0 105px;position:relative}.frame-cell{text-align:left;background:#fff;border-radius:9px;gap:6px;width:100%;padding:8px;display:grid}.frame-cell canvas{object-fit:contain;background:#fff;border-radius:4px;width:100%;height:54px}.frame-cell.current{color:#9b4300;border:2px solid var(--accent);background:#fff0e2}.frame-remove{cursor:pointer;width:24px;height:24px;font-size:15px;top:-7px;right:-5px}.frame-add{color:#9b4300;background:#fff8f1;min-width:80px}.studio button:disabled{opacity:.4;cursor:not-allowed}.studio input[type=checkbox]{accent-color:var(--accent)}@media (width<=1100px){.studio-main{grid-template-columns:105px minmax(0,1fr) 280px;min-height:420px}.canvas-wrap{min-height:360px;padding:7px}.drawing-tools{padding:8px}}@media (width<=860px){.studio-main{flex-direction:column;min-height:0;display:flex}.drawing-tools{flex-flow:wrap;order:0;align-items:center;gap:14px;width:100%}.drawing-tools .tool-group{flex-direction:row}.drawing-tools .tool-size{max-width:165px}.drawing-tools .tool-color{gap:6px}.canvas-wrap{order:1;width:100%;min-height:230px}.studio-inspector{order:2;grid-template-columns:1fr 1fr;width:100%;display:grid}.file-actions{margin-left:0}.studio-toolbar{align-items:flex-start}.timeline-panel{margin-bottom:20px}.timeline-transport{gap:10px}.frame-item{flex-basis:85px}}@media (width<=500px){.studio-inspector{grid-template-columns:1fr}.studio .site-header{flex-wrap:wrap;padding:12px}.studio .site-header nav{flex-wrap:wrap;gap:10px}.studio-main{padding:8px}.canvas-wrap{min-height:190px}.studio .studio-toolbar{padding:10px}.file-actions{gap:6px}.file-actions button{min-height:44px}.drawing-tools button{font-size:12px}.timeline-panel{margin:0 8px 18px}.project-name{width:100%;max-width:none}.modal{width:94vw}.timeline-transport input[type=number]{width:48px}}
