.fantasy-card { margin-top: 16px; }
.fantasy-settings { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: 12px; margin: 16px 0; }
.fantasy-settings .field, .advanced-settings .field { display: grid; gap: 7px; color: var(--text, #202a35); font-size: 13px; font-weight: 700; }
.fantasy-settings select, .advanced-settings select { min-height: 42px; padding: 8px 11px; border: 1px solid var(--line, #d6ddd8); border-radius: 9px; background: var(--surface, #fff); color: inherit; }
.advanced-settings { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); align-items: end; gap: 12px; margin: 14px 0; padding: 15px; border: 1px solid var(--line, #d6ddd8); border-radius: 12px; background: var(--surface-soft, #f8faf8); }
.advanced-settings[hidden], [hidden] { display: none !important; }
.check-field { display: flex; align-items: center; gap: 9px; min-height: 42px; color: var(--text, #202a35); font-size: 13px; line-height: 1.45; }
.check-field input { width: 18px; height: 18px; accent-color: var(--accent, #397c58); }
.field { display: grid; gap: 8px; color: var(--text, #202a35); font-size: 13px; font-weight: 700; }
.textarea-label { margin-top: 15px; }
.limit-note { margin-left: 5px; color: var(--muted, #65706b); font-size: 11px; font-weight: 500; }
.textarea-label textarea { width: 100%; min-height: 150px; resize: vertical; padding: 12px; border: 1px solid var(--line, #d6ddd8); border-radius: 10px; background: var(--surface, #fff); color: var(--text, #202a35); font: 14px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
.fantasy-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.fantasy-actions button:disabled { cursor: not-allowed; opacity: .52; }
.action-status { min-height: 1.5em; margin: 12px 0 0; color: var(--muted, #65706b); font-size: 12px; }
.action-status.is-error { color: #a52e38; }
.inline-error { margin: 9px 0; padding: 10px 12px; border: 1px solid #d88a91; border-radius: 9px; background: #fff1f1; color: #7e2029; font-size: 13px; line-height: 1.5; }
.accuracy-note { margin: 13px 0 0; padding: 11px 13px; border-left: 3px solid var(--accent, #397c58); background: var(--surface-soft, #f8faf8); color: var(--muted, #59665f); font-size: 12px; line-height: 1.6; }
.features-card, .faq-card { margin-top: 16px; }
.features-card h2, .faq-card h2 { margin: 7px 0 13px; }
.features-card ul { display: grid; gap: 8px; margin: 10px 0; padding-left: 22px; color: var(--text, #28332d); font-size: 13px; line-height: 1.65; }
.features-card > p:last-child { color: var(--muted, #65706b); font-size: 13px; line-height: 1.65; }
.faq-card details { border-top: 1px solid var(--line, #d6ddd8); }
.faq-card summary { padding: 13px 2px; color: var(--text, #202a35); cursor: pointer; font-size: 13px; font-weight: 700; line-height: 1.45; }
.faq-card details p { margin: 0 0 14px; color: var(--muted, #58645e); font-size: 13px; line-height: 1.65; }
.site-dialog { width: min(570px, calc(100% - 28px)); max-width: none; max-height: min(84vh, 720px); margin: auto; padding: 0; overflow: auto; border: 1px solid var(--line, #cdd7d0); border-radius: 15px; background: var(--surface, #fff); color: var(--text, #202a35); box-shadow: 0 24px 80px rgb(0 0 0 / 28%); }
.site-dialog::backdrop { background: rgb(20 30 25 / 66%); backdrop-filter: blur(3px); }
.dialog-content { padding: clamp(18px, 4vw, 26px); }
.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 13px; }
.dialog-heading h2 { margin: 6px 0 0; font-size: 21px; line-height: 1.25; }
.dialog-content > p, .dialog-content li { color: var(--muted, #58645e); font-size: 13px; line-height: 1.65; }
.dialog-content ul { display: grid; gap: 7px; padding-left: 21px; }
.dialog-close { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; border: 1px solid var(--line, #cdd7d0); border-radius: 50%; background: var(--surface-soft, #f8faf8); color: var(--text, #202a35); cursor: pointer; font-size: 24px; line-height: 1; }
.site-dialog--error { border-color: #d88a91; }
.site-dialog--error .card-eyebrow { color: #a52e38; }
@media (max-width: 600px) {
    .fantasy-settings { grid-template-columns: 1fr; }
    .fantasy-actions button { flex: 1 1 100%; }
}

body[data-page="/text-tools/fantasy-languages/"] {
    color-scheme: light;
    --canvas: #f4f5f0;
    --paper: #fff;
    --ink: #20251f;
    --muted: #737b72;
    --line: #e5e9e1;
    --green: #367251;
    --green-dark: #254c37;
    --green-pale: #eaf2e9;
    --error: #a54838;
    --shadow: 0 16px 48px rgb(33 48 36 / 5%);
    min-width: 320px;
    margin: 0;
    background: var(--canvas);
    color: var(--ink);
    font-family: "Segoe UI", Arial, sans-serif;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) button,
:where(body[data-page="/text-tools/fantasy-languages/"]) select,
:where(body[data-page="/text-tools/fantasy-languages/"]) textarea {
    font: inherit;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) button:focus-visible,
:where(body[data-page="/text-tools/fantasy-languages/"]) select:focus-visible,
:where(body[data-page="/text-tools/fantasy-languages/"]) textarea:focus-visible,
:where(body[data-page="/text-tools/fantasy-languages/"]) a:focus-visible {
    outline: 3px solid rgb(var(--green-rgb) / 24%);
    outline-offset: 3px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .app-shell {
    width: min(960px, calc(100% - 48px));
    margin: 0 auto;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .topbar {
    display: flex;
    min-height: 72px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--ink);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -.6px;
    text-decoration: none;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .brand-mark {
    display: flex;
    width: 21px;
    height: 21px;
    align-items: end;
    gap: 2px;
    padding: 4px;
    border-radius: 7px;
    background: var(--green);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .brand-mark span {
    width: 3px;
    border-radius: 2px;
    background: #fff;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .brand-mark span:nth-child(1) { height: 6px; }
:where(body[data-page="/text-tools/fantasy-languages/"]) .brand-mark span:nth-child(2) { height: 11px; }
:where(body[data-page="/text-tools/fantasy-languages/"]) .brand-mark span:nth-child(3) { height: 8px; }
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-brand-header {
    flex-wrap: wrap;
    align-content: center;
    gap: 0 .75rem;
    padding-block: .45rem;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-brand-tagline {
    flex: 0 0 100%;
    order: 10;
    width: 100%;
    margin: .15rem 0 0;
    color: #68756b;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .09em;
    line-height: 1.4;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .local-badge {
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fafbf8;
    color: #5e685f;
    font-size: 11px;
    font-weight: 650;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .hero {
    max-width: 860px;
    padding: 38px 0 14px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .eyebrow,
:where(body[data-page="/text-tools/fantasy-languages/"]) .card-eyebrow {
    margin: 0;
    color: var(--green);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 1.3px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .hero h1 {
    margin: 12px 0;
    font-size: clamp(36px, 5vw, 54px);
    line-height: 1.08;
    letter-spacing: -2px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .hero-copy,
:where(body[data-page="/text-tools/fantasy-languages/"]) .hero-seo-copy {
    max-width: 820px;
    color: var(--muted);
    line-height: 1.65;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .hero-copy {
    margin: 0;
    font-size: 15px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .hero-seo-copy {
    margin: 8px 0 0;
    font-size: 13px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-breadcrumbs {
    display: block;
    width: 100%;
    margin: 0 0 clamp(12px, 1.7vw, 20px);
    color: #68756b;
    font: inherit;
    font-size: .88333rem;
    line-height: 1.5;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-breadcrumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-breadcrumbs li + li::before {
    content: "/";
    margin-right: .35rem;
    color: #9aa59b;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-breadcrumbs ol a {
    display: inline-flex;
    min-height: 31px;
    align-items: center;
    padding: .28rem .78rem;
    border: 1px solid var(--green-border);
    border-radius: 999px;
    background: var(--green-pale);
    box-shadow: 0 1px 2px rgb(37 76 55 / 8%);
    color: var(--green-dark);
    font-weight: 750;
    text-decoration: none;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-breadcrumbs ol a:hover {
    border-color: var(--green);
    background: var(--green-pale-hover);
    color: var(--green-deep);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-control-layout {
    margin-block: 10px 16px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-card,
:where(body[data-page="/text-tools/fantasy-languages/"]) .features-card,
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card {
    padding: clamp(16px, 3vw, 22px);
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--paper);
    box-shadow: var(--shadow);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .card-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 14px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .card-index {
    color: #737b72;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .top-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .tool-card h2,
:where(body[data-page="/text-tools/fantasy-languages/"]) .features-card h2,
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card h2 {
    margin: 12px 0 15px;
    color: var(--ink);
    font-size: 20px;
    letter-spacing: -.5px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .fantasy-settings .field,
:where(body[data-page="/text-tools/fantasy-languages/"]) .advanced-settings .field {
    color: #39473c;
    font-size: 12px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .fantasy-settings select,
:where(body[data-page="/text-tools/fantasy-languages/"]) .advanced-settings select {
    width: 100%;
    color: var(--ink);
    font-size: 13px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .textarea-label {
    margin: 15px 0 7px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .textarea-label textarea {
    min-height: 170px;
    background: #fbfcfa;
    font-size: 13px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) #result-text {
    min-height: 190px;
    background: #fff;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .textarea-label textarea::placeholder {
    color: #888f87;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button {
    min-height: 39px;
    padding: 9px 14px;
    border: 1px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button:hover:not(:disabled) {
    transform: translateY(-1px);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button--primary {
    border-color: var(--green);
    background: var(--green);
    color: #fff;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button--primary:hover:not(:disabled) {
    border-color: var(--green-hover);
    background: var(--green-hover);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button--primary[aria-pressed="true"] {
    border-color: #dfe6dd;
    background: #fff;
    color: #405b48;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button--primary[aria-pressed="true"]:hover:not(:disabled) {
    border-color: #afc8b3;
    background: #f7faf6;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button--secondary {
    border-color: #dfe6dd;
    background: #fff;
    color: #405b48;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button--secondary:hover:not(:disabled) {
    border-color: var(--green-border);
    background: var(--green-soft);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .utility-button:disabled {
    cursor: not-allowed;
    opacity: .48;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .text-button {
    min-height: 32px;
    padding: 7px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #58645a;
    cursor: pointer;
    font-size: 11px;
    font-weight: 650;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .text-button:hover:not(:disabled) {
    background: var(--green-soft);
    color: var(--green);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .action-status {
    color: var(--green);
    font-size: 12px;
    line-height: 1.5;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .action-status.is-error {
    color: var(--error);
    font-weight: 650;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .inline-error {
    margin: 9px 0;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .accuracy-note {
    border-left-color: var(--green);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .features-card,
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card {
    margin-top: 16px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .features-card h2,
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card h2 {
    margin: 7px 0 13px;
    font-size: 19px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .features-card ul {
    color: #58645a;
    font-size: 13px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .features-card > p:last-child {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.65;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card details {
    border-top: 1px solid var(--line);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card summary {
    padding: 13px 2px;
    color: var(--ink);
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .faq-card details p {
    margin: 0 0 14px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.65;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .site-footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 22px 0 30px;
    color: #687169;
    font-size: 11px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .site-footer a {
    color: var(--green-dark);
    text-decoration: none;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .site-dialog {
    width: min(590px, calc(100% - 32px));
    max-width: none;
    max-height: min(82vh, 760px);
    margin: auto;
    padding: 0;
    overflow: auto;
    border: 1px solid #dfe6dd;
    border-radius: 15px;
    background: var(--paper);
    color: var(--ink);
    box-shadow: 0 24px 90px rgb(20 35 24 / 24%);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .site-dialog::backdrop {
    background: rgb(17 27 20 / 48%);
    backdrop-filter: blur(2px);
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .dialog-heading {
    padding: 20px 22px 13px;
    border-bottom: 1px solid #edf0ea;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .dialog-heading h2 {
    color: var(--ink);
    font-size: 20px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .dialog-close {
    width: 35px;
    height: 35px;
    padding: 0 0 3px;
    border-radius: 8px;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .dialog-content {
    max-height: calc(min(82vh, 760px) - 80px);
    padding: 16px 22px 21px;
    overflow: auto;
    color: #59635a;
    font-size: 13px;
    line-height: 1.65;
}
:where(body[data-page="/text-tools/fantasy-languages/"]) .site-dialog--error {
    border-top: 4px solid var(--error);
}
@media (max-width: 680px) {
    :where(body[data-page="/text-tools/fantasy-languages/"]) .app-shell {
        width: min(100% - 28px, 920px);
    }
    :where(body[data-page="/text-tools/fantasy-languages/"]) .tool-card {
        padding: 16px;
    }
    :where(body[data-page="/text-tools/fantasy-languages/"]) .tool-brand-tagline {
        font-size: .68rem;
    }
}