:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif;color:#24232b;background:#f7f7f9;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #7467f3;outline-offset:3px}a{color:inherit;text-decoration:none}a:hover{color:#7467f3}.shell{max-width:1500px;min-height:100vh;margin:auto;padding:0 clamp(20px,4vw,64px);display:flex;flex-direction:column}.header{height:100px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e8e7ed}.brand{display:flex;align-items:center;gap:14px}.brand-mark{position:relative;width:44px;height:44px;border-radius:14px;background:#7467f3;display:grid;place-items:center;color:white;font-size:23px;font-weight:800;box-shadow:0 8px 18px #7467f333}.brand-mark span{position:absolute;right:5px;top:2px;color:#ffdc88;font-size:13px}.brand strong{display:block;font-size:17px;letter-spacing:-.03em}.brand em{font-style:normal;font-weight:550;color:#777481}.brand small{display:block;color:#9b98a4;font-size:10px;letter-spacing:.12em;margin-top:2px}.header-actions{display:flex;gap:10px}.icon-label,.language-button,.swap-button,.filter-button,.secondary-button{border:1px solid #e5e3eb;background:#fff;color:#45424f;border-radius:12px}.icon-label{height:42px;padding:0 15px;display:flex;align-items:center;gap:9px;font-size:13px;font-weight:650}.icon-label>span:first-child{font-size:20px;color:#7770cf}.icon-label:hover,.language-button:hover,.swap-button:hover,.filter-button:hover{border-color:#bdb5ff;background:#f7f5ff}.intro{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:60px 0 34px}.eyebrow{margin:0;color:#7568f5;font-size:10px;font-weight:800;letter-spacing:.17em}.intro h1{margin:9px 0 11px;font-size:clamp(36px,4.8vw,64px);letter-spacing:-.065em;line-height:1.1}.intro>div>p:last-child{margin:0;color:#777481;font-size:14px;line-height:1.8}.model-badge{white-space:nowrap;padding:9px 13px;border-radius:999px;background:#efedff;color:#675bd1;font-size:11px;font-weight:700}.workspace{background:#fff;border:1px solid #e7e5ed;border-radius:24px;box-shadow:0 18px 50px #29233e0a;overflow:hidden}.language-bar{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);gap:12px;align-items:center;padding:18px 24px;border-bottom:1px solid #eceaf0}.language-button{height:48px;max-width:100%;padding:0 17px;text-align:left;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:space-between}.language-button span{color:#aaa7b4}.swap-button{height:42px;width:42px;justify-self:center;font-size:25px;line-height:1}.panels{display:grid;grid-template-columns:1fr 1fr;min-height:400px}.panel{min-width:0;display:flex;flex-direction:column;padding:24px 26px 19px}.input-panel{border-right:1px solid #eceaf0}.output-panel{background:#fcfbff}.panel-label{font-size:11px;font-weight:800;letter-spacing:.08em;color:#908b9b;display:flex;justify-content:space-between}.panel-label span{color:#7568f5;letter-spacing:0}.panel textarea{display:block;width:100%;min-height:285px;flex:1;resize:vertical;border:0;outline:none;margin:23px 0;background:transparent;color:#292631;font-size:21px;line-height:1.65}.panel textarea::placeholder{color:#bcb8c5}.output-text{white-space:pre-wrap;overflow-wrap:anywhere;flex:1;margin:23px 0;font-size:21px;line-height:1.65}.output-text.empty{color:#c0bdc8}.panel-foot{min-height:26px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#9a96a4;font-size:11px}.panel-foot>div{display:flex;align-items:center;gap:18px}.text-button{border:0;background:transparent;padding:4px;color:#786be7;font-size:12px;font-weight:700}.text-button:hover{text-decoration:underline}.workspace-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;border-top:1px solid #eceaf0}.workspace-foot p{margin:0;color:#aaa6b1;font-size:11px}kbd{padding:1px 4px;border:1px solid #ddd9e4;border-radius:4px;background:#f8f7fa}.primary-button{border:0;border-radius:12px;background:#7467f3;color:#fff;padding:13px 22px;font-size:13px;font-weight:750;box-shadow:0 8px 20px #7467f32e}.primary-button:hover{background:#6256df}.primary-button span{margin-left:10px}.privacy-note{margin:20px 2px 0;color:#85818e;font-size:11px;line-height:1.7}footer{margin-top:auto;padding:65px 0 26px;display:flex;justify-content:space-between;color:#a5a1af;font-size:11px}dialog{max-height:min(88vh,800px);border:1px solid #e6e3ed;border-radius:22px;background:#fff;color:#292631;box-shadow:0 24px 80px #1c183748}dialog::backdrop{background:#1e1b2e80}.settings-dialog{width:min(calc(100% - 24px),490px);padding:27px}.dialog-head{display:flex;align-items:start;justify-content:space-between;gap:15px}.dialog-head h2,.drawer-head h2{margin:5px 0 0;font-size:25px;letter-spacing:-.04em}.close-button{width:32px;height:32px;border:0;background:transparent;color:#9691a1;font-size:25px;line-height:1}.close-button:hover{color:#24232b}.dialog-copy{color:#85808e;font-size:12px;line-height:1.7;margin:12px 0 24px}.settings-dialog label{display:block;margin:16px 0 0;font-size:12px;font-weight:700}.settings-dialog label>input,.settings-dialog select,.key-field,.language-dialog>input,.drawer-tools input{width:100%;height:44px;border:1px solid #dfdce5;border-radius:10px;background:#fff;margin-top:8px;padding:0 12px;color:#292631}.settings-dialog select{cursor:pointer}.settings-dialog .key-field{display:flex;align-items:center;padding-right:5px}.key-field input{min-width:0;flex:1;border:0;outline:0;background:transparent}.key-field button{border:0;background:transparent;color:#7467f3;font-size:11px}.settings-dialog .remember-label{display:flex;align-items:center;gap:9px;font-weight:500}.remember-label input{accent-color:#7467f3}.info-box{background:#f6f5fa;border-radius:10px;padding:12px;margin-top:18px;color:#777280;font-size:11px;line-height:1.65}.dialog-actions{display:flex;justify-content:space-between;gap:10px;margin-top:23px}.secondary-button{padding:10px 16px;font-size:12px}.language-dialog{width:min(calc(100% - 24px),580px);padding:24px}.language-dialog>input{margin:20px 0 12px}.language-list{max-height:50vh;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:5px}.language-list button{border:0;background:transparent;border-radius:8px;text-align:left;padding:10px;color:#3e3b47;font-size:13px}.language-list button:hover,.language-list button.selected{background:#efedff;color:#675bd1}.drawer-backdrop{position:fixed;inset:0;background:#1e1b2e80;z-index:20}.history-drawer{position:fixed;right:0;top:0;bottom:0;width:min(100%,440px);z-index:21;background:#fff;box-shadow:-15px 0 45px #1c183720;display:flex;flex-direction:column;transform:translateX(105%);transition:transform .2s ease;visibility:hidden}.history-drawer.open{transform:translateX(0);visibility:visible}.drawer-head{display:flex;justify-content:space-between;align-items:start;padding:26px 25px 19px;border-bottom:1px solid #eeeaf2}.drawer-head h2 span{font-size:13px;color:#aaa5b1}.drawer-tools{display:flex;gap:8px;padding:14px 20px;border-bottom:1px solid #eeeaf2}.drawer-tools input{margin:0;min-width:0;flex:1}.filter-button{white-space:nowrap;padding:0 13px;font-size:12px}.filter-button.active{color:#6557d5;background:#efedff}.history-list{overflow:auto;flex:1}.history-item{border-bottom:1px solid #eeeaf2;padding:16px 20px;cursor:pointer}.history-item:hover{background:#faf9ff}.history-item-top{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#9c96a4;font-size:11px}.history-item-top>div{display:flex;gap:4px}.history-item-top button{border:0;background:transparent;color:#aaa4b0;font-size:17px}.history-item-top button:hover,.history-item-top button.active{color:#e0a219}.history-item-top button.delete:hover{color:#e25c5c}.history-item p{margin:9px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.history-item p.translation-preview{margin-top:4px;color:#888391}.history-item time{display:block;margin-top:9px;color:#b2adb9;font-size:10px}.empty-history{text-align:center;margin:auto;padding:40px 25px;color:#a5a0ae;font-size:13px}.drawer-bottom{border-top:1px solid #eeeaf2;padding:13px 20px;display:flex;justify-content:space-between;align-items:center;color:#aaa5b0;font-size:10px}.danger{color:#e05b65}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:40;border-radius:12px;background:#2c2836;color:#fff;box-shadow:0 10px 30px #1c183740;padding:10px 16px;font-size:12px}@media(max-width:700px){.shell{padding:0 15px}.header{height:76px}.brand small,.header-actions .icon-label span:last-child{display:none}.icon-label{width:42px;padding:0;justify-content:center}.intro{padding:39px 5px 24px;display:block}.intro h1{font-size:39px}.model-badge{display:inline-block;margin-top:15px}.workspace{border-radius:18px}.language-bar{padding:12px;gap:4px;grid-template-columns:minmax(0,1fr) 37px minmax(0,1fr)}.language-button{height:43px;padding:0 9px;font-size:12px}.swap-button{width:34px;height:34px;font-size:21px}.panels{grid-template-columns:1fr}.panel{padding:18px;min-height:245px}.input-panel{border-right:0;border-bottom:1px solid #eceaf0}.panel textarea{min-height:125px;margin:14px 0;font-size:18px}.output-text{min-height:125px;margin:14px 0;font-size:18px}.workspace-foot{padding:14px;align-items:stretch;flex-direction:column}.workspace-foot .primary-button{width:100%}.privacy-note{padding:0 3px}footer{padding-top:55px;gap:8px}.language-list{grid-template-columns:1fr}}

[hidden]{display:none!important}
/* Compact translator layout */
.header{min-height:84px;height:auto;padding:14px 0;gap:20px}.brand{min-width:0}.brand>div{min-width:0}.brand small{max-width:520px;color:#85818f;font-size:11px;letter-spacing:0;line-height:1.4}.header-actions{align-items:center;flex-shrink:0}.header-actions .model-badge{max-width:210px;overflow:hidden;text-overflow:ellipsis}.workspace{margin-top:20px}.panels{min-height:380px}.panel textarea{min-height:255px}.input-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:30px}.panel-icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:0;border-radius:8px;background:transparent;color:#777280;font-size:22px;line-height:1}.panel-icon:hover:not(:disabled){background:#f0eefc;color:#6559d8}.copy-icon{font-size:24px}.panel-foot>div{gap:8px}.settings-dialog #model-field select{margin-top:8px}
@media(max-width:900px){.header-actions .model-badge{display:none}.brand small{max-width:430px}}
@media(max-width:700px){.header{min-height:76px;padding:10px 0}.brand small{display:block;max-width:250px;font-size:10px;line-height:1.3}.workspace{margin-top:14px}.panel{min-height:195px}.panel textarea,.output-text{min-height:100px}.header-actions{gap:5px}}
@media(max-width:450px){.brand small{max-width:170px;font-size:9px}.brand strong{font-size:14px}.brand-mark{width:38px;height:38px}.icon-label{width:36px;height:36px}}
/* Model library */
.model-field{display:flex;align-items:center;justify-content:space-between;margin-top:16px}.model-field label{margin:0!important;font-size:12px;font-weight:700}.settings-dialog #model{width:100%;height:44px;border:1px solid #dfdce5;border-radius:10px;background:#fff;margin-top:8px;padding:0 12px;color:#292631}.model-summary{margin:6px 0 0;color:#9a96a4;font-size:11px}.models-dialog{width:min(calc(100% - 24px),620px);padding:26px}.models-toolbar{display:flex;gap:9px}.models-toolbar input,.manual-model-row input{min-width:0;flex:1;height:42px;border:1px solid #dfdce5;border-radius:10px;padding:0 12px}.models-toolbar button,.manual-model-row button{white-space:nowrap}.model-fetch-status{min-height:18px;margin:9px 0 12px;color:#898493;font-size:11px}.catalog-list{height:min(44vh,360px);overflow:auto;border:1px solid #ebe8f0;border-radius:12px}.catalog-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid #f0edf3}.catalog-item:last-child{border-bottom:0}.catalog-item>div{min-width:0}.catalog-item strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700}.catalog-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9b96a3;font-size:10px}.catalog-item button{flex:0 0 auto;border:1px solid #dcd7ed;border-radius:8px;background:#fff;color:#695bda;padding:7px 10px;font-size:11px;font-weight:700}.catalog-item button.added{background:#f0edff;border-color:#e3dfff}.catalog-empty{padding:38px 16px;text-align:center;color:#aaa4b0;font-size:12px}.manual-model-row{display:flex;gap:9px;margin-top:14px}.models-dialog-foot{display:flex;align-items:center;justify-content:space-between;margin-top:18px;color:#938d9c;font-size:11px}
@media(max-width:560px){.models-dialog{padding:18px}.models-toolbar{flex-wrap:wrap}.models-toolbar input{flex-basis:100%}.catalog-list{height:38vh}}

/* Keep the model picker and local-key control aligned with other settings fields. */
.settings-dialog #model,
.settings-dialog #model option {
  font-size: 12px;
  font-weight: 600;
}
.settings-dialog .remember-label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin-top: 18px;
  padding: 10px 12px;
  border: 1px solid #eeebf3;
  border-radius: 10px;
  line-height: 1.45;
  cursor: pointer;
}
.settings-dialog .remember-label > input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin: 0;
  padding: 0;
}
.settings-dialog label[hidden] { display: none; }

/* Copy feedback stays beside each text panel instead of appearing at page bottom. */
.copy-icon {
  position: relative;
  flex: 0 0 auto;
  overflow: visible;
}
.copy-icon::before,
.copy-icon::after {
  position: absolute;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .15s ease, visibility .15s ease;
}
.copy-icon::before {
  content: '';
  right: 8px;
  bottom: calc(100% + 4px);
  border: 6px solid transparent;
  border-bottom: 0;
  border-top-color: #292631;
}
.copy-icon::after {
  content: attr(data-tooltip);
  right: -10px;
  bottom: calc(100% + 10px);
  padding: 9px 11px;
  border-radius: 7px;
  background: #292631;
  color: #fff;
  box-shadow: 0 6px 18px #1c183735;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
}
.copy-icon:not(:disabled):is(:hover, :focus-visible, .show-feedback)::before,
.copy-icon:not(:disabled):is(:hover, :focus-visible, .show-feedback)::after {
  opacity: 1;
  visibility: visible;
}
