*{margin:0;padding:0;box-sizing:border-box}:root{--ink: #0B0B0A;--ink-light: #161615;--ink-mid: #222220;--paper: #F5F5F0;--paper-dim: #A0A09A;--paper-muted: #6B6B66;--line: #2A2A28;--kiwi: #8BC34A;--kiwi-bright: #A8E660;--glass: rgba(255,255,255,.04);--font: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "SF Mono", monospace}body{font-family:var(--font);background:var(--ink);color:var(--paper);min-height:100vh}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:var(--ink)}::-webkit-scrollbar-thumb{background:var(--kiwi);border-radius:3px}.app{display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:100vw;overflow:hidden}.header{display:flex;align-items:center;justify-content:space-between;gap:.4rem;padding:.5rem .75rem;border-bottom:1px solid var(--line);background:#0b0b0af2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);flex-shrink:0;flex-wrap:wrap}.logo{font-size:1rem;font-weight:700;white-space:nowrap}.canvas-nav{display:flex;gap:.15rem;align-items:center;flex-wrap:wrap;background:var(--ink-light);border-radius:8px;padding:2px}.canvas-nav a{padding:.3rem .55rem;color:var(--paper-dim);text-decoration:none;font-size:.68rem;border-radius:6px;white-space:nowrap;transition:all .2s}.canvas-nav a:hover{color:var(--paper);background:var(--ink-mid)}.tabs{display:flex;gap:.25rem;background:var(--ink-light);border-radius:8px;padding:2px}.tab{padding:.35rem .6rem;border:none;background:transparent;color:var(--paper-dim);font-family:var(--font);font-size:.7rem;cursor:pointer;border-radius:6px;white-space:nowrap}.tab.active{background:var(--kiwi);color:var(--ink);font-weight:600}@media (max-width: 640px){.header{padding:.4rem .5rem}.logo{font-size:.85rem}.canvas-nav{order:3;width:100%;justify-content:center;margin-top:.3rem}.canvas-nav a{font-size:.62rem;padding:.25rem .4rem}.tabs{order:2;margin-left:auto}.tab{font-size:.65rem;padding:.3rem .5rem}.image-section{padding:.5rem}.controls-section{padding:.5rem;gap:.5rem}.upload-row{flex-direction:column}.upload-zone{padding:.5rem}.preview{max-height:120px}.toggle-group{justify-content:center}.chat-area{height:55dvh}.main-image{border-radius:10px}}.main-scroll{flex:1;overflow-y:auto;display:flex;flex-direction:column}.image-section{padding:.75rem;min-height:auto;display:flex;align-items:center;justify-content:center;flex-shrink:0}.empty-state{text-align:center;color:var(--paper-muted)}.empty-icon{font-size:3rem;margin-bottom:.5rem;opacity:.3}.hint{font-family:var(--font-mono);font-size:.65rem;margin-top:.3rem;color:var(--paper-dim)}.gen-status{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:2rem}.spinner{width:32px;height:32px;border:3px solid var(--line);border-top-color:var(--kiwi);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.image-card{width:100%;max-width:500px;margin:0 auto}.main-image{width:100%;border-radius:12px;border:1px solid var(--line);cursor:pointer}.controls-section{padding:.75rem;display:flex;flex-direction:column;gap:.75rem;border-top:1px solid var(--line);margin-top:.5rem}.upload-row{display:flex;gap:.5rem}.upload-zone{flex:1;border:2px dashed var(--line);border-radius:8px;padding:.6rem;text-align:center;cursor:pointer}.upload-zone:hover{border-color:var(--kiwi)}.upload-text{font-size:.75rem;color:var(--paper-dim)}.preview{max-height:60px;border-radius:4px}.toggle-group{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;background:var(--ink-light);border:1px solid var(--line);border-radius:8px;flex-shrink:0}.toggle-label{font-size:.75rem;white-space:nowrap}.toggle{width:36px;height:20px;background:var(--ink-mid);border-radius:10px;position:relative;cursor:pointer;flex-shrink:0}.toggle.on{background:var(--kiwi)}.toggle-knob{width:16px;height:16px;background:var(--paper);border-radius:50%;position:absolute;top:2px;left:2px;transition:transform .2s}.toggle.on .toggle-knob{transform:translate(16px)}.prompt-input{width:100%;background:var(--ink-light);border:1px solid var(--line);border-radius:8px;padding:.6rem;font-family:var(--font-mono);font-size:.75rem;color:var(--paper);resize:vertical;outline:none}.prompt-input:focus{border-color:var(--kiwi)}.gen-btn{padding:.7rem;background:var(--kiwi);color:var(--ink);border:none;border-radius:8px;font-size:.85rem;font-weight:700;cursor:pointer}.gen-btn:hover{background:var(--kiwi-bright)}.gen-btn:disabled{opacity:.5;cursor:not-allowed}.ref-btn{padding:.7rem;background:transparent;border:1px solid var(--kiwi);color:var(--kiwi);border-radius:8px;font-size:.8rem;cursor:pointer;font-family:var(--font)}.ref-btn:hover{background:#8bc34a1a}.progress-bar{width:100%;max-width:200px;height:4px;background:var(--ink-mid);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--kiwi);transition:width .5s ease;border-radius:2px}.error{padding:.5rem;background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);border-radius:8px;color:#ff6b6b;font-size:.7rem}.history-section{border:1px solid var(--line);border-radius:8px;overflow:hidden}.history-summary{padding:.5rem .6rem;cursor:pointer;font-size:.75rem;color:var(--paper-dim);background:var(--ink-light)}.history-list{max-height:200px;overflow-y:auto}.history-item{display:flex;gap:.5rem;padding:.4rem .6rem;cursor:pointer;border-top:1px solid var(--line)}.history-item:active{background:var(--ink-light)}.history-thumb{width:36px;height:36px;border-radius:4px;object-fit:cover;flex-shrink:0}.history-info{overflow:hidden}.history-prompt{font-size:.65rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-time{font-size:.55rem;color:var(--paper-muted);margin-top:.15rem}.chat-area{display:flex;flex-direction:column;height:300px}.chat-messages{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;padding-bottom:.5rem}.chat-placeholder{text-align:center;padding:1rem;color:var(--paper-muted);font-size:.8rem}.chat-placeholder .hint{font-size:.65rem;margin-top:.3rem}.chat-msg{display:flex}.chat-msg.user{justify-content:flex-end}.chat-msg.assistant{justify-content:flex-start}.msg-bubble{max-width:85%;padding:.5rem .6rem;border-radius:10px;font-size:.7rem;line-height:1.4;white-space:pre-wrap;word-break:break-word}.chat-msg.user .msg-bubble{background:var(--kiwi);color:var(--ink);border-bottom-right-radius:3px}.chat-msg.assistant .msg-bubble{background:var(--ink-light);border:1px solid var(--line);border-bottom-left-radius:3px}.chat-input-row{display:flex;gap:.4rem}.chat-input{flex:1;padding:.5rem;background:var(--ink-light);border:1px solid var(--line);border-radius:8px;color:var(--paper);font-family:var(--font);font-size:.75rem;outline:none}.chat-input:focus{border-color:var(--kiwi)}.chat-send{width:38px;height:38px;background:var(--kiwi);color:var(--ink);border:none;border-radius:8px;font-size:1rem;cursor:pointer}