/* ===== Control Center — modern look (CCSHELL / CCTODAY) ===== */
[data-theme="light"] { --bg:#F4F5FA; --surface:#FFFFFF; --surface-2:#FAFBFD; --raise:#F1F2F8; --line:#E4E6F0; --line-strong:#D3D6E6; --text:#141633; --text-2:#5D6185; --text-3:#8C90B0; --rail:#121433; --star:#FFC53D; }
:root:not([data-theme="light"]) { --bg:#0F1129; --rail:#0B0D22; --surface:#171A3B; --line:#262A57; }
body { font-family:"Manrope", system-ui, sans-serif; }
/* rail */
@media (min-width: 861px) { .shell { grid-template-columns:252px 1fr; } }
.rail { background:var(--rail); padding:20px 14px; }
.rail-brand { font:700 17px "Unbounded", sans-serif; padding:4px 8px 20px; }
.rail-brand svg { fill:#FFC53D; }
.cc-sub { display:block; font:800 10px "Manrope", sans-serif; letter-spacing:.16em; text-transform:uppercase; color:#A9ADDA; margin-top:3px; }
.rail-group { text-transform:uppercase; letter-spacing:.12em; font-size:10.5px; font-weight:800; color:#7E82B5; margin:16px 12px 6px; }
.rail nav a { font-size:13.5px; font-weight:700; padding:9px 12px; border-radius:10px; color:#C9CCEE; }
.rail nav a > span:first-child { display:flex; align-items:center; min-width:0; }
.rail nav a.is-active { background:#1C1F48; color:#fff; box-shadow:inset 3px 0 0 #FFC53D; }
.cc-ic { font-style:normal; width:20px; display:inline-block; text-align:center; margin-right:9px; font-size:13px; opacity:.85; }
.cc-dot { display:inline-block; width:9px; height:9px; border-radius:3px; margin:0 11px 0 6px; }
.cc-g2a { background:#F37021; } .cc-gamivo { background:#7B5CF5; } .cc-k4g { background:#E11D2E; }
.rail nav a.cc-ext > span:last-child { color:#7E83B8; }
.rail nav a.cc-tg { margin-top:16px; background:#1C1F48; color:#fff; }
.rail nav a.cc-tg span:last-child { color:#2AABEE; }
.count { background:#D6344A; color:#fff; }
/* top bar + page */
.topbar { padding:24px 32px 4px; }
.topbar h1 { font:700 28px/1.2 "Unbounded", sans-serif; letter-spacing:-.02em; }
#page { padding:12px 32px 48px; }
/* cards */
.section { border-radius:18px; box-shadow:0 1px 2px #1416330A; }
.section-head { padding:16px 20px; }
.section-head h2 { font:700 15.5px "Unbounded", sans-serif; letter-spacing:-.01em; }
.section-body { padding:16px 20px; }
th { text-transform:uppercase; letter-spacing:.07em; font-size:11px; font-weight:800; color:var(--text-3); padding:11px 20px; }
td { padding:13px 20px; }
.kpis:not(.section .kpis) { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:14px; background:transparent; border:0; overflow:visible; }
.kpis:not(.section .kpis) .kpi { background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:18px 20px; }
.kpis:not(.section .kpis) .kpi-star { background:#121433; border-color:#121433; }
.kpis:not(.section .kpis) .kpi-star p, .kpis:not(.section .kpis) .kpi-star small { color:#B9BCE6; }
.kpi strong { font:700 28px/1.2 "Unbounded", sans-serif; }
.btn { border-radius:10px; font-weight:800; }
.btn-primary { background:#FFC53D; border-color:#FFC53D; color:#2A1D00; }
.mkt { border:0; color:#fff; padding:3px 9px; border-radius:7px; font-weight:800; text-transform:uppercase; font-size:11px; letter-spacing:.03em; }
.mkt::before { display:none; }
.mkt-g2a { background:#F37021; } .mkt-gamivo { background:#7B5CF5; } .mkt-k4g { background:#E11D2E; } .mkt-telegram { background:#2AABEE; } .mkt-fazercards { background:#121433; }
/* Today page */
.cc-head { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin:-4px 0 18px; }
.cc-head p { margin:0; color:var(--text-2); font-size:15px; }
.cc-search { display:flex; gap:8px; } .cc-search input { width:340px; height:42px; border:1px solid var(--line); border-radius:11px; padding:0 14px; font:600 14px "Manrope"; background:var(--surface); color:var(--text); }
.cc-search .btn { height:42px; }
.cc-kpis { display:grid; grid-template-columns:repeat(5, 1fr); gap:14px; margin-bottom:18px; }
.cc-kpi { background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:18px 20px; }
.cc-kpi p { margin:0; font-weight:700; font-size:13px; color:var(--text-2); }
.cc-kpi strong { display:block; font:700 30px/1.2 "Unbounded", sans-serif; letter-spacing:-.03em; margin:8px 0 4px; }
.cc-kpi small { color:var(--text-3); font-weight:600; font-size:12.5px; }
.cc-kpi.hot { background:#121433; border-color:#121433; } .cc-kpi.hot p, .cc-kpi.hot small { color:#B9BCE6; } .cc-kpi.hot strong { color:#FFC53D; }
.cc-kpi.ok strong { color:#1F9D63; }
.cc-3 { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:16px; }
.cc-3 .section { margin-bottom:18px; }
.cc-bars { padding:14px 20px 18px; display:grid; gap:14px; }
.cc-bar { display:grid; grid-template-columns:110px 1fr 80px; gap:12px; align-items:center; font-weight:700; }
.cc-bar span { display:flex; align-items:center; } .cc-bar i { width:9px; height:9px; border-radius:50%; margin-right:9px; }
.cc-bar b { height:10px; border-radius:6px; background:var(--raise); position:relative; overflow:hidden; } .cc-bar u { position:absolute; inset:0 auto 0 0; border-radius:6px; }
.cc-bar em { font-style:normal; text-align:right; }
.cc-list { padding:4px 0; }
.cc-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 20px; border-bottom:1px solid var(--line); color:var(--text); text-decoration:none; }
.cc-row:last-child { border-bottom:0; } .cc-row:hover { background:var(--surface-2); }
.cc-row b { font-weight:750; } .cc-row small { display:block; color:var(--text-3); font-weight:600; margin-top:2px; }
.cc-lv { min-width:26px; height:26px; border-radius:9px; display:grid; place-items:center; font-weight:900; background:var(--raise); color:var(--text-3); flex:none; }
.cc-lv.cc-error { background:var(--rejected-bg); color:var(--rejected); } .cc-lv.cc-warn { background:var(--pending-bg); color:var(--pending); }
.cc-pos { color:#1F9D63; }
@media (max-width: 1200px) { .cc-kpis { grid-template-columns:repeat(3, 1fr); } .cc-3 { grid-template-columns:1fr 1fr; } }
@media (max-width: 860px) { .cc-kpis { grid-template-columns:1fr 1fr; } .cc-kpi strong, .topbar h1 { font-size:22px; } .cc-kpi { padding:14px; } .cc-bar { grid-template-columns:90px 1fr 70px; } .cc-3 { grid-template-columns:1fr; } .cc-search, .cc-search input { width:100%; } .topbar { padding:16px 16px 4px; } #page { padding:10px 16px 40px; } }
