/* /converter: text converter page. Colours come from the site tokens, so light and dark themes follow site.css. */
.cv{max-width:1100px;margin:0 auto;padding:24px 24px 56px;display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.cv>*,.cv-tool>*{min-width:0}
.cv a{color:var(--coral);text-underline-offset:3px}
.cv a:hover{color:var(--coral-hover)}
.cv :is(a,button,select,textarea):focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.cv-hero{padding:32px 34px;border-radius:22px;background:var(--tag-bg);border:1px solid var(--border-warm)}
.cv-hero h1{font-size:clamp(1.6rem,3.2vw,2.3rem);line-height:1.25;margin:0 0 10px}
.cv-hero p{max-width:780px;color:var(--espresso-light);line-height:1.7}
.cv-tool{background:var(--card-bg);border:1px solid var(--border-warm);border-radius:20px;padding:24px;display:grid;gap:20px}
.cv-controls{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:flex-end}
.cv-field{display:grid;gap:7px;font-size:13px;color:var(--espresso-light);min-width:0}
.cv-field>span{font-weight:600}
.cv-field select{font:inherit;font-size:14px;color:var(--espresso);background:var(--surface-input,#fff);border:1px solid var(--border-warm);border-radius:10px;padding:10px 12px;max-width:100%}
.cv-controls .cv-field:first-child{flex:1 1 340px}
.cv-controls .cv-field:first-child select{width:100%}
.cv-seg{display:inline-flex;border:1px solid var(--border-warm);border-radius:10px;overflow:hidden;background:var(--surface-input,#fff)}
.cv-seg button{font:inherit;font-size:14px;border:0;background:none;color:var(--espresso);padding:10px 14px;cursor:pointer;white-space:nowrap}
.cv-seg button+button{border-left:1px solid var(--border-warm)}
.cv-seg button[aria-pressed=true]{background:var(--coral);color:#fff}
.cv-panes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.cv-pane{display:grid;gap:8px;min-width:0}
.cv-pane-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:13px;font-weight:600}
.cv-count{font-weight:400;font-size:12px;color:var(--espresso-light)}
.cv textarea{width:100%;min-height:220px;resize:vertical;background:var(--surface-input,#fff);color:var(--espresso);border:1px solid var(--border-warm);border-radius:12px;padding:14px 16px;font:16px/1.7 'Noto Sans Georgian',RefInterface,sans-serif}
.cv textarea[readonly]{background:var(--bg-warm)}
.cv-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cv-btn{font:inherit;font-size:13px;border:1px solid var(--border-warm);background:var(--card-bg);color:var(--espresso);border-radius:9px;padding:8px 13px;cursor:pointer}
.cv-btn:hover{border-color:var(--coral);color:var(--coral)}
.cv-btn-main{background:var(--coral);border-color:var(--coral);color:#fff;font-weight:600}
.cv-btn-main:hover{background:var(--coral-hover);border-color:var(--coral-hover);color:#fff}
.cv-status{font-size:13px;color:var(--coral)}
.cv-preview{display:grid;gap:10px;border-top:1px solid var(--border-warm);padding-top:18px}
.cv-field-inline{grid-template-columns:auto minmax(0,320px);align-items:center;gap:12px}
.cv-preview-box{padding:18px 20px;border-radius:12px;background:var(--bg-warm);border:1px solid var(--border-warm);font-size:28px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-wrap;max-height:360px;overflow:auto}
.cv-preview-note,.cv-noscript{font-size:13px;color:var(--espresso-light)}
.cv-text{background:var(--card-bg);border:1px solid var(--border-warm);border-radius:20px;padding:28px 30px;line-height:1.75}
.cv-text h2{font-size:1.2rem;margin:26px 0 8px}
.cv-text h2:first-child{margin-top:0}
.cv-text p,.cv-text li{color:var(--espresso-light)}
.cv-text ul,.cv-text ol{padding-left:22px;display:grid;gap:6px}
.cv-text p+p{margin-top:10px}
.cv-tip{margin-top:12px;padding:12px 16px;border-radius:12px;background:var(--tag-bg)}
.cv-table-wrap{overflow-x:auto;margin:6px 0 14px}
.cv-table{width:100%;border-collapse:collapse;font-size:14px}
.cv-table th,.cv-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--border-warm);vertical-align:top}
.cv-table thead th{font-size:12px;color:var(--espresso-light)}
.cv-table code{font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
.cv-more{margin-top:14px}
@media(max-width:760px){
  .cv{padding:16px 16px 40px}
  .cv-hero{padding:22px 20px}
  .cv-tool,.cv-text{padding:18px 16px}
  .cv-panes{grid-template-columns:minmax(0,1fr)}
  .cv-controls .cv-field{flex:1 1 100%;width:100%}
  .cv-field select{width:100%}
  .cv-seg{display:flex;width:100%}
  .cv-seg button{flex:1;white-space:normal}
  .cv-field-inline{grid-template-columns:minmax(0,1fr)}
  .cv textarea{min-height:160px}
  .cv-preview-box{font-size:22px}
}