/* ==========================================================================
   CLAYNEXT APP - logged-in shell + shared components + New Order.
   Loads after nova.css (structure) and lumen.css (lm-* components) and cn-core.css (tokens).
   1  token remap (every --nv-* / --lm-* / --neu-* consumer gets the clay values)
   2  base
   3  shell: floating clay dock (launcher-grid nav + wallet tile), topbar tray
   4  mobile: drawer sheet, clay dock bottom nav (phones only)
   5  shared components (cards, buttons, inputs, tabs, tables, badges, lm-*)
   6  New Order: bento, step composer, receipt
   7  secondary widgets (favourites, deals, daily reward, lmMini, nudge)
   8  responsive
   ========================================================================== */

/* ---------- 1. token remap (on :root AND html.nv-dark so lumen's dark block never wins) ---------- */
:root,html.nv-dark{
  --nv-bg:var(--cn-ground); --nv-bg-2:var(--cn-ground-2);
  --nv-surface:var(--cn-card); --nv-surface-2:var(--cn-card-2); --nv-card:var(--cn-card);
  --nv-text:var(--cn-text); --nv-text-soft:var(--cn-soft); --nv-muted:var(--cn-muted);
  --nv-border:var(--cn-line); --nv-border-2:var(--cn-line);
  --nv-ok:var(--cn-ok); --nv-okbg:var(--cn-ok-bg); --nv-warn:var(--cn-warn); --nv-warnbg:var(--cn-warn-bg);
  --nv-bad:var(--cn-bad); --nv-badbg:var(--cn-bad-bg); --nv-info:var(--cn-info); --nv-infobg:var(--cn-info-bg);
  --nv-r:20px; --nv-r-sm:14px; --nv-r-lg:26px;
  --nv-sh:var(--cn-ring-sh-sm); --nv-sh-lg:var(--cn-ring-sh);
  --nv-sb:260px; --nv-tb:80px;
  --nv-font:var(--cn-f-ui);
  --lm-grad:var(--cn-grad); --lm-glow:var(--cn-btn-hi),3px 3px 0 var(--cn-drop); --lm-glass:var(--cn-card); --lm-ease:var(--cn-e-out);
  --neu-grad:var(--cn-grad); --neu-rise:var(--cn-ring-sh); --neu-rise-sm:var(--cn-ring-sh-sm);
  --neu-inset:inset 0 3px 0 rgba(42,35,64,.07),0 0 0 2px var(--cn-rim); --neu-inset-sm:inset 2px 2px 0 rgba(42,35,64,.14),0 0 0 2px var(--cn-rim);
  --btn-hi:var(--cn-btn-hi); --safe:var(--cn-ok); --danger:var(--cn-bad); --warn:var(--cn-warn);
}
html.nv-dark{--neu-inset:inset 0 3px 0 rgba(0,0,0,.25),0 0 0 2px var(--cn-rim);--neu-inset-sm:inset 2px 2px 0 rgba(0,0,0,.35),0 0 0 2px var(--cn-rim)}

/* ---------- 2. base ---------- */
html{overflow-x:clip}
html,body.nv{overflow-x:clip}
body.nv{font-family:var(--cn-f-ui);font-size:15px;color:var(--cn-text);background-color:var(--cn-ground);
  background-image:radial-gradient(var(--cn-dot) 1.3px,transparent 1.6px),radial-gradient(1000px 460px at 80% -180px,color-mix(in srgb,var(--cn-acc) 9%,transparent),transparent 70%);
  background-size:22px 22px,auto;background-attachment:fixed}
.nv h1,.nv h2,.nv h3,.nv h4{font-family:var(--cn-f-head);font-weight:600;letter-spacing:-.01em;color:var(--cn-text)}
.nv ::selection{background:color-mix(in srgb,var(--cn-acc) 26%,transparent)}
.nv ::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--cn-rim) 30%,transparent);border-radius:99px}
.pp-logo-dark{display:none}
body.nv .nv-content{animation:none;max-width:1360px;padding:6px 28px 44px}
body.nv :focus-visible{outline:3px solid color-mix(in srgb,var(--cn-acc) 60%,transparent);outline-offset:2px}
body.lmxpm-open{overflow:hidden}

/* ---------- 3. shell: floating clay dock ---------- */
body.nv .nv-sidebar{top:14px;left:14px;bottom:14px;width:calc(var(--nv-sb) - 30px);background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-right:var(--cn-bw) solid var(--cn-rim);border-radius:30px;
  box-shadow:var(--cn-hi),var(--cn-lo),6px 6px 0 var(--cn-drop);backdrop-filter:none;-webkit-backdrop-filter:none;overflow:visible}
body.nv .nv-brand{position:relative;padding:16px 16px 10px;gap:10px;font-family:var(--cn-f-head);font-weight:600;font-size:16.5px;line-height:1.15}
body.nv .cn-brand-a{display:flex;align-items:center;gap:10px;min-width:0;color:var(--cn-text);text-decoration:none}
body.nv .nv-brand img{max-height:38px;max-width:176px;display:block}
body.nv .cn-brand-ic{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:12px;border:2.5px solid var(--cn-rim);background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;font-size:16px;box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
body.nv .lm-drawer-x{display:none}
body.nv .lm-collapse-btn{right:-16px;top:22px;width:32px;height:32px;border:2.5px solid var(--cn-rim);background:var(--cn-card);color:var(--cn-text);box-shadow:2px 2px 0 var(--cn-drop);font-size:12px;z-index:2}
body.nv .lm-collapse-btn:hover{color:var(--cn-acc-text)}

/* wallet tile */
/* the dock wallet is deep-ink clay; the accent stays reserved for actions + the dashboard hero tile */
body.nv .lm-side-balance{--cn-wal:#2A2340;margin:4px 12px 12px;padding:14px 14px 12px;border:var(--cn-bw) solid var(--cn-rim);border-radius:22px;background:linear-gradient(180deg,color-mix(in srgb,var(--cn-wal) 86%,#fff),var(--cn-wal) 60%);color:#FFF6E9;box-shadow:inset 0 2px 0 rgba(255,255,255,.14),inset 0 -4px 0 rgba(0,0,0,.25),4px 4px 0 var(--cn-drop);overflow:hidden}
html.nv-dark body.nv .lm-side-balance{--cn-wal:#3B3254}
body.nv .lm-side-balance::after{top:auto;bottom:-58px;right:-44px;width:120px;height:120px;background:rgba(255,255,255,.12)}
body.nv .lm-side-balance .l{font-size:11.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;opacity:.95;display:flex;align-items:center;gap:7px}
body.nv .lm-side-balance .v{font-family:var(--cn-f-head);font-weight:600;font-size:27px;line-height:1.08;letter-spacing:-.01em;margin:6px 0 11px;word-break:normal;overflow-wrap:anywhere}
body.nv .lm-side-balance>a{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 14px;border:2.5px solid var(--cn-rim);border-radius:13px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;font-family:var(--cn-f-head);font-weight:600;font-size:14.5px;box-shadow:2px 2px 0 var(--cn-drop);position:relative;z-index:1}
body.nv .lm-side-balance>a:active{transform:translate(2px,2px);box-shadow:none}
body.nv .lm-xp{margin-top:12px;padding-top:11px;border-top:2px dashed rgba(255,246,233,.28);position:relative;cursor:pointer}
body.nv .lm-xp-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
body.nv .lm-xp-lvl{font-size:13px;font-weight:900;color:#FFF6E9;display:flex;align-items:center;gap:6px;white-space:nowrap}
body.nv .lm-xp-badge{font-size:9.5px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#221B35;background:#FFEDA3;border:2px solid var(--cn-rim);padding:2px 8px;border-radius:99px;white-space:nowrap}
body.nv .lm-xp-bar{height:12px;border-radius:99px;background:rgba(0,0,0,.28);border:2px solid rgba(255,246,233,.35);overflow:hidden;position:relative}
body.nv .lm-xp-bar>span{display:block;height:100%;border-radius:99px;background:#FFEDA3;transition:width 1s var(--cn-e-out)}
body.nv .lm-xp-meta{display:flex;justify-content:space-between;gap:8px;margin-top:6px;font-size:10.5px;font-weight:800;color:rgba(255,246,233,.82)}
body.nv .lm-xp-more{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:9px;min-height:32px;padding:0 10px;border:2px solid rgba(255,246,233,.35);border-radius:11px;background:rgba(255,246,233,.1);color:#FFF6E9;font:800 12px var(--cn-f-ui);letter-spacing:0;white-space:nowrap;cursor:pointer}
body.nv .lm-xp-more:hover{background:rgba(255,255,255,.26)}
body.nv .lm-xp-float{position:absolute;top:6px;right:2px;font-size:12px;font-weight:900;color:#fff;pointer-events:none;animation:cnXpFloat 1.6s ease-out forwards}
@keyframes cnXpFloat{0%{opacity:0;transform:translateY(8px)}18%{opacity:1}100%{opacity:0;transform:translateY(-22px)}}
.cn-medal{font-size:13px}
.cn-medal.m-bronze{color:#E8A06A}.cn-medal.m-silver{color:#E3E6EE}.cn-medal.m-gold{color:#FFD24A}.cn-medal.m-plat{color:#BDEBFF}.cn-medal.m-acc{color:#fff}
.lmxpm-ov .cn-medal.m-bronze{color:#B8651E}.lmxpm-ov .cn-medal.m-silver{color:#8C95A8}.lmxpm-ov .cn-medal.m-gold{color:#C99700}.lmxpm-ov .cn-medal.m-plat{color:#3E8FB8}

/* XP modal */
.lmxpm-ov{position:fixed;inset:0;z-index:99999;background:rgba(27,23,38,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.lmxpm-ov[hidden]{display:none}
.lmxpm-box{width:100%;max-width:440px;max-height:88vh;display:flex;flex-direction:column;background:var(--cn-card);color:var(--cn-text);border:var(--cn-bw) solid var(--cn-rim);border-radius:28px;box-shadow:8px 8px 0 var(--cn-drop);overflow:hidden;animation:cnPop .2s var(--cn-e-out)}
@keyframes cnPop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.lmxpm-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;border-bottom:var(--cn-bw) solid var(--cn-rim)}
.lmxpm-hd-l{display:flex;align-items:center;gap:12px}
.lmxpm-hd-badge{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:var(--cn-card);border:2.5px solid var(--cn-rim);font-size:22px}
.lmxpm-hd-badge .cn-medal{font-size:22px}
.lmxpm-hd-lv{font-family:var(--cn-f-head);font-size:20px;font-weight:600}
.lmxpm-hd-bn{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;opacity:.95}
.lmxpm-x{width:36px;height:36px;flex:none;border-radius:12px;border:2px solid var(--cn-rim);background:var(--cn-card);color:var(--cn-text);cursor:pointer}
.lmxpm-prog{padding:14px 18px 4px}
.lmxpm-pbar{height:14px;border-radius:99px;background:var(--cn-card-2);border:2px solid var(--cn-rim);overflow:hidden}
.lmxpm-pbar>span{display:block;height:100%;border-radius:99px;background:var(--cn-grad);background-color:var(--cn-acc)}
.lmxpm-pt{margin-top:7px;font-size:12.5px;font-weight:800;color:var(--cn-muted)}
.lmxpm-note{display:flex;align-items:center;gap:8px;margin:8px 18px 2px;padding:10px 12px;border-radius:14px;background:var(--p-lemon);border:2px solid var(--cn-rim);color:var(--cn-text);font-size:12px;font-weight:700;line-height:1.4}
.lmxpm-note i{color:var(--p-lemon-d)}
.lmxpm-list{overflow-y:auto;padding:12px 14px 16px;display:flex;flex-direction:column;gap:7px}
.lmxpm-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:var(--cn-card-2);border:2px solid var(--cn-line)}
.lmxpm-row.done{background:var(--cn-ok-bg)}
.lmxpm-row.cur{border-color:var(--cn-rim);box-shadow:2px 2px 0 var(--cn-drop)}
.lmxpm-lv{display:flex;align-items:center;gap:6px;min-width:92px;font-size:13px;font-weight:900}
.lmxpm-rw{flex:1;font-size:13px;font-weight:700}
.lmxpm-row.done .lmxpm-st{color:var(--cn-ok)}
.lmxpm-row:not(.done) .lmxpm-st{color:var(--cn-muted)}

/* launcher-grid nav: chunky icon tiles with labels */
body.nv .nv-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-content:start;padding:4px 12px 12px;overflow-y:auto;overscroll-behavior:contain}
body.nv .nv-nav-group{grid-column:1/-1;padding:6px 4px 0;font-size:10.5px;font-weight:900;letter-spacing:.12em;color:var(--cn-muted)}
body.nv .nv-nav a,body.nv .nv-nav .nv-sub-t{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:80px;margin:0;padding:10px 6px 9px;border:2.5px solid var(--cn-line);border-radius:18px;background:var(--cn-card-2);color:var(--cn-soft);font-size:12px;font-weight:800;line-height:1.15;text-align:center;transition:background-color .12s,border-color .12s,color .12s}
body.nv .nv-nav a:hover{transform:none;background:var(--cn-card);border-color:var(--cn-rim);color:var(--cn-text)}
body.nv .nv-nav a>span:not(.nv-nbadge){overflow-wrap:anywhere;hyphens:auto}
body.nv .nv-nav a>i:first-child{width:38px;height:38px;display:grid;place-items:center;flex:none;border-radius:12px;border:2px solid var(--cn-rim);font-size:16px;opacity:1;box-shadow:var(--cn-hi),2px 2px 0 var(--cn-drop);background:var(--p-peach);color:var(--p-peach-d)}
body.nv .nv-nav>a:nth-of-type(6n+2)>i:first-child,body.nv .nv-sub-m>a:nth-of-type(6n+2)>i:first-child{background:var(--p-blue);color:var(--p-blue-d)}
body.nv .nv-nav>a:nth-of-type(6n+3)>i:first-child,body.nv .nv-sub-m>a:nth-of-type(6n+3)>i:first-child{background:var(--p-mint);color:var(--p-mint-d)}
body.nv .nv-nav>a:nth-of-type(6n+4)>i:first-child,body.nv .nv-sub-m>a:nth-of-type(6n+4)>i:first-child{background:var(--p-pink);color:var(--p-pink-d)}
body.nv .nv-nav>a:nth-of-type(6n+5)>i:first-child,body.nv .nv-sub-m>a:nth-of-type(6n+5)>i:first-child{background:var(--p-lilac);color:var(--p-lilac-d)}
body.nv .nv-nav>a:nth-of-type(6n)>i:first-child,body.nv .nv-sub-m>a:nth-of-type(6n)>i:first-child{background:var(--p-lemon);color:var(--p-lemon-d)}
body.nv .nv-nav a.active{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;border-color:var(--cn-rim);box-shadow:var(--cn-btn-hi),3px 3px 0 var(--cn-drop)}
body.nv .nv-nav a.active::before{content:none}
body.nv .nv-nav a.active>i:first-child{background:var(--cn-card)!important;color:var(--cn-acc-text)!important}
body.nv .nv-nav a .nv-nbadge{position:absolute;top:5px;right:5px;margin:0;min-width:22px;height:22px;padding:0 6px;border-radius:99px;border:2px solid var(--cn-rim);background:var(--p-lemon);color:var(--cn-text);font-size:11px;font-weight:900;line-height:18px;box-shadow:none}
body.nv .nv-nav a.active .nv-nbadge{background:var(--cn-card);color:var(--cn-text)}
body.nv .nv-sub{grid-column:1/-1}
body.nv .nv-nav .nv-sub-t{flex-direction:row;justify-content:flex-start;min-height:56px;padding:8px 12px;cursor:pointer}
body.nv .nv-sub-ar{margin-left:auto;font-size:11px;opacity:.7;transition:transform .2s}
body.nv .nv-sub.open>.nv-sub-t .nv-sub-ar{transform:rotate(180deg)}
body.nv .nv-sub-m{display:none}
body.nv .nv-sub.open>.nv-sub-m{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}
body.nv .nv-side-foot{padding:10px 16px 14px;border-top:2px dashed var(--cn-line);font-size:12px;font-weight:700;color:var(--cn-muted)}

/* topbar: big title + one clay control tray */
body.nv .nv-shell{margin-left:var(--nv-sb)}
body.nv .nv-topbar{height:var(--nv-tb);padding:0 28px 0 18px;gap:14px;background:color-mix(in srgb,var(--cn-ground) 90%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:0}
body.nv .nv-page-title{font-family:var(--cn-f-head);font-weight:600;font-size:27px;letter-spacing:-.015em;color:var(--cn-text)}
body.nv .nv-top-right{gap:6px;padding:5px;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:20px;box-shadow:var(--cn-hi),3px 3px 0 var(--cn-drop)}
body.nv .nv-top-right>.nv-btn{border-radius:14px}
body.nv .nv-icon-btn,body.nv .nv-topbar .nv-pill{width:44px;height:44px;border-radius:14px;border:2px solid var(--cn-line);background:var(--cn-card-2);color:var(--cn-text);font-size:15px;transition:background-color .12s,border-color .12s}
body.nv .nv-topbar .nv-pill{width:auto;padding:0 12px;gap:7px;font-weight:900;font-size:13.5px}
body.nv .nv-icon-btn:hover,body.nv .nv-topbar .nv-pill:hover{transform:none;border-color:var(--cn-rim);color:var(--cn-text)}
body.nv .nv-icon-btn:active,body.nv .nv-topbar .nv-pill:active{transform:translate(1px,1px)}
body.nv .nv-topbar .nv-cur-hl{background:var(--cn-grad);background-color:var(--cn-acc);border:2.5px solid var(--cn-rim);color:#fff;box-shadow:var(--cn-btn-hi);animation:none}
body.nv .nv-topbar .nv-cur-hl i{color:#fff;opacity:1}
body.nv .nv-topbar .nv-cur-hl .cn-car{font-size:10px}
body.nv .cn-av{display:grid;place-items:center;width:100%;height:100%;border-radius:11px;background:var(--p-lilac);color:var(--p-lilac-d);font-family:var(--cn-f-head);font-weight:600;font-size:17px}
body.nv .cn-acc-btn{overflow:hidden;padding:0}
body.nv .nv-dd-menu{top:58px;padding:8px;border:var(--cn-bw) solid var(--cn-rim);border-radius:20px;background:var(--cn-card);box-shadow:5px 5px 0 var(--cn-drop)}
body.nv .nv-dd-menu a{border-radius:12px;font-weight:800;color:var(--cn-soft)}
body.nv .nv-dd-menu a:hover{background:var(--cn-card-2);color:var(--cn-text)}
body.nv .nv-dd-menu a i{width:18px;text-align:center;color:var(--cn-muted)}
body.nv .cn-dd-h{padding:6px 10px 8px;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--cn-muted)}
body.nv .cn-dd-news{display:block!important;padding:10px 12px!important}
body.nv .cn-dd-news b{display:block;font-size:13.5px;color:var(--cn-text);line-height:1.4}
body.nv .cn-dd-news span{font-size:11.5px;color:var(--cn-muted)}
body.nv .cn-dd-empty{padding:12px;color:var(--cn-muted);font-size:13px;font-weight:700}
body.nv .cn-dd-user{display:flex;align-items:center;gap:10px;padding:8px 10px 12px;margin-bottom:6px;border-bottom:2px dashed var(--cn-line)}
body.nv .cn-dd-user .cn-av{width:40px;height:40px;flex:none;border:2px solid var(--cn-rim);border-radius:13px}
body.nv .cn-dd-user b{display:block;font-weight:900;font-size:14.5px;color:var(--cn-text)}
body.nv .cn-dd-user small{display:block;font-size:12px;color:var(--cn-muted);overflow-wrap:anywhere}
body.nv .nv-dd-menu a.cn-dd-out,body.nv .nv-dd-menu a.cn-dd-out i{color:var(--cn-bad)}
body.nv .nv-dd-menu .currencies-item{font-weight:900}

/* desktop collapsed dock (lumen owns the class; scoped to >=861 so it can never leak onto phones) */
@media (min-width:861px){
  body.nv.lm-collapsed .nv-sidebar{width:92px}
  body.nv.lm-collapsed .nv-shell{margin-left:120px}
  body.nv.lm-collapsed .nv-nav{grid-template-columns:minmax(0,1fr);padding:4px 10px 10px}
  body.nv.lm-collapsed .nv-nav a{min-height:58px;padding:8px}
  body.nv.lm-collapsed .nv-nav a>span:not(.nv-nbadge){display:none}
  body.nv.lm-collapsed .nv-nav a i{width:38px}
  body.nv.lm-collapsed .nv-sub.open>.nv-sub-m{grid-template-columns:minmax(0,1fr)}
  body.nv.lm-collapsed .nv-brand{justify-content:center;padding:16px 8px 10px}
  body.nv.lm-collapsed .nv-brand img{max-width:56px}
}

/* ---------- 4. mobile: drawer sheet + clay dock bottom nav ---------- */
@media (max-width:860px){
  body.nv .nv-sidebar{top:10px;left:10px;bottom:10px;width:min(86vw,340px);border-radius:28px;transform:translateX(calc(-100% - 24px));visibility:hidden;transition:transform .26s var(--cn-e-out),visibility 0s linear .26s;z-index:60}
  body.nv.nv-drawer .nv-sidebar{transform:none;visibility:visible;transition:transform .26s var(--cn-e-out);box-shadow:var(--cn-hi),var(--cn-lo),6px 6px 0 var(--cn-drop)}
  body.nv.nv-drawer{overflow:hidden}
  body.nv .nv-scrim{background:rgba(27,23,38,.5);z-index:55}
  body.nv.nv-drawer .nv-scrim{z-index:59}
  body.nv.nv-drawer #drFab,body.nv.nv-drawer #swBtn,body.nv.nv-drawer #swPanel{visibility:hidden}
  body.nv .lm-collapse-btn{display:none}
  body.nv .lm-drawer-x{display:grid;place-items:center;margin-left:auto;width:44px;height:44px;flex:none;border-radius:14px;border:2.5px solid var(--cn-rim);background:var(--cn-card);color:var(--cn-text);font-size:18px;cursor:pointer;box-shadow:2px 2px 0 var(--cn-drop)}
  body.nv .nv-brand{padding:14px 14px 10px}
  body.nv .nv-brand img{max-width:190px;max-height:40px}
  body.nv .nv-nav{grid-template-columns:repeat(3,minmax(0,1fr))}
  body.nv .nv-sub.open>.nv-sub-m{grid-template-columns:repeat(3,minmax(0,1fr))}
  body.nv .nv-shell{margin-left:0}
  body.nv .nv-topbar{height:68px;padding:0 12px;gap:10px}
  body.nv .nv-burger{display:grid;place-items:center;width:46px;height:46px;flex:none;border-radius:15px;border:2.5px solid var(--cn-rim);background:var(--cn-card);color:var(--cn-text);font-size:18px;box-shadow:var(--cn-hi),3px 3px 0 var(--cn-drop)}
  body.nv .nv-burger:active{transform:translate(2px,2px);box-shadow:var(--cn-sh-press)}
  body.nv .nv-page-title{font-size:21px}
  body.nv .nv-top-right{gap:3px;padding:3px;border-width:2.5px;border-radius:17px}
  body.nv .nv-icon-btn,body.nv .nv-topbar .nv-pill{width:42px;height:42px;border-radius:13px}
  body.nv .nv-topbar .nv-pill{width:auto;padding:0 10px}
  body.nv .nv-topbar .nv-cur-hl .cn-car,body.nv .nv-topbar .nv-cur-hl .fa-coins{display:none}
  body.nv .nv-dd-menu{top:62px}
  body.nv main.nv-content{padding:6px 14px 40px}
}
@media (max-width:560px){
  body.nv .nv-dd-menu{top:72px;left:10px;right:10px}
}
@media (max-width:380px){
  body.nv .nv-page-title{font-size:18px}
  .cn-stat:not(.cn-lvl){grid-template-columns:minmax(0,1fr);grid-template-areas:"c" "k" "v"}
  .cn-stat:not(.cn-lvl) .cn-coin{margin-bottom:4px}
}
@media (max-width:374px){ body.nv .nv-page-title{display:none} body.nv .nv-top-right{margin-left:auto} }
/* the clay dock only lives on phones (<=700); tablets use the drawer only */
@media (min-width:701px){ body.nv .nv-bottomnav{display:none!important} }
@media (max-width:700px){
  body.nv main.nv-content{padding-bottom:calc(118px + env(safe-area-inset-bottom))}
  body.nv .nv-bottomnav{display:flex;align-items:flex-end;gap:4px;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));padding:7px;border:var(--cn-bw) solid var(--cn-rim);border-radius:26px;background:var(--cn-card);box-shadow:var(--cn-hi),var(--cn-lo),4px 4px 0 var(--cn-drop);backdrop-filter:none;-webkit-backdrop-filter:none;z-index:58}
  body.nv .nv-bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;padding:6px 2px;border:2px solid transparent;border-radius:17px;color:var(--cn-muted);font-size:10.5px;font-weight:900;letter-spacing:.01em}
  body.nv .nv-bottomnav a i{font-size:18px}
  body.nv .nv-bottomnav a span{white-space:nowrap}
  body.nv .nv-bottomnav a.active{background:var(--p-lemon);border-color:var(--cn-rim);color:var(--cn-text)}
  body.nv .nv-bottomnav a.active::after{content:none}
  body.nv .nv-bottomnav .nv-bn-plus{flex:0 0 64px;height:64px;min-height:64px;margin:-30px 2px 0;padding:0;border:var(--cn-bw) solid var(--cn-rim);border-radius:22px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;box-shadow:var(--cn-btn-hi),4px 4px 0 var(--cn-drop);transform:rotate(-4deg)}
  body.nv .nv-bottomnav .nv-bn-plus i{font-size:24px}
  body.nv .nv-bottomnav .nv-bn-plus.active{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff}
  body.nv .nv-bottomnav .nv-bn-plus:active{transform:rotate(-4deg) translate(3px,3px);box-shadow:var(--cn-sh-press)}
  body.nv #swBtn{bottom:calc(98px + env(safe-area-inset-bottom))}
}

/* ---------- 5. shared components (reach orders / services / addfunds / account / tickets) ---------- */
body.nv .nv-card,body.nv .lm-card{background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:24px;box-shadow:var(--cn-hi),var(--cn-lo),5px 5px 0 var(--cn-drop);padding:22px}
body.nv .nv-card-h h3{font-family:var(--cn-f-head);font-weight:600;font-size:20px}
body.nv .nv-card-h>i,body.nv .nv-card-h .ic{color:var(--cn-acc-text)}
body.nv .nv-card-h .sub{color:var(--cn-muted);font-weight:600}
body.nv .nv-btn{min-height:46px;height:auto;padding:0 20px;border:var(--cn-bw) solid var(--cn-rim);border-radius:15px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;font-family:var(--cn-f-head);font-weight:600;font-size:15.5px;letter-spacing:.005em;box-shadow:var(--cn-btn-hi),3px 3px 0 var(--cn-drop);transition:transform .12s var(--cn-e-out),box-shadow .12s var(--cn-e-out);overflow:visible}
body.nv .nv-btn:hover{transform:none;filter:none}
body.nv .nv-btn:active{transform:translate(2px,2px);box-shadow:var(--cn-sh-press)}
body.nv .nv-btn.ghost,body.nv .nv-btn.soft{background:var(--cn-card);color:var(--cn-text);border-color:var(--cn-rim);box-shadow:var(--cn-hi),3px 3px 0 var(--cn-drop)}
body.nv .nv-btn.soft{background:var(--cn-acc-soft);color:var(--cn-acc-ink)}
body.nv .nv-btn.danger{background:var(--cn-bad);background-image:none;color:#fff}
html.nv-dark body.nv .nv-btn.danger{background:#C62D2D}
body.nv .nv-btn.sm{min-height:36px;padding:0 13px;border-width:2.5px;border-radius:12px;font-size:13.5px;box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .nv-btn.block{width:100%}
.nv a.nv-btn{color:#fff}
.nv a.nv-btn.ghost,.nv a.nv-btn.ghost:hover{color:var(--cn-text)}
.nv a.nv-btn.soft{color:var(--cn-acc-ink)}
body.nv .btn-primary,body.nv .btn-big-primary{border:var(--cn-bw) solid var(--cn-rim)!important;border-radius:16px!important;background:var(--cn-grad)!important;background-color:var(--cn-acc)!important;color:#fff!important;font-family:var(--cn-f-head);font-weight:600;box-shadow:var(--cn-btn-hi),4px 4px 0 var(--cn-drop)!important}

body.nv .nv-input,body.nv .nv-select,body.nv .nv-textarea,body.nv .form-control,
body.nv #addfunds_fields input:not([type=checkbox]):not([type=radio]),body.nv #addfunds_fields select,body.nv #addfunds_fields textarea{
  min-height:50px;border:2.5px solid var(--cn-rim);border-radius:15px;background:var(--cn-field);color:var(--cn-text);font:600 15px var(--cn-f-ui);box-shadow:inset 0 3px 0 rgba(42,35,64,.06)}
body.nv .nv-textarea,body.nv textarea.form-control{min-height:110px}
body.nv .nv-input:focus,body.nv .nv-select:focus,body.nv .nv-textarea:focus,body.nv .form-control:focus,body.nv #addfunds_fields input:focus{border-color:var(--cn-acc);box-shadow:inset 0 3px 0 rgba(42,35,64,.06),0 0 0 4px color-mix(in srgb,var(--cn-acc) 22%,transparent)}
body.nv .nv-label,body.nv .control-label{font-weight:800;color:var(--cn-soft)}
body.nv .nv-hint{color:var(--cn-muted);font-weight:600}
body.nv .nv-chip{border:2.5px solid var(--cn-rim);border-radius:14px;background:var(--cn-card);font-weight:800;box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .nv-chip.active{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff}
body.nv .nv-tabs{padding:5px;background:var(--cn-ground-2);border:2.5px solid var(--cn-rim);border-radius:18px}
body.nv .nv-tab{border:2.5px solid transparent;border-radius:13px;font-family:var(--cn-f-head);font-weight:600;color:var(--cn-soft)}
body.nv .nv-tab.active{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;border-color:var(--cn-rim);box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
body.nv .nv-badge{border:2px solid currentColor;font-weight:900}
body.nv .nv-alert{border:2.5px solid currentColor;border-radius:16px;font-weight:800}
body.nv .nv-table-wrap{border:var(--cn-bw) solid var(--cn-rim);border-radius:22px;background:var(--cn-card);box-shadow:4px 4px 0 var(--cn-drop)}
body.nv .nv-table th{background:var(--cn-card-2);font-size:11px;font-weight:900;letter-spacing:.08em;color:var(--cn-muted);border-bottom:2.5px solid var(--cn-rim)}
body.nv .nv-table td{border-bottom:1.5px dashed var(--cn-line);color:var(--cn-soft)}
body.nv .nv-table tbody tr:hover td{background:var(--cn-card-2)}
@media (max-width:860px){
  body.nv .nv-table-wrap{border:0;background:none;box-shadow:none}
  body.nv .nv-table tr{border:var(--cn-bw) solid var(--cn-rim);border-radius:20px;box-shadow:4px 4px 0 var(--cn-drop)}
}
body.nv .lm-hero h1{font-size:30px}
body.nv .lm-profile{border:var(--cn-bw) solid var(--cn-rim);border-radius:28px;background:var(--cn-grad);background-color:var(--cn-acc);box-shadow:var(--cn-btn-hi),5px 5px 0 var(--cn-drop)}
body.nv .lm-profile{color:#fff}
body.nv .lm-profile .nm{color:#fff}
body.nv .lm-profile .em{color:rgba(255,255,255,.9)}
body.nv .lm-profile .av{border:2.5px solid var(--cn-rim);background:var(--cn-card);color:var(--cn-acc-text);border-radius:20px;font-family:var(--cn-f-head)}
body.nv .lm-profile .nm{font-family:var(--cn-f-head);font-weight:600;font-size:22px}
body.nv .lm-theme-seg{padding:5px;background:var(--cn-ground-2);border:2.5px solid var(--cn-rim);border-radius:17px}
body.nv .lm-theme-seg button{border:2px solid transparent;border-radius:12px;font-weight:800}
body.nv .lm-theme-seg button.on{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;border-color:var(--cn-rim);box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .lm-pay{border:2.5px solid var(--cn-rim);border-radius:18px;background:var(--cn-card);font-weight:800;box-shadow:3px 3px 0 var(--cn-drop)}
body.nv .lm-pay:hover{transform:none}
body.nv .lm-pay.active{background:var(--p-lemon);border-color:var(--cn-rim);box-shadow:inset 0 3px 0 rgba(0,0,0,.08),1px 1px 0 var(--cn-drop);transform:translate(2px,2px)}
body.nv .lm-pay .ck{border:2px solid var(--cn-rim)}
body.nv .lm-pay.active .ck{background:var(--cn-acc);border-color:var(--cn-rim)}
body.nv .lm-tl-item::before{border-color:var(--cn-acc);background:var(--cn-card)}
body.nv .lm-empty .ic{border:2.5px solid var(--cn-rim);background:var(--p-lilac);color:var(--p-lilac-d);box-shadow:3px 3px 0 var(--cn-drop)}
body.nv .lm-code{border:var(--cn-bw) solid var(--cn-rim);border-radius:18px;box-shadow:4px 4px 0 var(--cn-drop)}
body.nv .lm-msg.me .bub{background:var(--cn-grad);background-color:var(--cn-acc);border:2px solid var(--cn-rim);box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .lm-msg.them .bub{background:var(--cn-card-2);border:2px solid var(--cn-rim)}
body.nv .svc-cat-ic{width:40px;height:40px;flex:none;border-radius:13px;display:grid;place-items:center;background:var(--cn-grad);background-color:var(--cn-acc);border:2.5px solid var(--cn-rim);color:#fff;margin-right:10px;box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
body.nv .svc-cat-ic i{font-size:18px!important;line-height:1}
body.nv .svc-cat-ic img{width:22px;height:22px;object-fit:contain;border-radius:5px;display:block}
body.nv .svc-head h1,body.nv .ord-top h2{font-family:var(--cn-f-head);font-weight:600;font-size:30px}
body.nv .svc-head h1 i{color:var(--cn-acc-text)}
body.nv .ord-filters{background:transparent}
body.nv .ord-filters a{border:2.5px solid var(--cn-rim);box-shadow:2px 2px 0 var(--cn-drop);color:var(--cn-soft)}
body.nv .ord-filters a.active{color:#fff;box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
body.nv .ord-card{border-radius:22px}
body.nv .ost{border:2px solid currentColor;box-shadow:none}
body.nv .lm-prog{height:12px;border:2px solid var(--cn-rim);box-shadow:none;background:var(--cn-card-2)}
/* dark: accent-coloured TEXT on plum is ~3:1 - lift it (the admin accent itself is untouched) */
html.nv-dark body.nv .ord-svc .svc-l,html.nv-dark body.nv .ord-dl .v a,html.nv-dark body.nv .svc-sid,html.nv-dark body.nv .nv-cms a,html.nv-dark body.nv .svc-rate,html.nv-dark body.nv .ord-id .api{color:var(--cn-acc-lit)}
html.nv-dark body.nv .ord-id .api{background:color-mix(in srgb,var(--cn-acc) 30%,var(--cn-card));color:#fff}
html.nv-dark body.nv .fa-tiktok[style*="#0"],html.nv-dark body.nv .fa-x-twitter[style*="#0"],html.nv-dark body.nv .fa-threads[style*="#0"]{color:var(--cn-text)!important}

/* content pages (blog / smm-api / cms) render their .pubx vocabulary inside this shell: wide tables scroll inside their card, never the page */
body.nv .pubx-table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- 9. page kit (every redesigned page is composed from these) ---------- */
body.nv .cn-btn{color:var(--cn-text)} body.nv .cn-btn.pri,body.nv .cn-btn.pri i{color:#fff}
body.nv .cn-btn.sm{min-height:40px;padding:0 14px;font-size:14px;border-width:2.5px;border-radius:13px;box-shadow:var(--cn-hi),2px 2px 0 var(--cn-drop)}
body.nv .cn-btn.danger{background:var(--cn-bad-bg);color:var(--cn-bad)}
body.nv .cn-btn.good{background:var(--cn-ok-bg);color:var(--cn-ok)}
body.nv .cn-btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
.cn-ph{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 22px}
.cn-ph-ic{width:58px;height:58px;border-radius:19px;font-size:24px;border-width:2.5px;transform:rotate(-6deg);box-shadow:var(--cn-hi),3px 3px 0 var(--cn-drop)}
.cn-ph-t{min-width:0;flex:1 1 260px}
body.nv .cn-ph-t h1{margin:0;font-size:32px;line-height:1.08}
.cn-ph-t p{margin:5px 0 0;color:var(--cn-muted);font-size:14.5px;font-weight:600}
.cn-ph-act{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-left:auto}
.cn-card{min-width:0;padding:22px;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:26px;box-shadow:var(--cn-hi),var(--cn-lo),5px 5px 0 var(--cn-drop)}
.cn-card-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px}
.cn-card-h .cn-coin{width:42px;height:42px;font-size:17px}
body.nv .cn-card-h h2,body.nv .cn-card-h h3{margin:0;font-size:21px;line-height:1.15}
.cn-card-h .sub{color:var(--cn-muted);font-size:13px;font-weight:600}
.cn-card-h .end{margin-left:auto}
.cn-cols{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px;align-items:start}
.cn-cols.even{grid-template-columns:repeat(2,minmax(0,1fr))}
.cn-cols.side{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}
.cn-stack{display:flex;flex-direction:column;gap:22px;min-width:0}
.cn-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;margin:0 0 22px}
.cn-tile{display:flex;align-items:center;gap:14px;min-width:0;padding:16px 18px;border:var(--cn-bw) solid var(--cn-rim);border-radius:24px;box-shadow:var(--cn-hi),var(--cn-lo),4px 4px 0 var(--cn-drop)}
.cn-tile .cn-coin{width:46px;height:46px;background:var(--cn-card);color:inherit}
.cn-tile .k{display:block;font-size:11.5px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.cn-tile .v{display:block;margin-top:2px;font-family:var(--cn-f-head);font-weight:600;font-size:27px;line-height:1.1;color:var(--cn-text);overflow-wrap:anywhere}
.cn-tile.ink{background:linear-gradient(180deg,#3a3152,#2A2340 60%);color:#FFEDA3}
.cn-tile.ink .v{color:#FFF6E9}
.cn-tile.ink .cn-coin{background:#FFEDA3;color:#2A2340}
html.nv-dark .cn-tile.ink{background:linear-gradient(180deg,#4a4066,#3B3254 60%)}
.cn-chips{display:flex;gap:9px;flex-wrap:wrap}
body.nv .cn-chip{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 16px;border:2.5px solid var(--cn-rim);border-radius:999px;background:var(--cn-card);color:var(--cn-soft);font-weight:900;font-size:13.5px;white-space:nowrap;text-decoration:none;box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .cn-chip:hover{color:var(--cn-text);background:var(--cn-card-2)}
body.nv .cn-chip.on,body.nv .cn-chip.active{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
.cn-pager{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:24px}
body.nv .cn-pager a{min-width:44px;height:44px;display:inline-grid;place-items:center;padding:0 12px;border:2.5px solid var(--cn-rim);border-radius:14px;background:var(--cn-card);color:var(--cn-text);font-weight:900;text-decoration:none;box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .cn-pager a.on{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff}
body.nv .cn-pager a:active{transform:translate(2px,2px);box-shadow:none}
.cn-empty{text-align:center;padding:34px 16px;color:var(--cn-muted);font-weight:600;font-size:14px}
.cn-empty .cn-coin{width:74px;height:74px;margin:0 auto 14px;font-size:30px;border-radius:23px;border-width:2.5px;transform:rotate(-6deg)}
.cn-empty .t{display:block;margin-bottom:4px;font:600 19px var(--cn-f-head);color:var(--cn-text)}
.cn-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border:2px solid currentColor;border-radius:99px;font-size:12px;font-weight:900;white-space:nowrap}
.cn-pill.ok{background:var(--cn-ok-bg);color:var(--cn-ok)}.cn-pill.warn{background:var(--cn-warn-bg);color:var(--cn-warn)}
.cn-pill.info{background:var(--cn-info-bg);color:var(--cn-info)}.cn-pill.bad{background:var(--cn-bad-bg);color:var(--cn-bad)}
.cn-pill.mut{background:var(--cn-card-2);color:var(--cn-muted)}
.cn-note{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:2px solid var(--cn-rim);border-radius:16px;background:var(--p-lemon);color:var(--cn-text);font-size:13.5px;font-weight:700;line-height:1.5}
.cn-note i{color:var(--p-lemon-d);margin-top:3px}
body.nv .nv-hint.cn-note{color:var(--cn-text)}
.cn-field{margin-bottom:16px}
.cn-lbl,.cn-field>label{display:block;margin-bottom:7px;font:800 13.5px var(--cn-f-ui);color:var(--cn-soft)}
.cn-lbl .opt,.cn-field>label .opt{font-weight:600;color:var(--cn-muted)}
body.nv .cn-drop{display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 14px;border:2.5px dashed var(--cn-rim);border-radius:16px;background:var(--cn-card-2);color:var(--cn-soft);font-size:14px;font-weight:800;cursor:pointer}
body.nv .cn-drop:hover{background:var(--cn-card)}
body.nv .cn-drop i{color:var(--cn-acc-text)}
.cn-kv{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:11px 0;font-size:14px}
.cn-kv+.cn-kv{border-top:1.5px dotted color-mix(in srgb,var(--cn-rim) 35%,transparent)}
.cn-kv .k{color:var(--cn-muted);font-weight:700}
.cn-kv .v{color:var(--cn-text);font-weight:900;text-align:right;overflow-wrap:anywhere}
.cn-mono{font-family:ui-monospace,Menlo,Consolas,monospace}
@media (max-width:1100px){.cn-cols,.cn-cols.even,.cn-cols.side{grid-template-columns:minmax(0,1fr)}}
@media (max-width:700px){
  .cn-ph{gap:12px;margin-bottom:18px}
  .cn-ph-ic{width:48px;height:48px;font-size:20px;border-radius:16px}
  body.nv .cn-ph-t h1{font-size:25px}
  .cn-ph-t p{font-size:13px}
  .cn-ph-act{margin-left:0;width:100%}
  .cn-card{padding:16px;border-radius:22px;box-shadow:var(--cn-hi),var(--cn-lo),4px 4px 0 var(--cn-drop)}
  .cn-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .cn-tile{flex-direction:column;align-items:flex-start;gap:8px;padding:13px;border-radius:20px}
  .cn-tile .cn-coin{width:38px;height:38px;font-size:15px}
  .cn-tile .v{font-size:21px}
  .cn-cols,.cn-stack{gap:18px}
}

/* pages with their own page header: the desktop topbar title would just repeat it */
@media (min-width:861px){body.nv:has(.cn-ph) .nv-page-title,body.nv:has(.pubx-title) .nv-page-title,body.nv:has(.og-hero) .nv-page-title{visibility:hidden}}

/* the New Order bento owns the balance: hide the dock wallet on that page only (desktop dock + phone drawer) */
body.nv:has(#lm-order.cn-order) .lm-side-balance{display:none}

/* ---------- 6. New Order ---------- */
.cn-dash{margin:0 0 22px}
.cn-greet{display:flex;align-items:center;gap:14px;margin:0 0 18px}
.cn-greet-ic{width:52px;height:52px;border-radius:17px;font-size:22px;transform:rotate(-7deg)}
.cn-greet-t h1{font-size:30px;line-height:1.1}
.cn-greet-t p{margin:4px 0 0;color:var(--cn-muted);font-size:14.5px;font-weight:600}
.cn-bento{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);grid-template-areas:"w o s" "w l l";gap:18px}
.cn-wallet-tile{grid-area:w;position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;gap:16px;min-height:220px;padding:22px 22px 20px;border:var(--cn-bw) solid var(--cn-rim);border-radius:28px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff!important;text-decoration:none;box-shadow:var(--cn-btn-hi),6px 6px 0 var(--cn-drop);transition:transform .12s var(--cn-e-out),box-shadow .12s var(--cn-e-out)}
.cn-wallet-tile:active{transform:translate(3px,3px);box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
.cn-wallet-tile .k{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.cn-wallet-tile .k .cn-coin{width:42px;height:42px;background:var(--cn-card);color:var(--cn-acc-text);font-size:17px}
.cn-wallet-tile .v{font-family:var(--cn-f-head);font-weight:600;font-size:clamp(34px,3.3vw,50px);line-height:1.04;letter-spacing:-.02em;overflow-wrap:anywhere}
.cn-wallet-tile .cta .b{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border:2.5px solid var(--cn-rim);border-radius:15px;background:var(--cn-card);color:var(--cn-text);font-family:var(--cn-f-head);font-weight:600;font-size:16px;box-shadow:3px 3px 0 var(--cn-drop)}
.cn-wallet-tile .deco{position:absolute;z-index:-1;right:-18px;bottom:-34px;font-size:150px;opacity:.15;transform:rotate(-14deg)}
.cn-stat{display:flex;flex-direction:column;gap:9px;min-width:0;padding:18px;border:var(--cn-bw) solid var(--cn-rim);border-radius:24px;text-decoration:none;box-shadow:var(--cn-hi),var(--cn-lo),5px 5px 0 var(--cn-drop)}
a.cn-stat{transition:transform .12s var(--cn-e-out),box-shadow .12s var(--cn-e-out)}
a.cn-stat:active{transform:translate(3px,3px);box-shadow:var(--cn-sh-press)}
.cn-bento .t-blue{grid-area:o}.cn-bento .t-mint{grid-area:s}.cn-bento .cn-lvl{grid-area:l}
/* the stat tiles can be <a>: nova's `.nv a{color:accent}` (0,1,1) would beat the tone class, so re-assert it */
body.nv a.cn-stat.t-blue{color:var(--p-blue-d)}body.nv a.cn-stat.t-mint{color:var(--p-mint-d)}body.nv a.cn-stat.t-lemon{color:var(--p-lemon-d)}
.cn-stat .cn-coin{background:var(--cn-card);color:inherit}
.cn-stat .k{font-size:12px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.cn-stat .v{font-family:var(--cn-f-head);font-weight:600;font-size:29px;line-height:1.08;color:var(--cn-text);overflow-wrap:anywhere}
.cn-stat .v small{font-family:var(--cn-f-ui);font-size:14px;font-weight:900;opacity:.75}
.cn-lvl{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"c k more" "c v more" "bar bar bar";gap:3px 14px;align-items:center}
.cn-lvl .cn-coin{grid-area:c}.cn-lvl .k{grid-area:k;align-self:end}.cn-lvl .v{grid-area:v;align-self:start;font-size:24px}
.cn-lvl-bar{grid-area:bar;display:block;height:16px;margin-top:10px;border:2.5px solid var(--cn-rim);border-radius:99px;background:var(--cn-card);overflow:hidden}
.cn-lvl-bar>span{display:block;height:100%;border-radius:99px;background:var(--cn-grad);background-color:var(--cn-acc)}
.cn-lvl-more{grid-area:more;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border:2px solid var(--cn-rim);border-radius:13px;background:var(--cn-card);color:var(--cn-text);font:800 12.5px var(--cn-f-ui);cursor:pointer;box-shadow:2px 2px 0 var(--cn-drop)}
.cn-lvl-more:active{transform:translate(2px,2px);box-shadow:none}

/* composer */
.cn-order{display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,370px);gap:26px;align-items:start;margin-top:4px;scroll-margin-top:90px}
.cn-compose{min-width:0;padding:22px 24px 26px;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:30px;box-shadow:var(--cn-hi),var(--cn-lo),7px 7px 0 var(--cn-drop)}
.cn-compose-h{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.cn-compose-ic{width:52px;height:52px;border-radius:17px;font-size:21px;border-width:2.5px}
.cn-compose-t{min-width:0;flex:1 1 220px}
.cn-compose-t h2{font-size:26px;line-height:1.1}
.cn-compose-t p{margin:3px 0 0;font-size:13.5px;font-weight:600;color:var(--cn-muted)}
.cn-seg{display:flex;gap:5px;padding:5px;background:var(--cn-ground-2);border:2.5px solid var(--cn-rim);border-radius:18px}
body.nv .cn-seg-b{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 14px;border:2.5px solid transparent;border-radius:13px;background:none;box-shadow:none;color:var(--cn-soft);font:600 15px var(--cn-f-head);cursor:pointer;white-space:nowrap}
body.nv .cn-seg-b.active{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;border-color:var(--cn-rim);box-shadow:var(--cn-btn-hi),2px 2px 0 var(--cn-drop)}
.cn-alert{display:flex;align-items:flex-start;gap:9px;padding:12px 14px;margin-bottom:16px;border:2.5px solid currentColor;border-radius:16px;font-weight:800;font-size:14px}
.cn-alert.err{background:var(--cn-bad-bg);color:var(--cn-bad)}
.cn-alert.ok{background:var(--cn-ok-bg);color:var(--cn-ok)}
.cn-find{position:relative;margin-bottom:24px}
.cn-find>i{position:absolute;left:18px;top:28px;transform:translateY(-50%);color:var(--cn-muted);font-size:16px;pointer-events:none;z-index:2}
body.nv .cn-find>input{width:100%;height:56px;padding:0 16px 0 48px;border:var(--cn-bw) solid var(--cn-rim);border-radius:18px;background:var(--cn-field);color:var(--cn-text);font:700 16px var(--cn-f-ui);outline:none;box-shadow:inset 0 3px 0 rgba(42,35,64,.06),4px 4px 0 var(--cn-drop)}
body.nv .cn-find>input:focus{border-color:var(--cn-acc);box-shadow:inset 0 3px 0 rgba(42,35,64,.06),0 0 0 4px color-mix(in srgb,var(--cn-acc) 22%,transparent)}
body.nv .cn-find>input::placeholder{color:var(--cn-muted);font-weight:600}
body.nv .nv-srch-menu{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:60;display:none;max-height:340px;overflow:auto;padding:6px;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:18px;box-shadow:5px 5px 0 var(--cn-drop)}
body.nv .nv-srch-menu.show{display:block}
body.nv .nv-srch-menu .r{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border:0;border-radius:12px;cursor:pointer;font-size:14px;font-weight:700}
body.nv .nv-srch-menu .r+.r{border-top:1.5px dashed var(--cn-line)}
body.nv .nv-srch-menu .r:hover{background:var(--cn-card-2)}
body.nv .nv-srch-menu .r .nm{color:var(--cn-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.nv .nv-srch-menu .empty{padding:16px;color:var(--cn-muted);font-size:13.5px;font-weight:700;text-align:center}

/* step rail */
.cn-stepsec{position:relative;padding:0 0 24px 60px}
.cn-stepsec::before{content:"";position:absolute;left:21px;top:52px;bottom:6px;border-left:3px dashed var(--cn-line)}
.cn-stepsec.last{padding-bottom:0}
.cn-stepsec.last::before{content:none}
.cn-stepsec:has(.cn-step.on)::before{border-left-color:color-mix(in srgb,var(--cn-acc) 45%,transparent)}
.cn-step-h{display:flex;align-items:center;gap:12px;min-height:46px;margin-bottom:12px}
.cn-step{position:absolute;left:0;top:0}
.cn-step b{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;border:2.5px solid var(--cn-rim);background:var(--cn-card-2);color:var(--cn-muted);font:600 21px var(--cn-f-head);box-shadow:2px 2px 0 var(--cn-drop)}
.cn-step.on b{background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;box-shadow:var(--cn-btn-hi),3px 3px 0 var(--cn-drop)}
.cn-step-l{display:block;margin:0;font:600 19px/1.2 var(--cn-f-head);color:var(--cn-text)}
.cn-step:not(.on)+.cn-step-l{color:var(--cn-muted)}

/* platform stickers */
.cn-plats{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:12px}
body.nv .cn-plat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:96px;padding:12px 6px 10px;border:2.5px solid var(--cn-rim);border-radius:18px;font:800 13px var(--cn-f-ui);cursor:pointer;box-shadow:var(--cn-hi),3px 3px 0 var(--cn-drop);transition:transform .12s var(--cn-e-out),box-shadow .12s var(--cn-e-out)}
.cn-plat .pn{color:var(--cn-text);line-height:1.1}
.cn-plat .pi{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;border:2px solid var(--cn-rim);background:#FFFCF6;font-size:21px;box-shadow:inset 0 -3px 0 rgba(42,35,64,.07)}
body.nv .cn-plat:active{transform:translate(2px,2px);box-shadow:var(--cn-sh-press)}
body.nv .cn-plat.active{background:var(--cn-grad);background-color:var(--cn-acc);transform:translate(2px,2px);box-shadow:inset 0 3px 0 rgba(0,0,0,.16),1px 1px 0 var(--cn-drop)}
body.nv .cn-plat.active .pn{color:#fff}

/* selects + custom dropdowns */
body.nv .cn-compose .nv-select{width:100%;min-height:54px}
body.nv .nv-catdd{position:relative}
body.nv .nv-catdd-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:56px;height:auto;padding:8px 16px;border:var(--cn-bw) solid var(--cn-rim);border-radius:17px;background:var(--cn-field);color:var(--cn-text);font:700 15px var(--cn-f-ui);text-align:left;cursor:pointer;box-shadow:inset 0 3px 0 rgba(42,35,64,.06),3px 3px 0 var(--cn-drop)}
body.nv .nv-catdd-btn .cur{display:flex;align-items:center;gap:10px;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
body.nv .nv-catdd-btn .ar{flex:none;width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:var(--cn-card-2);border:2px solid var(--cn-line);color:var(--cn-text);font-size:11px;transition:transform .18s var(--cn-e-out)}
body.nv .nv-catdd.open .ar{transform:rotate(180deg)}
body.nv .nv-catdd.open .nv-catdd-btn{border-color:var(--cn-acc);box-shadow:inset 0 3px 0 rgba(42,35,64,.06),0 0 0 4px color-mix(in srgb,var(--cn-acc) 20%,transparent)}
body.nv .nv-catdd-menu{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:50;display:none;max-height:340px;overflow:auto;padding:6px;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:18px;box-shadow:5px 5px 0 var(--cn-drop);animation:none}
body.nv .nv-catdd.open .nv-catdd-menu{display:block}
body.nv .nv-catdd-menu .it{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;color:var(--cn-text);font-size:14px;font-weight:700;cursor:pointer}
body.nv .nv-catdd-menu .it+.it{margin-top:2px}
body.nv .nv-catdd-menu .it:hover{background:var(--cn-card-2);box-shadow:none}
body.nv .nv-catdd-menu .it .ic{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:11px;background:#FFFCF6;border:2px solid var(--cn-line)}
body.nv .nv-catdd-menu .it .ic i{font-size:17px!important}
html.nv-dark body.nv .nv-catdd .fa-tiktok,html.nv-dark body.nv .nv-catdd .fa-x-twitter,html.nv-dark body.nv .nv-catdd .fa-threads{color:var(--cn-text)!important}
html.nv-dark body.nv .nv-catdd-menu .it .ic .fa-tiktok,html.nv-dark body.nv .nv-catdd-menu .it .ic .fa-x-twitter{color:#111!important}

/* injected service fields */
body.nv #neworder_fields{color:var(--cn-soft);font-size:14px}
body.nv #neworder_fields label,body.nv #neworder_fields .control-label{display:block;margin-bottom:7px;font:800 13.5px var(--cn-f-ui);color:var(--cn-soft)}
body.nv #neworder_fields input:not([type=checkbox]):not([type=radio]),body.nv #neworder_fields select,body.nv #neworder_fields textarea{min-height:52px;padding:0 15px;margin-bottom:14px;border:2.5px solid var(--cn-rim);border-radius:15px;background:var(--cn-field);color:var(--cn-text);font:600 15.5px var(--cn-f-ui);box-shadow:inset 0 3px 0 rgba(42,35,64,.06)}
body.nv #neworder_fields textarea{padding:12px 15px;min-height:110px}
body.nv #neworder_fields input:focus,body.nv #neworder_fields select:focus,body.nv #neworder_fields textarea:focus{border-color:var(--cn-acc);box-shadow:inset 0 3px 0 rgba(42,35,64,.06),0 0 0 4px color-mix(in srgb,var(--cn-acc) 22%,transparent)}
body.nv #neworder_fields .fields,body.nv #neworder_fields>div{margin-bottom:14px}
body.nv #service_description,body.nv .panel-body.border-solid{position:relative;padding:12px 14px 12px 42px;border:2.5px dashed color-mix(in srgb,var(--cn-rim) 45%,transparent);border-radius:16px;background:var(--cn-card-2);color:var(--cn-soft);font-size:14px;font-weight:600;line-height:1.6}
body.nv #service_description::before{content:"\f05a";position:absolute;left:14px;top:13px;font-family:"Font Awesome 6 Free";font-weight:900;color:var(--cn-acc-text)}
body.nv #neworder_fields .help-block{display:inline-flex;margin:-6px 0 14px;padding:3px 10px;border:2px solid var(--cn-line);border-radius:99px;background:var(--cn-card-2);color:var(--cn-soft);font-size:12.5px;font-weight:800}
body.nv #neworder_fields button:not(.nv-tab){border:2.5px solid var(--cn-rim);border-radius:13px;background:var(--cn-grad);background-color:var(--cn-acc);box-shadow:2px 2px 0 var(--cn-drop)}
/* drip-feed switch (functional states kept: #dripfeedcheckbox:checked, #dripfeed-options.hidden) */
body.nv #dripfeed{margin:4px 0 16px;border:2.5px solid var(--cn-rim);border-radius:18px;overflow:hidden;background:var(--cn-card-2)}
body.nv #dripfeed .nv-drip-head{display:flex;align-items:center;gap:12px;padding:13px 15px;cursor:pointer}
body.nv #dripfeed .nv-drip-head .ti{flex:1;min-width:0}
body.nv #dripfeed .nv-drip-head .ti b{display:block;color:var(--cn-text);font-size:14.5px;font-weight:900}
body.nv #dripfeed .nv-drip-head .ti span{font-size:12.5px;color:var(--cn-muted)}
body.nv #neworder_fields #dripfeedcheckbox{width:52px!important;height:30px!important;min-height:0!important;margin:0!important;padding:0!important;-webkit-appearance:none!important;appearance:none!important;background:var(--cn-card)!important;border:2.5px solid var(--cn-rim)!important;border-radius:99px!important;box-shadow:inset 0 2px 0 rgba(42,35,64,.1)!important;position:relative;cursor:pointer;flex:0 0 52px;display:inline-block}
body.nv #neworder_fields #dripfeedcheckbox:checked{background:var(--cn-acc)!important}
body.nv #neworder_fields #dripfeedcheckbox::after{content:"";position:absolute;top:2px;left:2px;width:21px;height:21px;border-radius:50%;background:#fff;border:2px solid var(--cn-rim);transition:transform .15s var(--cn-e-out)}
body.nv #neworder_fields #dripfeedcheckbox:checked::after{transform:translateX(22px)}
body.nv #dripfeed-options{padding:14px 15px;display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:2px dashed var(--cn-line);background:var(--cn-card)}
body.nv #dripfeed-options.hidden{display:none}
body.nv #dripfeed-options .form-group{margin:0}
body.nv #dripfeed-options input{margin-bottom:0!important}
body.nv #dripfeed-options .nv-drip-tq{grid-column:1/-1}
body.nv .lm-skel{border-radius:14px;background:var(--cn-card-2)}
/* coupon */
.cn-coupon{margin:4px 0 16px}
.cn-coupon label{display:block;margin-bottom:7px;font:800 13.5px var(--cn-f-ui);color:var(--cn-soft)}
.cn-coupon label i{color:var(--cn-acc-text)}
.cn-coupon .opt{color:var(--cn-muted);font-weight:600}
body.nv .cn-coupon input{width:100%;min-height:52px;padding:0 15px;border:2.5px dashed var(--cn-rim);border-radius:15px;background:var(--cn-field);color:var(--cn-text);font:800 15px var(--cn-f-ui);letter-spacing:.04em;outline:none}
body.nv .cn-coupon input:focus{border-style:solid;border-color:var(--cn-acc)}
body.nv .nv-cpcard-ok{border:2.5px solid var(--cn-rim);border-radius:16px;background:var(--cn-ok-bg);box-shadow:3px 3px 0 var(--cn-drop)}
body.nv .nv-cpcard-err{border:2.5px solid var(--cn-bad);border-radius:14px}
/* submit */
.cn-submit{width:100%;min-height:62px;margin-top:6px;display:flex;align-items:center;justify-content:center;gap:10px;border:var(--cn-bw) solid var(--cn-rim);border-radius:20px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;font:600 19px var(--cn-f-head);letter-spacing:.01em;cursor:pointer;box-shadow:var(--cn-btn-hi),5px 5px 0 var(--cn-drop);transition:transform .12s var(--cn-e-out),box-shadow .12s var(--cn-e-out)}
.cn-submit:active{transform:translate(4px,4px);box-shadow:var(--cn-btn-hi),1px 1px 0 var(--cn-drop)}
.cn-submit[disabled]{opacity:.65;cursor:not-allowed}
@media (hover:hover) and (pointer:fine){
  .cn-submit:hover{transform:translate(-1px,-1px);box-shadow:var(--cn-btn-hi),6px 6px 0 var(--cn-drop)}
  .cn-submit:active{transform:translate(4px,4px);box-shadow:var(--cn-btn-hi),1px 1px 0 var(--cn-drop)}
  body.nv .cn-plat:not(.active):hover{transform:translate(-1px,-1px);box-shadow:var(--cn-hi),4px 4px 0 var(--cn-drop)}
}
/* mass order */
.cn-mass{margin-bottom:14px}
.cn-mass label{display:block;margin-bottom:8px;font:800 14px var(--cn-f-ui);color:var(--cn-soft)}
.cn-mass code,#np-mass code{padding:2px 7px;border-radius:8px;background:var(--cn-card-2);border:1.5px solid var(--cn-line);font-size:12.5px}
body.nv .cn-mass textarea{width:100%;min-height:210px;padding:14px 15px;border:2.5px solid var(--cn-rim);border-radius:18px;background:var(--cn-field);color:var(--cn-text);font:600 14.5px/1.6 ui-monospace,Menlo,Consolas,monospace;outline:none;resize:vertical;box-shadow:inset 0 3px 0 rgba(42,35,64,.06)}
body.nv .cn-mass textarea:focus{border-color:var(--cn-acc);box-shadow:0 0 0 4px color-mix(in srgb,var(--cn-acc) 22%,transparent)}
.cn-mass .nv-hint{margin-top:8px}

/* receipt */
.cn-side{position:sticky;top:94px;display:flex;flex-direction:column;gap:20px;min-width:0}
.cn-receipt{position:relative;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:26px;box-shadow:var(--cn-hi),6px 6px 0 var(--cn-drop)}
.cn-receipt-h{display:flex;align-items:center;gap:12px;padding:18px 20px 14px;font:600 21px var(--cn-f-head);color:var(--cn-text);border-bottom:2.5px dashed var(--cn-line)}
.cn-receipt-h .cn-coin{width:42px;height:42px;font-size:17px;transform:rotate(-6deg)}
.cn-receipt-b{padding:6px 20px 4px}
body.nv .cn-receipt .nv-os .row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0;border:0;font-size:14px;color:var(--cn-soft)}
body.nv .cn-receipt .nv-os .row+.row{border-top:1.5px dotted color-mix(in srgb,var(--cn-rim) 35%,transparent)}
body.nv .cn-receipt .nv-os .row span{font-weight:700;white-space:nowrap}
body.nv .cn-receipt .nv-os .row span i{color:var(--cn-acc-text);font-size:12px;margin-right:2px}
body.nv .cn-receipt .nv-os .row b{max-width:64%;text-align:right;color:var(--cn-text);font-weight:900;overflow-wrap:anywhere}
body.nv .cn-receipt .nv-os .row.svc{flex-direction:column;align-items:flex-start;gap:4px}
body.nv .cn-receipt .nv-os .row.svc b{max-width:100%;text-align:left;font-weight:800;line-height:1.45}
.cn-perf{position:relative;height:0;margin:12px -20px 4px;border-top:3px dashed color-mix(in srgb,var(--cn-rim) 40%,transparent)}
.cn-perf::before,.cn-perf::after{content:"";position:absolute;top:-10px;width:17px;height:17px;border-radius:50%;background:var(--cn-ground);border:2.5px solid var(--cn-rim)}
.cn-perf::before{left:9px}.cn-perf::after{right:9px}
body.nv .cn-receipt .nv-os .row.total{margin:0;padding:14px 0 16px;border-top:0}
body.nv .cn-receipt .nv-os .row.total span{font:600 17px var(--cn-f-head);color:var(--cn-text)}
body.nv .cn-receipt .nv-os .row.total b{max-width:none;font:600 30px/1 var(--cn-f-head);color:var(--cn-acc-text)}
.cn-receipt-f{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 14px 14px;padding:10px 14px;border:2px solid var(--cn-rim);border-radius:15px;background:var(--p-lemon);color:var(--cn-text);font-size:13.5px;font-weight:800}
.cn-receipt-f i{color:var(--p-lemon-d)}
.cn-receipt-f b{font:600 16px var(--cn-f-head);overflow-wrap:anywhere;text-align:right}
.cn-news{background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:24px;box-shadow:5px 5px 0 var(--cn-drop);overflow:hidden}
.cn-news-h{display:flex;align-items:center;gap:10px;padding:14px 18px;font:600 18px var(--cn-f-head);border-bottom:2.5px dashed var(--cn-line)}
.cn-news-h .cn-coin{width:36px;height:36px;font-size:14px}
.cn-news-b{max-height:340px;overflow:auto;padding:4px 18px 12px}
.cn-news-it{padding:12px 0}
.cn-news-it+.cn-news-it{border-top:1.5px dashed var(--cn-line)}
.cn-news-it .d{font-size:11.5px;font-weight:800;color:var(--cn-muted)}
.cn-news-it .t{font-weight:900;margin:2px 0;font-size:14px;color:var(--cn-text)}
.cn-news-it .c{font-size:13px;color:var(--cn-soft)}

/* ---------- 7. secondary widgets ---------- */
body.nv .dw{margin:0 0 22px}
body.nv .dw-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px}
body.nv .dw-h h3{display:flex;align-items:center;gap:9px;font-size:20px}
body.nv .dw-scroll{display:flex;gap:14px;overflow-x:auto;padding:4px 8px 14px 2px;scroll-snap-type:x mandatory}
body.nv .svc-card{scroll-snap-align:start;flex:0 0 220px;position:relative;display:flex;flex-direction:column;gap:9px;padding:14px;background:var(--cn-card);border:var(--cn-bw) solid var(--cn-rim);border-radius:20px;box-shadow:var(--cn-hi),4px 4px 0 var(--cn-drop)}
body.nv .svc-card:hover{transform:none;border-color:var(--cn-rim)}
body.nv .svc-card .top{display:flex;align-items:center;gap:9px}
body.nv .svc-card .pic{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;border:2px solid var(--cn-rim);font-size:15px}
body.nv .svc-card .plat{font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--cn-muted)}
body.nv .svc-card .nm{font-size:13px;font-weight:800;color:var(--cn-text);line-height:1.35;min-height:35px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.nv .svc-card .pr{font:600 18px var(--cn-f-head);color:var(--cn-text)}
body.nv .svc-card .pr small{font:700 11px var(--cn-f-ui);color:var(--cn-muted)}
body.nv .svc-card .go{margin-top:auto;min-height:38px;display:flex;align-items:center;justify-content:center;gap:6px;border:2.5px solid var(--cn-rim);border-radius:12px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;font:600 14px var(--cn-f-head);text-decoration:none;box-shadow:2px 2px 0 var(--cn-drop)}
body.nv .svc-fav{position:absolute;top:10px;right:10px;border:0;background:transparent;color:var(--cn-line);cursor:pointer;font-size:15px;z-index:2}
body.nv .svc-fav.on{color:#F5A623}
body.nv .dw-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
body.nv .deal-card{padding:20px;border:var(--cn-bw) solid var(--cn-rim);border-radius:24px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff;box-shadow:var(--cn-btn-hi),5px 5px 0 var(--cn-drop)}
body.nv .deal-card .big{font:600 26px var(--cn-f-head)}
body.nv .deal-card .code{border:2.5px dashed rgba(255,255,255,.75);border-radius:12px;background:rgba(255,255,255,.16)}
body.nv .deal-card .cd div{border:2px solid rgba(255,255,255,.4);border-radius:11px}
body.nv .cpn-list{display:flex;flex-direction:column;gap:10px}
body.nv .cpn{display:flex;align-items:center;gap:11px;padding:12px 14px;background:var(--cn-card);border:2.5px dashed var(--cn-rim);border-radius:16px}
body.nv .cpn .ic{width:36px;height:36px;display:grid;place-items:center;flex:none;border-radius:12px;border:2px solid var(--cn-rim);background:var(--p-lemon);color:var(--p-lemon-d)}
body.nv .cpn .tl{flex:1;min-width:0}
body.nv .cpn .tl b{display:block;font-weight:900;color:var(--cn-text)}
body.nv .cpn .tl span{font-size:12px;color:var(--cn-muted)}
body.nv .cpn .cp-code{padding:6px 10px;border:2px solid var(--cn-rim);border-radius:10px;background:var(--cn-card-2);color:var(--cn-text);font:900 12.5px ui-monospace,monospace;cursor:pointer;white-space:nowrap}
/* mobile mini summary (element + ids come from the page script) */
body.nv #lmMini{border:2.5px solid var(--cn-rim);border-radius:18px;background:var(--cn-card-2);box-shadow:3px 3px 0 var(--cn-drop);margin:2px 0 16px}
body.nv #lmMini .mi+.mi{border-left:2.5px dashed var(--cn-line)}
body.nv #lmMini .l{color:var(--cn-muted);font-weight:900}
body.nv #lmMini .sp b,body.nv #lmMini .sp .l i{color:var(--cn-ok)}
body.nv #lmMini .ch b{font-family:var(--cn-f-head);font-weight:600;font-size:19px;color:var(--cn-acc-text)}
body.nv #lmMini b{overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere}
/* daily reward widget, clay */
body.nv #drFab{border:var(--cn-bw) solid var(--cn-rim);border-radius:20px;background:var(--p-lemon);color:var(--cn-text);box-shadow:var(--cn-hi),4px 4px 0 var(--cn-drop);position:fixed}
body.nv #drFab .drf-ic{border:2px solid var(--cn-rim);border-radius:13px;background:var(--cn-grad);background-color:var(--cn-acc);color:#fff}
body.nv #drOv .dr-card{border:var(--cn-bw) solid var(--cn-rim);border-radius:28px!important;box-shadow:8px 8px 0 var(--cn-drop)}
body.nv .dr-claim{border:var(--cn-bw) solid var(--cn-rim);border-radius:18px;background:var(--cn-grad);background-color:var(--cn-acc);box-shadow:var(--cn-btn-hi),4px 4px 0 var(--cn-drop);font-family:var(--cn-f-head);font-weight:600}
body.nv .dr-step,body.nv .dr-day,body.nv .dr-reward{border:2px solid var(--cn-rim);border-radius:14px;box-shadow:2px 2px 0 var(--cn-drop)}
/* MASSUI result panel */
body.nv .ppm-panel{border:2.5px solid var(--cn-rim);border-radius:18px}

/* ---------- 8. responsive ---------- */
@media (max-width:1199px){
  .cn-order{grid-template-columns:minmax(0,1fr)}
  .cn-side{position:static}
  body.nv #lmMini{display:flex}
  .cn-bento{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"w w" "o s" "l l"}
  .cn-wallet-tile{min-height:0}
}
@media (max-width:860px){
  .cn-greet{margin-bottom:14px}
  .cn-greet-t h1{font-size:24px}
}
@media (max-width:700px){
  .cn-dash{margin-bottom:18px}
  .cn-greet{gap:12px}
  .cn-greet-ic{width:44px;height:44px;font-size:18px;border-radius:14px}
  .cn-greet-t h1{font-size:21px}
  .cn-greet-t p{font-size:12.5px}
  .cn-bento{gap:14px}
  .cn-wallet-tile{flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:6px 12px;padding:14px 14px 14px 16px;border-radius:24px;box-shadow:var(--cn-btn-hi),4px 4px 0 var(--cn-drop)}
  .cn-wallet-tile .k{flex:1 1 100%;font-size:11.5px}
  .cn-wallet-tile .k .cn-coin{width:30px;height:30px;font-size:13px;border-radius:10px}
  .cn-wallet-tile .v{flex:1 1 auto;font-size:clamp(26px,8.4vw,34px)}
  .cn-wallet-tile .cta .b{min-height:46px;padding:0 14px;font-size:15px}
  .cn-wallet-tile .deco{display:none}
  .cn-stat{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"c k" "c v";align-items:center;gap:2px 10px;padding:12px;border-radius:20px;box-shadow:var(--cn-hi),var(--cn-lo),4px 4px 0 var(--cn-drop)}
  .cn-stat .cn-coin{grid-area:c;width:36px;height:36px;font-size:15px;border-radius:12px}
  .cn-stat .k{grid-area:k;align-self:end;font-size:10.5px}
  .cn-stat .v{grid-area:v;align-self:start;font-size:20px}
  .cn-lvl{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"c k more" "c v more" "bar bar bar"}
  .cn-lvl .v{font-size:19px}
  .cn-lvl-bar{height:13px;margin-top:8px}
  .cn-lvl-more{min-height:38px;padding:0 10px}
  .cn-lvl-more .lg{display:none}
  .cn-compose{padding:16px 14px 18px;border-radius:24px;box-shadow:var(--cn-hi),var(--cn-lo),5px 5px 0 var(--cn-drop)}
  .cn-compose-h{gap:12px;margin-bottom:16px}
  .cn-compose-ic{width:44px;height:44px;font-size:18px}
  .cn-compose-t h2{font-size:21px}
  .cn-seg{width:100%}
  .cn-find{margin-bottom:20px}
  .cn-find>i{top:26px}
  body.nv .cn-find>input{height:52px;font-size:15.5px}
  .cn-stepsec{padding:0 0 20px}
  .cn-stepsec::before{content:none}
  .cn-step{position:static}
  .cn-step b{width:38px;height:38px;font-size:18px;border-radius:12px}
  .cn-step-l{font-size:17.5px}
  .cn-plats{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
  body.nv #svcDDBtn .cur{flex-wrap:wrap;white-space:normal;row-gap:2px}
  body.nv #svcDDBtn .cur .nm{flex:1 1 100%;min-width:0;overflow:visible;white-space:normal}
  body.nv #svcDDBtn .cur .pr{margin-left:0!important;padding-left:0!important}
  body.nv .cn-plat{min-height:80px;padding:9px 3px 8px;gap:6px;font-size:11.5px;border-radius:16px}
  .cn-plat .pi{width:38px;height:38px;font-size:18px;border-radius:12px}
  .cn-submit{min-height:58px;font-size:18px}
  .cn-receipt-h{font-size:19px}
  body.nv .cn-receipt .nv-os .row.total b{font-size:26px}
  body.nv .dw-2{grid-template-columns:1fr}
  body.nv #dripfeed-options{grid-template-columns:1fr}
}
@media (max-width:360px){
  .cn-plats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cn-wallet-tile .v{font-size:30px}
}
@media (prefers-reduced-motion:reduce){
  body.nv .nv-sidebar,body.nv .lm-xp-bar>span,.lmxpm-box,body.nv .nv-catdd-btn .ar,body.nv #neworder_fields #dripfeedcheckbox::after,.cn-submit,body.nv .cn-plat,.cn-wallet-tile,a.cn-stat,body.nv .nv-btn,body.nv .lm-xp-float{transition:none;animation:none}
}
