*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0a0a0a;--surface: #1a1a1a;--text: #e0e0e0;--text-muted: #888;--accent: #4fc3f7;--accent-dark: #0288d1;--border: #2a2a2a}html,body,#root{height:100%;background:var(--bg);color:var(--text);font-family:Georgia,Times New Roman,serif;overflow:hidden}.app{display:flex;flex-direction:column;height:100%}.header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.logo{font-family:Georgia,serif;font-size:1.4rem;font-weight:700;color:var(--accent);letter-spacing:.5px}.logo small{font-size:.7rem;color:var(--text-muted);font-weight:400;margin-left:8px}.header-actions{display:flex;gap:12px;align-items:center}.search-container{position:relative}.search-input{background:var(--bg);border:1px solid var(--border);color:var(--text);padding:8px 12px 8px 36px;border-radius:20px;font-size:.9rem;width:280px;outline:none;transition:border-color .2s}.search-input:focus{border-color:var(--accent)}.search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:.9rem}.main-content{display:flex;flex:1;overflow:hidden}.viewer-panel{flex:1;position:relative;background:#000;overflow:hidden}.viewer-panel canvas{display:block}.viewer-overlay{position:absolute;top:12px;left:12px;background:#0009;padding:8px 12px;border-radius:4px;font-size:.75rem;color:var(--text-muted);pointer-events:none}.info-panel{width:380px;background:var(--surface);border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}.info-header{padding:16px;border-bottom:1px solid var(--border)}.info-title{font-size:1.1rem;font-weight:700;margin-bottom:4px;color:var(--accent)}.info-subtitle{font-size:.8rem;color:var(--text-muted)}.info-body{flex:1;overflow-y:auto;padding:16px}.info-section{margin-bottom:20px}.info-section h3{font-size:.9rem;color:var(--accent);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-family:sans-serif}.info-text{font-size:.9rem;line-height:1.6;color:var(--text)}.info-text p{margin-bottom:10px}.illustration-container{margin:16px 0;background:var(--bg);border-radius:4px;overflow:hidden;text-align:center}.illustration-container img{max-width:100%;max-height:300px;display:block;margin:0 auto}.illustration-caption{padding:8px;font-size:.8rem;color:var(--text-muted);font-style:italic}.chat-section{border-top:1px solid var(--border);padding:16px;background:var(--bg)}.chat-title{font-size:.9rem;color:var(--accent);margin-bottom:12px;font-family:sans-serif;text-transform:uppercase;letter-spacing:1px}.chat-messages{max-height:120px;overflow-y:auto;margin-bottom:10px;font-size:.85rem;line-height:1.5}.chat-message{margin-bottom:8px;padding:6px 8px;border-radius:4px}.chat-message.user{background:#4fc3f71a;color:var(--accent);margin-right:24px;margin-left:auto;text-align:right}.chat-message.ai{background:var(--surface);color:var(--text)}.chat-input-row{display:flex;gap:8px}.chat-input{flex:1;background:var(--surface);border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:4px;font-size:.85rem;font-family:inherit;outline:none}.chat-input:focus{border-color:var(--accent)}.chat-send{background:var(--accent);color:#000;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:.85rem;font-weight:700;font-family:sans-serif}.chat-send:hover{background:var(--accent-dark)}.system-tabs{display:flex;gap:4px;padding:8px 16px;background:var(--surface);border-bottom:1px solid var(--border);overflow-x:auto}.system-tab{background:transparent;border:1px solid var(--border);color:var(--text-muted);padding:6px 14px;border-radius:16px;cursor:pointer;font-size:.8rem;font-family:sans-serif;white-space:nowrap;transition:all .2s}.system-tab:hover{color:var(--text);border-color:var(--text-muted)}.system-tab.active{background:var(--accent);color:#000;border-color:var(--accent);font-weight:700}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;padding:12px}.gallery-item{aspect-ratio:1;background:var(--bg);border-radius:4px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:border-color .2s}.gallery-item:hover{border-color:var(--accent)}.gallery-item img{width:100%;height:100%;object-fit:cover}.loading{display:flex;align-items:center;justify-content:center;height:100%;font-size:1.2rem;color:var(--text-muted)}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin-right:12px}@keyframes spin{to{transform:rotate(360deg)}}.error{display:flex;align-items:center;justify-content:center;height:100%;color:#f44336;font-size:1rem}@media (max-width: 768px){.info-panel{position:absolute;right:0;top:0;bottom:0;width:300px;transform:translate(100%);transition:transform .3s;z-index:10}.info-panel.open{transform:translate(0)}.search-input{width:180px}}