.not { margin-top: clamp(96px, 14vh, 160px); }
.not-head { margin-bottom: 32px; }

.not-win { --term: #ffffff; --term-fg: #1f1f1f; --nd-bg: #ffebe9; --nd-bar: #f85149; --nd-dim: #6e7781; }
:root[data-theme="dark"] .not-win { --term: #222436; --term-fg: #c8d3f5; --nd-bg: rgba(255, 117, 127, .14); --nd-bar: #ff757f; --nd-dim: #636da6; }
.not-win .titlebar span:last-child { font-weight: 600; }
.not-screen { font: clamp(14px, 1.25vw, 17px)/1.75 var(--mono); color: var(--term-fg); padding: 4px 0 0; }
.not-tabs { display: flex; gap: 14px; padding: 6px 22px 10px; color: var(--nd-dim); }
.not-tabs .on { color: var(--term-fg); font-weight: 700; }
.not-tabs b { font-weight: 600; color: var(--nd-bar); }
.not-rows { display: grid; }
.not-row { position: relative; padding: 2px 22px 2px 30px; white-space: pre-wrap; transition: color .3s; }
.not-row::before { content: ""; position: absolute; inset: 0; background: var(--nd-bg); transform: scaleX(0); transform-origin: left; transition: transform .55s cubic-bezier(.6, 0, .2, 1); }
.not-row::after { content: ""; position: absolute; left: 12px; top: 0; bottom: 0; width: 4px; border-radius: 1px; background: var(--nd-bar); transform: scaleY(0); transition: transform .25s .1s; }
.not-row span { position: relative; }
.not-row.gone::before { transform: none; }
.not-row.gone::after { transform: none; }
.not-ctx { padding: 2px 22px 2px 30px; margin-top: 6px; color: var(--nd-dim); white-space: pre-wrap; }
.not-status { display: flex; gap: 20px; margin-top: 18px; padding: 4px 22px 8px; background: color-mix(in srgb, var(--term-fg) 7%, var(--term)); color: var(--nd-dim); }
.not-status b { color: var(--term-fg); font-weight: 700; }
.not-status .r { margin-left: auto; }
@media (max-width: 640px) { .not-status span:not(:first-of-type) { display: none; } .not-row, .not-ctx { padding-left: 24px; } .not-row::after { left: 8px; } }