/* ─────────────────────────────────────────────────────────────
     포인파이 — 포인파이와 같은 뼈대, 색만 밤색 계열로 다르게 (2026-09-05)

     ★ 색은 전부 아래 :root(야간) 와 html[data-theme="light"](주간) 토큰에 모여 있다.
       화면 규칙에는 색 숫자를 적지 말 것. 적으면 테마를 바꿔도 그 자리만 안 바뀐다.
     ★ 포인파이는 짙은 남색 + 청록. 포인파이는 짙은 밤색 + 구운 밤빛.
       PIT 금색·소각 빨강·추천인 보라는 뜻이 있는 색이라 두 지갑이 같다.

     고친 것
       1) 글자 크기. 원본이 8~9px 대라 실제 휴대폰에서 읽기 어려웠다.
          기본페이·포인파이의 눈금(본문 12.5 · 라벨 11.5 · 제목 19)으로 올렸다.
       2) 색. 기본페이 계열로 맞췄다 — 짙은 남색 바탕에 청록 강조.
          PIT 만 금색을 남겨 두 자산이 눈으로 구분되게 했다.
       3) 리워드 화면. 기본페이의 「비율 줄」 모양(라벨 · 슬라이더 · 퍼센트 칸)으로 바꾸고,
          설정과 실행을 구역으로 갈랐다.
       4) 여백. 카드마다 제각각이던 값을 하나로 통일했다.

     기능·id·동작은 원본 그대로다. 스크립트는 손대지 않았다.
     ───────────────────────────────────────────────────────────── */

  :root{
    color-scheme:dark;
    /* 밤색 팔레트 — 포인파이 (포인파이는 남색·청록) */
    --bg:#1C110B; --card:#2A1810; --card2:#221309; --line:#43291C;
    --txt:#F5EBE2; --sub:#AF9080; --dim:#977A6A;
    --key:#8C4A22; --key2:#6B3416; --on-key:#FDF3EC;
    --green:#22C55E; --gold:#C99A3A; --purple:#A494DC; --red:#EF6461; --blue:#C97F4A;

    /* ═══ 테마 토큰 (2026-09-03, 주간/야간) ═══
       ★ 아래 값은 그날까지 파일 곳곳에 **숫자로 박혀 있던 색**에 이름만 붙여 모은 것이다.
         값은 안 바꿨다 — 야간 화면은 전과 같아야 한다.
       ★ 화면 규칙에 색 숫자를 다시 적지 말 것. 숫자를 적으면 주간에서 그 자리만 안 바뀐다.
         (예외: .qr 의 흰 바탕·검은 글자 — QR 은 어느 테마에서도 희어야 읽힌다.)
       ★ 주간 값은 바로 아래 html[data-theme="light"] 에 있다. 이름을 새로 만들면 거기에도 짝을 넣을 것.
       ★ tint(얇은 바탕) 와 on-*-tint(그 위 글자) 는 짝이다. 바탕만 tint 로 바꾸고 글자를 --txt 로 두면
         야간엔 괜찮아 보여도 주간에서 안 읽힌다. */
    /* 바탕·틀 */
    --ground:#120A06;            /* html·body 맨 바닥 */
    --stage-glow:#3A2114;        /* 넓은 화면에서 앱 뒤에 비치는 빛 */
    --nav:#150C07;               /* 아래 탭바 */
    --deep:#1A0F09;              /* 막대 트랙·카메라 상자처럼 바탕보다 더 깊은 곳 */
    --ctrl:#4A3327;              /* 알약 단추·토글 몸통 */
    --toast:#3A2415;
    --dot-off:#6A5245;           /* 「연결 안 됨」 점 */
    --knob:#FFFFFF;              /* 토글 손잡이 — 두 테마 모두 흰색 */
    --qr-dark:#1A0F09;           /* QR 점 색 (pit-qr.js 기본값과 같다 — 참고용) */
    /* 덮개·그림자 */
    --scrim:rgba(18,10,6,.92);        /* 지갑 시작·서명 확인·카메라 덮개 */
    --scrim-soft:rgba(12,6,3,.88);    /* 모달 뒤 */
    --veil:rgba(18,10,6,.74);         /* 전송 중 덮개 — 뒤가 비쳐야 「멈춘 것」으로 안 보인다 */
    --shadow:rgba(0,0,0,.35);
    --shadow-45:rgba(0,0,0,.45); --shadow-50:rgba(0,0,0,.5);
    --shadow-55:rgba(0,0,0,.55); --shadow-60:rgba(0,0,0,.6);
    /* 살짝 밝게(fg-a) · 살짝 어둡게(sink) 깐 것 */
    --fg-a-03:rgba(255,255,255,.03); --fg-a-08:rgba(255,255,255,.08); --fg-a-80:rgba(255,255,255,.8);
    --sink:rgba(0,0,0,.25); --sink-soft:rgba(0,0,0,.14);
    --line-soft:rgba(67,41,28,.6);
    /* 색을 얇게 깐 바탕(tint) 과 그 위 글자(on-*-tint) */
    --tint-key:rgba(140,74,34,.20);      --on-key-tint:#F5C3A2;
    --tint-blue:rgba(201,127,74,.14);    --on-blue-tint:#F0BC96;
    --tint-red:rgba(239,100,97,.12);     --on-red-tint:#FFB3B1;
    --tint-gold:rgba(201,154,58,.12);    --on-gold-tint:#F0D9A6;
    --tint-purple:rgba(164,148,220,.12); --on-purple-tint:#C3B7E6;
    --tint-green:rgba(34,197,94,.12);    --on-green-tint:#7FDCA6;
    --tint-dim:rgba(175,144,128,.14);    /* 회색 딱지 (유동성 화면) */
    /* 색을 얇게 깐 테두리 */
    --edge-key:rgba(140,74,34,.55);
    --edge-blue:rgba(201,127,74,.32);   --edge-blue-hi:rgba(201,127,74,.48);
    --edge-red:rgba(239,100,97,.32);   --edge-red-hi:rgba(239,100,97,.45);
    --edge-gold:rgba(201,154,58,.4);
    --edge-purple:rgba(164,148,220,.4);
    --edge-green:rgba(34,197,94,.3);
    --glow-blue:rgba(229,147,106,.85);  /* QR 스캔선 빛 */
    /* 글자 */
    --key-txt:#E5936A;           /* 청록 강조 글자 */
    --acc:#E5936A;               /* 전송 중 덮개의 파랑 */
    --on-key-soft:#FDF3EC;       /* tint-key 바탕 위 글자 — 야간엔 --on-key 와 같고 주간엔 짙어진다 */
    --on-danger:#FFFFFF; --on-danger-off:rgba(255,255,255,.45);   /* 지갑 삭제 단추 글자 (켜짐·잠김) */
    --on-hero:#FDF3EC; --on-hero-sub:#DDB99B;   /* 잔액 카드 위 글자 — 카드는 주간에도 짙은 청록 */
    --sum-txt:#F0A87E;           /* 계산표 합계 */
    --pct-green-txt:#4ADE80;
    --coin-kaia-bg:#3A2414; --coin-kaia-txt:#DEB48C;
    --safebar-ok-txt:#04240f; --safebar-off-txt:#2a1c00;
    --burn-a:#FF8A87; --burn-b:#C2504E;   /* 소각 — 경고 빨강보다 한 톤 낮은 빨강 (글자·막대) */
    --gold-hi:#E0B45C;
    /* ★ 2026-09-05 — 「한눈에」 상자 (어두운 골드, 사장님 지시) */
    --glance-bg:#2A2011; --glance-line:#5C4622;
    --bar-vault:#5A4436; --bar-lock:#7A6CC4;   /* 공시 발행량 막대 */
    /* 퍼센트 칸 테두리 */
    --pct-green:#2A6E45; --pct-purple:#4D4778; --pct-gold:#6A5628; --pct-red:#6B3230;
    /* 그라데이션·단색 상자 */
    --hero-a:#7A3E1C; --hero-b:#3A1C0C; --hero-line:#A85C2A;     /* 잔액 카드 */
    --sum-a:#2E1C11; --sum-b:#241408; --sum-line:#4A2F1F;        /* 계산표 */
    --inst-a:#38210F; --inst-b:#251508; --inst-line:#59371D;     /* 앱 설치 띠 */
    --lp-a:#3A2312; --lp-b:#221309;                              /* 유동성 총액 카드 */
    --danger-a:#E4514E; --danger-b:#C13B39;                      /* 지갑 삭제 단추 */
    --warn-a:#8A6E12; --warn-b:#6D5610; --warn-line:#B08C22;     /* 외부 출금 단추 */
    --purple-deep:#4A3F79; --purple-line:#66589C;                /* 추천인 단추 */
  }

  /* ═══ 주간 테마 (2026-09-03) ═══
     ★ pit-theme.js 가 <html data-theme="light"> 를 붙이면 이 값들이 위 야간 값을 덮는다.
       야간은 위 :root 그대로다 — 여기엔 야간 값이 하나도 없다.
     ★ 잔액 카드·지갑 삭제·외부 출금·추천인 단추는 주간에도 짙은 색을 지킨다.
       흰 글자가 그 위에 얹히므로 바탕을 밝히면 글자가 사라진다.
     ★ 글자색은 밝은 바탕에서 4.5:1 이상 나오게 골랐다 (on-*-tint 는 그 tint 위에서 잰 값). */
  html[data-theme="light"]{
    color-scheme:light;
    --bg:#FAF4EE; --card:#FFFFFF; --card2:#F3E9E0; --line:#E3D3C6;
    --txt:#2A1A11; --sub:#6B5142; --dim:#8E7263;
    --key:#8C4A22; --key2:#6B3416; --on-key:#FFFFFF;
    --green:#15803D; --gold:#9A6B12; --purple:#6B5BB3; --red:#C62828; --blue:#A0562A;
    --bid:#167A4B; --ask:#C0392B;                      /* 호가창 — 아래쪽 :root 것을 덮는다 */
    --bid-bg:rgba(22,122,75,.14); --ask-bg:rgba(192,57,43,.14);
    --ground:#F2E8DF; --stage-glow:#EBDCCF; --nav:#FFFFFF; --deep:#E8DACD;
    --ctrl:#E3D3C6; --toast:#FFFFFF; --dot-off:#C9B4A4; --knob:#FFFFFF; --qr-dark:#1A0F09;
    --scrim:rgba(242,232,223,.94); --scrim-soft:rgba(242,232,223,.88); --veil:rgba(242,232,223,.72);
    --shadow:rgba(70,40,20,.14);
    --shadow-45:rgba(70,40,20,.14); --shadow-50:rgba(70,40,20,.16);
    --shadow-55:rgba(70,40,20,.18); --shadow-60:rgba(70,40,20,.2);
    --fg-a-03:rgba(42,26,17,.04); --fg-a-08:rgba(42,26,17,.08); --fg-a-80:rgba(255,255,255,.92);
    --sink:rgba(42,26,17,.06); --sink-soft:rgba(42,26,17,.035);
    --line-soft:rgba(227,211,198,.8);
    --tint-key:rgba(140,74,34,.13);      --on-key-tint:#7A3E18;
    --tint-blue:rgba(160,86,42,.12);    --on-blue-tint:#82401A;
    --tint-red:rgba(198,40,40,.12);      --on-red-tint:#9B1C1C;
    --tint-gold:rgba(154,107,18,.12);    --on-gold-tint:#7A5A12;
    --tint-purple:rgba(107,91,179,.12);  --on-purple-tint:#4B3E99;
    --tint-green:rgba(21,128,61,.12);    --on-green-tint:#14532D;
    --tint-dim:rgba(107,81,66,.12);
    --edge-key:rgba(140,74,34,.45);
    --edge-blue:rgba(160,86,42,.3);   --edge-blue-hi:rgba(160,86,42,.45);
    --edge-red:rgba(198,40,40,.32);    --edge-red-hi:rgba(198,40,40,.45);
    --edge-gold:rgba(154,107,18,.4);
    --edge-purple:rgba(107,91,179,.4);
    --edge-green:rgba(21,128,61,.3);
    --glow-blue:rgba(160,86,42,.55);
    --key-txt:#8A4A1E; --acc:#A0562A;
    --on-key-soft:#7A3E18;
    --on-danger:#FFFFFF; --on-danger-off:rgba(155,28,28,.55);
    --on-hero:#FFFFFF; --on-hero-sub:#EAC8AC;
    --sum-txt:#7A3E18;
    --pct-green-txt:#15803D;
    --coin-kaia-bg:#F6E7D8; --coin-kaia-txt:#7A4A22;
    --safebar-ok-txt:#04240f; --safebar-off-txt:#2a1c00;
    --burn-a:#C0392B; --burn-b:#8E2B22;
    --gold-hi:#B8842A;
    --glance-bg:#FCF5E4; --glance-line:#DCC189;
    --bar-vault:#B9A392; --bar-lock:#6B5BB3;
    --pct-green:#8FCFA9; --pct-purple:#B9AEE3; --pct-gold:#E0C98F; --pct-red:#EFA9A6;
    --hero-a:#7A3E1C; --hero-b:#3A1C0C; --hero-line:#A85C2A;
    --sum-a:#FFFFFF; --sum-b:#F3E9E0; --sum-line:#DFCDBE;
    --inst-a:#FFFFFF; --inst-b:#F3E9E0; --inst-line:#DFCDBE;
    --lp-a:#FFFFFF; --lp-b:#F3E9E0;
    --danger-a:#E4514E; --danger-b:#C13B39;
    --warn-a:#8A6E12; --warn-b:#6D5610; --warn-line:#B08C22;
    --purple-deep:#4A3F79; --purple-line:#66589C;
  }
  *{box-sizing:border-box}
  html,body{margin:0;min-height:100%;background:var(--ground);color:var(--txt);
    font:14px/1.6 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic","Segoe UI",sans-serif;  /* ★ 2026-09-09 검토 — 기기 글꼴로 통일. Pretendard 는 파일이 앱에 없어 조용히 대체되던 이름이라 뺐다 */
    -webkit-tap-highlight-color:transparent}
  button,input{font:inherit;color:inherit}
  button{cursor:pointer}
  .stage{min-height:100svh;display:grid;place-items:center;padding:22px;
    background:radial-gradient(circle at 50% 0,var(--stage-glow) 0,transparent 42%)}
  .app{width:min(460px,100%);height:min(940px,calc(100svh - 44px));min-height:690px;
    display:flex;flex-direction:column;overflow:hidden;position:relative;
    border:1px solid var(--line);border-radius:22px;background:var(--bg);
    box-shadow:0 28px 90px var(--shadow-55)}

  /* ── 상단 ── */
  header{height:58px;display:grid;grid-template-columns:38px 34px 1fr auto auto;align-items:center;
    gap:8px;padding:0 12px;border-bottom:1px solid var(--line)}
  header strong{text-align:center;font-size:17px;font-weight:900;letter-spacing:-.4px}
  header strong span{color:var(--blue)}
  .icon-btn{width:34px;height:34px;border:0;border-radius:10px;background:transparent;
    color:var(--sub);font-size:17px}
  .network{display:flex;align-items:center;gap:6px;color:var(--sub);font-size:12px;font-weight:800}
  .dot{width:7px;height:7px;border-radius:50%;background:var(--dot-off)}
  .dot.on{background:var(--green)}

  /* ── 화면 ── */
  .screen{flex:1;overflow-y:auto;scrollbar-width:none}
  .screen::-webkit-scrollbar{display:none}
  .page{display:none;padding:18px 16px 26px}
  .page.on{display:block}

  .title{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:16px}
  .title small{display:block;color:var(--sub);font-size:12.5px;font-weight:800}
  .title h1{margin:3px 0 0;font-size:20px;font-weight:900;letter-spacing:-.5px}
  .chip{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    border:1px solid var(--line);border-radius:999px;background:var(--card);
    padding:7px 11px;color:var(--sub);font-size:12px;font-weight:800}
  .back-title{display:flex;align-items:center;gap:10px;margin-bottom:16px}
  .back-title button{width:32px;height:32px;border:1px solid var(--line);border-radius:9px;
    background:var(--card);color:var(--txt);font-size:17px}
  .back-title h1{margin:0;font-size:20px;font-weight:900}
  .back-title b{margin-left:auto;color:var(--sub);font-size:12px;font-weight:800}
  /* ★ 2026-09-05 사장님 지시 — 「전체」 머리줄의 Kaia 를 누르는 자리로 만든다.
     여기서 지갑을 만들고 비밀키로 불러온다 (계정 10개까지).
     ★ .back-title button 은 32×32 네모(뒤로 가기 ‹)라 그대로 쓰면 글자가 잘린다.
       클래스로 덮어써 알약 모양으로 둔다. */
  .back-title button.netjump{width:auto;height:auto;margin-left:auto;
    padding:5px 12px;border:1px solid var(--line);border-radius:999px;
    background:var(--card2);color:var(--key);font-size:12px;font-weight:800;
    line-height:1.2;letter-spacing:.2px}
  .back-title button.netjump:active{background:var(--card)}


  /* ── 잔액 ── */
  /* ★ 이 카드는 주간에도 짙은 청록이다 (2026-09-03). 그래서 글자색을 몸(--txt)에서 물려받지 않고
     --on-hero 계열로 못박는다 — 야간 값은 --txt·--sub 와 같아 전과 똑같이 보인다. */
  .balance{border:1px solid var(--hero-line);border-radius:18px;padding:16px 16px 14px;
    background:linear-gradient(160deg,var(--hero-a),var(--hero-b));color:var(--on-hero)}
  .balance-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
    color:var(--on-hero-sub);font-size:12.5px;font-weight:800}
  /* 윗줄은 네트워크·원화 환산(오른쪽), 아랫줄은 **USDT + 금액**을 한 줄로 오른쪽에.
     ★ 자릿수가 길어지면 카드를 밀고 나가므로 아래 .balance.d2/.d3 로 줄인다. */
  .balance-head p{margin:0 0 0 auto;color:var(--on-hero-sub);font-size:12.5px;font-weight:700;
    text-align:right;min-width:0}
  /* 금액 앞에 붙는 종목 이름 — 숫자보다 작지만 윗줄 글씨보다는 크게 */
  .balance strong .unit{font-style:normal;font-size:16px;font-weight:900;
    color:var(--fg-a-80);letter-spacing:0;flex:0 0 auto}
  /* 종목은 **왼쪽**, 금액은 **오른쪽** — 한 줄에서 양쪽으로 벌린다.
     ★ 자릿수가 길어지면 아래 .balance.d2/.d3 로 함께 줄여 한 줄을 지킨다. */
  .balance strong{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
    margin:8px 0 14px;font-size:31px;font-weight:900;
    letter-spacing:-1px;background:transparent;border:0;color:inherit;
    padding:0;font-variant-numeric:tabular-nums;width:100%}
  /* 「$ 282.88」이 한 덩어리로 오른쪽에 붙게 감싼다 */
  .balance strong .amt{display:inline-flex;align-items:baseline;min-width:0}
  .balance strong small{font-size:14px;color:var(--on-hero-sub);font-weight:800;margin-left:3px}
  /* (환산 줄은 이제 .balance-head 안에 있다) */
  .actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .actions button{border:1px solid var(--line);border-radius:11px;background:var(--tint-key);
    color:var(--on-key);padding:12px;font-size:14px;font-weight:800}

  .primary{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;
    border:0;border-radius:12px;padding:13px;font-size:15px;font-weight:800;
    background:linear-gradient(180deg,var(--key),var(--key2));color:var(--on-key);
    text-decoration:none}
  .primary:disabled{opacity:.45}
  /* ★★ 2026-09-05 사장님 지시 — 돈이 나가는 길의 단추는 **어두운 골드**.
     .primary 전체를 바꾸면 앱의 모든 파란 단추가 금색이 되어
     「무엇이 중요한 단추인가」가 사라진다. 이 길에만 붙인다. */
  .primary.gold{background:linear-gradient(180deg,var(--gold-hi),var(--gold));
    color:#1B1206}
  .primary.gold:disabled{opacity:.4}
/* ★ 2026-09-05 — 「저장」 단추는 금색(돈 나감)과 갈라 둔다 (사장님 지시).
   리워드 숫자칸이 이미 보라라 짝이 맞는다. */
.primary.save{background:linear-gradient(180deg,var(--purple),#6E5FB0);color:#fff}
.primary.save:disabled{opacity:.4}


  .outline{width:100%;margin-top:9px;border:1px solid var(--line);border-radius:12px;
    background:transparent;color:var(--txt);padding:12px;font-size:14.5px;font-weight:800}

  /* ── 고지 ── */
  .custody{display:flex;align-items:flex-start;gap:10px;margin-top:10px;
    border:1px solid var(--edge-green);border-radius:13px;background:var(--tint-green);
    padding:12px;color:var(--on-green-tint)}
  .custody b{display:block;font-size:13px;font-weight:800}
  .custody span{display:block;margin-top:4px;color:var(--on-green-tint);font-size:12px;line-height:1.6}
  .shield{width:24px;height:24px;flex:0 0 auto;border:1px solid currentColor;border-radius:50%;
    display:grid;place-items:center;font-size:13px;font-style:normal}
  .warning{display:flex;gap:9px;align-items:flex-start;margin:12px 0;
    border:1px solid var(--line);border-radius:12px;background:var(--card2);
    padding:12px;color:var(--sub);font-size:12.5px;line-height:1.65}
  .warning.gold{border-color:var(--edge-gold);background:var(--tint-gold);color:var(--on-gold-tint)}

  /* ── 구역 제목 ── */
  .section-title{display:flex;align-items:center;justify-content:space-between;
    margin:20px 2px 9px;font-size:14px;font-weight:900}
  .section-title button{border:0;background:transparent;color:var(--sub);font-size:16px}

  /* ── 자산 ── */
  .assets{display:grid;gap:8px}
  .asset{display:flex;align-items:center;gap:12px;border:1px solid var(--line);
    border-radius:14px;background:var(--card);padding:13px}
  .coin{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
    font-weight:900;font-size:15px;font-style:normal;flex:0 0 auto}
  /* ★ 세 토큰 모두 **공식 심볼**을 쓴다 (2026-08-28).
     지갑·탐색기·시세판이 서로 다른 그림을 보여 주면 그것만으로 가짜처럼 보인다.
     예전에는 PIT 만 그림이고 KAIA·USDT 는 글자('K'·'₮')였다.
     ★ 그림이 안 뜨면 글자가 그대로 보이게 두었다 — 빈 동그라미보다 낫다. */
  .coin.kaia{background:var(--coin-kaia-bg);color:var(--coin-kaia-txt);
    background-image:url('./kaia-64.svg');background-size:cover;background-position:center;
    color:transparent;font-size:0}
  .coin.usdt{background:var(--tint-blue);color:var(--blue);
    background-image:url('./usdt-64.svg');background-size:cover;background-position:center;
    color:transparent;font-size:0}
  .coin.pit{background:transparent;color:transparent;font-size:0;
    background-image:url('./pit-64.png');background-size:cover;background-position:center}
  .asset div{display:flex;flex-direction:column;gap:2px;min-width:0}
  .asset b{font-size:14.5px;font-weight:800}
  .asset small{color:var(--sub);font-size:12px;font-weight:700}
  .asset em{margin-left:auto;font-style:normal;display:flex;flex-direction:column;
    align-items:flex-end;gap:2px;min-width:0}
  .asset em b{font-size:15px;font-weight:900;font-variant-numeric:tabular-nums}
  .asset em small{color:var(--sub);font-size:12px;font-weight:700;
    font-variant-numeric:tabular-nums}

  /* ── 카드 ── */
  .card{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:15px}
  .card + .card{margin-top:10px}
  .card h2{margin:0 0 12px;font-size:14px;font-weight:900}

  /* ── 받기 ── */
  .intro{margin:0 auto 14px;max-width:410px;color:var(--sub);font-size:13px;line-height:1.7}
  .intro b{color:var(--txt)}
  /* ★ QR 은 테마와 상관없이 흰 바탕·검은 글자여야 읽힌다 — 이 줄만 색 숫자를 그대로 둔다 (2026-09-03) */
  .qr{width:214px;height:214px;margin:0 auto;border-radius:14px;background:#fff;padding:11px;
    display:grid;place-items:center;color:#111;font-size:13px;font-weight:700}
  .qr canvas,.qr img{width:100%!important;height:100%!important}
  .round-actions{display:flex;justify-content:center;gap:30px;margin:14px 0 14px}
  .round-actions button{border:0;background:transparent;color:var(--sub);font-size:12px;font-weight:800}
  .round-actions button i{width:40px;height:40px;margin:0 auto 6px;border:1px solid var(--line);
    border-radius:50%;background:var(--card);color:var(--blue);
    display:grid;place-items:center;font-style:normal;font-size:16px}
  .address{border:1px solid var(--line);border-radius:12px;background:var(--card2);padding:12px;
    text-align:center;word-break:break-all;color:var(--txt);
    font-family:ui-monospace,monospace;font-size:12.5px;line-height:1.6}

  /* ── DEX ── */
  .pair{padding:16px}
  .pair-head{display:flex;align-items:center;margin-bottom:12px}
  .pair-head .coin + .coin{margin-left:-10px}
  .pair-head div{margin-left:12px}
  .pair-head b{font-size:16px;font-weight:900}
  .pair-head small{display:block;margin-top:2px;color:var(--sub);font-size:12px;font-weight:700}
  .pair>p{margin:0;color:var(--sub);font-size:13px;line-height:1.7}
  .contract{margin-top:11px}
  .contract label{display:block;color:var(--sub);font-size:12px;font-weight:800;margin-bottom:5px}
  /* ★ 글자를 1px 키우면서(2026-09-04) 42자짜리 계약 주소가 상자를 비집고 나갔다.
     글자를 도로 줄이는 대신 **넘치면 접히게** 한다 — 주소는 붙여 쓰는 글자라
     그냥 두면 안 접힌다. */
  .contract button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;
    border:1px solid var(--line);border-radius:11px;background:var(--card2);color:var(--txt);
    padding:11px;font-size:12.5px;font-family:ui-monospace,monospace;
    overflow-wrap:anywhere;word-break:break-all;text-align:left}
  .note{color:var(--dim);font-size:13px;line-height:1.65;margin:12px 2px 0}   /* ★ 2026-09-09 검토 — 안내문 4단 정리 첫걸음: 작은 안내(11·11.5px)는 12.5px, 기본 안내는 13px */

  /* ── 리워드: 기본페이식 비율 줄 ── */
  .rate-setting + .rate-setting{margin-top:6px;padding-top:12px;border-top:1px solid var(--line)}
  .rate-label{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px}
  .rate-label span:first-child{font-size:13.5px;font-weight:800}
  .rate-label span:last-child{color:var(--dim);font-size:12px;font-weight:700}
  /* ★ 폭은 92px 그대로 둔다 (2026-08-30).
     리워드 끝이 34.65 가 되면서 「34.6!」로 잘리길래 두 번 넓혀 봤는데,
     두 번 다 격자가 무너져 손잡이가 점으로 줄었다 — 남의 규칙이 얽힌 자리다.
     대신 **끝을 소수점 한 자리로 내림**해 34.6 으로 만들었다(syncRewardCap).
     체인 한계보다 낮은 쪽이라 안전하고, 0.05% 는 10만원에 50원이다. */
  .rate-control{display:grid;grid-template-columns:1fr 92px;align-items:center;gap:11px}
  .rate-control input[type=range]{width:100%;accent-color:var(--green);cursor:pointer;margin:0}
  .rate-control input.purple{accent-color:var(--purple)}
  .percent-input{display:flex;align-items:center;border:1px solid var(--pct-green);border-radius:10px;
    background:var(--card2);padding:0 9px}
  .percent-input input{width:100%;min-width:0;border:0;outline:0;background:transparent;
    padding:9px 0;text-align:right;font-size:14px;font-weight:900;color:var(--pct-green-txt);
    font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield}
  /* ★ 위아래 화살표를 없앤다. 좁은 칸에서 숫자를 밀어내 글자가 잘렸다. */
  .percent-input input::-webkit-outer-spin-button,
  .percent-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
  .percent-input b{margin-left:4px;color:var(--sub);font-size:12px;font-weight:800}
  .percent-input.purple{border-color:var(--pct-purple)}
  .percent-input.purple input{color:var(--purple)}

  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}
  .field-label{display:block;color:var(--sub);font-size:12px;font-weight:800;margin-bottom:5px}
  .field{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:10px;
    background:var(--card2);padding:0 11px}
  .field input{width:100%;min-width:0;border:0;outline:0;background:transparent;padding:11px 0;
    font-size:14px;font-variant-numeric:tabular-nums}
  .field b{color:var(--sub);font-size:12.5px;font-weight:800;white-space:nowrap}
  /* 누를 수 있는 단위 표시 — 글자만 있으면 눌러도 되는 줄 모른다. 테두리로 알린다. */
  .unitpick{flex:0 0 auto;border:1px solid var(--line);border-radius:8px;background:var(--card2);
    color:var(--txt);font-size:12.5px;font-weight:800;padding:5px 10px;white-space:nowrap}
  .unitpick:active{background:var(--card)}

  .reference{display:flex;gap:9px;align-items:flex-start;margin-top:12px;
    border:1px solid var(--edge-blue);border-radius:11px;background:var(--tint-blue);
    color:var(--on-blue-tint);padding:11px;font-size:12px;line-height:1.6}
  .budget{display:flex;justify-content:space-between;align-items:center;margin-top:12px;
    padding:13px;border-radius:12px;background:var(--card2);color:var(--sub);
    font-size:13px;font-weight:800}
  .budget b{color:var(--gold);font-size:15px;font-variant-numeric:tabular-nums}

  .execute-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
  .execute-head h2{margin:0}
  .execute-head span{color:var(--dim);font-size:12px;font-weight:700}
  .reward-kind{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
  .reward-kind button{border:1px solid var(--line);border-radius:10px;background:var(--card2);
    color:var(--sub);padding:11px;font-size:13.5px;font-weight:800}
  .reward-kind button.on{border-color:var(--key);background:var(--tint-key);color:var(--on-key-soft)}
  .reward-entry{display:grid;grid-template-columns:1fr 96px;gap:8px}
  .reward-entry input{width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;
    background:var(--card2);outline:0;padding:11px;font-size:13px;font-family:ui-monospace,monospace}
  .reward-entry button{border:1px solid var(--line);border-radius:10px;background:var(--tint-key);
    color:var(--on-key-soft);font-size:12.5px;font-weight:800}
  .reward-execute .field{margin-bottom:0}
  .reward-execute > .primary{margin-top:14px}
  .stack{margin-top:12px}

  .ref-box{margin-top:12px;border:1px solid var(--edge-purple);border-radius:12px;
    background:var(--tint-purple);padding:12px}
  .ref-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;
    color:var(--on-purple-tint);font-size:13px;font-weight:800}
  .ref-head em{font-style:normal;font-size:12px;color:var(--sub)}
  .ref-row{display:grid;grid-template-columns:1fr 62px;gap:7px}
  .ref-row input{width:100%;min-width:0;border:1px solid var(--pct-purple);border-radius:10px;
    background:var(--card2);outline:0;padding:10px;font-size:12.5px;font-family:ui-monospace,monospace}
  .ref-row button{border:1px solid var(--purple-line);border-radius:10px;background:var(--purple-deep);
    color:var(--on-key);font-size:13px;font-weight:800}

  .dex-link{width:100%;display:flex;align-items:center;gap:11px;margin-top:10px;
    border:1px solid var(--edge-gold);border-radius:14px;background:var(--tint-gold);
    color:var(--gold);padding:14px;text-align:left}
  .dex-link span:first-child{font-size:17px}
  .dex-link span.txt{display:flex;flex:1;flex-direction:column;gap:2px}
  .dex-link b{font-size:14px;font-weight:800}
  .dex-link small{color:var(--on-gold-tint);font-size:12px;font-weight:700}

  /* ── 설정 목록 ── */
  .policy p{display:flex;justify-content:space-between;gap:10px;margin:0;padding:11px 0;
    border-bottom:1px solid var(--line);color:var(--sub);font-size:13px;font-weight:700}
  .policy p:last-of-type{border-bottom:0}
  .policy p b{color:var(--txt);font-weight:800}

  /* ── 하단 탭 ── */
  /* ★ 2026-09-05 포인파이는 탭이 **셋**이었다 (지갑·스왑·시세). 리워드·지도·쇼핑을 뺐다.
     ★ 2026-09-06 밤 「디앱」이 더해져 **넷**. 숫자를 안 맞추면 넷째가 줄 밖으로 밀린다. */
  nav{height:64px;display:grid;grid-template-columns:repeat(4,1fr);
    border-top:1px solid var(--line);background:var(--nav);
    padding-bottom:env(safe-area-inset-bottom)}
  nav button{border:0;background:transparent;color:var(--sub);font-size:12.5px;font-weight:800}
  nav button i{display:block;margin-bottom:4px;font-style:normal;font-size:18px}
  nav button.on{color:var(--blue)}

  /* ── 모달 ── */
  .modal-wrap{position:fixed;inset:0;z-index:50;display:none;place-items:center;
    background:var(--scrim-soft);backdrop-filter:blur(8px);padding:18px}
  .modal-wrap.on{display:grid}
  .modal{width:min(420px,100%);max-height:88vh;overflow-y:auto;position:relative;
    border:1px solid var(--line);border-radius:20px;background:var(--card);padding:22px}
  .close{position:absolute;right:13px;top:13px;width:33px;height:33px;border:0;border-radius:10px;
    background:var(--card2);color:var(--sub);font-size:17px}
  .modal>small{display:block;text-align:center;color:var(--sub);font-size:12.5px;font-weight:800}
  .modal h2{text-align:center;margin:5px 0 16px;font-size:19px;font-weight:900}
  .tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:14px}
  .tabs button{border:1px solid var(--line);border-radius:10px;background:var(--card2);
    color:var(--sub);padding:10px;font-size:13.5px;font-weight:800}
  .tabs button.on{border-color:var(--key);background:var(--tint-key);color:var(--on-key-soft)}
  .modal label{display:block;color:var(--sub);font-size:12.5px;font-weight:800;margin:12px 0 6px}
  .modal>input{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--card2);
    outline:0;padding:12px;color:var(--txt);font-size:13px;font-family:ui-monospace,monospace}
  .modal .primary{margin-top:16px}
  .modal>p{text-align:center;margin:12px 0 0;color:var(--dim);font-size:12px;line-height:1.6}

  /* ── 카메라 ── */
  .camera{position:fixed;inset:0;z-index:70;display:none;place-items:center;
    background:var(--scrim);padding:18px}
  .camera.on{display:grid}
  .camera-card{width:min(390px,100%);position:relative;border:1px solid var(--line);
    border-radius:20px;background:var(--card);padding:18px;text-align:center}
  .camera-card h3{margin:0 0 12px;font-size:15px;font-weight:800}
  .camera video{width:100%;aspect-ratio:1;object-fit:cover;border:2px solid var(--key);
    border-radius:15px;background:var(--deep)}
  .camera button{position:absolute;right:12px;top:12px;width:33px;height:33px;border:0;
    border-radius:10px;background:var(--card2);color:var(--sub);font-size:17px}
  .camera p{margin:12px 0 0;color:var(--sub);font-size:12.5px}

  /* ★★ 2026-09-05 사장님 지시 — 토스트를 **위로**.
     폰에서 아래에 뜨면 「다음」 단추를 덮어 누르는 것을 막았다.
     ★ 위에는 머리줄(로고·지갑 연결)이 있으므로 그 아래로 앉힌다. */
  /* ★★ 2026-09-08 에드 지적 — 알림창이 세로로 너무 길었다.
       까닭: `left:50%` 만 주고 폭을 안 정하면, 쓸 수 있는 폭이 「화면 폭 − 왼쪽 50%」
       = **화면의 절반**뿐이다. 글이 그 안에서 반으로 접힌다.
       `max-width` 는 그보다 커서 한 번도 안 걸렸다 (375px 화면에서 실제 폭 187.5px).
       고침: 좌우를 0 으로 펴고 margin auto 로 가운데 둔다. 그러면 화면 전체가 쓸 수 있는
       폭이 되고, 그때부터 max-width 가 제 일을 한다. */
  .toast{position:fixed;z-index:90;left:0;right:0;top:70px;margin:0 auto;display:none;
    width:fit-content;max-width:min(94vw,520px);
    border:1px solid var(--line);border-radius:12px;background:var(--toast);
    color:var(--txt);padding:13px 17px;font-size:14px;line-height:1.55;font-weight:700;
    box-shadow:0 15px 50px var(--shadow-50)}
  .toast.on{display:block}
  /* ★ 새 판 알림 띠 — 2026-09-08 에드 지시로 **위로** 올리고 키웠다.
     아래에 있으면 아래 차림표에 가려 잘 안 보였다. 눌러야 사라진다. */
  .swbar{position:fixed;z-index:92;left:0;right:0;top:70px;margin:0 auto;
    display:flex;align-items:center;gap:12px;width:fit-content;max-width:min(94vw,520px);
    border:1px solid var(--line);border-radius:12px;
    background:var(--toast);color:var(--txt);padding:14px 14px 14px 17px;
    font-size:14.5px;line-height:1.5;font-weight:700;
    box-shadow:0 15px 50px var(--shadow-50)}
  .swbar.hidden{display:none}
  .swbar>span{flex:1 1 auto;min-width:0}
  .swbar .primary{flex:0 0 auto;width:auto;margin:0;padding:10px 16px;white-space:nowrap}
  /* 띠가 떠 있는 동안은 알림창을 그 아래로 내린다 — 겹치면 둘 다 못 읽는다 */
  body.swon .toast{top:152px}

  @media(max-width:560px){
    .stage{display:block;padding:0;background:none}
    .app{width:100%;height:100svh;min-height:0;border:0;border-radius:0;box-shadow:none}
    .page{padding:16px 15px 24px}
    .toast{top:64px;bottom:auto}
    .swbar{top:64px}
    body.swon .toast{top:146px}
  }

/* ─── 리워드 실행: 주소 입력 / QR 스캔 세그먼트 (포인파이 방식) ─── */
.segt{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px;
  border:1px solid var(--line);border-radius:12px;background:var(--card2);padding:4px}
.segt button{border:0;border-radius:9px;background:transparent;color:var(--sub);
  padding:10px;font-size:13.5px;font-weight:800}
.segt button.on{background:linear-gradient(180deg,var(--key),var(--key2));color:var(--on-key)}

.scanbox{position:relative;border:1px solid var(--line);border-radius:14px;background:var(--deep);
  aspect-ratio:1;overflow:hidden;display:grid;place-items:center;margin-bottom:10px}
.scanbox video{width:100%;height:100%;object-fit:cover}
.scanbox .scanhint{position:absolute;bottom:12px;left:0;right:0;text-align:center;
  color:var(--sub);font-size:12.5px;font-weight:700;pointer-events:none}
.scanbox::before{content:'';position:absolute;inset:14%;border:2px solid var(--key);
  border-radius:12px;pointer-events:none}

.refline{margin-top:12px;padding:11px;border-radius:10px;background:var(--card2);
  border:1px solid var(--line)}
.refline span:last-child{font-family:ui-monospace,monospace;font-size:12.5px}
/* 추천인이 아직 없거나 못 찾았을 때 — 손댈 곳이 아니라는 뜻으로 흐리게 둔다 */
.refline.off{opacity:.5}
.refline.off span:last-child{color:var(--dim)}

.field-label em{font-style:normal;color:var(--dim);font-weight:700;margin-left:4px}
.payout{display:flex;justify-content:space-between;align-items:center;margin-top:11px;
  padding:12px;border-radius:11px;background:var(--tint-purple);
  border:1px solid var(--edge-purple);color:var(--on-purple-tint);font-size:13px;font-weight:800}
.payout b{color:var(--purple);font-size:14.5px;font-variant-numeric:tabular-nums}
#paneScan .outline{margin-top:8px}

/* ─────────── 하이브리드 입금 ───────────
   USDT 로 결제받은 건을 정산하는 화면.
   CSP 가 style-src 'self' 라 인라인 style 은 먹지 않는다 — 감추기는 .hidden 클래스로. */

.hidden{display:none !important}
.intro.tight{margin:0 0 12px;max-width:none}

/* 두 칸 줄. 기존 .refline 이 .kv 를 함께 달고 있어 여기서 같이 정리된다. */
/* ★ 값이 긴 주소일 때 넘치지 않게 (2026-09-04, 글자 1px 키우면서) */
.kv>b,.kv>span{min-width:0;overflow-wrap:anywhere}
select{max-width:100%}
.kv{display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:13px;font-weight:700;color:var(--sub)}
.kv b{color:var(--txt);font-size:13.5px;font-weight:800;font-variant-numeric:tabular-nums;
  /* ★ 숫자는 접히면 안 되니 nowrap 은 그대로. 다만 **줄어들 수 있게** 하고
     그래도 넘치면 「…」으로 자른다 (2026-09-04, 글자 1px 키우면서).
     안 그러면 42자짜리 주소가 상자를 비집고 나간다. */
  white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.kv em{font-style:normal;color:var(--dim);font-weight:700;margin-left:4px;font-size:12px}
/* ★ 2026-09-06 밤 사장님 지시 — 두 칸 줄의 **이름은 낱말 안에서 안 끊긴다**(시세 상자의 「PI/T」「USD/T」 · 비슷한 줄 전부).
   이름은 줄어들지 않고(너비의 60% 까지 · 넘으면 띄어쓰기에서만 접힘), 값(b)이 줄어들어 「…」으로 잘린다 */
.kv > span:first-child{flex:0 0 auto;max-width:60%;overflow-wrap:normal;word-break:keep-all}
.kv > b:last-child{flex:1 1 auto;text-align:right}

/* 입금 목록 */
.deposits{margin-top:10px}
.deposits:empty{display:none}
.dep{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  background:var(--card2);border:1px solid var(--line);border-radius:11px;
  padding:11px 12px;margin-top:8px;color:var(--txt)}
.dep.on{border-color:var(--key);background:var(--tint-key)}
.dep .who{flex:1;min-width:0}
.dep .who b{display:block;font-size:13.5px;font-weight:800}
.dep .who small{display:block;color:var(--dim);font-size:12.5px;font-weight:700;
  font-family:ui-monospace,monospace;margin-top:2px;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.dep .amt{color:var(--green);font-size:14px;font-weight:900;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.dep.done{opacity:.5}
.dep.done .amt{color:var(--dim)}
.deps-empty{color:var(--dim);font-size:12.5px;text-align:center;padding:16px 0;line-height:1.7}

/* 계산 표 */
.hy-sum{margin-top:12px;padding:12px;border-radius:11px;background:var(--card2);
  border:1px solid var(--line)}
.hy-sum .kv{padding:5px 0}
.hy-sum .kv.buy b{color:var(--gold)}
.hy-sum .kv.sum{margin-top:7px;padding-top:10px;border-top:1px solid var(--line)}
.hy-sum .kv.sum span{color:var(--txt);font-weight:800}
.hy-sum .kv.sum b{color:var(--key-txt);font-size:15px}

/* 확인란 — 판매점이 눈으로 보고 누르는 자리다. 기본값으로 켜 두지 말 것. */
.chk{display:flex;align-items:flex-start;gap:9px;margin-top:10px;
  font-size:12.5px;line-height:1.6;color:var(--sub);cursor:pointer}
.chk input{flex:0 0 auto;width:16px;height:16px;margin:1px 0 0;accent-color:var(--key);cursor:pointer}
.chk span{flex:1}

/* 금색 슬라이더 (하이브리드) */
.rate-control input.gold{accent-color:var(--gold)}
.percent-input.gold{border-color:var(--pct-gold)}
.percent-input.gold input{color:var(--gold)}
.rate-label em{font-style:normal;color:var(--dim);font-weight:700;margin-left:5px;font-size:12.5px}

/* ─────────── 연결 상태 알림 ───────────
   연결이 안 되는 원인을 사용자가 알 수 있어야 한다.
   예전에는 지갑이 던진 영어 원문이 그대로 토스트로 나가서 아무도 원인을 몰랐다. */
.banner{display:flex;align-items:center;gap:10px;padding:10px 14px;
  font-size:12.5px;line-height:1.6;font-weight:700;
  background:var(--card2);border-bottom:1px solid var(--line);color:var(--sub)}
.banner b{color:var(--txt)}
.banner button,.banner a{flex:0 0 auto;border:1px solid var(--line);background:transparent;
  color:var(--blue);border-radius:9px;padding:6px 11px;font-size:12px;font-weight:800;
  text-decoration:none;white-space:nowrap;cursor:pointer}
.banner.warn{background:var(--tint-gold);border-bottom-color:var(--edge-gold);color:var(--on-gold-tint)}
.banner.warn b{color:var(--on-gold-tint)}
.banner.warn button{border-color:var(--edge-gold);color:var(--on-gold-tint)}
.dot.warn{background:var(--gold)}

/* ─────────── 눌림 피드백 ───────────
   기본페이가 겪은 것과 같은 문제였다 — 눌러도 화면이 그대로라
   안 눌린 줄 알고 몇 번씩 더 누르게 된다. 특히 서명이 걸린 버튼에서 위험하다.
   기본페이와 같은 값(scale .975 · brightness .86)으로 맞췄다. */
button, .dep, .venue, a.primary{
  -webkit-tap-highlight-color:transparent; touch-action:manipulation;
  transition:transform .08s ease, filter .08s ease, opacity .08s ease}
button:active, .dep:active, .venue:active, a.primary:active{
  transform:scale(.975); filter:brightness(.86)}
button:disabled:active{transform:none; filter:none}
input[type=range]:active{transform:none; filter:none}

/* ─────────── 비율 줄 — 기본페이 .pctrow 결 ───────────
   색이 곧 이름표다. 줄마다 트랙 색과 퍼센트 칸 색을 맞춰 둔다.
     하이브리드 청록 · 소비자 초록 · 추천인 보라 */
.rate-setting + .rate-setting{margin-top:13px}
.rate-label{display:flex;justify-content:space-between;align-items:baseline}
.rate-control{display:flex;align-items:center;gap:10px;margin-top:7px}
.percent-input{flex:0 0 auto;display:flex;align-items:center;gap:2px;
  border:1px solid var(--line);border-radius:9px;background:var(--card2);padding:5px 8px}
.percent-input input{width:34px;border:0;outline:0;background:transparent;text-align:right;
  font-size:14px;font-weight:900;font-variant-numeric:tabular-nums;color:var(--green)}
.percent-input b{font-size:12px;font-weight:800;color:var(--sub)}
.percent-input:focus-within{border-color:var(--key)}

/* ─────────── 하이브리드 계산표를 잔액 카드 결로 ─────────── */
.hy-sum{background:linear-gradient(160deg,var(--sum-a),var(--sum-b));border-color:var(--sum-line)}
.hy-sum .kv.sum b{font-size:16px;letter-spacing:-.4px;color:var(--sum-txt)}
.dep .amt{letter-spacing:-.3px}

/* 큰 숫자는 기본페이 눈금대로 900 굵기에 자간을 조인다 */
.balance strong{font-size:32px;letter-spacing:-1px}
/* 길어지면 줄인다 — 카드 밖으로 나가면 종목 이름이 밀린다 */
.balance.d2 strong{font-size:24px}
.balance.d3 strong{font-size:19px}
.balance.d2 strong .cs{font-size:20px}
.balance.d3 strong .cs{font-size:16px}
.balance.d2 strong .unit{font-size:14px}
.balance.d3 strong .unit{font-size:12px}

/* ─────────── 지갑 시작하기 (만들기·복구·잠금해제) ───────────
   전체를 덮는 오버레이. 지갑이 준비되기 전에는 뒤 화면을 만지지 못하게 한다. */
.setup{position:fixed;inset:0;z-index:80;display:none;overflow-y:auto;
  background:var(--scrim);backdrop-filter:blur(6px);
  padding:24px 16px calc(24px + env(safe-area-inset-bottom))}
.setup.on{display:block}
body.setup-open{overflow:hidden}
.setup-box{width:min(430px,100%);margin:0 auto;background:var(--bg);
  border:1px solid var(--line);border-radius:20px;padding:20px 18px 18px;
  box-shadow:0 28px 90px var(--shadow-60)}

.setup-head{margin-bottom:16px}
.setup-head b{display:block;font-size:20px;font-weight:900;letter-spacing:-.5px}
.setup-head span{display:block;margin-top:6px;color:var(--sub);font-size:13px;line-height:1.7}
/* ★★ 설명줄 안의 <b> 는 **줄 안에서** 굵게만 (2026-08-30).
   위 .setup-head b 가 제목용(19px·900·block)이라, 설명 안에 <b>영구적으로</b> 를
   쓰면 그 낱말만 큰 글씨로 줄이 갈려 나갔다. 「영구적으로」가 제목처럼 떠 있었다.
   ★ 바로 아래 .mono 주석도 같은 일을 한 번 겪었다고 적어 두었다 —
     이번에는 낱말 강조까지 함께 막는다. */
.setup-head span b, .setup-head span strong{
  display:inline;font-size:inherit;font-weight:800;letter-spacing:0;color:var(--txt)}
.setup-head span.mono{font-family:ui-monospace,monospace;font-size:12.5px}
/* ★ 설명줄 안의 주소. 예전엔 .setup-head b (제목용 19px·900) 를 물려받아
   42글자가 한 줄로 나가 판을 뚫고 창에 가로 스크롤을 만들었다.
   b 든 span 이든 걸리게 하고 반드시 줄을 바꾸게 한다. */
.setup-head .mono{display:block;margin-top:5px;
  font-family:ui-monospace,monospace;font-size:12.5px;font-weight:700;
  letter-spacing:0;line-height:1.55;color:var(--txt);
  word-break:break-all;overflow-wrap:anywhere}
/* 판 자체가 가로로 넘치지 않게 — 긴 글자가 또 들어와도 창이 안 밀린다 */
.setup{max-width:100%;overflow-x:hidden}

/* 갈림길 */
.pick{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin-bottom:9px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 13px;color:var(--txt)}
.pick i{flex:0 0 auto;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  font-style:normal;font-size:16px;background:var(--tint-key);color:var(--blue)}
.pick b{flex:1;min-width:0;font-size:15px;font-weight:900}
.pick small{display:block;margin-top:4px;color:var(--sub);font-size:12px;font-weight:700;line-height:1.65}
.pick>span{color:var(--dim);font-size:19px}

.ghostline{display:block;width:100%;margin-top:9px;padding:12px;border:1px solid var(--line);
  border-radius:12px;background:transparent;color:var(--sub);font-size:13.5px;font-weight:800}

/* 단어 수 고르기 */
.wordpick{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px}
.wp{background:var(--card2);border:1px solid var(--line);border-radius:13px;padding:13px 11px;
  text-align:left;color:var(--txt)}
.wp.on{border-color:var(--key);background:var(--tint-key)}
.wp b{display:block;font-size:15px;font-weight:900}
.wp small{display:block;margin-top:4px;color:var(--sub);font-size:12.5px;font-weight:700;line-height:1.6}

/* 12단어 보여 주기 */
.words{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:14px;
  background:var(--card2);border:1px solid var(--line);border-radius:14px;padding:12px 10px}
.words .w{display:flex;align-items:baseline;gap:5px;font-size:13.5px;font-weight:800;
  font-family:ui-monospace,monospace;color:var(--txt)}
.words .w i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--dim);
  min-width:13px;text-align:right}
@media (max-width:380px){ .words{grid-template-columns:repeat(2,1fr)} }

.setup-warn{display:flex;gap:9px;align-items:flex-start;padding:12px;border-radius:12px;
  font-size:12.5px;line-height:1.7;margin-bottom:12px;
  background:var(--tint-red);border:1px solid var(--edge-red);color:var(--on-red-tint)}
.setup-warn b{color:var(--on-red-tint)}
.setup-warn i{font-style:normal;flex:0 0 auto;font-weight:900}
.setup-warn.soft{background:var(--tint-blue);border-color:var(--edge-blue);color:var(--on-blue-tint)}
.setup-warn.soft b{color:var(--on-key-tint)}
/* 가스가 없을 때 - 채울 주소를 그 자리에 적는다. 딴 화면으로 보내면 못 돌아온다. */
.setup-warn .addr{display:block;margin:8px 0 2px;padding:8px 9px;border-radius:8px;
  font-size:12px;line-height:1.5;word-break:break-all;
  background:var(--sink);border:1px solid var(--edge-red);color:var(--on-red-tint)}
.setup-warn .two{display:flex;gap:7px}
.setup-warn .two .ghostline{margin-top:6px;border-color:var(--edge-red-hi);color:var(--on-red-tint)}
/* 「어디에 적히나」 아래 붙는 실제 주소 - 작게, 곁들이는 말로 */
.setup .hy-sum .kv b.sub{margin-top:4px;font-size:12.5px;color:var(--dim);font-weight:600}
/* 「KAIA 없이 등록하기」 — 곁길이라 눈에 덜 띄게, 그러나 읽히게 */
/* 시작 화면의 「앱으로 설치하기」 — 주인공이 아니므로 조용하게 */
.setup .pick.soft{border-style:dashed;border-color:var(--edge-blue);background:transparent}
.setup .pick.soft i{color:var(--key-txt)}
.setup .pick.soft b{font-weight:800}
.setup .pick.hidden{display:none}

/* ═══ 앱 설치 권유 띠 ═══
   ★ 아래쪽 네비게이션 위에 앉는다. 화면을 가리지 않고, 한 번에 읽힌다. */
.instbar{position:absolute;left:12px;right:12px;bottom:78px;
  z-index:60;display:flex;align-items:center;gap:11px;
  padding:12px 13px;border-radius:15px;
  background:linear-gradient(160deg,var(--inst-a),var(--inst-b));border:1px solid var(--inst-line);
  box-shadow:0 10px 30px var(--shadow-45);animation:ibIn .25s ease-out}
@keyframes ibIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.instbar.hidden{display:none}
.instbar > i{flex:0 0 auto;font-style:normal;font-size:20px;color:var(--key-txt)}
.instbar > b{flex:1;min-width:0;font-size:14px;font-weight:800;color:var(--txt);line-height:1.35}
.instbar > b small{display:block;margin-top:3px;font-size:12px;font-weight:600;color:var(--sub)}
.instbar .ib-btns{flex:0 0 auto;display:flex;flex-direction:column;gap:5px}
.instbar .ib-btns button{margin:0;padding:7px 13px;font-size:13px;border-radius:9px;width:auto;display:block}
.instbar .ib-btns .ghostline{border-color:var(--line);color:var(--sub)}

/* ═══ 계정 목록 (관리자) ═══ */
.acct-head{display:flex;justify-content:space-between;align-items:baseline;
  margin:14px 0 7px;padding-top:12px;border-top:1px solid var(--line)}
.acct-head small{color:var(--sub);font-size:12.5px}
.acct-head b{color:var(--dim);font-size:12px;font-weight:700}
.acct-list{display:flex;flex-direction:column;gap:6px;margin-bottom:9px;
  max-height:44vh;overflow-y:auto}
/* ★ 계정마다 동의 여부 (2026-09-05). 초록은 「나뉜다」, 회색은 「안 나뉜다」. */
.acct-row .rg{flex:0 0 auto;font-size:10.5px;font-weight:800;padding:2px 7px;
  border-radius:999px;border:1px solid var(--line);color:var(--dim);white-space:nowrap}
.acct-row .rg.yes{color:var(--bid);border-color:var(--bid)}
.acct-row .rg.no{color:var(--dim)}
.acct-note{margin-top:8px;font-size:12.5px;color:var(--dim);font-weight:700;line-height:1.55}

.acct-row{display:flex;align-items:center;gap:9px;width:100%;padding:10px 11px;
  border-radius:11px;border:1px solid var(--line);background:var(--card2);
  color:var(--txt);text-align:left;cursor:pointer;font:inherit}
.acct-row:hover{border-color:var(--edge-blue-hi)}
.acct-row.on{border-color:var(--key);background:var(--tint-blue)}
.acct-row .nm{flex:1;min-width:0}
.acct-row .nm b{display:block;font-size:13.5px;font-weight:800;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acct-row .nm small{display:inline-flex;align-items:center;gap:4px;margin-top:3px;
  padding:2px 6px;border-radius:6px;font-size:12.5px;color:var(--dim);
  font-family:ui-monospace,monospace;border:1px solid transparent}
/* 주소 줄은 따로 누르는 자리다 — 누를 수 있어 보이게 테두리를 준다 */
.acct-row .acct-addr{cursor:pointer;border-color:var(--line);background:var(--fg-a-03)}
.acct-row .acct-addr:hover{border-color:var(--edge-blue-hi);color:var(--sub)}
.acct-row .acct-addr .cp{font-style:normal;font-size:12.5px;opacity:.6}
.acct-row .acct-addr.copied{border-color:var(--key);color:var(--key-txt);
  background:var(--tint-blue)}
.acct-row .acct-addr.copied .cp{opacity:1}
.acct-row .kd{flex:0 0 auto;font-size:10.5px;font-weight:800;padding:2px 6px;border-radius:6px;
  background:var(--fg-a-08);color:var(--sub)}
.acct-row .kd.key{background:var(--tint-gold);color:var(--gold)}
.acct-row .kd.sell{background:var(--tint-blue);color:var(--key-txt)}
.acct-row .kd.off{opacity:.5}
.acct-row .go{flex:0 0 auto;color:var(--dim);font-size:16px}
.acct-row.on .go{color:var(--key)}
/* ★ 2026-09-06 사장님 지시 — 계정 줄 두 줄 꼴: 이름 + 동의 여부(오른쪽) / 주소 한 줄(누르면 복사). 토큰만 쓴다 */
.acct-row .nm2{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.acct-row .l1{display:flex;align-items:center;gap:7px;min-width:0}
.acct-row .l1 b{flex:1 1 auto;min-width:0;font-size:14px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acct-row .l1 .kd{flex:0 0 auto;font-style:normal}
.acct-row .r1{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin-left:auto}
.acct-row .acct-addr.line{display:inline-flex;align-items:center;gap:5px;align-self:flex-start;white-space:nowrap;margin-top:0;
  padding:3px 8px;border-radius:7px;border:1px solid var(--line);font-family:ui-monospace,monospace;font-size:12px;color:var(--dim)}
.acct-row .acct-edit.pen{padding:1px 6px;font-style:normal;font-size:12px;line-height:1.4}
.acct-edit{flex:0 0 auto;padding:3px 7px;border-radius:7px;border:1px solid var(--line);
  background:transparent;color:var(--dim);font-size:12.5px;cursor:pointer}
.outline.tight{padding:9px 11px;font-size:13px;margin-top:6px}
.note.bad{color:var(--on-red-tint)}
.note b.mono.wrap{display:block;margin:6px 0;padding:8px 9px;border-radius:8px;
  font-family:ui-monospace,monospace;font-size:12px;line-height:1.6;word-break:break-all;
  background:var(--sink);border:1px solid var(--line);color:var(--txt)}
.setup .field-label em{font-style:normal;color:var(--dim);font-weight:600;margin-left:5px;font-size:12.5px}

#tmFree small{display:block;margin-top:3px;font-size:12.5px;font-weight:600;color:var(--dim)}
#tmFree{border-color:var(--edge-blue-hi);color:var(--on-key-tint);line-height:1.45}
#gasList .card .kv b.mono{font-family:ui-monospace,monospace;font-size:12px;word-break:break-all}

/* ═══ 「이미 카이아 월렛을 쓰고 계신가요?」 — 첫 화면 맨 위 (2026-08-24) ═══
   전에는 「새로 시작하기」가 맨 위라, 이미 지갑이 있는 분도 그걸 눌러
   두 번째 12단어를 만들었다. 주소가 둘로 갈려 헷갈리는 원인이었다.
   눈에 띄되 「새로 시작하기」보다 무겁지 않게 — 소비자의 30초 가입이 주인공이다. */
.askfirst{padding:13px;border-radius:14px;margin-bottom:4px;
  background:var(--tint-blue);border:1px solid var(--edge-blue)}
.askfirst>b{display:block;font-size:14px;font-weight:900;color:var(--on-key-tint)}
.askfirst>span{display:block;margin-top:5px;font-size:12.5px;line-height:1.7;
  color:var(--on-blue-tint);font-weight:700}
.askfirst>span b{color:var(--txt)}
.askfirst .ghostline{margin-top:8px;border-color:var(--edge-blue-hi);color:var(--on-key-tint);
  background:var(--sink-soft)}
.ghostline.tight{padding:9px 11px;font-size:13px}

/* ═══════════════ 금액 숫자판 (2026-08-24, 포인파이와 같은 결) ═══════════════
   폰 키보드를 띄우면 화면 아래 절반이 덮여 「다음」이 가린다.
   앱 안에 숫자판을 두면 금액과 단추가 언제나 한 화면에 같이 보인다. */
.amtbig{display:flex;align-items:baseline;justify-content:center;gap:8px;
  margin:12px 0 5px;min-height:44px;padding:0 8px}
.amtbig b{font-size:39px;font-weight:900;letter-spacing:-.02em;color:var(--txt);
  line-height:1.15;font-variant-numeric:tabular-nums;word-break:break-all}
.amtbig i{font-style:normal;font-size:16px;font-weight:800;color:var(--sub);flex:0 0 auto}
/* 자릿수가 길어지면 글자를 줄인다 — PIT 는 금방 열 자리를 넘는다 */
.amtbig.d2 b{font-size:29px}
.amtbig.d3 b{font-size:22px}
/* 환산 줄 = 단위 바꾸기 단추. 글자만 있는 단추라 눌러도 되는지 보이게 밑줄 힌트를 붙인다. */
.amtkrw{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  text-align:center;color:var(--dim);font-size:12.5px;font-weight:700;margin:0 0 10px;
  padding:5px 0;background:transparent;border:0;-webkit-tap-highlight-color:transparent}
.amtkrw i{font-style:normal;color:var(--blue);font-size:12.5px;font-weight:800;
  border:1px solid var(--line);border-radius:999px;padding:3px 8px;white-space:nowrap}
.amtkrw:active i{background:var(--card2)}
/* 원화로 넣는 중에는 큰 숫자를 파랗게 — 지금 무엇을 치고 있는지 한눈에 */
.amtbig.krw b{color:var(--blue)}

.numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-bottom:10px}
.numpad button{padding:12px 0;background:transparent;border:0;border-radius:12px;
  color:var(--txt);font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;
  min-height:48px;-webkit-tap-highlight-color:transparent}
.numpad button:active{background:var(--card2)}
/* ★ 키는 48px 아래로 내려가지 않게 한다 — 그보다 작으면 옆 숫자를 누른다.
   반대로 무작정 키우면 「다음」이 아래 바에 가려 스크롤해야 한다.
   375x812 폰에서 가스비 줄과 「다음」까지 한 화면에 들어오는 값으로 맞췄다. */
@media (min-height:880px){ .numpad button{padding:17px 0} }

/* ★★ 짧은 폰에서는 묶음을 **줄인다** (2026-08-29).
   묶음(.padstick)은 sticky bottom:0 이라 화면보다 크면 위로 끌려 올라와
   자산 탭과 받는 곳을 덮는다. 재 보니 이렇다 —
       812px 폰 다 보임 · 730px 겨우 · 698px 30px 가림 · 640px 88px 가림
   ★ 「사용 가능한 금액」은 이미 묶음 안으로 옮겼으니 어떤 폰에서도 보인다.
     여기서 더 줄이는 것은 **자산 탭까지** 안 가리게 하려는 것이다.
   ★ 키는 48px(min-height) 아래로 안 내려간다 — 그보다 작으면 옆 숫자를 누른다.
     여기서 줄이는 것은 padding 이라 실제 누르는 크기는 그대로다. */
/* ★★ 800px 까지 올렸다 (2026-08-29, 반박 검토).
   예전에는 760px 이었는데, 요약줄이 생기면서 761~791px 구간에서
   묶음이 화면보다 커져 뒤로가기 「‹」와 제목을 덮었다.
   그 구간에는 아무 규칙도 안 걸려 있었다. */
@media (max-height:800px){
  .numpad{gap:1px;margin-bottom:6px}
  .numpad button{padding:6px 0}
  .availline{margin-bottom:6px}
  .padstick .row-link{padding-top:8px;padding-bottom:8px}
  .padstick .row-link small{display:none}
  .padstick .gasline{margin-bottom:6px}
  .padstick .amtbig{margin-bottom:2px}
  .padstick .amtkrw{padding-top:2px;padding-bottom:2px}
  .padstick{padding-top:4px}

  /* 묶음 **위**도 같이 줄인다. 아래만 줄여서는 못 채운다 —
     667px 폰에서는 위아래 합이 화면보다 크다. */
  #sendAmt .dest{margin-bottom:7px;padding:7px 11px}
  #sendAmt .tabs.seg{margin-bottom:7px}
  #sendAmt .back-title{margin-bottom:7px}
}

/* ★★ 짧은 폰 (700px 아래). 여기서는 위의 조정으로도 안 들어간다.
   ★★ 묶음이 화면(.screen)보다 커지면 sticky 가 **위로 당겨져 뒤로가기 「‹」를 덮는다.**
     실제로 그랬다 — 667px 폰에서 32px 덮여 뒤로 갈 길이 사라졌다.
     그래서 묶음은 **언제나 화면보다 작아야 한다.** 그것이 이 단계의 목적이다.
   ★ 이 화면의 「대신 잠가서 보내기」만 접는다 — 없어지는 길이 아니다.
     같은 문이 **앞 화면(보내기 ①)과 홈**에도 있다. 여기 것은 덤이다.
   ★ 키의 누르는 크기는 44px 아래로 안 내린다. 그보다 작으면 옆 숫자를 누르고,
     보내는 화면에서 옆 숫자를 누르는 것은 돈이 틀리는 일이다. */
@media (max-height:700px){
  .padstick .row-link{display:none}
  .numpad button{min-height:44px;padding:2px 0;font-size:20px}
  .padstick .amtbig{margin-bottom:0}
  .padstick .amtbig b{font-size:33px}
  #sendAmt .tabs.seg{margin-bottom:5px}
  #sendAmt .dest{margin-bottom:5px}
}

/* ── 금액 묶음을 화면 아래에 붙인다. 위 정보줄만 스크롤된다. ── */
/* 아래쪽은 홈 인디케이터(아이폰 막대)에 안 물리게 여백을 준다 */
.padstick{position:sticky;bottom:0;z-index:2;background:var(--bg);padding-top:8px;
  padding-bottom:max(10px,env(safe-area-inset-bottom))}
.padstick::before{content:'';position:absolute;left:0;right:0;top:-14px;height:14px;
  background:linear-gradient(to bottom,transparent,var(--bg));pointer-events:none}

/* 보내기 흐름에서는 아래 탭바를 숨긴다.
   ★ 세 걸음짜리 흐름 한가운데에서 다른 탭으로 샐 일은 없고,
     그 64px 이 있어야 작은 폰에서 「다음」이 가리지 않는다. 위쪽 ‹ 로 돌아간다. */
body.flow nav{display:none}

/* 풀 상태 딱지 — 색으로 한눈에 (관리자 유동성 탭) */
.lphealth.ok{color:var(--green)}
.lphealth.warn{color:var(--gold)}
.lphealth.bad{color:var(--burn-a)}

/* 지갑 화면의 「리워드 결제」 문 — 눈에 띄되 요란하지 않게 */
.row-link.hy{border-color:var(--edge-key);background:var(--tint-key)}
.row-link.hy > i{color:var(--on-key-soft)}

/* 80/20 나눔 — **고를 수 없는 값**이라 슬라이더가 아니라 보여 주기만 한다 */
.splitbox{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 4px}
.splitbox .sp{position:relative;border:1px solid var(--line);border-radius:12px;
  background:var(--card2);padding:11px 12px 10px}
.splitbox .sp i{display:block;height:3px;border-radius:99px;margin-bottom:7px}
.splitbox .sp i.a{background:var(--green)}
.splitbox .sp i.b{background:var(--purple)}
.splitbox .sp b{display:block;font-size:18px;font-weight:900;color:var(--txt)}
.splitbox .sp small{display:block;margin-top:2px;color:var(--sub);font-size:12.5px;font-weight:700}
.splitbox p{grid-column:1 / -1;margin:2px 0 0;color:var(--dim);
  font-size:12.5px;font-weight:700;line-height:1.7}
.splitbox p b{color:var(--sub)}

/* ★ 금액을 담는 변형 (2026-09-02) — 「80%」보다 훨씬 길다.
   글자를 줄이고 자간을 조여 한 줄에 넣는다. 넘치면 줄바꿈보다 줄이는 편이 낫다 —
   두 상자의 높이가 달라지면 나란히 놓은 뜻이 없어진다. */
.splitbox.amt{margin:8px 0 4px}
.splitbox.amt .sp{padding:10px 11px 9px}
.splitbox.amt .sp b{font-size:15px;letter-spacing:-.3px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.splitbox.amt .sp small{font-size:12.5px;line-height:1.45}
.splitbox.amt .sp small em{font-style:normal;color:var(--dim)}

/* ★ 비밀번호 칸을 CSS 로 가리지 않는다 (2026-08-24 되돌림).
   한때 type=text + -webkit-text-security:disc 로 크롬 비밀번호 관리자를 떼려 했는데,
   어떤 크롬에서는 **점이 서너 개만 그려지고 더 쳐도 늘지 않았다.**
   값은 멀쩡히 들어가는데 화면만 그러니, 쓰는 사람은 비밀번호가 안 쳐진 줄 안다.
   지갑을 여는 칸에서 그건 어떤 이득과도 바꿀 수 없다. type=password 로 되돌렸다. */

/* 입력 줄 */
.qz{display:block;margin-bottom:11px}
.qz b{display:block;font-size:12.5px;font-weight:800;color:var(--sub);margin-bottom:5px}
.qz input{width:100%;background:var(--card2);border:1px solid var(--line);border-radius:11px;
  padding:12px;font-size:15px;color:var(--txt);font-family:inherit}
.qz input:focus{outline:0;border-color:var(--key)}
.mnbox{width:100%;background:var(--card2);border:1px solid var(--line);border-radius:12px;
  padding:12px;font-size:14px;line-height:1.8;color:var(--txt);resize:vertical;
  font-family:ui-monospace,monospace}
.mnbox:focus{outline:0;border-color:var(--key)}

.pwhint{min-height:16px;font-size:12px;font-weight:800;margin:-4px 2px 10px;color:var(--dim)}
.pwhint.good{color:var(--green)}
.pwhint.bad{color:var(--red)}
.pwhint.warn{color:var(--gold)}

.orline{display:flex;align-items:center;gap:10px;margin:12px 0;color:var(--dim);font-size:12px;font-weight:800}
.orline::before,.orline::after{content:'';flex:1;height:1px;background:var(--line)}

.setup-note{margin:14px 2px 0;color:var(--dim);font-size:12.5px;line-height:1.75}
.outline.danger{border-color:var(--edge-red-hi);color:var(--on-red-tint)}
/* 되돌릴 수 없는 일을 하는 단추 — 지갑 삭제 (2026-08-30).
   ★ 다른 primary 와 **색으로** 갈라 놓는다. 같은 파랑으로 두면
     늘 누르던 단추와 구별이 안 돼 손이 먼저 나간다.
   ★ 잠겼을 때는 눌러도 되는 것처럼 보이면 안 된다 — 흐리게 한다. */
.primary.danger{background:linear-gradient(180deg,var(--danger-a),var(--danger-b));
  border-color:var(--edge-red-hi);color:var(--on-danger)}
.primary.danger:disabled{background:var(--tint-red);
  border-color:var(--edge-red);color:var(--on-danger-off)}

/* ─────────── 받기 화면 — 보내기 전 확인 ───────────
   네트워크를 잘못 고르면 자산이 사라진다. 그래서 한 줄씩 크게 세운다. */
.checkrow{padding:9px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.checkrow:last-of-type{border-bottom:0}
.checkrow span:first-child{flex:1;color:var(--txt);font-weight:700;font-size:13px;line-height:1.7}
.checkrow span:first-child b{display:block;color:var(--sub);font-size:12.5px;font-weight:800;
  margin-bottom:2px}
.checkrow span:first-child b + b{display:inline;color:var(--gold);font-size:13px;margin:0}
.checkrow em{flex:0 0 auto;font-style:normal;font-size:12.5px;font-weight:800;color:var(--red);
  background:var(--tint-red);border-radius:5px;padding:2px 6px}
.checkrow em:empty{display:none}
#usdtFull{font-family:ui-monospace,monospace;font-size:12.5px;word-break:break-all;text-align:left}

/* ─────────── 소각 ───────────
   ★ 소각은 결제금액의 %가 아니라 **매수 결과**의 % 다.
     화면에서 이 구분이 흐려지면 판매점이 비용을 잘못 계산한다. */
.hy-sum.burnbox{margin-top:8px;background:var(--tint-red);border-color:var(--edge-red)}
.hy-sum.burnbox .kv b{color:var(--on-red-tint)}
.hy-sum.burnbox .kv:first-child b{color:var(--green)}
.tiny{margin:8px 0 0;font-size:12.5px;line-height:1.7;color:var(--dim)}
.tiny b{color:var(--sub)}
.rate-control input.red{accent-color:var(--red)}
.percent-input.red{border-color:var(--pct-red)}
.percent-input.red input{color:var(--red)}
.chk em{font-style:normal;color:var(--dim);font-weight:700}

/* ─────────── 가스 ───────────
   판매점이 내는 돈이므로 정산표에 보인다. 대납하지 않기로 했다(2026-08-23). */
.gasline{margin-top:10px;padding:10px 12px;border-radius:10px;
  background:var(--card2);border:1px solid var(--line)}
.gasline b{color:var(--sub);font-size:12.5px;font-weight:800}

/* ─────────── 서명 확인 ───────────
   내장 지갑에는 지갑 앱의 서명창이 없다. 이 화면이 그 자리다.
   금액을 크게 세우는 것이 핵심 — 「확인하시겠습니까?」만 있으면 사람은 그냥 누른다. */
.setup .hy-sum .kv b.big{font-size:20px;font-weight:900;letter-spacing:-.5px;color:var(--txt)}
.setup .hy-sum .kv b.mono{font-family:ui-monospace,monospace;font-size:12px;
  word-break:break-all;text-align:right;line-height:1.6}
.setup .hy-sum .kv{align-items:flex-start;padding:8px 0}
.setup .hy-sum .kv + .kv{border-top:1px solid var(--line)}

/* 진단 줄 */
#diag .kv{padding:6px 0;border-bottom:1px solid var(--line);font-size:12.5px}
#diag .kv:last-child{border-bottom:0}
#diag .kv span:first-child{font-family:ui-monospace,monospace;color:var(--sub)}
#setupWarn span{white-space:pre-line}

/* ─────────── 설정 줄 (첨부하신 보안 화면 구조) ───────────
   카드 안에 문단을 쌓지 않고 「한 줄에 하나」로 둔다.
   기본페이·원화페이가 쓰는 방식이고, 훑어보기가 훨씬 쉽다. */
.secrow{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:15px 14px;margin-bottom:9px;color:var(--txt);font-size:14.5px;font-weight:800}
.secrow.tight{padding:12px 13px;margin-bottom:7px;font-size:13.5px}
.secrow > span{flex:1;min-width:0}
.secrow > span small{display:block;margin-top:3px;color:var(--sub);font-size:12px;font-weight:700}
.secrow em{font-style:normal;color:var(--sub);font-size:13.5px;font-weight:700}
.secrow em.hi{color:var(--blue);font-weight:800}
.secrow > b{color:var(--dim);font-size:18px;font-weight:400}
.secrow.as-btn{cursor:pointer}
.secrow.danger > span{color:var(--red)}

.pill{flex:0 0 auto;border:0;border-radius:9px;background:var(--ctrl);color:var(--txt);
  padding:8px 15px;font-size:13px;font-weight:800}

/* 토글 */
.tgl{flex:0 0 auto;width:50px;height:28px;border:0;border-radius:999px;
  background:var(--ctrl);padding:0;position:relative;transition:background .16s}
.tgl i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;
  background:var(--knob);transition:transform .16s;display:block}
.tgl.on{background:var(--gold)}
.tgl.on i{transform:translateX(22px)}
.tgl:disabled{opacity:.4}

/* 목록형 이동 줄 */
.row-link{display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:14px 13px;margin-bottom:10px;color:var(--txt)}
.row-link i{flex:0 0 auto;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  font-style:normal;font-size:15px;background:var(--tint-key);color:var(--blue)}
.row-link b{flex:1;min-width:0;font-size:14.5px;font-weight:800}
.row-link small{display:block;margin-top:3px;color:var(--sub);font-size:12px;font-weight:700;
  word-break:break-all}
.row-link > span{flex:0 0 auto;color:var(--dim);font-size:13px;font-weight:800}

/* ═══════════════ 원화페이 결로 맞춘 새 조각들 (2026-08-23) ═══════════════
   하이브리드를 걷어내고 화면을 넷으로 나누면서 필요해진 것들이다.
   기본페이·원화페이와 같은 눈금(본문 12.5 · 라벨 11.5 · 제목 19)을 지킨다. */

/* 주소 한 줄 — 잔액 카드 위 */
.acc{display:flex;justify-content:center;margin-bottom:12px}
.addrchip{border:1px solid var(--line);border-radius:999px;background:var(--card2);
  color:var(--sub);padding:7px 14px;font-size:12.5px;font-weight:800;
  font-family:ui-monospace,monospace}
.addrchip:active{background:var(--card)}

/* 자산 / 전송 내역 */
.wtabs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:16px 0 12px;
  border-bottom:1px solid var(--line)}
.wtabs button{border:0;background:transparent;color:var(--sub);
  padding:10px 0 11px;font-size:14px;font-weight:800;border-bottom:2px solid transparent}
.wtabs button.on{color:var(--txt);border-bottom-color:var(--blue)}

/* 목록 — 최근 보낸 곳 · 전송 내역 */
/* 「한눈에」 카드 — 정보 화면 맨 위 (2026-08-29).
   ★ 누적 소각은 **빨강**이다 (사장님 요청). 「줄어든 양」이라 색이 맞는다.
     다만 경고 빨강보다 한 톤 낮춘다 — 소각은 사고가 아니라 정상 동작이다. */
.glance .kv b.burn{color:var(--burn-a);font-variant-numeric:tabular-nums}
.glance .kv b{font-variant-numeric:tabular-nums}
.glance .kv.sum{margin-top:6px;padding-top:9px;border-top:1px solid var(--line)}
.glance .outline{width:100%;margin-top:10px}
/* 소각 막대 — 같은 빨강 계열로. 「줄어든 양」이라 색이 맞는다 (2026-08-29). */
.glance .rvbar.burnbar i{background:linear-gradient(90deg,var(--burn-a),var(--burn-b))}
.glance .rvnote{text-align:left}
/* ★★ 2026-09-05 사장님 지시 — 「한눈에」 상자를 **어두운 골드**로.
   ★ 값을 여기 박지 않고 토큰으로 둔다 — 밝은 화면이 따로 있어서,
     한 색으로 박으면 낮에 글자가 안 보인다. */
.glance{background:var(--glance-bg);border-color:var(--glance-line)}
.glance .execute-head h2{color:var(--gold-hi)}
.glance .kv.sum{border-top-color:var(--glance-line)}
.glance .outline{border-color:var(--glance-line)}


/* ─────────── 쇼핑몰 (2026-08-30) ───────────
   ★ 그림이 없어도 자리가 무너지지 않게 회색 칸을 남긴다.
     상품 사진은 나중에 넣는다 — 없다고 화면이 깨지면 안 된다. */
.shoplist{display:flex;flex-direction:column;gap:9px;margin:12px 0 14px}
.shopcard{display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  border:1px solid var(--line);border-radius:14px;background:var(--card2);
  padding:11px 12px;color:var(--txt)}
.shopcard .shopthumb{flex:0 0 auto;width:54px;height:54px;border-radius:11px;
  background:var(--bg) center/cover no-repeat;border:1px solid var(--line)}
.shopcard > b{flex:1 1 auto;min-width:0;font-size:14.5px;font-weight:800}
.shopcard > b small{display:block;margin-top:3px;color:var(--sub);
  font-size:12px;font-weight:700}
.shopcard > span{flex:0 0 auto;text-align:right;font-size:14px;font-weight:900;
  color:var(--key-txt);font-variant-numeric:tabular-nums}
.shopcard > span em{display:block;margin-top:3px;font-style:normal;
  color:var(--sub);font-size:12.5px;font-weight:700}
.shopimg{height:170px;border-radius:14px;border:1px solid var(--line);
  background:var(--card2) center/cover no-repeat;margin-bottom:12px}
.amtbig.tight{margin:8px 0 2px}
#shopTier{font-size:12.5px;font-weight:800;color:var(--key-txt)}

/* ── 디앱 (2026-09-06 밤) — 토큰만 쓴다 (주간·야간 둘 다 살아야 한다)
   ★ 2026-09-10 에드: 2열 카드는 **포인통만**. 포인파이는 쇼핑몰 카드가 없어 한 줄 배치 그대로. ── */
.dapplist{display:flex;flex-direction:column;gap:9px;margin:12px 0 14px}
.dappcard{display:flex;align-items:center;gap:12px;width:100%;text-align:left;box-sizing:border-box;
  border:1px solid var(--line);border-radius:14px;background:var(--card2);
  padding:12px 13px;color:var(--txt);text-decoration:none;font:inherit;cursor:pointer}
.dappcard .dappic{flex:0 0 auto;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;
  font-style:normal;font-size:19px;font-weight:900;background:var(--tint-key);color:var(--on-key-tint)}
.dappcard > b{flex:1 1 auto;min-width:0;font-size:14.5px;font-weight:800;line-height:1.3}
.dappcard > b em{font-style:normal;font-weight:700;color:var(--sub);font-size:12px;margin-left:6px}
.dappcard > b small{display:block;margin-top:3px;color:var(--sub);font-size:12px;font-weight:700;line-height:1.35}
.dappcard > span{flex:0 0 auto;font-size:12.5px;font-weight:800;color:var(--key-txt);white-space:nowrap}
.dappcard.soon{opacity:.72}
.dappcard.soon > span{color:var(--sub)}

/* 주소록 줄 — 고르기 / 이름 고치기 / 지우기 (2026-08-29) */
.bkrow{display:flex;align-items:stretch;gap:6px}
.bkrow .bkpick{flex:1 1 auto;min-width:0;text-align:left}
.bkrow .pill{flex:0 0 auto;align-self:center}
.bkrow .bkedit{min-width:38px}
.bkrow .bkdel{min-width:38px;color:var(--burn-a);border-color:var(--edge-red-hi)}
.bkrow .bkcopy{min-width:38px}
/* ★★ 2026-09-05 사장님 지적 — 이름이 세로로 접혔다.
   .feeditem 은 display:flex 라 <b>이름</b> 과 <small>주소</small> 가
   **가로로 나란히** 놓인다. 주소가 길어 이름 칸이 0 까지 밀리면
   「최 / 은 / 천」처럼 한 글자씩 세로로 쌓인다.
   ★ 최근 보낸 곳·주소록 줄만 세로 쌓기로 바꾼다 — 이름 한 줄, 그 아래 주소. */
.bkrow .bkpick{flex-direction:column;align-items:stretch;justify-content:center;gap:3px}
.bkrow .bkpick b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  word-break:keep-all}
/* ★ 2026-09-06 밤 사장님 지시(2차) — 주소록 줄은 **한 줄**: 이름 · 주소(…) · 연필. ✕ 는 없다(연필 창 안). 「주소 넣기」와 목록 사이는 조금 띄운다 */
#bkList{margin-top:12px}
.bkrow.one .bkpick{flex-direction:row;align-items:center;gap:8px;padding:9px 11px}
.bkrow.one .bkpick b{flex:0 0 auto;max-width:42%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bkrow.one .bkpick small{flex:1 1 auto;min-width:0;text-align:right;font-size:12.5px}
.bkrow.one .bkedit{min-width:40px;align-self:stretch}
/* 추천인 화면 — 주소 한 줄(글자 줄임) · 「내 추천인」 한 줄 (2026-09-06 밤 사장님 지시) */
.address.one{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;word-break:normal;font-size:12.5px;letter-spacing:-.2px;padding:9px 10px;line-height:1.4;margin-top:2px}
.refline.one{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;padding:9px 10px}
.refline.one span:first-child{flex:0 0 auto}
.refline.one span:last-child{flex:1 1 auto;min-width:0;text-align:right;font-size:10.5px;letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
.inv-list{margin-top:10px}
.bkrow .bkpick small{font-family:ui-monospace,monospace;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ★ 눈 아이콘 — **SVG 를 못 누르게** 한다 (2026-09-05).
   손잡이가 ev.target.closest('.eye') 로 단추를 찾는데, 누르는 자리는 SVG 안쪽이다.
   옛 사파리에는 SVGElement.closest 가 없어 거기서 조용히 끝났다 —
   「어떤 핸드폰에서는 눈이 안 눌린다」던 것이 이것이다.
   이 한 줄이면 ev.target 이 언제나 단추가 된다. */
.eye svg, .eye svg *{pointer-events:none}
/* ★ 2026-09-05 — askForm 의 비밀번호 칸 눈 아이콘.
   .field 가 이미 flex 라 형제로 넣기만 하면 자리가 맞는다.
   (.field b 가 단위를 붙이는 것과 같은 자리다) */
.field > .eye{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:30px;height:30px;padding:0;margin:0;border:0;border-radius:8px;
  background:transparent;color:var(--dim);cursor:pointer;font:inherit;
  -webkit-appearance:none;appearance:none}
.field > .eye:hover{color:var(--txt);background:var(--card2)}
.field > .eye.on{color:var(--blue)}


/* 「최근 보낸 곳 | 주소록」 두 칸 (2026-08-29).
   ★ .segt.sub 는 이미 3칸짜리(자산 화면 전체/보냄/받음)로 쓰이고 있다.
     그것을 그대로 쓰면 두 칸인데 셋으로 나뉘어 오른쪽이 빈다. 따로 잡는다. */
#toSeg{margin-top:14px;grid-template-columns:repeat(2,1fr)}

.feed{display:flex;flex-direction:column;gap:8px}
/* ★★ 2026-09-04 사장님 지시 — 문장 한 덩어리에서 **두 칸**으로.
   「한 줄로 왼쪽에 제목 오른쪽에 숫자 넣어서 일목요연하게」
   왼쪽: 무슨 일인가 + 누구와   오른쪽: 얼마 + 곁들일 숫자 하나
   ★ 줄이 <a> 가 아니라 <button> 이다. 단추 기본 모양을 지워야 글꼴이 안 튄다. */
.feeditem.pend{opacity:.72}
.feeditem{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  width:100%;text-align:left;text-decoration:none;font:inherit;cursor:pointer;
  border:1px solid var(--line);border-radius:12px;background:var(--card2);
  padding:11px 13px;color:var(--txt)}
.feeditem .fi-l{min-width:0;flex:1 1 auto}
.feeditem .fi-r{flex:0 0 auto;text-align:right;max-width:62%}
.feeditem b{display:block;font-size:13.5px;font-weight:800;line-height:1.35}
.feeditem small{display:block;margin-top:3px;color:var(--sub);font-size:12px;
  font-weight:700;line-height:1.4}
/* 왼쪽 아래는 주소다 — 길면 말줄임으로 자른다. 접히면 두 칸이 어긋난다. */
.feeditem .fi-l small{font-family:ui-monospace,monospace;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 숫자는 자리를 맞춘다 — 세로로 눈이 따라가야 한눈에 읽힌다 */
.feeditem .fi-r b,.feeditem .fi-r small{font-variant-numeric:tabular-nums}
.feeditem .fi-r b{white-space:normal;overflow-wrap:anywhere}
.feed .note{margin:6px 2px}

/* 전체 화면의 아이콘 격자 — 원화페이와 같은 모양 */
.mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px 4px;margin-bottom:16px}
/* ★ 칸 자체는 투명하다 — 테두리 친 카드 열두 개는 화면을 시끄럽게 만든다.
   ★ 누르는 자리는 칩이 아니라 **칸 전체**다. 작은 칩만 누르게 하면 잘 안 눌린다. */
.mgrid .hi{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:7px;border:0;background:transparent;padding:10px 2px;color:var(--txt);
  border-radius:12px}
/* 아이콘 칩 — 둥근 네모 안에 글자 하나 */
.mgrid .hi b{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;
  border:1px solid var(--line);background:var(--card2);
  font-size:20px;font-weight:400;color:var(--blue);line-height:1}
.mgrid .hi span{font-size:12.5px;font-weight:700;text-align:center;color:var(--sub);
  line-height:1.35;word-break:keep-all}
.mgrid .hi:active b{background:var(--card);border-color:var(--blue)}
.mgrid .hi:active span{color:var(--txt)}

/* 보내기 — 받는 곳 · 보낼 수 있는 금액 줄 */
.dest{display:flex;align-items:center;gap:9px;margin-bottom:12px;
  border:1px solid var(--line);border-radius:12px;background:var(--card2);padding:11px 13px}
.dest > span{flex:0 0 auto;color:var(--sub);font-size:12.5px;font-weight:800}
.dest > b{flex:1 1 auto;text-align:right;font-size:13.5px;font-weight:800;
  font-family:ui-monospace,monospace;word-break:break-all}
.dest .pill{flex:0 0 auto}
.toname{margin:6px 2px 0;color:var(--sub);font-size:12.5px;font-weight:700;min-height:17px}

/* 사용 가능한 금액 — 숫자를 치는 곳 **바로 위**에 한 줄로 (2026-08-29).
   ★ 카드(.dest)로 감싸지 않는다. 여기는 숫자판 묶음 안이라 세로 한 칸이 아깝다.
     테두리와 안쪽 여백만 빼도 59px 이 30px 이 된다.
   ★ 숫자는 tabular-nums 로 — 자릿수가 바뀌어도 「최대」가 안 흔들린다. */
.availline{display:flex;align-items:center;gap:8px;margin:0 2px 8px}
.availline > span{flex:0 0 auto;color:var(--sub);font-size:12.5px;font-weight:800}
.availline > b{flex:1 1 auto;text-align:right;font-size:14px;font-weight:900;
  color:var(--txt);font-variant-numeric:tabular-nums;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.availline .pill{flex:0 0 auto}

/* 나뉘는 것 한 줄 요약 — 금액 바로 아래 (2026-08-29).
   「이대로 보낼까요」를 뺀 자리를 이것이 메운다. 자세한 것은 서명판에 있다.

   ★★ **자리를 늘 비워 둔다.** 이 줄이 생겼다 없어졌다 하면 안 된다 —
     묶음(.padstick)은 바닥에 붙어 있어서, 줄이 하나 생기면 아래가 늘어나는 게
     아니라 **위쪽 전부가 올라간다.** 숫자판이 손가락 밑에서 최대 35px 튀고,
     돈을 치는 화면에서 그건 옆 숫자를 누르게 만든다.
   ★ 그래서 숨길 때도 display 가 아니라 visibility 로 숨긴다. 높이는 그대로 남는다.
   ★ 두 줄짜리 문구(외부 출금)도 있으므로 min-height 를 두 줄로 잡는다. */
.splitline{margin:0 2px 7px;padding:6px 9px;border-radius:9px;
  background:var(--tint-key);border:1px solid var(--edge-key);
  color:var(--key-txt);font-size:12px;font-weight:800;line-height:1.5;
  text-align:center;min-height:33px;box-sizing:border-box}
/* ★ .hidden 은 display:none !important 라 못 이긴다 (2026-08-29).
   그래서 이 줄만은 다른 이름으로 숨긴다 — 자리는 남고 글자만 사라진다. */
.splitline.blank{visibility:hidden}

/* 서명판의 여분 줄 — 본문보다 한 칸 낮게 */
.hy-sum.extra{margin-top:8px}
.setup-warn.soft{opacity:.92}

/* 큰 금액 입력칸 */
.field.big input{font-size:27px;font-weight:900;letter-spacing:-.8px;padding:14px 12px}
.field.big b{font-size:15px}

/* 세 칸·다섯 칸짜리 구분 탭 */
.segt.sub{grid-template-columns:repeat(3,1fr)}
/* ★ 탭이 다섯이다 (2026-09-03, 「지급」을 걷어냄). 한 줄에 다섯.
   예전 4+span2 는 일곱 탭용이라 리워드가 둘째 줄 반 폭에 혼자 섰다. */
.segt.adtabs{grid-template-columns:repeat(5,1fr)}

/* ── 계정마다 리워드 ──
   ★ .acct-list 는 max-height 44vh 라 손잡이가 달린 열 줄이 안에서 또 스크롤된다.
     폰에서 그게 고장으로 읽힌다. 여기는 높이를 안 자른다. */
.rwacct-list{margin-top:12px}
.rwacct{border:1px solid var(--line);border-radius:12px;background:var(--card2);
  padding:11px 12px}
.rwacct + .rwacct{margin-top:8px}
.rwacct-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.rwacct-top b{font-size:13.5px;font-weight:800}
.rwacct-top small{color:var(--dim);font-size:12.5px;font-weight:700;
  font-family:ui-monospace,monospace}
.rwacct.me{border-color:var(--key);background:var(--tint-key)}
.rwacct-chain{display:block;margin-top:7px;color:var(--dim);font-size:12.5px;
  font-weight:700;line-height:1.5}
.rwacct-chain.warn{color:var(--gold)}
.segt.adtabs button{padding:9px 2px;font-size:12.5px}

/* 관리자 탭 내용 */
.adpane{display:block}
.adpane.hidden{display:none}

/* 검사 결과 색 */
.okTxt{color:var(--green);font-weight:800}
.failTxt{color:var(--red);font-weight:800}
.warnTxt{color:var(--gold);font-weight:800}

/* 여러 줄 입력 (관리자 목록 · 공시문) */
textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:var(--card2);
  outline:0;padding:12px;color:var(--txt);font-size:13px;line-height:1.7;
  font-family:ui-monospace,monospace;resize:vertical;margin-bottom:10px}
textarea:focus{border-color:var(--key)}
textarea[readonly]{color:var(--sub)}

/* 관리자 화면의 주소는 통째로 보여 준다 — 축약하면 바꿔치기를 눈으로 못 잡는다 */
#tPit,#tRef{margin-bottom:12px}

/* ═══════════════ 포인파이 지갑과 같은 결로 (2026-08-23) ═══════════════
   맨 위 카드는 USDT, 지갑 연결은 오른쪽 위 한 자리, 자산 아래에 비중 막대. */

/* 오른쪽 위 연결 단추 — 연결되면 주소 조각으로 바뀐다 */
.wbtn{border:1px solid var(--line);border-radius:999px;background:var(--card2);
  color:var(--txt);padding:6px 12px;font-size:12px;font-weight:800;white-space:nowrap}
.wbtn.on{border-color:var(--key);background:var(--tint-key);color:var(--on-key-soft);
  font-family:ui-monospace,monospace}
.wbtn:active{background:var(--card)}
/* 어느 지갑으로 들어와 있는지 — 주소 조각 앞에 붙이는 작은 딱지.
   포인파이 금고와 카이아 월렛을 함께 쓰는 판매점이 헷갈리지 않게 한다. */
.wbtn .wtag{display:inline-block;margin-right:5px;padding:1px 5px;border-radius:999px;
  background:var(--fg-a-08);font-size:10px;font-weight:900;font-family:inherit;
  letter-spacing:.02em;vertical-align:1px}

/* 주소 한 줄 — 왼쪽 정렬 + 복사 */
.acc{display:flex;align-items:center;gap:7px;margin-bottom:12px;justify-content:flex-start}
.addrtxt{color:var(--txt);font-size:14px;font-weight:800;font-family:ui-monospace,monospace}
.cpy{width:26px;height:26px;border:1px solid var(--line);border-radius:7px;
  background:var(--card2);color:var(--sub);font-size:13px;display:grid;place-items:center}
.cpy:active{background:var(--card)}

/* 잔액 카드의 달러 기호 — 포인파이처럼 숫자에 가깝게 크게 */
.balance strong .cs{font-style:normal;font-size:26px;font-weight:900;
  color:var(--fg-a-80);margin-right:5px}

/* 총 자산 요약 — 비중 막대 */
.sumcard{border:1px solid var(--line);border-radius:16px;background:var(--card);
  padding:14px 15px;margin-bottom:14px}
.s-top{display:flex;align-items:center;justify-content:space-between}
.s-top > span{color:var(--sub);font-size:12.5px;font-weight:800}
.s-top > b{font-size:17px;font-weight:900;font-variant-numeric:tabular-nums}
.s-top .cs{font-style:normal;color:var(--sub);margin-right:3px}
.s-bar{display:flex;height:6px;border-radius:99px;overflow:hidden;background:var(--card2);
  margin:11px 0 9px}
.s-bar i{display:block;height:100%;transition:width .25s}
.s-bar .bu{background:var(--green)}
.s-bar .bp{background:var(--gold)}
.s-bar .bk{background:var(--blue)}
.s-leg{display:flex;align-items:center;justify-content:space-between;gap:8px;
  color:var(--sub);font-size:12.5px;font-weight:800;flex-wrap:wrap}
.s-leg .lg{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.s-leg em{width:6px;height:6px;border-radius:50%;display:inline-block;flex:0 0 auto}
.s-leg .du{background:var(--green)} .s-leg .dp{background:var(--gold)} .s-leg .dk{background:var(--blue)}
.s-leg b{color:var(--txt);font-weight:900;font-variant-numeric:tabular-nums}

/* 자산 / 전송 내역 — 포인파이처럼 둥근 칸 */
.wtabs{grid-template-columns:1fr 1fr;gap:6px;border:1px solid var(--line);
  border-radius:12px;background:var(--card2);padding:4px;margin:14px 0 12px}
.wtabs button{border-radius:9px;padding:9px 0;border-bottom:0}
.wtabs button.on{background:var(--card);color:var(--txt);border-bottom:0}

/* ═══════════ 자산 상세 · 스캔선 (2026-08-23) ═══════════ */

/* 보유 자산 줄을 눌러 들어갈 수 있게 */
.asset{width:100%;text-align:left;border:1px solid var(--line);background:var(--card)}
.asset:active{background:var(--card2)}
/* ★★ 2026-09-05 사장님 지시 — 홈을 조금씩 줄여 **KAIA 줄까지 보이게** 한다.
   한 곳을 크게 줄이면 그 칸만 초라해진다. 여러 곳을 조금씩 깎는다. */
#home .balance{padding:13px 15px 11px}
#home .balance strong{margin:5px 0 10px;font-size:28px}
#home .balance .actions button{padding:10px 0}
#home .wtabs{margin:11px 0 9px;padding:3px}
#home .wtabs button{padding:7px 0}
#home .sumcard.flat{padding:10px 14px;margin-bottom:10px}
#home .section-title{margin:12px 2px 7px}
#home .assets{gap:6px}
#home .asset{padding:10px 12px}
#home .coin{width:32px;height:32px}

.asset .go{flex:0 0 auto;margin-left:9px;color:var(--dim);font-size:16px;font-weight:800}

/* 자산 하나 화면 */
.actions.tk{margin-bottom:16px}
/* ★ 이 단추들은 잔액 카드 밖(맑은 바탕)에 있다 — 주간엔 글자를 짙게 (2026-09-03).
   잔액 카드 안의 같은 단추는 카드가 주간에도 짙은 청록이라 --on-key(흰색) 그대로 둔다. */
.actions.tk button{color:var(--on-key-soft)}
.tkbal{text-align:center;margin-bottom:20px}
.tkbal strong{display:block;font-size:28px;font-weight:900;letter-spacing:-1px;
  font-variant-numeric:tabular-nums}
.tkbal strong small{font-size:14px;color:var(--sub);font-weight:800;margin-left:4px}
.tkbal p{margin:6px 0 0;color:var(--sub);font-size:12.5px;font-weight:700}

/* ★ QR 스캔선 — 위아래로 오간다.
   카메라가 켜졌는지 눈으로 알 수 있어야 한다. 멈춰 있으면 고장인 줄 안다. */
.scanbox .scanline{position:absolute;left:14%;right:14%;height:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--blue),transparent);
  box-shadow:0 0 12px var(--glow-blue);
  animation:scanmove 2.4s ease-in-out infinite;pointer-events:none}
@keyframes scanmove{
  0%   {top:15%;opacity:.25}
  10%  {opacity:1}
  50%  {top:83%;opacity:1}
  60%  {opacity:1}
  100% {top:15%;opacity:.25}
}
/* ★ 「동작 줄이기」를 켠 기기에서도 이 선만은 움직여야 한다.
   장식이 아니라 **카메라가 살아 있다는 신호**다 — 멈춰 있으면 고장인 줄 안다.
   (윈도우 설정 > 접근성 > 시각 효과 > 애니메이션 효과 를 끄면 이 상태가 된다.)
   대신 느리게 움직여 흔들림을 줄인다. */
@media (prefers-reduced-motion:reduce){
  .scanbox .scanline{animation-duration:4.2s}
}

/* USDT 줄은 누르는 것이 아니다 — 눌리는 것처럼 보이지 않게 한다 */
.asset.flat{cursor:default}
.asset.flat:active{background:var(--card)}

/* ★ 빨간 경고 — 자산을 잃을 수 있는 자리에만 쓴다. 남발하면 아무도 안 본다. */
.warning.red{border-color:var(--edge-red-hi);background:var(--tint-red);color:var(--on-red-tint)}
.warning.red .shield{background:var(--tint-red);color:var(--red)}

/* 「이건 받는 주소가 아니다」를 눈으로도 구분되게 */
.row-link.danger{border-color:var(--edge-red)}
.row-link.danger > i{background:var(--tint-red);color:var(--red)}
.row-link.danger em{font-style:normal;color:var(--red);font-weight:800;font-size:12.5px;
  display:block;margin-top:2px}

/* ═══════════ 잠금 해제 숫자판 (2026-08-23) ═══════════
   ★ 긴 비밀번호를 매번 치게 하면 결국 아무도 잠그지 않는다. 편해야 잠근다. */

.padhead{text-align:center;margin-bottom:22px}
.padhead b{display:block;font-size:20px;font-weight:900;letter-spacing:-.4px}
.padhead .mono{display:block;margin-top:6px;color:var(--sub);font-size:12.5px;font-weight:800;
  font-family:ui-monospace,monospace}

.paddots{display:flex;justify-content:center;gap:13px;margin-bottom:12px}
.paddots i{width:13px;height:13px;border-radius:50%;border:1.5px solid var(--line);
  background:transparent;transition:background .12s,border-color .12s}
.paddots i.on{background:var(--blue);border-color:var(--blue)}

.padmsg{text-align:center;color:var(--sub);font-size:12.5px;font-weight:800;
  min-height:17px;margin-bottom:26px}
.padmsg.bad{color:var(--red)}

.padkeys{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 8px;
  max-width:300px;margin:0 auto 22px}
.padkeys .k{border:0;background:transparent;color:var(--txt);
  font-size:26px;font-weight:800;padding:13px 0;border-radius:14px;
  font-variant-numeric:tabular-nums}
.padkeys .k:active{background:var(--tint-blue)}
.padkeys .k.ico{font-size:20px;color:var(--sub)}
.padkeys .k.blank{pointer-events:none}

.padkeys.shake{animation:padshake .38s}
@keyframes padshake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-8px)} 40%{transform:translateX(7px)}
  60%{transform:translateX(-5px)} 80%{transform:translateX(3px)}
}

/* ★ 왼쪽 위 점 아홉 개 — 포인파이와 같은 모양 */
.icon-btn.dots9{display:grid;grid-template-columns:repeat(3,3px);grid-template-rows:repeat(3,3px);
  gap:3px;place-content:center;font-size:0}
.icon-btn.dots9 i{display:block;width:3px;height:3px;border-radius:50%;background:var(--sub)}
.icon-btn.dots9:active i{background:var(--blue)}
/* ★ 2026-09-09 입금 알림 종 — 꺼짐은 빗금 · 켜짐은 파랑 */
.icon-btn.bell{color:var(--sub);display:inline-flex;align-items:center;justify-content:center}
.icon-btn.bell.on{color:var(--blue)}
.icon-btn.bell.on .bell-off{display:none}

/* ═══════════ 시세 — 호가창 (2026-08-24, poinfi.org 에서 옮겨 옴) ═══════════
   ★ 이 화면은 「읽기」다. 여기에 스왑·승인 단추를 붙이면
     그 순간 우리가 교환을 운영하는 것이 된다. 링크만 준다. */

:root{ --bid:#2AA76B; --ask:#D96058;
       --bid-bg:rgba(42,167,107,.16); --ask-bg:rgba(217,96,88,.16); }

/* ── 봉 차트 (2026-09-05) — 접었다 폈다. CSP 때문에 인라인 스타일을 안 쓴다 ── */
.chart-head{display:flex;align-items:center;gap:8px;width:100%;
  background:none;border:0;padding:0 0 2px;cursor:pointer;text-align:left;color:inherit}
.chart-head h2{margin:0;font-size:15px;font-weight:900}
.chart-head span{margin-left:auto;color:var(--dim);font-size:12px;font-weight:700}
.chart-tabs{display:flex;gap:6px;margin:10px 0 8px}
.chartbox canvas{display:block;width:100%;height:auto;border-radius:10px;
  background:var(--card2);border:1px solid var(--line)}
.chartbox .note{margin-top:8px}

.mkbar{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.mkbar select{flex:1 1 auto;min-width:0;border:1px solid var(--line);border-radius:11px;
  background:var(--card2);color:var(--txt);padding:10px 11px;font-size:13.5px;font-weight:800}
.mkbar .pill{flex:0 0 auto}

.lastbox{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.lastbox b{font-size:26px;font-weight:900;letter-spacing:-.7px;
  font-family:ui-monospace,monospace}
.lastbox small{color:var(--sub);font-size:13px;font-weight:800}
.krwref{margin-left:auto;font-size:12.5px;color:var(--dim);font-weight:700}

.section-title em{font-style:normal;color:var(--dim);font-size:12.5px;font-weight:700;margin-left:6px}

.bookhead,.row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;
  font-size:12.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.bookhead{color:var(--dim);font-weight:800;padding:0 8px 7px;
  border-bottom:1px solid var(--line);font-family:inherit;font-size:12px}
.bookhead span:nth-child(2),.bookhead span:nth-child(3){text-align:right}
.rows{display:flex;flex-direction:column}
/* ★ 매도호가는 아래에서 위로 쌓인다. 가운뎃값에 가까운 것이 아래다. */
.rows.asks{flex-direction:column-reverse}
.row{position:relative;padding:6px 8px;align-items:center;z-index:0}
.row .bar{position:absolute;top:2px;bottom:2px;right:0;border-radius:4px;z-index:-1}
.row.ask .bar{background:var(--ask-bg)} .row.bid .bar{background:var(--bid-bg)}
.row .px{font-weight:800} .row.ask .px{color:var(--ask)} .row.bid .px{color:var(--bid)}
.row .sz,.row .tt{text-align:right;color:var(--txt)}
.row .tt{color:var(--dim)}
.rows .empty{color:var(--dim);display:block;text-align:center;
  padding:26px 0;font-family:inherit;font-size:13px}

.mid{display:flex;align-items:center;gap:10px;padding:11px 8px;margin:6px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--card2)}
.mid b{font-size:18px;font-weight:900;font-family:ui-monospace,monospace}
.mid span{font-size:12px;color:var(--dim);font-weight:700}
.mid .krw{margin-left:auto}

/* 지도 틀 — 딴 페이지를 끼운다 (2026-09-04) */
.mapframe{position:relative;height:230px;margin-bottom:9px;border:1px solid var(--line);
  border-radius:13px;overflow:hidden;background:var(--card)}
.mapframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}

/* ── 지도 화면 줄 세우기·업종 — 2026-09-04 */
.mapsort{display:flex;gap:6px;margin-bottom:8px}
.mapsort .pill{flex:1 1 0;text-align:center}
.mapsort .pill.on{border-color:var(--key);background:var(--tint-key);color:var(--on-key-soft)}
.kchips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:9px}
.kchip{border:1px solid var(--line);border-radius:999px;background:var(--card2);
  color:var(--sub);font-size:12.5px;font-weight:800;padding:5px 10px;cursor:pointer}
.kchip.on{border-color:var(--key);background:var(--tint-key);color:var(--on-key-soft)}

/* 우리 가게 넣기 */
.sasel{width:100%;border:1px solid var(--line);border-radius:12px;background:var(--card2);
  color:var(--txt);font:inherit;font-size:14px;padding:11px 12px;margin-bottom:9px}
.saxy{display:grid;grid-template-columns:1fr 1fr;gap:7px}

/* ── 받는 가게 (지도 화면) — 2026-09-04.
      ★ 색·둥근모서리는 전부 이미 있는 토큰을 쓴다. 새 색을 만들지 않는다. */
.shoplist{display:flex;flex-direction:column;gap:8px}
.shoprow{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:12px 13px}
.shoprow.empty{text-align:center;padding:22px 13px;color:var(--sub)}
.shoprow.empty b{display:block;margin-bottom:5px;color:var(--txt);font-size:14px}
.shoptop{display:flex;align-items:center;gap:8px;justify-content:space-between}
.shoptop b{font-size:14.5px;font-weight:800;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shopbadge{flex:0 0 auto;font-size:12.5px;font-weight:800;color:var(--sub);
  border:1px solid var(--line);border-radius:999px;padding:3px 8px;white-space:nowrap}
.shopbadge.ok{color:var(--green);border-color:var(--green)}
/* ★ 리워드를 크게 (2026-09-04, 사장님 지시).
   손님이 가게를 고르는 이유가 이 숫자다 — 작은 딱지에 묻어 두면 안 보인다. */
.shoprw{flex:0 0 auto;text-align:right;line-height:1.15}
.shoprw b{display:block;font-size:18px;font-weight:800;color:var(--green)}
.shoprw em{display:block;font-style:normal;font-size:10.5px;font-weight:800;color:var(--sub)}
/* 0% 는 초록으로 적지 않는다 — 초록은 「좋다」는 뜻이다 */
.shoprw.zero b{color:var(--sub)}
.shopmeta{display:flex;align-items:center;gap:6px;margin-top:5px;flex-wrap:wrap}
.shopkind{font-size:12.5px;font-weight:800;color:var(--sub);
  border:1px solid var(--line);border-radius:999px;padding:2px 7px}
.shopfar{font-size:12.5px;font-weight:800;color:var(--blue)}
/* ★ 아직 올라가지 않은 가게 — 있는 척하지 않는다 (2026-09-04) */
.shopmine{font-size:12.5px;font-weight:800;color:var(--gold);
  border:1px solid var(--gold);border-radius:999px;padding:2px 7px}
/* 재단이 내린 가게 — 관리자 화면에만 나온다. 붉은 기가 도는 회색으로 구분한다 */
.shopgone{font-size:12.5px;font-weight:800;color:var(--red);
  border:1px solid var(--red);border-radius:999px;padding:2px 7px}
/* 내려 둔 줄은 통째로 흐리게 — :has() 를 안 쓴다.
   카이아 월렛 안 브라우저처럼 오래된 곳에서 안 먹으면 표시가 통째로 사라진다. */
.shoprow.gone{opacity:.6}
/* 임시휴업 — 목록에서 빼지 않고 그렇다고 적는다 */
.shoprest{font-size:12.5px;font-weight:800;color:var(--sub);
  border:1px solid var(--line);border-radius:999px;padding:2px 7px;background:var(--card2)}
.shopwhere{margin-top:6px;font-size:12.5px;color:var(--sub);line-height:1.5}
.shopnote{margin-top:3px;font-size:12px;color:var(--sub);line-height:1.5}
.shopacts{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.shopacts .pill{text-decoration:none}
/* ★ 「우리 가게 등록」은 오른쪽 끝으로 (2026-09-04 사장님 지시: 「우측 정렬로」).
   앞의 알약들과 성격이 다르다 — 앞의 것은 「이 가게를 본다」이고 이것은 「내가 올린다」다.
   ★ 줄이 넘쳐 두 줄이 되어도 margin-left:auto 가 그 줄 안에서 오른쪽으로 민다. */
.shopacts .pill.reg{margin-left:auto}

.venues{display:flex;flex-direction:column;gap:8px;margin-bottom:4px}
.venue{display:flex;align-items:center;gap:10px;background:var(--card);
  border:1px solid var(--line);border-radius:13px;padding:12px 13px;
  text-align:left;text-decoration:none;color:var(--txt);cursor:pointer}
.venue b{font-size:13.5px;font-weight:800}
.venue small{display:block;font-size:12.5px;color:var(--sub);font-weight:700}
.venue .go{margin-left:auto;color:var(--blue);font-size:13px;font-weight:800}
.venue:active{background:var(--card2)}

.trade{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;padding:6px 8px;
  font-size:12.5px;font-family:ui-monospace,monospace;
  border-bottom:1px solid var(--line-soft)}
.trade:last-child{border-bottom:0}
.trade .px{font-weight:800}
.trade.buy .px{color:var(--bid)} .trade.sell .px{color:var(--ask)}
.trade .sz{text-align:right}
.trade a{color:var(--dim);text-decoration:none;font-size:12.5px}
.trade a:hover{color:var(--blue)}
#trades .empty{color:var(--dim);text-align:center;padding:22px 0;font-size:13px}
/* 「읽는 중」 표시 */
.spin{display:inline-block;width:11px;height:11px;border-radius:50%;
  border:2px solid var(--line);border-top-color:var(--blue);
  animation:spin .7s linear infinite;vertical-align:-1px}
@keyframes spin{to{transform:rotate(360deg)}}
/* ★ 2026-09-06 속도 묶음 — 단추·안내줄 안에서 도는 고리 (pit-setup-20260920CA.js showSpin · app.js balStateSet).
   .primary 는 청록 바탕이라 원래 색(--line/--blue)이 묻힌다 — 글자색(--on-key)으로 돈다.
   .busy 는 「멈춘 게 아니라 일하는 중」— 잠긴 단추의 흐림(.45)을 조금 걷어 고리가 보이게 한다. */
.primary .spin{width:13px;height:13px;border-color:var(--edge-key);border-top-color:var(--on-key)}
.primary.busy:disabled,.ghostline.busy:disabled{opacity:.85}
.ghostline .spin,.padmsg .spin,.balstate .spin{margin-right:6px}
/* 잔액 카드 머리줄 왼쪽의 상태 한 줄 — 「갱신 중…」은 이 주소로 처음 읽는 동안만, 「못 읽음」은 다음 성공까지 */
.balstate{flex:1 1 auto;min-width:0;text-align:left;font-size:12.5px;font-weight:800;
  color:var(--on-hero-sub);line-height:1.35}
.balstate.bad{color:var(--gold-hi)}
.balstate.bad,.balstate.wait{cursor:pointer}   /* 2026-09-06 — 누르면 바로 다시 읽는다 */
.balstate b{font-weight:800;font-variant-numeric:tabular-nums}

/* ★ 2026-09-06 밤 — 내가 추천한 지갑 목록 (pit-refer-20260920CA.js · 사장님 지시). 두 줄: 순번·이름·연필·받은 PIT(오른쪽) / 주소(누르면 복사)·날짜. 토큰만 쓴다 */
.inv-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.acct-row.inv{cursor:default;align-items:center;padding:8px 10px}
.acct-row.inv .nm2{gap:4px}
.acct-row.inv .invn{flex:0 0 auto;min-width:26px;height:26px;padding:0 6px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  font-weight:800;font-size:12.5px;background:var(--tint-blue);color:var(--key-txt);font-variant-numeric:tabular-nums}
.acct-row.inv .l1{gap:6px}
.acct-row.inv .l1 > b:first-child{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
.acct-row.inv .l1 b.nomemo{color:var(--dim);font-weight:600}
.acct-row.inv .l1 .pen{flex:0 0 auto;margin:0}
.acct-row.inv .l1 .r1{margin-left:auto}
.acct-row.inv .l1 b.pit{flex:0 0 auto;font-size:13px;color:var(--txt);font-variant-numeric:tabular-nums;text-align:right}
.acct-row.inv .l2{display:flex;align-items:center;gap:8px;min-width:0}
.acct-row.inv .inv-addr{display:flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;align-self:auto}
.acct-row.inv .inv-addr .ad{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-row.inv .invdate{flex:0 0 auto;font-size:12.5px;color:var(--dim);font-weight:600;white-space:nowrap}
.balstate .spin{border-color:var(--hero-line);border-top-color:var(--on-hero)}

/* ─────────── 보존 채굴 현황 ───────────
   ★ 관리자와 지갑(공개)에서 **같은 모양**으로 쓴다.
     따로 그리면 언젠가 한쪽만 고쳐져 두 화면이 다른 말을 하게 된다. */
.rvbox{margin-top:12px;padding:12px;border:1px solid var(--line);
  border-radius:12px;background:var(--card2)}
.rvrow{display:flex;justify-content:space-between;align-items:baseline;
  gap:10px;padding:4px 0;font-size:13px;color:var(--sub)}
.rvrow b{color:var(--txt);font-weight:800;font-variant-numeric:tabular-nums}
.rvbar{margin-top:9px;height:7px;border-radius:999px;background:var(--bg);
  border:1px solid var(--line);overflow:hidden}
.rvbar i{display:block;height:100%;width:0;border-radius:999px;
  background:linear-gradient(90deg,var(--key),var(--blue));transition:width .35s ease}
.rvnote{margin-top:7px;font-size:12.5px;color:var(--dim);font-weight:700;text-align:right}

/* ─────────── 물량 분배 ───────────
   ★ 주소를 안 적은 갈래도 그대로 보인다. 비어 있는 것을 숨기면 공시가 아니다. */
.allist{margin-top:4px}
.alrow{padding:11px 0;border-bottom:1px solid var(--line-soft)}
.alrow:last-child{border-bottom:0}
.altop{display:flex;align-items:baseline;gap:8px}
.altop b{font-size:14px;font-weight:800;color:var(--txt)}
.altop .pct{margin-left:auto;font-size:13px;font-weight:800;color:var(--blue);
  font-variant-numeric:tabular-nums}
.albar{margin-top:7px;height:5px;border-radius:999px;background:var(--bg);
  border:1px solid var(--line);overflow:hidden}
.albar i{display:block;height:100%;width:0;border-radius:999px;background:var(--key)}
.alnum{display:flex;justify-content:space-between;gap:10px;margin-top:6px;
  font-size:12px;color:var(--sub);font-variant-numeric:tabular-nums}
.alnum b{color:var(--txt);font-weight:800}
.alwho{margin-top:5px;font-size:12.5px;color:var(--dim);font-weight:700;
  font-family:ui-monospace,monospace;word-break:break-all}
.alnote{margin-top:5px;font-size:12.5px;color:var(--dim);line-height:1.6}
.allock{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;
  font-size:10.5px;font-weight:800;border:1px solid var(--line);color:var(--sub)}
.allock.hard{color:var(--green);border-color:var(--edge-green)}
.allock.soft{color:var(--gold);border-color:var(--edge-gold)}
.alrow.unset .altop b{color:var(--dim)}

/* ─────────── 하이브리드 나눔 막대 ───────────
   ★ 숫자만 보면 「50:50」이 얼마나 큰 변화인지 감이 안 온다.
     막대로 보여 주면 손잡이를 끌면서 바로 알 수 있다. */
.hybar{display:flex;margin-top:11px;height:12px;border-radius:999px;overflow:hidden;
  border:1px solid var(--line);background:var(--bg)}
.hybar i{display:block;height:100%;transition:width .18s ease}
.hybar i.u{background:linear-gradient(90deg,var(--key),var(--blue));width:99%}
.hybar i.p{background:linear-gradient(90deg,var(--gold),var(--gold-hi));width:1%}
.hylegend{display:flex;gap:14px;margin-top:7px;font-size:12px;color:var(--sub);font-weight:700}
.hylegend span{display:flex;align-items:center;gap:5px}
.hylegend i{width:9px;height:9px;border-radius:3px}
.hylegend i.u{background:var(--key)} .hylegend i.p{background:var(--gold)}
.hylegend b{color:var(--txt);font-variant-numeric:tabular-nums}


/* ─────────── 받기 — 포인파이 모양 ───────────
   ★ 「고급 설정」 접기를 없앴다. 접어 두니 오히려 더 헷갈렸다.
     만질 것이 둘뿐이면 그냥 둘 다 보이는 편이 낫다.
   ★ 설명 문단을 걷어내고 칸마다 한 줄만 남긴다. 읽을 것이 많으면 안 읽는다. */
.rcvlead{margin:0 2px 12px;color:var(--sub);font-size:12.5px;line-height:1.6;text-align:center}

.ratehead{display:flex;align-items:baseline;justify-content:space-between;
  margin:20px 2px 8px;font-size:13.5px;font-weight:800;color:var(--txt)}
.ratehead b{color:var(--gold);font-size:13.5px;font-variant-numeric:tabular-nums}

.ratebox{border:1px solid var(--line);border-radius:14px;background:var(--card);padding:14px}
.ratebox .rate-control{margin-top:11px}
.ratebox .hybar{margin-top:0}
.ratenote{margin:11px 0 0;color:var(--dim);font-size:12.5px;line-height:1.65}
.ratenote b{color:var(--sub)}
/* ★ 2026-09-06 보안 메모 A13 — 결제 확인의 「허용 미끄럼」 줄. 「제한 없음 — …」은 문장이라 접히게 두고 금색으로 도드라지게.
   색은 토큰만(--gold). 숫자 줄(3%·25%)은 .open 이 없어 예전 .kv b 그대로다. */
.ratebox .kv.open b{color:var(--gold);white-space:normal;text-align:right;font-size:12px;line-height:1.4}

.ratestate{margin:9px 2px 0;font-size:12px;font-weight:700;color:var(--dim);
  line-height:1.6;text-align:center}
.ratestate.ok{color:var(--green)}
.ratestate.warn{color:var(--gold)}

/* 막대 오른쪽 값을 오른끝에 붙인다 */
.hylegend .r{margin-left:auto}
.hylegend{justify-content:flex-start}

/* 총 자산 한 줄만 남긴 모양 */
.sumcard.flat{padding:13px 15px}
.sumcard.flat .s-top{margin:0}

/* ─────────── 스왑 ─────────── */
.swflip{display:flex;justify-content:center;margin:-6px 0 -2px;position:relative;z-index:1}
.swflip button{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);
  background:var(--card2);color:var(--blue);font-size:17px;font-weight:800}
.swflip button:active{background:var(--card)}
.field.ro{background:var(--bg)}
.field.ro input{color:var(--txt);font-weight:800}
.ratehead em{font-style:normal;color:var(--dim);font-size:12.5px;font-weight:700;margin-left:5px}

/* 내역 갈래별 색 — 무슨 일이 있었는지 눈으로 먼저 알게 */
/* ★ 색은 **제목이 아니라 숫자**에 준다 (2026-09-04).
   제목까지 물들이면 화면이 시끄럽고, 정작 「얼마」가 안 도드라진다. */
.feeditem .fi-r b.pos{color:var(--green)}
.feeditem .fi-r b.neg{color:var(--txt)}
.feeditem.burn .fi-r b{color:var(--burn-a)}
.feeditem:hover{border-color:var(--blue)}

/* ─────────── 서명 확인 판업 ───────────
   ★ .kv 는 「딱지 — 값」을 한 줄에 놓고 값을 안 접는다(white-space:nowrap).
     짧은 숫자에는 맞지만 「이 지갑의 USDT 을 대신 쓸 수 있게 됩니다」 같은 문장이 오면
     값이 넘쳐 나가고 딱지가 세로로 한 글자씩 쪼개진다. 실제로 그랬다.
   ★ 이 판업에서만 위아래로 쌓고 접히게 한다. 폰 화면이 좁아서 그게 맞다. */
.setup .hy-sum .kv{display:block;padding:8px 0}
.setup .hy-sum .kv + .kv{border-top:1px solid var(--line-soft)}
.setup .hy-sum .kv span{display:block;margin-bottom:4px;color:var(--sub);font-size:12.5px}
.setup .hy-sum .kv b{display:block;white-space:normal;word-break:break-word;
  text-align:left;line-height:1.45}
.setup .hy-sum .kv b.big{font-size:17px;font-weight:900;letter-spacing:-.3px;line-height:1.4}
.setup .hy-sum .kv b.mono{word-break:break-all;font-size:12.5px;line-height:1.5}

/* ─────────── 동의 약관 ───────────
   ★ 길지만 읽을 수 있어야 한다. 폰에서 스스로 스크롤되게 두고,
     제목과 본문 크기를 벌려 눈이 쉬게 한다. */
.terms{max-height:46vh;overflow-y:auto;margin-top:12px;padding:12px 13px;
  border:1px solid var(--line);border-radius:12px;background:var(--card2);
  -webkit-overflow-scrolling:touch}
.terms h3{margin:14px 0 6px;font-size:13.5px;font-weight:800;color:var(--txt)}
.terms h3:first-child{margin-top:0}
.terms p{margin:0 0 8px;font-size:12.5px;line-height:1.7;color:var(--sub)}
.terms ul{margin:0 0 8px;padding-left:16px}
.terms li{font-size:12.5px;line-height:1.7;color:var(--sub);margin-bottom:4px}
.terms b{color:var(--txt);font-weight:800}
.setup-box.wide{max-width:520px}

/* 외부 출금 — 다른 일이라는 것이 눈에 먼저 들어오게 */
.ratehead b.ext{color:var(--gold)}
.primary.warnbtn{background:linear-gradient(180deg,var(--warn-a),var(--warn-b));border-color:var(--warn-line)}

/* 설치 안내 — 번호를 붙여 순서를 눈으로 따라가게 */
.howto{margin:14px 0 0;padding:0;list-style:none;counter-reset:none}
.howto li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;
  font-size:13px;line-height:1.65;color:var(--sub);
  border-bottom:1px solid var(--line-soft)}
.howto li:last-child{border-bottom:0}
.howto li b{color:var(--txt);font-weight:800}
.howto .n{flex:0 0 auto;width:20px;height:20px;border-radius:50%;
  background:var(--key);color:var(--on-key);font-size:12px;font-weight:800;
  display:flex;align-items:center;justify-content:center;margin-top:1px}
.row-link.off{opacity:.55}

/* 주소 42자를 줄이지 않고 그대로 보이게 — 줄이면 오타를 못 잡는다 */
.field.wide{padding:10px 11px}
.field.wide input{font-family:ui-monospace,monospace;font-size:12.5px;letter-spacing:0}

/* 찾을 수 있는 잠금이 있으면 눈에 띄게 */
.asset em small.ready{color:var(--key);font-weight:800}
#pitLockRow i.coin{font-size:16px}

/* 잠금 증서 — 그대로 옮겨 적을 수 있게 고정폭으로 */
pre.cert{white-space:pre-wrap;word-break:break-all;font-family:ui-monospace,monospace;
  font-size:12px;line-height:1.65;color:var(--txt);background:var(--fg-a-03);
  border:1px solid var(--line);border-radius:12px;padding:12px;margin:8px 0 10px}

/* 지문 단추 — 숫자 사이에 있어도 눌러야 할 것으로 보이게 (2026-08-28) */
.padkeys .k.bio{display:flex;align-items:center;justify-content:center;color:var(--key)}
.padkeys .k.bio svg{display:block}
.padkeys .k.bio:active{background:var(--tint-blue)}

/* 안심 문구 막대 (2026-08-28 보안 검증)
   잠금 해제 화면과 서명 확인창 맨 위에 늘 뜬다.
   이 자리에 내 문구가 안 보이면 가짜 화면이다. */
.safebar{display:flex; gap:9px; align-items:flex-start;
  margin:0 0 13px; padding:10px 12px; border-radius:12px;
  background:var(--tint-green); border:1px solid var(--edge-green)}
.safebar > i{flex:0 0 auto; width:18px; height:18px; border-radius:50%;
  display:grid; place-items:center; font-size:12px; font-weight:900; font-style:normal;
  background:var(--green); color:var(--safebar-ok-txt); margin-top:1px}
.safebar > span{min-width:0; font-size:14px; font-weight:800; color:var(--txt); line-height:1.45}
.safebar em{display:block; margin-top:3px; font-style:normal;
  font-size:12.5px; font-weight:700; color:var(--sub); line-height:1.5}
.safebar.off{background:var(--tint-gold); border-color:var(--edge-gold)}
/* ★★ 2026-09-05 — 늘 보이는 안심 문구 띠 (사장님 제안).
   ★ 얇게 둔다. 늘 보이는 것이 두꺼우면 곧 안 보게 된다. */
.safetop{display:flex;align-items:center;gap:7px;
  margin:10px 15px 0;padding:6px 10px;border-radius:9px;   /* ★ 2026-09-06 밤 사장님 지시 — 위(머리줄)와는 띄우고 아래(USDT 상자)와는 붙인다 */
  border:1px solid var(--edge-green);background:var(--tint-green);
  font-size:12px;font-weight:800;color:var(--txt);line-height:1.3}
.safetop > i{flex:0 0 auto;font-style:normal;color:var(--green);font-size:12px}
.safetop > b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.safetop > em{margin-left:auto;flex:0 0 auto;font-style:normal;
  color:var(--dim);font-size:10.5px;font-weight:700}
.safetop.off{border-color:var(--edge-gold);background:var(--tint-gold)}
.safetop.off > i{color:var(--gold)}
.safetop.off > b{color:var(--gold)}
/* ★ 2026-09-05 — 앱 색 확인 팝업 (사장님 지시: 흰 창이 촌스럽다) */
.setup-head.tight{margin-bottom:10px}
.setup-head.tight span{display:none}
.askbody{margin:0 0 4px;padding:11px 12px;border:1px solid var(--line);
  border-radius:11px;background:var(--card2);color:var(--sub);
  font:inherit;font-size:12.5px;font-weight:700;line-height:1.6;
  white-space:pre-wrap;word-break:break-word}


.safebar.off > i{background:var(--gold); color:var(--safebar-off-txt)}

/* 전송 중 덮개 (2026-08-28)
   ★ 1.5초가 「멈춘 것」으로 보이지 않게 한다. 돌아가는 것이 보여야 기다린다.
   ★ 덮여 있으니 두 번 눌릴 길이 없다 — 이게 진짜 목적이다. */
/* ★ z-index 45 — **서명 창보다 아래**여야 한다 (2026-08-28).
   확인창(.setup 80)·모달(50)·카메라(70)·토스트(90)가 이 위에 떠야 한다.
   900 으로 뒀더니 서명 화면을 통째로 가려 아무것도 못 하게 됐다.
   덮개의 목적은 **그 아래 화면을 못 누르게** 하는 것이지 위를 가리는 게 아니다. */
.busyveil{position:fixed; inset:0; z-index:45; display:grid; place-items:center;
  background:var(--veil); backdrop-filter:blur(3px);
  animation:bvIn .12s ease-out}
@keyframes bvIn{from{opacity:0}to{opacity:1}}
.busybox{width:min(88vw,320px); padding:26px 22px 20px; border-radius:18px;
  background:var(--card); border:1px solid var(--fg-a-08);
  box-shadow:0 18px 50px var(--shadow-55); text-align:center}
.busyring{width:38px; height:38px; margin:0 auto 14px; border-radius:50%;
  border:3px solid var(--fg-a-08); border-top-color:var(--acc);
  animation:spin .8s linear infinite}
.busybox b{display:block; font-size:17px; font-weight:900; color:var(--txt); margin-bottom:5px}
.busybox span{display:block; font-size:13.5px; font-weight:700; color:var(--sub); line-height:1.55}
.busybox em{display:block; margin-top:13px; font-style:normal;
  font-size:12.5px; font-weight:700; color:var(--sub); opacity:.75}
/* ── 끝났을 때 (2026-08-29) ──
   ★ 도는 고리를 ✓ 로 바꾸고 「확인」을 띄운다.
     확인을 누르기 전에는 덮개가 안 사라지므로 두 번 눌릴 길이 없다.
   ★ 색은 초록으로 — 「됐다」는 한눈에 읽혀야 한다. */
.busycheck{display:none; width:38px; height:38px; margin:0 auto 14px;
  border-radius:50%; background:var(--tint-green);
  border:2px solid var(--green); color:var(--green);
  font-size:22px; font-weight:900; line-height:34px}
.busyok{display:none; width:100%; margin-top:15px}
.busyveil.done .busyring{display:none}
.busyveil.done .busycheck{display:block}
.busyveil.done .busyok{display:block}
.busyveil.done .busybox > b{color:var(--green)}

.busytx{display:block; margin-top:11px; padding:7px 9px; border-radius:9px;
  background:var(--fg-a-08); color:var(--acc);
  font-size:12.5px; font-weight:800; text-decoration:none;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
@media (prefers-reduced-motion:reduce){
  .busyring{animation-duration:2.4s}
  .busyveil{animation:none}
}


/* ═══ 비밀번호 칸의 「보기」 눈 (2026-09-02, 사장님 지시) ═══
   ★ -webkit-text-security 를 쓰지 않는다. 2026-08-24 에 그것으로
     점이 서너 개만 그려지는 크롬 버그를 만났다. type 을 직접 바꾸는 방식이다. */
.pweye{position:relative;display:block}
.pweye>input{padding-right:44px}
.pweye .eye{position:absolute;right:5px;top:50%;transform:translateY(-50%);
  display:flex;align-items:center;justify-content:center;width:34px;height:34px;
  padding:0;margin:0;border:0;border-radius:9px;background:transparent;
  color:var(--dim);cursor:pointer;font:inherit;-webkit-appearance:none;appearance:none}
.pweye .eye svg{display:block;pointer-events:none}
.pweye .eye:hover{color:var(--txt);background:var(--card)}
.pweye .eye.on{color:var(--blue)}
.pweye .eye:focus-visible{outline:2px solid var(--key);outline-offset:-2px}


/* ═══ 유동성 화면 (2026-09-03) ═══
   ★ .kv b 는 white-space:nowrap 이라 값이 길면 왼쪽 이름표가 한 글자씩 접혔다.
     이 화면은 값이 「1,194.82 USDT + 115,994 PIT」처럼 길어서 값 쪽을 접게 한다. */
#liq .kv{align-items:center}
#liq .kv > span{flex:0 0 auto;max-width:40%;line-height:1.35}
#liq .kv b{white-space:normal;text-align:right;word-break:keep-all;max-width:60%;line-height:1.45}


/* ═══ 리워드 80:20 막대 하나 (2026-09-03, 사장님 지시) — 상자 둘을 합쳤다 ═══ */
.splitone{margin:10px 0 4px;padding:11px 12px 10px;border:1px solid var(--line);border-radius:12px;background:var(--card2)}
.splitone .bar{display:flex;height:6px;border-radius:99px;overflow:hidden;background:var(--deep)}
.splitone .bar .a{flex:0 0 80%;background:var(--green)}
.splitone .bar .b{flex:1 1 auto;background:var(--purple)}
/* ★ 셋으로 갈리는 막대 (2026-09-04, 8 : 1 : 1).
   .three 를 붙인 것만 셋이 된다 — 옛 두 갈래 막대는 그대로 둔다. */
.splitone.three .bar .a{flex:0 0 80%}
.splitone.three .bar .b{flex:0 0 10%;background:var(--purple)}
.splitone.three .bar .c{flex:1 1 auto;background:var(--gold)}
.splitone .legs{display:flex;justify-content:space-between;gap:12px;margin-top:9px}
.splitone .legs > span{display:block;min-width:0}
.splitone .legs .r{text-align:right}
/* 셋일 때는 가운데를 가운데로 — 좁은 화면에서 글자가 겹치지 않게 조금 작게 */
.splitone.three .legs{gap:8px}
/* ★ 2026-09-06 밤 사장님 지시 — 세 칸을 같은 너비로(「보낸 지갑」이 두 줄로 접히던 것) · 이름은 한 줄 · 「(없으면 소각)」은 그 아래 줄 */
.splitone.three .legs > span{flex:1 1 0;min-width:0}
.splitone.three .legs small.who{white-space:nowrap;word-break:keep-all}
.splitone.three .legs small.who em{display:block;white-space:nowrap}
.splitone.three .legs .m{text-align:center}
.splitone.three .legs small{font-size:10.5px}
.splitone .legs b{display:block;font-size:15px;font-weight:900;color:var(--txt);letter-spacing:-.3px;white-space:nowrap}
.splitone .legs small{display:block;margin-top:2px;color:var(--sub);font-size:12.5px;font-weight:700;line-height:1.45}
/* ★ 2026-09-06 밤 사장님 지시 — 퍼센트 줄 밑의 이름 줄 · 리워드 칩은 USDT ≈ 원화까지 · 안내는 점 목록 */
.splitone .legs small.who{font-size:10px;color:var(--dim);font-weight:700;margin-top:1px}
.splitone .legs small.who em{font-style:normal;color:var(--dim)}
#rewardPitTag{max-width:240px}
.tiny.bullets{margin:10px 0 0;padding-left:16px}
.tiny.bullets li{margin:3px 0;list-style:disc}
.ratenote.bullets{padding-left:16px}
.ratenote.bullets li{list-style:disc;margin:2px 0}
.splitone .legs small em{font-style:normal;color:var(--dim)}

/* ═══════════════ 대시보드 (2026-09-03) ═══════════════
   ★ 「받은 것 전부」 큰 숫자 하나 + 갈래별 줄 + 내역. 색은 토큰만 — 새 토큰이 없으면 옛 토큰으로 물러선다. */
.dash-total{margin:4px 0 10px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;
  background:var(--tint-gold,var(--card2))}
.dash-total strong{display:block;font-size:27px;font-weight:900;letter-spacing:-.6px;line-height:1.2;
  color:var(--gold);font-variant-numeric:tabular-nums;word-break:break-all}
.dash-total strong .unit{font-style:normal;font-size:14px;font-weight:800;color:var(--sub);
  margin-left:6px;letter-spacing:0}
.dash-total small{display:block;margin-top:5px;color:var(--sub);font-size:12px;font-weight:700;line-height:1.5}
.dash-total small b{color:var(--green)}
.segt.dash-tabs{grid-template-columns:repeat(5,1fr)}
.segt.dash-tabs button{padding:9px 1px;font-size:12px;letter-spacing:-.4px;white-space:nowrap}
.dash-kind{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:999px;font-style:normal;
  font-size:12.5px;font-weight:800;vertical-align:1px;background:var(--fg-a-08,var(--card));color:var(--sub)}
.feeditem.dash-pay b{color:var(--gold)}
.feeditem.dash-pay .dash-kind{background:var(--tint-gold,var(--card));color:var(--on-gold-tint,var(--gold))}
.feeditem.dash-ref b{color:var(--purple)}
.feeditem.dash-ref .dash-kind{background:var(--tint-purple,var(--card));color:var(--on-purple-tint,var(--purple))}
.feeditem.dash-hand b{color:var(--blue)}
.feeditem.dash-hand .dash-kind{background:var(--tint-blue,var(--card));color:var(--on-blue-tint,var(--blue))}
.feeditem.dash-mer b{color:var(--green)}
.feeditem.dash-mer .dash-kind{background:var(--tint-green,var(--card));color:var(--on-green-tint,var(--green))}
.feeditem.dash-given{opacity:.72}
.feeditem.dash-given b{color:var(--sub)}
#dashMore{margin-top:10px}


/* ═══ TXID 조회 (2026-09-03) ═══
   ★ .kv b 는 nowrap 이라 「되돌려짐 — 자산은 …」 같은 긴 값이 이름표를 접었다.
     유동성 화면처럼 값 쪽을 접게 한다. */
#txid .kv{align-items:flex-start;padding:4px 0}
#txid .kv > span{flex:0 0 auto;max-width:34%;line-height:1.35}
#txid .kv b{white-space:normal;text-align:right;word-break:break-word;max-width:66%;line-height:1.45}
#txid .kv b.ok{color:var(--green)}
#txid .kv b.bad{color:var(--red)}
#txid .kv b.wait{color:var(--gold)}
#txid .card > .primary{margin-top:12px}
.txid-sub{margin:14px 0 8px;font-size:14px}
.txid-events{display:grid;gap:8px}
/* ★★ 2026-09-04 사장님 지시 — 「글씨를 조금 얇게, 컬러를 보기 좋게」.
   전에는 본문이 굵기 700 에 주소마다 파란색이라, 주소 셋 든 줄이 파랑·흰색으로 뒤엉켰다.
   · 본문은 얇게(500) 한 가지 색으로 — 눈이 줄을 따라가게
   · 주소는 색이 아니라 **고정폭 글꼴**로 구별한다. 파랑을 뺀다
   · 줄 간격을 늘려 숨 쉴 자리를 준다 */
.txid-ev{border:1px solid var(--line-soft,var(--line));border-radius:11px;background:var(--card2);
  padding:11px 12px}
/* 제목은 「무슨 사건인가」 하는 작은 딱지다 — 크게 외치지 않는다 */
.txid-ev b{display:block;color:var(--sub);font-size:12.5px;font-weight:800;
  letter-spacing:.2px;margin-bottom:5px}
/* ★ 더 얇게·더 작게 (2026-09-04 사장님 재지시).
   크기는 앱 전체를 1px 키우기 **전**으로 되돌렸다 — 이 칸은 한 줄에 주소가
   둘씩 들어가는 촘촘한 자리라 여기만 예외로 둔다. */
.txid-ev small{display:block;color:var(--txt);font-size:12.5px;line-height:1.8;
  font-weight:400;word-break:break-word;opacity:.8}
.txid-ev.pay{background:var(--tint-key,var(--card2));border-color:var(--key)}
.txid-ev.pay b{color:var(--on-key-tint,var(--sub))}
.txid-ev.burn b{color:var(--red)}
.txid-ev.other{opacity:.7}
/* ★★ 딱지-값 표 (2026-09-04, 사장님 지시 — 「분류를 제대로. 금액 주소 숫자 등」).
   왼쪽에 무엇인지, 오른쪽에 값. 금액과 주소를 한 줄에 섞지 않는다. */
.txid-rows{display:grid;gap:4px}
.txid-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.txid-row>span{flex:0 0 auto;color:var(--dim);font-size:10.5px;font-weight:600;
  letter-spacing:.2px;white-space:nowrap}
.txid-row>i{font-style:normal;min-width:0;text-align:right;color:var(--txt);
  font-size:12.5px;font-weight:400;line-height:1.6;opacity:.9;
  word-break:break-word;font-variant-numeric:tabular-nums}
.txid-none{color:var(--dim);font-weight:400}
/* 주소 — 파랑을 빼고 고정폭으로만 구별한다. 한 줄에 셋씩 들어가도 안 시끄럽다 */
/* ★ 주소도 함께 얇게 (2026-09-04). 줄의 절반이 주소라, 여기가 굵으면
   본문만 얇게 해도 줄 전체가 굵어 보인다. */
.txid-a{font-family:ui-monospace,monospace;color:var(--txt);font-weight:400;
  opacity:.92;cursor:help}
.txid-scan{display:block;text-align:center;text-decoration:none;margin-top:12px}
.txid-empty{margin:4px 2px;color:var(--dim);font-size:12.5px;font-weight:700;line-height:1.55}

/* ═══════════════ 통화 화면 (2026-09-03) ═══════════════
   참고 환산가의 표시 통화를 고르는 목록 (pit-ccy-20260920CA.js). 색은 전부 토큰만 쓴다. */
.ccy-search input{width:100%;min-width:0;border:1px solid var(--line);border-radius:12px;
  background:var(--card2);outline:0;padding:11px 13px;font-size:14px;color:var(--txt);margin-bottom:10px}
.ccy-search input::placeholder{color:var(--dim)}
.ccy-search input:focus{border-color:var(--key)}
.ccy-status{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 12px;
  color:var(--sub);font-size:12.5px;font-weight:800}
.ccy-list{display:flex;flex-direction:column;gap:8px}
.ccy-row{display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  border:1px solid var(--line);border-radius:14px;background:var(--card);
  padding:12px 13px;color:var(--txt)}
.ccy-row i{flex:0 0 auto;width:18px;height:18px;border-radius:50%;border:2px solid var(--dim);
  position:relative;display:block}
.ccy-row b{flex:1;min-width:0;font-size:14.5px;font-weight:900;letter-spacing:.2px}
.ccy-row b small{display:block;margin-top:2px;color:var(--sub);font-size:12px;font-weight:700}
.ccy-row > span{flex:0 0 auto;color:var(--sub);font-size:12.5px;font-weight:800;
  font-variant-numeric:tabular-nums;text-align:right}
.ccy-row.on{border-color:var(--key);background:var(--tint-key,var(--card2))}
.ccy-row.on i{border-color:var(--key)}
.ccy-row.on i::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--key)}
.ccy-row.on > span{color:var(--on-key-tint,var(--on-key))}
.ccy-empty{margin:0;padding:18px 0;text-align:center;color:var(--dim);font-size:13px;font-weight:700}


/* ═══ 정보 — 자주 묻는 질문 (2026-09-03, 사장님 지시) ═══
   ★ 묶음(.faq-g) → 질문(.faq-q) → 답(.faq-a). 펼침은 .open 클래스, 감춤은 .hidden 클래스.
     화살표(›)는 묶음이 열리면 90° 돌아 아래를 본다.
   ★ 백서 장을 그대로 실어 오므로 paper.css 의 모양을 .faq-a 아래에만 다시 적었다.
     paper.css 를 index.html 에 얹으면 안 된다 — 그 파일은 header 격자를 바꿔 버린다.
   ★ 색은 토큰만 쓴다. 새 토큰(--line-soft·--ctrl·--tint-*·--on-*-tint)은
     아직 없을 때를 대비해 옛 토큰으로 받친다. */
.faq h2{margin-bottom:4px}
.faq-g{border-top:1px solid var(--line-soft,var(--line))}
.faq-g:first-child{border-top:0}
.faq-h{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;
  background:transparent;padding:13px 2px;color:var(--txt);font-size:14px;font-weight:900}
.faq-h > b{flex:1;min-width:0;word-break:keep-all}
.faq-h > i{flex:0 0 auto;display:inline-block;font-style:normal;color:var(--dim);font-size:19px;
  line-height:1;transition:transform .16s}
.faq-g.open > .faq-h > i{transform:rotate(90deg);color:var(--blue)}
.faq-b{padding:0 0 6px}
.faq-q{border-top:1px solid var(--line-soft,var(--line))}
.faq-qh{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;
  background:transparent;padding:10px 2px 10px 12px;color:var(--sub);font-size:13.5px;
  font-weight:700;line-height:1.5}
.faq-qh > span{flex:1;min-width:0;word-break:keep-all}
.faq-qh > em{flex:0 0 auto;font-style:normal;color:var(--blue);font-size:12px;font-weight:800;
  padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--ctrl,var(--card2))}
.faq-q.open > .faq-qh{color:var(--txt)}
.faq-q.open > .faq-qh > em{color:var(--on-key);border-color:transparent;
  background:linear-gradient(180deg,var(--key),var(--key2))}
.faq-qh.faq-win > span{color:var(--blue);font-weight:800}

/* 답 상자 — 내가 쓴 답(p 만)과 백서 장(카드 속 그대로) 둘 다 여기 들어온다 */
.faq-a{margin:0 2px 12px 12px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;
  background:var(--card2);color:var(--txt);font-size:13.5px;line-height:1.72;word-break:keep-all;
  overflow-wrap:anywhere}
.faq-a > p{margin:0}
.faq-a > p + p{margin-top:8px}
.faq-a > p.lead{margin:9px 0 0;color:var(--txt)}
.faq-a > p.lead:first-child{margin-top:0}
.faq-a .note{margin:10px 0 0;color:var(--dim);font-size:12px;line-height:1.65}
.faq-a a{color:var(--blue)}
.faq-a code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;word-break:break-all}
.faq-a h3.sub{margin:15px 0 7px;font-size:12.5px;font-weight:900;color:var(--blue);letter-spacing:.2px}
.faq-a .kv{align-items:flex-start;padding:7px 0;border-top:1px solid var(--line-soft,var(--line))}
.faq-a .kv:first-child,.faq-a h3.sub + .kv,.faq-a p + .kv{border-top:0}
.faq-a .kv > span{flex:1 1 auto;min-width:0;line-height:1.45}
.faq-a .kv b{white-space:normal;text-align:right;max-width:60%;line-height:1.45}
.faq-a .kv b.good{color:var(--green)}
.faq-a .pillrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.faq-a .pillrow .pill{background:var(--card);border:1px solid var(--line);color:var(--blue);
  font-size:12.5px;font-weight:800;padding:5px 10px;border-radius:99px}
.faq-a ol.steps{margin:10px 0 0;padding:0;list-style:none;counter-reset:st}
.faq-a ol.steps li{counter-increment:st;position:relative;padding:8px 0 8px 28px;
  border-top:1px solid var(--line-soft,var(--line));font-size:13.5px;line-height:1.65;color:var(--txt)}
.faq-a ol.steps li:first-child{border-top:0}
.faq-a ol.steps li::before{content:counter(st);position:absolute;left:0;top:8px;width:19px;height:19px;
  border-radius:50%;background:var(--card);border:1px solid var(--line);color:var(--blue);
  font-size:12.5px;font-weight:900;display:grid;place-items:center}
.faq-a ol.steps small{color:var(--sub);font-size:12px}
.faq-a .tag{display:inline-block;background:var(--card);border:1px solid var(--line);color:var(--sub);
  font-size:12.5px;font-weight:800;padding:2px 7px;border-radius:7px;margin:2px 3px 0 0;white-space:nowrap}
.faq-a .fnlist{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.faq-a .fn{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;font-weight:700;
  background:var(--card);border:1px solid var(--line);color:var(--green);padding:4px 9px;border-radius:8px}
.faq-a .fn.none{color:var(--dim);text-decoration:line-through;text-decoration-color:var(--red)}
.faq-a .atable{margin-top:12px}
.faq-a .arow{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:start;padding:10px 0;
  border-top:1px solid var(--line-soft,var(--line))}
.faq-a .arow.head{border-top:0;padding-bottom:6px;color:var(--sub);font-size:12.5px;font-weight:800}
.faq-a .arow.head b{color:var(--sub);font-size:12.5px;font-weight:800}
.faq-a .arow.head > em{display:none}
.faq-a .arow > span{min-width:0}
.faq-a .arow > span > b{display:block;font-size:13.5px;font-weight:800;color:var(--txt);line-height:1.4}
.faq-a .arow > span > small{display:block;margin-top:3px;color:var(--sub);font-size:12.5px;font-weight:600;line-height:1.55}
.faq-a .arow > span > code{display:block;margin-top:5px;font-size:12.5px;color:var(--dim);line-height:1.4}
.faq-a .arow > b{font-size:14px;font-weight:900;color:var(--txt);white-space:nowrap;font-variant-numeric:tabular-nums}
.faq-a .arow > em{grid-column:1 / -1;justify-self:start;font-style:normal;font-size:12.5px;font-weight:800;
  color:var(--sub);background:var(--card);border:1px solid var(--line);border-radius:7px;padding:3px 7px;line-height:1.35}
.faq-a .arow > em.hard{color:var(--green)}
.faq-a .warnbox{margin-top:14px;padding:12px 13px;border-radius:12px;
  background:var(--tint-gold,var(--card));border:1px solid var(--line)}
.faq-a .warnbox > b{display:block;color:var(--gold);font-size:13px;font-weight:900;margin-bottom:6px}
.faq-a .warnbox p{margin:7px 0 0;color:var(--on-gold-tint,var(--sub));font-size:12.5px;line-height:1.7}
.faq-a .warnbox p:first-of-type{margin-top:0}
.faq-a .warnbox a{color:var(--gold)}
.faq-a .warnbox.danger{background:var(--tint-red,var(--card))}
.faq-a .warnbox.danger > b{color:var(--red)}
.faq-a .warnbox.danger p{color:var(--on-red-tint,var(--sub))}
.faq-a .risk{padding:11px 0;border-top:1px solid var(--line-soft,var(--line))}
.faq-a .risk:first-of-type{border-top:0;padding-top:2px}
.faq-a .risk > b{display:block;color:var(--txt);font-size:13.5px;font-weight:800;margin-bottom:5px}
.faq-a .risk p{margin:0;color:var(--sub);font-size:12.5px;line-height:1.72}
.faq-a ul.nolist{margin:10px 0 0;padding:0;list-style:none}
.faq-a ul.nolist li{position:relative;padding:8px 0 8px 20px;border-top:1px solid var(--line-soft,var(--line));
  font-size:13.5px;line-height:1.6;color:var(--txt)}
.faq-a ul.nolist li:first-child{border-top:0}
.faq-a ul.nolist li::before{content:'×';position:absolute;left:2px;top:8px;color:var(--red);font-weight:900;font-size:14px}
.faq-a .clist{margin-top:10px}
.faq-a .crow{padding:9px 0;border-top:1px solid var(--line-soft,var(--line))}
.faq-a .crow:first-child{border-top:0}
.faq-a .crow > span{display:block;font-size:12.5px;font-weight:700;color:var(--sub)}
.faq-a .crow > span > b{color:var(--txt);font-weight:800}
.faq-a .crow > span > em{font-style:normal;color:var(--dim);font-size:12.5px;margin-left:4px}
.faq-a .crow > code{display:block;margin-top:4px;color:var(--blue);line-height:1.45}
.faq-a .crow > em{font-style:normal;font-size:12.5px;font-weight:700;color:var(--dim)}
.faq-a .outline.tight{margin-top:8px}

/* ═══ 추천인 — 초대하기 (pit-refer-20260920CA.js, 2026-09-03) ═══
   색은 토큰만 쓴다. QR 바탕은 .qr 이 이미 흰색이다 — 스캔이 되려면 흰 바탕이어야 한다.
   노란 안내 상자는 기존 .warning.gold 를 그대로 쓴다. */
.inv-lead{margin:-6px 2px 14px;text-align:center;color:var(--sub);font-size:13.5px;font-weight:700}
.qr.big{width:250px;height:250px;margin:0 auto 14px}
.inv-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.inv-actions .primary,.inv-actions .outline{margin-top:0}
.inv-scanrow{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.inv-scanrow .outline{margin-top:0}
#refPaneScan{margin-top:10px}
#refPaneScan .outline{margin-top:0}
.inv-pending{color:var(--gold);font-weight:800}
.inv-done{margin-top:12px;padding:10px 12px;border:1px solid var(--green);border-radius:10px;
  background:var(--tint-green);color:var(--on-green-tint);font-size:13.5px;font-weight:800;text-align:center}
.inv-done b{font-family:ui-monospace,monospace}
#refer .kv + .kv{margin-top:8px}
.share-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.share-grid button{border:0;background:transparent;color:var(--sub);font-size:12px;font-weight:800;padding:4px 0}
.share-grid button i{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 6px;
  border:1px solid var(--line);border-radius:50%;background:var(--card2);color:var(--blue);
  font-style:normal;font-size:16px;font-weight:900}
.share-grid button:active i{border-color:var(--key)}

/* ── 시세: 호가 줄을 눌러 수량 넣어 보기 (2026-09-03) ──
   줄이 <div> 에서 <button> 이 됐다. 단추 기본 꾸밈을 지워 보이던 그대로 둔다. */
/* ★ font 를 통째로 물려받게 하면 안 된다 — 위 .bookhead,.row 의 고정폭 글꼴과
   11.5px 이 지워져 호가 숫자 줄이 어긋난다. 단추 기본 꾸밈만 지운다. */
.rows .row{appearance:none;-webkit-appearance:none;border:0;background:transparent;
  width:100%;text-align:inherit;color:inherit;cursor:pointer;letter-spacing:inherit}
.rows .row:hover .px{text-decoration:underline}
.rows .row:active{opacity:.75}
#bkPick .kv b{white-space:normal;text-align:right}
#bkPickGuard{margin-top:8px}

/* ── 매도 계획표 (2026-09-03) ── */
.planlist{display:flex;flex-direction:column;gap:6px;margin:10px 0 4px}
/* ★ 세 칸이다 — 넷으로 두면 좁은 폰에서 「지움」이 아래로 밀린다 (2026-09-03) */
.planrow{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;
  padding:9px 11px;border:1px solid var(--line);border-radius:12px;background:var(--card2)}
.planrow .pv{font-size:14.5px;font-weight:900;color:var(--sub);white-space:nowrap}
.planrow .ps{display:block;margin-top:3px;font-style:normal;font-size:10.5px;font-weight:800;
  color:var(--dim)}
.planrow .pq{font-size:13px;font-weight:800;color:var(--txt);min-width:0}
.planrow .pe{display:block;margin-top:2px;color:var(--dim);font-size:12.5px;font-weight:700;
  font-style:normal}
.planrow .pb{display:flex;gap:5px;flex:0 0 auto}
.planrow.on{border-color:var(--green);background:var(--tint-green)}
.planrow.on .pv,.planrow.on .ps{color:var(--green)}
.planrow .pill{padding:5px 9px;font-size:12px;white-space:nowrap}
.planrow .pill.del{color:var(--red)}
.planlist .empty{color:var(--dim);text-align:center;padding:14px 0;font-size:12.5px;font-weight:700}

/* ★ 2026-09-06 밤 사장님 지시 — 안심 문구 띠와 그 아래 상자 사이가 너무 벌어져 있었다(띠 8px + 화면 18px). 화면 위 여백을 10px 로 */
.page{padding-top:10px}

/* ★ 2026-09-07 — 유동성 「넣을 USDT」 아래 몫 단추 */
.lpq{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 10px;flex-wrap:wrap}
.lpq>span:first-child{font-size:13px;color:var(--muted,#8aa);white-space:nowrap}
.lpq-btns{display:flex;gap:6px}
.lpq-b{padding:5px 11px;font-size:13px;line-height:1;border-radius:999px;cursor:pointer;
  background:var(--chip,rgba(255,255,255,.07));color:inherit;border:1px solid rgba(255,255,255,.14)}
.lpq-b:hover{background:rgba(255,255,255,.14)}
.lpq-b:active{transform:translateY(1px)}
.lpq-have{font-size:13px;color:var(--muted,#8aa);white-space:nowrap}
.lpq-have b{color:inherit;font-weight:600}

/* ★ 2026-09-07 — 유동성 화면 정리 (에드 지시: 간단하게 · 가독성 있게)
   줄을 세로로 늘어놓던 것을 두 칸 격자로 묶는다. 좁은 화면에서는 한 칸이 된다. */
.lpgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:10px 0 12px}
.lpgrid>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.lpgrid small{font-size:12px;opacity:.7;line-height:1.35}
.lpgrid small em{font-style:normal;opacity:.75}
.lpgrid b{font-size:15px;font-weight:600;overflow-wrap:anywhere}
/* 375px 폰이 두 칸으로 보이도록 기준을 낮춘다 — 380 으로 두면 대부분의 폰이 한 줄이 된다 */
@media (max-width:330px){ .lpgrid{grid-template-columns:1fr} }

/* 잠글 기간 넉 줄이 두 줄로 접히지 않게 네 칸으로 고정한다 */
#lkTerms{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
#lkTerms button{padding:9px 4px;font-size:13px;white-space:nowrap}

/* 내 잠금 목록 */
.lklist{display:flex;flex-direction:column;gap:6px;margin:6px 0 10px}
.lkrow{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;
  padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.05)}
/* ★ 글자 칸이 늘어나게 flex 를 준다. 안 주면 단추 둘이 자리를 뺏어
   「풀 렸 습 니 다」처럼 한 글자씩 세로로 쪼개진다 (2026-09-07 실제로 그랬다). */
.lkrow>span{flex:1 1 150px;min-width:0;display:flex;flex-direction:column;gap:2px}
.lkrow b{overflow-wrap:anywhere}
.lkrow small{font-size:12px;opacity:.7;overflow-wrap:anywhere}
.lkrow button{flex:0 0 auto;white-space:nowrap}

/* 곧 풀리는 잠금 — 눈에 띄게 */
.lkrow.soon{background:rgba(255,196,84,.10);box-shadow:inset 0 0 0 1px rgba(255,196,84,.35)}
.lkrow.soon small{opacity:.9}

/* 넣고 잠글 기간 — 다섯 칸 (2026-09-07 「합쳐주세요」) */
#lpTerms{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
#lpTerms button{padding:9px 2px;font-size:12px;white-space:nowrap}

/* 거래 상세 — 배관을 접어 두는 자리 (2026-09-08 에드 「결제 정보만 깔끔하게」) */
.txid-more{border:1px solid var(--line-soft,var(--line));border-radius:11px;
  background:var(--card2);padding:0 12px}
.txid-more>summary{list-style:none;cursor:pointer;padding:11px 0;
  color:var(--sub);font-size:12.5px;font-weight:800;letter-spacing:.2px}
.txid-more>summary::-webkit-details-marker{display:none}
.txid-more>summary::after{content:'›';float:right;transform:rotate(90deg);opacity:.7}
.txid-more[open]>summary::after{transform:rotate(-90deg)}
.txid-more>.txid-events{padding-bottom:12px}

/* 거래 상세 — 소각·돌아오는 몫에 색 (2026-09-08 에드 지시)
   ★ 이름표는 그대로 두고 **숫자에만** 준다.
   ★★ 이 지갑의 --blue 는 실제로 주황(#C97F4A)이다 — 갈색 화면에 맞춰 다시 칠해 둔 것이라
      그대로 쓰면 소각(산호빛)과 구분이 안 된다. 그래서 여기만 청록을 따로 잡는다. */
:root{ --txid-burn:#EF6461; --txid-back:#4FBFA8; }
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){
  --txid-burn:#C62828; --txid-back:#116B5C; } }
:root[data-theme="light"]{ --txid-burn:#C62828; --txid-back:#116B5C; }
/* ★ 2026-09-08 에드 지시 — 단위(PIT·USDT)는 다른 줄과 같은 색, **숫자만** 물들인다 */
.txid-row.burn>i, .txid-row.back>i{color:var(--txt)}
/* ★ 색 말고는 아무것도 바꾸지 않는다 — 둘레에서 그대로 물려받게 못 박는다.
   (이 카드에는 b·span 을 건드리는 규칙이 따로 있어, 안 박아 두면 또 밀린다.) */
.txid-row.burn>i .num, .txid-row.back>i .num{
  display:inline;font:inherit;font-weight:inherit;letter-spacing:inherit}
.txid-row.burn>i .num{color:var(--txid-burn)}
.txid-row.back>i .num{color:var(--txid-back)}
/* ★ 숫자와 단위를 갈라 놓지 않는다 (2026-09-08 화면에서 잡음).
   이름표가 길면 값 자리가 좁아져 빈칸에서 끊겼다 — 「0.481501」 아래 「USDT」.
   값은 한 줄로 못 박고, 정 모자라면 **이름표**가 줄어들게 한다.
   이름표는 짧고 되풀이되는 말이라 잃어도 되지만 숫자는 그렇지 않다. */
.txid-row.burn>i, .txid-row.back>i{white-space:nowrap;flex:0 0 auto;word-break:normal}
.txid-row.burn>span, .txid-row.back>span{flex:0 1 auto;min-width:0;
  overflow:hidden;text-overflow:ellipsis}

/* 스왑 — 페이백 PIT 줄 (2026-09-08 에드: 「금액이 잘리니 밑으로 한 줄 해도 되고」)
   ★ 값이 길면 자르지 말고 **아랫줄로 내린다.** 돈은 잘리면 안 된다. */
.kv.wrapv{flex-wrap:wrap}
.kv.wrapv>b{min-width:0;white-space:normal;word-break:keep-all;text-align:right}

/* 봇 화면 (2026-09-08 에드 지시) */
/* ★ 2026-09-08 에드 — 표시 나지 않게. 다른 글자와 같은 색·같은 모양이다. */
.botdoor{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
.botchips{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 10px}
.botchips>button{flex:1 1 auto;min-width:56px;padding:8px 6px;border-radius:10px;
  border:1px solid var(--line);background:transparent;color:var(--sub);font:inherit;cursor:pointer}
.botchips>button.on{border-color:var(--blue);color:var(--txt);background:var(--card2,rgba(255,255,255,.04))}
.botlog{margin:10px 0 0;padding:8px 10px;max-height:180px;overflow:auto;border-radius:10px;
  background:var(--card2,rgba(255,255,255,.04));color:var(--sub);font:11.5px/1.7 ui-monospace,monospace;white-space:pre;overflow-x:auto}
.botlight{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle}
.botlight.lose{background:#EF6461}
.botlight.even{background:#3FBF7F}
.botlight.off{background:var(--sub,#8a8a8a)}   /* PC 봇 지갑 멈춤 표시 (2026-09-09) */
/* ★ 2026-09-08 에드 — 이익일 때는 파란불이 **깜빡인다.** 눈에 띄어야 팔 때를 안다.
   ★ 움직임을 싫어하는 기기(prefers-reduced-motion)에서는 켜 두기만 한다. */
.botlight.win{background:#4C8DF6;animation:botblink 1.1s ease-in-out infinite}
@keyframes botblink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(76,141,246,.55)}
  50%{opacity:.45;box-shadow:0 0 0 5px rgba(76,141,246,0)}}
/* ★ 움직임을 싫어하는 기기에서는 깜빡이지 않는다.
   대신 **둥근 빛발을 고정으로** 두어 그래도 눈에 띄게 한다 — 「파란불」은 남아야 한다. */
@media (prefers-reduced-motion: reduce){
  .botlight.win{animation:none;box-shadow:0 0 0 3px rgba(76,141,246,.35)}
}
/* ★ 2026-09-09 에드 — 폰 봇 화면의 「멈춤」이 눌렀는지 표가 안 났다(투명 단추 · 안내는 아래 줄에만).
   멈춤은 빨간 단추(.primary.danger)로 두고, 명령의 단계를 **단추 글자·색**에 바로 쓴다:
   보내는 중(고리) → 보냄·PC 대기(주황 · 깜빡) → PC 확인 ✓(초록 · 8초). 기다리는 동안은 다시 못 누른다. */
#pcbotStop{margin-top:9px}
#pcbotStart.pcwait,#pcbotStart.pcwait:disabled,#pcbotStop.pcwait,#pcbotStop.pcwait:disabled,.botchips>button.pcwait,.botchips>button.pcwait:disabled{
  background:rgba(230,184,74,.14);border-color:var(--warn-line);color:var(--warn-a);opacity:1;animation:pcwait 1.1s ease-in-out infinite}
#pcbotStart.pcdone,#pcbotStart.pcdone:disabled,#pcbotStop.pcdone,#pcbotStop.pcdone:disabled,.botchips>button.pcdone,.botchips>button.pcdone:disabled{
  background:var(--tint-green);border-color:rgba(63,191,127,.6);color:#3FBF7F;opacity:1;animation:none}
#pcbotStart.pcdone.bad,#pcbotStop.pcdone.bad,.botchips>button.pcdone.bad{background:var(--tint-red);border-color:var(--edge-red-hi);color:#EF6461}
@keyframes pcwait{0%,100%{opacity:1}50%{opacity:.55}}
@media (prefers-reduced-motion: reduce){
  #pcbotStart.pcwait,#pcbotStop.pcwait,.botchips>button.pcwait{animation:none;box-shadow:0 0 0 2px rgba(230,184,74,.35)}
}

/* 봇 실행 중 띠 (2026-09-08 에드 조건 ⑥) — 어느 화면에서나 보인다 */
/* .botbar 는 앱 안 봇과 함께 뺐다 (2026-09-09) */
body.botrun .toast{top:152px}

/* ★ 2026-09-09 에드 — 관리자 「지갑」 탭: 활성 지갑 표 (pit-actives-20260920CA.js). 토큰 이름을 누르면 그 토큰 많은 순.
   ★ 밤 — 값이 줄줄이 붙어 헷갈린다고 하여 **세로줄이 있는 표**로: 칸 너비를 고정하고 숫자는 오른쪽 맞춤, 칸마다 왼쪽 줄. 좁은 폰은 표가 가로로 넘어가며 스크롤. */
/* ★ 2026-09-09 에드 — 활성 지갑·추천인 순위: 진짜 표(<table>). 격자(div)로는 줄마다 칸 너비가 따로 잡혀 세로줄이 어긋났다.
   지갑 칸이 남는 폭을 다 갖고 숫자 칸은 내용만큼이라 세로줄이 위아래로 한 줄이고, 칸 안쪽 여백이 모두 같다 */
.awwrap{margin-top:10px;border:1px solid var(--line);border-radius:12px;overflow-x:auto;background:var(--card2,rgba(255,255,255,.03))}
.awtable{width:100%;border-collapse:collapse;font-size:12px}
.awtable th,.awtable td{padding:7px 6px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap;line-height:1.3}   /* 09-10 — 7칸이라 가로 여백 8→6 */
.awtable th.pay,.awtable td.pay{padding-left:4px;padding-right:4px;font-size:11px}   /* 결제 두 칸은 더 좁게 · 「회」 없이 1,461/1,046 (에드 09-10) */
.awtable th.pay button{font-size:11px;line-height:1.2}
.awtable th:first-child,.awtable td:first-child{border-left:0}
.awtable tbody tr:last-child td{border-bottom:0}
.awtable thead th{font-size:11.5px;color:var(--sub);font-weight:800;text-align:left;height:34px}
.awtable th.v,.awtable td.v{text-align:right;font-variant-numeric:tabular-nums}
.awtable td.v{color:var(--txt);font-weight:700}
.awtable th.a,.awtable td.a{width:100%}
.awtable th.n,.awtable td.n{color:var(--dim);font-variant-numeric:tabular-nums}
.awtable th button{border:0;border-radius:0;background:transparent;color:var(--sub);font:inherit;font-size:11.5px;font-weight:800;padding:0;margin:0;width:100%;text-align:right;cursor:pointer;line-height:1.3}
.awtable th button.on{color:var(--key)}
.awtable th button.on::after{content:' \25BE'}
.awtable tr.awrow{cursor:pointer}
.awtable tr.me td{background:var(--tint-blue,rgba(76,141,246,.1))}
.awtable td.a b{font-family:ui-monospace,Consolas,monospace;font-size:11.5px;color:var(--txt);display:block}
.awtable td.a small{font-size:10.5px;color:var(--gold);font-weight:700;display:block}
.awtable td p.note{white-space:normal;margin:0}
.awpages{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}
.awpages button{min-width:34px;padding:6px 8px;border-radius:9px;border:1px solid var(--line);background:transparent;color:var(--sub);font:inherit;font-size:12.5px;font-weight:800;cursor:pointer;margin:0;width:auto}
.awpages button.on{border-color:var(--key);color:var(--key)}
.awpages span{align-self:center;color:var(--dim);padding:0 2px}
#secRecoverNote .secImp{display:block;margin-top:4px;color:var(--gold)}   /* C07(2026-09-09) — 가져온 개인키 계정 수 안내 */
/* ★ 2026-09-09 밤 에드 — 「지금 매도하면?」 10·30·50·100% 를 표 한 줄씩(가로·세로 줄). 손익 칸이 남는 폭을 갖고 숫자 칸은 오른쪽 맞춤 */
.pnlwrap{margin:6px 0 10px;border:1px solid var(--line);border-radius:12px;overflow-x:auto;background:var(--card2,rgba(255,255,255,.03))}
.pnltable{width:100%;border-collapse:collapse;font-size:12.5px}
.pnltable th,.pnltable td{padding:7px 8px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle;line-height:1.3}
.pnltable th:first-child,.pnltable td:first-child{border-left:0}
.pnltable tbody tr:last-child td{border-bottom:0}
.pnltable thead th{font-size:11.5px;color:var(--sub);font-weight:800;text-align:left}
.pnltable th.v,.pnltable td.v{text-align:right;font-variant-numeric:tabular-nums}
.pnltable td.v{font-weight:700;color:var(--txt)}
.pnltable td:first-child{color:var(--sub);font-weight:800;font-variant-numeric:tabular-nums}
.pnltable td.s{width:100%;font-weight:800;color:var(--txt)}
.pnltable td.s .botlight{margin-right:6px;vertical-align:middle}
/* ★ 2026-09-10 낮 에드 — 제목 오른쪽 「지금 시세」 · 줄을 누르면 「N% 팔면 시세」 · 누른 줄은 색을 넣는다 */
.pnlpx{font-size:12.5px;font-weight:700;color:var(--sub);text-align:right;white-space:normal;line-height:1.35}
.pnlpx em{font-style:normal;color:var(--dim);font-weight:700;margin:0 4px 0 0;font-size:12px}
.pnlpx small{display:block;font-size:11px;color:var(--dim);font-weight:600}
.pnlpx.on{color:var(--key-txt)}
.kv b.pnlpx{white-space:normal;overflow:visible;text-overflow:clip}   /* .kv b 의 nowrap·… 자르기를 풀어 두 줄로 */
.pnltable tbody tr{cursor:pointer}
.pnltable tbody tr.pnlpick td{background:var(--tint-key)}   /* ★ .pick 은 시작 화면 카드 이름 — 겹치면 안 됨 */
.pnltable tbody tr.pnlpick td:first-child{color:var(--key-txt)}
.swpct{display:flex;gap:6px;align-items:center;margin:8px 0 10px}   /* 2026-09-10 — 스왑 10·30·50·100% 넣기 */
.swpct span{font-size:12.5px;color:var(--sub);font-weight:800;margin-right:2px;white-space:nowrap}
.swpct button{flex:1;margin:0;padding:9px 0;width:auto;min-width:0}
.appver{margin-left:6px;color:var(--dim);font-size:11.5px}.appver b{font-family:ui-monospace,Consolas,monospace;font-weight:700;color:var(--sub)}   /* 「전체」 아래 판 이름 (2026-09-10) */

/* Swap controls follow the PIT balance; keep the entire price estimate readable on narrow screens. */
.swpriceafter{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:8px 0 16px;font-size:clamp(11px,3.1vw,13px);line-height:1.6;color:var(--sub);max-width:100%;font-variant-numeric:tabular-nums}.swpriceafter.quoted{color:var(--key-txt);font-weight:700}
.swpriceusd{min-width:0;overflow-wrap:anywhere}.swpricekrw{margin-left:auto;white-space:nowrap;color:var(--txt);font-weight:800}


/* Wallet valuation and receipt address clarity (2026-09-15). */
.wallet-total-usdt{margin-top:8px;text-align:right;font-size:13px;overflow-wrap:anywhere}
.wallet-value-note{margin:8px 0 0;font-size:12px;line-height:1.6;opacity:.8}
.wallet-pit-quote{padding:12px 4px;display:flex;flex-direction:column;gap:4px;font-size:13px}
.wallet-pit-quote small{font-size:11px;opacity:.8}
#txidTargetNote{overflow-wrap:anywhere;line-height:1.65}
#txidRecipient{overflow-wrap:anywhere}

.wallet-pit-quote button{align-self:flex-start;margin-top:5px;min-height:32px}

/* Single current-account summary; independent actions in All > Kaia. */
.acct-current-name{margin:0 0 14px;font-size:14px;color:var(--sub);overflow-wrap:anywhere}
.acct-current-name:empty{display:none}
.acct-entry{flex:none;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.acct-entry .acct-row{border:0;border-radius:0}
.acct-actions{display:flex;gap:8px;padding:0 10px 10px}
.acct-actions button{flex:1;min-height:40px;padding:8px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--sub);font-size:12px;cursor:pointer}
.acct-actions button:hover,.acct-actions button:focus-visible{color:var(--txt);border-color:var(--key)}


/* 2026-09-15 — compact, switchable pool depth. Scoped to the market page. */
#book .title{margin-bottom:12px}
#book .mkbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px}
#book .mkbar select{grid-column:1 / -1;padding:11px 12px;font-size:17px;border-radius:8px;background:transparent}
#book .mkbar .pill{font-size:11px;padding:6px 10px}
#book .mkbar #bkRefresh{justify-self:start}
#book .lastbox{gap:6px;margin:16px 0 18px}
#book .lastbox b{font-family:inherit;font-variant-numeric:tabular-nums;font-weight:700;font-size:25px;letter-spacing:0}
#book .lastbox .krwref{flex-basis:100%;margin-left:0;font-size:12px;font-weight:400}
#book .chartbox{margin:0 0 16px;padding:13px 0;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:none}
#book .chart-head{padding:0}
#book .chart-head h2{font-weight:700;font-size:14px}
#book .chart-head span{font-weight:400;font-size:11px}
#book .market-book{margin-bottom:20px}
#book .book-title{display:flex;align-items:center;gap:10px;padding:0 0 12px;border-bottom:1px solid var(--line)}
#book .book-title h2{margin:0;color:var(--txt);font-size:14px;font-weight:800}
#book .book-title>span{font-size:11px;color:var(--sub);margin-left:auto}
#book #bookState:empty{display:none}
#book .book-tools{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 0}
#book .book-modes,#book .book-options,#book .book-count{display:flex;align-items:center;gap:3px}
#book .book-tools button{display:grid;place-items:center;width:32px;height:32px;padding:0;background:transparent;color:var(--sub);border:1px solid transparent;border-radius:6px;font-size:17px;cursor:pointer}
#book .book-tools button[aria-pressed="true"]{background:var(--ctrl);color:var(--txt)}
#book .book-tools button:disabled{opacity:.35;cursor:default}
#book .book-tools button:focus-visible,#book .book-tools select:focus-visible,#book .row:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
#book .book-count{gap:0;border:1px solid var(--line);border-radius:6px}
#book .book-count button{width:25px;height:30px;border:0}
#book .book-count select{min-width:0;width:48px;min-height:30px;padding:0 2px;border:0;border-radius:0;background:var(--bg);color:var(--txt);font-family:inherit;font-size:12px;cursor:pointer}
html[lang="en"] #book .book-count select{width:62px}
#book #bkTotals{border-color:var(--line);margin-left:3px;width:30px}
#book .book-icon{display:grid;grid-template-columns:8px 8px;grid-template-rows:8px 8px;gap:2px}
#book .book-icon i{background:var(--dim);opacity:.35}
#book .icon-both i:nth-child(1),#book .icon-asks i:nth-child(odd),#book .icon-split i:nth-child(even){background:var(--ask);opacity:1}
#book .icon-both i:nth-child(3),#book .icon-bids i:nth-child(odd),#book .icon-split i:nth-child(odd){background:var(--bid);opacity:1}
#book .book-depth{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:'head' 'asks' 'mid' 'bids'}
#book .book-depth.hidden{display:none}
#book .bookhead{grid-area:head}
#book #asks{grid-area:asks;min-width:0}
#book #bids{grid-area:bids;min-width:0}
#book .mid{grid-area:mid}
#book .split-head{display:none}
#book .bookhead,#book .row{grid-template-columns:minmax(0,1fr) minmax(0,.9fr) minmax(0,1fr);gap:6px;font-family:inherit;font-variant-numeric:tabular-nums;letter-spacing:0}
#book .bookhead{padding:5px 2px 8px;border:0;color:var(--sub);font-size:10px;font-weight:400;white-space:nowrap}
#book .bookhead i,#book .split-head i{font-style:normal}
#book .rows .row{min-height:29px;padding:4px 2px;line-height:21px;font-size:13px;font-weight:400;border-radius:0;isolation:isolate;overflow:hidden}
#book .row .px{font-weight:500}
#book .row .px,#book .row .sz,#book .row .tt{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#book .row .tt{color:var(--txt)}
#book .row .bar{top:0;bottom:0;right:0;border-radius:0;opacity:.7}
#book .row:hover{background:var(--fg-a-03)}
#book .mid{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:8px 0;padding:10px 2px;background:none;border:0}
#book .mid b{font-family:inherit;font-variant-numeric:tabular-nums;font-size:19px;font-weight:700}
#book .mid .krw{margin-left:0;font-size:11px;font-weight:400;color:var(--sub)}
#book #midNote{flex-basis:100%;font-size:10px;font-weight:400;color:var(--sub)}
#book .book-depth[data-mode="asks"]{grid-template-areas:'head' 'asks' 'mid'}
#book .book-depth[data-mode="asks"] #bids{display:none}
#book .book-depth[data-mode="bids"]{grid-template-areas:'mid' 'head' 'bids'}
#book .book-depth[data-mode="bids"] #asks{display:none}
#book .book-depth.without-totals .row,#book .book-depth.without-totals .bookhead{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#book .book-depth.without-totals .tt,#book .book-depth.without-totals .total-heading{display:none}
#book .book-depth[data-mode="split"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'mid mid' 'buyhead sellhead' 'bids asks';column-gap:10px}
#book .book-depth[data-mode="split"] .bookhead,#book .book-depth[data-mode="split"] .tt{display:none}
#book .book-depth[data-mode="split"] .split-head{display:flex;justify-content:space-between;gap:3px;padding:5px 2px 8px;font-size:9px;color:var(--sub);white-space:nowrap}
#book .split-buy{grid-area:buyhead}
#book .split-sell{grid-area:sellhead}
#book .book-depth[data-mode="split"] .row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3px;font-size:12px}
#book .book-depth[data-mode="split"] .asks{flex-direction:column}
#book .book-depth[data-mode="split"] .bid .sz{order:-1;text-align:left}
#book .book-depth[data-mode="split"] .bid .px{text-align:right}
#book .book-depth[data-mode="split"] .ask .bar{right:auto;left:0}
#book .book-depth[data-mode="split"] .mid{justify-content:center;margin-top:0}
#book .book-depth[data-mode="split"] #midNote{text-align:center}
#book .book-empty{padding:28px 10px;text-align:center;color:var(--sub);font-size:12px}
#book .book-help{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);color:var(--sub);font-size:11px;line-height:1.7}
#book .book-help summary{cursor:pointer;width:fit-content}
#book .book-help p{margin:8px 0 0}
@media(max-width:359px){
  #book .book-tools{gap:3px}
  #book .book-modes{gap:0}
  #book .book-modes button{width:29px}
  #book .book-count button{width:22px}
  #book .book-count select{width:43px}
  #book .rows .row{font-size:12px}
  #book .book-depth[data-mode="split"]{column-gap:8px}
  #book .book-depth[data-mode="split"] .row{font-size:11px}
}


/* 2026-09-15 — market heading in two rows, compact dapp directory. */
#book .market-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
#book .market-caption{display:flex;align-items:center;gap:6px;white-space:nowrap}
#book .market-caption h1{margin:0;font-size:19px;line-height:1.3;font-weight:800}
#book .market-readonly{font-size:10px;color:var(--sub);font-weight:500}
#book .market-topline select{width:auto;max-width:50%;min-width:0;padding:7px 24px 7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--txt);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}
#book .market-quote-row{display:flex;align-items:center;justify-content:space-between;gap:6px}
#book .market-value{display:flex;align-items:baseline;gap:4px;min-width:0;white-space:nowrap}
#book .market-value b{min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:20px;font-weight:700;letter-spacing:-.4px;font-variant-numeric:tabular-nums}
#book .market-value small{flex:0 0 auto;color:var(--sub);font-size:9px;font-weight:500}
#book .market-actions{display:flex;align-items:center;flex:0 0 auto;gap:4px}
#book .market-actions .pill{min-height:30px;padding:5px 6px;border-radius:6px;font-size:10px;font-weight:600;white-space:nowrap}
#book .market-reference-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;padding-bottom:12px;border-bottom:1px solid var(--line);color:var(--sub);font-size:10px}
#book .market-reference-row .market-fx{display:block;min-width:0;min-height:15px;margin:0;font-size:inherit;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#book .market-pool-note{display:flex;align-items:center;flex:0 0 auto;gap:5px;white-space:nowrap;font-weight:400}
#book .market-book{margin-bottom:0}
#book .chartbox{margin:16px 0;padding:13px 0}
#dapp .dapp-intro h1{margin:4px 0 10px;font-size:20px;font-weight:700;letter-spacing:-.3px}
#dapp .dapp-intro p{margin:0 0 22px;font-size:13px;line-height:1.65;color:var(--sub)}
#dapp .dapp-search{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 12px;border:1px solid var(--blue);border-radius:7px;color:var(--sub);background:var(--bg)}
#dapp .dapp-search svg{width:21px;height:21px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8}
#dapp .dapp-search input{min-width:0;width:100%;height:44px;padding:0;border:0;outline:0;background:transparent;color:var(--txt);font-family:inherit;font-size:14px}
#dapp .dapp-search input::placeholder{color:var(--sub);opacity:1}
#dapp .dapp-search:focus-within{outline:2px solid var(--blue);outline-offset:2px}
#dapp .dapplist{display:flex;flex-direction:column;gap:9px;margin:16px 0}
#dapp .dapp-entry{display:flex;align-items:center;min-height:76px;border-radius:8px;background:var(--card2)}
#dapp .dappcard{display:flex;flex-direction:row;align-items:center;gap:13px;flex:1;min-width:0;width:auto;min-height:76px;padding:12px 16px;border:0;border-radius:8px;background:none;box-shadow:none;text-align:left;color:var(--txt);text-decoration:none}
#dapp .dappcard .dappic{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;padding:0;margin:0;border-radius:50%;background:var(--key);color:var(--on-key);font-family:Georgia,serif;font-size:30px;font-style:normal;font-weight:500}
#dapp .dappcard .dappic.logo{background:none;border-radius:0}
#dapp .dappic img{display:block;width:42px;height:42px;object-fit:contain}
#dapp .dappcard>b{font-size:15px;font-weight:500;line-height:1.5;overflow-wrap:anywhere}
#dapp .dappcard>small{font-size:10px;color:var(--sub);white-space:nowrap}
#dapp .dapp-favorite{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;margin-right:10px;padding:10px;border:0;border-radius:8px;background:none;color:var(--gold);cursor:pointer}
#dapp .dapp-favorite svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
#dapp .dapp-favorite[aria-pressed="true"] svg{fill:currentColor}
#dapp .dapp-favorite:focus-visible,#dapp .dappcard:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
#dapp .dapp-empty{padding:24px 0;text-align:center;color:var(--sub);font-size:13px}
@media(max-width:359px){
  #book .market-quote-row{gap:4px}
  #book .market-value b{font-size:17px}
  #book .market-value small{font-size:8px}
  #book .market-actions{gap:3px}
  #book .market-actions .pill{padding:5px 4px;font-size:9px}
  #book .market-topline{gap:6px}
  #book .market-caption h1{font-size:18px}
  #book .market-readonly{font-size:9px}
  #book .market-topline select{font-size:12px;padding-right:4px}
}


/* Compact market summary, dapp cards and account actions. */
#book .mid{flex-wrap:nowrap;gap:5px}
#book .mid b{flex:0 0 auto;font-size:clamp(16px,4.5vw,19px)}
#book .mid .krw{flex:0 0 auto;white-space:nowrap;font-size:clamp(9px,2.5vw,11px)}
#book #midNote{flex:0 1 auto;min-width:0;margin-left:auto;white-space:nowrap;font-size:clamp(8px,2.3vw,10px);overflow:hidden;text-overflow:ellipsis}
#dapp .dapp-entry,#dapp .dappcard{min-height:54px}
#dapp .dappcard{padding:9px 12px;gap:10px}
#dapp .dappcard .dappic{flex-basis:30px;width:30px;height:30px;font-size:23px}
#dapp .dappic img{width:30px;height:30px}
#dapp .dappcard>b{font-size:14px}
#dapp .dapp-favorite{margin-right:5px}
#acctList .acct-row{padding-bottom:6px}
#acctList .acct-inline{display:flex;align-items:center;gap:6px;padding:0 10px 10px;min-width:0}
#acctList .acct-inline .acct-addr{display:flex;align-items:center;gap:4px;flex:0 1 auto;min-width:0;min-height:30px;margin:0;padding:4px 7px;border:1px solid var(--line);border-radius:7px;background:var(--fg-a-03);color:var(--dim);font-family:ui-monospace,monospace;font-size:11px;cursor:pointer}
#acctList .acct-inline .acct-addr>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#acctList .acct-inline .acct-addr .cp{flex:none;font-style:normal;opacity:.6}
#acctList .acct-inline .acct-addr.copied{border-color:var(--key);color:var(--key-txt);background:var(--tint-blue)}
#acctList .acct-actions{flex:0 0 auto;gap:5px;padding:0;margin:0}
#acctList .acct-actions button{flex:0 0 auto;min-height:30px;margin:0;padding:4px 8px;border-radius:7px;font-size:11px;white-space:nowrap}
#acctList .acct-inline button:focus-visible{outline:2px solid var(--key);outline-offset:1px}
@media(max-width:359px){
  #acctList .acct-inline{gap:4px;padding-right:8px;padding-left:8px}
  #acctList .acct-inline .acct-addr{padding-right:5px;padding-left:5px;font-size:10px}
  #acctList .acct-actions{gap:4px}
  #acctList .acct-actions button{padding-right:6px;padding-left:6px;font-size:10px}
}

/* 다계정 지갑: 현재 연결 제목을 눌러 전체 계정을 연다. */
#acctShowAll{display:flex;align-items:center;justify-content:center;gap:6px;
  width:auto;min-height:36px;margin:-8px auto -6px;padding:6px 10px;
  border:0;border-radius:8px;background:transparent;color:var(--sub);
  font:inherit;font-size:13px;font-weight:800;cursor:pointer}
#acctShowAll.hidden{display:none}
#acctShowAll:hover{background:var(--tint-blue);color:var(--txt)}
#acctShowAll:focus-visible{outline:2px solid var(--key);outline-offset:2px}
