*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0f14;--bg-card: #1a1a23;--bg-input: #252530;--bg-hover: #2a2a38;--text: #e8e8f0;--text-dim: #8888a0;--text-muted: #5c5c74;--accent: #faa61a;--accent-dim: #c47f0a;--accent-bg: rgba(250, 166, 26, .1);--border: #2e2e3e;--shadow: 0 2px 16px rgba(0, 0, 0, .3);--radius: 12px;--radius-sm: 8px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans SC", sans-serif}html,body,#root{height:100%;width:100%}body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}.app{height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden}.config-page{height:100%;display:flex;align-items:center;justify-content:center;padding:clamp(16px,2.5vw,36px);background:radial-gradient(ellipse at top center,#1a1a2e,#0f0f14 70%)}.config-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(24px,3.5vw,48px);width:100%;max-width:min(480px,92vw);box-shadow:var(--shadow)}.config-header h1{font-size:clamp(22px,2.8vw,36px);font-weight:700;color:var(--accent);margin-bottom:clamp(3px,.4vw,8px)}.config-desc{color:var(--text-dim);font-size:clamp(13px,1.3vw,17px);margin-bottom:clamp(14px,2vw,28px)}.config-info{background:var(--bg-input);border-radius:var(--radius-sm);padding:clamp(12px,1.6vw,22px);margin-bottom:clamp(16px,2.4vw,32px);font-size:clamp(12px,1.2vw,16px);color:var(--text-dim)}.config-info p{margin-bottom:clamp(6px,.6vw,10px)}.config-info ul{list-style:none;padding:0}.config-info li{padding:clamp(3px,.3vw,6px) 0;padding-left:clamp(12px,1.4vw,20px);position:relative}.config-info li:before{content:"•";position:absolute;left:clamp(3px,.4vw,6px);color:var(--accent)}.api-form{display:flex;flex-direction:column;gap:clamp(12px,1.6vw,22px)}.field{display:flex;flex-direction:column;gap:clamp(4px,.5vw,8px)}.field label{font-size:clamp(12px,1.2vw,16px);font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px}.field input,.key-row input,.model-select{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);padding:clamp(8px,1vw,14px);color:var(--text);font-size:clamp(13px,1.3vw,17px);font-family:var(--font);width:100%;outline:none;transition:border-color .2s}.field input:focus,.key-row input:focus,.model-select:focus{border-color:var(--accent)}.model-select{cursor:pointer;-moz-appearance:auto;appearance:auto;-webkit-appearance:auto}.model-select option{background:var(--bg-card);color:var(--text)}.key-row{display:flex;gap:clamp(6px,.8vw,12px)}.key-row input{flex:1}.btn-icon{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);padding:clamp(6px,.8vw,12px) clamp(8px,1vw,16px);cursor:pointer;font-size:clamp(14px,1.5vw,20px);transition:background .2s}.btn-icon:hover{background:var(--bg-hover)}.btn-save{background:var(--accent);color:#0f0f14;border:none;border-radius:var(--radius-sm);padding:clamp(10px,1.2vw,16px) clamp(18px,2.4vw,32px);font-size:clamp(13px,1.4vw,19px);font-weight:700;cursor:pointer;transition:background .2s,transform .1s;margin-top:clamp(3px,.4vw,6px)}.btn-save:hover{background:var(--accent-dim)}.btn-save:active{transform:scale(.98)}.btn-start{background:transparent;color:var(--accent);border:1px solid var(--accent);border-radius:var(--radius-sm);padding:clamp(10px,1.2vw,16px) clamp(18px,2.4vw,32px);font-size:clamp(13px,1.4vw,19px);font-weight:700;cursor:pointer;width:100%;margin-top:clamp(12px,1.6vw,22px);transition:background .2s}.btn-start:hover{background:var(--accent-bg)}.api-status{display:flex;align-items:center;gap:clamp(6px,.6vw,10px);margin-top:clamp(10px,1.2vw,18px);font-size:clamp(12px,1.2vw,16px);color:#4ade80}.status-dot{width:clamp(6px,.7vw,10px);height:clamp(6px,.7vw,10px);background:#4ade80;border-radius:50%;display:inline-block}.chat-container{height:100vh;display:flex;flex-direction:column;max-width:min(900px,95vw);margin:0 auto;width:100%;position:relative}.chat-header{padding:clamp(12px,1.6vw,24px) clamp(16px,2.4vw,32px);display:flex;align-items:center;gap:clamp(8px,1vw,16px);border-bottom:1px solid var(--border);flex-shrink:0}.chat-header h1{font-size:clamp(16px,2vw,28px);color:var(--accent);font-weight:700}.chat-header .subtitle{font-size:clamp(12px,1.2vw,16px);color:var(--text-dim)}.detected-badge{margin-left:auto;font-size:clamp(11px,1vw,14px);background:var(--accent-bg);color:var(--accent);padding:clamp(3px,.4vw,6px) clamp(8px,1.2vw,16px);border-radius:20px;white-space:nowrap}.chat-messages{flex:1;overflow-y:auto;padding:clamp(14px,2vw,28px) clamp(16px,2.4vw,32px);display:flex;flex-direction:column;gap:clamp(12px,1.4vw,22px);scroll-behavior:smooth}.chat-messages::-webkit-scrollbar{width:clamp(4px,.5vw,8px)}.chat-messages::-webkit-scrollbar-track{background:transparent}.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.message{display:flex;gap:clamp(8px,1vw,16px);max-width:min(85%,720px)}.message.user{align-self:flex-end;flex-direction:row-reverse}.avatar{width:clamp(28px,3vw,42px);height:clamp(28px,3vw,42px);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:clamp(14px,1.6vw,24px);flex-shrink:0}.bubble{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(10px,1.2vw,20px);font-size:clamp(13px,1.3vw,17px);line-height:1.7;color:var(--text)}.message.user .bubble{background:var(--accent-bg);border-color:var(--accent-dim)}.bubble.streaming{border-color:var(--accent)}.msg-line{word-wrap:break-word;white-space:pre-wrap}.msg-spacer{height:clamp(4px,.5vw,8px)}.msg-li{margin-left:clamp(12px,1.6vw,24px);word-wrap:break-word}.bubble h3{font-size:clamp(13px,1.4vw,19px);font-weight:700;color:var(--accent);margin:clamp(8px,1vw,16px) 0 clamp(4px,.5vw,8px)}.bubble h3:first-child{margin-top:0}.bubble strong{color:var(--accent);font-weight:600}.bubble a{color:#60a5fa;text-decoration:none}.bubble a:hover{text-decoration:underline}.cursor{display:inline-block;width:2px;height:clamp(12px,1.4vw,20px);background:var(--accent);margin-left:2px;animation:blink .8s step-end infinite;vertical-align:text-bottom}@keyframes blink{50%{opacity:0}}.thinking-dots{color:var(--text-dim);font-size:clamp(13px,1.3vw,17px)}.dot1,.dot2,.dot3{animation:dotPulse 1.4s infinite}.dot2{animation-delay:.2s}.dot3{animation-delay:.4s}@keyframes dotPulse{0%,80%,to{opacity:.3}40%{opacity:1}}.chat-input-area{padding:clamp(12px,1.6vw,22px) clamp(16px,2.4vw,32px);border-top:1px solid var(--border);display:flex;gap:clamp(8px,1vw,16px);align-items:flex-end;flex-shrink:0}.chat-input-area textarea{flex:1;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(10px,1.2vw,16px);color:var(--text);font-size:clamp(13px,1.3vw,17px);font-family:var(--font);resize:none;outline:none;transition:border-color .2s;line-height:1.5}.chat-input-area textarea:focus{border-color:var(--accent)}.chat-input-area textarea::placeholder{color:var(--text-muted)}.chat-input-area textarea:disabled{opacity:.5}.btn-send{background:var(--accent);color:#0f0f14;border:none;border-radius:var(--radius);padding:clamp(10px,1.2vw,16px) clamp(16px,2vw,28px);font-size:clamp(13px,1.3vw,17px);font-weight:700;cursor:pointer;transition:background .2s,transform .1s;white-space:nowrap;min-width:clamp(64px,8vw,90px)}.btn-send:hover:not(:disabled){background:var(--accent-dim)}.btn-send:active:not(:disabled){transform:scale(.97)}.btn-send:disabled{opacity:.4;cursor:not-allowed}.header-menu-area{position:relative;margin-left:auto}.btn-menu{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);width:clamp(32px,3.5vw,46px);height:clamp(32px,3.5vw,46px);display:flex;align-items:center;justify-content:center;font-size:clamp(16px,2vw,26px);font-weight:700;color:var(--text-dim);cursor:pointer;transition:background .2s,border-color .2s;line-height:1}.btn-menu:hover{background:var(--bg-hover);border-color:var(--accent);color:var(--text)}.menu-dropdown{position:absolute;top:calc(100% + 6px);right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow);min-width:clamp(150px,18vw,220px);z-index:200;overflow:hidden}.menu-item{display:block;width:100%;padding:clamp(8px,1vw,14px) clamp(12px,1.6vw,22px);background:none;border:none;color:var(--text);font-size:clamp(13px,1.3vw,17px);text-align:left;cursor:pointer;font-family:var(--font);transition:background .15s}.menu-item:hover{background:var(--bg-hover)}.menu-danger{color:#ef4444;border-top:1px solid var(--border)}.menu-danger:hover{background:#ef44441a}.btn-config-toggle{position:fixed;bottom:clamp(60px,8vw,100px);right:clamp(12px,2vw,28px);width:clamp(38px,4.2vw,54px);height:clamp(38px,4.2vw,54px);border-radius:50%;background:var(--bg-card);border:1px solid var(--border);color:var(--text-dim);font-size:clamp(16px,2vw,26px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s;z-index:100;box-shadow:var(--shadow)}.btn-config-toggle:hover{background:var(--bg-hover);border-color:var(--accent)}@media(min-width:1920px){.chat-container{max-width:min(1200px,85vw)}.config-card{max-width:min(600px,80vw)}.message{max-width:min(75%,800px)}.config-page{padding:clamp(24px,3vw,48px)}}@media(min-width:2560px){.chat-container{max-width:min(1440px,75vw)}.config-card{max-width:min(720px,70vw)}.message{max-width:min(65%,960px)}.config-page{padding:clamp(32px,4vw,64px)}}@media(max-width:600px){.config-card{padding:clamp(18px,4vw,24px) clamp(14px,3vw,20px)}.chat-header{padding:clamp(10px,2vw,12px) clamp(12px,3vw,16px)}.chat-header h1{font-size:clamp(16px,4vw,20px)}.chat-messages{padding:clamp(10px,2.5vw,12px) clamp(12px,3vw,16px);gap:14px}.chat-input-area{padding:clamp(10px,2.5vw,12px) clamp(12px,3vw,16px);gap:8px}.chat-input-area textarea{font-size:14px;padding:10px 12px}.message{max-width:98%;gap:8px}.bubble{padding:10px 14px;font-size:14px;line-height:1.6}.bubble h3{font-size:15px}.avatar{width:28px;height:28px;font-size:14px}.btn-send{padding:10px 16px;font-size:14px;min-width:60px}.detected-badge{font-size:11px;padding:3px 10px}.home-header{padding:clamp(24px,6vw,32px) clamp(14px,3vw,20px) clamp(18px,4vw,24px)}.tool-grid{padding:0 clamp(12px,3vw,16px) clamp(24px,6vw,32px);grid-template-columns:1fr}.tool-card{padding:clamp(12px,3vw,16px)}.brand-name{font-size:clamp(20px,5vw,24px)}.config-header h1{font-size:clamp(20px,5vw,26px)}.config-desc{font-size:13px}.field input,.key-row input,.model-select{font-size:14px;padding:10px 12px}.btn-save,.btn-start{padding:12px 20px;font-size:14px}.menu-dropdown{min-width:160px}}@media(max-width:360px){.config-card{padding:14px 10px}.config-header h1{font-size:18px}.config-desc{font-size:11px;margin-bottom:14px}.chat-header{padding:6px 8px;gap:4px}.chat-header h1{font-size:15px}.chat-header .subtitle{display:none}.chat-messages{padding:8px;gap:8px}.chat-input-area{padding:8px;gap:6px}.chat-input-area textarea{padding:8px;font-size:13px}.btn-send{padding:8px 12px;font-size:13px;min-width:50px}.message{max-width:100%;gap:6px}.bubble{padding:8px 12px;font-size:13px}.avatar{width:22px;height:22px;font-size:11px}.detected-badge{font-size:10px;padding:2px 8px}.btn-menu{width:26px;height:26px;font-size:12px}.menu-item{padding:6px 10px;font-size:12px}.menu-dropdown{min-width:120px}.btn-config-toggle{width:32px;height:32px;font-size:14px;bottom:50px;right:8px}.brand-name{font-size:18px}.tool-card{padding:10px;gap:8px}.tool-icon{width:32px;height:32px;font-size:16px}.tool-title{font-size:12px}.tool-desc{font-size:11px}.home-footer{font-size:10px;padding:12px}.field input,.key-row input,.model-select{font-size:13px;padding:8px 10px}.btn-save,.btn-start{padding:10px 16px;font-size:13px}.field label{font-size:11px}.api-form{gap:10px}.config-info{padding:10px;font-size:11px}.btn-icon{padding:5px 8px;font-size:13px}}.home-page{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at top center,#1a1a2e,#0f0f14 70%)}.home-header{text-align:center;padding:clamp(32px,5vw,64px) clamp(16px,2.5vw,32px) clamp(24px,3vw,40px)}.brand{display:flex;align-items:center;justify-content:center;gap:clamp(6px,.8vw,12px);margin-bottom:clamp(6px,.8vw,12px)}.brand-icon{font-size:clamp(22px,3vw,38px)}.brand-name{font-size:clamp(22px,3vw,38px);font-weight:800;color:var(--text);letter-spacing:-.5px}.brand-dot{color:var(--text-muted);font-size:clamp(16px,2vw,28px)}.brand-tag{font-size:clamp(14px,1.5vw,20px);color:var(--text-dim);font-weight:400}.home-subtitle{font-size:clamp(13px,1.3vw,17px);color:var(--text-muted)}.tool-grid{flex:1;max-width:min(640px,90vw);width:100%;margin:0 auto;padding:0 clamp(16px,2.5vw,32px) clamp(32px,5vw,64px);display:flex;flex-direction:column;gap:clamp(10px,1vw,18px)}.tool-card{display:flex;align-items:center;gap:clamp(12px,1.6vw,24px);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(14px,2vw,28px);cursor:pointer;transition:all .2s;text-align:left;width:100%;font-family:var(--font);color:var(--text);position:relative}.tool-card:hover:not(:disabled){border-color:var(--accent);background:var(--bg-hover);transform:translateY(-1px);box-shadow:var(--shadow)}.tool-card:active:not(:disabled){transform:translateY(0)}.tool-card:disabled{opacity:.5;cursor:not-allowed}.tool-card--soon{border-style:dashed}.tool-icon{width:clamp(40px,4.5vw,60px);height:clamp(40px,4.5vw,60px);border-radius:var(--radius-sm);background:var(--bg-input);display:flex;align-items:center;justify-content:center;font-size:clamp(20px,2.4vw,32px);flex-shrink:0}.tool-body{flex:1;min-width:0}.tool-title{font-size:clamp(14px,1.5vw,20px);font-weight:700;margin-bottom:clamp(3px,.3vw,6px);display:flex;align-items:center;gap:clamp(6px,.6vw,10px)}.tool-badge{font-size:clamp(10px,1vw,14px);font-weight:600;background:var(--bg-input);color:var(--text-dim);padding:clamp(1px,.15vw,3px) clamp(6px,.8vw,12px);border-radius:10px;white-space:nowrap}.tool-desc{font-size:clamp(12px,1.2vw,16px);color:var(--text-dim);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tool-tags{display:flex;gap:clamp(4px,.5vw,8px);margin-top:clamp(6px,.8vw,12px);flex-wrap:wrap}.tool-tag{font-size:clamp(10px,1vw,14px);padding:clamp(2px,.2vw,4px) clamp(6px,.8vw,12px);border-radius:6px;background:var(--bg-input);color:var(--text-muted)}.tool-arrow{font-size:clamp(14px,1.6vw,24px);color:var(--text-muted);flex-shrink:0;transition:transform .2s}.tool-card:hover:not(:disabled) .tool-arrow{transform:translate(4px);color:var(--accent)}.home-footer{text-align:center;padding:clamp(14px,2vw,28px);font-size:clamp(11px,1vw,14px);color:var(--text-muted);border-top:1px solid var(--border)}.ow-coach-page{height:100vh;display:flex;flex-direction:column}.chat-topbar{display:flex;align-items:center;justify-content:space-between;padding:clamp(6px,.8vw,12px) clamp(12px,1.6vw,24px);border-bottom:1px solid var(--border);flex-shrink:0;background:var(--bg)}.btn-back-chat{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);padding:clamp(4px,.5vw,8px) clamp(8px,1vw,16px);font-size:clamp(12px,1.2vw,16px);color:var(--text-dim);cursor:pointer;font-family:var(--font);transition:all .2s}.btn-back-chat:hover{border-color:var(--accent);color:var(--accent)}.btn-config-toggle-chat{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);width:clamp(28px,3vw,42px);height:clamp(28px,3vw,42px);display:flex;align-items:center;justify-content:center;font-size:clamp(14px,1.5vw,20px);color:var(--text-dim);cursor:pointer;transition:all .2s}.btn-config-toggle-chat:hover{border-color:var(--accent)}.ow-coach-page .chat-container{height:0;flex:1}.btn-back{position:absolute;top:clamp(14px,2vw,28px);left:clamp(14px,2vw,28px);background:none;border:1px solid var(--border);border-radius:var(--radius-sm);padding:clamp(4px,.6vw,8px) clamp(10px,1.4vw,20px);font-size:clamp(13px,1.3vw,17px);color:var(--text-dim);cursor:pointer;font-family:var(--font);transition:all .2s;z-index:10}.btn-back:hover{border-color:var(--accent);color:var(--accent)}.config-page{position:relative}.ow-coach-page .config-page{height:100vh}