@import "https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#1f2933;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background-color:#f5f7f9;font-family:"Source Sans 3",Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}body,#root{min-height:100vh}.app{background:radial-gradient(circle at top,#fff 0%,#f5f7f9 45%,#eef1f4 100%);justify-content:center;align-items:center;min-height:100vh;padding:48px 20px;display:flex}.top-nav{letter-spacing:.08em;text-transform:uppercase;color:#1f2933;z-index:5;align-items:center;gap:10px;font-size:1.1rem;font-weight:700;display:inline-flex;position:fixed;top:16px;left:20px}.top-nav img{width:32px;height:32px;display:block}.app-card{background:#fff;border:1px solid #e3e6ea;border-radius:20px;flex-direction:column;gap:24px;width:min(680px,100%);padding:36px;display:flex;position:relative;box-shadow:0 18px 50px #1f293314}.auth-card{width:min(520px,100%)}.activity-card{width:min(560px,100%)}.auth-header{align-items:flex-start}.auth-toggle{gap:12px;display:flex}.auth-form{gap:16px;display:grid}.auth-form label{color:#52606d;gap:8px;font-weight:600;display:grid}.auth-form input{border:1px solid #cbd2d9;border-radius:12px;padding:12px 14px;font-family:inherit;font-size:1rem}.auth-form input:focus{border-color:#0000;outline:2px solid #9aa5b1}.app-header{justify-content:space-between;align-items:center;gap:24px;display:flex}.activity-header{justify-content:flex-start;align-items:flex-start}.back-button{margin-top:2px}.header-actions{align-items:center;gap:12px;display:flex}.card-footer{justify-content:flex-end;gap:12px;display:flex}.activity-grid{gap:16px;display:grid}.language-select{color:#52606d;gap:8px;font-weight:600;display:grid}.language-select select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2352606d' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") right 14px center/12px 8px no-repeat;border:1px solid #cbd2d9;border-radius:12px;padding:12px 42px 12px 14px;font-family:inherit;font-size:1rem}.language-select select:focus{border-color:#0000;outline:2px solid #9aa5b1}.config-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;display:grid}.activity-label{letter-spacing:.08em;text-transform:uppercase;color:#7b8794;font-size:.75rem;font-weight:700;display:inline-block}.activity-button{text-align:left;gap:8px;padding:18px;display:grid}.activity-button span{font-size:1.1rem;font-weight:700}.activity-button small{color:#7b8794;font-weight:500}.profile-line{color:#7b8794;margin-top:4px;font-size:.9rem}.app-header h1{margin-bottom:6px;font-size:2rem;font-weight:600}.activity-title{margin-bottom:4px;font-size:1.5rem;font-weight:600}.app-header p{color:#52606d;font-size:1.05rem}.status-dot{background:#cbd2d9;border-radius:50%;width:10px;height:10px;position:absolute;top:18px;right:18px;box-shadow:0 0 0 4px #cbd2d940}.status-dot.status-idle{background:#9aa5b1;box-shadow:0 0 0 4px #9aa5b133}.status-dot.status-connecting{background:#f5a524;box-shadow:0 0 0 4px #f5a52440}.status-dot.status-connected{background:#2f855a;box-shadow:0 0 0 4px #2f855a40}.status-dot.status-error{background:#c53030;box-shadow:0 0 0 4px #c5303040}.controls{gap:12px;display:flex}.mode-toggle{flex-wrap:wrap;gap:12px;display:flex}.mode-toggle button.active,.auth-toggle button.active{color:#1f2933;background:#e4e7eb;border-color:#9aa5b1}.image-panel{gap:10px;display:grid}.image-frame{aspect-ratio:16/9;background:#f8f9fb;border:1px solid #e4e7eb;border-radius:18px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.image-frame img{object-fit:cover;width:100%;height:100%}.image-status{color:#7b8794;font-size:.95rem}.image-credit{color:#7b8794;font-size:.85rem}button{color:#1f2933;cursor:pointer;background-color:#fff;border:1px solid #cbd2d9;border-radius:12px;padding:10px 16px;font-family:inherit;font-size:1rem;font-weight:600;transition:transform .15s,box-shadow .15s,border-color .15s}button:hover:not(:disabled){border-color:#9aa5b1;transform:translateY(-1px);box-shadow:0 8px 16px #1f293314}button:disabled{opacity:.6;cursor:not-allowed}button.primary{color:#fff;background:#1f2933;border-color:#0000}button.primary:hover:not(:disabled){border-color:#0000;box-shadow:0 10px 18px #1f29332e}.error{color:#b42318;background:#fdecec;border-radius:12px;padding:12px 14px;font-weight:500}.messages{flex-direction:column;gap:12px;min-height:200px;max-height:320px;padding-right:4px;display:flex;overflow:auto}.latest-reply{color:#1f2933;background:#f4f5f7;border-radius:16px;gap:8px;min-height:160px;padding:16px 18px;display:grid}.latest-label{letter-spacing:.08em;text-transform:uppercase;color:#7b8794;font-size:.75rem;font-weight:700}.latest-text{color:#1f2933;white-space:pre-wrap;font-size:1rem;line-height:1.6}.message{color:#1f2933;background:#f4f5f7;border-radius:16px;gap:8px;padding:12px 16px;display:grid}.message.user{background:#eef2ff}.message.assistant{background:#f0f4f8}.message .role{text-transform:uppercase;letter-spacing:.08em;color:#7b8794;font-size:.75rem;font-weight:700}.message p{color:#1f2933;font-size:1rem}.empty{color:#7b8794;font-style:italic}.composer{gap:12px;display:flex}.composer input{border:1px solid #cbd2d9;border-radius:12px;flex:1;padding:12px 14px;font-family:inherit;font-size:1rem}.composer input:focus{border-color:#0000;outline:2px solid #9aa5b1}@media (max-width:720px){.app-card{padding:28px}.app-header{flex-direction:column;align-items:flex-start}.activity-header{flex-direction:row;align-items:center;gap:12px}.back-button{width:auto}.controls,.composer{flex-direction:column}button,.composer input{width:100%}}.correction-stack{z-index:10;flex-direction:column;gap:12px;width:min(320px,90vw);display:flex;position:fixed;bottom:24px;right:24px}.vocab-stack{z-index:10;flex-direction:column;gap:12px;width:min(320px,90vw);display:flex;position:fixed;bottom:24px;left:24px}.vocab-card header .needs-work{color:#92400e;background:#fef3c7}.correction-card{background:#fff;border:1px solid #e4e7eb;border-radius:16px;gap:8px;padding:14px 16px 16px;animation:.25s correction-slide,.4s 9.4s forwards correction-fade;display:grid;box-shadow:0 14px 30px #1f29331f}.correction-card header{text-transform:uppercase;letter-spacing:.08em;color:#7b8794;justify-content:space-between;align-items:center;font-size:.8rem;font-weight:700;display:flex}.correction-card header span:last-child{background:#f0f4f8;border-radius:999px;padding:4px 8px;font-size:.7rem}.correction-card header .needs-work{color:#b42318;background:#fdecec}.correction-card header .good{color:#1f7a4d;background:#e6f7ee}.correction-card .line{color:#1f2933;font-size:.95rem}.correction-card .line strong{color:#52606d;font-weight:600}.correction-diff{color:#1f2933;word-break:break-word;white-space:pre-wrap;font-size:.95rem}.correction-diff .diff-remove{color:#b42318;background:#fdecec;border-radius:6px;margin-right:2px;padding:0 4px;text-decoration:line-through}.correction-diff .diff-add{color:#046c4e;background:#e6f7ee;border-radius:6px;margin-right:2px;padding:0 4px}.correction-diff .diff-equal{color:#1f2933}@keyframes correction-slide{0%{opacity:0;transform:translate(20px,20px)}to{opacity:1;transform:translate(0,0)}}@keyframes correction-fade{to{opacity:0;transform:translateY(-6px)}}
