: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;display:flex;place-items:center;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-color:#1a1a1a;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}}*{box-sizing:border-box}html{overflow-x:hidden;width:100%}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#020617;color:#e5e7eb;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;width:100%}.app{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;width:100%;max-width:100vw}.app-header{position:sticky;top:0;z-index:10;padding:16px 24px;background:#0f172ae6;border-bottom:1px solid #1f2937;display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.header-left{display:flex;flex-direction:column;gap:6px;align-items:flex-start}.brand{display:flex;align-items:center;gap:12px}.brand h1,.header-left h1{margin:0;font-size:1.4rem}.header-left p{margin:4px 0 0;font-size:.85rem;color:#9ca3af}.header-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;max-width:280px}.header-mode-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:#9ca3af}.mode-selector{display:inline-flex;background:#020617;padding:4px;border-radius:999px;border:1px solid #1f2937;gap:4px}.mode-button{padding:6px 14px;border-radius:999px;border:none;background:transparent;color:#9ca3af;font-size:.8rem;cursor:pointer;transition:all .2s ease;min-height:36px;-webkit-tap-highlight-color:transparent}.mode-button:hover{background:#22c55e1a;color:#d1fae5}.send-button{background:#22c55e;border:none;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,background .2s ease;box-shadow:0 0 12px #19c37d66;padding:0;-webkit-tap-highlight-color:transparent}.send-button:hover{background:#15a86a;transform:scale(1.06)}.send-button:active{transform:scale(.93)}@media (hover: none) and (pointer: coarse){.send-button:hover{background:#22c55e;transform:none}.mode-button:hover{background:transparent;color:#9ca3af}.submit-button:hover{background:#22c55e}}.send-icon-image{width:28px;height:28px;filter:invert(1);pointer-events:none}.mode-active{background:#22c55e;color:#020617;font-weight:600}.header-mode-description{font-size:.7rem;color:#9ca3af;text-align:right}.header-logo{height:32px;width:auto}.app-main{width:100%;max-width:100%;padding:32px 48px;display:flex;flex-direction:column;gap:32px;box-sizing:border-box}.panel{background:#0f172ae6;border-radius:24px;border:1px solid #1f2937;padding:20px;box-shadow:0 18px 40px #00000080;max-width:100%;box-sizing:border-box;overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:12px}.panel-header h2,.panel-header h3{margin:0;font-size:1rem}.panel-subtitle{font-size:.75rem;color:#9ca3af}.top-section{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;width:100%;max-width:100%}.panel-left,.panel-right{display:flex;flex-direction:column;gap:16px}.prompt-form{display:flex;flex-direction:column;gap:12px}.form-group{display:flex;flex-direction:column;gap:4px}.label{font-size:.8rem;color:#d1d5db}.label-small{font-size:.75rem;color:#9ca3af}.textarea{min-height:140px;padding:8px 10px;border-radius:16px;border:1px solid #374151;background:#020617cc;color:#e5e7eb;font-size:.85rem;resize:vertical}.textarea:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 1px #22c55e66}.select{padding:6px 10px;border-radius:999px;border:1px solid #374151;background:#020617e6;color:#e5e7eb;font-size:.8rem}.select:focus{outline:none;border-color:#22c55e}.form-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.form-footer{margin-top:4px;display:flex;justify-content:space-between;align-items:center;gap:12px}.form-hint{font-size:.72rem;color:#9ca3af;max-width:700px}.optimized-prompt-container{margin-top:20px;padding:16px;background:linear-gradient(135deg,#fb923c1a,#f973160d);border-left:4px solid #fb923c;border-radius:8px;animation:slideDown .3s ease-out}.optimized-prompt-container.optimized-prompt-success{background:linear-gradient(135deg,#22c55e1a,#16a34a0d);border-left:4px solid #22c55e}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.optimized-prompt-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.optimized-prompt-icon{font-size:1.2rem}.optimized-prompt-title{font-size:.9rem;font-weight:600;color:#fb923c;text-transform:uppercase;letter-spacing:.5px}.optimized-prompt-success .optimized-prompt-title{color:#22c55e}.optimized-prompt-content{display:flex;flex-direction:column;gap:10px}.optimized-prompt-label{font-size:.85rem;color:#d1d5db;margin:0}.optimized-prompt-text{padding:12px;background:#0f172a80;border-radius:6px;border:1px solid rgba(251,146,60,.2);font-size:.9rem;color:#fbbf24;line-height:1.6;white-space:pre-wrap;word-break:break-word}.optimized-section{margin-bottom:16px}.optimized-section:last-child{margin-bottom:0}.optimized-section strong{display:block;color:#fb923c;font-size:.85rem;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.optimized-value{padding:10px;background:#22c55e1a;border-left:3px solid #22c55e;border-radius:4px;color:#d1fae5;font-size:.9rem;line-height:1.5}.optimized-improvement{padding:10px;background:#3b82f61a;border-left:3px solid #3b82f6;border-radius:4px;color:#bfdbfe;font-size:.85rem;line-height:1.5;font-style:italic}.submit-button{border:none;border-radius:999px;padding:8px 16px;font-size:.85rem;background:#22c55e;color:#020617;font-weight:600;cursor:pointer;box-shadow:0 0 16px #22c55e80;min-height:44px;-webkit-tap-highlight-color:transparent}.submit-button:hover{background:#4ade80}.submit-button:active{transform:scale(.97)}.panel-header-response{align-items:center}.badge-model{font-size:.75rem;background:#020617;border-radius:999px;border:1px solid #22c55e;padding:4px 10px;color:#bbf7d0;transition:all .3s ease}.badge-model-pulse{animation:pulseSmooth .8s ease-in-out 3,borderGlow .8s ease-in-out 3}@keyframes pulseSmooth{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes borderGlow{0%,to{border-color:#22c55e;box-shadow:0 0 #22c55e00}50%{border-color:#4ade80;box-shadow:0 0 16px #22c55e99}}.metrics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;font-size:.8rem;width:100%}.metric-card{border-radius:16px;border:1px solid #1f2937;background:#020617;padding:8px 10px;display:flex;flex-direction:column;gap:2px;min-width:0;overflow:hidden}.metric-title{color:#9ca3af}.metric-value{font-weight:600;font-size:.9rem}.metric-description{font-size:.7rem;color:#6b7280}.balance-section{margin-top:4px}.balance-bar{margin-top:6px;height:8px;border-radius:999px;background:#1f2937;overflow:hidden;position:relative}.balance-fill{position:absolute;left:0;top:0;bottom:0;width:60%;background:#22c55e;transition:width 1s ease-out}.balance-labels{margin-top:4px;display:flex;justify-content:space-between;font-size:.7rem;color:#9ca3af}.response-box{margin-top:8px;border-radius:16px;border:1px solid #1f2937;background:#020617cc;padding:10px;font-size:.85rem;color:#e5e7eb;overflow-wrap:break-word;word-break:break-word;max-width:100%}.bottom-section{display:grid;grid-template-columns:1fr 2fr;gap:24px;width:100%;max-width:100%}.panel-metrics{align-self:flex-start}.panel-metrics h3{margin:0 0 10px;font-size:.95rem}.global-metrics{display:flex;flex-direction:column;gap:6px;font-size:.85rem}.global-metric-row{display:flex;justify-content:space-between;align-items:center}.global-metric-value{color:#4ade80;font-weight:600}.global-metrics-note{margin-top:10px;font-size:.7rem;color:#9ca3af}.panel-history{display:flex;flex-direction:column;gap:8px}.panel-header-history{margin-bottom:4px}.table-wrapper{border-radius:16px;border:1px solid #1f2937;background:#020617;padding:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}.history-table{width:100%;border-collapse:collapse;font-size:.75rem}.history-table thead{background:#020617}.history-table th,.history-table td{padding:6px 8px;border-bottom:1px solid #111827;text-align:left;white-space:nowrap}.history-table th{color:#9ca3af;font-weight:500}.history-table td:nth-child(2){max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-table th:nth-child(1),.history-table td:nth-child(1){min-width:110px}.history-table th:nth-child(2),.history-table td:nth-child(2){min-width:150px}.history-table th:nth-child(3),.history-table td:nth-child(3){min-width:80px}.history-table th:nth-child(4),.history-table td:nth-child(4){min-width:100px}.history-table th:nth-child(5),.history-table td:nth-child(5){min-width:70px}.history-table th:nth-child(6),.history-table td:nth-child(6){min-width:80px}.history-table th:nth-child(7),.history-table td:nth-child(7){min-width:80px}.tag{display:inline-block;padding:3px 8px;border-radius:999px;background:#111827;color:#e5e7eb}.tag-outline{background:transparent;border:1px solid #374151}.quality-chip{display:inline-block;padding:3px 8px;border-radius:999px;border:1px solid rgba(34,197,94,.6);background:#16a34a1a;color:#6ee7b7}.history-empty{text-align:center;padding:12px;color:#9ca3af}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px 20px}.spinner{width:32px;height:32px;border:3px solid rgba(22,163,74,.1);border-top-color:#16a34a;border-right-color:#22c55e;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{margin:0;font-size:.9rem;color:#cbd5e1;font-weight:500;letter-spacing:.3px}@media (max-width: 960px){.top-section,.bottom-section{grid-template-columns:1fr}.app-main{padding:16px}.app-header{flex-direction:column;align-items:flex-start}.header-right{align-items:flex-start;max-width:100%;width:100%}.header-mode-description{text-align:left}.form-footer{flex-direction:column;align-items:flex-start;gap:12px}.send-button{align-self:flex-end}.form-hint{max-width:100%}.metrics-grid{grid-template-columns:1fr}.panel{width:100%}}@media (max-width: 768px){.app-header{padding:12px 16px}.brand h1{font-size:1.1rem}.header-left p{font-size:.8rem}.header-logo{height:28px}.app-main{padding:12px;gap:20px}.panel{padding:16px;border-radius:16px;width:100%;max-width:100%}.panel-header h2,.panel-header h3{font-size:.95rem}.panel-subtitle{font-size:.7rem}.metrics-grid{gap:10px;grid-template-columns:1fr}.metric-card{padding:10px}.metric-description{font-size:.7rem;overflow-wrap:break-word}.form-row{grid-template-columns:1fr}.textarea{min-height:120px;font-size:.9rem}.table-wrapper{font-size:.7rem}.history-table th,.history-table td{padding:6px}.history-table td:nth-child(2){max-width:150px}.send-button{width:48px;height:48px}.send-icon-image{width:24px;height:24px}.table-wrapper{overflow-x:auto}}@media (max-width: 480px){.app-header{padding:10px 12px;width:100%;box-sizing:border-box}.brand{flex-direction:column;align-items:flex-start;gap:8px;width:100%}.brand h1{font-size:1rem;word-break:break-word}.header-left p{font-size:.75rem;line-height:1.4}.header-logo{height:24px}.mode-selector{width:100%;justify-content:space-between}.mode-button{flex:1;font-size:.75rem;padding:6px 8px}.header-mode-label,.header-mode-description{font-size:.65rem}.app-main{padding:10px;gap:16px;width:100%;box-sizing:border-box}.panel{padding:12px;border-radius:12px;width:100%;max-width:100%;box-sizing:border-box}.panel-header{flex-direction:column;align-items:flex-start;gap:6px}.badge-model{font-size:.7rem;padding:3px 8px}.metrics-grid{gap:8px}.metric-card{padding:8px}.metric-title{font-size:.7rem}.metric-value{font-size:.85rem}.metric-description{font-size:.65rem;overflow-wrap:break-word;word-break:break-word}.textarea{min-height:100px;font-size:.85rem;padding:10px;width:100%;box-sizing:border-box}.form-footer{gap:10px;width:100%}.form-hint{font-size:.68rem;line-height:1.4;word-break:break-word}.send-button{width:44px;height:44px}.send-icon-image{width:22px;height:22px}.response-box{padding:10px;font-size:.8rem;width:100%;box-sizing:border-box;overflow-wrap:break-word;word-break:break-word}.balance-bar{height:6px}.balance-labels{font-size:.65rem}.global-metrics{font-size:.8rem}.global-metrics-note{font-size:.65rem}.table-wrapper{padding:6px}.history-table{font-size:.65rem}.history-table th,.history-table td{padding:5px 4px}.history-table td:nth-child(2){max-width:120px}.history-table th:nth-child(1),.history-table td:nth-child(1){min-width:80px}.history-table th:nth-child(2),.history-table td:nth-child(2){min-width:100px}.history-table th:nth-child(3),.history-table td:nth-child(3){min-width:60px}.history-table th:nth-child(4),.history-table td:nth-child(4){min-width:70px}.history-table th:nth-child(5),.history-table td:nth-child(5){min-width:55px}.history-table th:nth-child(6),.history-table td:nth-child(6){min-width:60px}.history-table th:nth-child(7),.history-table td:nth-child(7){min-width:60px}.tag{padding:2px 6px;font-size:.65rem}.loading-container{padding:24px 16px}.spinner{width:28px;height:28px}.loading-text{font-size:.8rem}}@media (max-width: 360px){.app-header{padding:8px 10px;width:100%;box-sizing:border-box}.brand h1{font-size:.9rem;word-break:break-word}.header-left p{font-size:.7rem}.header-logo{height:20px}.mode-button{font-size:.7rem;padding:5px 6px}.app-main{padding:8px;gap:12px;width:100%;box-sizing:border-box}.panel{padding:10px;width:100%;max-width:100%;box-sizing:border-box}.panel-header h2,.panel-header h3{font-size:.85rem}.metric-card{padding:6px 8px;width:100%;box-sizing:border-box}.textarea{min-height:90px;font-size:.8rem;padding:8px;width:100%;box-sizing:border-box}.send-button{width:40px;height:40px}.send-icon-image{width:20px;height:20px}.response-box{padding:8px;font-size:.75rem;width:100%;box-sizing:border-box;overflow-wrap:break-word;word-break:break-word}.history-table{font-size:.6rem}.history-table th,.history-table td{padding:4px 3px}.history-table th:nth-child(1),.history-table td:nth-child(1){min-width:70px}.history-table th:nth-child(2),.history-table td:nth-child(2){min-width:90px;max-width:100px}.history-table th:nth-child(3),.history-table td:nth-child(3){min-width:50px}.history-table th:nth-child(4),.history-table td:nth-child(4){min-width:60px}.history-table th:nth-child(5),.history-table td:nth-child(5){min-width:50px}.history-table th:nth-child(6),.history-table td:nth-child(6){min-width:55px}.history-table th:nth-child(7),.history-table td:nth-child(7){min-width:55px}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}}.clear-history-button{margin-top:8px;padding:6px 12px;font-size:.75rem;background:#ef4444;color:#fff;border:none;border-radius:999px;cursor:pointer;transition:background .2s ease;-webkit-tap-highlight-color:transparent}.history-header-content{display:flex;justify-content:space-between;align-items:center;width:100%;gap:20px}.history-header-content>div{flex:1}.history-header-content h3{margin:0 0 8px}.panel-header-history{display:flex;align-items:center;justify-content:space-between}.clear-history-button{padding:6px 12px;background-color:#e13636;color:#fff;border:none;border-radius:999px;cursor:pointer;font-size:12px;white-space:nowrap;transition:background-color .3s ease;-webkit-tap-highlight-color:transparent}.clear-history-button:hover{background-color:#ff5252}.clear-history-button:active{background-color:#ff3838}.app-footer{padding:16px 24px;background:#0f172ae6;border-top:1px solid #1f2937;text-align:center;font-size:.75rem;color:#9ca3af}