@import"https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Share+Tech+Mono&display=swap";:root{--primary-color: #0c1f2c;--secondary-color: #1a3a4a;--accent-color: #4a90e2;--text-color: #e0f7ff;--background-color: #0a1929;--visualizer-color: #4a90e2;--border-color: #2a4a5a}body{font-family:Space Mono,monospace;background-color:var(--background-color);color:var(--text-color);margin:0;padding:2rem;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:Share Tech Mono,monospace;letter-spacing:.5px}button,.file-upload{font-family:Space Mono,monospace;letter-spacing:.5px}.container{max-width:1200px;margin:0 auto;padding:0 1rem}header{text-align:center;margin-bottom:2rem}h1{color:var(--accent-color);font-size:2.5rem;margin-bottom:1rem}.controls{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.audio-controls{display:flex;flex-wrap:wrap;gap:2rem;align-items:flex-end}.audio-description{font-size:.95em;color:#b0c4d4;margin-top:.5em}.audio-divider{width:2px;height:60px;background:#23394d;margin:0 1rem;align-self:center}.visualizations{display:flex;flex-direction:column;gap:1rem;margin:1rem 0;background:var(--primary-color);padding:1rem;border-radius:8px}#visualizer,#spectrogram{width:100%;height:150px;background:var(--primary-color);border-radius:4px;box-shadow:0 2px 4px #0003}#spectrogram{background:#000;margin-top:1rem}.output{background-color:var(--secondary-color);padding:1rem;border-radius:8px}.log{background-color:var(--secondary-color);padding:1rem;border-radius:8px;margin:1rem 0;max-height:300px;overflow-y:auto}#logList{list-style:none;padding:0;margin:0}#logList li{padding:.5rem;border-bottom:1px solid var(--border-color)}#logList li:last-child{border-bottom:none}button{background-color:var(--accent-color);color:var(--text-color);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background-color .3s}button:hover{background-color:#357abd}input[type=file]{display:none}.file-upload{background-color:var(--secondary-color);padding:1rem;border-radius:4px;cursor:pointer;display:inline-block}.mode-selector{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}.mode-selector button{padding:8px 16px;border:2px solid transparent;border-radius:4px;background:#ffffff1a;color:#fff;cursor:pointer;transition:all .3s ease}.mode-selector button:hover{background:#fff3}.mode-selector button.active{border-color:currentColor;font-weight:600}#emotionalistMode.active{color:#2eccb9;border-color:#2eccb9}#deepEmotionalistMode.active{color:#7fdcc9;border-color:#148f77}#analystMode.active{color:#4a9eff;border-color:#4a9eff}#distortedMode.active{color:#c77dff;border-color:#c77dff}.export-controls{display:flex;gap:1rem;margin-top:1rem}@media (max-width: 768px){body{padding:1rem}.controls{flex-direction:column}.audio-controls{flex-direction:column;gap:1rem;align-items:stretch}.audio-divider{display:none}}#unit-view{margin-top:2rem;animation:fadeIn .3s ease-in-out}.unit-card{transition:transform .2s ease-in-out,box-shadow .2s ease-in-out}.unit-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.unit-card button{transition:background-color .2s ease-in-out}.unit-card button:hover{background-color:var(--accent-hover-color)!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.loading-text:after{content:"";animation:ellipsis 1.5s infinite}@keyframes ellipsis{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}to{content:""}}.audio-selection{margin-bottom:1rem}.audio-selection select{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:4px;background-color:#fff;font-size:1rem;margin-top:.5rem}.file-upload-section{margin-top:1rem;padding-top:1rem;border-top:1px solid #eee}.file-upload-section p{margin-bottom:.5rem;color:#666}#analyzeLibraryAudio{display:none;margin-top:1em}#analyzeLibraryAudio.show{display:inline-block}.main-columns{display:flex;gap:2rem;align-items:flex-start}.left-column{flex:1 1 320px;min-width:280px;max-width:400px;display:flex;flex-direction:column;gap:2rem}.right-column{flex:2 1 600px;min-width:0;display:flex;flex-direction:column;gap:.5rem}.audio-controls{flex-direction:column;gap:1.5rem;align-items:stretch;margin-bottom:0}@media (max-width: 900px){.main-columns{flex-direction:column;gap:2rem}.left-column,.right-column{max-width:100%;min-width:0}}.custom-audio-interface{display:flex;align-items:center;gap:1rem}.audio-btn{background:var(--accent-color);color:#fff;border:none;border-radius:50%;width:48px;height:48px;font-size:1.7rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,opacity .2s;box-shadow:0 2px 8px #0000001a}.audio-btn:disabled{background:#3a4a5a;color:#aaa;cursor:not-allowed;opacity:.6}.audio-status{color:#b0c4d4;font-size:1rem;font-style:italic}.output #phrase{background:#10181a;color:#39ff14;font-family:Share Tech Mono,Space Mono,monospace;font-size:.95rem;padding:1rem;border-radius:6px;min-height:2.5em;max-height:4.5em;height:3.5em;overflow-y:auto;box-shadow:0 2px 8px #0000001f;margin-top:.5em;transition:background .2s,color .2s;white-space:pre-line;display:flex;align-items:center}.audio-progress-container{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:.3em;min-width:120px}.audio-progress-bar{width:180px;height:8px;background:#222c2b;border-radius:4px;overflow:hidden;cursor:pointer;margin-top:.2em;margin-bottom:.2em;box-shadow:0 1px 3px #00000014}.audio-progress{height:100%;background:linear-gradient(90deg,#4a90e2,#1affd5);width:0%;border-radius:4px;transition:width .1s linear}.audio-time{font-family:Share Tech Mono,Space Mono,monospace;font-size:.85em;color:#4a90e2;margin-left:2px;-webkit-user-select:none;user-select:none}.custom-audio-interface:not(.audio-loaded) .audio-progress-container{display:none}.custom-audio-interface.audio-loaded .audio-status{display:none}.hazy-mode-note{color:#b0c4d4;background:#1e2832b3;font-size:.78em;font-style:normal;border-left:3px solid #4a90e2;padding:.5em 1em;margin-top:.5em;border-radius:4px;transition:opacity .2s}.analyst-mode{font-family:Courier New,monospace;color:#4a9eff;background-color:#4a9eff1a;border-left:3px solid #4a9eff;padding-left:10px}.emotionalist-mode{font-family:Inter,sans-serif;color:#2eccb9;background-color:#2eccb91a;border-left:3px solid #2eccb9;padding-left:10px}.deep-emotionalist-mode{font-family:Inter,sans-serif;color:#9fe8d9;background-color:#148f7733;border-left:3px solid #148f77;padding-left:10px}.distorted-mode{font-family:Courier New,Inter,monospace;color:#d4a5ff;background:linear-gradient(90deg,#2eccb914,#4a9eff14,#c77dff1f);border-left:3px solid #c77dff;padding-left:10px;letter-spacing:.01em}