.nk { --nk-font: "Segoe UI Symbol", "Cambria Math", var(--sans); width: min(100% - 2rem, 62rem); padding-block: 1.2rem 2rem; }
.nk [hidden] { display: none !important; }
.nk h1, .nk h2, .nk h3 { font-family: var(--sans); }
.nk :is(button,a,input,textarea,select,summary):focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
.nk button { cursor: pointer; touch-action: manipulation; }
.nk button:disabled { cursor: default; opacity: .4; }
.nk-heading { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.2rem; }
.nk-heading h1 { margin: 0; flex: 1; font-size: 1.5rem; line-height: 1.2; font-weight: 650; letter-spacing: -.035em; }
.nk-icon-button { width: 44px; min-height: 44px; flex: 0 0 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: .65rem; color: var(--muted); background: transparent; text-decoration: none; }
.nk-icon-button:hover { color: var(--text); background: var(--surface-2); }
.nk-primary, .nk-secondary { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .7rem 1rem; border: 1px solid var(--border-soft); border-radius: .7rem; font-size: .875rem; font-weight: 650; line-height: 1.3; text-decoration: none; text-align: center; }
.nk-primary { color: #19160e; background: var(--gold-light); border-color: var(--gold-light); }
.nk-primary:hover { color: #19160e; background: #ffe49d; }
.nk-secondary { color: var(--text); background: var(--surface-2); }
.nk-secondary:hover { border-color: var(--muted); color: var(--text); }
.nk-text-button { min-height: 44px; padding: .5rem; border: 0; background: transparent; color: var(--muted); font-size: .875rem; text-decoration: underline; text-underline-offset: .25rem; }
.nk-text-button:hover { color: var(--gold-light); }
.nk-workspace { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); gap: 2rem; align-items: start; }
.nk-stage { min-width: 0; position: sticky; top: 7rem; }
.nk-editor { border: 1px solid #51452c; border-radius: 1rem; padding: 1rem; background: linear-gradient(155deg, #22211c, #14171c 70%); }
.nk-input-label { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.nk .nk-input-label label { margin: 0; color: var(--muted); font-size: .875rem; font-weight: 500; }
.nk-input-label > span { color: var(--muted); font-size: .75rem; }
.nk input, .nk select { width: 100%; min-width: 0; min-height: 46px; font: inherit; font-size: 1rem; color: var(--text); background: var(--bg-elevated); border: 1px solid var(--border-soft); border-radius: .6rem; padding: .6rem .7rem; }
.nk #nk-value { display: block; width: 100%; min-height: 100px; max-height: 240px; resize: vertical; margin: .65rem 0 .3rem; padding: .7rem .25rem; border: 0; border-radius: .35rem; background: transparent; font: 400 clamp(1.7rem,3vw,2.25rem)/1.5 var(--nk-font); color: var(--text); text-align: center; overflow-wrap: anywhere; }
.nk #nk-value::placeholder { color: #8e8876; opacity: .85; }
.nk #nk-value:focus { background: #0b0d1026; outline-offset: 1px; }
.nk-game-note { margin: 0; color: #b6ac96; text-align: center; font-size: .75rem; line-height: 1.5; }
.nk-edit-tools { display: flex; align-items: center; gap: .15rem; margin-top: .7rem; padding-top: .4rem; border-top: 1px solid #ffffff0c; }
.nk-edit-tools > .nk-text-button { margin-left: auto; padding-inline: .5rem 0; }
.nk-dock-inner { display: flex; gap: .5rem; margin-top: .75rem; }
.nk-copy-main { flex: 1; min-height: 50px; }
.nk-save-main { min-height: 50px; }
.nk-account-note { margin: .35rem .3rem 0; font-size: .8125rem; color: var(--muted); }
.nk-account-note a { display: inline-flex; align-items: center; min-height: 44px; }
.nk-tools { min-width: 0; }
.nk-tablist { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: .25rem; margin-bottom: 1rem; background: #14171c; border: 1px solid var(--border-soft); border-radius: .8rem; }
.nk-tablist button { min-width: 0; min-height: 46px; padding: .45rem .25rem; border: 0; border-radius: .5rem; color: var(--muted); background: transparent; font-size: .875rem; font-weight: 550; }
.nk-tablist button[aria-selected="true"] { background: #2a2923; color: var(--gold-light); box-shadow: inset 0 0 0 1px #5b4c2d; }
.nk-tool-panel { min-width: 0; }
.nk-styles { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .6rem; }
.nk-styles button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; min-width: 0; min-height: 94px; padding: 1rem .65rem; color: var(--text); border: 1px solid var(--border-soft); border-radius: .75rem; background: var(--bg-elevated); }
.nk-styles button:disabled { opacity: .72; }
.nk-styles button:hover, .nk-frames button:hover, .nk-symbols button:hover { border-color: var(--gold-dark); background: #24221b; }
.nk-style-demo { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 1.5rem/1.5 var(--nk-font); }
.nk-style-name { color: var(--muted); font-size: .8125rem; }
.nk-selected-mark { position: absolute; top: .35rem; right: .5rem; color: var(--gold-light); font-size: .8rem; visibility: hidden; }
.nk-styles button[aria-pressed="true"], .nk-frames button[aria-pressed="true"] { border-color: var(--gold); background: #28251b; }
.nk-styles button[aria-pressed="true"] .nk-selected-mark { visibility: visible; }
.nk-show-more { display: block; margin: .5rem auto 0; }
.nk-panel-hint, .nk-hint { font-size: .875rem; line-height: 1.6; color: var(--muted); margin-bottom: .75rem; }
.nk-panel-hint { margin-top: .75rem; }
.nk-frames { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .5rem; }
.nk-frames button { min-width: 0; min-height: 60px; padding: .4rem; color: var(--text); border: 1px solid var(--border-soft); border-radius: .7rem; background: var(--bg-elevated); font: 400 1.15rem var(--nk-font); }
.nk-frames button:first-child { font: 500 .875rem var(--sans); }
.nk-symbol-filter { display: grid; gap: .6rem; margin-bottom: .75rem; }
.nk-symbols { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: .4rem; }
.nk-symbols button, .nk-symbol-reference { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 48px; padding: .3rem; border: 1px solid var(--border-soft); border-radius: .55rem; color: var(--text); background: var(--bg-elevated); }
.nk-symbols .nk-glyph { font: 400 1.5rem/1.2 var(--nk-font); }
.nk-symbol-reference { flex-direction: column; min-height: 66px; border-style: dashed; }
.nk-symbol-reference small { font-size: .75rem; overflow-wrap: anywhere; color: var(--muted); }
.nk-symbol-reference img { width: 34px; height: 34px; object-fit: contain; }
.nk label { display: block; font-size: .875rem; color: var(--muted); font-weight: 500; margin: .65rem 0 .4rem; }
.nk summary { min-height: 44px; padding: .65rem 0; color: var(--muted); font-size: .875rem; cursor: pointer; }
.nk-options { margin: .4rem 0 .65rem; }
.nk-options[open] { padding-bottom: .5rem; }
.nk-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; }
.nk-generate { width: 100%; border-color: #66512a; color: var(--gold-light); background: #242119; }
.nk-inline, .nk-result-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.nk-results, .nk-saved-results { display: grid; gap: .6rem; }
.nk-saved-results { grid-template-columns: repeat(auto-fit,minmax(min(100%,280px),1fr)); }
.nk-result { min-width: 0; padding: .8rem 1rem; border: 1px solid var(--border-soft); border-radius: .8rem; background: var(--bg-elevated); }
.nk-result-text { margin: .3rem 0 .8rem; font: 400 1.4rem/1.6 var(--nk-font); color: var(--text); overflow-wrap: anywhere; white-space: pre-wrap; user-select: text; }
.nk-result-actions { justify-content: flex-end; }
.nk-result-actions > * { min-height: 44px; padding: .5rem .8rem; }
.nk-result-save { text-align: right; }
.nk-result-top { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.nk-result-family { color: var(--muted); font-size: .875rem; }
.nk-pin { color: var(--muted); border: 1px solid var(--border-soft); font-size: 1.25rem; }
.nk-pin[aria-pressed="true"] { color: var(--gold-light); background: #30291a; border-color: var(--gold); }
.nk-result-tools { margin-top: .3rem; }
.nk-result-tools > summary { padding: .5rem 0; }
.nk-result-tools > div { display: flex; flex-wrap: wrap; gap: .5rem; }
.nk-use-direct { display: block; margin-left: auto; }
.nk-shortlist { margin-block: .7rem; border: 1px solid #66512a; padding: 0 .7rem .2rem; border-radius: .7rem; }
.nk-shortlist > summary { color: var(--gold-light); }
.nk-shortlist .nk-result { padding: .6rem; }
.nk-refine { border-left: 2px solid var(--gold); padding-left: .8rem; margin-bottom: .8rem; overflow-wrap: anywhere; }
.nk-refine p { margin: .3rem 0; }
.nk-refine > p:first-child { font: 400 1.2rem/1.5 var(--nk-font); }
.nk-series-nav { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; }
.nk-series-nav > span { min-width: 0; overflow-wrap: anywhere; color: var(--muted); font-size: .875rem; }
.nk-series-nav > div { flex-shrink: 0; display: flex; }
.nk-help { max-width: 62rem; margin-top: 1.5rem; padding-top: .4rem; border-top: 1px solid var(--border-soft); }
.nk-help p { max-width: 70ch; font-size: .875rem; }
.nk-letter-panel { padding: .75rem 0; border-top: 1px solid var(--border-soft); }
.nk-letters, .nk-units { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .7rem; }
.nk-letters button { min-width: 44px; min-height: 44px; padding: .3rem .5rem; font: 400 1.3rem var(--nk-font); color: var(--text); border: 1px solid var(--border-soft); border-radius: .5rem; background: var(--bg-elevated); }
.nk-letters button[aria-pressed="true"] { border-color: var(--gold); color: var(--gold-light); }
.nk-unit { padding: .5rem; border: 1px solid var(--border-soft); border-radius: .5rem; font-size: .8125rem; overflow-wrap: anywhere; max-width: 100%; }
.nk-unit b { font: 400 1.1rem var(--nk-font); }
.nk-unit small { display: block; color: var(--muted); }
.nk-selection-hint { margin-bottom: .6rem; color: var(--gold-light); font-size: .875rem; }
.nk-error, .nk-notice { padding: .7rem .8rem; border: 1px solid #916947; border-radius: .6rem; overflow-wrap: anywhere; font-size: .875rem; margin-top: .6rem; }
.nk-library { max-width: 52rem; }
.nk-library-intro { display: flex; justify-content: space-between; align-items: center; gap: .6rem; margin-bottom: 1rem; font-size: .875rem; color: var(--muted); }
.nk-library-intro p { margin: 0; }
.nk-search { display: flex; gap: .5rem; margin-bottom: 1rem; }
.nk-search input { flex: 1; }
.nk .nk-check { display: flex; align-items: center; gap: .65rem; min-height: 44px; margin-block: .7rem; }
.nk .nk-check input { flex: 0 0 22px; width: 22px; min-height: 22px; height: 22px; accent-color: var(--gold); }
.nk-delete > summary { font-size: .8125rem; text-align: right; }
.nk-empty { padding: 2rem 1rem; text-align: center; border: 1px dashed var(--border-soft); border-radius: 1rem; }
.nk-empty > span { display: block; font-size: 2rem; color: var(--gold); margin-bottom: .5rem; }
.nk-empty h2 { font-size: 1.125rem; line-height: 1.4; }
.nk-empty p { font-size: .875rem; }
.nk-toast { margin-top: .6rem; font-size: .875rem; color: var(--gold-light); }
.nk-toast:empty { display: none; }
.nk-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%); white-space: nowrap; border: 0 !important; }
.nk.nk-enhanced .nk-nojs-heading { display: none; }
@media (max-width: 760px) {
    .page-shell:has(.nk) { padding-top: 0; }
    .nk { padding-top: .6rem; padding-bottom: calc(6rem + env(safe-area-inset-bottom)); }
    .nk-heading { margin-bottom: .7rem; gap: .4rem; }
    .nk-heading h1 { font-size: 1.3rem; }
    .nk-workspace { display: flex; flex-direction: column; gap: .8rem; }
    .nk-stage, .nk-tools { width: 100%; position: static; }
    .nk-editor { padding: .85rem; border-radius: .85rem; }
    .nk #nk-value { min-height: 70px; height: 76px; margin-block: .3rem; font-size: 1.9rem; }
    .nk-game-note { text-align: left; }
    .nk-edit-tools { margin-top: .3rem; padding-top: .15rem; }
    .nk-account-note { font-size: .75rem; margin-top: .2rem; }
    .nk-tablist { margin-bottom: .7rem; }
    .nk-styles { gap: .5rem; }
    .nk-styles button { min-height: 78px; padding: .6rem .45rem; }
    .nk-style-demo { font-size: 1.3rem; }
    .nk-style-name { font-size: .75rem; }
    .nk-action-dock { position: fixed; z-index: 29; left: 0; right: 0; bottom: 0; padding: .65rem 1rem max(.65rem, env(safe-area-inset-bottom)); background: #12151af5; border-top: 1px solid #4b4231; backdrop-filter: blur(14px); }
    .nk-dock-inner { max-width: 36rem; margin: 0 auto; }
    .nk:not(.nk-enhanced) .nk-action-dock { position: static; padding: 0; border: 0; background: transparent; }
    body:has(.bottom-nav) .nk-action-dock { bottom: calc(4.35rem + env(safe-area-inset-bottom)); padding-bottom: .65rem; }
    body:has(.bottom-nav) .nk { padding-bottom: 7rem; }
    .nk-help { margin-top: 1.2rem; }
    .nk-library { padding-bottom: 2rem; }
}
@media (prefers-reduced-motion: reduce) { .nk * { scroll-behavior: auto !important; } }

/* The messages flag also covers the nickname branch of the creative workshop. */
body:has(.nk-v2)::before { background: none; }
.nk-v2 { max-width: 74rem; padding-top: 0; }
.nk-v2 .nk-heading.task-bar { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; gap: .5rem; margin: 0 -1rem .875rem; padding-inline: .5rem; border-radius: 0; }
.nk-v2 .nk-heading h1 { font: 600 1rem/1.2 var(--serif); letter-spacing: 0; }
.nk-v2 .workshop-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin: .875rem 0; padding: .25rem; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--bg-elevated); }
.nk-v2 .workshop-tabs:not(:has(a:nth-child(2))) { grid-template-columns: minmax(0,1fr); }
.nk-v2 .workshop-tabs a { padding-inline: .25rem; border: 0; border-radius: 8px; font-size: .8125rem; }
.nk-v2 .workshop-tabs a[aria-current] { color: var(--gold-light); background: rgb(212 168 63 / .16); font-weight: 700; }
.nk-v2 .nk-editor { border-color: var(--border); border-radius: 12px; background: #0f1216; }
.nk-v2 .nk-input-label label { font-size: .6875rem; text-transform: uppercase; letter-spacing: .12em; color: var(--gold); font-weight: 700; }
.nk-v2 .nk-tablist { border-radius: 10px; }
.nk-v2 .nk-tablist button { font-size: .8125rem; }
.nk-v2 .nk-tablist button[aria-selected=true] { background: rgb(212 168 63 / .16); box-shadow: none; font-weight: 700; }
.nk-v2 .nk-primary { color: #17130a; background: linear-gradient(110deg,var(--gold-light),var(--gold)); border-color: var(--gold); }
.nk-v2 .nk-primary:hover { background: var(--gold-light); }
.nk-v2 .nk-action-dock.action-bar { display: block; }
.nk-v2 .nk-dock-inner { width: 100%; }
@media (max-width: 57.99rem) and (min-height: 551px) {
    .ui-mobile-v2:has(.nk-v2.nk-enhanced .action-bar) .analytics-consent { bottom: calc(53px + .625rem + max(.75rem,env(safe-area-inset-bottom))); }
}
@media (max-width: 1023px) {
    .page-shell:has(.nk-v2) { padding-top: 0; }
    .nk-v2 .nk-workspace { display: flex; flex-direction: column; gap: .75rem; }
    .nk-v2 .nk-stage, .nk-v2 .nk-tools { width: 100%; position: static; }
    body:has(.bottom-nav) .nk-v2 .nk-action-dock.action-bar, .nk-v2 .nk-action-dock.action-bar { position: fixed; left: 0; right: 0; bottom: 0; padding: .625rem max(1rem,env(safe-area-inset-right)) max(.75rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left)); border: 0; border-top: 1px solid var(--border-soft); border-radius: 0; background: rgb(11 13 16 / .96); }
    .nk-v2 .nk-dock-inner { max-width: none; margin: 0; }
    .nk-v2 :is(.nk-copy-main,.nk-save-main) { min-height: 52px; }
    .nk-v2:not(.nk-enhanced) .nk-action-dock.action-bar { position: static; padding: 0; border: 0; background: transparent; }
    .nk-v2:not(.nk-library) { padding-bottom: calc(6rem + env(safe-area-inset-bottom)); }
}
@media (min-width: 1024px) {
    .nk-v2 .nk-heading.task-bar { position: static; margin: 0; padding: 0; background: transparent; backdrop-filter: none; min-height: 64px; }
    .nk-v2 .nk-heading h1 { font-size: 1.5rem; }
    .nk-v2 .workshop-tabs { max-width: 32rem; margin: 1.25rem auto 1.75rem; }
    .nk-v2 .nk-stage { top: 1rem; }
    .nk-v2 .nk-action-dock.action-bar { position: static; padding: 0; border: 0; background: transparent; backdrop-filter: none; }
    .nk-v2 .nk-dock-inner { margin-top: .75rem; }
}
@media (max-height: 550px) {
    .nk-v2 .nk-action-dock.action-bar { position: static !important; padding: .5rem 0 0; border: 0; }
    .nk-v2 .nk-stage { position: static; }
}
