:root{
  /* 색 — light */
  --nn-bg:#FDFCFB;
  --nn-surface:#FFFFFF;
  --nn-tile:#F0F0EA;
  --nn-media:#EEF1F8;
  --nn-text:#1F1F1F;
  --nn-text-2:#474746;
  --nn-text-3:#6A6A69;
  --nn-line:rgba(0,0,0,.08);
  --nn-line-strong:rgba(0,0,0,.13);
  --nn-tile-line:rgba(0,0,0,.04);
  --nn-accent:#445C90;
  --nn-accent-strong:#2F4778;
  --nn-accent-tint:#E8EDF8;
  --nn-accent-container:#DAE2FF;
  --nn-tag-bg:var(--nn-accent-tint);
  --nn-link-note:#6D5368;
  --nn-on-accent:#FFFFFF;
  --nn-scrim:rgba(0,0,0,.8);

  /* 공통 바닥 연결 */
  --font-sans:var(--nn-font);
  --focus:var(--nn-accent);
  --ys-line:var(--nn-line);
  --ys-muted:var(--nn-text-3);
  --ys-ink:var(--nn-text);
  --ys-container:var(--nn-max);
  --ys-gutter:var(--nn-gutter);
  --ys-skip-bg:var(--nn-text);
  --ys-skip-fg:var(--nn-bg);

  /* 타입 */
  --nn-font:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;
  --nn-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --nn-fs-display:clamp(34px,4.2vw + 18px,52px);
  --nn-lh-display:1.25; --nn-ls-display:-0.02em; --nn-fw-display:700;
  --nn-fs-h2:clamp(26px,1.6vw + 20px,36px);
  --nn-lh-h2:1.35; --nn-ls-h2:-0.015em; --nn-fw-h2:700;
  --nn-fs-h3:clamp(17px,0.3vw + 16px,20px);
  --nn-lh-h3:1.5; --nn-fw-h3:600;
  --nn-fs-lead:clamp(16px,0.4vw + 14.5px,18px);
  --nn-lh-lead:1.65;
  --nn-fs-body:16px; --nn-lh-body:1.7;
  --nn-fs-small:14px; --nn-lh-small:1.6;
  --nn-fs-caption:12px; --nn-lh-caption:1.5;
  --nn-fs-tag:13px;

  /* 간격 */
  --nn-s1:4px; --nn-s2:8px; --nn-s3:12px; --nn-s4:16px; --nn-s5:24px;
  --nn-s6:32px; --nn-s7:48px; --nn-s8:80px; --nn-s9:120px;
  --nn-gutter:16px;
  --nn-section-gap:48px;
  --nn-heading-to-media:16px;
  --nn-max:1120px;
  --nn-max-text:900px;
  --nn-max-lead:560px;
  --nn-header-h:56px;

  /* 모양 */
  --nn-r-sm:6px; --nn-r-md:8px; --nn-r-btn:10px; --nn-r-card:12px; --nn-r-shot:20px; --nn-r-pill:9999px;
  --nn-shadow-shot:0 0 0 1px rgba(0,0,0,.04),0 14px 32px rgba(0,0,0,.10),0 28px 70px rgba(0,0,0,.14);
  --nn-shadow-shot-sm:0 0 4px rgba(0,0,0,.03),0 4px 8px rgba(0,0,0,.04),0 16px 26px rgba(0,0,0,.05);
  --nn-shadow-btn:0 0 0 1px rgba(15,15,15,.06),0 2px 4px rgba(15,15,15,.08);

  /* 화면 폭 */
  --nn-shot-hero:260px;      /* 390 히어로 1장 */
  --nn-shot-panel:240px;     /* 연결 탭 패널 */
  --nn-shot-card:220px;      /* bento 카드 */

  /* 모션 */
  --nn-ease:var(--ys-ease-standard);
  --nn-dur-fast:var(--ys-dur-micro); --nn-dur:var(--ys-dur-micro); --nn-dur-panel:var(--ys-dur-short);

  --nn-touch:44px;
}
@media (min-width:600px) and (max-width:1023px){
  :root{ --nn-gutter:24px; --nn-section-gap:64px; }
}
@media (min-width:1024px){
  :root{ --nn-gutter:48px; --nn-section-gap:80px; --nn-heading-to-media:32px; --nn-header-h:72px;
         --nn-shot-panel:300px; --nn-shot-card:240px; }
}
@media (prefers-color-scheme:dark){
  :root{
    --nn-bg:#141416; --nn-surface:#1E1E21; --nn-tile:#232326; --nn-media:#1B1E26;
    --nn-text:#EDEDED; --nn-text-2:#B8B8BC; --nn-text-3:#8E8E94;
    --nn-line:rgba(255,255,255,.10); --nn-line-strong:rgba(255,255,255,.16); --nn-tile-line:rgba(255,255,255,.06);
    --nn-accent:#AEC6FF; --nn-accent-strong:#D8E2FF; --nn-on-accent:#102F60;
    --nn-accent-tint:rgba(174,198,255,.14); --nn-accent-container:#2B4678; --nn-tag-bg:rgba(174,198,255,.16);
    --nn-link-note:#DCBCD3;
    --nn-shadow-shot:0 0 0 1px rgba(255,255,255,.06),0 20px 48px rgba(0,0,0,.5);
    --nn-shadow-shot-sm:0 0 0 1px rgba(255,255,255,.05),0 12px 28px rgba(0,0,0,.4);
    --nn-shadow-btn:none;
  }
}
@media (prefers-reduced-motion:reduce){ :root{ --nn-dur-fast:0ms; --nn-dur:0ms; --nn-dur-panel:0ms; } }

body[data-page="nexusnotes"]{
  background:var(--nn-bg); color:var(--nn-text);
  font-size:var(--nn-fs-body); line-height:var(--nn-lh-body);
}

html.nn-lang-pending body{opacity:0}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
/* Capture mode must let programmatic scrolling reach lazy media. */
html[data-ys-motion="auto"]{scroll-behavior:auto}
.nn-wrap{width:min(var(--nn-max),100% - 2*var(--nn-gutter));margin-inline:auto}
.nn-defs{position:absolute;width:0;height:0;overflow:hidden}
.nn-svg{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.nn-star{width:14px;height:14px;fill:currentColor;stroke:none;color:var(--nn-accent)}
.nn-header{position:sticky;top:0;z-index:50;height:var(--nn-header-h);background:var(--nn-bg)}
.nn-header.is-scrolled{box-shadow:0 1px 0 var(--nn-line)}
.nn-header__in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:8px}
.nn-brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--nn-text);font-size:17px;font-weight:700;text-decoration:none;white-space:nowrap;flex:none}
.nn-brand img{width:28px;height:28px;border:1px solid var(--nn-line-strong);border-radius:7px}
.nn-header__end{display:flex;align-items:center;gap:4px;flex:none}
.nn-lang,.nn-menu-btn{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 10px;border:1px solid var(--nn-line-strong);border-radius:8px;background:transparent;color:var(--nn-text);font-size:15px;font-weight:600;cursor:pointer}
.nn-menu-btn{padding:0;border:0}
.nn-lang:hover,.nn-menu-btn:hover{background:var(--nn-tile)}
.nn-btn{display:inline-flex;align-items:center;justify-content:center;position:relative;min-height:52px;padding:0 24px;border:0;border-radius:var(--nn-r-btn);font-size:16px;font-weight:600;text-decoration:none;white-space:nowrap;transition:background var(--nn-dur-fast) var(--nn-ease),transform var(--nn-dur-fast) var(--nn-ease)}
.nn-btn--primary{background:var(--nn-accent);color:var(--nn-on-accent);box-shadow:var(--nn-shadow-btn)}
.nn-btn--primary:hover{background:var(--nn-accent-strong)}
.nn-btn--secondary{background:var(--nn-accent-tint);color:var(--nn-accent-strong)}
.nn-btn--secondary:hover{background:var(--nn-accent-container)}
.nn-btn:active{transform:scale(var(--ys-press-scale))}
.nn-btn--sm{min-height:40px;height:40px;padding:0 16px;border-radius:var(--nn-r-pill);font-size:15px}
.nn-btn--sm::after{content:"";position:absolute;inset:-2px 0}
.nn-nav ul,.nn-meta,.nn-bento,.nn-tiles,.nn-rows,.nn-uses{padding:0;list-style:none}
.nn-nav a{display:flex;align-items:center;gap:6px;min-height:52px;color:var(--nn-text-2);font-size:17px;font-weight:500;text-decoration:none;white-space:nowrap}
.nn-nav a:hover{background:var(--nn-tile);color:var(--nn-text)}
.nn-nav .nn-svg,.nn-textlink .nn-svg,.nn-footer__app .nn-svg{width:16px;height:16px}
@media (max-width:1023px){
  html.js .nn-nav{position:fixed;top:var(--nn-header-h);inset-inline:0;background:var(--nn-surface);border-bottom:1px solid var(--nn-line);box-shadow:0 12px 24px rgba(0,0,0,.08);padding:8px var(--nn-gutter) 16px}
  .nn-nav li+li{border-top:1px solid var(--nn-line)}
  html:not(.js) .nn-header{height:auto;position:static}
  html:not(.js) .nn-header__in{flex-wrap:wrap}
  html:not(.js) .nn-nav{order:3;width:100%}
}
.nn-hero__text{text-align:center;padding-top:40px}
.nn-hero__icon{margin-inline:auto;width:56px;height:56px;border:1px solid var(--nn-line-strong);border-radius:14px}
.nn-hero__name{margin-top:8px;font-size:17px;font-weight:600;color:var(--nn-text-2)}
.nn-h1{max-width:1000px;margin:12px auto 0;font-size:var(--nn-fs-display);line-height:var(--nn-lh-display);letter-spacing:var(--nn-ls-display);font-weight:var(--nn-fw-display)}
.nn-lead{max-width:var(--nn-max-lead);margin:16px auto 0;font-size:var(--nn-fs-lead);line-height:var(--nn-lh-lead);color:var(--nn-text-2)}
.nn-actions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin-top:32px}
.nn-actions .nn-btn{width:min(100%,360px)}
.nn-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 22px;margin-top:16px;font-size:14px;line-height:1.6;color:var(--nn-text-3)}
.nn-meta li{position:relative;white-space:nowrap}
.nn-meta li+li::before{content:"·";position:absolute;inset-inline-start:-14px;color:var(--nn-text-3)}
.nn-meta li.nn-meta__row-start::before,html:not(.js) .nn-meta li::before{content:none}
.nn-meta__rating>span:first-child{display:inline-flex;align-items:center;gap:4px}
.nn-meta__rating b{font-weight:600;color:var(--nn-text-2)}
.nn-shot{display:block;width:var(--nn-shot-panel);height:auto;border-radius:var(--nn-r-shot);outline:1px solid var(--nn-line);outline-offset:-1px;background:#fff;max-width:none}
.nn-section{padding-block:var(--nn-section-gap)}
body[data-page="nexusnotes"] section[id]{scroll-margin-top:calc(var(--nn-header-h) + 8px)}
.nn-h2{max-width:var(--nn-max-text);font-size:var(--nn-fs-h2);line-height:var(--nn-lh-h2);letter-spacing:var(--nn-ls-h2);font-weight:var(--nn-fw-h2)}
.nn-body{margin-top:12px;font-size:16px;line-height:1.7;color:var(--nn-text-2)}
.nn-tag{display:inline-block;padding:2px 8px;border-radius:var(--nn-r-pill);background:var(--nn-tag-bg);color:var(--nn-accent-strong);font-size:13px;font-weight:500;white-space:nowrap}
.nn-note{color:var(--nn-link-note);font-weight:600;white-space:nowrap}
.nn-note__br{color:var(--nn-text-3);font-weight:inherit}
.nn-tabs{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:24px;padding:4px;margin-inline:-4px}
.nn-tabs::-webkit-scrollbar{display:none}
.nn-tabs button{height:44px;padding:0 14px;border-radius:var(--nn-r-sm);border:1px solid var(--nn-line-strong);background:transparent;color:var(--nn-text-2);font-size:15px;font-weight:500;white-space:nowrap;flex:none;scroll-snap-align:start;cursor:pointer;transition:background var(--nn-dur-fast) var(--nn-ease),color var(--nn-dur-fast) var(--nn-ease),border-color var(--nn-dur-fast) var(--nn-ease)}
.nn-tabs button:hover{background:var(--nn-tile)}
.nn-tabs button[aria-selected="true"]{background:var(--nn-text);color:var(--nn-bg);border-color:var(--nn-text)}
.nn-connect__panels{margin-top:var(--nn-heading-to-media);min-width:0}
.nn-panel{transition:opacity var(--nn-dur-panel) var(--nn-ease),transform var(--nn-dur-panel) var(--nn-ease)}
.nn-panel.is-entering{opacity:.01;transform:translateY(var(--ys-dist-xs))}
html.js:not(.nn-tabs-ready) .nn-panel:not(:first-child){display:none}
.nn-panel__title{margin-bottom:16px;font-size:var(--nn-fs-h3)}
.nn-panel+.nn-panel{margin-top:24px}
html.js .nn-panel+.nn-panel{margin-top:0}
.nn-media{display:flex;justify-content:center;height:420px;padding:32px 16px 0;border-radius:var(--nn-r-card);background:var(--nn-media);overflow:hidden}
.nn-shot-link{display:block;flex:none;align-self:flex-start;text-decoration:none;border-radius:var(--nn-r-shot);transition:filter var(--nn-dur-fast) var(--nn-ease)}
.nn-shot-link:hover{filter:brightness(.97)}
.nn-shot-link:focus-visible{outline-offset:4px}
.nn-shot-link .nn-shot{box-shadow:var(--nn-shadow-shot-sm)}
.nn-caption{max-width:520px;margin-top:12px;font-size:15px;line-height:1.6;color:var(--nn-text-2)}
.nn-bento,.nn-uses{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:var(--nn-heading-to-media)}
.nn-card{display:flex;flex-direction:column;min-width:0;padding:20px;border:1px solid var(--nn-line);border-radius:var(--nn-r-card);background:var(--nn-surface)}
.nn-card__title{font-size:var(--nn-fs-h3);line-height:var(--nn-lh-h3);font-weight:600}
.nn-card__desc{margin-top:8px;margin-bottom:20px;font-size:15px;line-height:1.6;color:var(--nn-text-2)}
.nn-card__media{display:flex;justify-content:center;height:300px;margin-top:auto;padding-top:24px;background:var(--nn-media);border-radius:var(--nn-r-md);overflow:hidden}
.nn-card .nn-shot{width:var(--nn-shot-card)}
.nn-tiles-block{margin-top:48px}
.nn-tiles__title{font-size:var(--nn-fs-h3);font-weight:600}
.nn-tiles{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:16px}
.nn-tools__note{margin-top:16px;font-size:14px;line-height:1.6;color:var(--nn-text-3)}
.nn-tools__more{margin-top:12px}
.nn-tile{display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:12px;padding:16px;border:1px solid var(--nn-tile-line);border-radius:var(--nn-r-md);background:var(--nn-tile)}
.nn-tile__icon{width:20px;height:20px;grid-row:1/3;color:var(--nn-accent);margin-top:3px}
.nn-tile__title{font-size:16px;font-weight:600;line-height:1.5}
.nn-tile__desc{grid-column:2;margin-top:4px;font-size:14px;line-height:1.6;color:var(--nn-text-3)}
.nn-badge{display:inline-block;padding:2px 8px;border-radius:var(--nn-r-pill);background:var(--nn-accent-tint);color:var(--nn-accent-strong);font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap;vertical-align:middle}
.nn-keep__grid{display:grid;grid-template-columns:minmax(0,1fr)}
.nn-rows{margin-top:16px}
.nn-row{padding:20px 0;border-top:1px solid var(--nn-line)}
.nn-row__lead{font-size:17px;font-weight:600}
.nn-row__desc{margin-top:6px;font-size:16px;line-height:1.7;color:var(--nn-text-2)}
.nn-keep__media{margin-top:24px}
.nn-use{display:flex;flex-direction:column;padding:24px;border:1px solid var(--nn-line);border-radius:12px;background:var(--nn-surface);min-width:0}
.nn-use h3{font-size:17px;font-weight:600;line-height:1.5}
.nn-use__body{margin-top:10px;font-size:15px;line-height:1.65;color:var(--nn-text-2)}
.nn-use .nn-btn{align-self:flex-start;min-height:48px;margin-top:auto}
.nn-use__body+.nn-btn{margin-top:20px}
.nn-video{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.nn-textlink{display:inline-flex;align-items:center;justify-content:flex-start;gap:6px;min-height:44px;color:var(--nn-accent);font-size:16px;font-weight:600;text-decoration:none;white-space:nowrap}
.nn-textlink:hover{text-decoration:underline;text-underline-offset:3px}
.nn-video__text>.nn-textlink{margin-top:12px}
.nn-poster{position:relative;display:block;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;box-shadow:var(--nn-shadow-shot-sm);background:var(--nn-media)}
.nn-poster>img{object-fit:cover;width:100%;height:100%}
.nn-poster__play{position:absolute;left:50%;top:50%;display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:#fff;color:#445C90;transition:transform var(--nn-dur-fast) var(--nn-ease)}
.nn-poster__play .nn-svg{width:28px;height:28px;fill:currentColor;stroke:none}
.nn-poster:hover .nn-poster__play{transform:scale(var(--ys-hover-brightness))}
.nn-poster__error{position:absolute;left:16px;right:16px;bottom:12px;text-align:center;font-size:14px;line-height:1.6;color:var(--nn-text-2)}
.nn-faq-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.nn-faq{max-width:760px;min-width:0}
.nn-faq__item{border-top:1px solid var(--nn-line)}
.nn-faq__item:last-child{border-bottom:1px solid var(--nn-line)}
.nn-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:16px 0;list-style:none;font-size:17px;font-weight:600;cursor:pointer}
.nn-faq summary::-webkit-details-marker{display:none}
.nn-faq summary:hover{color:var(--nn-accent)}
.nn-faq summary .nn-svg{width:20px;height:20px;color:var(--nn-text-3);transition:transform var(--ys-dur-short) var(--ys-ease-move)}
.nn-faq [open] summary .nn-svg{transform:rotate(45deg)}
.nn-faq__body{padding-bottom:20px;font-size:16px;line-height:1.7;color:var(--nn-text-2)}
.nn-final{padding-block:80px;border-top:1px solid var(--nn-line);text-align:center}
.nn-final__icon{width:48px;height:48px;margin-inline:auto;border:1px solid var(--nn-line-strong);border-radius:12px}
.nn-final .nn-h2{margin:16px auto 24px}
.nn-final>.nn-wrap>p{margin-top:12px}
.nn-final .nn-textlink{white-space:normal;text-wrap:balance}
.nn-footer__app{display:flex;flex-wrap:wrap;gap:0 16px;padding-block:16px}
.nn-footer__app a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--nn-text-2);font-size:14px;line-height:1.6;text-decoration:none;white-space:nowrap}
.nn-footer__app a:hover{color:var(--nn-text);text-decoration:underline;text-underline-offset:3px}
body[data-page="nexusnotes"] .ys-studio a{min-width:44px;white-space:nowrap}
body[data-page="nexusnotes"] .ys-studio span{word-break:keep-all}
.nn-lightbox,.nn-video-dialog{max-width:100vw;max-height:100dvh;padding:16px;border:0;background:transparent;color:#fff}
.nn-lightbox::backdrop,.nn-video-dialog::backdrop{background:rgba(0,0,0,.8)}
.nn-dialog__top{display:flex;justify-content:flex-end;align-items:center;gap:16px;margin-bottom:8px}
.nn-dialog-btn{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;cursor:pointer}
.nn-dialog-btn:hover{background:rgba(255,255,255,.2)}
.nn-lightbox__media{display:flex;justify-content:center;align-items:center}
body[data-page="nexusnotes"] #lightbox-image{max-height:min(86dvh,1496px);max-width:calc(100vw - 32px);width:auto;height:auto;border-radius:12px}
body[data-page="nexusnotes"] #lightbox-error{min-height:200px;display:flex;align-items:center;font-size:16px}
.nn-lightbox__bottom{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:8px}
body[data-page="nexusnotes"] #image-position{font-size:14px;font-weight:600}
body[data-page="nexusnotes"] #video-dialog-title{margin-right:auto;font-size:16px;font-weight:600}
body[data-page="nexusnotes"] #video-player{aspect-ratio:16/9;width:min(1080px,100vw - 32px);border-radius:12px;overflow:hidden;background:#000}
body[data-page="nexusnotes"] #video-player iframe{display:block;width:100%;height:100%;border:0}
.nn-video-dialog__fallback{margin-top:8px;font-size:14px;line-height:1.6}
.nn-video-dialog__fallback .nn-textlink{color:#fff;font-size:14px;text-decoration:underline}
.nn-noscript{padding:12px var(--nn-gutter);background:var(--nn-tile);font-size:14px;line-height:1.6}
@media (min-width:600px){
  .nn-actions{flex-direction:row;gap:12px}.nn-actions .nn-btn{width:auto}
  .nn-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nn-tile{display:block;min-height:120px}.nn-tile__icon{margin-top:0;margin-bottom:12px}
  .nn-footer__top{margin-left:auto}
}
@media (min-width:1024px){
  .nn-header__in{gap:24px}.nn-header__end{gap:12px}
  .nn-nav ul{display:flex;align-items:center}
  .nn-nav a{height:44px;min-height:44px;padding:8px 12px;border-radius:8px;font-size:16px}
  .nn-nav__mobile-only,#menu-toggle{display:none}
  .nn-btn{min-height:48px}.nn-btn--sm{min-height:40px}
  .nn-hero__text{padding-top:72px}
  .nn-connect__grid,.nn-keep__grid,.nn-video,.nn-faq-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:0}
  .nn-connect__text{grid-column:1/6;padding-top:24px}
  .nn-connect__panels{grid-column:7/13;margin-top:0}
  .nn-media{height:560px}
  .nn-bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nn-card{padding:24px}.nn-card__media{height:360px}
  .nn-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
  .nn-keep .nn-h2{grid-column:1/6;grid-row:1}
  .nn-rows{grid-column:7/13;grid-row:1/3;margin-top:0;padding-top:8px;align-self:start}
  .nn-keep__media{grid-column:1/6;grid-row:2;margin-top:32px}
  .nn-keep .nn-media{height:520px}.nn-keep .nn-shot{width:260px}
  .nn-uses{grid-template-columns:repeat(3,minmax(0,1fr))}
  .nn-use__body{margin-bottom:20px}.nn-use__body+.nn-btn{margin-top:auto}
  .nn-video__text,.nn-faq-grid>div:first-child{grid-column:1/5}
  .nn-video__media,.nn-faq{grid-column:5/13}
  .nn-final{padding-block:120px}
}
@media (prefers-reduced-motion:reduce){
  .nn-btn:active,.nn-poster:hover .nn-poster__play,.nn-panel.is-entering{transform:none}
  .nn-panel.is-entering{opacity:1}
}
@media print{
  .nn-header{position:static}.nn-menu-btn,.nn-lang,.nn-lightbox,.nn-video-dialog{display:none}
}

/* Round 2: the app's own graph surface stays in its light palette. */
.nn-hero{border-bottom:1px solid var(--nn-line);padding-bottom:32px}
.nn-hero__live{width:min(100%,400px);margin:40px auto 0}
.nn-graph{position:relative;--g-bg:#F9F8FF;--g-node:#445C90;--g-edge:rgba(26,27,32,.3);--g-edge-em:rgba(26,27,32,.6);--g-sugg:rgba(68,92,144,.6);--g-label:#1A1B20;--g-ring:#445C90;--g-pin:#1A1B20;--g-touch:rgba(26,27,32,.12);--g-card:#F3F2FA;--g-item:#EFEEF5;--g-muted:#45464F;--g-chip:#E3E2E9;--g-btn:#445C90;--g-on-btn:#FFFFFF}
.nn-graph__frame{width:100%;border-radius:var(--nn-r-shot);overflow:hidden;outline:1px solid var(--nn-line);outline-offset:-1px;box-shadow:var(--nn-shadow-shot);background:var(--g-bg);color-scheme:light}
.nn-graph__bar{display:block;width:100%;height:auto}
.nn-graph__stage{position:relative;height:400px;touch-action:pan-y;user-select:none}
.nn-graph__poster,.nn-graph__canvas{position:absolute;inset:0;width:100%;height:100%}
.nn-graph__poster .e{stroke:var(--g-edge);stroke-width:1.5;vector-effect:non-scaling-stroke}
.nn-graph__poster .e.is-em{stroke:var(--g-edge-em);stroke-width:2.5}
.nn-graph__poster .s{stroke:var(--g-sugg);stroke-width:1.5;stroke-dasharray:6.7 5.6;vector-effect:non-scaling-stroke}
.nn-graph__poster .g-pre{display:none}
.nn-graph__poster .n circle{fill:var(--g-node)}
.nn-graph__poster .n text{fill:var(--g-label);text-anchor:middle;font-size:15.2px}
.nn-graph__poster .is-dim,html[lang="en"] .nn-graph__poster .is-dim-en{opacity:.3}
html[lang="en"] .nn-graph__poster [data-only="ko"]{display:none}
.nn-graph__poster .ring{fill:none;stroke:var(--g-ring);stroke-width:3;vector-effect:non-scaling-stroke}
.nn-graph[data-live] .nn-graph__poster{display:none}
.nn-graph[data-live] .nn-graph__canvas{display:block}
html.nn-graph-pre .nn-graph__poster :is(.is-dim,.is-dim-en){opacity:1}
html.nn-graph-pre .nn-graph__poster :is(.g-sel,.g-added){display:none}
html.nn-graph-pre .nn-graph__poster .g-pre{display:inline}
html.nn-graph-pre .nn-graph__poster .e.is-em{stroke:var(--g-edge);stroke-width:1.5}
html.nn-graph-pre .nn-peek{visibility:hidden}
.nn-graph__card{position:absolute;left:12px;right:12px;bottom:12px;background:var(--g-card);color:var(--g-label);border-radius:28px;padding:12px 8px 12px 16px;box-shadow:0 2px 6px rgba(0,0,0,.12),0 8px 24px rgba(0,0,0,.10)}
.nn-graph__card[data-open="false"]{opacity:0;visibility:hidden;pointer-events:none}
.nn-peek__head,.nn-suggest__head{display:flex;align-items:center;gap:10px;min-height:44px}
.nn-peek__dot{width:12px;height:12px;border-radius:50%;background:var(--g-node);flex:none}
.nn-peek__title{flex:1;min-width:0;font-size:16px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nn-peek__chip{display:inline-flex;align-items:center;gap:4px;background:var(--g-chip);border-radius:var(--nn-r-pill);padding:3px 8px;font-size:12px;font-weight:600;color:var(--g-muted)}
.nn-peek__chip .nn-svg{width:14px;height:14px}
.nn-graph__x{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;flex:none;border:0;border-radius:50%;background:transparent;color:var(--g-label);cursor:pointer}
.nn-graph__x:hover{background:rgba(26,27,32,.08)}
.nn-graph__x .nn-svg{width:20px;height:20px}
.nn-peek__preview{font-size:14px;line-height:1.5;color:var(--g-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nn-peek__h{margin-top:8px;font-size:13px;font-weight:600}
.nn-peek__links{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:6px;padding:0 8px 0 0;list-style:none}
.nn-peek__links li{flex:1 0 140px;min-width:0}
.nn-peek__link{display:block;width:100%;scroll-snap-align:start;min-height:48px;text-align:left;background:var(--g-item);border:0;border-radius:12px;padding:8px 10px;color:var(--g-label);cursor:pointer}
.nn-peek__link b,.nn-peek__link span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.nn-peek__link b{font-size:14px;font-weight:700}
.nn-peek__link span{font-size:12px;line-height:1.4;color:var(--g-muted)}
.nn-peek__link:hover{background:#E6E5EC}
.nn-graph__frame button:focus-visible,.nn-graph__keys button:focus-visible{outline:2px solid var(--g-ring);outline-offset:2px}
.nn-suggest__head{gap:6px}
.nn-suggest__head b{font-size:14px;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nn-suggest__head>.nn-svg{width:20px;height:20px;color:var(--g-node)}
.nn-suggest__head>.nn-svg:nth-of-type(2){width:16px;height:16px;color:var(--g-muted)}
.nn-suggest__head .nn-graph__x{margin-left:auto}
.nn-suggest__add{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;width:100%;border:0;border-radius:var(--nn-r-pill);background:var(--g-btn);color:var(--g-on-btn);font-size:15px;font-weight:600;cursor:pointer}
.nn-suggest__add .nn-svg{width:18px;height:18px}
.nn-suggest__add:hover{filter:brightness(var(--ys-hover-brightness))}
.nn-graph__fit{position:absolute;right:12px;top:12px;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:14px;background:#DAE2FF;color:#2B4678;cursor:pointer}
.nn-graph__keys{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;list-style:none}
.nn-graph__keys:focus-within{z-index:3;left:8px;right:8px;top:calc((100vw - 32px)/3 + 8px);width:auto;height:auto;display:flex;gap:8px;margin:0;padding:4px;clip:auto;overflow-x:auto;background:var(--g-bg);border-radius:8px}
.nn-graph__keys button{min-height:44px;padding:0 12px;white-space:nowrap;border:1px solid var(--g-ring);border-radius:var(--nn-r-pill);background:var(--g-card);color:var(--g-label);font-size:14px;cursor:pointer}
.nn-graph__foot{margin-top:12px;text-align:center}
.nn-graph__note,.nn-graph__hint{font-size:13px;line-height:1.5;color:var(--nn-text-3)}
.nn-graph__hint{margin-top:4px}
.nn-graph__controls{display:flex;justify-content:center;gap:8px;margin-top:8px}
.nn-graph__ctl{min-height:44px;padding:0 14px;border-radius:var(--nn-r-sm);border:1px solid var(--nn-line-strong);background:transparent;color:var(--nn-text-2);font-size:14px;font-weight:500;cursor:pointer}
.nn-graph__ctl:hover{background:var(--nn-tile)}
[aria-pressed="false"] .nn-graph__ctl-off,[aria-pressed="true"] .nn-graph__ctl-on{display:none}
@media (max-width:599px){.nn-hero__icon,.nn-hero__name{display:none}}
@media (min-width:600px) and (max-width:1023px){.nn-graph__keys:focus-within{top:141px}}
@media (min-width:1024px){
 .nn-hero{padding-bottom:0}.nn-hero>.nn-wrap{display:grid;grid-template-columns:minmax(0,1fr) 380px;column-gap:64px;align-items:center;padding-block:56px}
 .nn-hero__text{padding-top:0;text-align:left}.nn-hero__icon{margin-inline:0}.nn-hero .nn-h1,.nn-hero .nn-lead{margin-inline:0}
 .nn-hero .nn-actions,.nn-hero .nn-meta{justify-content:flex-start}.nn-hero__live{width:380px;margin:0}
 .nn-graph__stage{height:440px}.nn-graph__poster .n text{font-size:13.4px}.nn-graph__foot{text-align:left}.nn-graph__controls{justify-content:flex-start}.nn-graph__keys:focus-within{top:135px}
}
@media (prefers-reduced-motion:no-preference){
 html[data-ys-motion="on"] .nn-graph__card[data-open="true"]{opacity:1;translate:none;transition:opacity var(--ys-dur-medium) var(--ys-ease-standard),translate var(--ys-dur-medium) var(--ys-ease-emphasized)}
 html[data-ys-motion="on"] .nn-graph__card[data-open="false"]{translate:0 var(--ys-dist-lg);transition:opacity var(--ys-dur-short) var(--ys-ease-exit),translate var(--ys-dur-short) var(--ys-ease-exit),visibility 0s linear var(--ys-dur-short)}
 .nn-suggest__add{transition:filter var(--ys-dur-micro) var(--ys-ease-standard)}
 .nn-lightbox[open],.nn-video-dialog[open]{opacity:1;translate:none;transition:opacity var(--ys-dur-medium) var(--ys-ease-emphasized),translate var(--ys-dur-medium) var(--ys-ease-emphasized)}
 .nn-lightbox[open]::backdrop,.nn-video-dialog[open]::backdrop{opacity:1;transition:opacity var(--ys-dur-short) var(--ys-ease-standard)}
 @starting-style{.nn-lightbox[open],.nn-video-dialog[open]{opacity:0;translate:0 var(--ys-dist-sm)}.nn-lightbox[open]::backdrop,.nn-video-dialog[open]::backdrop{opacity:0}}
}
@media print{.nn-graph__canvas,.nn-graph__fit,.nn-graph__keys,.nn-graph__controls,.nn-graph__hint{display:none!important}.nn-graph[data-live] .nn-graph__poster{display:block}.nn-graph__frame{box-shadow:none}}

body[data-page="nexusnotes"] .ys-web a{min-width:44px}
body[data-page="nexusnotes"] .ys-web__h{word-break:keep-all}
@media (max-width:599px){.nn-hero__text{padding-top:32px}.nn-hero__live{margin-top:24px}}
/* base.css's universal .01ms reduced transitions can defer inherited visibility.
   The graph's reduced snapshots must also accept focus in the same event. */
@media (prefers-reduced-motion:reduce){.nn-graph,.nn-graph *{transition:none!important;animation:none!important}}