*{box-sizing:border-box;margin:0;padding:0}body{color:#3c3c3c;background:#f0f0f0;height:100vh;font-family:Feather Bold,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}.app-header{background:#fff;border-bottom:2px solid #e5e5e5;flex-shrink:0;justify-content:space-between;align-items:center;height:42px;padding:0 18px;display:flex}.app-title{color:#3c3c3c;font-size:15px;font-weight:800}.dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.dot.ok{background:#58cc02}.dot.wait{background:#ffc107}.btn{cursor:pointer;border:none;border-radius:10px;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:700;transition:all .12s}.btn-primary{color:#fff;background:#58cc02;border-bottom:3px solid #46a302}.btn-primary:hover{background:#4cb000}.btn-secondary{color:#3c3c3c;background:#e5e5e5;border-bottom:3px solid #d1d1d1}.btn-secondary:hover{background:#dadada}.btn-danger{color:#b3261e;background:#ffdfdf;border-bottom:3px solid #efc4c4}.btn-danger:hover{background:#ffd2d2}.btn:disabled{opacity:.48;cursor:not-allowed;transform:none}.main-layout{background:#f0f0f0;grid-template-columns:92px minmax(360px,1fr) minmax(420px,50%);gap:16px;height:calc(100vh - 42px);padding:16px;display:grid;overflow:hidden}.tool-rail{background:#fff;border-radius:16px;flex-direction:column;align-items:stretch;gap:10px;padding:12px 10px;display:flex;overflow-y:auto;box-shadow:0 2px 12px #00000014}.tool-rail .btn{width:100%;padding:9px 8px;font-size:12px;line-height:1.15}.tool-spacer{flex:1;min-height:6px}.preview-panel{border-radius:20px;justify-content:center;align-items:center;min-width:0;transition:background-color .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 2px 12px #00000014}.preview-panel canvas{background:0 0;max-width:100%;max-height:100%}.preview-status{color:#52656d;pointer-events:none;background:#ffffffe0;border-radius:999px;align-items:center;gap:7px;min-height:28px;padding:6px 10px;font-size:12px;font-weight:800;display:inline-flex;position:absolute;top:12px;right:12px;box-shadow:0 1px 8px #00000014}.history-controls{z-index:5;gap:8px;display:flex;position:absolute;top:12px;left:12px}.icon-btn{color:#3c3c3c;cursor:pointer;background:#ffffffe6;border:0;border-radius:999px;justify-content:center;align-items:center;width:34px;height:34px;transition:transform .12s,opacity .12s;display:inline-flex;box-shadow:0 1px 8px #0000001a}.icon-btn:hover{transform:translateY(-1px)}.icon-btn:disabled{opacity:.38;cursor:not-allowed;transform:none}.icon-btn svg{width:19px;height:19px}.options-panel{background:#fff;border-radius:20px;flex-direction:column;min-width:0;display:flex;overflow:hidden;box-shadow:0 2px 12px #00000014}.tab-bar{scrollbar-width:none;background:#fff;border-bottom:2px solid #e5e5e5;flex-shrink:0;justify-content:center;display:flex;overflow-x:auto}.tab-bar::-webkit-scrollbar{height:0}.tab-btn{cursor:pointer;background:0 0;border:none;border-bottom:3px solid #0000;flex-direction:column;flex:none;align-items:center;gap:3px;min-width:64px;margin-bottom:-2px;padding:10px 16px 8px;transition:all .15s;display:flex}.tab-btn img{opacity:.45;width:34px;height:34px;transition:opacity .15s}.tab-btn .tab-icon-text{color:#52656d;opacity:.45;justify-content:center;align-items:center;width:34px;height:34px;font-size:22px;font-weight:800;transition:opacity .15s,color .15s;display:flex}.tab-btn .tab-label{color:#52656d;font-size:12px;font-weight:700;transition:color .15s}.tab-btn:hover img{opacity:.7}.tab-btn:hover .tab-icon-text{opacity:.7;color:#8a9ba8}.tab-btn:hover .tab-label{color:#8a9ba8}.tab-btn.active{border-bottom-color:#1cb0f6}.tab-btn.active img{opacity:1}.tab-btn.active .tab-icon-text{opacity:1;color:#1cb0f6}.tab-btn.active .tab-label{color:#1cb0f6}.options-scroll{flex:1;padding:24px 28px;overflow-y:auto}.options-scroll::-webkit-scrollbar{width:5px}.options-scroll::-webkit-scrollbar-thumb{background:#d1d1d1;border-radius:3px}.mode-generate .tab-bar,.mode-generate .thumb-status,.mode-generate #tabContent,.generate-scroll{display:none}.mode-generate .generate-scroll{display:block}.tab-panel{display:none}.tab-panel.active{display:block}.section{margin-bottom:28px}.section-header{color:#3c3c3c;margin-bottom:14px;font-size:16px;font-weight:800}.swatch-grid{flex-wrap:wrap;gap:11px;display:flex}.swatch{cursor:pointer;border:3px solid #e5e5e5;border-radius:50%;flex-shrink:0;width:56px;height:56px;transition:transform .12s,border-color .12s;position:relative}.swatch:hover{border-color:#a0a0a0;transform:scale(1.15)}.swatch.selected{border-color:#1cb0f6;box-shadow:0 0 0 3px #1cb0f640}.swatch.selected:after{content:"✓";color:#fff;text-shadow:0 1px 3px #0006;justify-content:center;align-items:center;font-size:18px;font-weight:800;display:flex;position:absolute;inset:0}.tile-grid{flex-wrap:wrap;gap:11px;display:flex}.tile{cursor:pointer;background:#f7f7f7;border:3px solid #e5e5e5;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:120px;height:120px;transition:all .12s;display:flex;position:relative;overflow:hidden}.tile:hover{border-color:#a0a0a0;transform:scale(1.04)}.tile.selected{border-color:#1cb0f6;box-shadow:0 0 0 3px #1cb0f640}.tile .tile-canvas{border-radius:11px;width:100%;height:100%;position:absolute;inset:0}.tile .tile-placeholder{opacity:.15;z-index:1;font-size:36px}.tile.loading .tile-placeholder{animation:1.2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.1}50%{opacity:.3}}.thumb-status{color:#aaa;text-align:center;flex-shrink:0;min-height:18px;padding:2px;font-size:10px}.action-list{flex-direction:column;gap:12px;max-width:420px;display:flex}.action-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.action-note{color:#777;font-size:12px;line-height:1.45}.save-status{color:#52656d;font-size:13px;font-weight:700;line-height:1.45}.file-btn{justify-content:center;align-items:center;display:inline-flex}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.mobile-action-bar{display:none}.generate-page{flex-direction:column;gap:16px;max-width:680px;display:flex}.generate-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.generate-title{color:#3c3c3c;font-size:18px;font-weight:800}.generate-mini{background:#f7f7f7;border:2px solid #e5e5e5;border-radius:12px;align-items:center;gap:12px;padding:10px;display:flex}.generate-mini img{object-fit:cover;background:#e5e5e5;border-radius:10px;width:58px;height:58px}.generate-mini-text{color:#777;flex-direction:column;gap:3px;font-size:12px;line-height:1.35;display:flex}.generate-mini-text strong{color:#3c3c3c;font-size:13px}.prompt-wrap{flex-direction:column;gap:8px;display:flex;position:relative}.prompt-label{color:#52656d;font-size:13px;font-weight:800}.prompt-input{resize:vertical;color:#3c3c3c;border:2px solid #e5e5e5;border-radius:12px;outline:none;width:100%;min-height:118px;padding:12px;font:600 14px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.prompt-input:focus{border-color:#1cb0f6;box-shadow:0 0 0 3px #1cb0f629}.mention-menu{z-index:15;background:#fff;border:2px solid #e5e5e5;border-radius:12px;flex-direction:column;gap:4px;min-width:220px;padding:8px;display:none;position:absolute;top:calc(100% - 2px);left:0;box-shadow:0 8px 22px #00000024}.mention-menu.open{display:flex}.mention-option{color:#3c3c3c;text-align:left;cursor:pointer;background:#f7f7f7;border:0;border-radius:9px;padding:9px 10px;font:700 13px/1.25 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.mention-option:hover{background:#eaf7ff}.prompt-tools,.generation-actions{flex-wrap:wrap;gap:8px;display:flex}.turnstile-box{align-items:center;min-height:66px;display:flex}.ai-status{color:#52656d;min-height:20px;font-size:12px;font-weight:700;line-height:1.45}.ai-stream{color:#3c3c3c;white-space:pre-wrap;background:#f7f7f7;border:2px solid #e5e5e5;border-radius:12px;min-height:92px;padding:12px;font:600 13px/1.55 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.ai-result{flex-direction:column;gap:10px;display:none}.ai-result.ready{display:flex}.ai-result h3{color:#3c3c3c;font-size:15px}.ai-result ol{padding-left:20px;font:600 13px/1.55 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.ai-warnings{color:#725000;background:#fff6df;border-radius:10px;padding:10px;font-size:12px;line-height:1.45;display:none}.ai-warnings.ready{display:block}.more-sheet{z-index:120;display:none;position:fixed;inset:0}.more-sheet.open{display:block}.more-backdrop{background:#00000047;position:absolute;inset:0}.more-panel{background:#fff;border-radius:16px;width:min(420px,100vw - 32px);padding:18px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 10px 30px #0003}.more-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.more-title{font-size:16px;font-weight:800}.more-close{color:#3c3c3c;cursor:pointer;background:#e5e5e5;border:0;border-radius:50%;width:34px;height:34px;font-size:18px;font-weight:800}.legal-footer{z-index:62;position:fixed;bottom:10px;right:14px}.legal-link{color:#52656d;cursor:pointer;background:#ffffffd9;border:0;border-radius:999px;padding:6px 10px;font:800 11px/1 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;box-shadow:0 1px 8px #00000014}.legal-text{color:#52656d;flex-direction:column;gap:10px;font:600 13px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex}.legal-text ul{padding-left:20px}.loading-overlay{z-index:100;background:#ffffffeb;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.loading-overlay.hidden{display:none}.spinner{border:4px solid #e5e5e5;border-top-color:#1cb0f6;border-radius:50%;width:48px;height:48px;margin-bottom:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{color:#777;font-size:14px}@media (width<=760px){body{height:100dvh;overflow:hidden}.app-header{height:38px;padding:0 12px}.app-title{font-size:14px}.btn{white-space:nowrap;border-radius:9px;padding:8px 12px;font-size:12px}.main-layout{height:calc(100vh - 102px);height:calc(100dvh - 38px - 64px - env(safe-area-inset-bottom));grid-template-rows:clamp(238px,38dvh,360px) minmax(0,1fr);grid-template-columns:1fr;gap:0;padding:0;display:grid;overflow:hidden}.tool-rail{display:none}.preview-panel{width:100%;min-height:0;box-shadow:none;border-radius:0}.preview-status{min-height:26px;padding:5px 9px;font-size:11px;top:10px;right:10px}.history-controls{gap:7px;top:10px;left:10px}.icon-btn{width:32px;height:32px}.options-panel{width:100%;height:100%;min-height:0;box-shadow:none;border-radius:0;overflow:hidden}.tab-bar{height:58px;box-shadow:none;border-top:0;border-bottom:2px solid #e5e5e5;justify-content:flex-start;position:static}.tab-btn{border-top:0;border-bottom:3px solid #0000;min-width:64px;height:58px;margin-bottom:-2px;padding:7px 8px 6px}.tab-btn.active{border-top-color:#0000;border-bottom-color:#1cb0f6}.tab-btn img,.tab-btn .tab-icon-text{width:27px;height:27px}.tab-btn .tab-label{font-size:11px}.thumb-status{min-height:16px}.options-scroll{flex:1;min-height:0;max-height:none;padding:14px 12px 20px;overflow-y:auto}.swatch-grid{scrollbar-width:none;scroll-snap-type:x proximity;flex-wrap:nowrap;padding:3px 3px 8px;overflow-x:auto}.swatch-grid::-webkit-scrollbar{height:0}.swatch{scroll-snap-align:start;width:50px;height:50px}.tile-grid{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:10px;display:grid}.tile{aspect-ratio:1;border-radius:12px;width:100%;height:auto;min-height:104px}.swatch{width:50px;height:50px}.action-list{max-width:none}.generate-scroll{padding:14px 12px 20px}.generate-page{gap:12px;max-width:none}.generate-head{align-items:flex-start}.generate-title{font-size:16px}.prompt-input{min-height:112px}.mobile-action-bar{z-index:70;height:calc(64px + env(safe-area-inset-bottom));padding:8px 8px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:2px solid #e5e5e5;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 14px #00000014}.mobile-action-bar .btn{width:100%}.legal-footer{right:10px;bottom:calc(72px + env(safe-area-inset-bottom))}.more-panel{width:100%;max-height:min(72dvh,520px);padding:18px 16px calc(18px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0;inset:auto 0 0;overflow-y:auto;transform:none}}