*{box-sizing:border-box;margin:0;padding:0}
    :root{
      --bg:#f5f5f5;--panel:#ffffff;--panel-2:#fafafa;--panel-3:#f0f0f0;
      --line:#e5e5e5;--text:#0a0a0a;--muted:#737373;--soft:#a3a3a3;
      --dark:#0a0a0a;--dark-2:#1a1a1a;--dark-3:#404040;
      --white:#fff;
      --accent:#0a0a0a;--accent-hover:#1a1a1a;
      --green:#16a34a;--green-bg:#f0fdf4;--green-line:#bbf7d0;
      --red:#dc2626;--red-bg:#fef2f2;--red-line:#fecaca;
      --blue:#2563eb;--blue-bg:#eff6ff;--blue-line:#bfdbfe;
      --yellow:#ca8a04;--yellow-bg:#fefce8;--yellow-line:#fef08a;
      --purple:#7c3aed;--purple-bg:#f5f3ff;--purple-line:#ddd6fe;
      --orange:#ea580c;--orange-bg:#fff7ed;--orange-line:#fed7aa;
      --shadow:0 1px 3px rgba(0,0,0,.06),0 12px 32px rgba(0,0,0,.06);
      --shadow-sm:0 1px 2px rgba(0,0,0,.04);
      --shadow-lg:0 4px 6px rgba(0,0,0,.04),0 24px 56px rgba(0,0,0,.1);
      --radius-xl:28px;--radius-lg:20px;--radius-md:14px;--radius-sm:10px;--radius-xs:7px;
    }
    html{scroll-behavior:smooth}
    body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}
    button,input,select,textarea{font:inherit;color:inherit}
    a{color:inherit;text-decoration:none}

    body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.028;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E")}

    @keyframes fadeUp{from{transform:translateY(14px);opacity:0}to{transform:translateY(0);opacity:1}}
    @keyframes scaleIn{from{transform:scale(.97);opacity:0}to{transform:scale(1);opacity:1}}
    @keyframes slideR{from{transform:translateX(-16px);opacity:0}to{transform:translateX(0);opacity:1}}
    @keyframes spin{to{transform:rotate(360deg)}}
    @keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
    @keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
    .af{animation:fadeUp .45s ease both}
    .af1{animation:fadeUp .45s ease .07s both}
    .af2{animation:fadeUp .45s ease .14s both}
    .af3{animation:fadeUp .45s ease .21s both}
    .af4{animation:fadeUp .45s ease .28s both}

    .hidden{display:none!important}
    .page{display:none}.page.active{display:block}

    .container{max-width:1200px;margin:0 auto;padding:0 20px}

    .btn{height:46px;border:0;border-radius:var(--radius-sm);cursor:pointer;padding:0 20px;font-weight:600;font-size:14px;transition:.18s;display:inline-flex;align-items:center;justify-content:center;gap:7px;letter-spacing:-.01em}
    .btn:active{transform:scale(.98)}
    .btn-primary{background:var(--dark);color:white}
    .btn-primary:hover{background:var(--dark-2)}
    .btn-accent{background:var(--accent);color:white}
    .btn-accent:hover{background:var(--accent-hover)}
    .btn-ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
    .btn-ghost:hover{background:var(--panel-2);border-color:var(--soft)}
    .btn-sm{height:38px;padding:0 14px;font-size:13px;border-radius:var(--radius-xs)}
    .btn-xs{height:32px;padding:0 11px;font-size:12px;border-radius:6px}
    .btn-full{width:100%}
    .btn-icon{width:40px;height:40px;padding:0;border-radius:var(--radius-sm);border:1px solid var(--line);background:white;cursor:pointer;display:grid;place-items:center;flex-shrink:0}
    .btn-icon:hover{background:var(--panel-2)}
    .btn-danger{background:var(--red);color:white;border:0}
    .btn-green{background:var(--green);color:white;border:0}
    .btn-green:hover{opacity:.9}
    .btn-purple{background:var(--purple);color:white;border:0}
    .btn-purple:hover{opacity:.9}

    .field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
    .field label{font-size:13px;font-weight:600;color:var(--dark-3);letter-spacing:.01em}
    .field-hint{font-size:12px;color:var(--muted);margin-top:2px}
    .input-wrap{position:relative}
    .input-wrap .ico{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:var(--soft);pointer-events:none;display:flex}
    .input-wrap input,.input-wrap select,.input-wrap textarea{width:100%;height:46px;border-radius:var(--radius-sm);border:1px solid var(--line);padding:0 14px 0 38px;outline:none;background:white;transition:.15s;font-size:14px}
    .input-wrap.no-ico input,.input-wrap.no-ico select,.input-wrap.no-ico textarea{padding-left:14px}
    .input-wrap textarea{height:100px;padding-top:12px;padding-bottom:12px;resize:vertical;line-height:1.6}
    .input-wrap input:focus,.input-wrap select:focus,.input-wrap textarea:focus{border-color:var(--dark-3);box-shadow:0 0 0 3px rgba(17,17,16,.06)}

    .chip{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:500;gap:5px;white-space:nowrap}
    .chip-default{background:var(--panel-2);border:1px solid var(--line);color:var(--dark-3)}
    .chip-green{background:var(--green-bg);border:1px solid var(--green-line);color:var(--green)}
    .chip-red{background:var(--red-bg);border:1px solid var(--red-line);color:var(--red)}
    .chip-blue{background:var(--blue-bg);border:1px solid var(--blue-line);color:var(--blue)}
    .chip-yellow{background:var(--yellow-bg);border:1px solid var(--yellow-line);color:var(--yellow)}
    .chip-purple{background:var(--purple-bg);border:1px solid var(--purple-line);color:var(--purple)}
    .chip-orange{background:var(--orange-bg);border:1px solid var(--orange-line);color:var(--orange)}
    .chip-dark{background:var(--dark);color:white;border:1px solid var(--dark)}

    .avatar{width:40px;height:40px;border-radius:50%;background:var(--panel-3);display:grid;place-items:center;font-weight:700;font-size:14px;color:var(--dark-3);flex-shrink:0;border:1px solid var(--line);overflow:hidden}
    .avatar.sm{width:32px;height:32px;font-size:12px}
    .avatar.lg{width:56px;height:56px;font-size:20px}
    .avatar.xl{width:72px;height:72px;font-size:26px}
    .avatar.dark{background:var(--dark);color:white;border-color:var(--dark)}
    .avatar img{width:100%;height:100%;object-fit:cover}

    .card{background:white;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}

    .toggle{width:42px;height:24px;border-radius:12px;background:var(--line);border:0;cursor:pointer;position:relative;transition:.2s;flex-shrink:0}
    .toggle::after{content:'';width:18px;height:18px;border-radius:50%;background:white;position:absolute;top:3px;left:3px;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.15)}
    .toggle.on{background:var(--green)}
    .toggle.on::after{left:21px}

    .divider{height:1px;background:var(--line);margin:20px 0}

    .i{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
    .i svg{width:100%;height:100%}

    .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--dark);color:white;padding:14px 24px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;z-index:100;transition:.35s;opacity:0;pointer-events:none;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:8px}
    .toast.show{transform:translateX(-50%) translateY(0);opacity:1}
    .toast svg{flex-shrink:0}

    /* tabs generic */
    .tab-bar{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:20px}
    .tab-btn{padding:10px 16px;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer;border:0;background:0;border-bottom:2px solid transparent;transition:.12s}
    .tab-btn:hover{color:var(--text)}
    .tab-btn.active{color:var(--text);border-color:var(--dark);font-weight:600}

    /* empty state */
    .empty-state{text-align:center;padding:48px 24px;color:var(--muted)}
    .empty-state svg{margin-bottom:14px;opacity:.4}
    .empty-state h4{font-size:16px;color:var(--text);margin-bottom:6px}
    .empty-state p{font-size:13px;line-height:1.6;margin-bottom:18px}

    /* stat pill */
    .stat-pill{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:600}
    .stat-pill.up{background:var(--green-bg);color:var(--green)}
    .stat-pill.down{background:var(--red-bg);color:var(--red)}
    .stat-pill.neutral{background:var(--panel-2);color:var(--muted)}

    /* ═══════ LANDING ═══════ */
    .l-nav{position:sticky;top:0;z-index:20;background:rgba(245,245,245,.85);backdrop-filter:blur(14px);border-bottom:1px solid rgba(229,229,229,.5)}
    .l-nav .inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
    .l-brand{display:flex;align-items:center;gap:10px;cursor:pointer}
    .l-links{display:flex;gap:2px}
    .l-link{padding:8px 14px;border-radius:var(--radius-xs);font-size:14px;color:var(--muted);cursor:pointer;border:0;background:0;transition:.15s;font-weight:500}
    .l-link:hover{color:var(--text);background:rgba(0,0,0,.03)}
    .l-actions{display:flex;gap:8px}

    .hero{padding:72px 0 48px;text-align:center}
    .hero .tag{display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:999px;background:var(--dark);color:white;font-size:12px;font-weight:600;margin-bottom:20px;letter-spacing:.02em}
    .hero h2{font-family:'Source Serif 4',serif;font-size:clamp(34px,5.2vw,64px);line-height:1.08;letter-spacing:-.04em;font-weight:600;color:var(--dark);max-width:780px;margin:0 auto 18px}
    .hero p{font-size:16px;line-height:1.75;color:var(--muted);max-width:520px;margin:0 auto 32px}
    .hero-btns{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}

    .hero-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:920px;margin:52px auto 0}
    .hero-card{background:white;border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;text-align:left;transition:.3s}
    .hero-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
    .hero-card .hc-icon{width:44px;height:44px;border-radius:var(--radius-sm);background:var(--panel-2);border:1px solid var(--line);display:grid;place-items:center;margin-bottom:16px}
    .hero-card h4{font-size:15px;margin-bottom:6px;font-weight:600;letter-spacing:-.02em}
    .hero-card p{font-size:13px;line-height:1.65;color:var(--muted)}

    .feat{padding:72px 0;border-top:1px solid var(--line)}
    .feat-inner{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
    .feat-visual{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-xl);padding:36px;min-height:320px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
    .feat-mock{width:100%;max-width:280px;background:white;border-radius:var(--radius-md);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
    .feat-mock-bar{height:10px;background:var(--panel-2);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 6px;gap:3px}
    .feat-mock-bar i{width:5px;height:5px;border-radius:50%;background:var(--line);display:block}
    .feat-mock-body{padding:14px;display:flex;flex-direction:column;gap:8px}
    .feat-mock-line{height:8px;border-radius:4px;background:var(--panel-3)}

    .feat-content{display:flex;flex-direction:column;gap:14px}
    .feat-content h3{font-family:'Source Serif 4',serif;font-size:clamp(22px,3vw,32px);line-height:1.2;letter-spacing:-.03em;font-weight:600}
    .feat-content p{font-size:14px;line-height:1.75;color:var(--muted)}
    .feat-checks{display:flex;flex-direction:column;gap:10px;margin-top:4px}
    .feat-check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dark-3)}
    .feat-check .ck{width:20px;height:20px;border-radius:6px;background:var(--panel-2);border:1px solid var(--line);display:grid;place-items:center;flex-shrink:0}
    .feat-check .ck svg{width:12px;height:12px;color:var(--green)}

    .pricing{padding:72px 0;border-top:1px solid var(--line)}
    .pricing h2{font-family:'Source Serif 4',serif;font-size:clamp(26px,3.5vw,38px);letter-spacing:-.03em;text-align:center;margin-bottom:8px}
    .pricing>p{text-align:center;color:var(--muted);font-size:14px;margin-bottom:40px}
    .pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:920px;margin:0 auto}
    .price-card{background:white;border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px;position:relative;transition:.3s}
    .price-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
    .price-card.featured{border-color:var(--dark);box-shadow:0 8px 32px rgba(0,0,0,.12)}
    .price-card.featured::before{content:'Mais popular';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--dark);color:white;padding:4px 14px;border-radius:999px;font-size:11px;font-weight:600}
    .price-card h4{font-size:18px;font-weight:700;margin-bottom:4px}
    .price-card .price-val{font-size:36px;font-weight:800;letter-spacing:-.04em;margin:14px 0 4px}
    .price-card .price-val span{font-size:14px;font-weight:500;color:var(--muted)}
    .price-card .price-desc{font-size:13px;color:var(--muted);margin-bottom:18px;line-height:1.5}
    .price-card ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:22px}
    .price-card li{font-size:13px;display:flex;align-items:center;gap:8px;color:var(--dark-3)}
    .price-card li::before{content:'✓';width:18px;height:18px;border-radius:5px;background:var(--green-bg);color:var(--green);display:grid;place-items:center;font-size:11px;font-weight:700;flex-shrink:0}

    .cta-sec{padding:64px 0}
    .cta-box{background:var(--dark);border-radius:var(--radius-xl);padding:52px 36px;color:white;text-align:center;position:relative;overflow:hidden}
    .cta-box::before{content:'';position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.06);top:-80px;right:-40px}
    .cta-box h3{font-family:'Source Serif 4',serif;font-size:clamp(24px,3.5vw,36px);letter-spacing:-.03em;margin-bottom:10px;position:relative}
    .cta-box p{color:var(--soft);font-size:15px;margin-bottom:24px;position:relative}

    .l-footer{border-top:1px solid var(--line);padding:28px 0;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:13px}
    .l-footer-links{display:flex;gap:18px}
    .l-footer-links span{cursor:pointer}.l-footer-links span:hover{color:var(--text)}

    /* ═══════ AUTH ═══════ */
    .auth-page{min-height:100vh;padding:16px;display:grid;place-items:center;background:var(--panel-2)}
    .auth-card{width:100%;max-width:440px;background:white;border:1px solid var(--line);border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:34px;animation:scaleIn .35s ease}
    .auth-card h3{font-family:'Source Serif 4',serif;font-size:28px;letter-spacing:-.03em;margin-bottom:6px}
    .auth-card .sub{color:var(--muted);font-size:14px;margin-bottom:24px;line-height:1.6}
    .auth-sep{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--soft);font-size:12px}
    .auth-sep::before,.auth-sep::after{content:'';flex:1;height:1px;background:var(--line)}

    /* ═══════ DASHBOARD ═══════ */
    .dash{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}
    .d-side{background:white;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:14px;gap:6px;position:sticky;top:0;height:100vh;overflow-y:auto}
    .d-side .nav{display:flex;flex-direction:column;gap:2px;flex:1;margin-top:8px}
    .d-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:var(--radius-xs);border:0;background:0;color:var(--muted);cursor:pointer;transition:.15s;width:100%;font-size:13px;font-weight:500}
    .d-nav:hover{background:var(--panel-2);color:var(--text)}
    .d-nav.active{background:var(--dark);color:white}
    .d-nav .nl{display:flex;align-items:center;gap:8px}
    .d-nav .nb{min-width:20px;height:20px;padding:0 5px;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;background:var(--panel-3);color:var(--dark-3);font-weight:600}
    .d-nav.active .nb{background:rgba(255,255,255,.15);color:white}
    .d-user{border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px;display:flex;align-items:center;gap:8px;margin-top:auto;cursor:pointer;transition:.15s}
    .d-user:hover{background:var(--panel-2)}
    .d-user .uname{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .d-user .urole{font-size:11px;color:var(--muted)}

    .d-main{background:var(--bg);padding:24px;overflow-y:auto}
    .d-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:24px;flex-wrap:wrap}
    .d-top h2{font-size:22px;letter-spacing:-.02em;font-weight:700}
    .d-top-actions{display:flex;gap:8px;flex-wrap:wrap}

    .metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
    .m-card{background:white;border:1px solid var(--line);border-radius:var(--radius-md);padding:18px;transition:.2s}
    .m-card:hover{box-shadow:var(--shadow-sm)}
    .m-card .ml{font-size:12px;color:var(--muted);margin-bottom:8px;display:flex;align-items:center;gap:5px}
    .m-card .mv{font-size:26px;font-weight:700;letter-spacing:-.03em}
    .m-card .mc{font-size:12px;margin-top:4px;display:flex;align-items:center;gap:3px}
    .m-card .mc.up{color:var(--green)}.m-card .mc.down{color:var(--red)}

    .d-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:16px}

    .chart-box{background:white;border:1px solid var(--line);border-radius:var(--radius-md);padding:20px}
    .chart-box h4{font-size:14px;font-weight:600;margin-bottom:4px}
    .chart-box .cs{font-size:12px;color:var(--muted);margin-bottom:18px}
    .bars{display:flex;align-items:flex-end;gap:6px;height:160px}
    .bar{flex:1;border-radius:5px 5px 0 0;transition:.3s height;min-width:0;cursor:pointer;position:relative}
    .bar.bar-up{background:var(--green)}.bar.bar-down{background:var(--red)}.bar.bar-mid{background:var(--yellow)}
    .bar:hover{opacity:.8;transform:scaleY(1.03);transform-origin:bottom}
    .bar-labels{display:flex;gap:6px;margin-top:6px}
    .bar-labels span{flex:1;font-size:10px;color:var(--soft);text-align:center}

    .recent{background:white;border:1px solid var(--line);border-radius:var(--radius-md);padding:20px}
    .recent h4{font-size:14px;font-weight:600;margin-bottom:14px}
    .r-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--panel-2)}
    .r-item:last-child{border-bottom:0}
    .r-left{display:flex;align-items:center;gap:8px;min-width:0}
    .r-left .rn{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .r-left .rp{font-size:11px;color:var(--muted)}
    .r-right{text-align:right;white-space:nowrap}
    .r-right .rv{font-weight:700;font-size:13px}

    /* products */
    .p-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
    .p-search{position:relative;width:280px;max-width:100%}
    .p-search input{width:100%;height:40px;border-radius:var(--radius-xs);border:1px solid var(--line);padding:0 12px 0 36px;outline:none;font-size:13px;transition:.15s}
    .p-search input:focus{border-color:var(--dark-3);box-shadow:0 0 0 3px rgba(17,17,16,.05)}
    .p-search .ico{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--soft);display:flex}
    .p-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
    .p-card{background:white;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;transition:.2s;cursor:pointer;position:relative}
    .p-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
    .p-img{height:150px;background:var(--panel-2);display:flex;align-items:center;justify-content:center;font-size:36px;position:relative;border-bottom:1px solid var(--line);overflow:hidden}
    .p-img img{width:100%;height:100%;object-fit:cover}
    .p-img .p-badge{position:absolute;top:10px;right:10px}
    .p-img .p-link-badge{position:absolute;top:10px;left:10px}
    .p-body{padding:14px}
    .p-body h5{font-size:14px;font-weight:600;margin-bottom:3px}
    .p-body .p-cat{font-size:11px;color:var(--muted);margin-bottom:8px}
    .p-body .p-row{display:flex;align-items:center;justify-content:space-between}
    .p-body .p-price{font-size:16px;font-weight:700;letter-spacing:-.02em}
    .p-body .p-stock{font-size:11px;color:var(--muted)}
    .p-card .p-actions{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transition:.2s}
    .p-card:hover .p-actions{opacity:1}
    .p-act-btn{width:30px;height:30px;border-radius:6px;border:0;background:rgba(255,255,255,.92);backdrop-filter:blur(4px);cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-sm)}
    .p-act-btn:hover{background:white}

    /* orders table */
    .o-table{width:100%;border-collapse:collapse;background:white;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}
    .o-table thead{background:var(--panel-2)}
    .o-table th{text-align:left;padding:12px 16px;font-size:12px;font-weight:600;color:var(--muted);border-bottom:1px solid var(--line);letter-spacing:.02em}
    .o-table td{padding:12px 16px;font-size:13px;border-bottom:1px solid var(--panel-2)}
    .o-table tr:last-child td{border-bottom:0}
    .o-table tr:hover td{background:var(--panel-2)}

    /* chat */
    .c-layout{display:grid;grid-template-columns:300px minmax(0,1fr);background:white;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;height:calc(100vh - 120px)}
    .c-list{border-right:1px solid var(--line);display:flex;flex-direction:column}
    .c-list-head{padding:14px;border-bottom:1px solid var(--panel-2)}
    .c-items{flex:1;overflow-y:auto;padding:6px}
    .c-item{display:flex;align-items:center;gap:8px;padding:10px;border-radius:var(--radius-xs);cursor:pointer;transition:.12s}
    .c-item:hover{background:var(--panel-2)}
    .c-item.active{background:var(--dark);color:white}
    .c-item .ci{min-width:0;flex:1}
    .c-item .ci .cn{font-weight:600;font-size:13px}
    .c-item .ci .cp{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
    .c-item.active .ci .cp{color:rgba(255,255,255,.6)}
    .c-item .ct{font-size:10px;color:var(--soft);white-space:nowrap}
    .c-item.active .ct{color:rgba(255,255,255,.5)}
    .c-view{display:flex;flex-direction:column}
    .c-head{padding:14px 18px;border-bottom:1px solid var(--panel-2);display:flex;align-items:center;justify-content:space-between}
    .c-body{flex:1;overflow-y:auto;padding:18px;background:linear-gradient(180deg,#fff,var(--panel-2));display:flex;flex-direction:column;gap:10px}
    .c-msg{display:flex}
    .c-msg.me{justify-content:flex-end}.c-msg.them{justify-content:flex-start}
    .c-bub{max-width:68%;padding:10px 14px;border-radius:18px;font-size:13px;line-height:1.65}
    .c-bub.them{background:white;border:1px solid var(--line);border-bottom-left-radius:6px}
    .c-bub.me{background:var(--dark);color:white;border-bottom-right-radius:6px}
    .c-bub .c-time{font-size:10px;color:var(--soft);margin-top:3px;text-align:right}
    .c-bub.me .c-time{color:rgba(255,255,255,.45)}
    .c-comp{padding:12px 18px;border-top:1px solid var(--panel-2);display:flex;gap:8px}
    .c-comp input{flex:1;height:40px;border-radius:var(--radius-xs);border:1px solid var(--line);padding:0 12px;outline:none;font-size:13px}
    .c-comp input:focus{border-color:var(--dark-3)}

    /* settings / configs */
    .s-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .s-card{background:white;border:1px solid var(--line);border-radius:var(--radius-md);padding:24px}
    .s-card h4{font-size:15px;font-weight:600;margin-bottom:4px;letter-spacing:-.01em}
    .s-card .sd{font-size:12px;color:var(--muted);margin-bottom:18px;line-height:1.6}
    .s-card.full{grid-column:1/-1}
    .s-card.danger{border-color:var(--red-line);background:var(--red-bg)}

    .pay-methods{display:flex;flex-direction:column;gap:12px}
    .pay-card{border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px;display:flex;align-items:center;gap:14px;transition:.15s;cursor:pointer;background:white}
    .pay-card:hover{border-color:var(--soft)}
    .pay-card.selected{border-color:var(--dark);box-shadow:0 0 0 1px var(--dark)}
    .pay-icon{width:48px;height:48px;border-radius:var(--radius-xs);display:grid;place-items:center;font-size:22px;flex-shrink:0;font-weight:700}
    .pay-icon.pix{background:var(--green-bg);color:var(--green)}
    .pay-icon.card{background:var(--blue-bg);color:var(--blue)}
    .pay-icon.boleto{background:var(--yellow-bg);color:var(--yellow)}
    .pay-icon.mp{background:var(--blue-bg);color:var(--blue)}
    .pay-info{flex:1;min-width:0}
    .pay-info h5{font-size:14px;font-weight:600;margin-bottom:2px}
    .pay-info p{font-size:12px;color:var(--muted);line-height:1.5}
    .pay-status{display:flex;align-items:center;gap:6px}

    .pay-config{margin-top:16px;padding:20px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-sm);animation:fadeUp .25s ease}
    .pay-config h5{font-size:14px;font-weight:600;margin-bottom:12px}

    .pix-keys{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
    .pix-key{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:white;border:1px solid var(--line);border-radius:var(--radius-xs)}
    .pix-key .pk-type{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
    .pix-key .pk-val{font-size:13px;font-weight:500}
    .pix-key .pk-del{background:0;border:0;color:var(--red);cursor:pointer;font-size:12px;font-weight:600}

    .fee-table{width:100%;border-collapse:collapse;font-size:13px;margin:12px 0}
    .fee-table th{text-align:left;padding:8px 0;color:var(--muted);font-weight:500;border-bottom:1px solid var(--line)}
    .fee-table td{padding:8px 0;border-bottom:1px solid var(--panel-2)}
    .fee-table td:last-child{text-align:right;font-weight:600}

    .color-row{display:flex;gap:8px;flex-wrap:wrap}
    .c-swatch{width:40px;height:40px;border-radius:var(--radius-xs);cursor:pointer;border:2px solid transparent;transition:.2s;box-shadow:0 2px 6px rgba(0,0,0,.15)}
    .c-swatch:hover{transform:scale(1.1);box-shadow:0 4px 12px rgba(0,0,0,.25)}
    .c-swatch.active{border-color:var(--text);box-shadow:0 0 0 2px rgba(17,17,16,.12),0 4px 12px rgba(0,0,0,.2)}

    .banner-drop{width:100%;height:120px;border:2px dashed var(--line);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:var(--soft);font-size:13px;cursor:pointer;transition:.15s;background:var(--panel-2);margin-bottom:14px}
    .banner-drop:hover{border-color:var(--soft)}

    .toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--panel-2)}
    .toggle-row:last-child{border-bottom:0}
    .toggle-row .tl{font-size:13px;font-weight:500}
    .toggle-row .td{font-size:11px;color:var(--muted);margin-top:1px}

    /* modal */
    .modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.32);z-index:50;display:none;place-items:center;padding:16px;backdrop-filter:blur(3px)}
    .modal-bg.open{display:grid}
    .modal{background:white;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:560px;max-height:88vh;overflow-y:auto;animation:scaleIn .2s ease;padding:28px}
    .modal h3{font-size:20px;letter-spacing:-.02em;margin-bottom:4px;font-weight:700}
    .modal .ms{font-size:13px;color:var(--muted);margin-bottom:20px}
    .modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
    .img-drop{width:100%;height:130px;border:2px dashed var(--line);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:var(--soft);font-size:13px;cursor:pointer;margin-bottom:14px;transition:.15s;overflow:hidden;position:relative}
    .img-drop:hover{border-color:var(--soft);background:var(--panel-2)}
    .img-drop img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
    .img-drop .img-drop-overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);display:none;align-items:center;justify-content:center;color:white;font-weight:600;font-size:13px}
    .img-drop:hover .img-drop-overlay{display:flex}

    /* store page */
    .st-hero{background:white;border-bottom:1px solid var(--line);padding-bottom:0}
    .st-banner{height:200px;border-radius:var(--radius-lg);margin-bottom:-44px;position:relative;overflow:hidden}
    .st-banner img{width:100%;height:100%;object-fit:cover}
    .st-prof{position:relative;z-index:2;display:flex;align-items:flex-end;gap:16px;padding:0 28px}
    .st-prof .avatar{border:3px solid white;box-shadow:var(--shadow)}
    .st-info h2{font-size:22px;letter-spacing:-.02em;margin-bottom:2px;font-weight:700}
    .st-info p{font-size:13px;color:var(--muted)}
    .st-tabs{display:flex;gap:2px;padding:0 28px;margin-top:20px}
    .st-tab{padding:10px 16px;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer;border:0;background:0;border-bottom:2px solid transparent;transition:.12s}
    .st-tab:hover{color:var(--text)}
    .st-tab.active{color:var(--text);border-color:var(--dark);font-weight:600}

    /* explore */
    .ex-hero{padding:40px 0;text-align:center}
    .ex-hero h2{font-family:'Source Serif 4',serif;font-size:clamp(26px,3.5vw,38px);letter-spacing:-.03em;margin-bottom:8px}
    .ex-hero p{color:var(--muted);font-size:14px}
    .ex-filters{display:flex;gap:6px;justify-content:center;margin:20px 0 32px;flex-wrap:wrap}
    .ex-chip{padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:white;font-size:12px;font-weight:500;cursor:pointer;transition:.15s}
    .ex-chip:hover{background:var(--panel-2)}
    .ex-chip.active{background:var(--dark);color:white;border-color:var(--dark)}
    .ex-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .ex-card{background:white;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;transition:.2s;cursor:pointer}
    .ex-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
    .ex-card-top{height:100px;position:relative}
    .ex-card-top .avatar{position:absolute;bottom:-16px;left:14px;border:2px solid white}
    .ex-card-body{padding:24px 14px 14px}
    .ex-card-body h5{font-size:14px;font-weight:600;margin-bottom:2px}
    .ex-card-body .ec-cat{font-size:11px;color:var(--muted);margin-bottom:8px}
    .ex-card-body .ec-stats{display:flex;gap:14px;font-size:11px;color:var(--muted)}
    .ex-card-body .ec-stats strong{color:var(--text)}

    /* coupon cards */
    .coupon-card{background:white;border:1px solid var(--line);border-radius:var(--radius-md);padding:18px;display:flex;align-items:center;gap:14px;transition:.2s;position:relative;overflow:hidden}
    .coupon-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px}
    .coupon-card.active-coupon::before{background:var(--green)}
    .coupon-card.expired-coupon::before{background:var(--red)}
    .coupon-card.scheduled-coupon::before{background:var(--yellow)}
    .coupon-code{font-family:monospace;font-size:16px;font-weight:700;letter-spacing:.05em;background:var(--panel-2);border:1px dashed var(--line);padding:8px 14px;border-radius:var(--radius-xs)}

    /* customer table */
    .cust-row{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--panel-2)}
    .cust-row:last-child{border-bottom:0}
    .cust-info{flex:1;min-width:0}
    .cust-info .cust-name{font-weight:600;font-size:14px}
    .cust-info .cust-email{font-size:12px;color:var(--muted)}
    .cust-stats{display:flex;gap:20px}
    .cust-stat{text-align:center}
    .cust-stat .cs-val{font-size:16px;font-weight:700}
    .cust-stat .cs-label{font-size:11px;color:var(--muted)}

    /* webhook / api */
    .api-key-box{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-xs);font-family:monospace;font-size:13px;margin-bottom:14px}
    .api-key-box span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .webhook-item{display:flex;align-items:center;gap:12px;padding:14px;background:white;border:1px solid var(--line);border-radius:var(--radius-xs);margin-bottom:8px}
    .webhook-item .wh-url{flex:1;font-family:monospace;font-size:12px;color:var(--dark-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

    .mobile-hamburger{display:none;width:38px;height:38px;border-radius:var(--radius-xs);border:1px solid var(--line);background:white;cursor:pointer;font-size:16px;place-items:center}
    .mob-overlay{position:fixed;inset:0;background:rgba(0,0,0,.28);z-index:40;display:none}
    .mob-overlay.open{display:block}
    .mob-side{position:fixed;top:0;left:0;width:min(82%,280px);height:100%;background:white;z-index:41;padding:14px;overflow-y:auto;animation:slideR .18s ease}

    /* drag handle */
    .drag-handle{cursor:grab;color:var(--soft);display:flex;align-items:center}
    .drag-handle:active{cursor:grabbing}

    @media(max-width:1040px){.metrics{grid-template-columns:repeat(2,1fr)}.d-grid{grid-template-columns:1fr}.s-grid{grid-template-columns:1fr}.hero-grid{grid-template-columns:1fr 1fr}.feat-inner{grid-template-columns:1fr;gap:28px}.c-layout{grid-template-columns:1fr;height:auto}.c-list{max-height:260px}.pricing-grid{grid-template-columns:1fr}}
    @media(max-width:800px){.dash{grid-template-columns:1fr}.d-side{display:none}.mobile-hamburger{display:grid}.l-links{display:none}.hero-grid,.ex-grid{grid-template-columns:1fr}}
    @media(max-width:600px){.d-main{padding:14px}.metrics{grid-template-columns:1fr}.hero{padding:40px 0 28px}.auth-card{padding:24px;border-radius:var(--radius-lg)}.p-toolbar{flex-direction:column;align-items:stretch}.p-search{width:100%}.s-grid{grid-template-columns:1fr}.l-footer{flex-direction:column;gap:12px;text-align:center}}

    /* ═══════ LOGO IMAGES ═══════ */
    /* ═══════ LOGO IMAGES ═══════ */
    .l-logo{width:38px;height:38px;border-radius:10px;background:#0a0a0a;display:grid;place-items:center;box-shadow:0 4px 12px rgba(0,0,0,.18);overflow:hidden;padding:5px}
    .l-logo img{width:100%;height:100%;object-fit:contain}
    .l-brand-text{display:flex;align-items:center}
    .l-brand-text img{height:18px;width:auto;object-fit:contain;filter:brightness(0);transition:filter .3s}

    /* ═══════ THEME TOGGLE ═══════ */
    .theme-toggle{position:relative}
    .theme-toggle .icon-moon{display:none}
    .theme-toggle .icon-sun{display:block}

    .floating-theme-toggle{
      position:fixed;bottom:24px;right:24px;z-index:99;
      width:48px;height:48px;border-radius:50%;border:1px solid var(--line);
      background:var(--panel);color:var(--text);cursor:pointer;
      display:grid;place-items:center;
      box-shadow:0 4px 20px rgba(0,0,0,.12);
      transition:all .3s cubic-bezier(.4,0,.2,1);
      backdrop-filter:blur(12px)
    }
    .floating-theme-toggle:hover{transform:scale(1.1);box-shadow:0 6px 28px rgba(0,0,0,.18)}
    .floating-theme-toggle:active{transform:scale(.95)}
    .floating-theme-toggle .icon-moon{display:none}
    .floating-theme-toggle .icon-sun{display:block}

    /* ═══════ DARK MODE ═══════ */
    [data-theme="dark"]{
      --bg:#0d0d0d;--panel:#1a1a1a;--panel-2:#141414;--panel-3:#222;
      --line:#2a2a2a;--text:#e5e5e5;--muted:#888;--soft:#666;
      --dark:#e5e5e5;--dark-2:#d4d4d4;--dark-3:#bbb;
      --white:#1a1a1a;
      --accent:#e5e5e5;--accent-hover:#d4d4d4;
      --green:#22c55e;--green-bg:rgba(34,197,94,.12);--green-line:rgba(34,197,94,.25);
      --red:#ef4444;--red-bg:rgba(239,68,68,.12);--red-line:rgba(239,68,68,.25);
      --blue:#3b82f6;--blue-bg:rgba(59,130,246,.12);--blue-line:rgba(59,130,246,.25);
      --yellow:#eab308;--yellow-bg:rgba(234,179,8,.12);--yellow-line:rgba(234,179,8,.25);
      --purple:#8b5cf6;--purple-bg:rgba(139,92,246,.12);--purple-line:rgba(139,92,246,.25);
      --orange:#f97316;--orange-bg:rgba(249,115,22,.12);--orange-line:rgba(249,115,22,.25);
      --shadow:0 1px 3px rgba(0,0,0,.3),0 12px 32px rgba(0,0,0,.3);
      --shadow-sm:0 1px 2px rgba(0,0,0,.2);
      --shadow-lg:0 4px 6px rgba(0,0,0,.2),0 24px 56px rgba(0,0,0,.4);
    }
    [data-theme="dark"] body{background:var(--bg);color:var(--text)}
    [data-theme="dark"] body::after{opacity:.015}

    /* nav */
    [data-theme="dark"] .l-nav{background:rgba(13,13,13,.88);border-bottom-color:rgba(42,42,42,.6)}

    /* buttons */
    [data-theme="dark"] .btn-primary{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .btn-primary:hover{background:#d4d4d4}
    [data-theme="dark"] .btn-accent{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .btn-accent:hover{background:#d4d4d4}
    [data-theme="dark"] .btn-ghost{background:transparent;border-color:var(--line);color:var(--text)}
    [data-theme="dark"] .btn-ghost:hover{background:var(--panel-2);border-color:var(--soft)}
    [data-theme="dark"] .btn-icon{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .btn-icon:hover{background:var(--panel-2)}

    /* cards & panels */
    [data-theme="dark"] .hero-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .hero-card:hover{box-shadow:0 8px 32px rgba(0,0,0,.3)}
    [data-theme="dark"] .card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .price-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .price-card:hover{box-shadow:0 8px 32px rgba(0,0,0,.3)}
    [data-theme="dark"] .price-card.featured{border-color:var(--text);box-shadow:0 8px 32px rgba(255,255,255,.06)}
    [data-theme="dark"] .price-card.featured::before{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .price-card li::before{background:var(--green-bg);color:var(--green)}

    /* feat section */
    [data-theme="dark"] .feat{border-top-color:var(--line)}
    [data-theme="dark"] .feat-visual{background:var(--panel-2);border-color:var(--line)}
    [data-theme="dark"] .feat-mock{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .feat-mock-bar{background:var(--panel-2);border-bottom-color:var(--line)}
    [data-theme="dark"] .feat-mock-bar i{background:var(--line)}
    [data-theme="dark"] .feat-check .ck{background:var(--panel-2);border-color:var(--line)}

    /* CTA */
    [data-theme="dark"] .cta-box{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .cta-box p{color:#555}
    [data-theme="dark"] .cta-box .btn{background:#0d0d0d!important;color:var(--text)!important}

    /* auth */
    [data-theme="dark"] .auth-page{background:var(--bg)}
    [data-theme="dark"] .auth-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .input-wrap input,
    [data-theme="dark"] .input-wrap select,
    [data-theme="dark"] .input-wrap textarea{background:var(--panel-2);border-color:var(--line);color:var(--text)}
    [data-theme="dark"] .input-wrap input:focus,
    [data-theme="dark"] .input-wrap select:focus,
    [data-theme="dark"] .input-wrap textarea:focus{border-color:var(--soft);box-shadow:0 0 0 3px rgba(255,255,255,.05)}
    [data-theme="dark"] .input-wrap input::placeholder,
    [data-theme="dark"] .input-wrap textarea::placeholder{color:var(--soft)}

    /* dashboard */
    [data-theme="dark"] .d-side{background:var(--panel);border-right-color:var(--line)}
    [data-theme="dark"] .d-nav:hover{background:var(--panel-2)}
    [data-theme="dark"] .d-nav.active{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .d-nav.active .nb{background:rgba(0,0,0,.15);color:#0d0d0d}
    [data-theme="dark"] .d-user{border-color:var(--line)}
    [data-theme="dark"] .d-user:hover{background:var(--panel-2)}
    [data-theme="dark"] .d-main{background:var(--bg)}
    [data-theme="dark"] .m-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .chart-box{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .recent{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .r-item{border-bottom-color:var(--panel-2)}
    /* bars use CSS vars that auto-adapt to dark mode */

    /* products */
    [data-theme="dark"] .p-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .p-card:hover{box-shadow:0 8px 32px rgba(0,0,0,.3)}
    [data-theme="dark"] .p-img{background:var(--panel-2);border-bottom-color:var(--line)}
    [data-theme="dark"] .p-search input{background:var(--panel);border-color:var(--line);color:var(--text)}
    [data-theme="dark"] .p-act-btn{background:rgba(26,26,26,.92);color:var(--text)}
    [data-theme="dark"] .p-act-btn:hover{background:var(--panel)}

    /* orders table */
    [data-theme="dark"] .o-table{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .o-table thead{background:var(--panel-2)}
    [data-theme="dark"] .o-table th{border-bottom-color:var(--line)}
    [data-theme="dark"] .o-table td{border-bottom-color:var(--panel-2)}
    [data-theme="dark"] .o-table tr:hover td{background:var(--panel-2)}

    /* chat */
    [data-theme="dark"] .c-layout{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .c-list{border-right-color:var(--line)}
    [data-theme="dark"] .c-list-head{border-bottom-color:var(--panel-2)}
    [data-theme="dark"] .c-item:hover{background:var(--panel-2)}
    [data-theme="dark"] .c-item.active{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .c-item.active .ci .cp{color:rgba(0,0,0,.5)}
    [data-theme="dark"] .c-body{background:linear-gradient(180deg,var(--panel),var(--panel-2))}
    [data-theme="dark"] .c-bub{background:var(--panel-2)}
    [data-theme="dark"] .c-head{border-bottom-color:var(--panel-2)}

    /* explore */
    [data-theme="dark"] .ex-chip{background:var(--panel);border-color:var(--line);color:var(--text)}
    [data-theme="dark"] .ex-chip:hover{background:var(--panel-2)}
    [data-theme="dark"] .ex-chip.active{background:var(--text);color:#0d0d0d;border-color:var(--text)}
    [data-theme="dark"] .ex-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .ex-card:hover{box-shadow:0 8px 32px rgba(0,0,0,.3)}

    /* store */
    [data-theme="dark"] .st-hero{background:var(--panel);border-bottom-color:var(--line)}
    [data-theme="dark"] .st-prof .avatar{border-color:var(--panel)}
    [data-theme="dark"] .st-tab:hover{color:var(--text)}
    [data-theme="dark"] .st-tab.active{color:var(--text);border-color:var(--text)}

    /* modals */
    [data-theme="dark"] .modal-bg{background:rgba(0,0,0,.6)}
    [data-theme="dark"] .modal{background:var(--panel);border:1px solid var(--line)}
    [data-theme="dark"] .img-drop{border-color:var(--line)}
    [data-theme="dark"] .img-drop:hover{border-color:var(--soft);background:var(--panel-2)}

    /* toast */
    [data-theme="dark"] .toast{background:var(--text);color:#0d0d0d}

    /* coupons */
    [data-theme="dark"] .coupon-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .coupon-code{background:var(--panel-2);border-color:var(--line)}

    /* customer */
    [data-theme="dark"] .cust-row{border-bottom-color:var(--panel-2)}

    /* webhooks / api */
    [data-theme="dark"] .api-key-box{background:var(--panel-2);border-color:var(--line)}
    [data-theme="dark"] .webhook-item{background:var(--panel);border-color:var(--line)}

    /* tabs */
    [data-theme="dark"] .tab-bar{border-bottom-color:var(--line)}
    [data-theme="dark"] .tab-btn.active{border-color:var(--text)}

    /* toggles */
    [data-theme="dark"] .toggle{background:var(--panel-3)}
    [data-theme="dark"] .toggle::after{background:var(--panel)}

    /* mobile */
    [data-theme="dark"] .mob-side{background:var(--panel)}
    [data-theme="dark"] .mobile-hamburger{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .banner-drop{background:var(--panel-2);border-color:var(--line)}

    /* divider */
    [data-theme="dark"] .divider{background:var(--line)}

    /* pricing section */
    [data-theme="dark"] .pricing{border-top-color:var(--line)}

    /* footer */
    [data-theme="dark"] .l-footer{border-top-color:var(--line)}

    /* logo inversion for dark mode */
    [data-theme="dark"] .l-logo{background:#1a1a1a;box-shadow:0 4px 12px rgba(0,0,0,.4)}
    [data-theme="dark"] .l-logo img{filter:none}
    [data-theme="dark"] .l-brand-text img{filter:none}
    [data-theme="dark"] .avatar.dark{background:var(--text);color:#0d0d0d;border-color:var(--text)}

    /* theme toggle icon swap */
    [data-theme="dark"] .theme-toggle .icon-sun,
    [data-theme="dark"] .floating-theme-toggle .icon-sun{display:none}
    [data-theme="dark"] .theme-toggle .icon-moon,
    [data-theme="dark"] .floating-theme-toggle .icon-moon{display:block}

    /* floating toggle dark */
    [data-theme="dark"] .floating-theme-toggle{background:var(--panel);border-color:var(--line);color:var(--text);box-shadow:0 4px 20px rgba(0,0,0,.4)}

    /* hero tag dark */
    [data-theme="dark"] .hero .tag{background:var(--text);color:#0d0d0d}

    /* select dark */
    [data-theme="dark"] select option{background:var(--panel);color:var(--text)}

    /* fee table */
    [data-theme="dark"] .fee-table th{border-bottom-color:var(--line)}
    [data-theme="dark"] .fee-table td{border-bottom-color:var(--panel-2)}

    /* toggle row */
    [data-theme="dark"] .toggle-row{border-bottom-color:var(--panel-2)}

    /* settings grid */
    [data-theme="dark"] .s-grid .chart-box{background:var(--panel);border-color:var(--line)}

    /* code block */
    .code-block{background:#0a0a0a;color:#e5e5e5}
    [data-theme="dark"] .code-block{background:#111;border:1px solid var(--line)}

    /* chat bubbles dark */
    [data-theme="dark"] .c-bub.them{background:var(--panel-2);border-color:var(--line)}
    [data-theme="dark"] .c-bub.me{background:var(--text);color:#0d0d0d}
    [data-theme="dark"] .c-bub.me .c-time{color:rgba(0,0,0,.4)}
    [data-theme="dark"] .c-comp{border-top-color:var(--panel-2)}
    [data-theme="dark"] .c-comp input{background:var(--panel-2);border-color:var(--line);color:var(--text)}

    /* settings cards dark */
    [data-theme="dark"] .s-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .s-card.danger{border-color:var(--red-line);background:var(--red-bg)}

    /* payment cards dark */
    [data-theme="dark"] .pay-card{background:var(--panel);border-color:var(--line)}
    [data-theme="dark"] .pay-card:hover{border-color:var(--soft)}
    [data-theme="dark"] .pay-card.selected{border-color:var(--text);box-shadow:0 0 0 1px var(--text)}
    [data-theme="dark"] .pay-config{background:var(--panel-2);border-color:var(--line)}
    [data-theme="dark"] .pix-key{background:var(--panel);border-color:var(--line)}

    /* store link card */
    .store-link-card{background:var(--dark);color:var(--white);border-color:var(--dark)!important}
    .store-link-card h4{color:var(--white)}
    .store-link-card .btn{background:var(--panel)!important;color:var(--text)!important}
    [data-theme="dark"] .store-link-card{background:var(--panel-2);color:var(--text);border-color:var(--line)!important}
    [data-theme="dark"] .store-link-card h4{color:var(--text)}

    /* smooth transition for theme change */
    *{transition:background-color .3s ease, border-color .3s ease, color .2s ease, box-shadow .3s ease}
    /* exclude animations from theme transition */
    .af,.af1,.af2,.af3,.af4,.bar,.btn:active{transition:none}