:root{color-scheme:light;--brand:#f36b3b;--brand-hover:#dc5829;--canvas:#f6f5f2;--surface:#fff;--surface-2:#faf9f6;--text:#292b28;--muted:#8b8d85;--line:#e9e9e3;--border:var(--line);--foreground:var(--text);--secondary-surface:var(--surface-2);--success:#408363;--danger:#c84740;--focus:#f36b3b24;--shadow:0 4px 6px #292b2802,0 18px 60px -30px #292b282b;--max-width:1160px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
:root.dark{color-scheme:dark;--canvas:#191b18;--surface:#21231f;--surface-2:#252722;--text:#eceee7;--muted:#989e90;--line:#34382f;--danger:#ed8074;--focus:#f36b3b35;--shadow:0 16px 60px -30px #0009}
*{box-sizing:border-box}html{min-height:100%;background:var(--canvas)}body{margin:0;min-height:100vh;color:var(--text);font-size:14px;line-height:1.5;background:radial-gradient(ellipse at 50% 105%,#f36b3b07,transparent 55%),var(--canvas)}button,input,textarea,select{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[hidden]{display:none!important}::selection{background:#f36b3b33}.sr-only,.skip-link:not(:focus){position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}.skip-link:focus{position:fixed;z-index:100;top:10px;left:10px;background:var(--surface);padding:12px}
.site-header{background:color-mix(in srgb,var(--canvas) 85%,transparent);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}.header-inner{width:min(calc(100% - 64px),1320px);height:88px;margin:auto;display:flex;align-items:center;gap:44px}.brand{font-size:21px;font-weight:650;text-decoration:none;display:flex;align-items:center;gap:9px}.desktop-nav{display:flex;gap:4px;align-items:center;margin:auto}.desktop-nav a,.mobile-nav a{min-height:42px;display:flex;align-items:center;gap:8px;text-decoration:none;font-size:13px;color:var(--muted);padding:10px 15px;border-radius:8px;transition:color .2s,background .2s}.desktop-nav a svg{width:17px;height:17px}.desktop-nav a.active{color:var(--text);background:var(--surface);box-shadow:0 1px 4px #00000006}.desktop-nav a.active svg{color:var(--brand)}.desktop-nav a:hover,.mobile-nav a:hover{color:var(--text);background:color-mix(in srgb,var(--surface) 70%,transparent)}.header-actions{display:flex;gap:2px}.icon-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;min-height:40px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--muted);transition:color .16s,background .16s,transform .16s}.icon-button:hover{color:var(--text);background:color-mix(in srgb,var(--text) 5%,transparent)}.icon-button:active{transform:scale(.92)}.icon-button:disabled{opacity:.3;cursor:default}.menu-button{display:none}.mobile-nav{padding:8px 18px 18px;animation:enter .25s ease}.mobile-nav a.active{color:var(--brand)}
.workspace{width:min(calc(100% - 64px),var(--max-width));margin:0 auto;padding:52px 0 96px;outline:none;animation:enter .5s cubic-bezier(.2,.8,.2,1)}.service-mount{min-height:470px}.page-heading{display:none}.site-footer{display:none}.instrument{border:1px solid var(--line);background:var(--surface);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.instrument-toolbar{min-height:76px;padding:0 28px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.toolbar-note,.counter,kbd{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;font-family:inherit;font-weight:400}.toolbar-note{white-space:nowrap}.instrument-toolbar>.language-tabs{max-width:400px;width:100%}
.language-tabs{--options:3;--selected:0;display:grid;grid-template-columns:repeat(var(--options),minmax(0,1fr));position:relative;gap:0;align-self:stretch;min-height:60px;isolation:isolate}.language-tabs:after{content:'';height:2px;position:absolute;left:0;bottom:0;width:calc(100% / var(--options));transform:translateX(calc(var(--selected) * 100%));background:var(--brand);border-radius:2px;transition:transform .32s cubic-bezier(.22,1,.36,1)}.language-tabs button{position:relative;border:0;background:transparent;padding:12px 10px;font-size:13px;color:var(--muted);white-space:nowrap;transition:color .2s}.language-tabs button:hover{color:var(--text)}.language-tabs button[aria-checked=true]{color:var(--text);font-weight:600}.language-tabs button:disabled{opacity:.4;cursor:default}
.translate-languages{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);align-items:center;border-bottom:1px solid var(--line);min-height:76px;padding:0 20px}.translate-languages>.icon-button{justify-self:center;color:var(--muted)}.language-slot{height:76px;padding:0 10px}.language-slot .language-tabs{height:100%;max-width:390px;margin:auto}.editor-grid,.tool-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.editor-pane{display:flex;flex-direction:column;min-width:0;min-height:382px;margin:0}.editor-pane+.editor-pane{border-left:1px solid var(--line)}.output-pane{background:var(--surface-2)}.editor-content{position:relative;flex:1;min-width:0}.writing-area{display:block;width:100%;min-height:292px;max-height:60vh;resize:none;padding:32px 54px 24px 32px;border:0;border-radius:0;background:transparent;color:var(--text);font-size:20px;line-height:1.65;outline:none;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}.writing-area::placeholder,.output-text[data-empty=true]{color:color-mix(in srgb,var(--muted) 63%,transparent)}.writing-area:focus{outline:none;box-shadow:inset 0 2px 0 #f36b3b14}.editor-content>[data-clear]{position:absolute;right:14px;top:20px}.editor-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:84px;padding:16px 24px}.primary-group{display:flex;align-items:center;gap:16px}.primary-group kbd{opacity:.7}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:42px;padding:10px 18px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text);text-decoration:none;font-size:13px;font-weight:550;transition:background .18s,box-shadow .18s,transform .18s}.button:hover{background:var(--surface-2)}.button:active{transform:translateY(1px) scale(.98)}.button:disabled{opacity:.4;cursor:default}.button--primary{background:var(--brand);color:#fff;box-shadow:0 3px 8px #f36b3b20}.button--primary:not(:disabled):hover{background:var(--brand-hover);box-shadow:0 4px 14px #f36b3b30}.button--primary:disabled{box-shadow:none}.button--ghost,.button--secondary{background:transparent;color:var(--muted)}.button--ghost:hover,.button--secondary:hover{color:var(--text);background:color-mix(in srgb,var(--text) 5%,transparent)}.button svg{width:17px;height:17px}.is-busy:before,.spinner{content:'';display:inline-block;width:14px;height:14px;border:1.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .75s linear infinite}.is-busy>svg{display:none}.inline-error{font-size:12px;color:var(--danger);max-width:90%}.inline-error:empty{display:none}.text-skeleton{position:absolute;inset:40px 32px;display:flex;flex-direction:column;gap:18px}.text-skeleton i{height:13px;width:90%;border-radius:4px;background:linear-gradient(100deg,var(--line) 20%,var(--surface) 45%,var(--line) 70%);background-size:220% 100%;animation:shimmer 1.4s linear infinite}.text-skeleton i:nth-child(2){width:75%;animation-delay:.1s}.text-skeleton i:nth-child(3){width:46%;animation-delay:.2s}
.status{font-size:12px;color:var(--muted);margin:0;padding:0;border:0;background:transparent;line-height:1.5}.status:empty{display:none}.status--error{color:var(--danger)}.status--busy{display:flex;gap:8px;align-items:center}.status--busy:before{content:'';width:6px;height:6px;background:var(--brand);border-radius:50%;animation:breathe 1.1s infinite}.status--success{color:var(--muted)}.result{white-space:pre-wrap;overflow-wrap:anywhere}.audio-pane{position:relative;justify-content:center}.voice-art{min-height:235px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;flex:1}.sound-wave{display:flex;align-items:center;justify-content:center;gap:5px;height:88px;width:220px}.sound-wave i{height:var(--bar);width:4px;border-radius:3px;background:color-mix(in srgb,var(--brand) 35%,var(--line));transform:scaleY(.6);transition:background .35s,transform .35s}.is-playing .sound-wave i{background:var(--brand);animation:wave .85s ease-in-out infinite alternate;animation-delay:var(--delay)}.audio-duration{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;min-height:18px}.audio-result{padding:0 28px 18px;display:flex;flex-direction:column;align-items:center;gap:12px}.audio-result audio{width:100%;height:40px}.audio-pane>.editor-footer{min-height:38px;padding:0 28px 18px}
.dropzone{cursor:pointer;transition:background .25s,border-color .25s,transform .25s}.dropzone:hover,.dropzone.is-dragging{background:color-mix(in srgb,var(--brand) 4%,var(--surface));border-color:var(--brand)}.dropzone:focus-within{outline:2px solid var(--brand);outline-offset:4px}.dropzone__meta,.hint{font-size:12px;color:var(--muted)}.upload-art{position:relative;display:grid;place-items:center;width:84px;height:94px;margin:0 auto 22px;isolation:isolate}.upload-art:before,.upload-art:after{content:'';position:absolute;width:64px;height:78px;border:1px solid var(--line);border-radius:8px;background:var(--surface);transition:transform .35s cubic-bezier(.22,1,.36,1)}.upload-art:before{transform:rotate(-12deg) translate(-8px,2px);z-index:-2}.upload-art:after{transform:rotate(8deg) translate(8px,0);z-index:-1}.upload-art>svg{box-sizing:content-box;padding:18px 14px;width:28px;height:38px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--brand);transition:transform .35s}.dropzone:hover .upload-art:before{transform:rotate(-18deg) translate(-12px,3px)}.dropzone:hover .upload-art:after{transform:rotate(13deg) translate(12px,0)}.dropzone:hover .upload-art>svg{transform:translateY(-5px)}
.loading-state{height:340px;display:grid;place-content:center;color:var(--muted)}.progress{height:2px;overflow:hidden;background:var(--line)}.progress>span{display:block;width:40%;height:100%;background:var(--brand);animation:scan 1.4s infinite}.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}input:not([type=file]),select{min-height:42px;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:8px 12px}button:focus-visible,a:focus-visible{outline:2px solid var(--brand);outline-offset:3px}textarea:focus-visible{outline:none}
@keyframes enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{to{background-position:-220% 0}}@keyframes wave{from{transform:scaleY(.35)}to{transform:scaleY(1)}}@keyframes breathe{50%{opacity:.3}}@keyframes scan{from{transform:translateX(-100%)}to{transform:translateX(350%)}}
@media(max-width:800px){.header-inner{width:calc(100% - 36px);gap:12px;height:74px}.desktop-nav{gap:0}.desktop-nav a{padding:10px;font-size:12px}.desktop-nav a svg{display:none}.workspace{width:calc(100% - 36px);padding-top:28px}.writing-area{font-size:18px;padding:24px 44px 20px 24px}.language-tabs button{font-size:12px;padding:10px 5px}.translate-languages{padding:0 10px;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr)}.language-slot{padding:0}.editor-footer{padding:16px}.primary-group kbd{display:none}.instrument-toolbar{padding:0 20px}}
@media(max-width:600px){.desktop-nav{display:none}.header-actions{margin-left:auto}.menu-button{display:inline-flex}.workspace{padding-top:20px;padding-bottom:48px}.instrument{border-radius:12px}.translate-languages{grid-template-columns:minmax(0,1fr) 40px;gap:0;position:relative}.language-slot{height:56px}.translate-languages>.language-slot:last-child{grid-column:1;grid-row:2}.translate-languages>[data-swap]{grid-column:2;grid-row:1/3}.language-slot .language-tabs{max-width:none}.editor-grid,.tool-grid{grid-template-columns:1fr}.editor-pane{min-height:280px}.editor-pane+.editor-pane{border-left:0;border-top:1px solid var(--line)}.writing-area{min-height:210px;max-height:45vh;font-size:18px}.editor-footer{min-height:72px}.instrument-toolbar{min-height:64px;padding:0 16px}.toolbar-note{display:none}.voice-art{min-height:200px}.audio-pane>.editor-footer{min-height:0}.language-tabs{min-height:58px}.instrument-toolbar>.language-tabs{max-width:none}.output-pane .writing-area{padding-right:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.ocr-instrument>.instrument-toolbar>.language-tabs{max-width:650px}.ocr-tool__form{padding:26px 28px 0}.ocr-tool__drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:290px;border:1px dashed var(--line);border-radius:10px;background:var(--surface-2);overflow:hidden;padding:32px 20px}.ocr-tool__drop-title{font-size:17px;font-weight:500}.ocr-tool__hint{margin-top:6px;font-size:12px;color:var(--muted)}.ocr-tool__file{margin-top:14px;color:var(--brand);font-size:12px;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ocr-tool__file:empty{display:none}.ocr-input-footer{min-height:82px;display:flex;justify-content:space-between;align-items:center;gap:16px}.format-note{font-size:11px;color:var(--muted)}.ocr-tool__form>.status{padding-bottom:20px}.has-result .ocr-tool__drop{min-height:76px;flex-direction:row;gap:18px;padding:12px 20px}.has-result .upload-art{width:30px;height:42px;margin:0}.has-result .upload-art:before,.has-result .upload-art:after,.has-result .ocr-tool__hint{display:none}.has-result .upload-art>svg{border:0;padding:0;width:24px;height:24px;background:transparent}.has-result .ocr-tool__drop-title{font-size:13px}.has-result .ocr-tool__file{margin:0 0 0 auto}.is-scanning .ocr-tool__drop:after{content:'';position:absolute;left:0;top:0;width:100%;height:2px;background:var(--brand);box-shadow:0 0 28px 6px #f36b3b22;animation:ocr-scan 2s ease-in-out infinite alternate}.ocr-tool__preview{overflow:auto;padding:38px 28px;border-top:1px solid var(--line);background:var(--surface-2);text-align:center;max-height:620px}.ocr-tool__image-wrap{position:relative;display:inline-block;max-width:100%;line-height:0}.ocr-tool__image{display:block;width:auto;height:auto;max-width:100%;border-radius:3px}.ocr-tool__overlay{position:absolute;inset:0}.ocr-tool__box{position:absolute;min-width:3px;min-height:3px;padding:0;border:1px solid color-mix(in srgb,var(--brand) 60%,transparent);border-radius:2px;background:#f36b3b08;cursor:help;transition:background .15s,border-color .15s}.ocr-tool__box:hover,.ocr-tool__box:focus-visible{z-index:2;background:#f36b3b25;border-color:var(--brand)}.ocr-tool__tip{position:fixed;z-index:40;display:none;max-width:min(260px,80vw);width:max-content;padding:8px 11px;border-radius:6px;background:#292b28;color:#fff;font-size:12px;line-height:1.4;text-align:left;white-space:normal;pointer-events:none;box-shadow:0 4px 14px #0002}.ocr-tool__box:hover .ocr-tool__tip,.ocr-tool__box:focus-visible .ocr-tool__tip{display:block;animation:enter .15s ease}.ocr-result-header{display:flex;justify-content:space-between;align-items:center;padding:18px 28px 0;border-top:1px solid var(--line)}.ocr-tool__text{min-height:110px;max-height:420px;overflow:auto;margin:0;padding:20px 28px 32px;color:var(--text);font:inherit;font-size:17px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.has-file .upload-art>svg{color:var(--brand)}@keyframes ocr-scan{to{top:100%}}@media(max-width:600px){.ocr-tool__form{padding:18px 16px 0}.ocr-tool__drop{min-height:270px}.ocr-tool .language-tabs button{font-size:11px;padding:10px 3px}.has-result .ocr-tool__drop{flex-wrap:wrap;gap:10px}.has-result .ocr-tool__file{width:100%;margin:0}.ocr-tool__preview{padding:24px 16px}.ocr-result-header{padding:12px 16px 0}.ocr-tool__text{padding:16px 20px 24px}}

.editor-footer>[data-copy]{margin-left:auto}.ocr-tool__form:has(#ocr-file:focus-visible) .ocr-tool__drop{outline:2px solid var(--brand);outline-offset:3px}