.tn-url-page {
  --url-paper:#faf6ee; --url-surface:#fffcf4; --url-wash:#f5efdf; --url-ink:#1a1208;
  --url-muted:#5a4a30; --url-line:#b8a888; --url-soft:#ddd4be; --url-button:#ede6d4;
  --url-hover:#dfd4bb; --url-accent:#c44a00; --url-primary:#56311a;
  --url-primary-hover:#714020; --url-primary-text:#fff6e7;
  width:calc(100% - 10px); max-width:1180px; margin-inline:auto;
  color:var(--url-ink); -webkit-text-fill-color:var(--url-ink);
}
.tn-url-page *, .tn-url-page *::before, .tn-url-page *::after { box-sizing:border-box; }
.tn-url-page .tn-url-ad { width:min(900px,100%); min-height:90px; margin-inline:auto; background:transparent; }
.tn-url-page .tn-url-ad--top { margin-top:54px; margin-bottom:18px; }
.tn-url-page .tn-url-ad--bottom { margin-top:16px; margin-bottom:26px; }
.tn-url-page .tn-url-ad ins { max-width:100%; }
.tn-url-page .tn-url-tool {
  padding:18px; border:1px solid var(--url-line); border-top:3px double var(--url-line);
  background:var(--url-paper); color:var(--url-ink); -webkit-text-fill-color:var(--url-ink);
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.tn-url-page .tn-url-tool :is(p,h2,h3) { margin:0; }
.tn-url-page .tn-url-tool [hidden] { display:none!important; }
.tn-url-page .tn-url-tool :is(code,pre,kbd,samp) { padding:0; border:0; border-radius:0; background:none; background-color:transparent; color:inherit; -webkit-text-fill-color:inherit; }
.tn-url-page .tn-url-tool code { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; overflow-wrap:anywhere; }
.tn-url-page .tn-url-tool button {
  display:inline-flex; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:40px;
  padding:10px 13px; border:1px solid var(--url-line); border-radius:0; box-shadow:none;
  background:var(--url-button); color:var(--url-ink); -webkit-text-fill-color:var(--url-ink);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; font-weight:700;
  line-height:1; letter-spacing:0; text-align:center; text-transform:none; cursor:pointer;
  transition:background-color .15s ease,border-color .15s ease;
}
.tn-url-page .tn-url-tool button:not(:disabled):hover { background:var(--url-hover); border-color:var(--url-muted); }
.tn-url-page .tn-url-tool button:not(:disabled):active { transform:scale(.96); }
.tn-url-page .tn-url-tool button:disabled { opacity:.5; cursor:not-allowed; }
.tn-url-page .tn-url-tool :is(button,textarea,input):focus { outline:none; }
.tn-url-page .tn-url-tool :is(button,textarea,input):focus-visible { outline:2px solid var(--url-accent); outline-offset:2px; }
.tn-url-page .tn-url-switches { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 24px; padding-bottom:15px; border-bottom:1px solid var(--url-line); }
.tn-url-page .tn-url-switch-group { display:flex; align-items:center; gap:12px; min-width:0; }
.tn-url-page .tn-url-switch-label { flex:none; color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:11px; font-weight:700; line-height:1.4; }
.tn-url-page :is(.tn-url-scope,.tn-url-direction) { display:flex; align-items:stretch; min-width:0; }
.tn-url-page .tn-url-scope { gap:0; }
.tn-url-page .tn-url-scope button { min-width:125px; background:transparent; border-color:var(--url-soft); }
.tn-url-page .tn-url-scope button + button { margin-left:-1px; }
.tn-url-page .tn-url-direction { gap:4px; }
.tn-url-page .tn-url-direction button { border-color:transparent; background:transparent; }
.tn-url-page :is(.tn-url-scope,.tn-url-direction) button:is([aria-pressed="true"],.is-active),
.tn-url-page .tn-url-tool :is(.tn-url-primary,#tn-url-copy) {
  background:var(--url-primary); border-color:var(--url-primary); color:var(--url-primary-text); -webkit-text-fill-color:var(--url-primary-text);
}
.tn-url-page :is(.tn-url-scope,.tn-url-direction) button:is([aria-pressed="true"],.is-active):hover,
.tn-url-page .tn-url-tool :is(.tn-url-primary,#tn-url-copy):not(:disabled):hover { background:var(--url-primary-hover); border-color:var(--url-primary-hover); }
.tn-url-page .tn-url-context { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:7px 22px; padding:13px 0; }
.tn-url-page #tn-url-scope-help { flex:1 1 390px; color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:13px; line-height:1.65; word-break:keep-all; overflow-wrap:anywhere; }
.tn-url-page #tn-url-rule { color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:11px; line-height:1.6; overflow-wrap:anywhere; }
.tn-url-page .tn-url-plus-option { display:flex; align-items:center; flex-wrap:wrap; gap:7px 12px; min-height:40px; margin:0 0 12px; color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:12px; line-height:1.6; }
.tn-url-page .tn-url-plus-option label { display:inline-flex; align-items:center; gap:8px; min-height:40px; cursor:pointer; }
.tn-url-page .tn-url-plus-option label > span { display:flex; align-items:baseline; flex-wrap:wrap; gap:3px 10px; }
.tn-url-page .tn-url-plus-option small { font-size:11px; }
.tn-url-page .tn-url-plus-option input { flex:none; width:17px; height:17px; margin:0; accent-color:var(--url-accent); }
.tn-url-page .tn-url-workbench { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:stretch; }
.tn-url-page :is(.tn-url-pane--source,.tn-url-pane--result) { display:flex; flex-direction:column; min-width:0; border:1px solid var(--url-line); background:var(--url-surface); }
.tn-url-page .tn-url-pane--result { background:var(--url-wash); }
.tn-url-page .tn-url-pane-head { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:50px; padding:12px 14px; border-bottom:1px solid var(--url-soft); }
.tn-url-page .tn-url-pane-head :is(label,h2) { display:flex; align-items:center; gap:8px; margin:0; color:var(--url-ink); -webkit-text-fill-color:var(--url-ink); font-size:15px; font-weight:800; line-height:1.35; }
.tn-url-page .tn-url-pane-head small { color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:11px; line-height:1.4; }
.tn-url-page .tn-url-index { color:var(--url-accent); -webkit-text-fill-color:var(--url-accent); font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; }
.tn-url-page .tn-url-tool textarea {
  display:block; flex:1 1 auto; width:100%; max-width:100%; min-width:0; min-height:240px; margin:0;
  padding:16px; border:0; border-radius:0; box-shadow:none; background:transparent;
  color:var(--url-ink); -webkit-text-fill-color:var(--url-ink); resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:15px; line-height:1.75;
  letter-spacing:0; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word;
}
.tn-url-page .tn-url-tool textarea::placeholder { color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); opacity:.72; }
.tn-url-page .tn-url-article .tn-info-card :is(p,li) { overflow-wrap:anywhere; }
.tn-url-page .tn-url-tool textarea[aria-invalid="true"] { box-shadow:inset 0 0 0 1px var(--url-accent); }
.tn-url-page .tn-url-pane-foot { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; min-height:62px; padding:10px 12px; border-top:1px solid var(--url-soft); }
.tn-url-page .tn-url-pane-foot > :is(span,small) { color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:11px; line-height:1.5; font-variant-numeric:tabular-nums; }
.tn-url-page .tn-url-actions { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.tn-url-page .tn-url-stats { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 22px; margin-top:14px; padding-top:12px; border-top:1px solid var(--url-soft); color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:12px; line-height:1.6; }
.tn-url-page .tn-url-stats :is(b,strong) { color:var(--url-ink); -webkit-text-fill-color:var(--url-ink); font-variant-numeric:tabular-nums; font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif; }
.tn-url-page .tn-url-status { min-height:20px; margin-top:10px!important; color:var(--url-muted); -webkit-text-fill-color:var(--url-muted); font-size:12px; line-height:1.65; overflow-wrap:anywhere; }
.tn-url-page .tn-url-status:is([data-state="error"],.is-error) { color:var(--url-accent); -webkit-text-fill-color:var(--url-accent); font-weight:700; }
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-l="dark"],[data-scheme="auto"][data-d="dark"]) .tn-url-page,
html[data-scheme="dark"] body:not([data-scheme="light"]) .tn-url-page {
  --url-paper:#241d12; --url-surface:#322a1a; --url-wash:#2c2517; --url-ink:#f7ead1;
  --url-muted:#c3b492; --url-line:#826744; --url-soft:#574a37; --url-button:#2f2115;
  --url-hover:#3a2a1b; --url-accent:#e8823f; --url-primary:#6a3b1f;
  --url-primary-hover:#824826; --url-primary-text:#f7ead1; color-scheme:dark;
}
@media (prefers-color-scheme:dark) {
  body[data-scheme="auto"] .tn-url-page {
    --url-paper:#241d12; --url-surface:#322a1a; --url-wash:#2c2517; --url-ink:#f7ead1;
    --url-muted:#c3b492; --url-line:#826744; --url-soft:#574a37; --url-button:#2f2115;
    --url-hover:#3a2a1b; --url-accent:#e8823f; --url-primary:#6a3b1f;
    --url-primary-hover:#824826; --url-primary-text:#f7ead1; color-scheme:dark;
  }
}
@media (max-width:720px) {
  .tn-url-page .tn-url-ad--top { margin-top:48px; }
  .tn-url-page .tn-url-tool { padding:10px; }
  .tn-url-page .tn-url-switches { gap:10px; padding-bottom:12px; }
  .tn-url-page .tn-url-switch-group { flex:1 1 100%; gap:10px; }
  .tn-url-page .tn-url-switch-label { width:58px; }
  .tn-url-page .tn-url-scope { flex:1 1 auto; }
  .tn-url-page .tn-url-scope button { flex:1 1 0; min-width:0; }
  .tn-url-page .tn-url-direction { flex:1 1 auto; }
  .tn-url-page .tn-url-direction button { flex:1 1 0; }
  .tn-url-page .tn-url-context { gap:4px; padding:11px 0; }
  .tn-url-page #tn-url-scope-help { font-size:12px; }
  .tn-url-page .tn-url-workbench { grid-template-columns:minmax(0,1fr); gap:13px; }
  .tn-url-page .tn-url-tool textarea { flex:none; min-height:176px; padding:13px; font-size:16px; }
  .tn-url-page .tn-url-pane-head { padding:10px 12px; min-height:46px; }
  .tn-url-page .tn-url-pane-foot { padding:9px 10px; }
  .tn-url-page .tn-url-stats { gap:6px 15px; }
}
@media (max-width:390px) {
  .tn-url-page .tn-url-tool button { padding-inline:10px; }
  .tn-url-page .tn-url-pane-foot { gap:7px; }
  .tn-url-page .tn-url-actions { gap:5px; }
  .tn-url-page .tn-url-pane-head { padding-inline:10px; }
}
@media (prefers-reduced-motion:reduce) {
  .tn-url-page .tn-url-tool button { transition:none; }
  .tn-url-page .tn-url-tool button:not(:disabled):active { transform:none; }
}