.nn-root{display: grid;gap: var(--sp-3);min-height: calc(min(100vw - 2 * var(--gutter),var(--board-max)) + 240px);align-content: start}.nn-icon{fill: none;stroke: currentColor;stroke-width: 2.4;stroke-linecap: round;stroke-linejoin: round;flex: none}.nn-icon--filled{fill: currentColor}.nn-btn{display: inline-flex;align-items: center;justify-content: center;gap: var(--sp-1);min-height: var(--tap-min);padding: 0 var(--sp-3);border-radius: var(--r-md);border: var(--outline-w) solid var(--color-outline);background: var(--color-surface);color: var(--color-text);box-shadow: var(--shadow-pop-sm);font: inherit;font-size: var(--fs-md);font-weight: var(--fw-bold);cursor: pointer;transition: transform var(--dur-instant) var(--ease-out),box-shadow var(--dur-instant) var(--ease-out)}.nn-btn:active:not(:disabled){transform: translateY(var(--press-y));box-shadow: none}.nn-btn:disabled{opacity: 0.4;cursor: not-allowed;box-shadow: none}.nn-btn:focus-visible{outline: 3px solid var(--color-focus);outline-offset: 2px}.nn-btn--icon{width: var(--tap-min);padding: 0;position: relative}.nn-btn--primary{background: var(--color-primary);color: var(--color-on-primary);min-height: 52px;box-shadow: var(--shadow-pop)}.nn-btn--secondary{color: var(--color-primary)}.nn-btn--ghost{background: transparent;border-color: transparent;box-shadow: none;justify-content: flex-start;width: 100%;font-weight: var(--fw-semibold)}.nn-btn--ghost:hover:not(:disabled){background: var(--color-surface-sunken)}.nn-btn--danger{background: var(--color-danger);color: var(--color-text-inverse)}.nn-tabs{position: relative;display: flex;align-items: flex-end;gap: var(--sp-1);border-bottom: var(--outline-w) solid var(--color-border)}.nn-tab{min-height: var(--tap-min);padding: 0 var(--sp-3);border: 0;background: none;color: var(--color-text-muted);font: inherit;font-weight: var(--fw-semibold);cursor: pointer;border-bottom: 4px solid transparent;margin-bottom: calc(-1 * var(--outline-w))}.nn-tab[aria-selected="true"]{color: var(--color-text);font-weight: var(--fw-heavy);border-bottom-color: var(--game-nonogram-bg)}.nn-tab:focus-visible{outline: 3px solid var(--color-focus);outline-offset: -3px}.nn-coach{position: relative;margin-left: auto;align-self: flex-end;flex: none;width: 44px;height: 44px;pointer-events: none}.nn-coach__img{display: block;width: 44px;height: 44px;margin-bottom: -2px}.nn-coach__bubble{position: absolute;right: calc(100% + 4px);bottom: 6px;z-index: 6;white-space: nowrap;padding: 6px 10px;border-radius: 14px 14px 4px 14px;background: var(--bubble-bg);color: var(--bubble-fg);border: var(--outline-w) solid var(--color-outline);box-shadow: var(--shadow-pop-sm);font-size: var(--fs-xs);font-weight: var(--fw-heavy);line-height: 1.2;animation: nn-bubble var(--dur-pop) var(--ease-spring)}.nn-coach__bubble[hidden]{display: none}@keyframes nn-bubble{from{transform: translateY(6px) scale(0.85);opacity: 0}to{transform: none;opacity: 1}}.nn-panel{display: grid;gap: var(--sp-3)}.nn-practice{display: flex;flex-wrap: wrap;gap: var(--sp-2);align-items: center}.nn-seg{display: inline-flex;gap: 0;padding: 0;border-radius: var(--r-md);overflow: hidden;background: var(--color-surface);border: var(--outline-w) solid var(--color-outline);box-shadow: var(--shadow-pop-sm)}.nn-levels{flex: 1 1 auto}.nn-levels .nn-seg__btn{flex: 1 1 0}.nn-seg__btn{display: inline-flex;flex-direction: column;align-items: center;justify-content: center;gap: 0;min-height: var(--tap-min);min-width: var(--tap-min);padding: 2px var(--sp-2);border: 0;border-radius: 0;background: transparent;color: var(--color-text-muted);font: inherit;cursor: pointer}.nn-seg__btn + .nn-seg__btn{border-left: var(--outline-w) solid var(--color-outline)}.nn-seg__btn[aria-checked="true"]{background: var(--color-text);color: var(--color-text-inverse)}.nn-levels .nn-seg__btn[aria-checked="true"]{background: var(--game-nonogram-bg);color: var(--game-nonogram-fg)}.nn-seg__btn:focus-visible{outline: 3px solid var(--color-focus);outline-offset: -4px}.nn-seg__main{font-size: var(--fs-sm);font-weight: var(--fw-heavy);line-height: var(--lh-tight);white-space: nowrap}.nn-seg__sub{font-size: var(--fs-2xs);font-weight: var(--fw-semibold);font-variant-numeric: tabular-nums;line-height: var(--lh-tight)}.nn-new{flex: none;color: var(--color-primary)}.nn-status{display: flex;align-items: center;gap: var(--sp-2);min-height: var(--tap-min);scroll-margin-top: calc(var(--header-h) + var(--sp-2))}.nn-meta{flex: 1 1 auto;margin: 0;color: var(--color-text-muted);font-size: var(--fs-sm);font-weight: var(--fw-semibold)}.nn-chip{display: inline-flex;flex: none;align-items: center;gap: 5px;height: 32px;padding: 0 10px;border-radius: var(--r-pill);background: var(--color-surface);color: var(--color-text);border: var(--outline-w) solid var(--color-outline);font-family: var(--font-num);font-size: var(--fs-sm);font-weight: var(--fw-heavy);font-variant-numeric: tabular-nums;white-space: nowrap}.nn-chip[hidden]{display: none}.nn-status .nn-btn{flex: none}.nn-timer .nn-icon{width: 16px;height: 16px;stroke-width: 3}.nn-viewport{position: relative;max-width: 100%;overflow: hidden;display: flex;justify-content: center}.nn-viewport[data-zoom="on"]{overflow: auto;justify-content: flex-start;overscroll-behavior: contain;max-height: calc(100dvh - var(--header-h) - 200px);min-height: 240px;border: var(--outline-w) solid var(--color-outline);border-radius: var(--r-md);background: var(--color-surface)}.nn-board{position: relative;display: grid;width: max-content;margin: 0 auto;padding: 0 5px 6px 0;grid-template-columns: var(--nn-row-w) repeat(var(--nn-w),var(--nn-cell));grid-template-rows: var(--nn-col-h) repeat(var(--nn-h),var(--nn-cell));touch-action: none;user-select: none;-webkit-user-select: none;-webkit-touch-callout: none}.nn-board.is-paused{visibility: hidden}.nn-row{display: contents}.nn-frame{position: absolute;inset: -2px;grid-column: 2 / -1;grid-row: 2 / -1;z-index: 1;pointer-events: none;border: var(--outline-w-bold) solid var(--color-outline);border-radius: 4px;box-shadow: var(--shadow-pop)}.nn-corner{position: sticky;top: 0;left: 0;z-index: 3;background: var(--color-bg)}.nn-clue{background: var(--color-bg);color: var(--color-text);touch-action: pan-x pan-y}.nn-viewport[data-zoom="on"] .nn-clue,.nn-viewport[data-zoom="on"] .nn-corner{background: var(--color-surface)}.nn-clue--col{position: sticky;top: 0;z-index: 2;display: flex;align-items: flex-end;justify-content: center;padding-bottom: 5px}.nn-clue--row{position: sticky;left: 0;z-index: 2;display: flex;align-items: center;justify-content: flex-end;padding-right: 6px}.nn-clue--col:nth-child(odd){background-image: linear-gradient(var(--color-surface-sunken),var(--color-surface-sunken));background-size: 100% 100%}.nn-clue--col .nn-clue__list{display: flex;flex-direction: column;align-items: center}.nn-clue--row .nn-clue__list{display: flex;align-items: center;gap: calc(var(--nn-fs) * 0.4)}.nn-clue.is-peer{background: var(--state-peer-bg);background-image: none}.nn-num{padding: 0 1px;border: 0;background: none;color: inherit;cursor: pointer;font-family: var(--font-num);font-size: var(--nn-fs);font-weight: var(--fw-heavy);line-height: 1.15;font-variant-numeric: tabular-nums}.nn-num.is-done{opacity: 0.38}.nn-num.is-memo{color: var(--color-text-subtle);font-weight: var(--fw-regular)}.nn-num.is-memo:not(.is-done){text-decoration: underline dotted}.nn-cell{position: relative;background: var(--color-surface);cursor: pointer;outline: none;border-right: 1px solid var(--color-grid-line);border-bottom: 1px solid var(--color-grid-line)}.nn-cell.nn-guide-r{border-right: 2px solid var(--color-grid-line-strong)}.nn-cell.nn-guide-b{border-bottom: 2px solid var(--color-grid-line-strong)}.nn-cell.is-peer{background: var(--state-peer-bg)}.nn-cell.is-fill{background: var(--pz-cell-filled)}.nn-cell.is-mark::after{content: "✕";position: absolute;inset: 0;display: grid;place-items: center;color: var(--pz-mark-fg);font-size: calc(var(--nn-cell) * 0.62);font-weight: var(--fw-bold);line-height: 1;font-family: var(--font-ui)}.nn-cell.is-wrong{background-image: var(--pattern-error);box-shadow: inset 0 0 0 2px var(--state-error-border)}.nn-cell.is-wrong::before{content: "!";position: absolute;top: 0;right: 2px;color: var(--state-error-fg);font-size: calc(var(--nn-cell) * 0.45);font-weight: var(--fw-black);line-height: 1;background: var(--color-surface)}.nn-cell.is-hint{box-shadow: inset 0 0 0 3px var(--state-hint-fg)}.nn-cell.is-hint:not(.is-fill){background: var(--state-hint-bg)}.nn-cell:focus-visible{box-shadow: inset 0 0 0 3px var(--state-selected-ring);z-index: 1}.nn-cell.is-hint:focus-visible{box-shadow: inset 0 0 0 3px var(--state-hint-fg),inset 0 0 0 6px var(--state-selected-ring)}.nn-board.is-solved .nn-cell{border-color: transparent;cursor: default}.nn-board.is-solved .nn-cell.is-fill{background: var(--nn-tint,var(--game-nonogram-bg))}.nn-board.is-solved .nn-num.is-done{opacity: 0.55}.nn-board.is-revealed .nn-cell{cursor: default}.nn-board.is-celebrating .nn-cell.is-fill{animation: nn-tint var(--dur-slow) var(--ease-out) var(--nn-d,0ms) both}@keyframes nn-tint{0%{background: var(--pz-cell-filled-done);box-shadow: 0 0 0 0.5px var(--pz-cell-filled-done)}90%{box-shadow: 0 0 0 0.5px var(--nn-tint,var(--game-nonogram-bg))}100%{background: var(--nn-tint,var(--game-nonogram-bg));box-shadow: 0 0 0 0 var(--nn-tint,var(--game-nonogram-bg))}}@media (prefers-reduced-motion: reduce){:root:not([data-motion="full"]) .nn-board.is-celebrating .nn-cell.is-fill,:root:not([data-motion="full"]) .nn-coach__bubble{animation: none}}:root[data-motion="reduce"] .nn-board.is-celebrating .nn-cell.is-fill,:root[data-motion="reduce"] .nn-coach__bubble{animation: none}.nn-cover{position: absolute;inset: 0;z-index: 5;display: grid;place-items: center;background: var(--color-surface-sunken);border-radius: var(--r-md)}.nn-resume{width: auto;padding: 0 var(--sp-6)}.nn-progress{display: flex;align-items: center;justify-content: center;gap: var(--sp-2);margin: 0;font-size: var(--fs-xs);font-weight: var(--fw-bold);color: var(--color-text-muted)}.nn-progress__bar{flex: 1 1 auto;max-width: 220px;height: 10px;border-radius: var(--r-pill);overflow: hidden;background: var(--color-surface);border: var(--outline-w) solid var(--color-outline)}.nn-progress__fill{display: block;height: 100%;width: 0;background: var(--game-nonogram-bg);transition: width var(--dur-base) var(--ease-out)}.nn-progress__num{min-width: 3.2em;font-family: var(--font-num);font-variant-numeric: tabular-nums}.nn-side{display: grid;gap: var(--sp-3);align-content: start}.nn-tools{display: flex;justify-content: center;align-items: stretch;gap: 5px}.nn-toolseg{flex: 3 1 0;max-width: 192px}.nn-toolseg .nn-seg__btn{flex: 1 1 0;min-width: 0}.nn-tools > .nn-btn,.nn-tools > .nn-more{flex: 1 1 0;min-width: 0;max-width: 64px}.nn-tool{flex-direction: column;gap: 1px;height: 56px;width: auto;padding: 0 1px}.nn-tools > .nn-more > .nn-more__sum{width: 100%}.nn-tool .nn-icon{width: 24px;height: 24px}.nn-cap{display: block;max-width: 100%;overflow: hidden;text-overflow: clip;white-space: nowrap;font-size: 10px;font-weight: var(--fw-heavy);line-height: 1.1}.nn-toolseg .nn-seg__btn[aria-checked="true"]{color: var(--color-text-inverse)}.nn-hint-count{position: absolute;top: -8px;right: -6px;min-width: 20px;height: 20px;padding: 0 5px;border-radius: var(--r-pill);background: var(--color-accent);color: var(--color-on-accent);border: var(--outline-w) solid var(--color-outline);font-size: var(--fs-2xs);font-weight: var(--fw-heavy);line-height: 16px;text-align: center}.nn-hint-btn:disabled .nn-hint-count{display: none}.nn-more{position: relative;display: flex}.nn-more__sum{list-style: none}.nn-more__sum::-webkit-details-marker{display: none}.nn-more__panel{position: fixed;left: var(--gutter);right: var(--gutter);bottom: max(var(--gutter),env(safe-area-inset-bottom));z-index: var(--z-dropdown);display: grid;gap: var(--sp-1);padding: var(--sp-2);background: var(--color-surface);border: var(--outline-w) solid var(--color-outline);border-radius: var(--r-lg);box-shadow: var(--shadow-pop)}.nn-more__close{justify-self: end;box-shadow: none;border-color: transparent;background: transparent}.nn-sep{border: 0;border-top: 1px solid var(--color-border);margin: var(--sp-1) 0}.nn-switch{display: flex;align-items: center;gap: var(--sp-2);min-height: var(--tap-min);padding: 0 var(--sp-2);cursor: pointer;font-size: var(--fs-sm);font-weight: var(--fw-semibold)}.nn-switch__input{appearance: none;-webkit-appearance: none;position: relative;flex: none;width: 42px;height: 26px;margin: 0;border: var(--outline-w) solid var(--color-outline);border-radius: var(--r-pill);background: var(--color-surface-sunken);cursor: pointer;transition: background var(--dur-fast) var(--ease-out)}.nn-switch__input::before{content: "";position: absolute;top: 2px;left: 2px;width: 18px;height: 18px;border-radius: 50%;background: var(--color-text-muted);transition: transform var(--dur-fast) var(--ease-out)}.nn-switch__input:checked{background: var(--game-nonogram-bg)}.nn-switch__input:checked::before{transform: translateX(16px);background: var(--color-outline)}.nn-switch__input:focus-visible{outline: 3px solid var(--color-focus);outline-offset: 2px}.nn-switch__label{flex: 1 1 auto}.nn-switch__state{color: var(--color-text-muted);font-size: var(--fs-xs)}.nn-hintbox{margin: 0;padding: var(--sp-2) var(--sp-3);border-radius: var(--r-md);background: var(--state-hint-bg);color: var(--color-text);border: var(--outline-w) solid var(--color-outline);font-size: var(--fs-sm);font-weight: var(--fw-semibold);line-height: var(--lh-snug)}.nn-done{display: grid;gap: var(--sp-2);padding: var(--sp-4);border-radius: var(--r-lg);background: var(--color-surface);border: var(--outline-w) solid var(--color-outline);box-shadow: var(--shadow-pop)}.nn-done.is-won{background: var(--game-nonogram-soft)}.nn-done__title{margin: 0;font-size: var(--fs-xl);font-weight: var(--fw-heavy);letter-spacing: var(--ls-display);outline: none}.nn-done__detail{margin: 0;color: var(--color-text-muted);font-weight: var(--fw-semibold);font-variant-numeric: tabular-nums}.nn-dialog{max-width: min(92vw,400px);padding: var(--sp-5);border: var(--outline-w) solid var(--color-outline);border-radius: var(--r-lg);background: var(--color-surface);color: var(--color-text);box-shadow: var(--shadow-pop)}.nn-dialog::backdrop{background: var(--color-scrim)}.nn-dialog__text{margin: 0 0 var(--sp-4);font-weight: var(--fw-semibold)}.nn-dialog__row{display: flex;justify-content: flex-end;gap: var(--sp-2)}@media (min-width: 768px){.nn-root{min-height: calc(var(--board-max) + 240px)}.nn-tools{gap: var(--sp-2)}.nn-more__panel{position: absolute;left: auto;right: 0;bottom: calc(100% + var(--sp-2));width: 300px}}@media (min-width: 1024px){.nn-root{min-height: calc(var(--board-max) + 120px)}.nn-panel{grid-template-columns: minmax(0,1fr) var(--side-w);column-gap: var(--sp-6);grid-template-areas: "practice practice" "board status" "board side";grid-template-rows: auto auto 1fr}.nn-practice{grid-area: practice}.nn-levels{flex: 0 1 auto;width: min(100%,var(--board-max))}.nn-status{grid-area: status}.nn-viewport{grid-area: board;align-self: start;min-width: 0}.nn-side{grid-area: side}.nn-progress{justify-content: flex-start}.nn-tools{justify-content: flex-start;flex-wrap: wrap}.nn-more__panel{left: 0;right: auto;bottom: auto;top: calc(100% + var(--sp-2))}.nn-viewport[data-zoom="on"]{max-height: calc(100dvh - var(--header-h) - 160px)}}.pz-play[data-phase="result"] .nn-panel{grid-template-columns: minmax(0,1fr);grid-template-areas: "practice" "status" "board" "side"}@media print{.nn-tools,.nn-tabs,.nn-practice,.nn-status button,.nn-progress{display: none}}.pz-play:not([data-phase="result"]) .pz-root--nonogram{min-height: calc(min(100vw,560px) + 208px)}@media (min-width: 600px){.pz-play:not([data-phase="result"]) .pz-root--nonogram{min-height: 800px}}@media (min-width: 1024px){.pz-play:not([data-phase="result"]) .pz-root--nonogram{min-height: 680px}}