
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700;800&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');
/* ── NANOTRADING 공용 상단바 — 디자인 핸드오프 '옵션 2b' 구현 ─────────────────────────
   4행 고정: 내비 46 + 마켓 테이프 32 + 지표 32 + 뉴스 34 = 144px.
   ⚠ 행 높이는 '레이아웃 점프 금지' 조건이라 값이다. 바꾸려면 tests/topbar/same.mjs 도 같이 고칠 것.
   ⚠ 예전 BTC 시세행(.tsecbar)·OHLC행(.tquote)은 핸드오프 지시대로 뺐다(README '2개 행을 제거').
      BTC.D·공포탐욕·펀딩↑↓·BTC·ETH 는 지표행으로 옮겨 살아 있다. */
.nbar{
 --nb-bg:#000;--nb-nav:#050503;--nb-stat:#060604;--nb-menu-on:#191204;--nb-menu-hv:#17110A;
 --nb-amber:#FFA519;--nb-amber-b:#FFD75E;--nb-amber-s:#FFC94A;--nb-amber-d:#7A5200;
 --nb-up:#00D26A;--nb-down:#FF4438;--nb-news:#0D2FB5;--nb-news-t:#9FB4FF;
 --nb-ink:#F0F0EA;--nb-sym:#DCDCD4;--nb-ctl:#D8D8D0;--nb-mut:#8F8F86;
 --nb-line-s:#33332E;--nb-line:#3A3A33;--nb-line-r:#1C1C18;--nb-line-c:#161612;--nb-line-n:rgba(255,255,255,.25);
 --nb-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
 --nb-sans:'Pretendard Variable','Pretendard',system-ui,-apple-system,sans-serif;
 /* 옛 토큰 별칭 — 바 안쪽에서 --t-* 를 참조하는 잔여 규칙이 조용히 색을 잃지 않게 */
 --t-bg:#000;--t-line:var(--nb-line-r);--t-ink:var(--nb-ink);--t-ink2:var(--nb-mut);--t-ink3:var(--nb-mut);
 --t-accent:var(--nb-amber);--t-pos:var(--nb-up);--t-neg:var(--nb-down);
 font-family:var(--nb-mono);background:var(--nb-bg);color:var(--nb-ink);font-size:12.5px;
 font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 display:block;position:sticky;top:0;z-index:60;flex:0 0 auto;
 margin:0;padding:0;border:0;width:auto;min-width:0;max-width:none;min-height:0;max-height:none;overflow:visible;}
/* ── 상속 차단 ─────────────────────────────────────────────────────────────────
   바는 각 페이지의 DOM 안에 산다. 그래서 '상속되는 속성' 은 아무것도 안 써도 host 가 넣어준다
   (실측: 7페이지 × 18요소 × 30속성 = 3780칸 중 220칸이 페이지마다 달랐다 — 글꼴 굵기·자간·
   줄높이·white-space 가 host 를 따라 흔들리고 있었다).
   ⚠ 여기서 상속 속성을 전부 못박는다. 아래 개별 규칙(.nbar .ttk 등)은 특이도가 높아 그대로 이긴다.
     새 규칙을 쓸 때 값을 안 적으면 '페이지 값' 이 아니라 '이 기본값' 이 온다 — 그게 목적이다. */
.nbar,.nbar *{
 font-family:var(--nb-mono);font-size:12.5px;font-weight:400;font-style:normal;line-height:1.25;
 letter-spacing:0;word-spacing:normal;text-align:left;text-transform:none;text-indent:0;
 white-space:nowrap;color:var(--nb-ink);visibility:visible;
 font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1;box-sizing:border-box;border-radius:0;}
/* ── 하드 리셋 (상속 안 되는 속성) ──────────────────────────────────────────────
   레이아웃 속성은 상속되지 않는다. 대신 페이지 CSS 가 '바 요소를 직접 매칭' 할 때 샌다 —
   스켈핑차트는 자기 상단바가 .tfunc/.tstrip/.tlang/.ttl 로 클래스 이름이 완전히 겹치고,
   그 규칙들이 스코프 없이 쓰여 있어서 공용바까지 같이 맞았다(.tstrip{gap:15px} 등).
   ⚠ .nbar.nbar 로 특이도를 (0,2,0) 으로 올린다 — 페이지의 .tstrip 은 (0,1,0) 이라
     BAR_CSS 가 먼저 오든 나중에 오든 진다. 페이지 순서에 기대지 않기 위해서다.
   ⚠ 아래 개별 규칙도 대부분 (0,2,0) 인데 '뒤에' 오므로 동점에서 이긴다 — 순서를 바꾸지 말 것.
   position·display·overflow·flex 는 일부러 뺐다. 되돌리면 sticky·행 배치가 통째로 무너진다. */
.nbar.nbar *{margin:0;padding:0;border:0;outline:0;background:transparent;box-shadow:none;
 text-decoration:none;list-style:none;float:none;vertical-align:baseline;
 width:auto;height:auto;min-width:0;min-height:0;max-width:none;max-height:none;
 gap:0;transform:none;filter:none;opacity:1;}
.nbar .tnum{letter-spacing:-.01em;}
/* 각 탭의 기존(제각각) 상단바를 숨기고 공용 .nbar 로 통일 */
.t-funcbar,.t-secbar,.t-quoteline,.t-quote,.t-ticker,.t-strip,.t-topbar,.t-newsband{display:none !important;}
/* ⚠ 스켈핑차트가 가진 '자기 상단바' 를 숨긴다. 공용바(.nbar)와 둘 다 뜨면 화면에 상단바가
   두 개가 되고, 페이지마다 다른 상단바가 뜨는 그 증상이 된다. 클래스 이름이 하이픈 없는
   .tfunc/.tsecbar/... 라 위 숨김 목록에 하나도 안 걸렸다. */
.troot:not(.nbar) > .tfunc,.troot:not(.nbar) > .tsecbar,.troot:not(.nbar) > .tquote,
.troot:not(.nbar) > .tticker,.troot:not(.nbar) > .tstrip,.troot:not(.nbar) > .tnews{display:none !important;}

/* ── Row 1 · 내비게이션 (46px) ── */
.nbar .tfunc{display:flex;align-items:stretch;height:46px;background:var(--nb-nav);border-bottom:1px solid var(--nb-line-s);white-space:nowrap;overflow:hidden;}
.nbar .tfunc .brand{display:flex;align-items:center;gap:9px;padding:0 20px;flex:0 0 auto;
 background:var(--nb-amber);color:#000;font-family:var(--nb-mono);font-size:15px;font-weight:700;letter-spacing:1.6px;}
.nbar .tfunc .brand::before{content:'';width:7px;height:7px;background:#000;flex:0 0 auto;}
.nbar .tfunc .tf-navwrap{display:flex;align-items:stretch;flex:1;min-width:0;overflow:hidden;padding:0 6px;}
.nbar .tfunc .tf-navwrap a{display:flex;align-items:center;gap:7px;padding:0 13px;flex:0 0 auto;cursor:pointer;text-decoration:none;
 border-bottom:2px solid transparent;background:transparent;color:var(--nb-sym);
 font-family:var(--nb-sans);font-size:14px;font-weight:700;letter-spacing:-.4px;transition:background .12s linear;}
.nbar .tfunc .tf-navwrap a>i:first-child{font-style:normal;font-family:var(--nb-mono);font-size:12.5px;font-weight:800;color:var(--nb-amber);letter-spacing:0;}
.nbar .tfunc .tf-navwrap a:hover{background:var(--nb-menu-hv);}
.nbar .tfunc .tf-navwrap a.on{background:var(--nb-menu-on);color:var(--nb-amber-b);border-bottom-color:var(--nb-amber);}
.nbar .tf-new{background:var(--nb-down);color:#fff;font-family:var(--nb-mono);font-style:normal;font-size:8.5px;font-weight:700;padding:2px 4px;letter-spacing:.5px;line-height:1;}
/* 🔥 배지 — 배경 없이 이모지만. NEW 알약 옆에 또 알약을 깔면 탭 줄이 색으로 시끄러워진다. */
.nbar .tf-fire{font-style:normal;font-size:9px;line-height:1;letter-spacing:-.5px;filter:saturate(1.15);}
/* 넘치는 메뉴 → » 드롭다운. 없으면 폭이 좁을 때 뒤쪽 탭(이벤트·토큰 언락)이 화면에서 통째로 사라진다
   — 잘린 게 아니라 '갈 수 없는' 상태가 된다. 핸드오프 Responsive 의 권장안. */
.nbar .tfunc .tf-navwrap a.nb-ovf{display:none;gap:0;padding:0 11px;color:var(--nb-amber);font-family:var(--nb-mono);font-size:15px;font-weight:800;letter-spacing:0;}
.nbar .tfunc .tf-navwrap a.nb-ovf.show{display:flex;}
/* 폭이 줄면 **장식부터** 버린다 — 탭 자체는 마지막까지 남긴다.
   ⚠ 왜: 잠금이 풀린 화면은 탭이 10개인데 1600px 에서 필요 폭이 1306px, 쓸 수 있는 폭이
     802px 이라 절반이 » 로 접혔다(실측 2026-08-16). » 는 갈 수는 있지만 한 번 더 눌러야
     하고, 무엇이 있는지 안 보인다. 번호(95))·물음표·불꽃은 **이름이 아니다** — 폭이
     모자라면 이것들이 먼저 없어지는 게 맞다. 이름을 줄이는 건 마지막 수단이고 안 한다. */
@media (max-width:2099px){ .nbar .tfunc .tf-navwrap a>i:first-child{display:none;} }
@media (max-width:1999px){ .nbar .tfunc .tf-navwrap a .qh{display:none;}
 .nbar .tf-fire{display:none;} .nbar .tfunc .tf-navwrap a{padding:0 9px;gap:5px;} }
@media (max-width:1699px){ .nbar .tf-new{display:none;}
 .nbar .tfunc .tf-navwrap a{padding:0 7px;letter-spacing:-.6px;} }
@media (max-width:1599px){ .nbar .tfunc .tf-navwrap a{padding:0 6px;font-size:13px;} }
@media (max-width:1439px){ .nbar .tfunc .tf-navwrap a{padding:0 4px;font-size:12px;letter-spacing:-.8px;} }
/* ⚠ 전체화면 오버레이(파이어 스캐너)가 열려 있는 동안은 떠 있는 것들을 내린다.
   맥북(1440~1512 × 790~860)에서 설문 말풍선 두 개가 스캐너 우측 상세를 각각 4만px² 씩
   덮고 있었다(실측). FAB 3개는 우측 가장자리를 덮었다. 화면이 좁을수록 심해진다.
   ⚠ 사용자가 직접 켜고 끄는 `.nt-fabhide` 를 재사용하지 않는다 — 스캐너가 그걸 껐다 켜면
     사용자가 접어 둔 설정을 덮어쓴다. 별도 클래스로 겹쳐 쓴다.
   ⚠ 개발 HUD(#fk_normhud·#fk_labshud)도 같이 내린다. 스캐너 위로 비쳐서 좌측 필터의
     상세 조건을 가리고 있었다(제보 스크린샷). */
html.nt-scanopen #bailFab, html.nt-scanopen #bailBub,
html.nt-scanopen #dpmChatRoot, html.nt-scanopen #dpmChatBtn,
html.nt-scanopen #nfbDemo, html.nt-scanopen #nfbBub,
html.nt-scanopen #nanoBNRoot, html.nt-scanopen #npatchRoot,
html.nt-scanopen #fk_normhud, html.nt-scanopen #fk_labshud{display:none !important;}
.nb-ovfpop{position:fixed;z-index:100001;min-width:190px;background:#0A0A08;border:1px solid var(--nb-line,#3A3A33);box-shadow:0 12px 32px rgba(0,0,0,.6);padding:4px 0;}
.nb-ovfpop a{display:flex;align-items:center;gap:7px;padding:9px 13px;cursor:pointer;color:#D8D8D0;
 font-family:'Pretendard Variable','Pretendard',system-ui,sans-serif;font-size:12.5px;font-weight:600;white-space:nowrap;}
.nb-ovfpop a:hover{background:#17110A;color:#FFC94A;}
.nb-ovfpop a i{font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11.5px;font-weight:800;color:#FFA519;}
/* 우측 컨트롤 그룹 — 폭이 줄면 메뉴가 먼저 잘리고 여기는 고정(핸들오프 Responsive) */
.nbar .tfunc .nb-ctl{display:flex;align-items:center;gap:7px;padding:0 15px;flex:0 0 auto;white-space:nowrap;}
.nbar .tfunc .ttl{display:flex;align-items:center;margin-right:6px;overflow:visible;color:var(--nb-amber);
 font-family:var(--nb-mono);font-size:12px;font-weight:600;font-style:italic;letter-spacing:0;}
/* ⚠ 영문 부제는 폭이 좁아지면 버린다(2026-08-23). '펀드레이징' 이 붙어 탭이 11개가 되자
   1366px 에서 필요 624 / 가용 568 로 넘쳤다(tests/topbar/same.mjs 가 잡았다).
   이 부제는 **217px 짜리 순수 장식**이고 같은 말이 <title> 에도 있다 — 탭 사다리 주석의
   원칙('폭이 줄면 장식부터 버린다 · 이름을 줄이는 건 마지막 수단')대로면 탭 글자를
   11.5px 로 줄이기 전에 이게 먼저 나가야 한다. 버리면 가용폭이 568 → 705 가 된다.
   ⚠ 반드시 위 기본 규칙 **뒤**에 둘 것. 탭 사다리(@media 1999/1699/1599/1439) 쪽에
     넣었더니 그 블록이 기본 .ttl{display:flex} 보다 앞이라 같은 특이도에서 밀려
     **아무 일도 일어나지 않았다**(빌드는 통과하고 화면만 그대로였다). */
@media (max-width:1699px){ .nbar .tfunc .ttl{display:none;} }
.nbar .nb-btn{display:flex;align-items:center;gap:6px;padding:4px 9px;cursor:pointer;text-decoration:none;background:transparent;
 border:1px solid var(--nb-line);color:var(--nb-ctl);font-family:var(--nb-sans);font-size:11.5px;font-weight:600;
 transition:border-color .12s linear,color .12s linear;}
.nbar .nb-btn:hover{border-color:var(--nb-amber);color:var(--nb-amber-s);}
.nbar .nb-btn.nb-mono{font-family:var(--nb-mono);font-weight:500;}
.nbar .nb-dot{width:6px;height:6px;border-radius:50%;background:var(--nb-up);flex:0 0 auto;}
.nbar .tlang{display:flex;align-items:stretch;border:1px solid var(--nb-line);flex:0 0 auto;padding:0;gap:0;}
.nbar .tlang a{display:flex;align-items:center;padding:4px 8px;cursor:pointer;border:0;border-left:1px solid var(--nb-line);
 background:transparent;color:var(--nb-mut);font-family:var(--nb-sans);font-size:11.5px;font-weight:500;}
.nbar .tlang a:first-child{border-left:0;}
.nbar .tlang a[data-l="en"]{font-family:var(--nb-mono);}
.nbar .tlang a.on{background:var(--nb-amber);color:#000;font-weight:700;}
.nbar .tfunc .bxchip2{display:flex;align-items:center;gap:5px;padding:4px 9px;flex:0 0 auto;cursor:pointer;text-decoration:none;
 border:1px solid var(--nb-amber-d);color:var(--nb-amber-s);font-family:var(--nb-sans);font-size:11.5px;font-weight:600;transition:border-color .12s linear;}
.nbar .tfunc .bxchip2:hover{border-color:var(--nb-amber);}
.nbar .tfunc .uchip2{display:flex;align-items:center;gap:6px;padding:4px 9px;flex:0 0 auto;cursor:pointer;text-decoration:none;
 border:1px solid var(--nb-line);color:var(--nb-ctl);font-family:var(--nb-mono);font-size:11.5px;font-weight:500;letter-spacing:.02em;
 transition:border-color .12s linear,color .12s linear;}
.nbar .tfunc .uchip2:hover{border-color:var(--nb-amber);color:var(--nb-amber-s);}
.nbar .tfunc .uchip2 .usq{width:6px;height:6px;border-radius:50%;background:var(--nb-mut);flex:0 0 auto;}
/* [접기] 메뉴줄만 남기고 아래 데이터 3행을 통째로 접는다 — 차트에 98px 을 돌려준다.
   ⚠ 메뉴줄은 절대 접지 않는다. 그건 내비게이션이라 사라지면 길을 잃는다. */
.nbar.nb-fold .tticker,.nbar.nb-fold .tstrip,.nbar.nb-fold .tnews{display:none !important;}
.nbar .nb-fold-btn{padding:4px 7px;font-family:var(--nb-mono);font-weight:700;}
/* 도움말(?) — 어두운 내비 위라 보더/글자를 밝은 쪽으로 */
.nbar .qh{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;border:1px solid var(--nb-line);border-radius:99px;
 color:var(--nb-mut);font-family:var(--nb-mono);font-size:9px;font-weight:700;font-style:normal;cursor:help;position:relative;flex:none;user-select:none;-webkit-user-select:none;letter-spacing:0;}
.nbar .qh:hover{color:var(--nb-amber);border-color:var(--nb-amber);}
.nbar .qh:hover::after{content:attr(data-tip);position:absolute;left:0;top:18px;z-index:300;width:250px;padding:7px 9px;
 background:rgba(5,6,7,.96);border:1px solid var(--nb-amber);color:var(--nb-ink);font-family:var(--nb-sans);font-size:11.5px;font-weight:500;font-style:normal;
 line-height:1.5;white-space:normal;box-shadow:0 8px 24px rgba(0,0,0,.7);pointer-events:none;letter-spacing:0;}
@media(max-width:1600px){ .nbar .tfunc .qh{display:none !important;} }

/* ── Row 2 · 마켓 텍스트 테이프 (32px) ── */
.nbar .tticker{display:flex;align-items:center;height:32px;background:var(--nb-bg);border-bottom:1px solid var(--nb-line-r);overflow:hidden;position:relative;
 -webkit-mask-image:linear-gradient(90deg,#000 96%,transparent);mask-image:linear-gradient(90deg,#000 96%,transparent);}
.nbar .ttrack{display:inline-flex;align-items:center;height:100%;will-change:transform;}
/* transform 만 쓰는 합성 레이어 마퀴 — 파이어차트 메인 스레드가 잠깐 바빠도 계속 흐른다.
   총 내용은 같은 묶음 두 벌이라 -50%가 정확히 한 벌의 끝이다. duration 은 bar.js 가
   첫 데이터 폭/40px·s 로 한 번만 계산한다(매 프레임 레이아웃 읽기 금지). */
@keyframes nbMarquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.nbar .ttrack.nb-marquee,.nbar .ntrack.nb-marquee{animation:nbMarquee var(--nb-marquee-sec,120s) linear infinite;}
.nbar .tticker:hover .ttrack.nb-marquee,.nbar .tnews:hover .ntrack.nb-marquee{animation-play-state:paused;}
.nbar .ttk{display:flex;align-items:baseline;gap:8px;padding:0 16px;flex:0 0 auto;white-space:nowrap;
 border-right:1px solid var(--nb-line-c);font-family:var(--nb-mono);font-size:12.5px;}
.nbar .ttk b{font-weight:600;color:var(--nb-sym);}
.nbar .ttk .px{font-weight:400;color:var(--nb-mut);}
.nbar .ttk .cg{font-weight:600;}

/* ── Row 3 · 지표 요약 (32px) ── */
.nbar .tstrip{display:flex;align-items:center;height:32px;padding:0 4px;background:var(--nb-stat);border-bottom:1px solid var(--nb-line-r);overflow:hidden;}
.nbar .nb-stats{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden;
 -webkit-mask-image:linear-gradient(90deg,#000 96%,transparent);mask-image:linear-gradient(90deg,#000 96%,transparent);}
.nbar .tstat{display:flex;align-items:baseline;gap:7px;padding:0 13px;flex:0 0 auto;white-space:nowrap;font-size:12px;}
.nbar .tstat em{font-style:normal;font-family:var(--nb-sans);font-size:11px;font-weight:600;color:var(--nb-mut);}
.nbar .tstat b{font-family:var(--nb-mono);font-size:12px;font-weight:600;color:var(--nb-ink);}
.nbar .nb-live{display:flex;align-items:center;gap:7px;margin-left:auto;padding:0 14px;flex:0 0 auto;white-space:nowrap;font-family:var(--nb-mono);font-size:11.5px;}
.nbar .nb-live .lv{color:var(--nb-up);font-weight:700;}
.nbar .nb-live .mt{color:var(--nb-mut);}
.nbar .nb-live .kr{font-family:var(--nb-sans);}
/* 연결 끊김 — 핸드오프 Loading/Error: dot 을 빨강으로, 라벨을 DISCONNECTED 로 */
.nbar .nb-live.off .nb-dot{background:var(--nb-down);animation:nbpulse 1s ease-in-out infinite;}
.nbar .nb-live.off .lv{color:var(--nb-down);}

/* ── Row 4 · 뉴스 티커 (34px) ── */
.nbar .tnews{display:flex;align-items:stretch;height:34px;background:var(--nb-news);overflow:hidden;position:relative;}
.nbar .tnews .tag{display:flex;align-items:center;padding:0 16px;flex:0 0 auto;z-index:2;background:#000;color:#fff;
 font-family:var(--nb-mono);font-size:12.5px;font-weight:700;letter-spacing:2px;}
.nbar .tnews .nwrap{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden;
 -webkit-mask-image:linear-gradient(90deg,#000 95%,transparent);mask-image:linear-gradient(90deg,#000 95%,transparent);}
.nbar .ntrack{display:inline-flex;align-items:center;height:100%;white-space:nowrap;will-change:transform;}
.nbar .nit{display:flex;align-items:center;gap:8px;padding:0 15px;flex:0 0 auto;white-space:nowrap;
 border-right:1px solid var(--nb-line-n);font-family:var(--nb-mono);font-size:12.5px;}
.nbar .nit .num{color:var(--nb-amber-b);font-weight:700;}
.nbar .nit .src{color:var(--nb-amber-b);font-size:10px;font-weight:700;border:1px solid var(--nb-line-n);padding:1px 4px;}
.nbar .nit .tm{color:var(--nb-news-t);font-weight:600;}
.nbar .nit .txt{color:#fff;font-family:var(--nb-sans);font-size:12.5px;font-weight:500;}
.nbar .tnx{position:absolute;right:0;top:0;bottom:0;display:flex;align-items:center;padding:0 10px;z-index:3;cursor:pointer;
 background:var(--nb-news);color:var(--nb-news-t);font-family:var(--nb-mono);font-weight:700;box-shadow:-10px 0 10px rgba(13,47,181,.9);}
.nbar .tnx:hover{color:#fff;}

/* ── 좁은 폭 · 폰: 메뉴를 ☰ 드롭다운으로 ── */
.nbar .tfunc .tf-burger{display:none;align-items:center;padding:0 12px;flex:0 0 auto;cursor:pointer;
 background:#000;color:var(--nb-amber);font-family:var(--nb-mono);font-size:15px;font-weight:800;}
@media(max-width:760px){
 .nbar .tfunc{position:relative;}
 .nbar .tfunc .tf-burger{display:flex;}
 .nbar .tfunc .tf-navwrap{display:none;position:fixed;top:46px;left:0;flex-direction:column;padding:0;background:#000;
  border:1px solid var(--nb-amber);box-shadow:0 14px 34px rgba(0,0,0,.7);z-index:100000;min-width:200px;max-height:74vh;overflow:auto;}
 .nbar .tfunc .tf-navwrap.open{display:flex;}
 .nbar .tfunc .tf-navwrap a{padding:11px 14px;background:#000;color:var(--nb-amber);border-bottom:1px solid #1d2126;}
 .nbar .tfunc .tf-navwrap a.on{background:#000;}
 .nbar .tfunc .tf-navwrap .qh{display:none !important;}
 .nbar .tfunc .ttl{display:none;}
 .nbar .tfunc .nb-ctl{padding:0 8px;gap:5px;margin-left:auto;}
 .nbar .nb-ctl>.tlang,.nbar .nb-ctl>.bxchip2,.nbar .nb-ctl>.nb-page{display:none !important;}
 .nbar .tfunc .tf-navwrap .tf-mnu{display:block;border-top:1px solid var(--nb-amber);}
 .nbar .tticker,.nbar .tstrip{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
 .nbar .tticker::-webkit-scrollbar,.nbar .tstrip::-webkit-scrollbar{display:none;height:0;}
 #nbm_box{display:none !important;}   /* 보상함: 앱에서 우선 숨김(요청) */
}
.nbar .tfunc .tf-mnu{display:none;}
.nbar .tf-mnu a{display:flex;align-items:center;gap:8px;border-bottom:1px solid #1d2126;background:#000;color:var(--nb-amber);padding:11px 14px;font-weight:700;cursor:pointer;}
.nbar .tf-mnu .tfm-lang{display:flex;} .nbar .tf-mnu .tfm-lang a{flex:1;justify-content:center;border-right:1px solid #1d2126;}
.nbar .tf-mnu .tfm-lang a.on{background:var(--nb-amber);color:#000;}

/* ── 계정 칩(로그인됨) · 계정 드롭다운 · 로그인 모달 — 본문(body) 부착 요소는 리터럴 색 ── */
.nbar .tfunc .tf-acct{display:flex;align-items:center;gap:6px;padding:4px 9px;flex:0 0 auto;cursor:pointer;text-decoration:none;
 background:transparent;border:1px solid var(--nb-line);color:var(--nb-ctl);font-family:var(--nb-mono);font-size:11.5px;font-weight:500;
 transition:border-color .12s linear,color .12s linear;}
.nbar .tfunc .tf-acct .ta-dot{width:6px;height:6px;border-radius:50%;background:var(--nb-up);flex:0 0 auto;}
.nbar .tfunc .tf-acct .ta-nm{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.nbar .tfunc .tf-acct .ta-ar{font-style:normal;opacity:.7;font-size:10px;}
.nbar .tfunc .tf-acct:hover{border-color:var(--nb-amber);color:var(--nb-amber-s);}
.nbar .tfunc .tf-acct:hover .ta-nm{color:var(--nb-amber-s);}
.tf-acctpop{position:fixed;z-index:99999;min-width:180px;background:#0A0A08;border:1px solid #3A3A33;box-shadow:0 12px 32px rgba(0,0,0,.6);padding:8px;font-family:'JetBrains Mono',ui-monospace,monospace;border-radius:0;}
.tf-acctpop .tap-hd{display:flex;flex-direction:column;gap:2px;padding:3px 6px 8px;border-bottom:1px solid #1C1C18;margin-bottom:7px;}
.tf-acctpop .tap-nm{color:#FFA519;font-weight:700;font-size:13px;} .tf-acctpop .tap-em{color:#FFC94A;font-size:10px;word-break:break-all;}
.tf-acctpop .tap-nick{padding:2px 6px 8px;border-bottom:1px solid #1C1C18;margin-bottom:7px;}
.tf-acctpop .tap-nlb{font-size:10px;color:#8F8F86;margin-bottom:4px;letter-spacing:.03em;}
.tf-acctpop .tap-nrow{display:flex;gap:5px;}
.tf-acctpop .tap-nin{flex:1;min-width:0;background:#000;border:1px solid #3A3A33;color:#D8D8D0;font-family:inherit;font-size:12px;padding:5px 7px;border-radius:0;}
.tf-acctpop .tap-nin:focus{outline:none;border-color:#FFA519;}
.tf-acctpop .tap-nbtn{background:transparent;border:1px solid #FFA519;color:#FFA519;font-weight:700;font-size:11px;padding:0 10px;cursor:pointer;border-radius:0;white-space:nowrap;transition:background .12s,color .12s;}
.tf-acctpop .tap-nbtn:hover{background:#FFA519;color:#000;} .tf-acctpop .tap-nbtn.ok{background:#00D26A;border-color:#00D26A;color:#04210f;}
.tf-acctpop .tap-box{display:block;text-align:center;cursor:pointer;background:transparent;color:#FFC94A;border:1px solid #7A5200;font-weight:600;padding:7px;margin-bottom:6px;letter-spacing:.03em;}
.tf-acctpop .tap-box:hover{border-color:#FFA519;}
/* 약관·처리방침 — 어느 화면에서든 계정 메뉴로 닿을 수 있어야 한다(제보: "사용약관 어디서 볼수 있는데?").
   보상함(tap-box)처럼 강조하면 메뉴가 버튼 밭이 되므로 조용한 글줄로 둔다. */
.tf-acctpop .tap-legal{display:block;text-align:center;cursor:pointer;color:#8F8F86;font-size:11px;font-weight:500;padding:5px;letter-spacing:.02em;text-decoration:none;}
.tf-acctpop .tap-legal:hover{color:#FFC94A;}
.tf-acctpop .tap-legal+.tap-out{margin-top:7px;}
.tf-acctpop .tap-out{display:block;text-align:center;cursor:pointer;background:#FFA519;color:#000;font-weight:700;padding:6px;letter-spacing:.04em;}
.tf-acctpop .tap-out:hover{filter:brightness(1.12);}
.tf-loginov{position:fixed;inset:0;z-index:100000;background:rgba(2,1,5,.72);display:flex;align-items:center;justify-content:center;padding:24px;font-family:'JetBrains Mono',ui-monospace,monospace;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);}
/* ══ 로그인 모달 — 핸드오프 5b(부팅 시퀀스 안) ══
   준비중 4개(카카오·네이버·X·인스타)와 '또는' 구분선을 뺐다. 실제 선택지는 하나뿐인데
   목록이 화면 절반을 먹으면서 '아직 덜 만든 서비스' 로 읽혔다 — 사실을 한 줄로 말한다.
   비는 상단은 부팅 시퀀스 히어로가 채운다: 로그인을 누르는 것이 부팅의 마지막 단계로 읽히게. */
.tf-loginbox{position:relative;width:610px;max-width:94vw;background:#0B0B09;border:1px solid #2A2A26;border-top:2px solid #FFA519;border-radius:0;box-shadow:0 40px 90px rgba(0,0,0,.72);overflow:hidden;animation:tlbIn .32s ease-out both;}
@keyframes tlbIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
/* ① 히어로 — 부팅 시퀀스 212px */
.tf-loginbox .tlb-hero{position:relative;overflow:hidden;height:212px;background:#000;border-bottom:1px solid #1C1C18;}
.tf-loginbox .tlb-hero::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(460px 240px at 50% 120%,rgba(255,165,25,.10) 0%,transparent 70%);}
.tf-loginbox .tlb-brand{position:relative;z-index:1;display:flex;align-items:center;gap:11px;padding:24px 26px 0;}
.tf-loginbox .tlb-brand .bdot{width:28px;height:28px;border-radius:0;background:#FFA519;box-shadow:none;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.tf-loginbox .tlb-brand .bdot i{width:10px;height:10px;background:#000;display:block;}
.tf-loginbox .tlb-brand .bnm{font-family:'JetBrains Mono','IBM Plex Mono',monospace;font-size:23px;font-weight:800;letter-spacing:1.5px;color:#F0F0EA;}
.tf-loginbox .tlb-brand .btag{font-size:9.5px;font-weight:700;letter-spacing:1.4px;color:#FFC94A;border:1px solid #7A5200;border-radius:0;padding:2px 6px;}
.tf-loginbox .tlb-log{position:relative;z-index:1;margin-top:18px;padding:0 26px;display:flex;flex-direction:column;gap:5px;}
.tf-loginbox .tlb-log .r{display:flex;align-items:center;gap:8px;font-size:11.5px;white-space:nowrap;opacity:0;transform:translateY(6px);transition:opacity .26s ease,transform .26s ease;}
.tf-loginbox .tlb-log .r.on{opacity:1;transform:none;}
.tf-loginbox .tlb-log .r .p{font-weight:700;color:#FFA519;}
.tf-loginbox .tlb-log .r .l{font-family:Pretendard,sans-serif;font-weight:500;color:#DCDCD4;}
.tf-loginbox .tlb-log .r .d{flex:1;overflow:hidden;color:#2A2A26;letter-spacing:1px;}
.tf-loginbox .tlb-log .r .k{font-weight:700;color:#00D26A;}
.tf-loginbox .tlb-log .r .k.bad{color:#FF4438;}
.tf-loginbox .tlb-log .r.wait{margin-top:2px;}
.tf-loginbox .tlb-log .r.wait .l{font-weight:600;color:#FFC94A;}
.tf-loginbox .tlb-cur{display:inline-block;width:7px;height:13px;background:#FFA519;animation:tlbCur 1s step-end infinite;}
@keyframes tlbCur{0%,50%{opacity:1;}50.01%,100%{opacity:0;}}
/* ② 본문 */
.tf-loginbox .tlb-body{padding:28px 26px 24px;display:block;}
.tf-loginbox h1.tlb-h1{margin:0;font-family:Pretendard,sans-serif;font-size:30px;font-weight:800;letter-spacing:-1px;color:#F0F0EA;}
.tf-loginbox .tlb-sub{margin:10px 0 0;font-family:Pretendard,sans-serif;font-size:13.5px;font-weight:500;letter-spacing:-.3px;color:#8F8F86;line-height:1.5;}
.tf-loginbox .tlb-google{display:flex;align-items:center;gap:16px;width:100%;height:66px;padding:0 22px;margin-top:22px;cursor:pointer;background:#fff;border:0;border-radius:0;font-family:Pretendard,sans-serif;font-size:17px;font-weight:700;letter-spacing:-.4px;color:#1A1A1A;box-shadow:0 0 0 1px #FFD75E,0 10px 34px rgba(255,165,25,.18);transition:box-shadow .2s ease;}
.tf-loginbox .tlb-google:hover{transform:none;box-shadow:0 0 0 1px #FFA519,0 16px 44px rgba(255,165,25,.30);}
.tf-loginbox .tlb-google:active{transform:translateY(1px);}
.tf-loginbox .tlb-google.busy{pointer-events:none;opacity:.6;}
.tf-loginbox .tlb-google .gg{width:24px;height:24px;flex-shrink:0;}
.tf-loginbox .tlb-google .arr{margin-left:auto;color:#75756C;font-size:17px;}
.tf-loginbox .tlb-note{display:flex;align-items:flex-start;gap:9px;margin-top:18px;font-family:Pretendard,sans-serif;font-size:11.5px;font-weight:500;color:#75756C;line-height:1.5;}
.tf-loginbox .tlb-note i{width:5px;height:5px;background:#FFA519;flex:0 0 auto;margin-top:5px;}
.tf-loginbox .tlb-err{margin-top:10px;font-family:Pretendard,sans-serif;font-size:11.5px;color:#FF4438;}
/* ③ 푸터 */
.tf-loginbox .tlb-ft{display:flex;flex-direction:column;align-items:center;gap:14px;padding:16px 26px 22px;border-top:1px solid #1C1C18;background:#080807;}
.tf-loginbox .tlb-ft .agree{font-family:Pretendard,sans-serif;font-size:12px;font-weight:500;line-height:1.6;color:#75756C;text-align:center;}
.tf-loginbox .tlb-ft .agree a{color:#B8860B;text-decoration:none;border-bottom:1px solid #4A3505;}
.tf-loginbox .tlb-x{display:block;width:auto;margin:0;padding:4px 16px;background:none;border:0;cursor:pointer;font-family:Pretendard,sans-serif;font-size:13.5px;font-weight:600;color:#8F8F86;transition:color .13s linear;}
.tf-loginbox .tlb-x:hover{color:#FFC94A;}
@media (prefers-reduced-motion:reduce){
  .tf-loginbox,.tf-loginbox .tlb-log .r,.tf-loginbox .tlb-cur{animation:none !important;transition:none !important;}
  .tf-loginbox .tlb-log .r{opacity:1;transform:none;}
}
@keyframes nbpulse{0%,100%{opacity:1;}50%{opacity:.3;}}
@media (prefers-reduced-motion: reduce){
 .nbar .ttrack,.nbar .ntrack{animation:none !important;transform:none !important;}
 .nbar .tticker,.nbar .tnews .nwrap{overflow-x:auto;scrollbar-width:none;}
 .nbar .nb-live.off .nb-dot{animation:none;}
}
html.qhp2 .qh:hover::after,html.qhp2 .nbar .qh:hover::after,html.qhp2 .nwk-help:hover::after{display:none !important;content:none !important;}

/* ⚠ 여기서 **크기도 모양(반경)도 정하지 않는다.** 호출부 클래스가 정한다 —
     사이트에 원형 칩(.s-logo·.ct-coin·.av)과 각진 칩(차익거래 .acIco, 핸드오프 지시)이
     같이 있고, 둘 다 맞다. 공용이 한쪽을 강제하면 다른 쪽이 !important 로 되받고
     그게 다음 사고가 된다(BAR_CSS 주석의 그 규칙). */
.ntico{position:relative;display:inline-flex;align-items:center;justify-content:center;
 overflow:hidden;flex:none;vertical-align:middle;line-height:1;
 font:800 9px/1 var(--mono,ui-monospace,monospace);}
.ntico>i{font-style:normal;font:inherit;letter-spacing:-.04em;}
/* 이미지는 글자 **위**를 덮되, **뜬 뒤에야** 보인다(.on 은 onload 가 단다).
   ⚠ 이 순서가 규칙 R4 의 전부다. 처음엔 img 에 배경색을 깔아 글자를 덮게 했는데,
     `loading=lazy` 라 화면 밖 아이콘은 요청조차 안 나가고 그 img 가 배경만 칠한 채
     글자를 가렸다 — 스크롤 전까지 **색 네모**만 보인다.
   ⚠ 실패하면 img 가 통째로 사라진다(fail). DOM 을 바꾸지 않으므로 칸이 안 비고
     레이아웃도 안 흔들린다. */
.ntico>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;
 opacity:0;}
.ntico.on>img{opacity:1;background:inherit;}
.ntico.on>i{visibility:hidden;}
