@import "https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap";.app-header{background:#0d0d0d;border-bottom:1px solid #222;width:100%}.header-content{box-sizing:border-box;justify-content:space-between;align-items:center;width:100%;height:64px;padding:0 28px;display:flex}.logo{color:#f5f5f5;letter-spacing:-.5px;height:100%;font-family:Montserrat,sans-serif;font-size:25px;font-weight:700;text-decoration:none;transition:opacity .2s}.logo:hover{opacity:.75}.header-nav{align-items:center;gap:24px;display:flex}.header-nav a{color:#888;font-size:18px;font-weight:500;text-decoration:none;transition:color .2s}.header-nav a:hover{color:#eee}@media (width<=600px){.header-content{height:58px;padding:0 18px}.logo{font-size:15px}.header-nav{gap:16px}.header-nav a{font-size:12px}}.input-container{box-sizing:border-box;background:#171717;border:1px solid #292929;border-radius:16px;width:100%;max-width:650px;margin:40px auto;padding:32px;box-shadow:0 8px 30px #00000040}.input-heading{margin-bottom:28px}.input-heading h2{color:#f5f5f5;margin:0;font-size:24px;font-weight:600}.input-heading p{color:#888;margin:8px 0 0;font-size:14px}.form-group{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.form-group label{color:#cfcfcf;font-size:14px;font-weight:500}.form-group input,.form-group select{box-sizing:border-box;color:#f5f5f5;background:#101010;border:1px solid #333;border-radius:9px;outline:none;width:100%;padding:12px 14px;font-size:15px;transition:border-color .2s,box-shadow .2s,background .2s}.form-group input::placeholder{color:#555}.form-group input:focus,.form-group select:focus{background:#121212;border-color:#666;box-shadow:0 0 0 3px #ffffff0d}.form-group select{cursor:pointer}.form-group select option{color:#f5f5f5;background:#171717}.analyze-button{color:#111;cursor:pointer;background:#f5f5f5;border:none;border-radius:9px;width:100%;padding:13px;font-size:15px;font-weight:600;transition:background .2s,transform .1s}.analyze-button:hover{background:#dcdcdc}.analyze-button:active{transform:scale(.99)}@media (width<=700px){.input-container{width:calc(100% - 40px);margin:20px;padding:24px}.input-heading h2{font-size:21px}}.progress-container{box-sizing:border-box;background:#171717;border:1px solid #292929;border-radius:14px;width:100%;max-width:1000px;margin:30px auto;padding:22px 24px;box-shadow:0 5px 20px #00000026}.progress-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;display:flex}.progress-header h3{color:#eee;margin:0;font-size:16px;font-weight:600}.progress-header p{color:#666;margin:5px 0 0;font-size:13px}.progress-percentage{color:#f5f5f5;font-variant-numeric:tabular-nums;font-size:22px;font-weight:650}.progress-track{background:#292929;border-radius:999px;width:100%;height:8px;overflow:hidden}.progress-fill{background:#bdbdbd;border-radius:999px;height:100%;transition:width .25s}.progress-footer{color:#666;justify-content:space-between;align-items:center;margin-top:12px;font-size:12px;display:flex}.processing-indicator{color:#888;align-items:center;gap:6px;display:flex}.pulse-dot{background:#aaa;border-radius:50%;width:6px;height:6px;animation:1.2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}.completed-text{color:#86efac;font-weight:500}@media (width<=600px){.progress-container{width:calc(100% - 32px);margin:20px 16px;padding:18px}.progress-header h3{font-size:15px}.progress-percentage{font-size:19px}.progress-footer{font-size:11px}}.comment-card{box-sizing:border-box;background:#171717;border:1px solid #292929;border-radius:14px;width:100%;margin-bottom:16px;padding:24px;transition:border-color .2s,transform .2s,box-shadow .2s;box-shadow:0 5px 20px #0000002e}.comment-card:hover{border-color:#3a3a3a;transform:translateY(-2px);box-shadow:0 8px 25px #00000040}.comment-text{color:#eee;word-break:break-word;margin:0;font-size:16px;line-height:1.6}.comment-badges{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.badge{white-space:nowrap;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:6px 11px;font-size:12px;font-weight:600;line-height:1;display:inline-flex}.intent-HYPE{color:#d8b4fe;background:#3b0764;border-color:#6b21a8}.intent-ROAST{color:#fdba74;background:#431407;border-color:#9a3412}.intent-WANDER{color:#7dd3fc;background:#082f49;border-color:#0369a1}.intent-JOKE{color:#fde047;background:#422006;border-color:#a16207}.intent-REACTION{color:#93c5fd;background:#172554;border-color:#1d4ed8}.intent-SUGGESTION{color:#86efac;background:#052e16;border-color:#15803d}.intent-STORY{color:#c4b5fd;background:#312e81;border-color:#4338ca}.intent-OTHER{color:#d4d4d8;background:#27272a;border-color:#52525b}.reaction-LOL{color:#facc15;background:#422006;border-color:#a16207}.reaction-HAPPY{color:#86efac;background:#052e16;border-color:#15803d}.reaction-DOWNFALL{color:#93c5fd;background:#172554;border-color:#1d4ed8}.reaction-FLABBERGASTED{color:#e9d5ff;background:#3b0764;border-color:#7e22ce}.reaction-ANGRY{color:#fca5a5;background:#450a0a;border-color:#b91c1c}.reaction-CONFUSED{color:#fdba74;background:#422006;border-color:#c2410c}.reaction-NEUTRAL{color:#d4d4d8;background:#27272a;border-color:#52525b}.reaction-COOKED{color:#fb7185;background:#3f0d0d;border-color:#be123c}.sarcastic-badge{color:#d8b4fe;background:#3b0764;border-color:#7e22ce}@media (width<=600px){.comment-card{padding:18px}.comment-text{font-size:15px}.badge{padding:5px 9px;font-size:11px}}.distribution-chart{width:100%}.distribution-title{color:#eee;margin:0 0 22px;font-size:16px;font-weight:600}.distribution-list{flex-direction:column;gap:14px;display:flex}.distribution-row{grid-template-columns:105px 1fr 52px;align-items:center;gap:12px;display:grid}.distribution-label{color:#bdbdbd;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:500;overflow:hidden}.distribution-bar-container{background:#292929;border-radius:999px;width:100%;height:8px;overflow:hidden}.distribution-bar{background:#888;border-radius:999px;min-width:2px;height:100%;transition:width .5s,background .2s}.distribution-row:hover .distribution-bar{background:#bdbdbd}.distribution-value{color:#eee;text-align:right;font-variant-numeric:tabular-nums;font-size:12px;font-weight:600}@media (width<=600px){.distribution-row{grid-template-columns:85px 1fr 48px;gap:8px}.distribution-label,.distribution-value{font-size:11px}.distribution-bar-container{height:7px}}.result-section{box-sizing:border-box;width:100%;max-width:1000px;margin:50px auto 80px;padding:0 24px}.result-header{margin-bottom:28px}.result-header h2{color:#f5f5f5;letter-spacing:-.5px;margin:0;font-size:28px;font-weight:650}.result-header p{color:#777;margin:7px 0 0;font-size:14px}.metrics-grid{grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:42px;display:grid}.metric-card{box-sizing:border-box;background:#171717;border:1px solid #292929;border-radius:13px;min-width:0;padding:20px;transition:border-color .2s,transform .2s,background .2s}.metric-card:hover{background:#1a1a1a;border-color:#3a3a3a;transform:translateY(-2px)}.metric-label{color:#777;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;font-size:12px;font-weight:500;display:block}.metric-value{color:#f2f2f2;text-overflow:ellipsis;white-space:nowrap;font-size:23px;font-weight:650;display:block;overflow:hidden}.metric-vibe{color:#d8b4fe}.section-heading{margin-bottom:18px}.section-heading h3{color:#e8e8e8;margin:0;font-size:19px;font-weight:600}.section-heading p{color:#666;margin:5px 0 0;font-size:13px}.distribution-section{margin-bottom:45px}.charts-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.chart-card{box-sizing:border-box;background:#171717;border:1px solid #292929;border-radius:14px;min-height:250px;padding:22px;transition:border-color .2s,box-shadow .2s}.chart-card:hover{border-color:#383838;box-shadow:0 8px 25px #0003}.comments-section{margin-top:10px}.comments-list{flex-direction:column;gap:0;display:flex}@media (width<=850px){.metrics-grid{grid-template-columns:repeat(2,1fr)}.charts-grid{grid-template-columns:1fr}}@media (width<=600px){.result-section{margin-top:35px;padding:0 16px}.result-header h2{font-size:24px}.metrics-grid{grid-template-columns:1fr}.metric-card{padding:17px}.metric-value{font-size:21px}.chart-card{padding:16px}}.about-section{box-sizing:border-box;background:#0d0d0d;border-top:1px solid #222;width:100%;padding:110px 24px 120px;scroll-margin-top:64px}.about-content{width:100%;max-width:1000px;margin:0 auto}.about-heading{max-width:700px;margin-bottom:55px}.about-label{color:#777;letter-spacing:1.5px;margin-bottom:16px;font-size:11px;font-weight:600;display:inline-block}.about-heading h2{color:#f5f5f5;letter-spacing:-1px;margin:0;font-size:36px;font-weight:650;line-height:1.15}.about-heading p{color:#777;max-width:600px;margin:18px 0 0;font-size:16px;line-height:1.6}.about-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.about-card{background:#141414;border:1px solid #292929;border-radius:14px;padding:28px;transition:border-color .2s,background .2s,transform .2s;position:relative}.about-card:hover{background:#171717;border-color:#3a3a3a;transform:translateY(-2px)}.about-number{color:#555;margin-bottom:25px;font-family:monospace;font-size:12px;display:block}.about-card h3{color:#eee;margin:0 0 10px;font-size:17px;font-weight:600}.about-card p{color:#777;margin:0;font-size:14px;line-height:1.65}.about-footer{align-items:center;gap:18px;margin-top:50px;display:flex}.about-footer-line{background:#444;width:45px;height:1px}.about-footer p{color:#666;margin:0;font-size:13px}@media (width<=700px){.about-section{padding:80px 18px 90px}.about-heading{margin-bottom:35px}.about-heading h2{font-size:29px}.about-heading p{font-size:14px}.about-grid{grid-template-columns:1fr}.about-card{padding:22px}}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#f5f5f5;background:#0d0d0d;margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#root{min-height:100vh}.app{background:#0d0d0d;min-height:100vh}.main-content{width:100%;padding-bottom:40px}.analysis-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:18px;width:100%;max-width:1200px;margin:0 auto;padding:0 24px;display:grid}.comments-pane,.result-pane{background:#141414;border:1px solid #292929;border-radius:14px;min-width:0;overflow:hidden}.comments-pane{flex-direction:column;height:650px;display:flex}.pane-header{background:#171717;border-bottom:1px solid #292929;flex-shrink:0;justify-content:space-between;align-items:center;padding:20px 22px;display:flex}.pane-header h2{color:#eee;margin:0;font-size:16px;font-weight:600}.pane-header p{color:#666;margin:4px 0 0;font-size:12px}.comment-count{color:#bbb;background:#292929;border-radius:999px;justify-content:center;align-items:center;min-width:30px;height:30px;padding:0 8px;font-size:12px;font-weight:600;display:flex}.comments-scroll{flex:1;min-height:0;padding:18px;overflow-y:auto}.comments-scroll::-webkit-scrollbar{width:7px}.comments-scroll::-webkit-scrollbar-track{background:0 0}.comments-scroll::-webkit-scrollbar-thumb{background:#333;border-radius:999px}.comments-scroll::-webkit-scrollbar-thumb:hover{background:#444}.comments-scroll .comment-card{animation:.3s ease-out comment-enter}@keyframes comment-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.comments-empty{color:#666;flex-direction:column;justify-content:center;align-items:center;height:100%;display:flex}.comments-empty p{margin:12px 0 0;font-size:13px}.loading-dot{background:#aaa;border-radius:50%;width:8px;height:8px;animation:1.2s ease-in-out infinite loading-pulse}@keyframes loading-pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}.result-pane{min-height:650px;position:relative}.result-pane .result-section{max-width:none;margin:0;padding:28px}.awaiting-result{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:650px;padding:40px;display:flex}.awaiting-icon{color:#777;letter-spacing:3px;border:1px solid #333;border-radius:14px;justify-content:center;align-items:center;width:50px;height:50px;margin-bottom:20px;font-size:18px;display:flex}.awaiting-result h2{color:#ddd;margin:0;font-size:18px;font-weight:600}.awaiting-result p{color:#666;max-width:300px;margin:9px 0 0;font-size:13px;line-height:1.6}.error-message{background:#1a1010;border:1px solid #4a2424;border-radius:10px;flex-direction:column;gap:4px;width:calc(100% - 48px);max-width:1200px;margin:20px auto;padding:16px 18px;display:flex}.error-message strong{color:#fca5a5;font-size:13px}.error-message span{color:#a87878;font-size:12px}.result-pane .metrics-grid{grid-template-columns:repeat(2,1fr)}.result-pane .charts-grid{grid-template-columns:1fr}.result-pane .comments-section{display:none}@media (width<=900px){.analysis-workspace{grid-template-columns:1fr}.comments-pane{height:500px}.result-pane{min-height:auto}.awaiting-result{min-height:400px}}@media (width<=600px){.analysis-workspace{flex-direction:column;gap:20px;padding:0 16px;display:flex}.comments-pane{width:100%;height:auto;max-height:none;overflow:visible}.comments-scroll{padding:14px;overflow:visible}.result-pane{width:100%;min-height:0}.awaiting-result{min-height:260px;padding:30px 20px}.result-pane .result-section{padding:22px 18px}.result-pane .metrics-grid,.result-pane .charts-grid{grid-template-columns:1fr}.error-message{width:calc(100% - 32px)}}
