:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background:var(--gradient-primary);cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.error-card{background:linear-gradient(135deg,#fdf2f8,#fee2e2);color:#b91c1c;border-radius:18px;border:1px solid #fca5a5;box-shadow:var(--shadow-md);padding:clamp(1rem,3vw,1.5rem);margin-bottom:1.5rem;text-align:center;transition:box-shadow .3s,background .3s}.error-card h3{font-size:clamp(1.1rem,2.5vw,1.25rem);margin-bottom:.5rem}.error-card p{font-size:clamp(.9rem,2vw,1rem)}.main-action-btn,.upload-btn,.action-btn,.tab-btn{transition:box-shadow .3s,background .3s,transform .2s}.main-action-btn:hover,.upload-btn:hover,.action-btn:hover,.tab-btn:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px) scale(1.03)}.result-card,.history-card,.file-preview-card{transition:box-shadow .3s,background .3s,transform .2s}.result-card:hover,.history-card:hover,.file-preview-card:hover{box-shadow:var(--shadow-xl);transform:translateY(-2px) scale(1.01)}:root{--bg-primary: linear-gradient(135deg, #fdf2f8 0%, #f8fafc 50%, #f0f9ff 100%);--bg-secondary: rgba(255, 255, 255, .8);--bg-card: rgba(255, 255, 255, .95);--bg-card-hover: rgba(255, 255, 255, 1);--text-primary: #1f2937;--text-secondary: #6b7280;--text-muted: #9ca3af;--accent-pink: #f472b6;--accent-purple: #a78bfa;--accent-blue: #60a5fa;--accent-green: #4ade80;--accent-yellow: #fbbf24;--accent-orange: #fb923c;--gradient-primary: linear-gradient(135deg, #f472b6, #a78bfa);--gradient-secondary: linear-gradient(135deg, #60a5fa, #34d399);--gradient-tertiary: linear-gradient(135deg, #fbbf24, #fb923c);--border-light: rgba(229, 231, 235, .6);--border-medium: rgba(209, 213, 219, .8);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--blur-sm: blur(4px);--blur-md: blur(8px)}.dark{--bg-primary: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #334155 100%);--bg-secondary: rgba(30, 41, 59, .9);--bg-card: rgba(51, 65, 85, .95);--bg-card-hover: rgba(71, 85, 105, 1);--text-primary: #f1f5f9;--text-secondary: #cbd5e1;--text-muted: #94a3b8;--accent-pink: #ec4899;--accent-purple: #8b5cf6;--accent-blue: #3b82f6;--accent-green: #10b981;--accent-yellow: #f59e0b;--accent-orange: #ea580c;--gradient-primary: linear-gradient(135deg, #ec4899, #8b5cf6);--gradient-secondary: linear-gradient(135deg, #3b82f6, #10b981);--gradient-tertiary: linear-gradient(135deg, #f59e0b, #ea580c);--border-light: rgba(71, 85, 105, .6);--border-medium: rgba(100, 116, 139, .8);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 4px 6px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .3)}*{margin:0;padding:0;box-sizing:border-box}body{font:400 1rem/1.6 Inter,system-ui,-apple-system,sans-serif;font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-primary);overflow-x:hidden}.app-wrapper{min-height:100vh;background:var(--bg-primary);display:flex;flex-direction:column;align-items:center}.main-container{max-width:1200px;margin:0 auto;padding:clamp(1rem,4vw,2rem);position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:100%}.background-pattern{position:fixed;inset:0;background-image:radial-gradient(circle at 25% 25%,rgba(244,114,182,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(167,139,250,.1) 0%,transparent 50%),radial-gradient(circle at 75% 25%,rgba(96,165,250,.1) 0%,transparent 50%),radial-gradient(circle at 25% 75%,rgba(52,211,153,.1) 0%,transparent 50%);background-size:800px 800px;animation:float 20s ease-in-out infinite;pointer-events:none;z-index:0}@keyframes float{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(10px,-10px) rotate(1deg)}50%{transform:translate(-5px,5px) rotate(-1deg)}75%{transform:translate(5px,10px) rotate(1deg)}}.app-header{position:sticky;top:0;z-index:100;-webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md);background:var(--bg-secondary);border-bottom:1px solid var(--border-light);padding:clamp(.75rem,2vw,1rem) 0;width:100%}.header-content{max-width:1200px;margin:0 auto;padding:0 clamp(1rem,4vw,2rem);display:flex;justify-content:space-between;align-items:center}.logo-section{display:flex;align-items:center;gap:clamp(.5rem,2vw,.75rem)}.logo-icon{width:clamp(32px,8vw,40px);height:clamp(32px,8vw,40px);background:var(--gradient-primary);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff}.logo-text{font:700 clamp(1.2rem,4vw,1.5rem)/1 Inter;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.theme-toggle{width:clamp(44px,10vw,50px);height:clamp(40px,9vw,44px);border:none;border-radius:12px;background:var(--gradient-primary);color:var(--text-primary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm);margin-left:10px}.theme-toggle:hover{background:var(--bg-card-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.hero-section{text-align:center;margin-bottom:clamp(2rem,5vw,3rem);width:100%}.hero-title{font:700 clamp(2rem,6vw,4rem)/1.2 Inter;margin-bottom:clamp(.75rem,2vw,1rem);background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font:400 clamp(1rem,3vw,1.25rem)/1.6 Inter;color:var(--text-secondary);max-width:min(600px,90vw);margin:0 auto}.upload-card,.result-card,.history-card,.loading-card{background:var(--bg-card);-webkit-backdrop-filter:var(--blur-sm);backdrop-filter:var(--blur-sm);border-radius:clamp(16px,4vw,24px);padding:clamp(1.25rem,4vw,2rem);box-shadow:var(--shadow-lg);border:1px solid var(--border-light);margin-bottom:clamp(1.5rem,3vw,2rem);transition:all .3s cubic-bezier(.4,0,.2,1);width:100%;max-width:100%}.history-card{width:100%}.upload-card{display:flex;flex-direction:column;align-items:center;width:100%}.result-card{border-radius:clamp(16px,3vw,20px);padding:clamp(1rem,3vw,1.5rem);margin-bottom:15px}.loading-card{text-align:center;padding:clamp(2rem,5vw,3rem)}.upload-card:hover,.result-card:hover{box-shadow:var(--shadow-xl);transform:translateY(-2px)}.result-card:hover{transform:translateY(-4px)}.upload-area{position:relative;border:2px dashed var(--border-medium);border-radius:clamp(16px,3vw,20px);padding:clamp(2rem,5vw,3rem) clamp(1rem,3vw,2rem);text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;background:linear-gradient(135deg,#f472b608,#a78bfa08);width:100%}.upload-area:hover,.upload-area.drag-active{border-color:var(--accent-pink);background:linear-gradient(135deg,#f472b614,#a78bfa14);transform:scale(1.02)}.upload-icon{color:var(--accent-purple);margin-bottom:1rem;display:flex;justify-content:center}.upload-content h3{font:600 clamp(1.2rem,3vw,1.5rem)/1 Inter;margin-bottom:.5rem;color:var(--text-primary)}.upload-content p{color:var(--text-secondary);margin-bottom:1.5rem;font-size:clamp(.95rem,2.5vw,1.1rem)}.supported-formats{display:flex;gap:clamp(.5rem,2vw,1rem);justify-content:center;flex-wrap:wrap}.format-badge{display:inline-flex;align-items:center;gap:.5rem;padding:clamp(.4rem,1.5vw,.5rem) clamp(.75rem,2vw,1rem);background:var(--gradient-secondary);color:#fff;border-radius:50px;font:500 clamp(.75rem,2vw,.875rem)/1 Inter;box-shadow:var(--shadow-sm)}.file-input-hidden{position:absolute;inset:0;opacity:0;cursor:pointer}.file-preview-card{margin-top:1.5rem;padding:clamp(1rem,3vw,1.5rem);background:linear-gradient(135deg,#60a5fa0d,#34d3990d);border-radius:clamp(12px,3vw,16px);border:1px solid var(--border-light)}.file-info{display:flex;align-items:center;gap:clamp(.75rem,2vw,1rem);margin-bottom:1rem;flex-wrap:wrap}.file-icon{width:clamp(40px,10vw,48px);height:clamp(40px,10vw,48px);background:var(--gradient-secondary);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.file-details h4{font-weight:600;color:var(--text-primary);margin-bottom:.25rem;font-size:clamp(.9rem,2.5vw,1rem);word-break:break-word}.file-details p{color:var(--text-secondary);font-size:clamp(.8rem,2vw,.875rem)}.image-preview-container{border-radius:12px;overflow:hidden;box-shadow:var(--shadow-md)}.file-preview-image{width:100%;height:clamp(150px,25vw,200px);object-fit:cover}.action-buttons{display:flex;gap:clamp(.75rem,2vw,1rem);justify-content:center;margin-top:2rem;flex-wrap:wrap}.upload-btn{background:var(--gradient-primary);color:#fff;border:none;border-radius:8px;padding:clamp(.6rem,2vw,.75rem) clamp(1.5rem,4vw,2rem);font-size:clamp(.9rem,2.5vw,1rem);font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);transition:background .2s,box-shadow .2s;min-height:44px}.upload-btn:hover{background:var(--gradient-secondary)}.spinner-small,.loading-spinner{border-radius:50%;animation:spin 1s linear infinite}.spinner-small{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white}.loading-spinner{width:clamp(40px,10vw,48px);height:clamp(40px,10vw,48px);border:4px solid var(--border-light);border-top:4px solid var(--accent-purple);margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.loading-card h3{font:600 clamp(1.2rem,3vw,1.5rem)/1 Inter;margin-bottom:.5rem;color:var(--text-primary)}.loading-card p{color:var(--text-secondary);font-size:clamp(.9rem,2.5vw,1rem)}.error-card{text-align:center;padding:clamp(1.5rem,4vw,2rem);background:linear-gradient(135deg,#ef44441a,#dc26261a);border:1px solid rgba(239,68,68,.2);border-radius:clamp(12px,3vw,16px);margin-bottom:2rem}.error-card h3{color:#dc2626;font-weight:600;margin-bottom:.5rem;font-size:clamp(1.1rem,3vw,1.25rem)}.error-card p{color:#7f1d1d;font-size:clamp(.9rem,2.5vw,1rem)}.error-message{color:#dc2626;font-weight:500;text-align:center;padding:clamp(.75rem,2vw,1rem);background:#ef44441a;border-radius:8px;border:1px solid rgba(239,68,68,.2);font-size:clamp(.85rem,2vw,.95rem)}.results-grid{justify-content:center;align-items:center;gap:clamp(1.5rem,3vw,2rem);margin-bottom:2rem;width:100%}.result-card-box{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:5px;gap:clamp(1rem,3vw,2rem);margin-bottom:2rem;width:100%;flex-wrap:wrap}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:1px solid var(--border-light);flex-wrap:wrap;gap:1rem}.card-header h3{display:flex;align-items:center;gap:.5rem;font-weight:600;color:var(--text-primary);font-size:clamp(1rem,2.5vw,1.125rem)}.copy-btn{display:flex;align-items:center;gap:.25rem;padding:clamp(.4rem,1.5vw,.5rem) clamp(.75rem,2vw,1rem);background:var(--gradient-tertiary);color:#fff;border:none;border-radius:50px;font:500 clamp(.75rem,2vw,.875rem)/1 Inter;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm);min-height:44px}.copy-btn:hover{box-shadow:var(--shadow-md);transform:scale(1.05)}.file-card .file-info-content h4{font-weight:600;color:var(--text-primary);margin-bottom:.5rem;word-break:break-all;font-size:clamp(.9rem,2.5vw,1rem)}.file-type{color:var(--text-muted);font-size:clamp(.8rem,2vw,.875rem)}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:clamp(.75rem,2vw,1rem);margin-bottom:1.5rem}.metric-item{text-align:center;padding:clamp(.75rem,2vw,1rem);background:linear-gradient(135deg,#f472b60d,#a78bfa0d);border-radius:12px;border:1px solid var(--border-light)}.metric-value{display:block;font:700 clamp(1.2rem,3vw,1.5rem)/1 Inter;color:var(--text-primary);margin-bottom:.25rem}.metric-label{font:500 clamp(.75rem,2vw,.875rem)/1 Inter;color:var(--text-secondary)}.sentiment-indicator{display:flex;align-items:center;gap:clamp(.75rem,2vw,1rem);padding:clamp(.75rem,2vw,1rem);background:linear-gradient(135deg,#60a5fa0d,#34d3990d);border-radius:12px;border:1px solid var(--border-light);flex-wrap:wrap}.sentiment-label{font-weight:500;color:var(--text-secondary);white-space:nowrap;font-size:clamp(.85rem,2vw,.95rem)}.sentiment-bar{flex:1;height:8px;background:var(--border-light);border-radius:4px;overflow:hidden;min-width:100px}.sentiment-fill{height:100%;background:var(--gradient-secondary);box-shadow:var(--shadow-lg)}.main-action-btn{background:var(--gradient-primary);color:#fff;border:none;border-radius:8px;padding:clamp(.6rem,2vw,.75rem) clamp(1.5rem,4vw,2rem);font-size:clamp(.9rem,2.5vw,1rem);font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);margin:0 clamp(.25rem,1vw,.5rem);transition:background .2s,box-shadow .2s;min-height:44px}.main-action-btn:hover{background:var(--gradient-secondary);box-shadow:var(--shadow-lg)}.dark .upload-btn,.dark .main-action-btn{color:#f1f5f9;background:var(--gradient-primary);box-shadow:var(--shadow-md)}.dark .upload-btn:hover,.dark .main-action-btn:hover{background:var(--gradient-secondary);box-shadow:var(--shadow-lg)}.sentiment-value{font-weight:600;color:var(--text-primary);min-width:40px;text-align:right;font-size:clamp(.85rem,2vw,.95rem)}.text-card{grid-column:1 / -1}.text-content{max-height:clamp(200px,40vh,300px);overflow-y:auto;padding:clamp(.75rem,2vw,1rem);background:linear-gradient(135deg,#f8fafc80,#f1f5f980);border-radius:12px;border:1px solid var(--border-light)}.dark .text-content{background:linear-gradient(135deg,#1e293b80,#33415580)}.text-content p{line-height:1.7;color:var(--text-primary);white-space:pre-wrap;font-size:clamp(.9rem,2vw,1rem)}.summary-card{grid-column:1 / -1}.summary-tabs{display:flex;gap:clamp(.4rem,1.5vw,.5rem);margin-bottom:1.5rem;justify-content:center;flex-wrap:wrap}.tab-btn,.action-btn{padding:clamp(.6rem,2vw,.75rem) clamp(1rem,3vw,1.5rem);border:1px solid var(--border-medium);background:var(--bg-card);color:var(--text-secondary);border-radius:50px;cursor:pointer;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:clamp(.85rem,2vw,.95rem);min-height:44px}.action-btn{display:inline-flex;align-items:center;gap:.5rem;padding:clamp(.4rem,1.5vw,.5rem) clamp(.75rem,2vw,1rem);font-size:clamp(.75rem,2vw,.875rem);box-shadow:var(--shadow-sm)}.tab-btn:hover,.action-btn:hover{border-color:var(--accent-purple);color:var(--text-primary)}.action-btn:hover{background:var(--bg-card-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.tab-btn.active{background:var(--gradient-primary);color:#fff;border-color:transparent;box-shadow:var(--shadow-md)}.summary-content{padding:clamp(1rem,3vw,1.5rem);background:linear-gradient(135deg,#f472b605,#a78bfa05);border-radius:clamp(12px,3vw,16px);border:1px solid var(--border-light)}.summary-content p{line-height:1.7;color:var(--text-primary);margin-bottom:1.5rem;font-size:clamp(.9rem,2.5vw,1rem)}.summary-actions{display:flex;gap:clamp(.5rem,2vw,.75rem);flex-wrap:wrap;justify-content:center}.improvements-list{padding-left:clamp(1rem,3vw,1.5rem);margin:.5rem 0}.improvements-list li{margin-bottom:.5rem;line-height:1.6;font-size:clamp(.9rem,2vw,1rem)}.history-list{display:flex;flex-direction:column;gap:clamp(.5rem,1.5vw,.75rem)}.history-item{display:flex;align-items:center;gap:clamp(.75rem,2vw,1rem);padding:clamp(.75rem,2vw,1rem);background:linear-gradient(135deg,#60a5fa08,#34d39908);border-radius:12px;border:1px solid var(--border-light);transition:all .3s cubic-bezier(.4,0,.2,1);flex-wrap:wrap}.history-item:hover{background:linear-gradient(135deg,#60a5fa0f,#34d3990f);transform:translate(4px)}.history-icon{width:clamp(32px,8vw,36px);height:clamp(32px,8vw,36px);background:var(--gradient-secondary);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.history-details h4{font:500 clamp(.8rem,2vw,.875rem)/1 Inter;color:var(--text-primary);margin-bottom:.25rem}.history-details p{color:var(--text-muted);font-size:clamp(.7rem,1.8vw,.75rem)}@media (max-width: 1024px){.header-content{padding:0 1.5rem}.metrics-grid{grid-template-columns:repeat(2,1fr)}.result-card-box{flex-direction:column;gap:1.5rem}.action-buttons{justify-content:center}.summary-tabs{gap:.4rem}.sentiment-indicator{flex-direction:column;gap:.75rem;text-align:center}.sentiment-bar{min-width:200px}}@media (max-width: 768px){.main-container{padding:1rem}.upload-card{padding:1.5rem}.upload-area{padding:2rem 1rem}.results-grid{grid-template-columns:1fr;gap:1.5rem}.result-card-box{flex-direction:column;gap:1rem}.file-info{flex-direction:column;text-align:center;gap:1rem}.metrics-grid{grid-template-columns:1fr}.action-buttons{flex-direction:column;align-items:center}.btn-primary,.btn-secondary{width:100%;max-width:300px}.summary-tabs,.summary-actions{justify-content:center}.sentiment-indicator{flex-direction:column;gap:.5rem}.sentiment-label{white-space:normal}.sentiment-bar{min-width:150px}.card-header{flex-direction:column;align-items:center;text-align:center;gap:1rem}}@media (max-width: 480px){.header-content{padding:0 1rem}.upload-area{padding:1.5rem .75rem}.supported-formats{flex-direction:column;align-items:center}.file-info{flex-direction:column;text-align:center}.action-buttons{width:100%}.main-action-btn,.upload-btn,.action-btn,.tab-btn{width:100%;max-width:280px}.sentiment-bar{min-width:120px}.format-badge{min-width:120px;justify-content:center}}html{scroll-behavior:smooth}*:focus-visible{outline:2px solid var(--accent-purple);outline-offset:2px}::selection,::-moz-selection{background:var(--accent-pink);color:#fff}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--border-light);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--accent-purple);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-pink)}
