/* ══════════════════════════════════════════════════
   ROMAN → NEPALI UNICODE
   Self-contained so it also works inside the iframe embed.
══════════════════════════════════════════════════ */
.ru{
  --ru-orange:#f47a20;--ru-orange-lt:#fef0e6;--ru-blue:#1e7fd4;--ru-dk:#1b2f50;--ru-ink:#1a2233;
  --ru-ink2:#4a5568;--ru-ink3:#8896a8;--ru-line:#dde3ef;--ru-soft:#f5f6fa;
  position:relative;font-family:"Plus Jakarta Sans","Mukta",system-ui,sans-serif;color:var(--ru-ink);
  background:#fff;border:1.5px solid var(--ru-line);border-radius:18px;
  padding:14px;display:flex;flex-direction:column;gap:12px;box-sizing:border-box;text-align:left;
}
.ru *{box-sizing:border-box}
.ru-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ru-title{font-family:"Mukta",sans-serif;font-size:1.15rem;font-weight:700;color:var(--ru-dk);line-height:1.2}
.ru-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-left:auto}
.ru-smart{
  display:inline-flex;align-items:center;gap:8px;margin:0;cursor:pointer;user-select:none;
  font-size:.8rem;font-weight:700;color:var(--ru-ink2);
}
.ru-smart-cb{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ru-switch{position:relative;width:34px;height:20px;border-radius:20px;background:var(--ru-line);transition:background .2s;flex-shrink:0}
.ru-switch::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.ru-smart-cb:checked + .ru-switch{background:var(--ru-orange)}
.ru-smart-cb:checked + .ru-switch::after{transform:translateX(14px)}
.ru-smart-cb:focus-visible + .ru-switch{outline:2px solid var(--ru-blue);outline-offset:2px}
.ru-help-btn{
  margin:0;padding:.5rem 1rem;border-radius:100px;border:1.5px solid var(--ru-line);background:var(--ru-soft);
  font-family:inherit;font-size:.8rem;font-weight:700;line-height:1;color:var(--ru-ink2);cursor:pointer;
}
.ru-help-btn:hover,.ru-help-btn[aria-expanded="true"]{border-color:var(--ru-orange);color:var(--ru-orange);background:var(--ru-orange-lt)}
.ru-boxes{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:12px;min-height:0}
.ru-box{display:flex;flex-direction:column;min-height:0}
.ru-lbl{display:block;font-family:"Mukta",sans-serif;font-size:.85rem;font-weight:600;color:var(--ru-ink3);margin:0 0 5px;line-height:1.3}
.ru textarea{
  flex:1;width:100%;min-height:90px;margin:0;resize:none;
  border:1.5px solid var(--ru-line);border-radius:12px;padding:12px 14px;
  font-family:"Mukta",sans-serif;font-size:1.1rem;line-height:1.65;color:var(--ru-ink);background:#fff;
  transition:border-color .2s,box-shadow .2s;
}
.ru textarea.ru-in{font-family:"Plus Jakarta Sans","Mukta",sans-serif;font-size:1.02rem}
.ru textarea.ru-out{background:var(--ru-soft)}
.ru textarea:focus{outline:none;border-color:var(--ru-blue);box-shadow:0 0 0 3px rgba(30,127,212,.15)}
.ru button:focus-visible,.ru a:focus-visible{outline:2px solid var(--ru-blue);outline-offset:2px}
.ru-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ru-credit{font-size:.75rem;font-weight:600;color:var(--ru-ink3);text-decoration:none}
.ru-credit:hover{color:var(--ru-orange)}
.ru-actions{display:flex;gap:8px;margin-left:auto}
.ru-actions button{
  font-family:inherit;font-size:.8rem;font-weight:700;line-height:1;padding:.7rem 1.25rem;margin:0;
  border-radius:100px;cursor:pointer;border:1.5px solid var(--ru-line);background:#fff;color:var(--ru-ink2);
}
.ru-actions button:hover{border-color:var(--ru-blue);color:var(--ru-blue)}
.ru-actions .ru-copy,.ru-actions .ru-copy:hover{background:var(--ru-blue);border-color:var(--ru-blue);color:#fff}

/* ── Typing guide (opens over the boxes) ── */
.ru-help{
  position:absolute;inset:58px 14px 14px;z-index:5;overflow-y:auto;
  background:#fff;border:1.5px solid var(--ru-line);border-radius:14px;
  box-shadow:0 12px 40px rgba(27,47,80,.16);padding:14px 16px 16px;
}
.ru-help[hidden]{display:none}
.ru-help-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.ru-help-head strong{font-size:.9rem;color:var(--ru-dk)}
.ru-help-close{
  margin:0;border:0;background:var(--ru-soft);width:30px;height:30px;border-radius:50%;cursor:pointer;
  font-size:1.1rem;line-height:1;color:var(--ru-ink2);
}
.ru-help h4{margin:12px 0 6px;font-size:.72rem;font-weight:700;color:var(--ru-ink3)}
.ru-keys{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:5px;margin:0;padding:0;list-style:none}
.ru-keys li{
  display:flex;align-items:baseline;justify-content:space-between;gap:6px;
  background:var(--ru-soft);border-radius:8px;padding:5px 8px;
}
.ru-keys code{white-space:nowrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.78rem;color:var(--ru-orange);font-weight:700}
.ru-keys span{font-family:"Mukta",sans-serif;font-size:1.05rem;color:var(--ru-ink)}
.ru-tips{margin:10px 0 0;padding:0;list-style:none;font-size:.8rem;color:var(--ru-ink2);line-height:1.6}
.ru-tips li{margin-bottom:4px}
.ru-tips code{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--ru-orange);font-weight:700}

.ru--embed{height:100%}
.nt-tool .ru--page textarea{min-height:300px}
.ru--page{box-shadow:0 8px 32px rgba(45,74,122,.11)}

@media(max-width:900px){.nt-tool .ru--page textarea{min-height:200px}}
@media(max-width:560px){
  .ru{padding:10px;gap:8px;border-radius:14px}
  .ru-boxes{grid-template-columns:1fr;gap:8px}
  .ru textarea{font-size:1rem;padding:9px 11px}
  .nt-tool .ru--page textarea{min-height:160px}
  .ru-help{inset:52px 10px 10px}
}
@media(prefers-reduced-motion:reduce){.ru textarea,.ru-switch,.ru-switch::after{transition:none}}
