.tn-unicode-page {
  --uc-paper:#faf6ee; --uc-surface:#fffcf4; --uc-wash:#f5efdf; --uc-ink:#1a1208;
  --uc-muted:#5a4a30; --uc-line:#b8a888; --uc-soft:#ddd4be; --uc-button:#ede6d4;
  --uc-hover:#dfd4bb; --uc-accent:#c44a00; --uc-primary:#1a1208; --uc-primary-text:#faf6ee;
  width:calc(100% - 10px); max-width:1180px; margin-inline:auto; color:var(--uc-ink); -webkit-text-fill-color:var(--uc-ink); -webkit-font-smoothing:antialiased;
}
.tn-unicode-page *, .tn-unicode-page *::before, .tn-unicode-page *::after { box-sizing:border-box; }
.tn-unicode-page .tn-unicode-ad { width:min(900px,100%); min-height:90px; margin-inline:auto; background:transparent; }
.tn-unicode-page .tn-unicode-ad--top { margin-top:54px; margin-bottom:18px; }
.tn-unicode-page .tn-unicode-ad--bottom { margin-top:16px; margin-bottom:26px; }
.tn-unicode-page .tn-unicode-tool { padding:20px; border:1px solid var(--uc-line); background:var(--uc-paper); font-family:-apple-system,BlinkMacSystemFont,"Pretendard","Segoe UI",system-ui,sans-serif; font-variant-numeric:lining-nums tabular-nums; }
.tn-unicode-page .tn-unicode-tool :is(h2,p) { margin:0; }
.tn-unicode-page .tn-unicode-tool h2 { font-size:15px; font-weight:800; line-height:1.4; color:var(--uc-ink); -webkit-text-fill-color:var(--uc-ink); }
.tn-unicode-page .tn-unicode-tool button { display:inline-grid; place-items:center; min-height:40px; min-width:40px; padding:11px 14px; border:1px solid var(--uc-line); border-radius:0; box-shadow:none; font:700 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace; color:var(--uc-ink); -webkit-text-fill-color:var(--uc-ink); background:var(--uc-button); cursor:pointer; transition:background-color .18s ease,border-color .18s ease,transform .18s ease; }
.tn-unicode-page .tn-unicode-tool button:not(:disabled):hover { background:var(--uc-hover); border-color:var(--uc-ink); }
.tn-unicode-page .tn-unicode-tool button:not(:disabled):active { transform:scale(.96); }
.tn-unicode-page .tn-unicode-tool button:disabled { opacity:.45; cursor:not-allowed; }
.tn-unicode-page .tn-unicode-tool :is(button,textarea,[tabindex]):focus-visible { outline:2px solid var(--uc-accent); outline-offset:3px; }
.tn-unicode-page .tn-unicode-direction { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; max-width:460px; padding-bottom:18px; }
.tn-unicode-page .tn-unicode-direction button { display:flex; justify-content:center; gap:12px; align-items:center; min-height:46px; }
.tn-unicode-page .tn-unicode-direction small { font:400 11px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.tn-unicode-page .tn-unicode-direction button[aria-pressed="true"] { border-color:var(--uc-accent); background:var(--uc-wash); box-shadow:inset 0 -3px var(--uc-accent); }
.tn-unicode-page .tn-unicode-workbench { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.tn-unicode-page :is(.tn-unicode-source,.tn-unicode-result) { display:grid; grid-template-rows:auto auto minmax(180px,1fr) auto auto; gap:10px; min-width:0; padding:16px; border:1px solid var(--uc-line); background:var(--uc-surface); }
.tn-unicode-page .tn-unicode-result { background:var(--uc-wash); }
.tn-unicode-page .tn-unicode-pane-head { display:flex; align-items:center; gap:8px; min-width:0; padding-bottom:12px; border-bottom:1px solid var(--uc-soft); }
.tn-unicode-page .tn-unicode-index { font-size:11px; font-weight:700; color:var(--uc-accent); -webkit-text-fill-color:var(--uc-accent); }
.tn-unicode-page :is(.tn-unicode-pane-caption,.tn-unicode-count) { margin-left:auto; font-size:11px; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); }
.tn-unicode-page .tn-unicode-tool label { display:block; margin:0; padding:0; font-size:12px; font-weight:700; line-height:1.5; color:var(--uc-ink); -webkit-text-fill-color:var(--uc-ink); }
.tn-unicode-page .tn-unicode-textarea { display:block; width:100%; min-width:0; max-width:100%; height:180px; min-height:180px; margin:0; padding:14px; border:1px solid var(--uc-line); border-radius:0; background:var(--uc-paper); color:var(--uc-ink); -webkit-text-fill-color:var(--uc-ink); font:400 16px/1.7 -apple-system,BlinkMacSystemFont,"Pretendard","Segoe UI",system-ui,sans-serif; overflow-wrap:anywhere; resize:vertical; box-shadow:none; transition:border-color .18s ease; }
.tn-unicode-page .tn-unicode-textarea::placeholder { color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); opacity:.65; }
.tn-unicode-page .tn-unicode-textarea[aria-invalid="true"] { border-color:var(--uc-accent); }
.tn-unicode-page .tn-unicode-help { min-height:38px; font-size:12px; line-height:19px; text-wrap:pretty; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); }
.tn-unicode-page .tn-unicode-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; min-height:40px; }
.tn-unicode-page .tn-unicode-tool #tnUnicodeCopy { background:var(--uc-primary); border-color:var(--uc-primary); color:var(--uc-primary-text); -webkit-text-fill-color:var(--uc-primary-text); }
.tn-unicode-page .tn-unicode-tool #tnUnicodeCopy:not(:disabled):hover { background:var(--uc-accent); border-color:var(--uc-accent); }
.tn-unicode-page .tn-unicode-local { font-size:11px; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); margin-left:auto; }
.tn-unicode-page .tn-unicode-tool .tn-unicode-status { margin:12px 0 18px; min-height:20px; font-size:12px; line-height:20px; overflow-wrap:anywhere; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); }
.tn-unicode-page [data-state="error"] .tn-unicode-status { color:var(--uc-accent); -webkit-text-fill-color:var(--uc-accent); }
.tn-unicode-page .tn-unicode-detail { padding:16px; border:1px solid var(--uc-line); border-top:3px double var(--uc-line); background:var(--uc-surface); }
.tn-unicode-page .tn-unicode-detail-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; }
.tn-unicode-page .tn-unicode-detail-head > span { font-size:11px; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); }
.tn-unicode-page .tn-unicode-point { display:grid; grid-template-columns:42px minmax(76px,1fr) minmax(120px,1.4fr) minmax(65px,.7fr); gap:10px; align-items:center; min-height:43px; padding:8px 10px; border-bottom:1px solid var(--uc-soft); font-size:13px; line-height:1.5; }
.tn-unicode-page .tn-unicode-point > span { min-width:0; overflow-wrap:anywhere; }
.tn-unicode-page .tn-unicode-point > span:last-child { text-align:right; }
.tn-unicode-page .tn-unicode-point--head { font-size:11px; font-weight:700; background:var(--uc-wash); }
.tn-unicode-page #tnUnicodePoints { max-height:280px; overflow-y:auto; overscroll-behavior:contain; }
.tn-unicode-page .tn-unicode-glyph { font-size:16px; unicode-bidi:isolate; }
.tn-unicode-page .tn-unicode-position { font-size:11px; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); }
.tn-unicode-page .tn-unicode-tool .tn-unicode-detail-help { padding-top:12px; font-size:12px; line-height:1.6; color:var(--uc-muted); -webkit-text-fill-color:var(--uc-muted); }
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-l="dark"],[data-scheme="auto"][data-d="dark"]) .tn-unicode-page,
html[data-scheme="dark"] body:not([data-scheme="light"]) .tn-unicode-page {
  --uc-paper:#241d12; --uc-surface:#322a1a; --uc-wash:#2c2517; --uc-ink:#efe6d2; --uc-muted:#c3b492; --uc-line:#826744; --uc-soft:#574a37; --uc-button:#2f2115; --uc-hover:#3a2a1b; --uc-accent:#e8823f; --uc-primary:#6a3b1f; --uc-primary-text:#efe6d2; color-scheme:dark;
}
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-l="dark"],[data-scheme="auto"][data-d="dark"]) .tn-unicode-page .tn-unicode-tool #tnUnicodeCopy:not(:disabled):hover { background:#824826; }
@media(prefers-color-scheme:dark) {
  body[data-scheme="auto"] .tn-unicode-page { --uc-paper:#241d12; --uc-surface:#322a1a; --uc-wash:#2c2517; --uc-ink:#efe6d2; --uc-muted:#c3b492; --uc-line:#826744; --uc-soft:#574a37; --uc-button:#2f2115; --uc-hover:#3a2a1b; --uc-accent:#e8823f; --uc-primary:#6a3b1f; --uc-primary-text:#efe6d2; color-scheme:dark; }
  body[data-scheme="auto"] .tn-unicode-page .tn-unicode-tool #tnUnicodeCopy:not(:disabled):hover { background:#824826; }
}
@media(max-width:760px) {
  .tn-unicode-page .tn-unicode-ad--top { margin-top:48px; }
  .tn-unicode-page .tn-unicode-tool { padding:12px; }
  .tn-unicode-page .tn-unicode-direction { max-width:none; padding-bottom:12px; }
  .tn-unicode-page .tn-unicode-direction button { flex-direction:column; gap:5px; padding:10px 8px; }
  .tn-unicode-page .tn-unicode-workbench { grid-template-columns:minmax(0,1fr); gap:12px; }
  .tn-unicode-page :is(.tn-unicode-source,.tn-unicode-result) { grid-template-rows:auto auto auto auto auto; padding:12px; gap:9px; }
  .tn-unicode-page .tn-unicode-textarea { height:140px; min-height:140px; padding:12px; }
  .tn-unicode-page .tn-unicode-help { min-height:0; }
  .tn-unicode-page .tn-unicode-detail { padding:12px; }
  .tn-unicode-page .tn-unicode-point { grid-template-columns:25px minmax(45px,1fr) minmax(83px,1.4fr) minmax(48px,.8fr); gap:6px; padding:8px 4px; font-size:11px; }
  .tn-unicode-page .tn-unicode-point--head { font-size:10px; }
  .tn-unicode-page .tn-unicode-glyph { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { .tn-unicode-page .tn-unicode-tool :is(button,textarea) { transition:none; } .tn-unicode-page .tn-unicode-tool button:not(:disabled):active { transform:none; } }

.tn-unicode-page .tn-unicode-count, .tn-unicode-page #tnUnicodePoints .tn-unicode-point > span:last-child { font-family:-apple-system,BlinkMacSystemFont,"Pretendard","Segoe UI",system-ui,sans-serif; font-weight:800; font-variant-numeric:lining-nums tabular-nums; }