#loginScreen { display: none; }
#loginScreen.active { display: flex; }

    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@500;600;700&display=swap');
        * { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent }
    :root {
    --bg:#06060a;
    --bg1:#0b0b12;
    --bg2:#101018;
    --bg3:#16161f;
    --bg4:#1c1c28;
    
    /* Основные акцентные цвета */
    --bl4:#5b93f8;
    --bl5:#3574F4;
    --bl6:#1f57e9;
    --bl7:#1843d6;
    
    --blg1:rgba(53,116,244,.06);
    --blg2:rgba(53,116,244,.10);
    --blg3:rgba(53,116,244,.15);
    --blb:rgba(53,116,244,.18);
    --blbs:rgba(53,116,244,.30);
    
    --w:#fff;
    --w92:rgba(255,255,255,.92);
    --w70:rgba(255,255,255,.70);
    --w50:rgba(255,255,255,.50);
    --w30:rgba(255,255,255,.30);
    --w15:rgba(255,255,255,.15);
    --w08:rgba(255,255,255,.08);
    --w05:rgba(255,255,255,.05);
    --w03:rgba(255,255,255,.03);
    
    --grn:#2dd4a0;
    --grn-bg:rgba(45,212,160,.08);
    --grn-b:rgba(45,212,160,.15);
    --red:#f0506e;
    --red-bg:rgba(240,80,110,.08);
    --red-b:rgba(240,80,110,.12);
    --amb:#f5a623;
    --amb-bg:rgba(245,166,35,.08);
    --amb-b:rgba(245,166,35,.12);
    
    --font:'Inter',-apple-system,sans-serif;
    --mono:'JetBrains Mono',monospace;
    --ease:cubic-bezier(.4,0,.2,1);
    --spring:cubic-bezier(.34,1.56,.64,1);
    
    /* Новые акцентные переменные для удобства */
    --accent:#3574f4;
    --accent-g1:var(--blg1);
    --accent-g2:var(--blg2);
    --accent-g3:var(--blg3);
    --accent-border:var(--blb);
    --accent-strong:var(--blbs);
}

/* =========================================
   ТЕМАТИЧЕСКИЕ ПАЛИТРЫ
========================================= */

/* ТЕМА: СВЕТЛАЯ */
:root[data-theme="light"] {
    --bg:#f5f5f7;
    --bg1:#ffffff;
    --bg2:#ffffff;
    --bg3:#f0f0f3;
    --bg4:#e8e8ed;
    
    --w:#000000;
    --w92:rgba(0,0,0,.92);
    --w70:rgba(0,0,0,.70);
    --w50:rgba(0,0,0,.50);
    --w30:rgba(0,0,0,.40);
    --w15:rgba(0,0,0,.15);
    --w08:rgba(0,0,0,.08);
    --w05:rgba(0,0,0,.05);
    --w03:rgba(0,0,0,.03);
    
    --bl4:#0055ff;
    --bl5:#0044ee;
    --bl6:#0033cc;
    --bl7:#0022aa;
    
    --blg1:rgba(0,85,255,.09);
    --blg2:rgba(0,85,255,.14);
    --blg3:rgba(0,85,255,.20);
    --blb:rgba(0,85,255,.25);
    --blbs:rgba(0,85,255,.35);
    
    --accent:#0055ff;
    --accent-g1:var(--blg1);
    --accent-g2:var(--blg2);
    --accent-g3:var(--blg3);
    --accent-border:var(--blb);
    --accent-strong:var(--blbs);
}

/* ТЕМА: РОЗОВЫЙ НЕОН */
:root[data-theme="neon"] {
    --bg:#09000d;
    --bg1:#110018;
    --bg2:#180022;
    --bg3:#220030;
    --bg4:#2d0040;
    
    --bl4:#ff007f;
    --bl5:#ff1493;
    --bl6:#d10068;
    --bl7:#a30052;
    
    --blg1:rgba(255,20,147,.12);
    --blg2:rgba(255,20,147,.18);
    --blg3:rgba(255,20,147,.25);
    --blb:rgba(255,20,147,.35);
    --blbs:rgba(255,20,147,.50);
    
    --grn:#00f0ff;
    --grn-bg:rgba(0,240,255,.12);
    --grn-b:rgba(0,240,255,.25);
    
    --accent:#ff1493;
    --accent-g1:var(--blg1);
    --accent-g2:var(--blg2);
    --accent-g3:var(--blg3);
    --accent-border:var(--blb);
    --accent-strong:var(--blbs);
}

/* ТЕМА: CYBERPUNK (киберпанк — неоновый кибер-стиль) */
:root[data-theme="cyberpunk"] {
    --bg: #0c0022;
    --bg1: #14002f;
    --bg2: #1f0044;
    --bg3: #2a0066;
    --bg4: #3d0088;
    
    --bl4: #00f0ff;     /* основной неоновый циан */
    --bl5: #ff00aa;     /* неоновый маджента */
    --bl6: #00ff9f;
    --bl7: #ff00cc;
    
    --blg1: rgba(0,240,255,.15);
    --blg2: rgba(255,0,170,.18);
    --blg3: rgba(0,240,255,.25);
    --blb: rgba(0,240,255,.35);
    --blbs: rgba(255,0,170,.45);
    
    --accent: #00f0ff;
    --accent-g1: var(--blg1);
    --accent-g2: var(--blg2);
    --accent-g3: var(--blg3);
    --accent-border: var(--blb);
    --accent-strong: var(--blbs);
    
    --grn: #00ff9f;
    --grn-bg: rgba(0,255,159,.12);
    --grn-b: rgba(0,255,159,.25);
}

/* ТЕМА: ОСТРЫЕ КОЗЫРЬКИ (тёмный винтажный гангстерский стиль) */
:root[data-theme="peaky"] {
    --bg: #1c140f;
    --bg1: #251d18;
    --bg2: #2e261f;
    --bg3: #3a3229;
    --bg4: #4a4035;
    
    --bl4: #d4af77;     /* золото Пикки Блиндерс */
    --bl5: #c9a36a;
    --bl6: #b38f5c;
    --bl7: #9e7a4f;
    
    --blg1: rgba(212,175,119,.12);
    --blg2: rgba(212,175,119,.18);
    --blg3: rgba(212,175,119,.25);
    --blb: rgba(212,175,119,.35);
    --blbs: rgba(212,175,119,.45);
    
    --accent: #d4af77;
    --accent-g1: var(--blg1);
    --accent-g2: var(--blg2);
    --accent-g3: var(--blg3);
    --accent-border: var(--blb);
    --accent-strong: var(--blbs);
    
    --grn: #8b9e6e;     /* оливковый оттенок */
}

/* ТЕМА: МАМКИН ТЕМЩИК (исправленная читаемость) */
:root[data-theme="mamkin"] {
    --bg: #fff5f8;
    --bg1: #fffafc;
    --bg2: #fff5f8;
    --bg3: #ffeef4;
    --bg4: #ffe4ed;
    
    --bl4: #ff4d94;
    --bl5: #ff6ba8;
    --bl6: #ff2e7f;
    --bl7: #e81e6e;
    
    --blg1: rgba(255,77,148,.12);
    --blg2: rgba(255,77,148,.18);
    --blg3: rgba(255,77,148,.25);
    --blb: rgba(255,77,148,.30);
    --blbs: rgba(255,77,148,.40);
    
    --accent: #ff4d94;
    --accent-g1: var(--blg1);
    --accent-g2: var(--blg2);
    --accent-g3: var(--blg3);
    --accent-border: var(--blb);
    --accent-strong: var(--blbs);
    
    /* Тёмный текст для светлого фона */
    --w: #2c1f2e;
    --w92: rgba(44,31,46,.95);
    --w70: rgba(44,31,46,.80);
    --w50: rgba(44,31,46,.65);
    --w30: rgba(44,31,46,.45);
    --w15: rgba(44,31,46,.25);
    --w08: rgba(44,31,46,.12);
    --w05: rgba(44,31,46,.08);
}

/* === ИСПРАВЛЕНИЕ ЧИТАЕМОСТИ ДЛЯ МАМКИН ТЕМЩИК === */
:root[data-theme="mamkin"] .header,
:root[data-theme="mamkin"] .tab-bar {
    background: rgba(255,245,248,.92) !important;   /* нежно-розовый полупрозрачный */
    border-color: rgba(255,77,148,.18) !important;
    backdrop-filter: blur(24px) saturate(180%);
}

:root[data-theme="mamkin"] .logo-text {
    color: #2c1f2e !important;                      /* очень тёмный для контраста */
}

:root[data-theme="mamkin"] .tab-item {
    color: #6b4a5e !important;                      /* тёмно-розовый для неактивных вкладок */
}

:root[data-theme="mamkin"] .tab-item.active {
    color: #ff4d94 !important;                      /* яркий акцент для активной вкладки */
}

:root[data-theme="mamkin"] .tab-item.active::before {
    background: #ff4d94 !important;
}

/* Улучшаем контраст иконок и текстов */
:root[data-theme="mamkin"] .balance-label-text,
:root[data-theme="mamkin"] .qr-desc,
:root[data-theme="mamkin"] .section-title,
:root[data-theme="mamkin"] .quick-label,
:root[data-theme="mamkin"] .tx-time {
    color: #6b4a5e !important;
}

/* ТЕМА: ZOV (строгая милитари-зелёная) */
:root[data-theme="zov"] {
    --bg: #0f1a0f;
    --bg1: #162316;
    --bg2: #1f2c1f;
    --bg3: #2a382a;
    --bg4: #364536;
    
    --bl4: #4a7043;     /* армейский зелёный */
    --bl5: #5e8a55;
    --bl6: #3f5f38;
    --bl7: #2e4729;
    
    --blg1: rgba(74,112,67,.15);
    --blg2: rgba(74,112,67,.20);
    --blg3: rgba(74,112,67,.28);
    --blb: rgba(74,112,67,.40);
    --blbs: rgba(74,112,67,.55);
    
    --accent: #4a7043;
    --accent-g1: var(--blg1);
    --accent-g2: var(--blg2);
    --accent-g3: var(--blg3);
    --accent-border: var(--blb);
    --accent-strong: var(--blbs);
    
    --grn: #7cb16b;
}

        body {
    font-family:var(--font);
    background:var(--bg);
    color:var(--w92);
    min-height:100dvh;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    overscroll-behavior:none;
}

        .ambient {
    position:fixed;
    top:-80px;
    left:50%;
    transform:translateX(-50%);
    width:500px;
    height:260px;
    background:radial-gradient(ellipse,var(--accent-g1) 0%,transparent 70%);
    pointer-events:none;
    z-index:0;
}
        .app{position:relative;z-index:1;max-width:420px;margin:0 auto;padding-bottom:100px}
        .header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:rgba(6,6,10,.88);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid var(--w05)}
        :root[data-theme="light"] .header,
:root[data-theme="light"] .tab-bar {
    background: rgba(245,245,247,.88) !important;
    border-color: rgba(0,0,0,.08) !important;
}

:root[data-theme="neon"] .header,
:root[data-theme="neon"] .tab-bar {
    background: rgba(9,0,13,.88) !important;
}

        .header-left{display:flex;align-items:center;gap:10px}.logo-mark{width:34px;height:34px}.logo-mark svg{width:34px;height:34px}
        .logo-text{font-size:17px;font-weight:800;letter-spacing:-.5px;color:var(--w)}.logo-text span{background:linear-gradient(135deg,var(--bl4),var(--bl6));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
        .icon-btn{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:10px;color:var(--w30);cursor:pointer;transition:all 160ms}
        .icon-btn:active{background:var(--bg3);color:var(--w50);transform:scale(.92)}
        .icon-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .balance-card {
    margin:16px 20px 0;
    padding:28px 24px 24px;
    background:linear-gradient(135deg,var(--accent-g1),var(--accent-g2) 40%,var(--accent-g3));
    border:1px solid var(--accent-border);
    border-radius:24px;
    position:relative;
    overflow:hidden;
}

.balance-card::before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--accent-strong),transparent);
}

.balance-card::after {
    content:'';
    position:absolute;
    top:-60px;
    right:-60px;
    width:200px;
    height:200px;
    background:radial-gradient(circle,var(--accent-g1),transparent 65%);
    pointer-events:none;
}
.info-box {
    background:var(--accent-g1);
    border:1px solid var(--accent-border);
}
        .balance-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;position:relative;z-index:1}
        .balance-label{display:flex;align-items:center;gap:7px}
        .balance-label svg{width:14px;height:14px;fill:none;stroke:var(--bl4);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .pulse-dot{width:8px;height:8px;background:var(--grn);border-radius:50%;position:relative}
        .pulse-dot::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:1.5px solid var(--grn);opacity:0;animation:ping 2s ease-out infinite}
        @keyframes ping{0%{transform:scale(.8);opacity:.5}100%{transform:scale(2.2);opacity:0}}
        .balance-label-text{font-size:12px;font-weight:600;color:var(--w30);text-transform:uppercase;letter-spacing:1.2px}
        .balance-amount{position:relative;z-index:1;margin-bottom:6px}.balance-row{display:flex;align-items:baseline;gap:2px}
        .bal-curr{font-size:28px;font-weight:600;color:var(--w30);margin-right:2px}
        .bal-int{font-family:var(--mono);font-size:48px;font-weight:700;color:var(--w);letter-spacing:-3px;line-height:1}
        .bal-dec{font-family:var(--mono);font-size:28px;font-weight:600;color:var(--w30);letter-spacing:-1px}
        .balance-sub{font-size:13px;font-weight:500;color:var(--w30);margin-bottom:20px;position:relative;z-index:1;display:flex;align-items:center;gap:5px}
        .balance-sub svg{width:13px;height:13px;fill:none;stroke:var(--w15);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .balance-hold{font-size:12px;color:var(--amb);font-weight:600;margin-bottom:16px;position:relative;z-index:1;display:flex;align-items:center;gap:5px}
        .twin-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;z-index:1}
        .twin-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:none;border-radius:16px;font-family:var(--font);font-size:14px;font-weight:700;cursor:pointer;transition:all 180ms;letter-spacing:-.2px}
        .twin-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .twin-btn:active{transform:scale(.97)}
        .twin-btn-primary {
    background:linear-gradient(135deg,var(--bl5),var(--bl7));
    color:#fff;
    box-shadow:0 4px 20px var(--accent-strong),inset 0 1px 0 rgba(255,255,255,.12);
}
        .twin-btn-secondary{background:var(--w05);border:1px solid var(--w08);color:var(--w70)}.twin-btn-secondary:active{background:var(--w08)}
        .qr-banner{margin:16px 20px 0;padding:20px;background:var(--bg2);border:1px solid var(--w05);border-radius:20px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:all 180ms;position:relative;overflow:hidden}
        .qr-banner:active{transform:scale(.98);background:var(--bg3)}
        .qr-banner::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--w08),transparent)}
        .qr-icon-box {
    background:linear-gradient(135deg,var(--bl5),var(--bl7));
    box-shadow:0 4px 20px var(--accent-strong),inset 0 1px 0 rgba(255,255,255,.1);
}
        .qr-icon-box svg{width:28px;height:28px;fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
        .qr-icon-box::after{content:'';position:absolute;inset:-3px;border-radius:19px;border:1.5px solid rgba(53,116,244,.25);animation:qrP 2.5s ease-in-out infinite}
        @keyframes qrP{0%,100%{opacity:.3;transform:scale(1)}50%{opacity:0;transform:scale(1.12)}}
        .qr-content{flex:1;min-width:0}.qr-title{font-size:16px;font-weight:700;color:var(--w);margin-bottom:4px;letter-spacing:-.3px;display:flex;align-items:center;gap:6px}
        .qr-title svg{width:14px;height:14px;fill:none;stroke:var(--bl4);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .qr-desc{font-size:13px;color:var(--w30);font-weight:500;display:flex;align-items:center;gap:5px}
        .qr-desc svg{width:13px;height:13px;fill:none;stroke:var(--w15);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;flex-shrink:0}
        .qr-arrow svg{width:20px;height:20px;fill:none;stroke:var(--w15);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 20px 0}
        .quick-item{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px 14px;background:var(--bg2);border:1px solid var(--w05);border-radius:16px;cursor:pointer;transition:all 180ms;text-align: center}
        .quick-item:active{transform:scale(.96);background:var(--bg3)}
        .quick-icon{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center}
        .quick-icon svg{width:18px;height:18px;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .quick-icon-blue {
    background:var(--accent-g1);
    border:1px solid var(--accent-border);
}

.quick-icon-blue svg { stroke:var(--bl4); }
        .quick-icon-amber{background:var(--amb-bg);border:1px solid var(--amb-b)}.quick-icon-amber svg{stroke:var(--amb)}
        .quick-icon-green{background:var(--grn-bg);border:1px solid var(--grn-b)}.quick-icon-green svg{stroke:var(--grn)}
        .quick-label{font-size:11px;font-weight:600;color:var(--w30);text-align: center}
        .section{margin:24px 20px 0}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
        .section-title{font-size:13px;font-weight:700;color:var(--w30);text-transform:uppercase;letter-spacing:.8px;display:flex;align-items:center;gap:6px}
        .section-title svg{width:15px;height:15px;fill:none;stroke:var(--w15);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .section-action{font-size:12px;font-weight:600;color:var(--bl4);cursor:pointer;background:none;border:none;font-family:var(--font);padding:4px 10px;border-radius:6px;transition:background 150ms;display:flex;align-items:center;gap:4px}
        .section-action svg{width:12px;height:12px;fill:none;stroke:var(--bl4);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .section-action:active{background:var(--blg1)}
        .card{background:var(--bg2);border:1px solid var(--w05);border-radius:20px;overflow:hidden;position:relative}
        .card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--w08),transparent)}
        .tx-row{display:flex;align-items:center;gap:12px;padding:14px 16px;transition:background 150ms}
        .tx-row:not(:last-child){border-bottom:1px solid var(--w03)}
        .tx-dot{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}
        .tx-dot-pay{background:var(--blg2);border:1px solid var(--blb)}.tx-dot-topup{background:var(--grn-bg);border:1px solid var(--grn-b)}
        .tx-dot-withdrawal{background:var(--red-bg);border:1px solid var(--red-b)}.tx-dot-check{background:var(--amb-bg);border:1px solid var(--amb-b)}
        .tx-info{flex:1;min-width:0}.tx-name{font-size:14px;font-weight:600;color:var(--w92);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
        .tx-time{font-size:12px;color:var(--w15);font-weight:500}
        .tx-end{text-align:right;flex-shrink:0}.tx-val{font-family:var(--mono);font-size:14px;font-weight:600;margin-bottom:2px}
        .tx-val-plus{color:var(--grn)}.tx-val-minus{color:var(--w70)}
        .tx-sub{font-size:11px;color:var(--w15);font-weight:500}
        .empty-state{text-align:center;padding:40px 20px}.empty-state-text{font-size:13px;color:var(--w15)}
        .tab-bar{position:fixed;bottom:0;left:0;width:100%;background:rgba(6,6,10,.92);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-top:1px solid var(--w05);padding-bottom:env(safe-area-inset-bottom,0);z-index:100}
        .tab-bar-inner{max-width:420px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);height:60px}
        .tab-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:none;font-family:var(--font);color:var(--w15);cursor:pointer;transition:color 200ms;position:relative}
        .tab-item.active{color:var(--bl4)}.tab-item.active::before{content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:24px;height:2px;background:var(--bl4);border-radius:0 0 2px 2px}
        .tab-item svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
        .tab-item-text{font-size:10px;font-weight:600}
        .tab-qr{display:flex;align-items:center;justify-content:center;border:none;background:none;cursor:pointer;padding:0}
        .tab-qr-inner,
.btn-blue {
    background:linear-gradient(135deg,var(--bl5),var(--bl7));
    box-shadow:0 4px 24px var(--accent-strong),inset 0 1px 0 rgba(255,255,255,.12);
}
        .tab-qr-inner:active{transform:scale(.88)}.tab-qr-inner svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
        .screen{display:none}.screen.active{display:block;animation:fadeUp 280ms var(--ease)}
        @keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
        .toast {
    position: fixed;
    top: 20px;              /* чуть выше, чтобы не перекрывалось шапкой */
    left: 50%;
    transform: translateX(-50%) translateY(-100px); /* выше, чем было */
    background: var(--bg3);
    border: 1px solid var(--w08);
    border-radius: 14px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 10000;         /* выше всех модалок, оверлеев и шторок */
    transition: transform 280ms cubic-bezier(0.32, 0.72, 0, 1), visibility 200ms;
    visibility: hidden;     /* скрыт по умолчанию */
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    max-width: calc(100vw - 40px);
    pointer-events: none;   /* чтобы не мешать нажатиям под ним */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.toast.show {
    transform: translateX(-50%) translateY(0);
    visibility: visible;
    pointer-events: auto;   /* восстанавливаем только когда виден */
}
        .toast-icon{font-size:16px;flex-shrink:0}.toast span{font-size:13px;font-weight:600;color:var(--w92)}
        .confetti-container{position:fixed;inset:0;pointer-events:none;z-index:500;overflow:hidden}
        .confetti-piece{position:absolute;border-radius:1px;animation:cF 1.3s var(--ease) forwards}
        @keyframes cF{0%{transform:translateY(-10px) rotate(0) scale(1);opacity:1}100%{transform:translateY(100vh) rotate(600deg) scale(.4);opacity:0}}
        .overlay-full{display:none;position:fixed;inset:0;background:rgba(6,6,10,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);z-index:300;align-items:center;justify-content:center;flex-direction:column;gap:20px}
        .overlay-full.active{display:flex;animation:fi 200ms ease}@keyframes fi{from{opacity:0}to{opacity:1}}
        .proc-ring{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;font-size:28px}
        .proc-ring-spin{background:var(--blg3);border:1px solid var(--blb)}.proc-ring-spin::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:2.5px solid transparent;border-top-color:var(--bl4);animation:sp .8s linear infinite}
        @keyframes sp{to{transform:rotate(360deg)}}
        .proc-ring-ok{background:var(--grn-bg);border:2px solid var(--grn-b);animation:pI 400ms var(--spring)}
        .proc-ring-err{background:var(--red-bg);border:2px solid var(--red-b);animation:pI 400ms var(--spring)}
        @keyframes pI{0%{transform:scale(0)}100%{transform:scale(1)}}
        .proc-title{font-size:20px;font-weight:800;letter-spacing:-.5px}.proc-desc{font-size:14px;color:var(--w30);font-weight:500;text-align:center;max-width:280px;line-height:1.5}
        .loading-dots{display:flex;gap:5px;justify-content:center}.loading-dots span{width:5px;height:5px;background:var(--bl4);border-radius:50%;animation:dP 1.2s ease-in-out infinite}
        .loading-dots span:nth-child(2){animation-delay:.15s}.loading-dots span:nth-child(3){animation-delay:.3s}
        @keyframes dP{0%,80%,100%{opacity:.2;transform:scale(.7)}40%{opacity:1;transform:scale(1)}}
        /* SHEET */
        .sheet-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:250;align-items:flex-end;justify-content:center}
        .sheet-overlay.active{display:flex;animation:fi 200ms ease}
        .sheet{width:100%;max-width:420px;background:var(--bg1);border-radius:24px 24px 0 0;border:1px solid var(--w08);border-bottom:none;animation:sU 380ms cubic-bezier(.32,.72,0,1);max-height:94vh;overflow-y:auto;overscroll-behavior:contain}
        @keyframes sU{from{transform:translateY(100%)}to{transform:translateY(0)}}
        .sheet-handle{width:32px;height:3px;background:var(--w08);border-radius:2px;margin:10px auto 0}.sheet-body{padding:20px 20px 36px}
        .pay-center{text-align:center}.pay-icon{font-size:48px;margin-bottom:12px}
        .pay-title{font-size:18px;font-weight:700;color:var(--w92);letter-spacing:-.3px;margin-bottom:4px}
        .pay-subtitle{font-size:13px;color:var(--w30);margin-bottom:20px}
        .pay-amount-section{padding:24px 0;margin:0 0 20px;border-top:1px solid var(--w05);border-bottom:1px solid var(--w05);text-align:center}
        .pay-amount-label{font-size:10px;font-weight:700;color:var(--w08);text-transform:uppercase;letter-spacing:1.2px;margin-bottom:8px}
        .pay-amount-big{font-family:var(--mono);font-size:44px;font-weight:700;color:var(--w);letter-spacing:-3px;line-height:1;margin-bottom:8px}
        .pay-amount-crypto{font-size:14px;color:var(--w30);font-weight:500}.pay-amount-crypto em{font-style:normal;color:var(--bl4);font-weight:700}
        .pay-details{background:var(--bg3);border:1px solid var(--w05);border-radius:12px;overflow:hidden;margin-bottom:20px}
        .pay-detail-row{display:flex;justify-content:space-between;align-items:center;padding:11px 14px}
        .pay-detail-row:not(:last-child){border-bottom:1px solid var(--w03)}
        .pay-detail-key{font-size:13px;color:var(--w30);font-weight:500}.pay-detail-val{font-size:13px;color:var(--w92);font-weight:600;font-family:var(--mono)}
        .pay-detail-val-grn{color:var(--grn)}.pay-detail-val-red{color:var(--red)}
        .btn-primary{width:100%;padding:15px 24px;border:none;border-radius:14px;font-family:var(--font);font-size:15px;font-weight:700;color:#fff;cursor:pointer;transition:all 200ms;letter-spacing:-.2px;position:relative;overflow:hidden}
        .btn-primary:active{transform:scale(.98);filter:brightness(.9)}.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none;filter:none}
        .btn-primary-inner{display:flex;align-items:center;justify-content:center;gap:8px}
        .btn-blue{background:linear-gradient(135deg,var(--bl5),var(--bl7));box-shadow:0 4px 16px rgba(53,116,244,.2),inset 0 1px 0 rgba(255,255,255,.1)}
        .btn-green{background:linear-gradient(135deg,var(--grn),#16a085);box-shadow:0 4px 16px rgba(45,212,160,.2),inset 0 1px 0 rgba(255,255,255,.1)}
        .btn-red{background:linear-gradient(135deg,var(--red),#c0392b);box-shadow:0 4px 16px rgba(240,80,110,.2),inset 0 1px 0 rgba(255,255,255,.1)}
        .btn-ghost{width:100%;padding:13px;background:none;border:1px solid var(--w08);border-radius:12px;font-family:var(--font);font-size:14px;font-weight:600;color:var(--w30);cursor:pointer;margin-top:8px;transition:all 150ms;display:flex;align-items:center;justify-content:center;gap:6px}
        .btn-ghost:active{background:var(--bg3)}
        /* FORM */
        .form-group{margin-bottom:16px}
        .form-label{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--w15);text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px}
        .form-input{width:100%;padding:13px 14px;background:var(--bg3);border:1.5px solid var(--w08);border-radius:12px;color:var(--w92);font-family:var(--mono);font-size:18px;font-weight:600;outline:none;transition:all 200ms}
        .form-input:focus{border-color:var(--blbs);box-shadow:0 0 0 3px var(--blg1)}
        .form-input::placeholder{color:var(--w15);font-family:var(--font);font-weight:500;font-size:14px}
        .form-hint{font-size:12px;color:var(--w15);margin-top:6px;display:flex;align-items:center;gap:4px}
        .form-hint-red{color:var(--red)}
        .info-box{display:flex;gap:12px;padding:14px 16px;background:var(--blg1);border:1px solid var(--blb);border-radius:12px;margin-bottom:20px}
        .info-box-text{font-size:13px;color:var(--w50);line-height:1.55}.info-box-text strong{color:var(--bl4);font-weight:700}
        .info-box-icon{font-size:18px;flex-shrink:0}
        /* PROFILE */
        .profile-section{padding:32px 20px 0;text-align:center}
        .profile-avatar{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,var(--bl5),var(--bl7));display:flex;align-items:center;justify-content:center;margin:0 auto 14px;position:relative}
        .profile-avatar::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--blb)}
        .profile-avatar-text{font-size:32px;font-weight:800;color:#fff}
        .profile-name{font-size:22px;font-weight:800;color:var(--w);letter-spacing:-.5px;margin-bottom:4px}
        .profile-handle{font-size:14px;font-weight:500;color:var(--bl4);margin-bottom:20px}
        .profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 20px 20px}
        .profile-stat{padding:14px 8px;background:var(--bg2);border:1px solid var(--w05);border-radius:14px;text-align:center}
        .profile-stat-val{font-family:var(--mono);font-size:18px;font-weight:700;color:var(--w92);margin-bottom:2px}
        .profile-stat-label{font-size:10px;font-weight:600;color:var(--w15);text-transform:uppercase;letter-spacing:.5px}
        .profile-info{margin:0 20px;background:var(--bg2);border:1px solid var(--w05);border-radius:20px;overflow:hidden;position:relative}
        .profile-info::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--w08),transparent)}
        .profile-info-row{display:flex;align-items:center;gap:12px;padding:14px 16px}
        .profile-info-row:not(:last-child){border-bottom:1px solid var(--w03)}
        .profile-info-key{font-size:13px;color:var(--w30);font-weight:500;flex:1}
        .profile-info-val{font-size:13px;color:var(--w92);font-weight:600;font-family:var(--mono)}
        .profile-menu{margin:20px}.profile-menu-item{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--bg2);border:1px solid var(--w05);border-radius:14px;margin-bottom:8px;cursor:pointer;transition:all 180ms}
        .profile-menu-item:active{background:var(--bg3);transform:scale(.98)}
        .pm-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:16px}
        .pm-icon-blue{background:var(--blg1);border:1px solid var(--blb)}.pm-icon-red{background:var(--red-bg);border:1px solid var(--red-b)}.pm-icon-grn{background:var(--grn-bg);border:1px solid var(--grn-b)}.pm-icon-amb{background:var(--amb-bg);border:1px solid var(--amb-b)}
        .pm-body{flex:1}.pm-name{font-size:14px;font-weight:600;color:var(--w92)}.pm-desc{font-size:12px;color:var(--w15);margin-top:1px}
        .pm-arrow{color:var(--w08);font-size:16px}
        .profile-ver{text-align:center;font-size:11px;color:var(--w08);padding:8px 0}
        @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

        /* STATS SCREEN */
        .stats-period-btns{display:flex;gap:8px;margin:16px 20px 0}
        .stats-period-btn{padding:10px 14px;background:var(--bg2);border:1px solid var(--w05);border-radius:12px;font-family:var(--font);font-size:13px;font-weight:600;color:var(--w30);cursor:pointer;transition:all 150ms;flex:1}
        .stats-period-btn.active{background:var(--blg2);border-color:var(--blb);color:var(--bl4)}
        .stats-period-btn:active{transform:scale(.97)}
        .stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:16px 20px}
        .stats-card{padding:16px;background:var(--bg2);border:1px solid var(--w05);border-radius:16px;text-align:center}
        .stats-card-label{font-size:11px;font-weight:600;color:var(--w15);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
        .stats-card-value{font-family:var(--mono);font-size:20px;font-weight:700}
        .stats-card-value.green{color:var(--grn)}
        .stats-card-value.red{color:var(--red)}
        .stats-card-value.blue{color:var(--bl4)}
        .stats-card-sub{font-size:11px;color:var(--w30);margin-top:2px}
        .chart-container{height:200px;position:relative;margin-top:8px}
        .pie-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;justify-content:center}
        .pie-legend-item{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:500;color:var(--w50)}
        .pie-legend-dot{width:8px;height:8px;border-radius:50%}

        /* HISTORY FILTERS */
        .filters-row{display:flex;gap:6px;margin:16px 20px 0;overflow-x:auto;padding-bottom:4px}
        .filters-row::-webkit-scrollbar{display:none}
        .filter-chip{padding:8px 12px;background:var(--bg2);border:1px solid var(--w05);border-radius:10px;font-family:var(--font);font-size:12px;font-weight:600;color:var(--w30);cursor:pointer;white-space:nowrap;transition:all 150ms}
        .filter-chip:active,.filter-chip.active{background:var(--blg2);border-color:var(--blb);color:var(--bl4)}
        .filter-params{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 20px}
        .filter-params input{width:100%;padding:10px 12px;background:var(--bg3);border:1.5px solid var(--w08);border-radius:10px;color:var(--w92);font-family:var(--font);font-size:13px;outline:none}
        .filter-params input:focus{border-color:var(--blbs)}
        .filter-params input::placeholder{color:var(--w15)}
        .filter-params label{font-size:10px;font-weight:700;color:var(--w15);text-transform:uppercase;letter-spacing:.8px;margin-bottom:4px;display:block}
        .filter-actions{display:flex;gap:8px;margin:0 20px 16px}
        .filter-actions button{flex:1;padding:12px;border-radius:12px;font-family:var(--font);font-size:13px;font-weight:700;cursor:pointer;transition:all 150ms}
        .filter-apply{background:linear-gradient(135deg,var(--bl5),var(--bl7));border:none;color:#fff}
        .filter-clear{background:none;border:1px solid var(--w08);color:var(--w30)}
        .filter-apply:active{filter:brightness(.9)}
        .filter-clear:active{background:var(--bg2)}

        /* REFERRAL SCREEN */
        .ref-link-card {
    background:linear-gradient(135deg,var(--accent-g1),var(--accent-g2) 40%,var(--accent-g3));
    border:1px solid var(--accent-border);
}
        .ref-link-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(53,116,244,.35),transparent)}
        .ref-link-card::after {
    background:radial-gradient(circle,var(--accent-g1),transparent 65%);
}
        .ref-link-label{font-size:11px;font-weight:700;color:var(--w15);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;position:relative;z-index:1}
        .ref-link-box{display:flex;align-items:center;gap:8px;padding:12px;background:var(--bg3);border:1px solid var(--w08);border-radius:12px;margin-bottom:10px;position:relative;z-index:1}
        .ref-link-text{flex:1;font-family:var(--mono);font-size:12px;color:var(--w92);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
        .ref-copy-btn{padding:8px 14px;background:linear-gradient(135deg,var(--bl5),var(--bl7));border:none;border-radius:8px;font-family:var(--font);font-size:12px;font-weight:700;color:#fff;cursor:pointer}
        .ref-copy-btn:active{transform:scale(.95)}
        .ref-share-hint{font-size:12px;color:var(--w30);text-align:center;position:relative;z-index:1}
        .ref-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 20px}
        .ref-level-card{padding:16px 8px;background:var(--bg2);border:1px solid var(--w05);border-radius:16px;text-align:center}
        .ref-level-num{font-size:10px;font-weight:700;color:var(--w08);text-transform:uppercase;letter-spacing:.8px;margin-bottom:4px}
        .ref-level-count{font-family:var(--mono);font-size:26px;font-weight:700;color:var(--w92)}
        .ref-level-label{font-size:11px;font-weight:600;color:var(--w15);margin-top:2px}
        .ref-earnings{margin:0 20px 16px;padding:20px;background:var(--bg2);border:1px solid var(--w05);border-radius:20px;position:relative}
        .ref-earnings::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--w08),transparent)}
        .ref-earnings-title{font-size:12px;font-weight:700;color:var(--w30);text-transform:uppercase;letter-spacing:.8px;margin-bottom:14px}
        .ref-earnings-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0}
        .ref-earnings-row:not(:last-child){border-bottom:1px solid var(--w03)}
        .ref-earnings-label{font-size:13px;color:var(--w50)}
        .ref-earnings-value{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--grn)}
        .ref-rates{margin:0 20px 16px;padding:16px;background:var(--blg1);border:1px solid var(--blb);border-radius:14px}
        .ref-rates-title{font-size:11px;font-weight:700;color:var(--bl4);text-transform:uppercase;letter-spacing:.8px;margin-bottom:12px}
        .ref-rate-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0}
        .ref-rate-level{font-size:13px;color:var(--w70)}
        .ref-rate-value{font-family:var(--mono);font-size:14px;font-weight:700;color:var(--w92)}
.quick-item.disabled {
  opacity: 0.5;
  pointer-events: none;      /* отключает любые клики */
  cursor: default;
  filter: grayscale(0.1);
}

/* Переключатели (switch) */
.switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 26px;
}
.switch input { opacity: 0; width: 0; height: 0; }
.slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--w08);
    transition: .3s;
    border-radius: 9999px;
}
.slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background: var(--w);
    transition: .3s;
    border-radius: 50%;
}
input:checked + .slider { background: var(--bl4); }
input:checked + .slider:before { transform: translateX(22px); }

/* Модальное окно (не sheets) */
.modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
}

.modal-overlay.active { display: flex; }

.chat-modal {
    width: 100%;
    max-width: 450px;
    height: 80vh;
    background: var(--bg2);
    border: 1px solid var(--blb);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: modalFadeIn 0.2s ease-out;
}

@keyframes modalFadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

.modal-header {
    padding: 16px;
    background: var(--bg3);
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--blb);
}

.chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 12px; /* Уменьшили общий отступ контейнера */
    display: flex;
    flex-direction: column;
    gap: 10px;      /* Уменьшили расстояние между сообщениями */
}

.msg {
    width: fit-content;       /* Облачко строго по размеру текста */
    max-width: 80%;
    padding: 10px 14px;
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.4;
    
    /* Исправление выхода текста за пределы */
    overflow-wrap: anywhere;  /* Перенос даже очень длинных ссылок/слов */
    word-break: break-word;
}
.msg.user {
    align-self: flex-end;
    background: var(--bl6);
    color: #fff;
    border-bottom-right-radius: 4px;
}
.msg.support {
    align-self: flex-start;
    background: var(--bg4);
    color: var(--w92);
    border-bottom-left-radius: 4px;
}

.chat-input-area {
    padding: 12px;
    background: var(--bg3);
    display: flex;
    gap: 8px;
    border-top: 1px solid var(--blb);
}

#chatInput {
    flex: 1;
    background: var(--bg);
    border: 1px solid var(--blb);
    border-radius: 10px;
    padding: 10px 14px;
    color: var(--w);
    outline: none;
}

#sendMessageBtn {
    background: var(--bl5);
    border: none;
    border-radius: 10px;
    width: 42px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn_install {
  width: 100%;
  padding: 15px 24px;
  border: none;
  border-radius: 14px;
  font-family: var(--font);
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  cursor: pointer;
  background: linear-gradient(135deg, var(--bl5), var(--bl7));
  box-shadow: 0 4px 16px rgba(53,116,244,0.2), inset 0 1px 0 rgba(255,255,255,0.1);
  transition: all 200ms;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn_install:active {
  transform: scale(0.98);
  filter: brightness(0.9);
}

#camVideo {
  width: 100%;
  max-width: 420px;
  border-radius: 16px;
}

.camera-scanner {
  position: fixed;
  inset: 0;
  background: #000;
  z-index: 2500;
  overflow: hidden;
}

.scanner-video {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Зеркалирование убрано – естественный вид */
}

.scanner-overlay {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
}

.scanner-top-cover,
.scanner-bottom-cover {
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
}

.scanner-top-cover {
  height: 20%;
}

.scanner-bottom-cover {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding-top: 30px;
  background: rgba(0, 0, 0, 0.6);
}

.scanner-middle {
  display: flex;
  align-items: center;
  width: 100%;
  height: 250px; /* под размер рамки */
}

.scanner-left-cover,
.scanner-right-cover {
  flex: 1;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}

.scanner-frame {
  width: 250px;
  height: 250px;
  border: 2px solid rgba(255, 255, 255, 0.4);
  border-radius: 20px;
  position: relative;
  overflow: hidden;
  background: transparent;
  box-shadow: 0 0 0 2000px rgba(0, 0, 0, 0.35); /* затемнение вне рамки */
}

.scanner-line {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--bl4), transparent);
  animation: scannerMove 2.5s ease-in-out infinite;
}

@keyframes scannerMove {
  0% { top: 0; }
  50% { top: calc(100% - 2px); }
  100% { top: 0; }
}

.scanner-hint {
  font-family: var(--font);
  font-size: 15px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.85);
  text-align: center;
  pointer-events: auto;
}

.scanner-close {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 2;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  font-size: 24px;
  color: #fff;
  cursor: pointer;
  transition: background 0.2s;
  backdrop-filter: blur(10px);
}
.scanner-close:active {
  background: rgba(0, 0, 0, 0.7);
}

.info-modal {
  max-width: 360px;
  width: 90%;
  background: var(--bg2);
  border: 1px solid var(--blb);
  border-radius: 20px;
  animation: modalFadeIn 0.2s ease-out;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.info-modal-body {
  padding: 20px;
  color: var(--w92);
  font-size: 14px;
  line-height: 1.6;
}

.info-modal-body p {
  margin-bottom: 12px;
}

.info-modal-body strong {
  color: var(--bl4);
}

.info-modal-buttons {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#infoModal {
  z-index: 10000 !important;
}

.scanner-controls {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    z-index: 10;
}
.scanner-torch-btn {
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 50%;
    width: 56px;
    height: 56px;
    font-size: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    color: white;
}
.scanner-torch-btn:active {
    transform: scale(0.9);
    background: rgba(0,0,0,0.8);
}
.scanner-bounding-box {
    position: absolute;
    border: 2px solid #5b93f8;
    box-shadow: 0 0 0 2000px rgba(0,0,0,0.4);
    border-radius: 8px;
    z-index: 5;
    pointer-events: none;
    transition: all 0.1s linear;
}
.camera-error-panel {
    position: absolute;
    bottom: 20%;
    left: 20px;
    right: 20px;
    background: rgba(0,0,0,0.85);
    backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 20px;
    text-align: center;
    z-index: 15;
    border: 1px solid rgba(255,255,255,0.2);
}
.error-icon { font-size: 48px; margin-bottom: 12px; }
.error-title { font-size: 18px; font-weight: 800; margin-bottom: 8px; color: #f0506e; }
.error-text { font-size: 14px; color: rgba(255,255,255,0.7); margin-bottom: 20px; }
.error-close-btn {
    background: #3574f4;
    border: none;
    border-radius: 40px;
    padding: 12px 20px;
    font-weight: bold;
    color: white;
    width: 100%;
}

.form-hint-green {
    color: var(--grn);
}