:root{--bg:#0c0a07;--bg-2:#13100b;--ink:#d9cfb8;--ink-d:#a89e87;--muted:#6e6650;--line:#1f1a12;--line-2:#2a2419;--accent:#8b0a1a;--accent-2:#b8222a;--ok:#3eda7a;--bad:#ff4b3a;--ban:#ffa500}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--ink);font-family:"Exo 2",system-ui,sans-serif;font-size:14px;line-height:1.5;min-height:100vh}
body{background-image:radial-gradient(ellipse 60% 40% at 50% 0%,rgba(139,10,26,.06),transparent 60%)}
a{color:inherit;text-decoration:none}
.mono,code{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;background:rgba(0,0,0,.4);padding:1px 6px}
.container{max-width:1280px;margin:0 auto;padding:0 28px;position:relative;z-index:3}
.hide{display:none !important}

.nav{border-bottom:1px solid var(--line);background:rgba(8,6,4,.92);backdrop-filter:blur(8px);position:sticky;top:0;z-index:50}
.nav-row{display:flex;align-items:center;gap:24px;padding:20px 0}
.brand{display:flex;align-items:center;gap:10px;flex-shrink:0}
.brand-mark{width:52px;height:52px;color:var(--accent-2);flex-shrink:0;filter:drop-shadow(0 4px 14px rgba(184,34,42,.45))}
.brand-mark svg{width:100%;height:100%;display:block}
.brand-text{display:flex;flex-direction:column;line-height:1.05}
.brand-text .b1{font-family:"UnifrakturCook",serif;font-size:20px;color:var(--ink);font-weight:700}
.brand-text .b2{font-family:"Exo 2",sans-serif;font-size:8px;letter-spacing:.32em;color:var(--muted);text-transform:uppercase;margin-top:3px}

.tabs{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.tab{font-family:"Exo 2",sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-d);font-weight:600;background:transparent;border:1px solid transparent;padding:10px 16px;cursor:pointer;transition:.15s}
.tab:hover{color:var(--ink);background:rgba(255,255,255,.02)}
.tab.active{color:var(--ink);border-color:var(--line-2);background:linear-gradient(180deg,rgba(139,10,26,.18),rgba(0,0,0,.4));position:relative}
.tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent-2)}

.main{padding:36px 0 60px}
.pane{display:none;animation:fade .25s ease}
.pane.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1}}

h1{font-family:"Exo 2",sans-serif;font-size:36px;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1.05;margin-bottom:24px}
h1 em{color:var(--accent-2);font-style:italic;font-weight:600}
h3{font-family:"Exo 2",sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink);margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line-2);display:flex;justify-content:space-between;align-items:center;gap:10px}
h3 .tag{font-family:"Exo 2",sans-serif;font-size:10px;letter-spacing:.2em;color:var(--accent-2);font-weight:600;padding:3px 9px;border:1px solid var(--accent)}
h4{font-family:"Exo 2",sans-serif;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink);margin-bottom:8px}
.muted{color:#b8ad92;font-size:13.5px;line-height:1.6}
.ctr{text-align:center}

.head-row{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px}
.kpis{display:flex;gap:8px;flex-wrap:wrap}
.kpi{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line-2);padding:8px 18px;min-width:80px;background:rgba(0,0,0,.25)}
.kpi b{font-family:"Exo 2",sans-serif;font-size:22px;font-weight:800;color:var(--ink);line-height:1}
.kpi i{font-family:"Exo 2",sans-serif;font-size:9px;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);font-style:normal;margin-top:4px}
.kpi.ok b{color:var(--ok)}
.kpi.bad b{color:var(--bad)}
.kpi.ban b{color:var(--ban)}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:980px){.grid-2,.grid-3{grid-template-columns:1fr}}

.card{border:1px solid var(--line-2);background:linear-gradient(180deg,transparent,rgba(0,0,0,.2));padding:24px;position:relative}
.card.mini{padding:20px}
.card.mini h4{margin-bottom:10px}
.card.mini .btn{margin-top:14px;font-size:10px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;font-family:"Exo 2",sans-serif;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;background:transparent;color:var(--ink);border:1px solid var(--line-2);cursor:pointer;transition:.15s;position:relative}
.btn:hover:not(:disabled){background:rgba(139,10,26,.15);border-color:var(--accent)}
.btn.solid{background:var(--accent);border-color:var(--accent);color:#f7eedd}
.btn.solid:hover:not(:disabled){background:#5a0610;border-color:#5a0610}
.btn.ghost{color:var(--ink-d)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.row{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}

.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px;border:1.5px dashed var(--line-2);background:rgba(0,0,0,.2);text-align:center;cursor:pointer;transition:.15s;gap:6px}
.drop:hover,.drop.dragover{border-color:var(--accent);background:rgba(139,10,26,.08)}
.drop-ico{font-size:32px;color:var(--accent-2);line-height:1;margin-bottom:8px}
.drop u{color:var(--accent-2);text-decoration:none;border-bottom:1px dashed var(--accent-2)}
.drop-sub{font-size:10px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase;margin-top:6px}

.progress{margin-top:14px}
.bar{height:6px;background:rgba(255,255,255,.05);overflow:hidden}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));width:0;transition:.3s}
.bar-text{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-d);margin-top:6px;letter-spacing:.04em}

.form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.form.col{flex-direction:column;align-items:stretch;gap:12px}
.form.col label{display:flex;flex-direction:column;gap:5px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.inp{flex:1;min-width:0;padding:10px 14px;background:rgba(0,0,0,.4);border:1px solid var(--line-2);color:var(--ink);font-family:"JetBrains Mono",monospace;font-size:13px;outline:none;transition:.15s}
.inp:focus{border-color:var(--accent)}
.form-msg{margin-top:10px;font-size:12px;color:var(--ink-d);min-height:18px}
.form-msg.err{color:var(--bad)}
.form-msg.ok{color:var(--ok)}

.filter{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.chip{padding:5px 12px;border:1px solid var(--line-2);background:transparent;color:var(--ink-d);font-family:"Exo 2",sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:.15s}
.chip:hover{color:var(--ink);border-color:var(--accent)}
.chip.active{background:var(--accent);border-color:var(--accent);color:#f7eedd}

.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{font-family:"Exo 2",sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:600;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line-2)}
.tbl td{padding:10px;border-bottom:1px dashed var(--line-2);color:var(--ink-d)}
.tbl tr:hover td{background:rgba(139,10,26,.04);color:var(--ink)}
.tbl .st{font-family:"Exo 2",sans-serif;font-size:9px;letter-spacing:.25em;text-transform:uppercase;font-weight:700;padding:3px 8px;border:1px solid currentColor;display:inline-block}
.tbl .st.valid{color:var(--ok)}
.tbl .st.invalid{color:var(--bad)}
.tbl .st.banned{color:var(--ban)}
.tbl .st.unknown{color:var(--muted)}
.tbl .x{cursor:pointer;color:var(--muted);font-family:"JetBrains Mono",monospace;font-size:14px;padding:4px 8px;transition:.15s}
.tbl .x:hover{color:var(--bad)}

.lic-key{font-family:"JetBrains Mono",monospace;font-size:14px;color:var(--ink-d);background:rgba(0,0,0,.4);padding:12px 16px;border:1px dashed var(--line-2);margin-bottom:14px}

.log{max-height:280px;overflow:auto;font-family:"JetBrains Mono",monospace;font-size:12px;line-height:1.5;background:rgba(0,0,0,.3);padding:14px;border:1px solid var(--line-2)}
.log-row{color:var(--ink-d);padding:2px 0}
.log-row .t{color:var(--muted);margin-right:10px}
.log-row .k{color:var(--accent-2);margin-right:10px;text-transform:uppercase;font-size:10px;letter-spacing:.15em}

.card.mini .inp,.card.mini textarea.inp{margin-bottom:8px;width:100%}
.card.mini .run{margin-top:10px;width:100%}
textarea.inp{resize:vertical;font-family:"Exo 2",sans-serif;font-size:13px}
select.inp{cursor:pointer;font-family:"Exo 2",sans-serif}

.output-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.output-list .of{padding:12px;border:1px solid var(--line-2);background:rgba(0,0,0,.25);font-family:"JetBrains Mono",monospace;font-size:12px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.output-list .of a{color:var(--accent-2);text-decoration:none;border-bottom:1px dashed var(--accent-2)}
.output-list .of .meta{color:var(--muted);font-size:10px;letter-spacing:.1em}

.console{position:fixed;right:24px;bottom:24px;width:520px;max-height:60vh;background:#0a0805;border:1px solid var(--accent);box-shadow:0 18px 60px rgba(0,0,0,.6);z-index:200;display:flex;flex-direction:column}
.console-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line-2);background:linear-gradient(180deg,rgba(139,10,26,.2),transparent)}
.console-title{font-family:"Exo 2",sans-serif;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent-2);font-weight:700}
.console-meta{flex:1;font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-d)}
.console .x{background:transparent;border:1px solid var(--line-2);color:var(--ink-d);font-family:monospace;cursor:pointer;padding:3px 9px;font-size:14px;line-height:1}
.console .x:hover{color:var(--bad);border-color:var(--bad)}
.console-body{padding:12px 14px;font-family:"JetBrains Mono",monospace;font-size:11px;line-height:1.55;color:var(--ink-d);overflow:auto;flex:1;background:rgba(0,0,0,.4)}
.console-body div{padding:1px 0}
.console-result{padding:10px 14px;border-top:1px solid var(--line-2);font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--ok);background:rgba(0,0,0,.5)}
.console-result:empty{display:none}
@media (max-width:720px){.console{right:8px;left:8px;bottom:8px;width:auto;max-height:70vh}}

/* === PREMIUM POLISH === */
html{scroll-behavior:smooth}
.btn{overflow:hidden}
.btn .shine{position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.15),transparent);transform:skewX(-22deg);pointer-events:none;transition:.7s ease}
.btn:hover .shine{left:160%}
.card{transition:border-color .25s, box-shadow .35s, transform .25s}
.card:hover{border-color:rgba(139,10,26,.4)}
.kpi{transition:transform .2s, border-color .25s, background .25s}
.kpi:hover{transform:translateY(-2px);border-color:rgba(139,10,26,.45);background:rgba(139,10,26,.05)}
.tab{transition:.18s cubic-bezier(.2,.7,.2,1)}
.tab:hover{transform:translateY(-1px)}
.drop{transition:border-color .25s, background .25s, transform .25s}
.drop:active{transform:scale(.99)}
.chip{transition:transform .18s, border-color .2s, background .2s}
.chip:hover{transform:translateY(-1px)}
.tbl tr{transition:background .15s}
.tbl .st{transition:background .2s}
.output-list .of{transition:border-color .2s, background .2s, transform .2s}
.output-list .of:hover{border-color:rgba(139,10,26,.45);background:rgba(139,10,26,.04);transform:translateY(-1px)}
.console{animation:console-in .25s cubic-bezier(.2,.7,.2,1)}
@keyframes console-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.pane.active{animation:fade-in .35s cubic-bezier(.2,.7,.2,1)}
@keyframes fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
.brand-mark{transition:transform .35s, color .25s}
.brand:hover .brand-mark{transform:rotate(-4deg) scale(1.06);color:#d83440}

/* Top progress bar */
.scroll-bar{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));z-index:60;transition:width .12s linear;box-shadow:0 0 12px rgba(184,34,42,.5)}

/* Toast */
.toast-wrap{position:fixed;top:74px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:120;pointer-events:none}
.toast{padding:12px 18px;background:#0d0a07;border:1px solid var(--line-2);border-left:3px solid var(--accent-2);font-family:"Exo 2",sans-serif;font-size:13px;color:var(--ink);box-shadow:0 18px 50px -20px rgba(0,0,0,.6);animation:toast-in .3s cubic-bezier(.2,.7,.2,1);max-width:340px;pointer-events:auto}
.toast.ok{border-left-color:var(--ok)}
.toast.err{border-left-color:var(--bad)}
.toast.warn{border-left-color:var(--ban)}
@keyframes toast-in{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}

/* Empty state */
.empty{padding:36px 18px;text-align:center;color:var(--muted);font-family:"Exo 2",sans-serif;font-size:13px;font-style:italic}
.empty::before{content:"❦";display:block;font-size:22px;color:var(--accent-2);margin-bottom:10px;opacity:.5}

/* === TOOLTIPS & RECOMMEND PILLS === */
.field{position:relative;display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field-head{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-d);font-family:"Exo 2",sans-serif}
.field-head .req{color:var(--accent-2);font-weight:700}
.tt{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid var(--line-2);border-radius:50%;font-size:10px;color:var(--ink-d);cursor:help;font-family:"JetBrains Mono",monospace;background:rgba(255,255,255,.02);transition:.18s;user-select:none}
.tt:hover{color:var(--accent-2);border-color:var(--accent-2)}
.tt[data-tip]{position:relative}
.tt[data-tip]:hover::after{content:attr(data-tip);position:absolute;right:22px;left:auto;top:-4px;width:280px;max-width:calc(100vw - 60px);padding:10px 12px;background:#0d0a07;border:1px solid var(--line-2);border-right:2px solid var(--accent-2);border-left:none;color:var(--ink);font-size:12px;line-height:1.4;font-family:"Exo 2",sans-serif;font-weight:400;letter-spacing:normal;text-transform:none;z-index:50;box-shadow:0 14px 40px -16px rgba(0,0,0,.7);white-space:normal;pointer-events:none}
.recommend-btn{font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:3px 8px;border:1px dashed rgba(184,34,42,.4);background:rgba(184,34,42,.04);color:var(--accent-2);cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.18s;border-radius:0}
.recommend-btn:hover{background:rgba(184,34,42,.12);border-style:solid;color:#ff8b92}
.recommend-btn.applied{color:var(--ok);border-color:rgba(86,179,107,.5)}
.preset-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.preset-chip{font-size:10.5px;padding:4px 9px;border:1px solid var(--line-2);background:rgba(255,255,255,.02);color:var(--ink-d);cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.15s}
.preset-chip:hover{border-color:var(--accent-2);color:var(--accent-2);background:rgba(184,34,42,.05)}
.field-foot{font-size:10.5px;color:var(--muted);font-family:"Exo 2",sans-serif}

/* Smart-fill banner */
.smart-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;margin-bottom:14px;background:linear-gradient(90deg,rgba(184,34,42,.08),rgba(184,34,42,.02));border:1px solid rgba(184,34,42,.25);border-left:3px solid var(--accent-2);font-size:12px;color:var(--ink);font-family:"Exo 2",sans-serif}
.smart-banner b{color:var(--accent-2)}
.fill-all-btn{padding:6px 12px;background:var(--accent-2);color:#fff;border:none;font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.18s}
.fill-all-btn:hover{background:var(--accent);box-shadow:0 4px 14px -4px rgba(184,34,42,.5)}

/* === SUBSCRIPTION BUILDER === */
.sub-builder{display:grid;grid-template-columns:1fr 320px;gap:24px}
@media (max-width:900px){.sub-builder{grid-template-columns:1fr}}
.mod-card{display:flex;align-items:center;gap:14px;padding:11px 16px;border:1px solid transparent;background:rgba(255,255,255,.02);margin-bottom:4px;cursor:pointer;transition:.15s;font-family:"Exo 2",sans-serif}
.mod-card:hover{background:rgba(255,255,255,.05)}
.mod-card.selected{background:rgba(255,255,255,.04);border-left:3px solid #56b36b;padding-left:13px}
.mod-card .mod-name{font-weight:500;font-size:14px;color:var(--ink-d);flex:1}
.mod-card.selected .mod-name{color:var(--ink)}
.mod-card .mod-price{font-family:"JetBrains Mono",monospace;font-size:12px;color:rgba(255,255,255,.35);min-width:88px;text-align:right}
.mod-card.selected .mod-price{color:#9be0ab}
.mod-check{width:18px;height:18px;border:1.5px solid rgba(255,255,255,.18);display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:transparent;transition:.15s;border-radius:3px}
.mod-card.selected .mod-check{background:#56b36b;border-color:#56b36b;color:#fff}

.builder-toolbar{display:flex;gap:8px;margin:0 0 14px 0;flex-wrap:wrap;align-items:center}
.builder-toolbar .mini-btn{padding:5px 11px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:transparent;border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.15s}
.builder-toolbar .mini-btn:hover{border-color:#fff;color:#fff}
.builder-toolbar .sel-info{margin-left:auto;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.45);font-family:"JetBrains Mono",monospace}
.day-presets{display:flex;gap:6px;margin:6px 0 8px 0;flex-wrap:wrap}
.day-presets .dp{padding:5px 12px;font-size:11px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.6);cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.15s}
.day-presets .dp:hover{color:#fff;border-color:rgba(255,255,255,.3)}
.day-presets .dp.active{background:#56b36b;border-color:#56b36b;color:#fff}
.match-hint{margin:10px 0 14px 0;padding:10px 14px;background:rgba(86,179,107,.08);border-left:3px solid #56b36b;font-size:12px;color:#9be0ab;font-family:"Exo 2",sans-serif}
.match-hint b{color:#fff}
.quote-box{position:sticky;top:80px;padding:22px;border:1px solid var(--line-2);background:rgba(255,255,255,.02)}
.quote-row{display:flex;justify-content:space-between;align-items:baseline;padding:8px 0;border-bottom:1px dashed var(--line-2);font-family:"Exo 2",sans-serif;font-size:13px;color:var(--ink-d)}
.quote-row:last-of-type{border-bottom:none}
.quote-row b{font-family:"JetBrains Mono",monospace;color:var(--ink)}
.quote-total{font-size:28px;font-weight:700;color:var(--accent-2);font-family:"JetBrains Mono",monospace;margin-top:14px}
.quote-discount{color:var(--ok);font-size:12px;font-family:"JetBrains Mono",monospace}
.quote-note{font-size:10.5px;color:rgba(255,255,255,.42);font-family:"JetBrains Mono",monospace;margin-top:6px;letter-spacing:.04em;line-height:1.5}
.days-slider{width:100%;-webkit-appearance:none;appearance:none;height:5px;background:var(--line-2);outline:none;margin:10px 0 6px;border-radius:999px}
.days-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:radial-gradient(circle at 35% 30%,#ff8b92,var(--accent-2));cursor:pointer;border-radius:50%;border:2px solid #1a0608;box-shadow:0 2px 8px rgba(184,34,42,.5)}
.days-slider::-moz-range-thumb{width:18px;height:18px;background:radial-gradient(circle at 35% 30%,#ff8b92,var(--accent-2));cursor:pointer;border:2px solid #1a0608;border-radius:50%;box-shadow:0 2px 8px rgba(184,34,42,.5)}

/* === ПАКЕТЫ === */
.packages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:30px}
@media (max-width:900px){.packages-grid{grid-template-columns:1fr}}
.pkg{position:relative;padding:24px 22px;border:1px solid var(--line-2);background:rgba(255,255,255,.02);font-family:"Exo 2",sans-serif;transition:.22s;cursor:pointer;overflow:hidden}
.pkg::before{content:'';position:absolute;left:0;top:0;width:100%;height:3px;background:var(--pkg-color,var(--accent-2))}
.pkg:hover{transform:translateY(-3px);border-color:var(--pkg-color,var(--accent-2));box-shadow:0 14px 40px -18px rgba(0,0,0,.6)}
.pkg.recommended{border-color:var(--pkg-color,var(--accent-2));background:linear-gradient(180deg,rgba(184,34,42,.05),transparent 60%);padding-top:36px}
.pkg.recommended::after{content:'РЕКОМЕНДУЕМ';position:absolute;top:12px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#e34a4a,var(--pkg-color,var(--accent-2)));color:#fff;font-size:9px;letter-spacing:.18em;padding:5px 14px;border-radius:999px;font-family:"JetBrains Mono",monospace;font-weight:700;box-shadow:0 4px 14px -4px rgba(184,34,42,.55),inset 0 0 0 1px rgba(255,255,255,.18);white-space:nowrap}
.pkg-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.pkg-name{font-size:22px;font-weight:700;letter-spacing:.02em;color:var(--ink)}
.pkg-price{font-family:"JetBrains Mono",monospace;font-size:24px;font-weight:700;color:var(--pkg-color,var(--accent-2));white-space:nowrap}
.pkg-price small{font-size:11px;color:var(--ink-d);font-weight:400;display:block;text-align:right;margin-top:-4px}
.pkg-tagline{font-size:13px;color:var(--ink-d);margin-bottom:14px;font-style:italic}
.pkg-features{list-style:none;padding:0;margin:0 0 18px 0}
.pkg-features li{font-size:12.5px;color:var(--ink);padding:5px 0 5px 22px;position:relative;border-bottom:1px dashed rgba(255,255,255,.04)}
.pkg-features li::before{content:'✓';position:absolute;left:0;color:var(--pkg-color,var(--ok));font-weight:700}
.pkg-buy{width:100%;padding:11px;background:transparent;color:var(--pkg-color,var(--accent-2));border:1px solid var(--pkg-color,var(--accent-2));font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:.18s}
.pkg-buy:hover{background:var(--pkg-color,var(--accent-2));color:#fff}

/* === AI BUTTON === */
.ai-tune-bar{display:flex;gap:8px;align-items:center;padding:10px 12px;margin-bottom:14px;background:linear-gradient(90deg,rgba(80,120,255,.08),rgba(184,34,42,.04));border:1px solid rgba(120,140,255,.22);border-left:3px solid #7d9aff;font-family:"Exo 2",sans-serif}
.ai-tune-bar input{flex:1;background:rgba(0,0,0,.25);border:1px solid var(--line-2);color:var(--ink);padding:9px 12px;font-family:"Exo 2",sans-serif;font-size:13px;outline:none;transition:.18s}
.ai-tune-bar input:focus{border-color:#7d9aff;background:rgba(0,0,0,.4)}
.ai-tune-btn{padding:9px 16px;background:linear-gradient(135deg,#7d9aff,#b87aff);color:#fff;border:none;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:.18s;white-space:nowrap;font-weight:700}
.ai-tune-btn:hover{box-shadow:0 6px 22px -6px rgba(125,154,255,.7);transform:translateY(-1px)}
.ai-tune-btn:disabled{opacity:.5;cursor:wait}
.ai-stack{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ai-stack-item{font-size:10.5px;padding:4px 9px;background:rgba(125,154,255,.1);border:1px solid rgba(125,154,255,.3);color:#bccaff;font-family:"JetBrains Mono",monospace;display:flex;align-items:center;gap:6px}
.ai-stack-item .x{cursor:pointer;color:#ff8b92}
.ai-mix-add{font-size:10.5px;padding:4px 9px;background:transparent;border:1px dashed rgba(125,154,255,.3);color:#7d9aff;cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.15s}
.ai-mix-add:hover{background:rgba(125,154,255,.08);border-style:solid}
.ai-explain{margin-top:8px;padding:8px 12px;background:rgba(125,154,255,.06);border-left:2px solid #7d9aff;font-size:12px;color:var(--ink);font-family:"Exo 2",sans-serif;line-height:1.45}

/* === АДМИН-ПАНЕЛЬ === */
.adm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:24px}
.adm-stat{padding:16px;border:1px solid var(--line-2);background:rgba(255,255,255,.02);text-align:center;font-family:"Exo 2",sans-serif}
.adm-stat b{display:block;font-size:26px;font-weight:700;color:var(--accent-2);font-family:"JetBrains Mono",monospace}
.adm-stat i{font-size:11px;color:var(--ink-d);font-style:normal;text-transform:uppercase;letter-spacing:.14em}
.adm-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line-2);margin-bottom:18px}
.adm-tab{padding:10px 18px;background:transparent;border:none;color:var(--ink-d);cursor:pointer;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;border-bottom:2px solid transparent;transition:.18s}
.adm-tab:hover{color:var(--ink)}
.adm-tab.active{color:var(--accent-2);border-bottom-color:var(--accent-2)}
.adm-pane{display:none}
.adm-pane.active{display:block}
.adm-search{display:flex;gap:8px;margin-bottom:12px}
.adm-search .inp{flex:1}
.adm-table{width:100%;border-collapse:collapse;font-family:"Exo 2",sans-serif;font-size:13px}
.adm-table th{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line-2);color:var(--ink-d);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.adm-table td{padding:10px 8px;border-bottom:1px dashed rgba(255,255,255,.04);color:var(--ink)}
.adm-table tr:hover td{background:rgba(255,255,255,.02)}
.adm-badge{display:inline-block;padding:2px 8px;font-size:10px;font-family:"JetBrains Mono",monospace;letter-spacing:.1em;text-transform:uppercase}
.adm-badge.active{background:rgba(86,179,107,.12);color:var(--ok);border:1px solid rgba(86,179,107,.4)}
.adm-badge.banned{background:rgba(216,52,64,.12);color:var(--bad);border:1px solid rgba(216,52,64,.4)}
.adm-badge.suspended,.adm-badge.expired,.adm-badge.revoked{background:rgba(255,174,0,.1);color:var(--ban);border:1px solid rgba(255,174,0,.35)}
.adm-actions{display:flex;gap:4px;flex-wrap:wrap}
.adm-act{padding:4px 8px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;background:transparent;border:1px solid var(--line-2);color:var(--ink-d);cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.15s}
.adm-act:hover{color:var(--ink);border-color:var(--ink-d)}
.adm-act.danger:hover{color:var(--bad);border-color:var(--bad)}
.adm-act.ok:hover{color:var(--ok);border-color:var(--ok)}

/* AI кнопка на месте recommend */
.field-head .ai-mini{padding:3px 8px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;background:linear-gradient(135deg,rgba(125,154,255,.15),rgba(184,122,255,.1));border:1px dashed rgba(125,154,255,.4);color:#9ab1ff;cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.18s}
.field-head .ai-mini:hover{background:linear-gradient(135deg,#7d9aff,#b87aff);color:#fff;border-style:solid}

/* === ПРЕДПРОСМОТР: METRICS BARS === */
.preview-panel{margin-top:10px;padding:14px;border:1px solid var(--line-2);background:rgba(125,154,255,.04);border-left:3px solid #7d9aff;animation:fade-in .3s}
.preview-panel.compare{background:rgba(255,255,255,.02)}
.preview-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-family:"Exo 2",sans-serif}
.preview-title{font-size:13px;font-weight:600;color:var(--ink);letter-spacing:.04em;display:flex;align-items:center;gap:8px}
.preview-via{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-d);font-family:"JetBrains Mono",monospace}
.metric{margin-bottom:10px;font-family:"Exo 2",sans-serif}
.metric-head{display:flex;justify-content:space-between;align-items:baseline;font-size:11.5px;color:var(--ink-d);margin-bottom:4px;letter-spacing:.06em}
.metric-head .name{text-transform:uppercase;letter-spacing:.14em;font-size:10.5px}
.metric-head .val{font-family:"JetBrains Mono",monospace;font-size:13px;font-weight:700;color:var(--ink)}
.metric-bar{position:relative;height:8px;background:rgba(255,255,255,.05);overflow:hidden;border:1px solid rgba(255,255,255,.04)}
.metric-bar .fill{position:absolute;top:0;left:0;height:100%;transition:width .8s cubic-bezier(.2,.7,.2,1);background:linear-gradient(90deg,var(--m-from,#56b36b),var(--m-to,#7d9aff))}
.metric-bar .fill::after{content:'';position:absolute;top:0;right:0;width:14px;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4));animation:bar-pulse 2.5s ease-in-out infinite}
@keyframes bar-pulse{0%,100%{opacity:.4}50%{opacity:1}}

/* цвет под метрику */
.metric.m-stability{--m-from:#3ea85a;--m-to:#56b36b}
.metric.m-speed{--m-from:#7d9aff;--m-to:#5870e0}
.metric.m-reach{--m-from:#b87aff;--m-to:#9460e0}
.metric.m-load{--m-from:#ffae00;--m-to:#ff8a00}
.metric.m-risk{--m-from:#ff6b56;--m-to:#d8344c}

.preview-explain{margin-top:10px;padding:8px 12px;background:rgba(0,0,0,.2);font-size:12px;color:var(--ink);font-family:"Exo 2",sans-serif;line-height:1.45;border-left:2px solid #7d9aff}

/* Сравнение конфигов: бары рядом */
.cmp-row{display:grid;grid-template-columns:90px 1fr;gap:10px;align-items:center;margin-bottom:6px;font-family:"Exo 2",sans-serif}
.cmp-row .lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-d)}
.cmp-bars{display:flex;flex-direction:column;gap:4px}
.cmp-bar{display:flex;align-items:center;gap:8px;font-size:11px}
.cmp-bar .name{flex:0 0 110px;color:var(--ink-d);font-family:"JetBrains Mono",monospace;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-bar .track{flex:1;height:6px;background:rgba(255,255,255,.04);position:relative;overflow:hidden}
.cmp-bar .track .f{position:absolute;top:0;left:0;height:100%;transition:width .7s}
.cmp-bar .v{flex:0 0 36px;text-align:right;font-family:"JetBrains Mono",monospace;color:var(--ink);font-weight:700}
.delta{display:inline-block;margin-left:6px;font-size:10px;font-family:"JetBrains Mono",monospace;padding:1px 5px}
.delta.up{color:#56b36b;background:rgba(86,179,107,.08)}
.delta.down{color:#ff6b56;background:rgba(255,107,86,.08)}

/* === КНОПКА PREVIEW в AI-bar === */
.preview-btn{padding:9px 14px;background:rgba(125,154,255,.1);color:#9ab1ff;border:1px solid rgba(125,154,255,.35);font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:.18s;white-space:nowrap}
.preview-btn:hover{background:rgba(125,154,255,.2);border-color:#7d9aff;color:#fff}

/* === КОНФИГИ: панель сверху формы === */
.cfg-bar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:8px 10px;margin-bottom:10px;background:rgba(255,255,255,.02);border:1px dashed var(--line-2);font-family:"Exo 2",sans-serif;font-size:12px;color:var(--ink-d)}
.cfg-bar > b{color:var(--ink);font-weight:500;letter-spacing:.04em;margin-right:4px}
.cfg-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:rgba(86,179,107,.08);border:1px solid rgba(86,179,107,.3);color:#9be0ab;font-size:11px;font-family:"JetBrains Mono",monospace;cursor:pointer;transition:.15s}
.cfg-chip:hover{background:rgba(86,179,107,.18);color:#fff}
.cfg-chip .x{color:#ff8b92;font-size:10px;padding:0 2px;cursor:pointer}
.cfg-chip .x:hover{color:#ff5555}
.cfg-save-btn{padding:6px 14px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;background:rgba(245,176,66,.08);border:1px solid rgba(245,176,66,.3);color:#f5b042;cursor:pointer;font-family:"Exo 2",sans-serif;font-weight:700;transition:.18s;margin-left:auto;border-radius:8px;display:inline-flex;align-items:center;gap:6px}
.cfg-save-btn:hover{background:linear-gradient(135deg,#f5b042,#b8222a);color:#1a0f08;border-color:#f5b042;box-shadow:0 3px 12px -4px rgba(245,176,66,.55)}
.cfg-chip{padding:4px 10px;font-size:11px;background:rgba(245,176,66,.06);border:1px solid rgba(245,176,66,.18);color:#c9b88a;font-family:"Exo 2",sans-serif;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.18s}
.cfg-chip:hover{background:rgba(245,176,66,.12);border-color:#f5b042;color:#fff}
.cfg-chip .x{color:#ff4b3a;font-weight:700;opacity:.6}
.cfg-chip .x:hover{opacity:1}

/* ============ AUTH / CABINET ============ */
.auth-slot{display:flex;align-items:center;gap:10px;margin-left:14px}
.auth-slot .auth-login-btn{padding:7px 16px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;background:transparent;border:1px solid rgba(255,255,255,.25);color:#fff;cursor:pointer;font-family:"JetBrains Mono",monospace;transition:.15s}
.auth-slot .auth-login-btn:hover{background:#fff;color:#000}
.auth-slot .auth-user{display:flex;align-items:center;gap:8px;padding:5px 10px 5px 5px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04)}
.auth-slot .auth-user img,.auth-slot .auth-user .ava-empty{width:26px;height:26px;border-radius:50%;background:#333;object-fit:cover;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:#fff}
.auth-slot .auth-user b{font-size:12px;letter-spacing:.04em}
.auth-slot .auth-user small{display:block;font-size:9.5px;color:rgba(255,255,255,.55);letter-spacing:.1em;text-transform:uppercase}

.auth-modal{position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(6px);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
.auth-card{background:#0f0f10;border:1px solid rgba(255,255,255,.12);width:420px;max-width:100%;padding:28px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.auth-x{position:absolute;top:10px;right:14px;background:none;border:none;color:rgba(255,255,255,.6);font-size:24px;cursor:pointer}
.auth-x:hover{color:#fff}
.auth-tabs{display:flex;gap:0;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:22px}
.auth-tab{flex:1;background:none;border:none;color:rgba(255,255,255,.5);padding:10px 0;font-size:11px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;font-family:"JetBrains Mono",monospace;border-bottom:2px solid transparent;transition:.15s}
.auth-tab.active{color:#fff;border-bottom-color:#fff}
.auth-providers{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}
.oa{padding:11px 6px;font-size:11px;letter-spacing:.08em;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);color:#fff;cursor:pointer;font-family:"Exo 2",sans-serif;font-weight:600;transition:.15s;display:flex;align-items:center;justify-content:center;gap:6px}
.oa span{display:inline-flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:50%;font-family:"JetBrains Mono",monospace;font-weight:700;font-size:11px}
.oa-google span{background:#fff;color:#ea4335}
.oa-github span{background:#24292f;color:#fff}
/* gitlab убран */
.oa:hover{background:rgba(255,255,255,.1);transform:translateY(-1px)}
.oa.disabled{opacity:.38;cursor:not-allowed}
.oa.disabled:hover{transform:none;background:rgba(255,255,255,.04)}
.auth-sep{text-align:center;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.4);margin:14px 0 14px 0;position:relative}
.auth-sep::before,.auth-sep::after{content:"";position:absolute;top:50%;width:35%;height:1px;background:rgba(255,255,255,.1)}
.auth-sep::before{left:0}
.auth-sep::after{right:0}
.auth-form{display:flex;flex-direction:column;gap:10px}
.auth-msg{margin-top:14px;font-size:12px;color:#ff8484;min-height:18px;text-align:center}
.auth-msg.ok{color:#9be0ab}

.cab-head{display:flex;align-items:center;gap:18px;margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08)}
.cab-avatar{width:72px;height:72px;border-radius:50%;background:#222;object-fit:cover;border:1px solid rgba(255,255,255,.15)}
#cab-avatar-fallback.ava-empty{align-items:center;justify-content:center;font-family:"UnifrakturCook",serif;font-size:34px;color:#d9cfb8;background:linear-gradient(135deg,#1a0e0e,#2a1414)}
.cab-id{flex:1}
.cab-id h1{margin:0;font-size:26px}
.cab-prov{display:inline-block;padding:2px 8px;background:rgba(255,255,255,.08);border-radius:3px;font-size:10px;letter-spacing:.15em;text-transform:uppercase}
.cab-actions{display:flex;gap:8px}
.cab-big{font-size:32px;font-weight:800;letter-spacing:.02em;font-family:"JetBrains Mono",monospace}
/* ============ SUB-TABS / GATE ============ */
.sub-tabs{display:flex;gap:2px;margin:0 0 28px 0;border-bottom:1px solid rgba(255,255,255,.08);overflow-x:auto;flex-wrap:wrap}
.sub-tab{background:none;border:none;color:rgba(255,255,255,.55);padding:12px 22px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;font-family:"Exo 2",sans-serif;font-weight:600;border-bottom:2px solid transparent;transition:.15s;white-space:nowrap}
.sub-tab:hover{color:#fff}
.sub-tab.active{color:#fff;border-bottom-color:#e34a4a;background:rgba(227,74,74,.06)}
.sub-pane{display:none}
.sub-pane.active{display:block}

.lock-mark{font-size:11px;margin-left:4px;opacity:.7}
.tab.has-lock{position:relative}

.gate{max-width:600px;margin:60px auto;text-align:center;padding:40px 30px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.08)}
.gate-ico{font-size:48px;margin-bottom:14px;opacity:.55}
.gate h1{margin:0 0 16px 0}
.gate-msg{margin:0 auto 28px auto;max-width:480px;line-height:1.6}
.gate-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
/* ============ LANDING / HOME ============ */
.hero{padding:80px 0 40px 0;text-align:center;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:60px}
.hero-eyebrow{font-size:11px;letter-spacing:.35em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:18px;font-family:"JetBrains Mono",monospace}
.hero-title{font-size:64px;font-weight:800;line-height:1;margin:0 0 22px 0;letter-spacing:-.02em}
.hero-title em{font-style:italic;color:#e34a4a;font-weight:600}
.hero-lead{max-width:720px;margin:0 auto 32px auto;font-size:17px;line-height:1.55;color:rgba(255,255,255,.7);font-family:"Exo 2",sans-serif}
.hero-cta{display:flex;gap:12px;justify-content:center;margin-bottom:30px;flex-wrap:wrap}
.hero-meta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);font-family:"JetBrains Mono",monospace}
.hero-meta b{color:#fff;font-weight:700}
.hero-meta .dot{color:rgba(255,255,255,.2)}

.sec-title{font-size:13px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.5);text-align:center;margin:50px 0 28px 0;font-weight:600;font-family:"JetBrains Mono",monospace}

.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:900px){.feats{grid-template-columns:1fr}}
.feat{padding:24px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);transition:.18s}
.feat:hover{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.04);transform:translateY(-2px)}
.feat-ico{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-bottom:12px;border-radius:9px;background:linear-gradient(135deg,rgba(184,34,42,.18),rgba(184,34,42,.04));border:1px solid rgba(184,34,42,.35);color:var(--accent-2);box-shadow:0 4px 14px -6px rgba(184,34,42,.5)}
.feat-ico svg{width:20px;height:20px;display:block}
.feat:hover .feat-ico{background:linear-gradient(135deg,rgba(184,34,42,.28),rgba(184,34,42,.08));border-color:var(--accent-2)}
.feat h3{margin:0 0 8px 0;font-size:16px;font-weight:700;letter-spacing:.02em}
.feat p{margin:0;font-size:13px;line-height:1.55;color:rgba(255,255,255,.6);font-family:"Exo 2",sans-serif}

.home-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:780px;margin:0 auto}
@media (max-width:760px){.home-plans{grid-template-columns:1fr}}
.hp{padding:26px 22px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02);text-align:center}
.hp h4{margin:0 0 10px 0;font-size:18px;letter-spacing:.04em}
.hp-price{font-size:34px;font-family:"JetBrains Mono",monospace;font-weight:700;margin-bottom:6px}
.hp-price span{font-size:13px;color:rgba(255,255,255,.45);font-weight:400}
.hp p{margin:0;font-size:12px;color:rgba(255,255,255,.55)}
.hp-lite{border-top:3px solid #56b36b}
.hp-lite .hp-price{color:#9be0ab}
.hp-std{border-top:3px solid #e34a4a}
.hp-std .hp-price{color:#ff7a7a}
.hp-pro{border-top:3px solid #ffae00}
.hp-pro .hp-price{color:#ffd166}

.home-foot{margin-top:60px;padding:24px 0;border-top:1px solid rgba(255,255,255,.06);text-align:center;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.4);font-family:"JetBrains Mono",monospace;display:flex;justify-content:center;gap:16px;flex-wrap:wrap}
.home-foot a{color:rgba(255,255,255,.6);text-decoration:none;transition:.15s}
.home-foot a:hover{color:#fff}
.home-foot .dot{color:rgba(255,255,255,.18)}

/* tabs as anchors: убрать дефолтное подчёркивание */
.tabs a.tab{text-decoration:none}
.brand{text-decoration:none}
/* ============ REFERRAL ============ */
.ref-card{background:linear-gradient(180deg,rgba(86,179,107,.04),transparent 60%);border-color:rgba(86,179,107,.18)}
.ref-pct{display:inline-block;margin-left:10px;padding:3px 10px;background:#56b36b;color:#000;font-family:"JetBrains Mono",monospace;font-weight:700;font-size:13px;border-radius:3px;vertical-align:middle}
.ref-link-box{background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.06);padding:14px}
.ref-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px;display:block}
.ref-row{display:flex;gap:8px;margin-bottom:8px}
.ref-row:last-child{margin-bottom:0}
.ref-row .inp{flex:1;font-family:"JetBrains Mono",monospace;font-size:13px}
.ref-stat-lbl{font-size:10px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px}
.ref-stat .cab-big{font-size:24px}
.ref-code-show{font-family:"JetBrains Mono",monospace;color:#9be0ab;letter-spacing:.1em}

.ref-banner{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#56b36b;color:#000;padding:12px 20px;font-family:"Exo 2",sans-serif;font-weight:600;z-index:9000;box-shadow:0 8px 24px rgba(0,0,0,.4);animation:refSlide .3s ease-out}
@keyframes refSlide{from{transform:translate(-50%,40px);opacity:0}to{transform:translate(-50%,0);opacity:1}}
/* ref invitee perks */
.ref-invitee-card{background:linear-gradient(180deg,rgba(255,174,0,.05),transparent 60%);border-color:rgba(255,174,0,.25)}
.ref-perk{text-align:center;padding:18px 10px;background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.06)}
.ref-perk-ico{font-size:32px;margin-bottom:6px}
.ref-perk-val{font-size:24px;font-weight:800;font-family:"JetBrains Mono",monospace;color:#ffd166;margin-bottom:6px}
.ref-perk-lbl{font-size:11px;color:rgba(255,255,255,.55);letter-spacing:.06em;line-height:1.5}
.ref-perk-lbl span{color:#9be0ab;text-transform:uppercase;font-size:10px;letter-spacing:.15em}
.ref-perk.used .ref-perk-val{color:rgba(255,255,255,.3);text-decoration:line-through}
.ref-perk.used .ref-perk-lbl span{color:rgba(255,255,255,.3)}
/* ============ APPLE EMOJI (twemoji parser → Apple set CDN) ============ */
img.emoji,img.apple-emoji{
  height:1em;
  width:1em;
  margin:0 .04em 0 .04em;
  vertical-align:-.16em;
  display:inline-block;
}
/* для крупных эмодзи в hero / feat-ico */
.feat-ico img.emoji,.gate-ico img.emoji,.hero-eyebrow img.emoji{height:1em;width:1em}
.ref-perk-ico img.emoji{height:1em;width:1em}
/* === reactions advanced settings === */
.adv{border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 14px;background:rgba(255,255,255,.02)}
.adv summary{cursor:pointer;padding:6px 0;user-select:none}
.adv h5{margin:14px 0 6px;font-size:13px;letter-spacing:.04em;color:#9ca3af;text-transform:uppercase}
.adv .grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}
.adv .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px 12px}
.adv .g2-full{grid-column:1/-1}
.adv label{display:flex;flex-direction:column;font-size:12px;color:#cbd5e1;gap:3px}
.adv label.chk{flex-direction:row;align-items:center;gap:8px;font-size:13px;color:#e5e7eb}
.adv .inp{margin:0}
@media(max-width:560px){.adv .grid2,.adv .grid3{grid-template-columns:1fr}}

/* === chat scanner === */
.table-wrap{overflow-x:auto;max-height:520px;overflow-y:auto;border:1px solid rgba(255,255,255,.08);border-radius:10px}
.data-table{width:100%;border-collapse:collapse;font-size:13px}
.data-table thead th{position:sticky;top:0;background:#0f1318;text-align:left;padding:8px 10px;font-weight:600;color:#9ca3af;border-bottom:1px solid rgba(255,255,255,.08)}
.data-table tbody td{padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.04);vertical-align:middle}
.data-table tbody tr:hover{background:rgba(255,255,255,.03)}
.data-table a{color:#a5b4fc;text-decoration:none}
.data-table a:hover{text-decoration:underline}
.data-table code{font-size:12px;color:#fcd34d;background:rgba(0,0,0,.25);padding:1px 5px;border-radius:4px}
.btn.xs{padding:4px 9px;font-size:12px;border-radius:8px}

/* === modal === */
.modal-back{position:fixed;inset:0;background:rgba(8,10,14,.78);backdrop-filter:blur(4px);z-index:200;display:flex;align-items:flex-start;justify-content:center;padding:48px 16px;overflow-y:auto}
.modal-back.hide{display:none}
.modal{background:#10141b;border:1px solid rgba(255,255,255,.1);border-radius:14px;max-width:780px;width:100%;box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.modal-head h3{margin:0;font-size:16px}
.modal-body{padding:18px}
.modal-body .kvs{display:grid;grid-template-columns:140px 1fr;gap:6px 12px;font-size:13px;margin-bottom:14px}
.modal-body .kvs .k{color:#9ca3af}
.modal-body h4{margin:12px 0 8px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#9ca3af}
.modal-body .ed-row{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin-bottom:8px}
.modal-body .ed-row .full{grid-column:1/-1}
.modal-body .ed-row label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:#cbd5e1}
.modal-body .stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.modal-body .stat-mini{background:#0c1117;border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:8px 10px;font-size:12px}
.modal-body .stat-mini b{display:block;font-size:18px;color:#e5e7eb}
.modal-body .runs{max-height:180px;overflow-y:auto;font-family:ui-monospace,monospace;font-size:11.5px;background:#0a0d12;border:1px solid rgba(255,255,255,.05);border-radius:8px;padding:8px 10px}
.modal-body .runs .ok{color:#86efac}
.modal-body .runs .err{color:#fca5a5}
.tbl tr{cursor:pointer}
.tbl tr td .x{cursor:pointer}

/* === per-module proxies block === */
.mod-proxies{margin-top:10px;border:1px dashed rgba(255,255,255,.10);border-radius:8px;padding:8px 12px;background:rgba(255,255,255,.015)}
.mod-proxies summary{cursor:pointer;font-size:12px;color:#cbd5e1;user-select:none;padding:2px 0}
.mod-proxies textarea{font-family:ui-monospace,monospace;font-size:11.5px;line-height:1.35}
.mod-proxies code{color:#fcd34d;font-size:11px}
/* =====================================================================
   ============== ПАТЧ ОТ 06.06.2026 — ПРАВКИ ПО СКРИНАМ ===============
   ===================================================================== */
.container{max-width:1720px !important;padding:0 48px !important}
@media (max-width:1100px){.container{padding:0 22px !important}}
.btn,.btn.solid,.btn.ghost,.btn.xs{border-radius:10px !important}
.card,.modal,.auth-card,.kpi,.adm-stat,.gate,.feat,.hp,.lic-key,.log,.console,.drop,.tbl .st,.chip,.tag,.bar,.inp,textarea.inp,select.inp,.pkg,.pkg-buy,.tt,.adm-badge,.cab-prov,.toast,.console-result{border-radius:10px}
.hp,.pkg{border-radius:14px}

/* Тарифные карточки Lite / Standard / Pro: выровнять кнопку снизу */
.home-plans{align-items:stretch}
.hp{display:flex;flex-direction:column;justify-content:space-between;min-height:240px;padding:28px 22px 24px;position:relative;overflow:hidden}
.hp h4{font-size:20px;letter-spacing:.04em}
.hp p{flex:1;display:flex;align-items:center;justify-content:center;padding:8px 0 14px;font-size:13px}
.hp .hp-buy{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:11px 14px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-family:"JetBrains Mono",monospace;font-weight:700;cursor:pointer;background:transparent;color:var(--ink);border:1px solid var(--line-2);border-radius:10px;transition:.18s;margin-top:auto}
.hp-lite .hp-buy:hover{background:#56b36b;border-color:#56b36b;color:#04140a}
.hp-std .hp-buy:hover{background:#e34a4a;border-color:#e34a4a;color:#fff}
.hp-pro .hp-buy:hover{background:#ffae00;border-color:#ffae00;color:#1b1200}
/* Бейдж "РЕКОМЕНДУЕМ" — inline-блок над заголовком, чтобы не вылазил за грань заокруглённой карточки */
.hp.recommended{position:relative;padding-top:18px}
.hp.recommended::before{content:"РЕКОМЕНДУЕМ";display:inline-block;align-self:center;background:linear-gradient(135deg,#e34a4a,#b8222a);color:#fff;font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.18em;padding:5px 14px;border-radius:999px;font-weight:700;margin:0 auto 12px;box-shadow:0 4px 14px -4px rgba(184,34,42,.6),inset 0 0 0 1px rgba(255,255,255,.15)}
.hp.recommended::after{display:none !important;content:none !important}

/* Auth провайдеры: убрать белые плашки, добавить подсветку фирменными цветами */
.auth-providers{gap:10px}
.oa{padding:11px 8px;font-size:12px;font-weight:600;letter-spacing:.04em;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:10px;color:#fff;display:flex;align-items:center;justify-content:center;gap:8px}
.oa svg{width:18px;height:18px;display:block;flex-shrink:0}
.oa span{background:transparent !important;border-radius:0;width:auto;height:auto;font-size:inherit;color:inherit}
.oa:hover{transform:translateY(-1px)}
.oa-google:hover{background:linear-gradient(135deg,rgba(66,133,244,.18),rgba(234,67,53,.16) 33%,rgba(251,188,5,.16) 66%,rgba(52,168,83,.18));border-color:#4285F4;color:#fff;box-shadow:0 6px 22px -10px rgba(66,133,244,.55)}
.oa-github:hover{background:rgba(36,41,47,.85);border-color:#fff;box-shadow:0 6px 22px -10px rgba(255,255,255,.35)}
/* gitlab убран */

/* Кнопка "Войти / Регистрация" — отступ сверху */
#cab-anon-login{margin-top:14px}

/* Карточки "Telegram API" и "Лицензия": кнопки снизу на одном уровне */
#pane-settings .grid-2 .card{display:flex;flex-direction:column}
#pane-settings .grid-2 .card .form{margin-top:auto}
#pane-settings .grid-2 .card .row{margin-top:14px}

/* Журнал событий: тёмный скроллбар */
.log{scrollbar-width:thin;scrollbar-color:var(--accent) transparent;border-radius:10px}
.log::-webkit-scrollbar{width:8px;height:8px}
.log::-webkit-scrollbar-track{background:rgba(0,0,0,.4);border-radius:8px}
.log::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--accent),var(--accent-2));border-radius:8px;border:1px solid rgba(0,0,0,.5)}
.log::-webkit-scrollbar-thumb:hover{background:var(--accent-2)}
.log-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:8px 12px;background:rgba(0,0,0,.25);border:1px solid var(--line-2);border-radius:10px;font-size:11px}
.log-toolbar label{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:"Exo 2",sans-serif;font-size:12px;letter-spacing:.04em;color:var(--ink-d);text-transform:none}
.log-toolbar input[type=checkbox]{accent-color:var(--accent-2);width:14px;height:14px;cursor:pointer}
.log-toolbar .log-clear{padding:4px 10px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:transparent;border:1px solid var(--line-2);color:var(--ink-d);border-radius:6px;cursor:pointer;font-family:"JetBrains Mono",monospace}
.log-toolbar .log-clear:hover{color:var(--bad);border-color:var(--bad)}

/* Скроллбар по всему сайту */
*{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:var(--accent);background-clip:padding-box}

/* Аватар в кабинете — круг + кнопка "Загрузить" */
.cab-avatar{border-radius:50%;width:78px;height:78px;border:2px solid rgba(255,255,255,.12);box-shadow:0 4px 14px rgba(0,0,0,.4)}
#cab-avatar-fallback.ava-empty{border-radius:50%}
.cab-avatar-wrap{position:relative;display:inline-block}
.cab-avatar-upload{position:absolute;right:-4px;bottom:-4px;width:28px;height:28px;border-radius:50%;background:var(--accent);border:2px solid var(--bg);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;font-size:14px;line-height:1;transition:.15s}
.cab-avatar-upload:hover{background:var(--accent-2);transform:scale(1.08)}
.cab-avatar-upload input{display:none}

/* Лоадер кабинета, чтобы при перезагрузке не выкидывало на "анон" */
#cab-loader{padding:60px 20px;text-align:center;color:var(--ink-d);font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.18em}
#cab-loader::before{content:"";display:inline-block;width:22px;height:22px;border:2px solid var(--line-2);border-top-color:var(--accent-2);border-radius:50%;vertical-align:middle;margin-right:12px;animation:cab-spin 1s linear infinite}
@keyframes cab-spin{to{transform:rotate(360deg)}}

/* Telegram-контакт: без @ и эмодзи, нормальная плашка */
.tg-contact{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#229ED9,#1a7eb0);color:#fff;padding:10px 18px;border-radius:10px;font-family:"Exo 2",sans-serif;font-weight:600;font-size:13px;letter-spacing:.04em;text-decoration:none;border:1px solid #1a7eb0;cursor:pointer;transition:.15s;text-transform:none}
.tg-contact:hover{transform:translateY(-1px);box-shadow:0 8px 22px -8px rgba(34,158,217,.6)}
.tg-contact svg{width:18px;height:18px;fill:#fff}

/* Модалка пополнения баланса */
.topup-modal{position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(6px);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
.topup-modal.hide{display:none}
.topup-card{background:#0f0d0a;border:1px solid var(--line-2);border-radius:16px;width:640px;max-width:100%;padding:28px 30px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.7);max-height:90vh;overflow-y:auto}
.topup-card h2{font-size:20px;margin:0 0 6px;font-weight:700;letter-spacing:.02em;color:var(--ink);text-transform:none}
.topup-card .topup-lead{color:var(--ink-d);font-size:13px;line-height:1.55;margin-bottom:18px;padding-right:40px}
.topup-x{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.05);border:1px solid var(--line-2);color:var(--ink-d);font-size:18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:.15s}
.topup-x:hover{background:rgba(184,34,42,.2);border-color:var(--accent-2);color:#fff;transform:rotate(90deg)}
.topup-section-title{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin:14px 0 10px;font-family:"JetBrains Mono",monospace}
.topup-sum-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.topup-sum{padding:10px 16px;background:rgba(255,255,255,.04);border:1px solid var(--line-2);color:var(--ink);border-radius:10px;cursor:pointer;font-family:"JetBrains Mono",monospace;font-size:13px;font-weight:700;transition:.15s}
.topup-sum:hover{border-color:var(--accent)}
.topup-sum.active{background:var(--accent);border-color:var(--accent);color:#fff}
.topup-custom{flex:1;min-width:140px;padding:10px 14px;background:rgba(0,0,0,.4);border:1px solid var(--line-2);border-radius:10px;color:var(--ink);font-family:"JetBrains Mono",monospace;font-size:13px;outline:none;-moz-appearance:textfield;appearance:textfield}
.topup-custom::-webkit-outer-spin-button,.topup-custom::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.topup-custom:focus{border-color:var(--accent)}
.topup-coin{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;background:rgba(255,255,255,.025);border:1px solid var(--line-2);border-radius:12px;cursor:pointer;margin-bottom:8px;transition:.15s}
.topup-coin:hover{border-color:var(--accent);background:rgba(184,34,42,.04)}
.topup-coin.selected{border-color:var(--accent);background:rgba(184,34,42,.06)}
.topup-coin-info b{font-family:"JetBrains Mono",monospace;font-size:14px;color:var(--ink);letter-spacing:.02em;font-weight:700;display:block;margin-bottom:2px}
.topup-coin-info small{font-size:11px;color:var(--ink-d);display:block}
.topup-mode{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:5px 11px;border-radius:999px;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.topup-mode.auto{background:rgba(86,179,107,.16);color:#9be0ab;border:1px solid rgba(86,179,107,.55)}
.topup-mode.manual{background:rgba(255,174,0,.16);color:#ffd166;border:1px solid rgba(255,174,0,.55)}
.topup-pay-btn{margin-top:16px;width:100%;padding:14px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;border:none;font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;cursor:pointer;transition:.15s}
.topup-pay-btn:hover{transform:translateY(-1px);box-shadow:0 10px 28px -10px rgba(184,34,42,.7)}

/* Кнопка "+ Пополнить" в блоке баланса */
.cab-topup-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:10px;background:transparent;border:1px solid var(--accent);color:var(--accent-2);font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;cursor:pointer;margin-top:6px;transition:.15s}
.cab-topup-btn:hover{background:var(--accent);color:#fff}
.cab-topup-btn::before{content:"+";font-size:14px}

/* Мобильная адаптация — шапка кабинета не разъезжается */
@media (max-width:760px){
  .cab-head{flex-direction:column;text-align:center;align-items:center;gap:14px}
  .cab-actions{flex-wrap:wrap;justify-content:center}
  .container{padding:0 14px !important}
  .nav-row{flex-wrap:wrap;gap:10px}
  .tabs{order:3;width:100%;justify-content:flex-start}
  .auth-slot{margin-left:auto;order:2}
  .topup-card{padding:22px 16px}
  .topup-coin{flex-direction:column;align-items:flex-start;gap:8px}
}

/* Закруглённые крестики */
.auth-x,#console-stop,#console-close{border-radius:50% !important;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;padding:0 !important;background:rgba(255,255,255,.05);border:1px solid var(--line-2)}
.auth-x:hover,#console-close:hover{background:rgba(184,34,42,.18);transform:rotate(90deg);transition:.18s}

/* =====================================================================
   ========== AI-АССИСТЕНТ — FAB + DRAWER ==============================
   ===================================================================== */
/* ===== AI FAB: премиум шильд в стиле логотипа ===== */
.ai-fab{position:fixed;right:24px;bottom:24px;width:64px;height:64px;border-radius:50%;
  background:radial-gradient(circle at 30% 25%,#1a1310 0%,#0b0807 80%);
  border:1px solid rgba(245,176,66,.35);
  cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:9000;
  box-shadow:
    0 14px 38px -10px rgba(184,34,42,.55),
    0 0 0 0 rgba(245,176,66,.4),
    inset 0 0 0 1px rgba(255,210,122,.08);
  transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s;
  animation:aiFabPulse 3.2s ease-in-out infinite}
.ai-fab:hover{transform:translateY(-3px) scale(1.05);
  box-shadow:0 18px 48px -10px rgba(184,34,42,.75),0 0 0 4px rgba(245,176,66,.18)}
.ai-fab:active{transform:translateY(-1px) scale(1.02)}
.ai-fab-icon{width:38px;height:38px;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.ai-fab-glow{position:absolute;inset:-2px;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 90deg,
    rgba(245,176,66,0) 0deg, rgba(245,176,66,.55) 60deg,
    rgba(184,34,42,.55) 120deg, rgba(245,176,66,0) 200deg);
  filter:blur(8px);opacity:.55;animation:aiFabSpin 5s linear infinite;z-index:-1}
@keyframes aiFabPulse{
  0%,100%{box-shadow:0 14px 38px -10px rgba(184,34,42,.55), 0 0 0 0 rgba(245,176,66,.4)}
  50%   {box-shadow:0 14px 38px -10px rgba(184,34,42,.55), 0 0 0 14px rgba(245,176,66,0)}
}
@keyframes aiFabSpin{to{transform:rotate(360deg)}}

/* ===== DRAWER ===== */
.ai-drawer{position:fixed;right:22px;bottom:104px;width:440px;max-width:calc(100vw - 44px);
  height:600px;max-height:calc(100vh - 150px);
  background:linear-gradient(180deg,#161210 0%,#0c0907 100%);
  border:1px solid rgba(245,176,66,.18);
  border-radius:22px;display:flex;flex-direction:column;z-index:9000;
  box-shadow:0 40px 100px rgba(0,0,0,.85), 0 0 0 1px rgba(0,0,0,.4),
             inset 0 1px 0 rgba(255,210,122,.06);
  overflow:hidden;backdrop-filter:blur(20px);
  transform:translateY(24px) scale(.94);opacity:0;pointer-events:none;
  transition:transform .3s cubic-bezier(.2,.7,.2,1), opacity .25s}
.ai-drawer.open{transform:none;opacity:1;pointer-events:auto}

/* ===== HEAD ===== */
.ai-head{display:flex;align-items:center;gap:12px;padding:16px 18px;position:relative;
  border-bottom:1px solid rgba(245,176,66,.12);
  background:linear-gradient(135deg, rgba(245,176,66,.07), rgba(184,34,42,.04) 60%, transparent)}
.ai-head::after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(245,176,66,.4), transparent)}
.ai-head .ai-avatar{width:40px;height:40px;border-radius:50%;
  background:radial-gradient(circle at 30% 25%,#1a1310,#0b0807);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:0 4px 14px -4px rgba(184,34,42,.5), inset 0 0 0 1px rgba(245,176,66,.25)}
.ai-head .ai-avatar svg{width:26px;height:26px;display:block}
.ai-head .ai-title{flex:1;font-family:"Exo 2",sans-serif;font-weight:700;font-size:15px;
  color:#fff4d8;letter-spacing:.02em;line-height:1.2}
.ai-head .ai-title small{display:flex;align-items:center;gap:5px;font-size:10px;color:#7ec98a;
  font-weight:500;letter-spacing:.08em;margin-top:3px;text-transform:uppercase;font-family:"JetBrains Mono",monospace}
.ai-head .ai-title small::before{content:"";width:6px;height:6px;border-radius:50%;
  background:#5cd97a;box-shadow:0 0 8px #5cd97a;animation:aiOnline 2s ease-in-out infinite}
@keyframes aiOnline{0%,100%{opacity:1}50%{opacity:.4}}
.ai-head .ai-close{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);color:#bfb098;cursor:pointer;line-height:0;
  display:inline-flex;align-items:center;justify-content:center;transition:.18s;padding:0}
.ai-head .ai-close svg{width:14px;height:14px}
.ai-head .ai-close:hover{background:rgba(184,34,42,.22);border-color:rgba(184,34,42,.5);
  color:#fff;transform:rotate(90deg)}

/* ===== BODY ===== */
.ai-body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;
  background:linear-gradient(180deg,transparent,rgba(245,176,66,.015))}
.ai-body::-webkit-scrollbar{width:6px}
.ai-body::-webkit-scrollbar-track{background:transparent}
.ai-body::-webkit-scrollbar-thumb{background:rgba(245,176,66,.18);border-radius:3px}
.ai-body::-webkit-scrollbar-thumb:hover{background:rgba(245,176,66,.35)}

.ai-msg{display:flex;gap:10px;align-items:flex-start;max-width:90%;animation:aiMsgIn .3s cubic-bezier(.2,.7,.2,1)}
.ai-msg.user{align-self:flex-end;flex-direction:row-reverse}
.ai-msg .ai-bubble{padding:11px 15px;border-radius:16px;font-size:14px;line-height:1.55;
  font-family:"Exo 2",sans-serif;white-space:pre-wrap;word-wrap:break-word;color:#f1e8d6;
  box-shadow:0 2px 8px rgba(0,0,0,.3)}
.ai-msg.user .ai-bubble{
  background:linear-gradient(135deg,#b8222a,#7a1418);color:#fff;border-bottom-right-radius:5px;
  box-shadow:0 4px 14px -4px rgba(184,34,42,.5)}
.ai-msg.assistant .ai-bubble{background:rgba(245,176,66,.06);
  border:1px solid rgba(245,176,66,.14);border-bottom-left-radius:5px}
.ai-msg .ai-mini-av{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;flex-shrink:0;
  box-shadow:inset 0 0 0 1px rgba(245,176,66,.2)}
.ai-msg.assistant .ai-mini-av{background:radial-gradient(circle at 30% 25%,#1a1310,#0b0807)}
.ai-msg.assistant .ai-mini-av svg{width:20px;height:20px;display:block}
.ai-msg.user .ai-mini-av{background:rgba(184,34,42,.2);border:1px solid rgba(184,34,42,.4);
  color:#fff;font-size:11px;font-weight:800;font-family:"JetBrains Mono",monospace}
.ai-msg.user .ai-mini-av::before{content:"Я"}
@keyframes aiMsgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.ai-typing{display:inline-flex;gap:5px;padding:13px 16px;align-items:center}
.ai-typing span{width:7px;height:7px;border-radius:50%;background:#f5b042;animation:aiDot 1.3s infinite}
.ai-typing span:nth-child(2){animation-delay:.18s}
.ai-typing span:nth-child(3){animation-delay:.36s}
@keyframes aiDot{0%,80%,100%{opacity:.25;transform:scale(.7)}40%{opacity:1;transform:scale(1.2)}}

/* ===== FOOT / INPUT ===== */
.ai-foot{padding:12px 14px 14px;border-top:1px solid rgba(245,176,66,.1);
  background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.4));
  display:flex;flex-direction:column;gap:6px}
.ai-input-wrap{display:flex;gap:8px;align-items:flex-end;
  background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.06);
  border-radius:14px;padding:6px 6px 6px 12px;transition:.18s}
.ai-input-wrap:focus-within{border-color:rgba(245,176,66,.55);
  box-shadow:0 0 0 3px rgba(245,176,66,.1), 0 4px 14px -4px rgba(245,176,66,.25);
  background:rgba(0,0,0,.55)}
.ai-input-wrap textarea{flex:1;resize:none;min-height:36px;max-height:140px;
  background:transparent;border:none;color:#f1e8d6;font-family:"Exo 2",sans-serif;font-size:14px;
  padding:8px 0;outline:none;line-height:1.45}
.ai-input-wrap textarea::placeholder{color:#7a7060;font-style:italic}
.ai-input-wrap .ai-send{width:36px;height:36px;border-radius:10px;
  background:linear-gradient(135deg,#f5b042,#b8222a);color:#fff;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:.18s;flex-shrink:0;
  box-shadow:0 3px 10px -3px rgba(184,34,42,.6)}
.ai-input-wrap .ai-send:hover:not(:disabled){transform:translateY(-1px) scale(1.04);
  box-shadow:0 6px 18px -4px rgba(184,34,42,.8)}
.ai-input-wrap .ai-send:active{transform:translateY(0) scale(.98)}
.ai-input-wrap .ai-send:disabled{opacity:.35;cursor:not-allowed;transform:none}
.ai-input-wrap .ai-send svg{width:18px;height:18px}

/* === МИКРОФОН: heroicons-svg + 3-слойный пульсирующий ринг при записи === */
.ai-mic{position:relative;width:38px;height:38px;border-radius:10px;
  background:rgba(245,176,66,.05);color:#c9b88a;border:1px solid rgba(245,176,66,.18);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:.18s;flex-shrink:0}
.ai-mic svg{width:20px;height:20px;transition:.18s;position:relative;z-index:2}
.ai-mic:hover:not(.recording){background:rgba(245,176,66,.12);
  border-color:rgba(245,176,66,.4);color:var(--gold);
  box-shadow:0 0 0 3px rgba(245,176,66,.08)}
.ai-mic:hover:not(.recording) svg{transform:scale(1.05);
  filter:drop-shadow(0 0 6px rgba(245,176,66,.5))}
.ai-mic:active{transform:scale(.94)}

/* состояние записи: красно-золотая пульсация */
.ai-mic.recording{background:linear-gradient(135deg,rgba(184,34,42,.25),rgba(245,176,66,.15));
  border-color:#b8222a;color:#fff;
  animation:mic-glow 1.4s ease-in-out infinite}
.ai-mic.recording svg{color:#fff;
  filter:drop-shadow(0 0 6px rgba(245,176,66,.7));animation:mic-bounce 1.4s ease-in-out infinite}
.ai-mic-ring{position:absolute;inset:0;border-radius:10px;pointer-events:none;
  border:1.5px solid transparent;z-index:1}
.ai-mic.recording .ai-mic-ring{border-color:#b8222a;
  animation:mic-ripple 1.4s ease-out infinite}
.ai-mic.recording::before{content:"";position:absolute;inset:0;border-radius:10px;
  border:1.5px solid #f5b042;animation:mic-ripple 1.4s ease-out .35s infinite;
  pointer-events:none}
.ai-mic.recording::after{content:"";position:absolute;inset:0;border-radius:10px;
  border:1.5px solid #b8222a;animation:mic-ripple 1.4s ease-out .7s infinite;
  pointer-events:none}

@keyframes mic-glow{0%,100%{box-shadow:0 0 0 0 rgba(184,34,42,.45),
  inset 0 0 14px rgba(245,176,66,.18)}
  50%{box-shadow:0 0 0 4px rgba(184,34,42,.22),
  inset 0 0 22px rgba(245,176,66,.32)}}
@keyframes mic-bounce{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes mic-ripple{0%{transform:scale(1);opacity:.9}
  100%{transform:scale(1.85);opacity:0}}

/* Микрофон не поддерживается браузером — приглушаем */
.ai-mic.unsupported{opacity:.35;cursor:not-allowed}
.ai-mic.unsupported:hover{background:rgba(245,176,66,.05);
  border-color:rgba(245,176,66,.18);color:#c9b88a;box-shadow:none}

/* состояние "распознаю" — золотой спиннер поверх кнопки */
.ai-mic.transcribing{background:rgba(245,176,66,.12);border-color:var(--gold);
  color:var(--gold);cursor:wait}
.ai-mic.transcribing svg{opacity:.35}
.ai-mic.transcribing::after{content:"";position:absolute;inset:6px;border-radius:50%;
  border:1.8px solid transparent;border-top-color:var(--gold);border-right-color:var(--gold);
  animation:mic-spin .8s linear infinite;pointer-events:none;z-index:3;
  filter:drop-shadow(0 0 4px rgba(245,176,66,.6))}
@keyframes mic-spin{to{transform:rotate(360deg)}}

.ai-hint-row{font-size:10px;color:#6e6450;text-align:center;font-family:"Exo 2",sans-serif;
  letter-spacing:.04em;padding:2px 0 0}

/* --- БЫСТРЫЕ ПОДСКАЗКИ ВНУТРИ ЧАТА --- */
.ai-quick-row{display:flex;flex-wrap:wrap;gap:7px;padding:6px 8px 10px 56px;
  animation:fade-in .3s}
.ai-quick{font-family:"Exo 2",sans-serif;font-size:12px;padding:7px 12px;
  background:rgba(245,176,66,.06);border:1px solid rgba(245,176,66,.2);
  color:#c9b88a;border-radius:999px;cursor:pointer;transition:.18s;
  display:inline-flex;align-items:center;gap:6px}
.ai-quick::before{content:"✦";color:var(--gold);opacity:.7;font-size:10px}
.ai-quick:hover{background:rgba(245,176,66,.14);border-color:var(--gold);color:#fff;
  transform:translateY(-1px);box-shadow:0 4px 12px -4px rgba(245,176,66,.5)}

/* --- БЕЙДЖИ ПРИМЕНЁННЫХ AI-ДЕЙСТВИЙ --- */
.ai-action-badges{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.ai-act-pill{font-size:11px;padding:5px 11px;border-radius:999px;
  background:linear-gradient(135deg,rgba(245,176,66,.18),rgba(184,34,42,.1));
  border:1px solid rgba(245,176,66,.4);color:#ffe1a8;font-family:"Exo 2",sans-serif;
  font-weight:600;letter-spacing:.02em;
  box-shadow:0 3px 10px -3px rgba(245,176,66,.4),inset 0 1px 0 rgba(255,255,255,.1)}
.ai-act-pill b{color:#fff;font-weight:800}
.ai-hint-row kbd{background:rgba(245,176,66,.08);border:1px solid rgba(245,176,66,.15);
  padding:1px 5px;border-radius:4px;font-size:9px;font-family:"JetBrains Mono",monospace;
  color:#c9b88a;margin:0 1px}

@media (max-width:600px){
  .ai-drawer{right:8px;left:8px;width:auto;bottom:88px;height:72vh;border-radius:18px}
  .ai-fab{right:14px;bottom:14px;width:56px;height:56px}
  .ai-fab-icon{width:32px;height:32px}
}

/* ============================================================
   TOOLS REDESIGN v2 — премиум-облик инструментов
   Цвета: золото (#f5b042) + кровь (#b8222a), брендовая палитра.
   Перекрывает старые синие/фиолетовые тона из AI/preview блоков.
   ============================================================ */

:root{
  --gold:#f5b042;
  --gold-soft:#c9a45a;
  --blood:#b8222a;
  --blood-deep:#5a0610;
  --panel:linear-gradient(180deg,rgba(28,22,14,.55) 0%,rgba(12,10,7,.35) 100%);
  --rune:radial-gradient(circle at 50% 50%, rgba(245,176,66,.18) 0%, transparent 70%);
}

/* === ГЕРОЙ СЕКЦИИ (h1 с большой иконкой + подзаголовок + золотая линия) === */
.sec-hero{display:flex;align-items:flex-start;gap:18px;margin:6px 0 28px;
  position:relative;padding-bottom:18px;border-bottom:1px solid rgba(245,176,66,.08)}
.sec-hero::after{content:"";position:absolute;left:0;bottom:-1px;width:84px;height:2px;
  background:linear-gradient(90deg,var(--gold),var(--blood) 70%,transparent);
  box-shadow:0 0 14px rgba(245,176,66,.4)}
.sec-hero-ico{flex-shrink:0;width:56px;height:56px;display:flex;align-items:center;justify-content:center;
  border-radius:14px;background:radial-gradient(circle at 30% 30%,rgba(245,176,66,.18),rgba(184,34,42,.08) 70%,transparent);
  border:1px solid rgba(245,176,66,.22);
  box-shadow:inset 0 0 18px rgba(245,176,66,.1),0 6px 22px -10px rgba(184,34,42,.5)}
.sec-hero-ico svg{width:28px;height:28px;color:var(--gold);
  filter:drop-shadow(0 0 8px rgba(245,176,66,.5))}
.sec-hero-txt{flex:1;min-width:0}
.sec-hero h1{margin:0 0 4px;font-size:34px;line-height:1.05;letter-spacing:-.02em}
.sec-hero h1 em{background:linear-gradient(135deg,var(--gold) 0%,var(--blood) 80%);
  -webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic;font-weight:700}
.sec-hero p{color:var(--ink-d);font-size:13.5px;line-height:1.55;max-width:760px;margin:0}

/* === SUB-TABS: пилюли с иконкой + золотая подсветка активной === */
.sub-tabs{gap:6px;padding:6px;background:rgba(0,0,0,.3);
  border:1px solid rgba(245,176,66,.06);border-radius:14px;margin-bottom:30px}
.sub-tab{display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:10px;
  font-size:11.5px;letter-spacing:.12em;color:#a89977;background:transparent;border:1px solid transparent;
  position:relative;overflow:hidden;border-bottom:1px solid transparent;font-weight:600}
.sub-tab .ico{width:15px;height:15px;display:inline-flex;align-items:center;justify-content:center;opacity:.8}
.sub-tab .ico svg{width:100%;height:100%;stroke-width:1.8}
.sub-tab:hover{color:#ece1c5;background:rgba(245,176,66,.04);border-color:rgba(245,176,66,.1)}
.sub-tab:hover .ico{opacity:1;color:var(--gold)}
.sub-tab.active{color:#fff;background:linear-gradient(180deg,rgba(184,34,42,.25),rgba(90,6,16,.2));
  border-color:rgba(184,34,42,.55);box-shadow:inset 0 0 14px rgba(184,34,42,.18),
  0 4px 18px -8px rgba(184,34,42,.55)}
.sub-tab.active::after{content:"";position:absolute;left:14%;right:14%;bottom:3px;height:2px;
  background:linear-gradient(90deg,transparent,var(--gold) 40%,var(--blood) 70%,transparent);
  box-shadow:0 0 10px rgba(245,176,66,.55);border-radius:2px}
.sub-tab.active .ico{opacity:1;color:var(--gold)}

/* === КАРТОЧКИ: золотой угловой узор, мягкое внутреннее свечение === */
.card{border:1px solid rgba(245,176,66,.1);background:var(--panel);
  border-radius:14px;padding:30px 32px;position:relative;overflow:hidden}
.card::before{content:"";position:absolute;top:0;left:0;width:60%;height:1px;
  background:linear-gradient(90deg,rgba(245,176,66,.45),transparent)}
.card::after{content:"";position:absolute;top:-1px;left:-1px;width:14px;height:14px;
  border-top:1.5px solid var(--gold);border-left:1.5px solid var(--gold);
  border-top-left-radius:14px;opacity:.55;pointer-events:none}
.card:hover{border-color:rgba(245,176,66,.22);
  box-shadow:0 18px 60px -32px rgba(184,34,42,.55),inset 0 0 60px rgba(245,176,66,.025)}
/* h3 — слева, по центру вертикали; .tag (если есть) уезжает вправо через margin-left:auto */
.card h3{padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid rgba(245,176,66,.1);
  display:flex;align-items:center;justify-content:flex-start;gap:10px;color:#ece1c5;
  font-size:13px;letter-spacing:.14em}
.card h3::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 12px var(--gold);flex-shrink:0}
.card h3 .tag{margin-left:auto}
.card.mini{padding:24px 22px}
.card.mini h4{display:flex;align-items:center;gap:8px;color:#ece1c5;margin-bottom:14px;
  font-size:12px;letter-spacing:.12em;padding-bottom:12px;border-bottom:1px solid rgba(245,176,66,.08)}
.card.mini h4::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 10px var(--gold);flex-shrink:0}

/* === ФОРМЫ: золотой фокус, кастомные чекбоксы и select === */
/* Лейблы форм — крупнее, светлее, мягче трекинг (раньше было нечитабельно) */
.form.col{gap:18px}
.form.col label{color:#a89977;font-weight:600;font-size:11.5px;letter-spacing:.1em;gap:8px}
.form.col label > .inp,
.form.col label > textarea.inp{margin-top:2px}
.inp{background:rgba(0,0,0,.5);border:1px solid rgba(245,176,66,.1);border-radius:10px;
  padding:13px 16px;transition:.18s;color:#ece1c5;font-size:13.5px}
.inp:hover{border-color:rgba(245,176,66,.2)}
.inp:focus{border-color:var(--gold);background:rgba(0,0,0,.65);
  box-shadow:0 0 0 3px rgba(245,176,66,.08),inset 0 0 14px rgba(245,176,66,.03)}
textarea.inp{font-family:"JetBrains Mono",monospace;line-height:1.55;border-radius:12px}

.chk input[type="checkbox"],
.card input[type="checkbox"]:not(.no-style),
.form input[type="checkbox"]:not(.no-style){appearance:none;-webkit-appearance:none;
  width:18px;height:18px;border:1.5px solid rgba(245,176,66,.3);background:rgba(0,0,0,.5);
  border-radius:5px;cursor:pointer;position:relative;transition:.18s;flex-shrink:0;vertical-align:-3px;margin:0 4px 0 0}
.chk input[type="checkbox"]:hover,
.card input[type="checkbox"]:not(.no-style):hover,
.form input[type="checkbox"]:not(.no-style):hover{border-color:var(--gold)}
.chk input[type="checkbox"]:checked,
.card input[type="checkbox"]:not(.no-style):checked,
.form input[type="checkbox"]:not(.no-style):checked{background:linear-gradient(135deg,var(--gold),var(--blood));
  border-color:var(--gold);box-shadow:0 0 10px rgba(245,176,66,.4)}
.chk input[type="checkbox"]:checked::after,
.card input[type="checkbox"]:not(.no-style):checked::after,
.form input[type="checkbox"]:not(.no-style):checked::after{content:"";position:absolute;
  left:5px;top:2px;width:5px;height:9px;border:solid #1a0f08;border-width:0 2px 2px 0;transform:rotate(45deg)}

select.inp{appearance:none;-webkit-appearance:none;padding-right:36px;
  background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),
                   linear-gradient(135deg,var(--gold) 50%,transparent 50%);
  background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat}

/* === КНОПКИ: gold/blood премиум-вариант с бегущим бликом === */
.btn{border-radius:10px;font-weight:700;letter-spacing:.14em;padding:12px 22px;
  font-size:11.5px;
  border:1px solid rgba(245,176,66,.2);background:rgba(245,176,66,.04);color:#ece1c5;
  position:relative;overflow:hidden;transition:.2s}
.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,
  rgba(245,176,66,.18),transparent 60%);opacity:0;transition:.25s}
.btn:hover:not(:disabled){border-color:var(--gold);color:#fff;
  background:rgba(245,176,66,.08);transform:translateY(-1px);
  box-shadow:0 6px 22px -10px rgba(245,176,66,.5)}
.btn:hover:not(:disabled)::before{opacity:1}
.btn.solid{background:linear-gradient(135deg,#b8222a 0%,#5a0610 60%,#3a0309 100%);
  border-color:rgba(245,176,66,.35);color:#fff;
  box-shadow:inset 0 0 14px rgba(245,176,66,.08),0 6px 22px -10px rgba(184,34,42,.5)}
.btn.solid:hover:not(:disabled){background:linear-gradient(135deg,#d83040 0%,#7a0c1a 70%,#4a0410 100%);
  border-color:var(--gold);box-shadow:inset 0 0 18px rgba(245,176,66,.12),
  0 10px 28px -10px rgba(184,34,42,.7)}
.btn.solid::after{content:"";position:absolute;top:-50%;left:-60%;width:50%;height:200%;
  background:linear-gradient(115deg,transparent,rgba(245,176,66,.25),transparent);
  transform:skewX(-22deg);transition:left .8s ease}
.btn.solid:hover::after{left:160%}
.btn.ghost{background:transparent;border-color:rgba(245,176,66,.12);color:#a89e87}
.btn.ghost:hover:not(:disabled){background:rgba(245,176,66,.04);border-color:rgba(245,176,66,.3)}

/* === AI-БАР И ПРЕДПРОСМОТР: переводим из фиолетово-синего в золотисто-кровавый === */
.ai-tune-bar{padding:0;background:transparent;border:none;border-left:none;
  display:flex;flex-direction:column;gap:0;margin-bottom:22px}
.cfg-bar{padding:11px 14px;background:linear-gradient(90deg,rgba(245,176,66,.06),rgba(184,34,42,.04));
  border:1px solid rgba(245,176,66,.16);border-radius:12px 12px 0 0;border-bottom:none;
  font-size:11.5px;color:#c9b88a;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:0}
.cfg-bar > b{color:var(--gold);font-weight:700;letter-spacing:.04em}
.ai-tune-bar > div:nth-child(2){background:rgba(0,0,0,.55);border:1px solid rgba(245,176,66,.18);
  border-top:1px dashed rgba(245,176,66,.14);border-radius:0 0 12px 12px;padding:10px 12px;gap:10px}
.ai-tune-bar input.ai-prompt{background:transparent;border:none;color:#ece1c5;padding:8px 12px;
  font-family:"Exo 2",sans-serif;font-size:13.5px;outline:none;flex:1}
.ai-tune-bar input.ai-prompt::placeholder{color:#7a7060;font-style:italic}
.ai-tune-bar input.ai-prompt:focus{background:transparent;border:none}

.ai-tune-btn{padding:10px 18px;background:linear-gradient(135deg,#f5b042 0%,#b8222a 90%);
  color:#1a0f08;font-weight:800;border:none;border-radius:10px;font-size:11px;letter-spacing:.16em;
  cursor:pointer;white-space:nowrap;text-transform:uppercase;
  box-shadow:0 4px 16px -6px rgba(245,176,66,.55),inset 0 1px 0 rgba(255,255,255,.2);
  transition:.2s;display:inline-flex;align-items:center;gap:8px}
.ai-tune-btn:hover{transform:translateY(-1px);
  box-shadow:0 8px 26px -8px rgba(245,176,66,.7),inset 0 1px 0 rgba(255,255,255,.3)}
.ai-tune-btn:disabled{opacity:.55;cursor:wait;transform:none}

.preview-btn{padding:10px 16px;background:rgba(245,176,66,.06);color:var(--gold);
  border:1px solid rgba(245,176,66,.3);border-radius:10px;font-family:"Exo 2",sans-serif;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;transition:.18s;white-space:nowrap}
.preview-btn:hover{background:rgba(245,176,66,.14);color:#fff;border-color:var(--gold);
  box-shadow:0 4px 18px -8px rgba(245,176,66,.6)}

.ai-stack{margin-top:12px;gap:8px}
.ai-stack-item{font-size:10.5px;padding:5px 11px;border-radius:999px;
  background:linear-gradient(135deg,rgba(245,176,66,.12),rgba(184,34,42,.08));
  border:1px solid rgba(245,176,66,.25);color:#c9b88a;font-family:"Exo 2",sans-serif}
.ai-stack-item .x{color:var(--blood);font-weight:700}
.ai-mix-add{font-size:10.5px;padding:5px 12px;border-radius:999px;background:transparent;
  border:1px dashed rgba(245,176,66,.3);color:var(--gold);font-family:"Exo 2",sans-serif;cursor:pointer}
.ai-mix-add:hover{background:rgba(245,176,66,.06);border-style:solid}

.ai-explain{margin-top:10px;padding:10px 14px;background:rgba(245,176,66,.05);
  border-left:2px solid var(--gold);border-radius:0 8px 8px 0;color:#d9cfb8;
  font-size:12.5px;line-height:1.55}

.preview-panel{margin-top:14px;padding:16px 18px;background:linear-gradient(180deg,
  rgba(245,176,66,.04),rgba(0,0,0,.35));border:1px solid rgba(245,176,66,.18);
  border-left:3px solid var(--gold);border-radius:12px;animation:fade-in .3s}
.preview-panel.compare{background:rgba(0,0,0,.25)}
.preview-title{color:#ece1c5}
.preview-explain{background:rgba(245,176,66,.04);border-left:2px solid var(--gold);
  border-radius:0 8px 8px 0;color:#d9cfb8}
.metric-bar{background:rgba(0,0,0,.5);border:1px solid rgba(245,176,66,.06);border-radius:6px}
.metric.m-stability{--m-from:#3eda7a;--m-to:#6ee59a}
.metric.m-speed{--m-from:#f5b042;--m-to:#ffd47a}
.metric.m-reach{--m-from:#c9a45a;--m-to:#f5d68a}
.metric.m-load{--m-from:#ff8a00;--m-to:#ffae00}
.metric.m-risk{--m-from:#b8222a;--m-to:#ff4b3a}

/* === РЕКОМЕНД-ПИЛЮЛЯ: убираем красную "ошибку", делаем золотом === */
.recommend-btn{font-size:9.5px;letter-spacing:.16em;padding:4px 10px;border-radius:999px;
  border:1px solid rgba(245,176,66,.35);background:rgba(245,176,66,.07);color:var(--gold);
  font-family:"Exo 2",sans-serif;font-weight:700;transition:.18s}
.recommend-btn:hover{background:linear-gradient(135deg,var(--gold),#ffd47a);color:#1a0f08;
  border-color:var(--gold);border-style:solid;
  box-shadow:0 3px 12px -4px rgba(245,176,66,.55)}
.recommend-btn.applied{color:var(--ok);border-color:rgba(62,218,122,.45);background:rgba(62,218,122,.06)}

/* === БАННЕР "ЗАПОЛНИТЬ ВСЁ" === */
.smart-banner{padding:14px 18px;background:linear-gradient(90deg,
  rgba(245,176,66,.08),rgba(184,34,42,.06));border:1px solid rgba(245,176,66,.25);
  border-left:3px solid var(--gold);border-radius:12px;font-size:13px;color:#ece1c5;
  display:flex;align-items:center;gap:14px}
.smart-banner b{color:var(--gold)}
.fill-all-btn{padding:9px 16px;background:linear-gradient(135deg,#f5b042,#b8222a);
  color:#1a0f08;font-weight:800;border:none;border-radius:8px;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;cursor:pointer;font-family:"Exo 2",sans-serif;
  box-shadow:0 4px 14px -4px rgba(245,176,66,.55);transition:.2s}
.fill-all-btn:hover{transform:translateY(-1px);
  box-shadow:0 8px 22px -6px rgba(245,176,66,.7)}

.tt{border-color:rgba(245,176,66,.25);color:var(--gold-soft)}
.tt:hover{color:var(--gold);border-color:var(--gold)}

/* === БОКОВАЯ СПРАВКА (для одиноких страниц вроде Каналы/Профиль/Клонирование) === */
.with-aside{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}
@media (max-width:980px){.with-aside{grid-template-columns:1fr}}
.aside-help{padding:22px 20px;background:linear-gradient(180deg,rgba(245,176,66,.04),transparent 90%);
  border:1px solid rgba(245,176,66,.14);border-radius:14px;position:relative;overflow:hidden}
.aside-help::before{content:"";position:absolute;inset:0;background:var(--rune);opacity:.4;pointer-events:none}
.aside-help h4{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--gold);
  letter-spacing:.12em;margin-bottom:14px;position:relative;text-transform:uppercase;font-weight:700;
  padding-bottom:10px;border-bottom:1px solid rgba(245,176,66,.1)}
.aside-help h4 svg{width:18px;height:18px;color:var(--gold);
  filter:drop-shadow(0 0 6px rgba(245,176,66,.4))}
.aside-help ul{list-style:none;padding:0;margin:0;position:relative}
.aside-help li{font-size:13px;color:#d9cfb8;line-height:1.6;padding:10px 0 10px 22px;
  border-bottom:1px dashed rgba(245,176,66,.06);position:relative}
.aside-help li:last-child{border-bottom:none;padding-bottom:0}
.aside-help li::before{content:"◆";position:absolute;left:4px;top:9px;color:var(--gold);
  font-size:9px;opacity:.7}
.aside-help li b{color:#ece1c5}
.aside-help li code{background:rgba(245,176,66,.06);color:var(--gold);border-radius:4px;
  font-size:11.5px;padding:1px 5px}
.aside-help .ah-foot{margin-top:14px;padding-top:12px;border-top:1px dashed rgba(245,176,66,.1);
  font-size:11px;color:#7a7060;font-style:italic;position:relative;text-align:center}

.preset-chip{background:rgba(245,176,66,.04);border:1px solid rgba(245,176,66,.15);
  border-radius:8px;color:#c9b88a;font-family:"Exo 2",sans-serif;font-size:11px;
  padding:5px 11px;transition:.18s}
.preset-chip:hover{background:rgba(245,176,66,.1);border-color:var(--gold);color:#fff;
  box-shadow:0 4px 12px -4px rgba(245,176,66,.4)}

.adv{border:1px solid rgba(245,176,66,.12);border-radius:12px;background:rgba(0,0,0,.25)}
.adv summary{color:#c9b88a;padding:10px 4px}
.adv h5{color:var(--gold);font-weight:700;letter-spacing:.14em}

.drop{border:1.5px dashed rgba(245,176,66,.22);border-radius:14px;background:rgba(0,0,0,.3);
  padding:42px 30px;transition:.22s}
.drop:hover,.drop.dragover{border-color:var(--gold);background:rgba(245,176,66,.04);
  box-shadow:inset 0 0 30px rgba(245,176,66,.05),0 6px 24px -10px rgba(245,176,66,.4)}
.drop-ico{color:var(--gold);font-size:38px;filter:drop-shadow(0 0 12px rgba(245,176,66,.4))}
.drop u{color:var(--gold);border-bottom-color:var(--gold)}
.drop-sub{color:#7a7060}

.kpi{border:1px solid rgba(245,176,66,.1);border-radius:12px;background:rgba(0,0,0,.3);
  padding:14px 22px}
.kpi:hover{border-color:rgba(245,176,66,.3);background:rgba(245,176,66,.04);
  box-shadow:0 6px 22px -10px rgba(245,176,66,.4)}
.kpi b{font-weight:800}
.kpi.ok b{color:#3eda7a;text-shadow:0 0 12px rgba(62,218,122,.4)}
.kpi.bad b{color:#ff4b3a;text-shadow:0 0 12px rgba(255,75,58,.4)}
.kpi.ban b{color:var(--gold);text-shadow:0 0 12px rgba(245,176,66,.4)}

.chip{border-radius:999px;border-color:rgba(245,176,66,.15);background:rgba(0,0,0,.3);color:#a89e87}
.chip:hover{border-color:var(--gold);color:#ece1c5}
.chip.active{background:linear-gradient(135deg,var(--gold),#b8222a);border-color:var(--gold);
  color:#1a0f08;font-weight:800;box-shadow:0 4px 14px -4px rgba(245,176,66,.5)}

h3 .tag{background:linear-gradient(135deg,rgba(245,176,66,.15),rgba(184,34,42,.1));
  border:1px solid rgba(245,176,66,.3);border-radius:999px;color:var(--gold);
  font-weight:700;padding:3px 11px}

/* === ПУСТОЕ СОСТОЯНИЕ: центрированный блок с иконкой и подсказкой === */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:38px 24px 32px;gap:6px;position:relative}
.empty-state::before{content:"";position:absolute;left:50%;top:36px;transform:translateX(-50%);
  width:110px;height:110px;background:var(--rune);border-radius:50%;
  filter:blur(8px);opacity:.7;pointer-events:none;z-index:0}
.empty-state svg{width:46px;height:46px;color:var(--gold);opacity:.85;
  filter:drop-shadow(0 0 12px rgba(245,176,66,.45));position:relative;z-index:1;margin-bottom:6px}
.empty-state-title{font-family:"Exo 2",sans-serif;font-size:15px;font-weight:700;
  color:#ece1c5;letter-spacing:.08em;text-transform:uppercase;position:relative;z-index:1}
.empty-state-sub{font-size:13px;color:#9a9180;line-height:1.55;max-width:480px;
  margin:4px auto 0;position:relative;z-index:1}
.empty-state-sub code{background:rgba(245,176,66,.06);color:var(--gold);
  border-radius:4px;font-size:11.5px;padding:1px 6px;margin:0 2px}

/* === TOOLS v3 hotfix ====================================================
   - Прячем .smart-banner: его роль перешла на AI-bar + встроенный fill-all.
   - .field-head становится одной линией: [имя поля] ... [?] [рекомендуемое].
   - Кастомная галочка применяется ко всем чекбоксам внутри .card.
   ====================================================================== */
.smart-banner{display:none !important}

.card .field-head{display:flex;align-items:center;gap:10px;
  font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold-soft,#d6b070);font-family:"Exo 2",sans-serif;
  font-weight:600;line-height:1.2;
  margin-top:14px;margin-bottom:10px}
/* Если head — самый первый ребёнок label, верхний отступ не нужен (его задаёт сам label) */
.card label > .field-head:first-child{margin-top:0}
.card .field-head .fh-title{flex:0 1 auto;color:#e8d9b0;text-transform:uppercase;
  letter-spacing:.1em;font-size:11.5px;white-space:normal;line-height:1.25}
.card .field-head .fh-title:empty{display:none}
.card .field-head .tt{margin-left:auto}
.card .field-head .fh-title + .tt{margin-left:auto}
.card .field-head .recommend-btn{flex:0 0 auto;margin-left:22px}
/* Когда у head вообще нет текста-метки (старые mini-карточки) — резерв слева,
   чтобы «?» и значок «рекомендуемое» не лепились друг к другу у самого края. */
.card .field-head .fh-title:empty + .tt{margin-left:auto}
.card .field-head:not(:has(.fh-title:not(:empty))){padding-left:2px}

/* «Заполнить рекомендуемыми» — рядом с «Предпросмотр», тот же визуальный язык */
.ai-tune-bar .fill-all-btn{padding:10px 16px;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;font-family:"Exo 2",sans-serif;font-weight:700;
  background:rgba(245,176,66,.06);color:var(--gold);
  border:1px solid rgba(245,176,66,.3);border-radius:10px;cursor:pointer;transition:.18s;
  white-space:nowrap;display:inline-flex;align-items:center;gap:8px;flex:0 0 auto}
/* Иконка-«искра» через SVG mask — та же визуальная мова, что у «Настроить через AI». */
.ai-tune-bar .fill-all-btn::before{content:"";width:13px;height:13px;display:inline-block;
  background:var(--gold);transition:background .18s;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M9.94 15.5A2 2 0 0 0 8.5 14.06L2.5 12l6-2.06A2 2 0 0 0 9.94 8.5L12 2.5l2.06 6A2 2 0 0 0 15.5 9.94L21.5 12l-6 2.06a2 2 0 0 0-1.44 1.44L12 21.5z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M9.94 15.5A2 2 0 0 0 8.5 14.06L2.5 12l6-2.06A2 2 0 0 0 9.94 8.5L12 2.5l2.06 6A2 2 0 0 0 15.5 9.94L21.5 12l-6 2.06a2 2 0 0 0-1.44 1.44L12 21.5z'/></svg>") center/contain no-repeat}
.ai-tune-bar .fill-all-btn:hover::before{background:#fff}
.ai-tune-bar .fill-all-btn:hover{background:rgba(245,176,66,.14);color:#fff;border-color:var(--gold);
  box-shadow:0 4px 18px -8px rgba(245,176,66,.6)}

/* Чтобы AI-bar input-row не вылазил вправо при 3 кнопках — разрешаем перенос
   и input занимает минимум 240px (растягиваясь, если есть место). */
.ai-tune-bar > div:nth-child(2){flex-wrap:wrap}
.ai-tune-bar > div:nth-child(2) > input.ai-prompt{flex:1 1 240px;min-width:200px}

/* Глобальный grid2: 2 колонки на широких экранах, 1 на узких. Раньше
   правило существовало только для .adv .grid2 — поля Сканера ложились
   стопкой и форма выглядела зажатой в углу. */
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
@media (max-width:720px){ .grid2{grid-template-columns:1fr} }

/* === КАСТОМНЫЕ СКРОЛЛБАРЫ ============================================
   Стандартный системный «кубик» в углу выглядит дёшево. Делаем тонкий
   gold→blood скролл в стиле бренда, и одинаковый и в WebKit, и в Firefox.
   ==================================================================== */
*{scrollbar-width:thin;scrollbar-color:rgba(245,176,66,.35) transparent}
*::-webkit-scrollbar{width:10px;height:10px;background:transparent}
*::-webkit-scrollbar-track{background:rgba(0,0,0,.35);border-radius:8px}
*::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(245,176,66,.55),rgba(184,34,42,.55));
  border:2px solid rgba(0,0,0,.4);border-radius:8px;
  box-shadow:inset 0 0 0 1px rgba(245,176,66,.25)}
*::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,var(--gold),var(--blood));
  box-shadow:inset 0 0 0 1px rgba(245,176,66,.5),0 0 8px rgba(245,176,66,.25)}
*::-webkit-scrollbar-corner{background:transparent}
/* Для маленьких контролов (textarea) — ещё тоньше */
textarea.inp::-webkit-scrollbar,
.console::-webkit-scrollbar,
.log::-webkit-scrollbar{width:8px;height:8px}


/* STAGE 3 visual polish — Cabinet/Subs/Admin/Settings */
.sec-hero{display:flex;align-items:center;gap:18px;padding:14px 4px 30px 4px;border-bottom:1px solid rgba(245,176,66,.08);margin-bottom:28px;background:linear-gradient(180deg,transparent,rgba(245,176,66,.015) 60%,transparent)}
.sec-hero-ico{flex:0 0 56px;width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(245,176,66,.12),rgba(184,34,42,.06));border:1px solid rgba(245,176,66,.25);border-radius:14px;color:var(--gold);box-shadow:0 6px 22px -10px rgba(245,176,66,.4),inset 0 1px 0 rgba(255,255,255,.05)}
.sec-hero-ico svg{width:28px;height:28px}
.sec-hero-txt h1{font-size:30px;letter-spacing:-.02em;line-height:1.05;font-weight:800;color:#f4e7c8}
.sec-hero-txt h1 em{color:var(--gold);font-style:italic;font-weight:600;letter-spacing:.01em}
.sec-hero-txt p{color:#9b8a66;font-size:13px;margin:4px 0 0 0;letter-spacing:.01em;line-height:1.4}
/* ====================================================================
   STAGE 3 — ВИЗУАЛЬНАЯ ПОЛИРОВКА: КАБИНЕТ / ПОДПИСКА / АДМИН / НАСТРОЙКИ
   ==================================================================== */

/* ---- Cabinet head (премиум-кеп с аватаркой и действиями) ---- */
.cab-head{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;
  padding:22px 26px;margin-bottom:24px;
  background:linear-gradient(135deg,rgba(245,176,66,.05),rgba(184,34,42,.03));
  border:1px solid rgba(245,176,66,.18);border-radius:18px;
  box-shadow:0 10px 40px -20px rgba(245,176,66,.3),inset 0 1px 0 rgba(255,255,255,.04)}
.cab-avatar-wrap{position:relative}
.cab-avatar{width:84px;height:84px;border-radius:50%;object-fit:cover;
  border:2px solid rgba(245,176,66,.4);box-shadow:0 8px 26px -10px rgba(245,176,66,.5)}
.cab-avatar.ava-empty{display:flex;align-items:center;justify-content:center;font-size:34px;
  background:linear-gradient(135deg,rgba(245,176,66,.18),rgba(184,34,42,.08));
  color:var(--gold-soft);font-weight:300}
.cab-avatar-upload{position:absolute;bottom:-2px;right:-2px;width:28px;height:28px;border-radius:50%;
  background:linear-gradient(135deg,var(--gold),#e09530);color:#1a0f08;cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;line-height:1;
  border:2px solid #0d0905;box-shadow:0 3px 12px -2px rgba(245,176,66,.5);transition:.2s}
.cab-avatar-upload:hover{transform:scale(1.1)}
.cab-avatar-upload input{position:absolute;opacity:0;width:0;height:0}
.cab-id h1{font-size:24px;margin:0;letter-spacing:-.01em;color:#f4e7c8;font-weight:700}
.cab-id .muted{margin-top:4px;font-size:12.5px;letter-spacing:.04em}
.cab-prov{display:inline-block;padding:2px 9px;border-radius:999px;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;background:rgba(245,176,66,.1);color:var(--gold);
  border:1px solid rgba(245,176,66,.25);font-family:"JetBrains Mono",monospace;font-weight:700}
.cab-actions{display:flex;gap:8px;flex-wrap:wrap}

/* ---- Grid-3 / Grid-2 ---- */
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:880px){.grid-3{grid-template-columns:1fr}}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:720px){.grid-2{grid-template-columns:1fr}}

/* ---- Cabinet KPI mini-карты ---- */
#pane-cabinet .card.mini{padding:20px 22px;display:flex;flex-direction:column;gap:10px;
  background:linear-gradient(180deg,rgba(245,176,66,.03),rgba(0,0,0,0));
  border:1px solid rgba(245,176,66,.15);border-radius:14px;position:relative;overflow:hidden}
#pane-cabinet .card.mini::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;
  background:linear-gradient(90deg,var(--gold) 0%,var(--blood) 80%,transparent);opacity:.45}
#pane-cabinet .card.mini h4{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:#a89776;margin:0;font-weight:700}
.cab-big{font-size:30px;font-weight:800;color:#f4e7c8;letter-spacing:-.02em;line-height:1;
  font-family:"Exo 2",sans-serif;
  background:linear-gradient(135deg,#f5d68a,var(--gold));-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.cab-topup-btn{margin-top:auto;padding:9px 14px;border-radius:10px;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;font-weight:700;cursor:pointer;
  background:rgba(245,176,66,.08);border:1px solid rgba(245,176,66,.3);color:var(--gold);
  font-family:"Exo 2",sans-serif;transition:.18s}
.cab-topup-btn:hover{background:linear-gradient(135deg,var(--gold),#ffd47a);color:#1a0f08;
  border-color:var(--gold);box-shadow:0 6px 20px -8px rgba(245,176,66,.55)}

/* ---- Referral ---- */
.ref-card{border:1px solid rgba(245,176,66,.2);
  background:linear-gradient(180deg,rgba(245,176,66,.03),transparent 70%)}
.ref-pct{display:inline-block;margin-left:8px;padding:3px 10px;font-size:11px;letter-spacing:.14em;
  background:linear-gradient(135deg,var(--gold),var(--blood));color:#1a0f08;border-radius:999px;
  font-weight:800;font-family:"JetBrains Mono",monospace;vertical-align:middle}
.ref-link-box{background:rgba(0,0,0,.3);border:1px dashed rgba(245,176,66,.2);border-radius:12px;
  padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.ref-label{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  margin-bottom:4px;color:#7a6e54}
.ref-row{display:flex;gap:8px;align-items:center}
.ref-row .inp{flex:1;font-family:"JetBrains Mono",monospace;font-size:12px}
.ref-stat{text-align:center}
.ref-stat-lbl{font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:8px}
.ref-stat .cab-big{font-size:24px;margin:0 auto}
.ref-code-show{font-family:"JetBrains Mono",monospace !important;letter-spacing:.04em !important}
.ref-perk{padding:18px 20px;background:rgba(245,176,66,.04);border:1px solid rgba(245,176,66,.18);
  border-radius:14px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.ref-perk-ico{margin-bottom:4px}
.ref-perk-val{font-size:26px;font-weight:800;color:var(--gold);font-family:"Exo 2",sans-serif;line-height:1}
.ref-perk-lbl{font-size:12px;color:#a89776;line-height:1.4}

/* ---- Subscription: packages ---- */
.packages-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.pkg{position:relative;padding:24px 22px;
  background:linear-gradient(180deg,rgba(245,176,66,.04),transparent 60%);
  border:1px solid rgba(245,176,66,.18);border-radius:18px;
  display:flex;flex-direction:column;gap:12px;transition:.22s;overflow:hidden}
.pkg:hover{transform:translateY(-3px);border-color:var(--gold);
  box-shadow:0 14px 40px -16px rgba(245,176,66,.45)}
.pkg.recommended{border:1px solid var(--gold);
  background:linear-gradient(180deg,rgba(245,176,66,.08),transparent 70%);
  box-shadow:0 14px 40px -18px rgba(245,176,66,.5)}
.pkg h3{margin:0;font-size:18px;letter-spacing:-.01em;color:#f4e7c8}
.pkg-price{font-size:34px;font-weight:800;color:var(--gold);line-height:1;letter-spacing:-.02em;
  background:linear-gradient(135deg,#f5d68a,var(--gold));-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.pkg-modules{display:flex;flex-wrap:wrap;gap:6px}
.pkg-modules .chip{font-size:10px;letter-spacing:.14em;padding:4px 10px;border-radius:999px;
  background:rgba(245,176,66,.06);border:1px solid rgba(245,176,66,.2);color:#d6b070;
  font-family:"JetBrains Mono",monospace;text-transform:uppercase;font-weight:700}
.pkg-buy{margin-top:auto;padding:12px 18px;border-radius:12px;font-weight:800;cursor:pointer;
  background:linear-gradient(135deg,var(--gold),#e09530);color:#1a0f08;border:none;
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  box-shadow:0 6px 18px -8px rgba(245,176,66,.55),inset 0 1px 0 rgba(255,255,255,.2);transition:.18s}
.pkg-buy:hover{transform:translateY(-1px);box-shadow:0 10px 28px -10px rgba(245,176,66,.7)}

/* ---- Subscription: quote-box ---- */
.sub-builder{display:grid;grid-template-columns:1fr 320px;gap:22px}
@media (max-width:880px){.sub-builder{grid-template-columns:1fr}}
.quote-box{position:sticky;top:20px;padding:22px 24px;
  background:linear-gradient(180deg,rgba(245,176,66,.06),rgba(184,34,42,.02));
  border:1px solid rgba(245,176,66,.2);border-radius:18px;
  box-shadow:0 14px 40px -16px rgba(245,176,66,.3)}
.quote-row{display:flex;justify-content:space-between;padding:9px 0;
  border-bottom:1px dashed rgba(245,176,66,.1);font-size:13px}
.quote-row:last-of-type{border-bottom:none}
.quote-row span{color:#9b8a66}
.quote-row b{color:#f4e7c8;font-weight:700}
.quote-discount{color:var(--ok) !important}
.quote-total{margin-top:14px;padding:14px 0 4px 0;border-top:1px solid rgba(245,176,66,.25);
  text-align:center;font-size:34px;font-weight:800;color:var(--gold);letter-spacing:-.02em;
  background:linear-gradient(135deg,#f5d68a,var(--gold));-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.quote-note{font-size:11px;color:#a89776;margin-top:6px;font-style:italic}
.days-slider{width:100%;margin:8px 0;accent-color:var(--gold)}

/* ---- Admin ---- */
.adm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:24px}
.adm-stat{padding:16px 18px;background:linear-gradient(180deg,rgba(245,176,66,.04),transparent 70%);
  border:1px solid rgba(245,176,66,.16);border-radius:14px;position:relative;overflow:hidden}
.adm-stat::before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;
  background:linear-gradient(180deg,var(--gold),var(--blood))}
.adm-stat-lbl{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#a89776;font-weight:700}
.adm-stat-val{font-size:24px;font-weight:800;color:#f4e7c8;margin-top:6px;line-height:1}

.adm-tabs{display:flex;gap:6px;margin-bottom:18px;border-bottom:1px solid rgba(245,176,66,.12);
  padding-bottom:0;flex-wrap:wrap}
.adm-tab{padding:11px 18px;background:transparent;border:none;
  color:#7a6e54;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  cursor:pointer;font-family:"Exo 2",sans-serif;position:relative;transition:.18s;border-radius:8px 8px 0 0}
.adm-tab:hover{color:#d6b070;background:rgba(245,176,66,.03)}
.adm-tab.active{color:var(--gold);background:rgba(245,176,66,.06)}
.adm-tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,var(--gold),var(--blood))}

.adm-search{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
.adm-search .inp{flex:1;min-width:240px;max-width:420px}

.adm-table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.adm-table thead th{padding:11px 14px;text-align:left;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:#7a6e54;font-weight:700;
  border-bottom:1px solid rgba(245,176,66,.18);background:rgba(245,176,66,.03)}
.adm-table tbody td{padding:11px 14px;border-bottom:1px solid rgba(255,255,255,.03);color:#c9b88a}
.adm-table tbody tr:hover td{background:rgba(245,176,66,.025)}
.adm-table .ctr{text-align:center;padding:30px;color:#5c5240;font-style:italic}
.adm-badge{display:inline-block;padding:3px 8px;font-size:10px;letter-spacing:.12em;border-radius:6px;
  font-family:"JetBrains Mono",monospace;font-weight:700;text-transform:uppercase}
.adm-badge.active{background:rgba(62,218,122,.12);color:var(--ok);border:1px solid rgba(62,218,122,.3)}
.adm-badge.banned{background:rgba(184,34,42,.12);color:#ff6b73;border:1px solid rgba(184,34,42,.35)}
.adm-badge.suspended{background:rgba(245,176,66,.12);color:var(--gold);border:1px solid rgba(245,176,66,.35)}
.adm-badge.unused{background:rgba(125,154,255,.12);color:#9ab1ff;border:1px solid rgba(125,154,255,.3)}

/* ---- Settings: log & license ---- */
.log-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;
  padding:10px 14px;background:rgba(245,176,66,.04);border:1px solid rgba(245,176,66,.12);
  border-radius:10px;flex-wrap:wrap;gap:10px}
.log-toolbar label{display:flex;align-items:center;gap:8px;color:#a89776;font-size:12px;cursor:pointer}
.log-clear{padding:6px 14px;background:rgba(184,34,42,.1);border:1px solid rgba(184,34,42,.3);
  color:#ff8b92;border-radius:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  cursor:pointer;font-family:"Exo 2",sans-serif;font-weight:700;transition:.18s}
.log-clear:hover{background:rgba(184,34,42,.25);color:#fff}
.log{max-height:480px;overflow-y:auto;font-family:"JetBrains Mono",monospace;font-size:12px;
  background:#0a0805;border:1px solid rgba(245,176,66,.12);border-radius:10px;padding:14px}
.log-line{padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.02);color:#a89776;line-height:1.5}
.log-line .ts{color:#5c5240;margin-right:8px}
.log-line .kind{color:var(--gold);font-weight:700;margin-right:8px}
.lic-key{font-family:"JetBrains Mono",monospace;font-size:13px;
  padding:14px;background:rgba(0,0,0,.4);border:1px dashed rgba(245,176,66,.2);border-radius:10px;
  color:var(--gold);margin-bottom:10px;letter-spacing:.04em;word-break:break-all}

/* ---- Тег (общий) ---- */
.tag{display:inline-block;padding:2px 9px;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;font-family:"JetBrains Mono",monospace;font-weight:700;
  border-radius:999px;background:rgba(245,176,66,.08);color:var(--gold);
  border:1px solid rgba(245,176,66,.25);margin-left:8px;vertical-align:middle}

/* Сетка карточек, адаптирующаяся под число элементов.
   Используется для разделов с переменным числом мини-карт
   (Парсинг: 4 карты, Активность: 3 и т.п.) — раскладывает по 280px минимум. */
.cards-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px}
.cards-auto > .card.mini{height:100%}

/* Когда output-list содержит только пустое состояние, не нужна 280px-сетка —
   разворачиваем во всю ширину и центрируем содержимое. */
.output-list:has(> .empty-state){display:block}
.output-list > .empty-state{width:100%;box-sizing:border-box;margin:0 auto;min-height:220px}

/* ====================================================================
   HOTFIX 4: бейдж РЕКОМЕНДУЕМ + знак ?-вирівнювання + dot-artifact
   ==================================================================== */

/* «РЕКОМЕНДУЕМ» — теперь висит НА верхней кромке (стикер), а не «языком»
   внутри карточки. */
.pkg.recommended{padding-top:26px}
.pkg.recommended::after{
  top:-14px;             /* выходим за верх карточки */
  font-size:9.5px;
  padding:6px 16px;
  background:linear-gradient(135deg,#e34a4a,#b8222a);
  border:1px solid rgba(255,255,255,.12);
  text-shadow:0 1px 0 rgba(0,0,0,.3);
  box-shadow:
    0 6px 18px -6px rgba(184,34,42,.7),
    inset 0 1px 0 rgba(255,255,255,.22);
}

/* «?» — выровнен по baseline соседнего текста, без сдвигов */
.tt{vertical-align:baseline !important;
  position:relative;top:2px;line-height:1}
/* Внутри field-head «?» в одной строке с именем — отдельный align center */
.card .field-head .tt{top:0;align-self:center}
/* В hero-блоке (например, Подписка hero) «?» внутри <p> — лёгкий подъём */
.sec-hero-txt .tt{top:1px}

/* Артефакт-точка справа в кабинете — это был остаток от .ai-mic
   декоративных колец, которые в кабинете не нужны. Изолируем чтобы
   ai-mic-ring/before/after не «протекали» на блоки кабинета. */
#pane-cabinet .ai-mic-ring,
#pane-cabinet .ai-mic::before,
#pane-cabinet .ai-mic::after{display:none !important}

/* ====================================================================
   HOTFIX 5: оранж-точки, тултип-overflow, ?-близько-до-заголовка,
   number-стрілки, анімація details, відстань до кнопок
   ==================================================================== */

/* 1. Прибираємо помаранчеві • перед заголовками карток */
.card h3::before,
.card.mini h4::before{display:none !important;content:"" !important;width:0 !important;height:0 !important;margin:0 !important}

/* 2. Тултип `?` → відкривається ВНИЗ під іконкою, не вилазить за межі картки */
.tt[data-tip]:hover::after{
  top:24px !important;          /* нижче `?` */
  left:50% !important; right:auto !important;
  transform:translateX(-50%) !important;
  width:280px !important;
  max-width:min(280px,calc(100vw - 40px)) !important;
  border:1px solid var(--line-2) !important;
  border-top:2px solid var(--accent-2) !important;
  border-left:1px solid var(--line-2) !important;
  border-right:1px solid var(--line-2) !important;
}
/* Стрілочка-pointer тултіпа над ним */
.tt[data-tip]:hover::before{
  content:"" !important; position:absolute !important;
  top:18px !important; left:50% !important;
  transform:translateX(-50%) !important;
  border:6px solid transparent !important;
  border-bottom-color:var(--accent-2) !important;
  z-index:51 !important; pointer-events:none !important;
}

/* 3. «?» близько до title, рекомендуемое — на праву межу */
.card .field-head .fh-title{flex:1 1 auto !important}
.card .field-head .tt{margin-left:8px !important}
.card .field-head .recommend-btn{margin-left:auto !important}

/* 4. Number-input UP/DOWN стрілки — прибираємо */
input.inp[type="number"]{-moz-appearance:textfield;appearance:textfield}
input.inp[type="number"]::-webkit-inner-spin-button,
input.inp[type="number"]::-webkit-outer-spin-button{
  -webkit-appearance:none;appearance:none;margin:0
}

/* 5. Анімація розгортання <details> */
details > *:not(summary){
  animation:detailFade .22s ease-out
}
@keyframes detailFade{
  from{opacity:0;transform:translateY(-6px)}
  to  {opacity:1;transform:translateY(0)}
}
details summary{cursor:pointer;list-style:none;transition:color .15s}
details summary::-webkit-details-marker{display:none}
details > summary::before{
  content:"▸";display:inline-block;margin-right:8px;
  transition:transform .2s;color:var(--gold)
}
details[open] > summary::before{transform:rotate(90deg)}

/* 6. Зменшити відстань: textarea proxy → кнопки нижче */
.card details + *,
.card details ~ button,
.card details ~ .row{margin-top:10px !important}
.card details textarea.inp{margin-bottom:8px}
.card details .row{gap:8px;margin-top:8px}

/* ====================================================================
   HOTFIX 6: AI-bar glow, sub-tabs spacing+animation, status-row,
   глобальний sweep: ?-вплотную-к-тексту
   ==================================================================== */

/* 1. Зменшити свічення «НАСТРОИТЬ ЧЕРЕЗ AI» */
.ai-tune-btn{
  box-shadow:0 2px 8px -3px rgba(245,176,66,.35),inset 0 1px 0 rgba(255,255,255,.12) !important
}
.ai-tune-btn:hover{
  box-shadow:0 4px 14px -4px rgba(245,176,66,.45),inset 0 1px 0 rgba(255,255,255,.2) !important
}

/* 2. Sub-tabs: відступ зверху + анімація появи активного pane */
.sub-tabs,.sub-nav{margin-top:14px}
.sub-pane.active{animation:subPaneIn .25s ease-out}
@keyframes subPaneIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}
.sub-tab{transition:all .18s ease-out}

/* 3. Глобальна правка: ?-знак БІЛЯ тексту, не «з автомаргіном» */
.field-head .fh-title + .tt,
.card .field-head > .tt{margin-left:6px !important;margin-right:auto !important}
/* recommend-btn автом на праву межу — лишається */
.card .field-head .recommend-btn{margin-left:auto !important}

/* 4. Footer-рядок «Прочекано: X • Валидных: Y …» — стиль шильдиком */
.status-row,.tab-stats,.status-line{
  margin-top:14px;padding:10px 14px;border-radius:8px;
  background:rgba(245,176,66,.04);border:1px dashed rgba(245,176,66,.16);
  font-family:"JetBrains Mono",monospace;font-size:11.5px;color:#a89776;
  letter-spacing:.05em;display:flex;gap:14px;flex-wrap:wrap;align-items:center
}
.status-row b,.tab-stats b{color:var(--gold)}

/* ====================================================================
   HOTFIX 7: select-dropdown темна тема + section header вирівнювання
   ==================================================================== */

/* <option> у нативному dropdown — мінімум що можна стилізувати кроссбраузерно.
   Не дасть нашого кастомного gold-orange, але хоча б темне тло без білого. */
select.inp option,
.adv select.inp option{
  background:#0d0a07 !important;
  color:#ece1c5 !important;
  padding:8px 12px !important;
}
select.inp option:checked,
select.inp option:hover{
  background:linear-gradient(135deg,rgba(245,176,66,.18),rgba(184,34,42,.1)) !important;
  color:#fff !important;
}
/* На Firefox sometimes selected пишеться focus */
select.inp option:focus{background:rgba(245,176,66,.18) !important}

/* Section header РЕПЛАИ/ПОПУЛЯРНЫЕ/ЧС юзеров — вирівняти ліворуч,
   прибрати випадковий зсув */
.adv h5,.card h5{
  margin:18px 0 8px 0;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-soft,#d6b070);
  padding-left:0;font-weight:700;display:flex;align-items:center;gap:8px
}
.adv h5::before,.card h5::before{
  content:"";width:14px;height:1px;background:var(--gold);opacity:.6
}

/* ====================================================================
   HOTFIX 8: aside-help зірочки, scanner scam-чекбокс, фейк-аналіз
   ==================================================================== */

/* 1. Кривые желтые зірочки в `<aside class="aside-help">` */
.aside-help ul,.aside-help ol{list-style:none;padding:0;margin:0}
.aside-help li{position:relative;padding-left:22px;margin-bottom:14px;line-height:1.5}
.aside-help li::before{
  content:"";position:absolute;left:0;top:.5em;
  width:7px;height:7px;border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--blood));
  box-shadow:0 0 6px rgba(245,176,66,.35)
}

/* 2. Sканер: «исключать scam/fake» — лево, не по центру */
#pane-scanner label.row,
#pane-scanner .form .row{
  justify-content:flex-start !important;
  align-items:center !important;
  text-align:left !important
}
#pane-scanner label.row > input[type="checkbox"]{
  margin-right:8px !important
}

/* 3. «Анализ конфига» — приховувати коли metric'и НЕ заповнені реально */
.preview-holder:has(.metric-bar:not([data-real="1"])){
  display:none
}
/* безпечне: якщо холдер пустий, теж сховати */
.preview-holder:empty{display:none}

/* ====================================================================
   HOTFIX 9: модал-prompt + AI-avatar background
   ==================================================================== */
.mit-modal-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;z-index:10000;
  animation:modalIn .18s ease-out
}
.mit-modal-overlay.mit-modal-out{animation:modalOut .18s ease-in forwards}
@keyframes modalIn{from{opacity:0}to{opacity:1}}
@keyframes modalOut{from{opacity:1}to{opacity:0}}
.mit-modal-card{
  background:linear-gradient(180deg,#1a120a,#0d0805);
  border:1px solid rgba(245,176,66,.3);border-radius:18px;
  padding:30px 32px;min-width:380px;max-width:90vw;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.8),
             inset 0 1px 0 rgba(255,255,255,.04);
  position:relative;animation:cardIn .22s cubic-bezier(.2,.7,.2,1)
}
@keyframes cardIn{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.mit-modal-x{
  position:absolute;top:14px;right:14px;background:none;border:none;
  color:#7a6e54;font-size:24px;cursor:pointer;width:30px;height:30px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  transition:.18s
}
.mit-modal-x:hover{color:var(--gold);background:rgba(245,176,66,.06)}
.mit-modal-title{
  margin:0 0 8px 0;font-size:18px;color:#f4e7c8;letter-spacing:-.01em;
  font-weight:700
}
.mit-modal-label{margin:0 0 14px 0;color:#a89776;font-size:13px;line-height:1.4}
.mit-modal-input{width:100%;font-size:15px;margin-bottom:18px}
.mit-modal-actions{display:flex;gap:10px;justify-content:flex-end}
.mit-modal-actions .btn{padding:9px 18px}
/* multi-field modal (modalForm) */
.mit-modal-hint{margin:0 0 16px;color:#8a7c5e;font-size:12.5px;line-height:1.45;
  padding:9px 12px;border-left:2px solid var(--accent-2);background:rgba(184,34,42,.06);border-radius:0 8px 8px 0}
.mit-modal-field{margin-bottom:4px}
.mit-modal-field .mit-modal-label{display:block;margin:0 0 6px;color:#c9b88a;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase}
.mit-modal-field .mit-modal-input{margin-bottom:14px}

/* ai assistant avatar — окружий золотий glow */
.ai-msg.assistant .ai-mini-av{
  background:radial-gradient(circle at 30% 25%,#2a1810,#0b0807) !important;
  border:1px solid rgba(245,176,66,.35) !important;
  box-shadow:0 0 8px rgba(245,176,66,.2)
}
.ai-msg.assistant .ai-mini-av svg{filter:drop-shadow(0 0 4px rgba(245,176,66,.3))}

/* ====================================================================
   HOTFIX 10: z-index пріоритет тултіпа + parent overflow
   ==================================================================== */

/* Якщо предок має overflow:hidden — тултіп ріжеться. Робимо tooltip
   найвищим у стекінг-контексті + знімаємо clipping з найчастіших
   контейнерів. */
.tt[data-tip]:hover::after{
  z-index:99999 !important;
  position:absolute !important;
}
.tt[data-tip]:hover::before{
  z-index:99998 !important;
}

/* Дозволити tooltip-у виходити за межі .card / .form / .adv / .field-head */
.card,.card.mini,.form,.form.col,.adv,
.card .field-head,.card label,.card details,.card details > div,
.card .grid2,.cards-auto,.grid-2,.grid-3{
  overflow:visible !important
}
/* Але tooltip має бути НАД сусідніми input-полями: ставимо .tt у власний
   stacking-контекст з високим z-index. */
.tt{position:relative;z-index:1000}
.tt:hover{z-index:99999}
/* Безпека: input не повинен перекривати tooltip */
.card input.inp,.card textarea.inp,.card select.inp{position:relative;z-index:1}

/* На дуже малій ширині — tooltip займає максимум доступного, аби не вилазив */
@media (max-width:600px){
  .tt[data-tip]:hover::after{
    width:auto !important;
    max-width:calc(100vw - 30px) !important
  }
}

/* ====================================================================
   HOTFIX 11: scan-scam checkbox — лево, з кастомним стилем
   ==================================================================== */
.scan-scam-row{
  display:flex !important;
  flex-direction:row !important;          /* перебиваємо .form.col label{flex-direction:column} */
  align-items:center !important;
  gap:10px !important;
  align-self:flex-start !important;       /* НЕ розтягувати на всю ширину form.col */
  margin-top:8px !important;
  padding:10px 16px !important;
  border-radius:10px !important;
  background:rgba(245,176,66,.04) !important;
  border:1px solid rgba(245,176,66,.12) !important;
  cursor:pointer !important;transition:.18s !important;
  font-size:13px !important;letter-spacing:.06em !important;
  color:#c9b88a !important;
  text-transform:none !important;          /* form.col label має uppercase */
  width:fit-content !important;
  font-weight:500 !important;
}
.scan-scam-row > span{
  display:inline-block !important;
  letter-spacing:.06em !important;
  font-size:13px !important;
  color:inherit !important;
  text-transform:none !important;
  white-space:nowrap !important;
}
.scan-scam-row:hover{
  background:rgba(245,176,66,.08);
  border-color:rgba(245,176,66,.25);
  color:#ece1c5
}
.scan-scam-row input[type="checkbox"]{
  appearance:none !important;-webkit-appearance:none !important;
  width:18px !important;height:18px !important;flex:0 0 18px !important;
  border:1.5px solid rgba(245,176,66,.4) !important;
  background:rgba(0,0,0,.5) !important;
  border-radius:5px !important;cursor:pointer !important;
  position:relative !important;transition:.18s !important;
  margin:0 !important;vertical-align:middle !important;
}
.scan-scam-row input[type="checkbox"]:hover{border-color:var(--gold) !important}
.scan-scam-row input[type="checkbox"]:checked{
  background:linear-gradient(135deg,var(--gold),var(--blood)) !important;
  border-color:var(--gold) !important;
  box-shadow:0 0 8px rgba(245,176,66,.35) !important;
}
.scan-scam-row input[type="checkbox"]:checked::after{
  content:"" !important;position:absolute !important;
  left:5px !important;top:2px !important;
  width:5px !important;height:9px !important;
  border:solid #1a0f08 !important;border-width:0 2px 2px 0 !important;
  transform:rotate(45deg) !important;
}

/* ────────── HOTFIX 12: CLONING секции (details-аккордеоны) ────────── */
#cloning-fields .clone-section{
  border: 1px solid var(--line, rgba(255,215,140,.18));
  border-radius: 12px;
  background: rgba(20,14,8,.45);
  margin-bottom: 12px;
  overflow: hidden;
}
#cloning-fields .clone-section > summary{
  cursor: pointer;
  padding: 12px 16px;
  font-weight: 600;
  font-size: 14px;
  color: var(--gold, #ffd78c);
  background: linear-gradient(90deg, rgba(255,215,140,.07), transparent 70%);
  list-style: none;
  user-select: none;
  transition: background .18s ease;
}
#cloning-fields .clone-section > summary::-webkit-details-marker{ display:none }
#cloning-fields .clone-section > summary::before{
  content: "▸";
  display: inline-block;
  margin-right: 8px;
  transition: transform .2s ease;
  color: var(--gold, #ffd78c);
}
#cloning-fields .clone-section[open] > summary::before{ transform: rotate(90deg) }
#cloning-fields .clone-section > summary:hover{ background: linear-gradient(90deg, rgba(255,215,140,.13), transparent 70%) }
#cloning-fields .clone-section-body{
  padding: 14px 16px 6px;
  animation: clone-fade .25s ease;
}
@keyframes clone-fade{
  from { opacity:0; transform: translateY(-4px) }
  to   { opacity:1; transform: translateY(0) }
}

/* ====================================================================
   HOTFIX 13: бейдж «РЕКОМЕНДУЕМ» обрезался верхней кромкой карточки.
   Причина: .pkg имеет overflow:hidden, а бейдж позиционируется top:-14px
   (выходит за верх). Разрешаем overflow только рекомендованной карточке
   и даём ей запас сверху, чтобы стикер целиком был виден.
   ==================================================================== */
.pkg.recommended{
  overflow:visible;          /* пускаем стикер за верхнюю кромку */
  /* margin-top УБРАН: он сдвигал всю карточку вниз в grid-ряду, из-за чего
     заголовок и список фич Standard были ниже Lite/Pro. Бейдж и так виден
     благодаря overflow:visible + top:-13px. Запас сверху даём всему гриду. */
}
/* запас сверху на весь ряд пакетов, чтобы стикер не лип к заголовку «Готовые пакеты» */
.packages-grid{margin-top:22px}
.pkg.recommended::after{
  top:-13px;                 /* ровно над кромкой, целиком видим */
  z-index:5;
  white-space:nowrap;
}

/* ====================================================================
   HOTFIX 14: аватар в шапке (chip пользователя) был квадратным на
   мобильных. Делаем правило круглой формы непробиваемым — !important,
   чтобы никакой глобальный border-radius его не перебивал.
   ==================================================================== */
.auth-slot .auth-user img,
.auth-slot .auth-user .ava-empty{
  border-radius:50% !important;
  aspect-ratio:1/1;
  flex:0 0 26px;
  object-fit:cover;
}

/* ====================================================================
   HOTFIX 15: мобильная вёрстка кабинета.
   ПРИЧИНА: на десктопе .cab-head стал display:grid (3 колонки), а старый
   мобильный оверрайд задавал flex-direction:column — на grid это НЕ
   действует. Шапка оставалась 3-колоночной на телефоне, кнопки
   «Изменить имя»/«Выйти» не влезали и распирали страницу вправо →
   весь контент кабинета срезался слева. Плюс таблица ключей (7 колонок)
   тоже распирала страницу.
   ИСПРАВЛЕНИЕ: на мобиле шапку — в вертикальный flex по центру; таблицу —
   в собственный горизонтальный скролл (display:block); запрет
   горизонтального выезда всей страницы.
   ==================================================================== */
@media (max-width:760px){
  /* шапка профиля: перебиваем display:grid → вертикальный стек по центру */
  .cab-head{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    gap:14px !important;
    padding:20px 16px !important;
  }
  .cab-id{flex:none !important;width:100% !important}
  .cab-id .muted{justify-content:center}

  /* кнопки действий — на всю ширину, по центру, с переносом */
  .cab-actions{
    width:100% !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
  }
  .cab-actions .btn{flex:1 1 130px !important}

  /* запрет горизонтального выезда страницы (был источник срезанного текста) */
  html,body{overflow-x:hidden !important}

  /* таблица ключей: собственный горизонтальный скролл внутри карточки,
     а не разрыв всей страницы */
  .adm-table{
    display:block !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    white-space:nowrap;
    width:100%;
  }

  /* мини-карты кабинета: контент не должен вылезать за края */
  #pane-cabinet .card,
  #pane-cabinet .card.mini{overflow-x:hidden}
  .cab-big{font-size:26px}
}

/* ====================================================================
   HOTFIX 16: мобильная навигация (шапка сайта).
   Табы переносились в два рваных ряда. Делаем равномерную полосу с
   горизонтальным скроллом, прячем подзаголовок бренда на узких экранах,
   аватар-chip компактнее. Источник горизонтального выезда страницы
   тоже устраняем.
   ==================================================================== */
@media (max-width:760px){
  .nav-row{flex-wrap:wrap;gap:10px;align-items:center}
  .brand-mark{width:42px;height:42px}
  .brand-text .b1{font-size:17px}
  /* подзаголовок «панель управления» на узком — лишний шум, убираем */
  .brand-text .b2{display:none}

  /* табы: одна линия с горизонтальным скроллом, ровные отступы */
  .tabs{
    order:3;width:100%;
    flex-wrap:nowrap !important;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    justify-content:flex-start;
    gap:2px;
    padding-bottom:2px;
    scrollbar-width:none;
  }
  .tabs::-webkit-scrollbar{display:none}
  .tab{padding:9px 12px;font-size:10.5px;white-space:nowrap;flex:0 0 auto}

  /* chip пользователя компактнее, чтобы не теснил логотип */
  .auth-slot{margin-left:auto;order:2}
  .auth-slot .auth-user{padding:4px 8px 4px 4px}
  .auth-slot .auth-user b{font-size:11px;max-width:90px;overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap;display:block}
}

/* ====================================================================
   HOTFIX 17: выравнивание карточек пакетов по вертикали.
   ПРИЧИНА: tagline у Standard («Оптимально для большинства») занимает
   2 строки, у Lite/Pro — 1 строку. Из-за этого .pkg-head выше и список
   фич проваливается ниже, чем у соседей — выглядело криво «слева».
   ИСПРАВЛЕНИЕ: резервируем фикс-высоту под 2 строки tagline во всех
   карточках → списки фич стартуют на одной линии. Заголовок и цена —
   выравниваем по верхней кромке.
   ==================================================================== */
.pkg{display:flex;flex-direction:column}
.pkg-head{align-items:flex-start;gap:14px}
.pkg-head > div:first-child{flex:1;min-width:0}     /* левый блок (имя+tagline) тянется */
.pkg-name{line-height:1.1}
.pkg-tagline{
  min-height:2.6em;          /* запас под 2 строки — выравнивает старт фич */
  line-height:1.3;
}
/* кнопка «Выбрать пакет» остаётся прижатой к низу карточки (равная высота) */
.pkg-buy{margin-top:auto}

/* на мобиле (1 колонка) фикс-высота под tagline не нужна — только зря тянет */
@media (max-width:900px){
  .pkg-tagline{min-height:0}
}

/* ====================================================================
   HOTFIX 18: тултипы «?» на карточках пакетов обрезались краем карточки.
   ПРИЧИНА: .pkg имеет overflow:hidden и не входит в список overflow:visible,
   а тултип центрировался под «?» (left:50%/translateX(-50%)). У крайних
   карточек (Lite слева, Pro справа) 280px-подсказка вылезала за левую
   кромку и срезалась.
   ИСПРАВЛЕНИЕ: разрешаем тултипу выходить за карточку и привязываем его к
   ЛЕВОМУ краю «?» — раскрывается вправо, в пределах карточки. Больше не
   срезается ни у одной из трёх карточек.
   ==================================================================== */
.pkg{overflow:visible !important}
.pkg .tt[data-tip]:hover::after{
  left:0 !important;
  right:auto !important;
  transform:none !important;
  width:min(280px,86vw) !important;
  max-width:min(280px,86vw) !important;
}
.pkg .tt[data-tip]:hover::before{
  left:8px !important;
  transform:translateX(-50%) !important;
}

/* ====================================================================
   HOTFIX 19: карточки пакетов сбивались в левую половину секции, справа
   зияла пустота.
   ПРИЧИНА: .packages-grid использовал repeat(auto-fill,minmax(280px,1fr)) —
   на широком экране auto-fill создаёт ~6 колонок, но карточек только 3,
   поэтому они липли влево, а пустые треки висели справа.
   ИСПРАВЛЕНИЕ: ровно 3 колонки на всю ширину контента (как блок «собери
   свой» ниже) — карточки заполняют пространство и выровнены по краям с
   остальной страницей. На мобиле/планшете — адаптивно сворачиваются.
   ==================================================================== */
.packages-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
@media (max-width:900px){
  .packages-grid{grid-template-columns:1fr !important}
}
@media (min-width:901px) and (max-width:1200px){
  .packages-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}

/* ====================================================================
   HOTFIX 20: бейдж «РЕКОМЕНДУЕМ» торчал над карточкой («вилазить»), а
   раньше — подрезался, когда был внутри. Ставим бейдж ВНУТРЬ верхней зоны
   карточки: он больше не выходит за кромку и не режется. Чтобы заголовки
   всех трёх карточек остались на одной линии — даём одинаковый верхний
   отступ ВСЕМ .pkg (Standard заполняет это место бейджем, Lite/Pro —
   просто чуть больше воздуха сверху).
   ==================================================================== */
.pkg{padding-top:44px !important}
.pkg.recommended::after{
  top:13px !important;
  bottom:auto !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:5 !important;
}

/* ====================================================================
   HOTFIX 21: на Standard золотая рамка рекомендованной карточки
   (border:1px gold) перекрывала верхнюю красную акцент-линию (::before).
   Поднимаем красную линию НАД рамкой: top:-1px, во всю ширину (left/right
   -1px перекрывают углы рамки), z-index выше, скруглённые верхние углы.
   ==================================================================== */
.pkg.recommended::before{
  top:-1px !important;
  left:-1px !important;
  right:-1px !important;
  width:auto !important;
  height:4px !important;
  z-index:3 !important;
  border-radius:14px 14px 0 0 !important;
}

/* ====================================================================
   HOTFIX 22: гарантированно круглый аватар в чипе пользователя в шапке.
   Это может быть <img> от OAuth-провайдера (у admin — розовый
   буква-аватар Google) или .ava-empty. Максимальная специфичность через
   id чипа + overflow:hidden, чтобы картинка точно обрезалась в круг.
   ==================================================================== */
#auth-user-chip img,
#auth-user-chip .ava-empty,
.auth-slot .auth-user img,
.auth-slot .auth-user .ava-empty{
  border-radius:50% !important;
  width:28px !important;
  height:28px !important;
  aspect-ratio:1/1 !important;
  flex:0 0 28px !important;
  object-fit:cover !important;
  overflow:hidden !important;
}

/* ====================================================================
   HOTFIX 23: чип пользователя в шапке (рамка вокруг аватар+имя) был с
   острыми углами. Пользователь хочет скруглённые углы, как на примере.
   Скругляем контейнер .auth-user (аватар внутри остаётся круглым).
   ==================================================================== */
.auth-slot .auth-user,
#auth-user-chip{
  border-radius:14px !important;
  overflow:hidden;
}

/* ====================================================================
   HOTFIX 24+27: чистый редизайн чипа пользователя в шапке.
   Жалоба: "уебский дизайн" — рамка грубая, текст прижат, нет акцента.
   Делаем мягкую подложку, тонкую рамку, кольцо вокруг аватара,
   аккуратную типографику и интерактивный hover.
   ==================================================================== */
.auth-slot .auth-user,
#auth-user-chip{
  gap:9px !important;
  padding:5px 12px 5px 6px !important;
  border:1px solid rgba(245,176,66,.16) !important;
  background:linear-gradient(180deg,rgba(40,28,16,.45),rgba(18,13,9,.35)) !important;
  border-radius:999px !important;
  cursor:pointer;
  transition:border-color .18s, background .18s, transform .15s, box-shadow .18s;
}
.auth-slot .auth-user:hover,
#auth-user-chip:hover{
  border-color:rgba(245,176,66,.45) !important;
  background:linear-gradient(180deg,rgba(58,40,22,.6),rgba(24,17,11,.45)) !important;
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.auth-slot .auth-user img,
#auth-user-chip img,
.auth-slot .auth-user .ava-empty,
#auth-user-chip .ava-empty{
  box-shadow:0 0 0 2px rgba(184,34,42,.55), 0 0 0 3px rgba(245,176,66,.25) !important;
}
.auth-slot .auth-user b,
#auth-user-chip b{
  font-size:12.5px !important;
  letter-spacing:.02em !important;
  color:#f3e7cf !important;
  line-height:1.1;
}
.auth-slot .auth-user small,
#auth-user-chip small{
  font-size:9px !important;
  letter-spacing:.16em !important;
  color:rgba(245,176,66,.6) !important;
}
/* стрелка-каретка справа — намёк, что чип открывает кабинет */
#auth-user-chip::after{
  content:"";
  width:6px;height:6px;
  margin:0 2px 0 1px;
  border-right:1.6px solid rgba(245,176,66,.55);
  border-bottom:1.6px solid rgba(245,176,66,.55);
  transform:rotate(45deg) translateY(-1px);
  flex:0 0 auto;
  transition:border-color .18s;
}
#auth-user-chip:hover::after{ border-color:#f5b042; }

/* ====================================================================
   HOTFIX 25: подвал сайта с юр-ссылками (оферта/политика) + строка
   согласия в модалке пополнения. Нужно для модерации платёжных систем.
   ==================================================================== */
.site-foot{
  border-top:1px solid var(--line-2);
  margin-top:60px;
  padding:26px 0;
  background:linear-gradient(180deg,rgba(20,15,10,.35),rgba(12,10,7,.15));
}
.site-foot-row{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
}
.site-foot-brand{display:flex;align-items:center;gap:10px;color:var(--ink-d)}
.site-foot-mark{
  width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;
  filter:drop-shadow(0 0 8px rgba(184,34,42,.4));
}
.site-foot-mark svg{width:34px;height:34px;display:block}
.site-foot-brand b{display:block;font-size:14px;color:var(--ink);letter-spacing:.03em}
.site-foot-brand small{display:block;font-size:11px;color:var(--muted)}
.site-foot-links{display:flex;gap:20px;flex-wrap:wrap}
.site-foot-links a{
  color:var(--gold-soft);text-decoration:none;font-size:13px;
  border-bottom:1px dashed transparent;transition:.15s;
}
.site-foot-links a:hover{color:var(--gold);border-color:var(--gold-soft)}
.site-foot-copy{color:var(--muted);font-size:12px}
@media (max-width:640px){
  .site-foot-row{flex-direction:column;align-items:flex-start;gap:14px}
}

/* строка согласия в модалке пополнения */
.topup-legal{
  margin-top:12px;font-size:11.5px;line-height:1.5;color:var(--muted);text-align:center;
}
.topup-legal a{color:var(--gold-soft);text-decoration:none;border-bottom:1px dashed var(--gold-soft)}
.topup-legal a:hover{color:var(--gold)}

/* ====================================================================
   HOTFIX 26: способ оплаты в модалке пополнения. CryptoBot активен,
   остальные провайдеры (карта/СБП) пока «СКОРО» — некликабельны.
   ==================================================================== */
.topup-coin.disabled{
  opacity:.5; cursor:not-allowed; filter:grayscale(.4);
}
.topup-coin.disabled:hover{border-color:var(--line-2)}
.topup-mode.soon{
  font-size:9px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line-2); border-radius:999px;
  padding:3px 9px; white-space:nowrap;
}

/* ====================================================================
   HOTFIX 28: плавающая AI-кнопка (.ai-fab) и панель задач (.console)
   перекрывали контент в правом нижнем углу ("та залупа перекрывает").
   1) Внизу страницы добавляем запас, чтобы под кнопкой ничего не пряталось.
   2) Панель задач поднимаем ВЫШЕ кнопки, чтобы они не накладывались.
   3) Кнопку делаем чуть прозрачнее в покое и компактнее.
   ==================================================================== */
body{ padding-bottom:96px; }
.console{
  bottom:104px !important;   /* над AI-кнопкой (64px + отступы) */
  z-index:190 !important;
}
.ai-fab{
  width:56px !important; height:56px !important;
  opacity:.82;
  transition:opacity .18s, transform .18s, box-shadow .25s !important;
}
.ai-fab:hover{ opacity:1; }
.ai-fab-icon{ width:32px !important; height:32px !important; }
@media (max-width:720px){
  body{ padding-bottom:80px; }
  .console{ bottom:84px !important; right:10px !important; }
}

/* ====================================================================
   HOTFIX 29: знак вопроса в подсказках (.tt) выглядел кривым —
   символ "?" из моноширинного шрифта смещался от центра кружка.
   Жёстко центрируем глиф и выравниваем размеры.
   ==================================================================== */
.tt{
  width:17px !important; height:17px !important;
  line-height:15px !important;
  font-size:11px !important;
  font-weight:700 !important;
  font-family:"Exo 2",sans-serif !important;
  padding:0 !important;
  text-align:center !important;
  vertical-align:middle !important;
}
.tt::after, .tt::before{ box-sizing:border-box; }

/* ====================================================================
   HOTFIX 30: больше воздуха между блоками и от краёв.
   Жалоба: "всё близко друг к другу и к краям".
   ==================================================================== */
.container{ padding-left:28px; padding-right:28px; }
.sec, section.sec{ margin-bottom:34px; }
.cards-auto{ gap:18px; }
.card{ margin-bottom:4px; }
@media (max-width:720px){
  .container{ padding-left:16px; padding-right:16px; }
}

/* ====================================================================
   HOTFIX 31: загрузка аватара в модуле «Профиль».
   ==================================================================== */
.profile-ava-row{display:flex;align-items:center;gap:14px;margin-top:6px}
.profile-ava-preview{width:64px;height:64px;border-radius:50%;flex:0 0 64px;
  border:2px dashed rgba(245,176,66,.3);background:rgba(255,255,255,.02) center/cover no-repeat;
  display:flex;align-items:center;justify-content:center;color:rgba(245,176,66,.5);
  font-size:26px;font-weight:300;cursor:pointer;transition:.18s}
.profile-ava-preview.has{border-style:solid;border-color:rgba(245,176,66,.55)}
.profile-ava-ctl{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.profile-ava-ctl .btn{padding:6px 12px;font-size:11px}

/* ====================================================================
   HOTFIX 32: при наведении на чип юзера (справа сверху) — анимация,
   а не просто текст роли. Золотой блик пробегает по чипу + пульс-точка.
   ==================================================================== */
.auth-user-meta{display:flex;flex-direction:column;line-height:1.05}
#auth-user-chip{position:relative;overflow:hidden}
/* бегущий блик */
#auth-user-chip::before{
  content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(245,176,66,.28),transparent);
  transform:skewX(-18deg);opacity:0;pointer-events:none;
}
#auth-user-chip:hover::before{ animation:chipSheen 1.1s ease-in-out infinite; opacity:1; }
@keyframes chipSheen{ 0%{left:-60%} 100%{left:120%} }
/* пульсирующая точка-статус (живой индикатор) */
.auth-user-pulse{
  width:7px;height:7px;border-radius:50%;flex:0 0 7px;margin-left:1px;
  background:radial-gradient(circle at 40% 35%,#7dffa0,#1f9d4d);
  box-shadow:0 0 0 0 rgba(125,255,160,.6);
  animation:pulseDot 1.8s ease-out infinite;
}
@keyframes pulseDot{
  0%{box-shadow:0 0 0 0 rgba(125,255,160,.55)}
  70%{box-shadow:0 0 0 6px rgba(125,255,160,0)}
  100%{box-shadow:0 0 0 0 rgba(125,255,160,0)}
}
/* на hover роль слегка светится */
#auth-user-chip:hover .auth-user-meta small{
  color:#ffd27a !important;text-shadow:0 0 8px rgba(245,176,66,.5);
}