:where(.na) {
  --na-act: #a78bfa;
  --na-sel: #10b981;
  --na-icons: 52px;
  --na-panel: 288px;
  --na-chrome: calc(64px + var(--sa-t));
}

/*@3.NOAC.43*/
html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/*@3.NOAC.1*/
body[data-notes-app] { overscroll-behavior: none; padding-block-end: 0 !important; }
html.has-app-shell body[data-notes-app] { min-block-size: 0; }
body[data-notes-app] .app-shell-main { display: flex; flex-direction: column; min-inline-size: 0; }

/*@3.NOAC.2*/
body[data-notes-app] .app-sidebar,
body[data-notes-app] .dash-side { display: none; }
/*@3.NOAC.6*/
body[data-notes-app] .bottom-nav,
body[data-notes-app] .bnav,
body[data-notes-app] footer { display: none !important; }
/*@3.NOAC.80*/
body[data-notes-app] .app-shell { max-inline-size: none; }

/*@3.NOAC.16*/
html.na-full header[data-gh],
html.na-full .garden-header { display: none !important; }
html.na-full .na { --na-chrome: var(--sa-t); }
html.na-full .na-doc-body { padding-block-start: .5rem; }

.na {
  block-size: calc(100dvh - var(--na-chrome));
  display: grid;
  grid-template-columns: var(--na-icons) var(--na-panel) minmax(0, 1fr);
  align-items: stretch;
  overflow: hidden;
  background: var(--bg-surface);
}
.na[data-drop="1"] { position: relative; }
.na[data-panel="0"] { grid-template-columns: var(--na-icons) minmax(0, 1fr); }
.na[data-panel="0"] > .na-panel { display: none; }

.na-icons, .na-panel, .na-doc {
  min-inline-size: 0; min-block-size: 0;
  display: flex; flex-direction: column; overflow: hidden;
}
/*@3.NOAC.30*/
.na-icons, .na-panel {
  border-inline-end: 1px solid color-mix(in oklab, var(--border-color) 50%, transparent);
}

.na-icons {
  background: var(--bg-elevated);
  align-items: center; gap: .2rem; padding: .5rem .25rem;
}
.na-ic {
  inline-size: 2.35rem; block-size: 2.35rem; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 1px solid transparent; border-radius: var(--radius-md);
  color: var(--text-muted); font-size: .88rem; cursor: pointer;
}
.na-ic[hidden] { display: none; }
/*@3.NOAC.62*/
.na-ic[data-idle="1"] { visibility: hidden; pointer-events: none; }
.na-svgic { inline-size: 1.05em; block-size: 1.05em; fill: currentColor; display: block; }
/*@3.NOAC.58*/
.na-acc-r { display: flex; align-items: center; gap: .15rem; }
.na-acc-r > .na-acc-h { flex: 1 1 auto; min-inline-size: 0; }
.na-acc-r > .na-ic--pin {
  flex: 0 0 auto; margin-inline-end: .3rem;
  inline-size: 1.7rem; block-size: 1.7rem; font-size: .72rem;
}
/*@3.NOAC.59*/
#na[data-kind="pdf"] .na-doc-body {
  touch-action: pan-x pan-y;
  padding-block-end: 1rem;
}
.na-ic:hover { background: var(--bg-surface); color: var(--text-primary); }
.na-ic:focus-visible { outline: 2px solid var(--na-act); outline-offset: 1px; }
/*@3.NOAC.21*/
.na-ic--new {
  color: var(--na-act);
  border-color: color-mix(in oklab, var(--na-act) 45%, transparent);
  background: color-mix(in oklab, var(--na-act) 12%, transparent);
  margin-block-end: .35rem;
}
.na-ic--new:hover {
  color: var(--na-act);
  background: color-mix(in oklab, var(--na-act) 20%, transparent);
  border-color: color-mix(in oklab, var(--na-act) 60%, transparent);
}
.na-ic[aria-pressed="true"] {
  color: var(--na-sel);
  border-color: color-mix(in oklab, var(--na-sel) 45%, transparent);
  background: color-mix(in oklab, var(--na-sel) 12%, transparent);
}
.na-ic-sp { flex: 1 1 auto; }
/*@3.NOAC.67*/
.na-icons {
  display: grid;
  grid-template-rows: 1fr auto 1fr;
  justify-items: center;
}
.na-ic-grp {
  display: flex; flex-direction: column; align-items: center; gap: .2rem;
  inline-size: 100%;
}
.na-ic-top { align-self: start; }
.na-ic-mid { align-self: center; }
.na-ic-bot { align-self: end; }

/*@3.NOAC.40*/
.na-savedot {
  display: block; flex: 0 0 auto;
  inline-size: .5rem; block-size: .5rem; border-radius: 50%;
  margin-block: .15rem; margin-inline: auto; background: transparent;
}
.na-savedot[data-s="saving"] { background: #f59e0b; }
.na-savedot[data-s="saved"] { background: var(--na-sel); }
.na-savedot[data-s="error"] { background: #ef4444; }
.na-savedot[data-s="pend"] { background: #94a3b8; }
.na-ic--home { display: none; text-decoration: none; }
.na-pgslot { flex: 0 0 auto; display: flex; justify-content: center; inline-size: 100%; }
.na-pgslot:empty { display: none; }

.na-quota {
  flex: 0 0 auto; inline-size: 100%; padding: .35rem .2rem;
  font-size: .58rem; color: var(--text-muted); text-align: center;
  border-block-start: 1px solid var(--border-color);
}
.na-quota[hidden] { display: none; }
.na-quota-bar {
  block-size: 3px; border-radius: var(--radius-pill); margin-block-start: .25rem;
  background: color-mix(in oklab, var(--text-muted) 22%, transparent); overflow: hidden;
}
.na-quota-fill { block-size: 100%; background: var(--na-sel); inline-size: 0; }
.na-quota[data-warn="1"] .na-quota-fill { background: #f59e0b; }
.na-quota[data-warn="2"] .na-quota-fill { background: #ef4444; }
.na-quota[data-warn="2"] { color: #ef4444; }

.na-panel { background: var(--bg-elevated); }
/*@3.NOAC.25*/
.na-panel { position: relative; }
.na-panel-grip {
  position: absolute; inset-block: 0; inset-inline-end: -3px;
  inline-size: 7px; cursor: col-resize; z-index: 5; touch-action: none;
}
.na-panel-grip::before {
  content: ''; position: absolute; inset-block: 0; inset-inline-start: 3px;
  inline-size: 1px; background: transparent; transition: background .12s ease;
}
.na-panel-grip:hover::before,
.na-panel-grip:focus-visible::before,
.na-resizing .na-panel-grip::before { background: #a78bfa; }
.na-panel-grip:focus-visible { outline: 2px solid #a78bfa; outline-offset: -2px; }
.na-resizing, .na-resizing * { user-select: none; }
@media (max-width: 900px) { .na-panel-grip { display: none; } }

/*@3.NOAC.3*/
.na-acc {
  display: flex; flex-direction: column; min-block-size: 0;
  flex: 0 0 auto; border-block-end: 1px solid var(--border-color);
}
.na-acc[data-open="1"] { flex: 1 1 auto; }
.na-acc[data-open="0"] > .na-acc-b { display: none; }

.na-acc-h {
  inline-size: 100%; flex: 0 0 auto;
  display: flex; align-items: center; gap: .5rem;
  padding: .6rem .7rem; cursor: pointer;
  background: none; border: 0;
  font-family: 'Cairo', sans-serif; font-size: .85rem; font-weight: 700;
  color: var(--text-primary); text-align: start;
}
.na-acc-h:hover { background: var(--bg-surface); }
.na-acc-h:focus-visible { outline: 2px solid var(--na-act); outline-offset: -2px; }
.na-acc-c { font-size: .62rem; color: var(--text-muted); transition: transform .15s; }
.na-acc[data-open="0"] .na-acc-c { transform: rotate(-90deg); }
html[dir="rtl"] .na-acc[data-open="0"] .na-acc-c { transform: rotate(90deg); }

.na-acc-b { flex: 1 1 auto; min-block-size: 0; display: flex; flex-direction: column; overflow: hidden; }

.na-tree {
  flex: 1 1 auto; min-block-size: 0;
  overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable;
  padding: .2rem .4rem .8rem;
}

.na-list-body { gap: .45rem; padding-block-end: .3rem; }
.na-find { position: relative; display: flex; align-items: center; flex: 0 0 auto; margin-inline: .5rem; }
.na-find > i {
  position: absolute; inset-inline-start: .6rem;
  font-size: .75rem; color: var(--text-muted); pointer-events: none;
}
.na-find > input {
  inline-size: 100%; padding: .42rem 1.9rem; font-family: inherit; font-size: .8rem;
  color: var(--text-primary); background: var(--bg-surface);
  border: 1px solid var(--border-color); border-radius: var(--radius-lg);
}
.na-find > input:focus {
  outline: none; border-color: var(--na-act);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--na-act) 16%, transparent);
}
.na-items {
  flex: 1 1 auto; min-block-size: 0;
  overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable;
  padding: 0 .4rem 1.5rem;
}

.na-sweep {
  display: flex; align-items: center; gap: .5rem;
  margin: .4rem .1rem .5rem; padding: .5rem .6rem;
  border: 1px solid color-mix(in oklab, var(--st-warn, #f59e0b) 40%, transparent);
  background: color-mix(in oklab, var(--st-warn, #f59e0b) 12%, transparent);
  border-radius: var(--radius-md);
  font-size: .74rem; line-height: 1.5; color: var(--text-primary);
}
.na-sweep > i { color: var(--st-warn, #f59e0b); flex: 0 0 auto; }
.na-sweep > span { flex: 1 1 auto; min-inline-size: 0; }
.na-sweep-go {
  flex: 0 0 auto; cursor: pointer; font-family: inherit; font-size: .72rem; font-weight: 700;
  padding: .28rem .55rem; border-radius: var(--radius-sm);
  color: var(--text-primary); background: var(--bg-elevated);
  border: 1px solid var(--border-color);
}
.na-sweep-go:hover { border-color: var(--na-act); }
.na-sweep-x {
  flex: 0 0 auto; cursor: pointer; border: 0; background: none;
  color: var(--text-muted); padding: .2rem .25rem; font-size: .78rem;
}
.na-sweep-x:hover { color: var(--text-primary); }

.na-grp { margin-block-start: .3rem; }
.na-grp-h {
  inline-size: 100%; display: flex; align-items: center; gap: .4rem;
  padding: .34rem .5rem; cursor: pointer;
  background: none; border: 0; border-radius: var(--radius-md);
  font-family: inherit; font-size: .7rem; font-weight: 700;
  color: var(--text-muted); text-align: start;
}
.na-grp-h:hover { color: var(--text-secondary); background: color-mix(in oklab, var(--text-muted) 8%, transparent); }
.na-grp-h > .na-caret { font-size: .58rem; transition: transform .15s; }
.na-grp[data-open="0"] .na-caret { transform: rotate(-90deg); }
html[dir="rtl"] .na-grp[data-open="0"] .na-caret { transform: rotate(90deg); }
.na-grp[data-open="0"] .na-grp-b { display: none; }
.na-grp-h > .na-grp-add {
  margin-inline-start: auto; padding: .1rem .35rem; border-radius: var(--radius-sm);
  color: var(--text-muted);
}
.na-grp-h > .na-grp-add:hover { color: var(--na-act); }

.na-item {
  inline-size: 100%; display: flex; align-items: center; gap: .5rem;
  padding: .4rem .55rem; margin-block-end: 1px; cursor: pointer;
  background: none; border: 0; border-radius: var(--radius-md);
  font-family: inherit; font-size: .8rem; color: var(--text-secondary); text-align: start;
}
.na-item:hover { background: color-mix(in oklab, var(--text-muted) 10%, transparent); color: var(--text-primary); }
.na-item:focus-visible { outline: 2px solid var(--na-act); outline-offset: -2px; }
.na-item[aria-current="true"] {
  color: var(--text-primary); font-weight: 700;
  background: color-mix(in oklab, var(--na-sel) 14%, transparent);
  box-shadow: inset 2px 0 0 0 var(--na-sel);
}
html[dir="rtl"] .na-item[aria-current="true"] { box-shadow: inset -2px 0 0 0 var(--na-sel); }
.na-item > .na-ic2 {
  inline-size: 1.05rem; flex: 0 0 auto; text-align: center;
  font-size: .78rem; color: var(--text-muted);
}
.na-item[aria-current="true"] > .na-ic2 { color: var(--na-sel); }
.na-item > .na-lbl { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/*@3.NOAC.60*/
.na-item > .na-n, .na-acc-h > .na-n {
  flex: 0 0 auto; font-size: .66rem; color: var(--text-muted);
  font-variant-numeric: tabular-nums; unicode-bidi: isolate;
}
.na-dot { inline-size: .55rem; block-size: .55rem; border-radius: 50%; flex: 0 0 auto; background: var(--na-tone, var(--text-muted)); }
.na-view-name { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.na-row {
  inline-size: 100%; display: block; cursor: pointer; text-align: start;
  padding: .5rem .55rem; margin-block-end: 2px;
  background: none; border: 1px solid transparent; border-radius: var(--radius-lg);
  font-family: inherit; color: inherit;
}
.na-row:hover { background: var(--bg-surface); }
.na-row:focus-visible { outline: 2px solid var(--na-act); outline-offset: -2px; }
/*@3.NOAC.22*/
.na-row[data-picked="1"] {
  background: color-mix(in oklab, var(--na-sel) 12%, transparent);
  border-color: color-mix(in oklab, var(--na-sel) 50%, transparent);
}
.na-ctx {
  position: fixed; z-index: 340; min-inline-size: 12rem; padding: .3rem;
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: var(--radius-lg); box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.na-ctx-i {
  inline-size: 100%; display: flex; align-items: center; gap: .55rem;
  padding: .42rem .55rem; cursor: pointer; text-align: start;
  background: none; border: 0; border-radius: var(--radius-md);
  color: var(--text-primary); font-family: inherit; font-size: .82rem;
}
.na-ctx-i > i { inline-size: 1rem; text-align: center; color: var(--text-muted); font-size: .78rem; }
/*@3.NOAC.69*/
.na-ctx-i:disabled { opacity: .38; cursor: default; }
.na-ctx-i:disabled:hover { background: transparent; }
.na-ctx-i:hover { background: var(--bg-elevated); }
.na-ctx-i:focus-visible { outline: 2px solid var(--na-act); outline-offset: -2px; }
.na-ctx-i--danger { color: var(--st-err, #ef4444); }
/*@3.NOAC.68*/
.na-ctx-sep {
  block-size: 1px; margin-block: .22rem;
  background: var(--border-color);
}
.na-ctx-i--danger > i { color: inherit; }
.na-row[aria-current="true"] {
  background: color-mix(in oklab, var(--na-sel) 10%, transparent);
  border-color: color-mix(in oklab, var(--na-sel) 40%, transparent);
}
.na-row-t { display: flex; align-items: center; gap: .4rem; }
.na-row-title {
  flex: 1 1 auto; min-inline-size: 0; font-size: .83rem; font-weight: 600;
  color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.na-row-badge { flex: 0 0 auto; font-size: .68rem; color: var(--text-muted); }
.na-row-badge.on { color: var(--na-act); }
.na-row-x { font-size: .74rem; color: var(--text-muted); margin-block-start: .12rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.na-row-m { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-block-start: .28rem; font-size: .66rem; color: var(--text-muted); }
.na-org {
  display: inline-flex; align-items: center; gap: .25rem;
  max-inline-size: 60%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: .08rem .35rem; border-radius: var(--radius-pill); border: 1px solid var(--border-color);
}
.na-when { unicode-bidi: isolate; direction: ltr; margin-inline-start: auto; }

.na-doc { background: var(--bg-surface); }
/*@3.NOAC.20*/
.na-doc-top, .nr { background: var(--bg-elevated); }
.na-doc-top {
  flex: 0 0 auto; display: flex; align-items: center; gap: .45rem;
  padding: .5rem .8rem .4rem;
  border-block-end: 0;
}
.na-doc-top:has(+ .nr[hidden]) { border-block-end: 1px solid var(--border-color); }
.na-doc-title {
  flex: 1 1 auto; min-inline-size: 0; padding: .3rem .5rem;
  font-family: 'Cairo', sans-serif; font-weight: 700; font-size: 1.12rem;
  letter-spacing: -.01em; color: var(--text-primary);
  background: none; border: 1px solid transparent; border-radius: var(--radius-md);
}
.na-doc-title:hover { border-color: var(--border-color); }
.na-doc-title:focus {
  outline: none; background: var(--bg-elevated);
  border-color: color-mix(in oklab, var(--na-act) 45%, transparent);
}
.na-icb {
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 2rem; block-size: 2rem; flex: 0 0 auto; cursor: pointer;
  background: none; border: 1px solid transparent; border-radius: var(--radius-md);
  color: var(--text-muted); font-size: .85rem;
}
.na-icb:hover { background: var(--bg-elevated); color: var(--text-primary); border-color: var(--border-color); }
.na-icb:focus-visible { outline: 2px solid var(--na-act); outline-offset: 1px; }
.na-icb:disabled { opacity: .35; cursor: default; }
/*@3.NOAC.71*/
.na-icb[hidden] { display: none; }
.na-icb[aria-pressed="true"] {
  color: var(--na-sel);
  border-color: color-mix(in oklab, var(--na-sel) 45%, transparent);
  background: color-mix(in oklab, var(--na-sel) 12%, transparent);
}
/*@3.NOAC.49*/
.na-save {
  position: absolute; inline-size: 1px; block-size: 1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

/*@3.NOAC.45*/
.na-loadfail {
  margin: 3rem auto; max-inline-size: 30rem; text-align: center;
  color: var(--text-muted); display: flex; flex-direction: column;
  gap: 1rem; align-items: center; padding-inline: 1rem;
}
.na-loadfail-retry {
  font-family: inherit; font-size: .85rem; cursor: pointer;
  padding: .45rem 1.2rem; border-radius: var(--radius-md);
  border: 1px solid var(--border-color); background: var(--bg-elevated);
  color: var(--text-primary);
}
.na-loadfail-retry:hover { border-color: var(--na-act); color: var(--na-act); }

/*@3.NOAC.48*/
.na-opening {
  margin: 4rem auto; text-align: center; color: var(--text-muted);
  display: flex; flex-direction: column; gap: .9rem; align-items: center;
  font-size: .85rem;
}
.na-opening-spin {
  inline-size: 2rem; block-size: 2rem; border-radius: 50%;
  border: 3px solid color-mix(in oklab, var(--text-muted) 25%, transparent);
  border-block-start-color: var(--na-act, #7c3aed);
  animation: na-opening-spin .8s linear infinite;
}
@keyframes na-opening-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .na-opening-spin { animation: none; }
}

.na-doc-origin {
  flex: 0 0 auto; padding: .5rem .9rem; font-size: .74rem; color: var(--text-muted);
  border-block-end: 1px solid var(--border-color);
  display: flex; align-items: center; gap: .45rem;
}
.na-doc-origin a { color: var(--na-act); text-decoration: none; }
.na-doc-origin a:hover { text-decoration: underline; }
.na-doc-origin[hidden] { display: none; }

.na-doc-body {
  flex: 1 1 auto; min-block-size: 0; position: relative;
  overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable;
  /*@3.NOAC.46*/
  overflow-anchor: none;
  padding: 1.1rem 1rem 6rem;
  background: var(--na-desk);
  /*@3.NOAC.66*/
  scrollbar-width: auto;
  scrollbar-color: color-mix(in oklab, var(--text-primary) 42%, transparent)
                   color-mix(in oklab, var(--text-primary) 9%, transparent);
}
.na-doc-body::-webkit-scrollbar { inline-size: 12px; block-size: 12px; }
.na-doc-body::-webkit-scrollbar-track {
  background: color-mix(in oklab, var(--text-primary) 9%, transparent);
  border-radius: 999px;
}
.na-doc-body::-webkit-scrollbar-thumb {
  background: color-mix(in oklab, var(--text-primary) 42%, transparent);
  border-radius: 999px;
  border: 3px solid transparent;
  background-clip: padding-box;
  min-block-size: 42px;
}
.na-doc-body::-webkit-scrollbar-thumb:hover,
.na-doc-body::-webkit-scrollbar-thumb:active {
  background: color-mix(in oklab, var(--text-primary) 66%, transparent);
  background-clip: padding-box;
}
.na-doc-body::-webkit-scrollbar-corner { background: transparent; }
/*@3.NOAC.4*/
/*@3.NOAC.79*/
@property --na-pages { syntax: '<integer>'; inherits: false; initial-value: 1; }
@property --na-ruleoff { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --na-bgo { syntax: '<number>'; inherits: false; initial-value: 0.1; }
@property --na-bgg { syntax: '<length>'; inherits: false; initial-value: 22px; }
/*@3.NOAC.7*/
/*@3.NOAC.9*/
/*@3.NOAC.11*/
.na {
  --na-a4: 794px;
  --na-a4h: 1123px;
  --na-pages: 1;
  --na-pw: var(--na-a4);
  --na-sheeth: var(--na-a4h);
  --na-desk: color-mix(in oklab, var(--bg-surface) 93%, #000);
}
/*@3.NOAC.47*/
.na-zoom { position: relative; margin-inline: auto; }
.na-tf {
  position: absolute;
  top: 0;
  left: 0;
  inline-size: var(--na-pw);
  transform: scale(var(--na-z, 1));
  transform-origin: 0 0;
}
.na-page { margin-inline: auto; position: relative; inline-size: var(--na-pw); }

.na-sheet {
  /*@3.NOAC.24*/
  font-family: 'Thmanyah Sans', 'Cairo', sans-serif;
  font-size: calc(16px * var(--na-fs, 1));
  position: relative;
  display: flex; flex-direction: column;
  /*@3.NOAC.78*/
  min-block-size: calc(var(--na-sheeth) * var(--na-pages));
}
/*@3.NOAC.18*/
.na-sheet > .ne-root { flex: 1 1 auto; min-block-size: 0; }
/*@3.NOAC.12*/
.na-sheet::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(to bottom,
    transparent 0 calc(var(--na-sheeth) - 1px),
    color-mix(in oklab, var(--text-muted) 16%, transparent)
      calc(var(--na-sheeth) - 1px) var(--na-sheeth));
  /*@3.NOAC.35*/
  -webkit-mask-image: repeating-linear-gradient(to right, #000 0 6px, transparent 6px 12px);
  mask-image: repeating-linear-gradient(to right, #000 0 6px, transparent 6px 12px);
}
.na-page[data-pages="1"] .na-sheet::before { background-image: none; }
/*@3.NOAC.81*/
.na-page[data-cuts="1"] .na-sheet::before { background-image: none; }
.na-cuts { position: absolute; inset: 0; pointer-events: none; }
/*@3.NOAC.86*/
.na-page[data-lines="0"] .na-sheet::before { background-image: none; }
.na-page[data-lines="0"] .na-cut:not(.na-cut--pb) { display: none; }
.na-pgv { margin-block-end: .55rem; }
.na-pgv-art {
  position: relative; display: block; inline-size: 2.6rem; block-size: 3.3rem;
  border: 1px solid var(--border-color); border-radius: 4px; padding: 6px 7px;
  background: repeating-linear-gradient(to bottom, transparent 0 6px,
    color-mix(in oklab, var(--text-muted) 22%, transparent) 6px 7px) content-box, var(--bg-surface);
  transition: border-color .18s ease;
}
.na-pgv-art--lines::after {
  content: ''; position: absolute; inset-inline: -1px; inset-block-start: 50%; block-size: 1px;
  background: repeating-linear-gradient(to right, color-mix(in oklab, var(--text-muted) 70%, transparent) 0 3px, transparent 3px 6px);
}
.na-pgv-art--fix { block-size: 1.45rem; margin-block-end: 1.85rem; border-radius: 4px 4px 2px 2px; }
.na-pgv-art--fix::after {
  content: ''; position: absolute; inset-inline: -1px; inset-block-start: calc(100% + .38rem); block-size: 1.45rem;
  border: 1px solid var(--border-color); border-radius: 2px 2px 4px 4px; background: inherit;
  padding: 6px 7px; box-sizing: border-box;
}
.gsf-opt[aria-pressed="true"] .na-pgv-art,
.gsf-opt[aria-pressed="true"] .na-pgv-art--fix::after { border-color: color-mix(in oklab, var(--st-ok) 60%, var(--border-color)); }
.na-pgv-hint { min-block-size: 3.2em; }
.na-cut {
  position: absolute; inset-inline: 0; block-size: 1px;
  background: color-mix(in oklab, var(--text-muted) 16%, transparent);
  -webkit-mask-image: repeating-linear-gradient(to right, #000 0 6px, transparent 6px 12px);
  mask-image: repeating-linear-gradient(to right, #000 0 6px, transparent 6px 12px);
}
/*@3.NOAC.82*/
.na-cut--pb {
  -webkit-mask-image: none; mask-image: none;
  background: repeating-linear-gradient(to right,
    color-mix(in oklab, var(--text-muted) 34%, transparent) 0 6px, transparent 6px 12px);
}
/*@3.NOAC.83*/
.na-pgmask { position: absolute; inset-inline: 0; z-index: 5; pointer-events: none; background-color: var(--bg-surface); }
.na-page[data-pv="1"] .na-cut { z-index: 6; }
.na-page[data-tinted="1"] .na-pgmask { background-color: var(--na-paper); }
.na-page[data-bgp="dot"] .na-pgmask {
  background-image: radial-gradient(circle at 1px 1px,
    color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 100%), transparent) 1px, transparent 0);
  background-size: var(--na-bgg) var(--na-bgg);
  background-position: 0 calc(-1 * var(--y, 0px));
}
.na-page[data-bgp="grid"] .na-pgmask {
  background-image:
    repeating-linear-gradient(to right,
      color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 60%), transparent) 0 1px,
      transparent 1px var(--na-bgg)),
    repeating-linear-gradient(to bottom,
      color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 60%), transparent) 0 1px,
      transparent 1px var(--na-bgg));
  background-position: 0 calc(-1 * var(--y, 0px));
}
.na-page[data-bgp="line"] .na-pgmask {
  --na-rule: calc(var(--na-bgg) + 6px);
  background-image: repeating-linear-gradient(to bottom,
    transparent 0 calc(var(--na-rule) - 1px),
    color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 64%), transparent)
      calc(var(--na-rule) - 1px) var(--na-rule));
  background-position-y: calc(var(--na-ruleoff, 0px) - var(--y, 0px));
}
.na-cut-l {
  position: absolute; inset-inline: 0; inset-block-start: 0;
  inline-size: max-content; margin-inline: auto; transform: translateY(-50%);
  font-size: .64rem; line-height: 1.1rem; padding: 0 .5rem; border-radius: var(--radius-pill);
  color: var(--text-muted); background: var(--bg-surface);
  border: 1px dashed color-mix(in oklab, var(--text-muted) 45%, transparent);
  white-space: nowrap; opacity: .8;
}
/*@3.NOAC.75*/
/*@3.NOAC.77*//*@3.NOAC.76*/

.na-doc { position: relative; }
.na-pgnav[hidden] { display: none; }
/*@3.NOAC.41*/
.na-pgslot > .na-pgnav {
  position: static; inset: auto; z-index: auto;
  inline-size: 100%; padding: .2rem .1rem;
  background: transparent; border: 0; box-shadow: none; backdrop-filter: none;
}
.na-pgslot > .na-pgnav .na-pgnav-b,
.na-pgslot > .na-pgnav .na-pgnav-cur { min-inline-size: 2rem; }
.na-pgslot > .na-pgnav .na-pgnav-cur { font-size: .62rem; line-height: 1.15; }
.na-pgnav[data-ask="1"] .na-pgnav-ask { display: block; }
.na-pgslot > .na-pgnav .na-pgnav-ask input { inline-size: 2.3rem; font-size: .7rem; }

.na-pgnav {
  position: absolute; inset-block-end: .9rem; inset-inline-start: .9rem; z-index: 24;
  display: flex; flex-direction: column; align-items: center; gap: .15rem;
  padding: .25rem; border-radius: 999px;
  background: color-mix(in oklab, var(--bg-elevated) 88%, transparent);
  border: 1px solid var(--border-color);
  box-shadow: 0 6px 18px -10px rgba(0, 0, 0, .4);
  backdrop-filter: blur(6px);
}
.na-pgnav-b, .na-pgnav-cur {
  border: 0; background: transparent; color: var(--text-secondary);
  min-inline-size: 34px; min-block-size: 30px; border-radius: 999px;
  display: grid; place-items: center; cursor: pointer; font-size: .78rem;
}
.na-pgnav-cur {
  font-variant-numeric: tabular-nums; font-weight: 700; color: var(--text-primary);
  /*@3.NOAC.64*/
  direction: ltr; unicode-bidi: isolate;
}
/*@3.NOAC.63*/
.na-pgnav-b[data-go="first"], .na-pgnav-b[data-go="last"] { position: relative; }
.na-pgnav-b[data-go="first"]::after, .na-pgnav-b[data-go="last"]::after {
  content: ''; position: absolute; inset-inline: 28%;
  block-size: 2px; border-radius: 1px; background: currentColor;
}
.na-pgnav-b[data-go="first"]::after { inset-block-start: 18%; }
.na-pgnav-b[data-go="last"]::after { inset-block-end: 18%; }
.na-pgnav-b[data-go="first"] > i { transform: translateY(2px); }
.na-pgnav-b[data-go="last"] > i { transform: translateY(-2px); }
.na-pgnav-b:hover, .na-pgnav-cur:hover { background: color-mix(in oklab, var(--text-muted) 14%, transparent); }
.na-pgnav-ask input {
  inline-size: 3.4rem; text-align: center; font-size: .8rem;
  border: 1px solid var(--border-color); border-radius: var(--radius-sm);
  background: var(--bg-surface); color: var(--text-primary); padding: .2rem .1rem;
}
@media (max-width: 640px) {
  .na-pgnav { inset-block-end: 4.6rem; }
}

.na-pgbar { display: flex; align-items: stretch; gap: .4rem; margin-block-start: .5rem; }
.na-addpg, .na-delpg {
  display: flex; align-items: center; justify-content: center; gap: .4rem;
  padding-block: .5rem;
  border: 1px dashed var(--border-color); border-radius: var(--radius-md);
  background: transparent; color: var(--text-muted);
  font: inherit; font-size: .74rem; cursor: pointer;
}
.na-addpg { flex: 1 1 auto; }
.na-delpg { flex: 0 0 auto; padding-inline: .9rem; }
.na-addpg:hover, .na-delpg:hover:not(:disabled) {
  color: var(--text-primary); border-color: var(--text-muted);
}
.na-delpg:hover:not(:disabled) { color: #ef4444; border-color: #ef4444; }
.na-delpg:disabled { opacity: .38; cursor: not-allowed; }
.na-addpg:focus-visible, .na-delpg:focus-visible {
  outline: 2px solid var(--na-act); outline-offset: 1px;
}

.na-cover {
  /*@3.NOAC.44*/
  block-size: 170px; border-radius: var(--radius-lg);
  margin-block-end: 1rem; background-size: cover; background-position: 50% 50%;
  background-color: var(--bg-surface); border: 1px solid var(--border-color);
}
.na-cover[hidden] { display: none; }

/*@3.NOAC.5*/
/*@3.NOAC.13*/
.na-page { --na-bgo: .55; --na-bgg: 22px; }
/*@3.NOAC.34*/
.na-sheet {
  background-color: var(--bg-surface);
  border: 1px solid color-mix(in oklab, var(--border-color) 82%, transparent);
  border-radius: var(--radius-lg);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .07), 0 10px 28px -18px rgba(0, 0, 0, .5);
}
.na-page[data-tinted="1"] .na-sheet { background-color: var(--na-paper); }
.na-page[data-tinted="1"] .na-sheet,
.na-page:not([data-bgp="none"]) .na-sheet {
  border-radius: var(--radius-lg); padding: 1rem;
}
.na-page[data-bgp="dot"] .na-sheet {
  background-image: radial-gradient(circle at 1px 1px,
    color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 100%), transparent) 1px, transparent 0);
  background-size: var(--na-bgg) var(--na-bgg);
}
.na-page[data-bgp="grid"] .na-sheet {
  background-image:
    repeating-linear-gradient(to right,
      color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 60%), transparent) 0 1px,
      transparent 1px var(--na-bgg)),
    repeating-linear-gradient(to bottom,
      color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 60%), transparent) 0 1px,
      transparent 1px var(--na-bgg));
}
/*@3.NOAC.17*/
.na-page[data-bgp="line"] .na-sheet {
  --na-rule: calc(var(--na-bgg) + 6px);
  background-image: repeating-linear-gradient(to bottom,
    transparent 0 calc(var(--na-rule) - 1px),
    color-mix(in oklab, var(--text-muted) calc(var(--na-bgo) * 64%), transparent)
      calc(var(--na-rule) - 1px) var(--na-rule));
  background-position-y: var(--na-ruleoff, 0px);
}
.na-page[data-bgp="line"] .ne-text,
.na-page[data-bgp="line"] .ne-li {
  line-height: var(--na-rule);
}

.na-page[data-paper] { color: var(--text-primary); }
.na-page[data-paper="dark"] {
  --text-primary: #ebe8e3;
  --text-secondary: #bcb7ae;
  --text-muted: #8c877e;
}
.na-page[data-paper="light"] {
  --text-primary: #1e2227;
  --text-secondary: #454d57;
  --text-muted: #6d7681;
}
/*@3.NOAC.14*/
.na-page[data-tinted="1"] {
  --bg-surface: color-mix(in oklab, var(--na-paper) 93%, var(--text-primary));
  --bg-elevated: color-mix(in oklab, var(--na-paper) 87%, var(--text-primary));
  --bg-card: color-mix(in oklab, var(--na-paper) 96%, var(--text-primary));
  --border-color: color-mix(in oklab, var(--na-paper) 78%, var(--text-primary));
}

/*@3.NOAC.15*/
.na-pg-tone--pick {
  display: flex; align-items: center; justify-content: center;
  font-size: .62rem; color: var(--text-muted);
}
.na-pg-tone--pick[aria-pressed="true"] { color: var(--text-primary); }


.na-link-warn {
  margin: .55rem 0 0; font-size: .78rem; line-height: 1.6;
  color: var(--text-primary);
  border-inline-start: 3px solid #ef4444;
  background: color-mix(in oklab, #ef4444 12%, transparent);
  padding: .4rem .6rem; border-radius: var(--radius-md);
}
.na-cover-prev {
  position: relative; margin-block-end: .7rem;
  border-radius: var(--radius-lg); overflow: hidden;
  border: 1px solid var(--border-color);
}
.na-cover-prev[hidden] { display: none; }
.na-cover-img {
  block-size: 120px; background-size: cover; background-position: 50% 50%;
  cursor: grab; touch-action: none;
}
.na-cover-img:active { cursor: grabbing; }
.na-cover-tools {
  display: flex; align-items: center; gap: .5rem;
  padding: .35rem .5rem; background: var(--bg-elevated);
}
.na-cover-tip { font-size: .7rem; color: var(--text-muted); flex: 0 0 auto; }
.na-cover-tools > input[type="range"] { flex: 1 1 auto; min-inline-size: 0; }
/*@3.NOAC.29*/
.na-pg-tone {
  inline-size: 26px; block-size: 26px; border-radius: 50%; cursor: pointer;
  border: 2px solid var(--border-color);
  background: linear-gradient(135deg,
    var(--t, transparent) 0 52%, var(--tp, var(--t, transparent)) 52% 100%);
}
.na-pg-tone--off {
  background: var(--bg-elevated);
  background-image: linear-gradient(45deg, transparent 45%,
    var(--text-muted) 45% 55%, transparent 55%);
}
.na-pg-tone[aria-pressed="true"] { border-color: var(--success-color, #10b981); }
.na-pg-h { margin-block-end: .7rem; }
.na-pg-h > i { inline-size: 1.5rem; block-size: 1.5rem; font-size: .72rem; }
.na-pg-hint { font-size: .72rem; color: var(--text-muted); margin: .55rem 0 0; line-height: 1.6; }
/*@3.NOAC.85*/
.na-exp-prog {
  display: block; inline-size: 100%; block-size: 4px; margin-block-start: .6rem;
  border: 0; border-radius: var(--radius-pill); overflow: hidden;
  -webkit-appearance: none; appearance: none;
  background: color-mix(in oklab, var(--text-muted) 16%, transparent);
}
.na-exp-prog[hidden] { display: none; }
.na-exp-prog::-webkit-progress-bar { background: transparent; }
.na-exp-prog::-webkit-progress-value { background: var(--st-accent, #7c3aed); border-radius: var(--radius-pill); transition: inline-size .25s ease; }
.na-exp-prog::-moz-progress-bar { background: var(--st-accent, #7c3aed); border-radius: var(--radius-pill); }
@media (prefers-reduced-motion: reduce) { .na-exp-prog::-webkit-progress-value { transition: none; } }
.na-pg-grid {
  display: grid; gap: .7rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}
.na-pg-grid > .na-pg-card { margin: 0; padding: .85rem .95rem; min-inline-size: 0; }
.na-pg-grid > .na-pg-card:hover { transform: none; box-shadow: none; }
.na-pg-card--wide { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .na-pg-grid { grid-template-columns: minmax(0, 1fr); }
}
.na-pg-line { display: grid; grid-template-columns: 5.6rem minmax(0, 1fr); align-items: center; gap: .5rem; }
.na-pg-line + .na-pg-line { margin-block-start: .55rem; }
.na-pg-k { font-size: .74rem; font-weight: 700; color: var(--text-secondary); }
.na-pg-line > .gsf-chips { margin: 0; gap: .3rem; }
.na-pg-line > .gsf-chips > .gsf-chip { padding-block: .28rem; font-size: .76rem; }
.na-pg-sls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; margin-block-start: .7rem; }
.na-pg-sl {
  display: grid; grid-template-columns: 1fr auto; align-items: center;
  gap: .15rem .4rem; font-size: .72rem; color: var(--text-secondary);
}
.na-pg-sl input[type="range"] { grid-column: 1 / -1; inline-size: 100%; margin: 0; accent-color: var(--na-act); }
.na-pg-sl output { font-size: .68rem; color: var(--text-muted); unicode-bidi: isolate; direction: ltr; }
.na-pg-arts-all { display: flex; flex-wrap: wrap; gap: .3rem .55rem; margin-block-end: .6rem; }
.na-pg-arts { display: flex; flex-wrap: wrap; gap: .3rem; }
.na-pg-art {
  inline-size: 30px; block-size: 22px; padding: 0; border-radius: 6px; cursor: pointer;
  border: 2px solid var(--border-color); background-size: cover;
}
.na-pg-art[aria-pressed="true"] { border-color: var(--success-color, #10b981); }
.na-cover-url { inline-size: 100%; font-size: .78rem; padding-block: .4rem; }
.na-pg-card .na-pg-row { margin-block-start: .5rem; }
.na-pg-card .na-pg-row > .gsf-btn { padding-block: .4rem; font-size: .8rem; }
.na-pg-tones { display: flex; flex-wrap: wrap; gap: .3rem; }
.na-fmt-cta {
  display: flex; align-items: center; gap: .8rem;
  padding: .65rem .75rem; margin-block-end: .75rem;
  border: 1px solid color-mix(in oklab, var(--gsf-tint, #a78bfa) 30%, var(--border-color));
  border-radius: var(--radius-lg);
  background: color-mix(in oklab, var(--gsf-tint, #a78bfa) 7%, transparent);
}
.na-fmt-txt { flex: 1 1 auto; min-inline-size: 0; margin: 0; }
.na-fmt-txt > b { display: block; font-size: .86rem; color: var(--text-primary); }
.na-fmt-txt > small { display: block; margin-block-start: .15rem; font-size: .72rem; line-height: 1.55; color: var(--text-muted); }
.na-fmt-cta > .gsf-btn { flex: none; }
.na-fmt-host { margin-block-end: .75rem; padding: .7rem .75rem; border: 1px solid var(--border-color); border-radius: var(--radius-lg); background: var(--bg-elevated); }
.na-fmt-host > .na-imp-pv { margin: 0; }
@media (max-width: 640px) {
  .na-fmt-cta { flex-wrap: wrap; }
  .na-fmt-cta > .gsf-btn { inline-size: 100%; }
  .na-pg-line { grid-template-columns: minmax(0, 1fr); gap: .3rem; }
}
.na-pg-card .na-pg-tone { inline-size: 22px; block-size: 22px; }

.na-empty {
  flex: 1 1 auto; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .5rem;
  padding: 2rem 1.5rem; text-align: center; color: var(--text-muted);
}
.na-empty > i { font-size: 1.8rem; opacity: .45; }
.na-empty > p { margin: 0; font-size: .86rem; }
.na-empty > .na-empty-hint { font-size: .76rem; opacity: .8; }

@media (max-width: 900px) {
  .na { grid-template-columns: var(--na-icons) minmax(0, 1fr); }
  .na > .na-panel {
    position: fixed; inset-block: var(--na-chrome) 0;
    padding-block-end: var(--sa-b);
    inset-inline-start: var(--na-icons);
    inline-size: min(80vw, 300px); z-index: 90;
    transform: translateX(-110%); transition: transform .18s ease;
    box-shadow: 8px 0 28px -14px rgba(0,0,0,.6);
  }
  html[dir="rtl"] .na > .na-panel {
    inset-inline-start: auto; inset-inline-end: var(--na-icons);
    transform: translateX(110%);
    box-shadow: -8px 0 28px -14px rgba(0,0,0,.6);
  }
  .na[data-panel="1"] > .na-panel { display: flex; transform: none; }
  html[dir="rtl"] .na[data-panel="1"] > .na-panel { transform: none; }
  .na[data-panel="1"] { grid-template-columns: var(--na-icons) minmax(0, 1fr); }
  .na-scrim {
    position: fixed; inset-block: var(--na-chrome) 0; inset-inline: 0;
    background: rgba(0,0,0,.45); z-index: 89;
    opacity: 0; pointer-events: none; transition: opacity .18s;
  }
  .na[data-panel="1"] ~ .na-scrim { opacity: 1; pointer-events: auto; }
}

@media (min-width: 901px) {
  .na-back, .na-scrim { display: none; }
}

.na-more { display: none; }

.na-ic--bars { display: none; }

@media (max-width: 768px) {
  .na { --na-chrome: calc(120px + var(--sa-t)); --na-icons: 46px; }
  .na-doc-body { padding-inline: .7rem; }

  /*@3.NOAC.36*/
  html[dir] .na[data-mob="list"] { grid-template-columns: var(--na-icons) minmax(0, 1fr); }
  html[dir] .na[data-mob="list"] > .na-panel {
    position: static; inset: auto; transform: none; transition: none;
    inline-size: auto; box-shadow: none; z-index: auto; display: flex;
  }
  html[dir] .na[data-mob="list"] > .na-doc { display: none; }
  .na[data-mob="list"] ~ .na-scrim { display: none; }
  .na[data-mob="list"] .na-row { padding-block: .62rem; }
  .na[data-mob="list"] .na-acc-h { padding-block: .75rem; }

  /*@3.NOAC.37*/
  .na-ic--home { display: inline-flex; }
  /*@3.NOAC.38*/
  #na-pin-panel { display: inline-flex; }
  /*@3.NOAC.61*/
  .na[data-kind="pdf"] #na-zoom-out,
  .na[data-kind="pdf"] #na-zoom-in,
  .na[data-kind="pdf"] #na-zoom-lbl { display: none; }
  .na[data-kind="pdf"] ~ .na-quota,
  .na[data-kind="pdf"] .na-quota { display: none; }
  /*@3.NOAC.39*/
  .na[data-kind="board"] #na-ribbon { display: none; }

  .na[data-bars="1"] .na-doc-top { display: none; }
  .na-ic--bars { display: inline-flex; }
  /*@3.NOAC.10*/
  #na-pin, #na-cloud, #na-export, #na-move-btn, #na-del { display: none; }
  .na-doc-top > [data-fold="1"] { display: none; }
  .na-more { display: inline-flex; }
  .na-doc-title { min-inline-size: 5.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .na > .na-panel, .na-scrim, .na-acc-c, .na-caret { transition: none; }
}

.na-dlg--wide { max-inline-size: min(52rem, 94vw); }
.na-ml-tabs { margin-block-end: .7rem; }
.na-ml-grid {
  display: grid; gap: .5rem;
  grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
}
.na-ml-grid[hidden] { display: none; }
.na-ml-i {
  display: flex; flex-direction: column; gap: .3rem; text-align: start;
  padding: .6rem .7rem; cursor: pointer; font-family: inherit;
  background: var(--bg-elevated); border: 1px solid var(--border-color);
  border-radius: var(--radius-lg); color: var(--text-primary);
  transition: border-color .12s ease, background .12s ease;
}
.na-ml-i:hover { border-color: var(--na-act); background: var(--bg-card); }
.na-ml-n { font-size: .78rem; font-weight: 600; }
.na-ml-p {
  font-size: .82rem; color: var(--text-secondary); direction: ltr;
  unicode-bidi: isolate; overflow-x: auto; overflow-y: hidden; min-block-size: 1.4em;
}

.na-f { display: block; }
.na-f-row { display: flex; align-items: center; gap: 2px; }
.na-f-row > .na-f-b { flex: 1 1 auto; min-inline-size: 0; }
.na-f-row > .na-f-b .na-lbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.na-f-tw {
  flex: 0 0 auto; inline-size: 18px; block-size: 18px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: 0; cursor: pointer; color: var(--text-muted);
  margin-inline-start: calc(var(--d, 0) * .75rem);
  transition: transform .14s ease;
}
.na-f-tw--none { cursor: default; }
.na-f[data-open="0"] > .na-f-row > .na-f-tw { transform: rotate(-90deg); }
html[dir="rtl"] .na-f[data-open="0"] > .na-f-row > .na-f-tw { transform: rotate(90deg); }
.na-f-m {
  flex: 0 0 auto; inline-size: 22px; block-size: 22px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: 0; cursor: pointer; color: var(--text-muted);
  border-radius: var(--radius-sm); opacity: 0; font-size: .78rem;
}
.na-f-row:hover .na-f-m, .na-f-m:focus-visible { opacity: 1; }
.na-f-m:hover { color: var(--text-primary); background: var(--bg-elevated); }
@media (pointer: coarse) { .na-f-m { opacity: 1; inline-size: 30px; block-size: 30px; } }

.na-f-par { display: flex; align-items: center; gap: .5rem; margin-block-start: .6rem; font-size: .8rem; }
.na-f-par > span { flex: 0 0 auto; color: var(--text-secondary); }
.na-f-par select, .na-f-par .gs-wrap { flex: 1 1 auto; min-inline-size: 0; }

.na-f-row.drop-in > .na-f-b {
  outline: 2px solid var(--success-color, #10b981); outline-offset: -2px;
  border-radius: var(--radius-md);
}

.na-row { touch-action: pan-y; }
.na-row--drag { opacity: .45; }

/*@3.NOAC.42*/
.na-row[data-sw] { transition: none; will-change: transform; }
.na-row[data-sw="r"] { background: color-mix(in oklab, var(--na-sel) 10%, transparent); }
.na-row[data-sw="l"] { background: color-mix(in oklab, #f59e0b 10%, transparent); }
.na-row[data-sw="r"][data-swgo="1"] { background: color-mix(in oklab, var(--na-sel) 22%, transparent); }
.na-row[data-sw="l"][data-swgo="1"] { background: color-mix(in oklab, #f59e0b 22%, transparent); }
.na-undo {
  position: fixed; z-index: 1200;
  inset-block-end: calc(1rem + var(--sa-b));
  inset-inline: 50% auto; transform: translateX(50%);
  display: flex; align-items: center; gap: .7rem;
  padding: .5rem .75rem; border-radius: var(--radius-pill);
  background: var(--bg-card); border: 1px solid var(--border-color);
  box-shadow: 0 10px 28px -12px rgba(0, 0, 0, .55);
  font-size: .8rem; color: var(--text-primary); max-inline-size: 92vw;
}
html[dir="ltr"] .na-undo { transform: translateX(-50%); }
.na-undo > button {
  border: 0; background: transparent; cursor: pointer;
  color: var(--na-act); font-family: inherit; font-size: .8rem; font-weight: 700;
}

.na-exp-fmts { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: .45rem; margin-block-start: .8rem; }
/*@3.NOAC.50*/
.na-exp-tabs { margin-block-end: .4rem; }
.na-exp-pane[hidden] { display: none; }
.na-exp-f {
  display: flex; align-items: center; gap: .5rem; padding: .6rem .7rem;
  cursor: pointer; font-family: inherit; font-size: .82rem; text-align: start;
  background: var(--bg-elevated); border: 1px solid var(--border-color);
  border-radius: var(--radius-lg); color: var(--text-primary);
  transition: border-color .12s ease, background .12s ease;
}
.na-exp-f:hover:not(:disabled) { border-color: var(--na-act); background: var(--bg-card); }
.na-exp-f:disabled { opacity: .4; cursor: not-allowed; }
.na-exp-f i { inline-size: 1rem; text-align: center; color: var(--text-muted); }

/*@3.NOAC.84*/
.na-exp-pane[data-imp-step] > :not(.na-imp-pv) { display: none; }
.na-imp-pv { display: flex; flex-direction: column; gap: .65rem; margin-block-start: .7rem; }
.na-imp-src { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin: 0; font-size: .78rem; color: var(--text-secondary); }
.na-imp-badge {
  display: inline-flex; align-items: center; gap: .4rem; padding: .2rem .6rem; border-radius: 999px;
  border: 1px solid var(--border-color); background: var(--bg-elevated); color: var(--text-primary); font-weight: 700;
}
.na-imp-badge i { color: var(--text-muted); }
.na-imp-title { margin: 0; font-weight: 800; font-size: .95rem; line-height: 1.5; color: var(--text-primary); }
.na-imp-title:empty { display: none; }
.na-imp-stats { display: flex; flex-wrap: wrap; gap: .3rem; }
.na-imp-stats:empty { display: none; }
.na-imp-st {
  display: inline-flex; align-items: baseline; gap: .3rem; padding: .22rem .6rem;
  border: 1px solid var(--border-color); border-radius: 999px; background: var(--bg-card);
  font-size: .74rem; color: var(--text-muted);
}
.na-imp-st b { font-size: .82rem; font-weight: 800; color: var(--text-primary); unicode-bidi: isolate; }
.na-imp-st[data-ok] { border-color: color-mix(in oklab, var(--st-ok) 40%, var(--border-color)); background: color-mix(in oklab, var(--st-ok) 8%, transparent); }
.na-imp-st[data-ok] b { color: var(--st-ok); }
.na-imp-g { display: flex; flex-direction: column; gap: .6rem; }
.na-imp-g[hidden] { display: none; }
.na-imp-ai { margin: 0; font-size: .74rem; }
.na-imp-ai > i { color: var(--st-ok); }
.na-imp-app { display: flex; flex-direction: column; gap: .45rem; }
.na-imp-app[hidden] { display: none; }
.na-imp-look { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.na-imp-look > .gsf-chips { margin: 0; gap: .3rem; }
.na-imp-look .gsf-chip { padding-block: .28rem; font-size: .78rem; }
.na-imp-lbl { font-size: .74rem; font-weight: 800; color: var(--text-muted); margin: 0; }
.na-imp-more { border-block-start: 1px solid var(--border-color); padding-block-start: .5rem; }
.na-imp-more > summary {
  display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; list-style: none;
  font-size: .78rem; font-weight: 700; color: var(--text-secondary); padding-block: .15rem;
}
.na-imp-more > summary::-webkit-details-marker { display: none; }
.na-imp-more > summary::before {
  content: '+'; display: inline-grid; place-items: center; inline-size: 1.05rem; block-size: 1.05rem;
  border: 1px solid var(--border-color); border-radius: 5px; font-size: .78rem; line-height: 1;
}
.na-imp-more[open] > summary::before { content: '−'; }
.na-imp-more > .na-imp-opt { margin-block-start: .45rem; }
.na-imp-opt { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .1rem .4rem; }
.na-imp-opt label { display: flex; align-items: flex-start; gap: .5rem; padding: .38rem .45rem; border-radius: 10px; font-size: .8rem; color: var(--text-primary); cursor: pointer; min-inline-size: 0; }
.na-imp-opt label:hover { background: var(--bg-elevated); }
.na-imp-opt label[data-off] { cursor: default; color: var(--text-muted); }
.na-imp-opt label[data-off]:hover { background: transparent; }
.na-imp-opt input { margin-block-start: .22rem; accent-color: var(--st-ok); flex: none; }
.na-imp-opt small { display: block; color: var(--text-muted); font-size: .7rem; line-height: 1.5; }
.na-imp-acts { margin: 0; padding-block-start: .2rem; }
.na-imp-ta { min-block-size: 11rem; font-size: .85rem; line-height: 1.7; }
.na-imp-url { font-size: .9rem; }
.na-imp-steps { margin: 0; padding-inline-start: 1.3rem; display: grid; gap: .3rem; font-size: .8rem; line-height: 1.7; color: var(--text-secondary); }
.na-imp-steps > li::marker { color: var(--text-muted); font-weight: 800; }
.na-imp-ais { margin: 0; font-size: .72rem; color: var(--text-muted); unicode-bidi: isolate; }
.na-imp-pv[aria-busy="true"] [data-imp-a="next"], .na-imp-pv[aria-busy="true"] [data-imp-a="md"] { opacity: .55; pointer-events: none; }
@media (max-width: 640px) {
  .na-imp-opt { grid-template-columns: minmax(0, 1fr); }
}

.na-exp-rng { margin-block-start: .8rem; }
.na-exp-rng[hidden] { display: none; }
.na-rng-row { display: flex; align-items: flex-end; flex-wrap: wrap; gap: .5rem; margin-block-start: .5rem; }
.na-rng-row[hidden] { display: none; }
.na-rng-f { display: flex; flex-direction: column; gap: .2rem; font-size: .74rem; color: var(--text-muted); }
.na-rng-f .gsf-in { inline-size: 5.5rem; text-align: center; }
.na-rng-tot {
  font-size: .74rem; color: var(--text-muted); padding-block-end: .5rem;
  unicode-bidi: isolate;
}

/*@3.NOAC.19*/
.na-cover[data-art="ash"],
.na-pg-art[data-art="ash"] { background-image: none; background-color: #4b5563; }
.na-cover[data-art="clay"],
.na-pg-art[data-art="clay"] { background-image: none; background-color: #9a6b52; }
.na-cover[data-art="sage"],
.na-pg-art[data-art="sage"] { background-image: none; background-color: #6b8f71; }
.na-cover[data-art="denim"],
.na-pg-art[data-art="denim"] { background-image: none; background-color: #54739c; }
.na-cover[data-art="plum"],
.na-pg-art[data-art="plum"] { background-image: none; background-color: #7b5f86; }
.na-cover[data-art="ochre"],
.na-pg-art[data-art="ochre"] { background-image: none; background-color: #a68245; }
.na-cover[data-art="teal"],
.na-pg-art[data-art="teal"] { background-image: none; background-color: #4a8480; }
.na-cover[data-art="brick"],
.na-pg-art[data-art="brick"] { background-image: none; background-color: #9c5f5a; }
.na-cover[data-art="dawn"],
.na-pg-art[data-art="dawn"] { background-image: linear-gradient(155deg, #8f7aa6, #c78f86); }
.na-cover[data-art="moss"],
.na-pg-art[data-art="moss"] { background-image: linear-gradient(155deg, #5d7f63, #8a9b62); }
.na-cover[data-art="dusk"],
.na-pg-art[data-art="dusk"] { background-image: linear-gradient(155deg, #4e5c86, #6d5b7d); }
.na-cover[data-art="sand"],
.na-pg-art[data-art="sand"] { background-image: linear-gradient(155deg, #b39169, #8e6f52); }
.na-cover[data-art="ink"],
.na-pg-art[data-art="ink"] { background-image: linear-gradient(155deg, #3f4a5a, #2a3140); }
.na-cover[data-art="sea"],
.na-pg-art[data-art="sea"] { background-image: linear-gradient(155deg, #4a7f8c, #5f9c95); }
.na-cover[data-art="hearth"],
.na-pg-art[data-art="hearth"] { background-image: linear-gradient(155deg, #95604f, #7a4a52); }
.na-cover[data-art="frost"],
.na-pg-art[data-art="frost"] { background-image: linear-gradient(155deg, #6b8394, #8b9aa6); }
.na-cover[data-art="grain"],
.na-pg-art[data-art="grain"] { background-color: #5a5f68; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' seed='82'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%' height='100%' fill='%235a5f68'/%3E%3Crect width='100%' height='100%' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E"); background-size: 240px 160px; background-repeat: repeat; }
.na-cover[data-art="linen"],
.na-pg-art[data-art="linen"] { background-color: #7a7364; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='2' seed='51'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%' height='100%' fill='%237a7364'/%3E%3Crect width='100%' height='100%' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E"); background-size: 240px 160px; background-repeat: repeat; }
.na-cover[data-art="paper"],
.na-pg-art[data-art="paper"] { background-color: #8a8478; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' seed='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%' height='100%' fill='%238a8478'/%3E%3Crect width='100%' height='100%' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E"); background-size: 240px 160px; background-repeat: repeat; }
.na-cover[data-art="slateT"],
.na-pg-art[data-art="slateT"] { background-color: #4c5560; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='5' seed='58'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%' height='100%' fill='%234c5560'/%3E%3Crect width='100%' height='100%' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E"); background-size: 240px 160px; background-repeat: repeat; }
.na-pg-art { background-size: cover; background-position: 50% 50%; }

.na-link-txt { margin-block-start: .5rem; }

/*@3.NOAC.26*/
.na-page[data-kind="board"] { inline-size: 100%; }
.na-page[data-kind="board"] .na-sheet {
  min-block-size: calc(100vh - 15rem);
  min-block-size: calc((100dvh - 15rem) / var(--na-zin, 1));
  block-size: calc(100vh - 15rem);
  block-size: calc((100dvh - 15rem) / var(--na-zin, 1));
}
.na-page[data-kind="board"] .na-sheet::before { background-image: none; }
.na-page[data-kind="board"] .ne-root { display: none; }
.na-page[data-kind="board"] .na-pgbar { display: none; }
html.na-full .na-page[data-kind="board"] .na-sheet {
  min-block-size: calc(100vh - 8rem);
  min-block-size: calc((100dvh - 8rem) / var(--na-zin, 1));
  block-size: calc(100vh - 8rem);
  block-size: calc((100dvh - 8rem) / var(--na-zin, 1));
}
.na-page[data-kind="board"] ~ .nov-host,
.na-tf > .na-page[data-kind="board"] + .nov-host { z-index: 30; }

/*@3.NOAC.27*/
.na-guest-bar {
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  padding: .5rem .9rem; font-size: .82rem; line-height: 1.6;
  background: color-mix(in oklab, #a78bfa 10%, transparent);
  border-block-end: 1px solid color-mix(in oklab, #a78bfa 38%, transparent);
  color: var(--text-secondary);
}
.na-guest-bar > i { color: #a78bfa; flex: none; }
.na-guest-bar > span { flex: 1 1 12rem; min-inline-size: 0; }
.na-guest-copy {
  flex: none; cursor: pointer; font-family: inherit; font-size: .78rem;
  padding: .3rem .8rem; border-radius: var(--radius-pill);
  background: transparent; color: var(--text-primary);
  border: 1px solid color-mix(in oklab, #a78bfa 55%, transparent);
}
.na-guest-copy:hover { background: color-mix(in oklab, #a78bfa 16%, transparent); }
.na-guest-out { flex: none; color: var(--na-act, #7c3aed); text-decoration: none; font-size: .78rem; }
.na-guest-out:hover { text-decoration: underline; }
.na-guest-miss { padding: 3rem 1rem; text-align: center; color: var(--text-muted); }
html.na-guest .na-icons,
html.na-guest .na-panel,
html.na-guest #na-ribbon { display: none; }
html.na-guest .ne-list > .ne-li::before { cursor: default; }
html.na-guest .na { grid-template-columns: minmax(0, 1fr); }
html.na-guest .ne-rail,
html.na-guest .ne-tail,
html.na-guest .ne-wgrip,
html.na-guest .ne-tbl-bar,
html.na-guest .ne-img-edit { display: none !important; }

/*@3.NOAC.28*/
.na-sh-modes { margin-block-end: .8rem; }
.na-sh-link { display: flex; gap: .4rem; align-items: center; margin-block-end: .7rem; }
.na-sh-link .gsf-in { flex: 1 1 auto; min-inline-size: 0; font-size: .78rem; }
.na-sh-warn {
  margin: 0 0 .5rem; padding: .45rem .7rem; font-size: .78rem; line-height: 1.6;
  border-radius: var(--radius-md);
  background: color-mix(in oklab, #ef4444 10%, transparent);
  border: 1px solid color-mix(in oklab, #ef4444 40%, transparent);
  color: var(--text-secondary);
}
.na-sh-note { margin: 0; font-size: .78rem; color: var(--text-secondary); min-block-size: 1.2em; }
.na-sh-note[data-k="ok"] { color: #10b981; }
.na-sh-note[data-k="warn"] { color: #f59e0b; }

/*@3.NOAC.31*/
.na-uns-bar { display: flex; gap: .5rem; align-items: center; margin-block-end: .6rem; }
.na-uns-bar > .gsf-in { flex: 1 1 auto; min-inline-size: 0; }
.na-uns-note { margin: 0 0 .6rem; font-size: .78rem; color: var(--text-muted); }
.na-uns-note[data-kind="err"] { color: #ef4444; }
.na-uns-grid {
  display: grid; gap: .5rem;
  grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
}
.na-uns-c { margin: 0; display: flex; flex-direction: column; gap: .2rem; }
.na-uns-b {
  padding: 0; border: 1px solid var(--border-color); border-radius: var(--radius-md);
  overflow: hidden; cursor: pointer; block-size: 6.5rem;
}
.na-uns-b:hover { border-color: color-mix(in oklab, #a78bfa 65%, transparent); }
.na-uns-b:focus-visible { outline: 2px solid #a78bfa; outline-offset: 2px; }
.na-uns-b > img { inline-size: 100%; block-size: 100%; object-fit: cover; display: block; }
.na-uns-by { font-size: .68rem; color: var(--text-muted); text-align: center; }
.na-uns-by a { color: inherit; text-decoration: none; }
.na-uns-by a:hover { text-decoration: underline; }
.na-uns-more { margin-block-start: .8rem; inline-size: 100%; }
.na-pg-row { display: flex; gap: .5rem; flex-wrap: wrap; }
.na-pg-row > .gsf-btn { flex: 1 1 8rem; }
.ne-img-uns { display: inline-flex; align-items: center; gap: .35rem; }

.na-empty-new {
  inline-size: 100%; border: 0; background: none; cursor: pointer;
  font-family: inherit; color: inherit;
}
.na-empty-new:hover { background: color-mix(in oklab, var(--text-muted) 6%, transparent); }
.na-empty-new:focus-visible { outline: 2px solid var(--na-act); outline-offset: -4px; }

/*@3.NOAC.51*/
.na-find .na-vm {
  flex: 0 0 auto;
  inline-size: 30px;
  block-size: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border-1, rgba(148,163,184,.24));
  border-radius: 8px;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: color .15s, border-color .15s, background .15s;
}
.na-find .na-vm:hover {
  color: var(--text-1);
  border-color: var(--brand-500, #7c3aed);
  background: color-mix(in oklab, var(--brand-500, #7c3aed) 12%, transparent);
}

/*@3.NOAC.52*/
.na-items[data-vm="cards"] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(122px, 1fr));
  gap: .4rem;
  align-content: start;
}
.na-items[data-vm="cards"] > .na-blanks { grid-column: 1 / -1; }
.na-items[data-vm="cards"] > .na-empty  { grid-column: 1 / -1; }

.na-items[data-vm="cards"] .na-row {
  min-block-size: 92px;
  max-block-size: 140px;
  display: flex;
  flex-direction: column;
  gap: .14rem;
  margin-block-end: 0;
  padding: .45rem .5rem .4rem;
  background: var(--bg-card);
  border-color: var(--border-color);
  overflow: hidden;
  transition: border-color .15s, background .15s;
}
.na-items[data-vm="cards"] .na-row:hover {
  border-color: color-mix(in oklab, var(--na-act) 45%, transparent);
}
.na-items[data-vm="cards"] .na-row-t {
  align-items: flex-start;
  gap: .3rem;
  flex: 0 0 auto;
}
/*@3.NOAC.53*/
.na-items[data-vm="cards"] .na-row-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
  text-overflow: clip;
  overflow: hidden;
  overflow-wrap: anywhere;
  font-size: .755rem;
  line-height: 1.38;
}
.na-items[data-vm="cards"] .na-row-x {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
  text-overflow: clip;
  overflow: hidden;
  overflow-wrap: anywhere;
  margin-block-start: .08rem;
  font-size: .68rem;
  line-height: 1.36;
  flex: 0 1 auto;
  min-block-size: 0;
}
.na-items[data-vm="cards"] .na-row-m {
  flex: 0 0 auto;
  margin-block-start: auto;
  padding-block-start: .18rem;
  font-size: .62rem;
}
.na-items[data-vm="cards"] .na-org { display: none; }
.na-items[data-vm="cards"] .na-when { margin-inline-start: 0; }
.na-items[data-vm="cards"] .na-dot { margin-block-start: .28rem; }
.na-items[data-vm="cards"] .na-row-badge:nth-of-type(n+3) { display: none; }

/*@3.NOAC.54*/
.na-items .na-row[data-alt="1"] {
  background: color-mix(in oklab, var(--text-muted) 7%, var(--bg-card));
}
.na-items[data-vm="rows"] .na-row[data-alt="1"],
.na-items:not([data-vm="cards"]) .na-row[data-alt="1"] {
  background: color-mix(in oklab, var(--text-muted) 6%, transparent);
}
.na-items .na-row[data-alt]:hover { background: var(--bg-surface); }
.na-items[data-vm="cards"] .na-row[data-alt]:hover {
  background: color-mix(in oklab, var(--na-act) 7%, var(--bg-card));
}
.na-items .na-row[data-alt][data-picked="1"] {
  background: color-mix(in oklab, var(--na-sel) 12%, var(--bg-card));
}
.na-items .na-row[data-alt][aria-current="true"] {
  background: color-mix(in oklab, var(--na-sel) 10%, var(--bg-card));
}

@media (max-width: 420px) {
  .na-items[data-vm="cards"] { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); }
}

/*@3.NOAC.57*/
.na-prt-theme {
  display: flex; align-items: center; gap: .55rem;
  margin-block: .55rem .35rem;
}
.na-prt-theme > span {
  flex: none; font-size: .78rem; font-weight: 700; color: var(--text-secondary);
}
.na-prt-theme > select { flex: 1 1 auto; min-inline-size: 0; }

/*@3.NOAC.65*/
.na-doc-tools {
  display: flex; align-items: center; gap: .15rem; flex: 0 0 auto;
  padding-inline-end: .35rem;
  margin-inline-end: .1rem;
  border-inline-end: 1px solid var(--border-color);
}
.na-doc-tools:empty,
.na-doc-tools:has(> [hidden]:only-child) { display: none; }
.na-icb--pen { font-size: .95rem; }
#na[data-kind="pdf"] .na-doc-title { text-align: center; }
@media (max-width: 768px) { #na-draw-top { display: none !important; } }
@media (min-width: 769px) { #na-pdf-draw { display: none !important; } }
/*@3.NOAC.73*/
@media (max-width: 768px) { #na-undo-top, #na-redo-top { display: none !important; } }
@media (min-width: 769px) { #na-undo-side { display: none !important; } }
.na-icb--hist[disabled], .na-ic--hist[disabled] { opacity: .38; cursor: default; }
.na-penwing--hist .na-wingb[disabled] { opacity: .38; cursor: default; }

.na-newpop {
  position: fixed; z-index: 90;
  min-inline-size: 13rem;
  padding: .3rem;
  display: flex; flex-direction: column; gap: .1rem;
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .34);
}
.na-newpop-i {
  display: flex; align-items: center; gap: .55rem;
  padding: .5rem .6rem; cursor: pointer; text-align: start;
  background: none; border: 0; border-radius: var(--radius-md);
  color: var(--text-primary); font-family: 'Cairo', sans-serif; font-size: .88rem;
}
.na-newpop-i > i { inline-size: 1.1rem; text-align: center; color: var(--text-muted); }
.na-newpop-i:hover, .na-newpop-i:focus-visible {
  background: color-mix(in oklab, var(--na-act) 14%, transparent);
  outline: none;
}
.na-newpop-i:hover > i { color: var(--na-act); }

#na[data-drop="1"]::after {
  content: '';
  position: absolute; inset: 0; z-index: 80; pointer-events: none;
  border: 2px dashed color-mix(in oklab, var(--na-act) 70%, transparent);
  border-radius: var(--radius-lg);
  background: color-mix(in oklab, var(--na-act) 8%, transparent);
}

/*@3.NOAC.70*/
.na-penwing {
  position: fixed; z-index: 2147483100;
  display: flex; flex-direction: column; gap: .3rem; align-items: center;
  padding: .3rem; border-radius: var(--radius-lg);
  background: var(--bg-elevated);
  border: 1px solid var(--border-color);
  box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .55);
  animation: na-wing-in .16s ease-out;
}
@keyframes na-wing-in { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
.na-wingb {
  inline-size: 2.75rem; block-size: 2.75rem; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-md); cursor: pointer;
  border: 1px solid var(--border-color);
  background: var(--bg-card); color: var(--text-secondary);
  font-size: .95rem;
}
.na-wingb:hover { color: var(--text-primary); border-color: var(--text-muted); }

.na-shptray--dlg {
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  inline-size: min(22rem, calc(100vw - 1.5rem));
  padding: .8rem .85rem;
}
/*@3.NOAC.72*/
.na-shptray.na-shptray--dlg { animation: na-tray-in .16s ease-out; }
@keyframes na-tray-in {
  from { opacity: 0; transform: translate(-50%, -50%) scale(.94); }
  to { opacity: 1; transform: translate(-50%, -50%); }
}
.na-shptray {
  position: fixed; z-index: 2147483100;
  inline-size: min(19.5rem, calc(100vw - 1.5rem));
  padding: .55rem; border-radius: var(--radius-lg);
  background: var(--bg-elevated);
  border: 1px solid var(--border-color);
  box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .55);
  animation: na-wing-in .16s ease-out;
}
.na-shptray-g {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .38rem;
}
/*@3.NOAC.74*/
.na-shptray-tabs { display: flex; gap: .3rem; margin-block-end: .55rem; }
.na-shptab {
  flex: 1 1 auto; min-block-size: 2rem; padding-inline: .5rem;
  border-radius: var(--radius-sm); cursor: pointer;
  border: 1px solid var(--border-color); background: var(--bg-card); color: var(--text-secondary);
  font: inherit; font-size: .78rem; font-weight: 700;
}
.na-shptab[aria-selected="true"] {
  color: var(--na-act, #7c3aed); border-color: var(--na-act, #7c3aed);
  background: color-mix(in oklab, var(--na-act, #7c3aed) 12%, transparent);
}
.na-shptray-g--stk { grid-template-columns: repeat(6, minmax(0, 1fr)); max-block-size: 46vh; overflow-y: auto; }
.na-shpo--stk.ne-shp-c {
  inline-size: 100%; block-size: auto; aspect-ratio: 1; border-radius: var(--radius-sm);
  color: #fff; font-size: 1.05rem; border: 1px solid transparent;
}
.na-shpo--stk.ne-shp-c[data-tone="ink"] { color: var(--bg-card); }
.na-shpo--stk.ne-shp-c[aria-pressed="true"] { outline: 2px solid var(--na-act, #7c3aed); outline-offset: 1px; }
.na-shpo {
  aspect-ratio: 1; inline-size: 100%;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm); cursor: pointer;
  border: 1px solid var(--border-color);
  background: var(--bg-card); color: var(--text-secondary);
}
.na-shpo:hover { color: var(--text-primary); border-color: var(--text-muted); }
.na-shpo[aria-pressed="true"] {
  color: var(--na-act, #7c3aed); border-color: var(--na-act, #7c3aed);
  background: color-mix(in oklab, var(--na-act, #7c3aed) 12%, transparent);
}
.na-shpo > svg { inline-size: 1.6rem; block-size: 1.6rem; }
.na-shptray-r {
  display: flex; gap: .3rem; align-items: center; margin-block-start: .45rem;
  padding-block-start: .45rem; border-block-start: 1px solid var(--border-color);
}
.na-shpz {
  flex: 1 1 auto; min-block-size: 1.9rem; padding-inline: .5rem;
  border-radius: var(--radius-sm); cursor: pointer;
  border: 1px solid var(--border-color);
  background: var(--bg-card); color: var(--text-secondary);
  font: inherit; font-size: .74rem; font-weight: 700;
}
.na-shpz[aria-pressed="true"] {
  color: #10b981; border-color: rgba(16, 185, 129, .55);
  background: rgba(16, 185, 129, .12);
}
.na-shpz--fill { flex: 0 0 auto; }
.na-shpz--drag { flex: 1 1 auto; text-align: start; font-weight: 600; font-size: .72rem; line-height: 1.45; padding-block: .3rem; white-space: normal; }
.na-shpz--drag > i { color: var(--na-act, #7c3aed); margin-inline-end: .3rem; }
.na-shptray-p {
  margin: .45rem 0 0; font-size: .7rem; color: var(--text-muted); line-height: 1.6;
}
@media (max-width: 640px) {
  .na-shpo { min-block-size: 2.75rem; }
  .na-shpz { min-block-size: 2.4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .na-penwing, .na-shptray { animation: none; }
}

.na-flash {
  position: fixed; z-index: 70; pointer-events: none;
  inline-size: 3rem; block-size: 3rem; translate: -50% -50%;
  border-radius: 50%;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--gsf-tint) 65%, transparent);
  animation: na-flash 1.4s ease-out forwards;
}
@keyframes na-flash { from { scale: .55; opacity: 1; } to { scale: 1.5; opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .na-flash { animation: na-flash-rm 1.4s linear forwards; }
}
@keyframes na-flash-rm { from { opacity: 1; } 70% { opacity: 1; } to { opacity: 0; } }
