/* ============================================================
   Sitevo — Merkezi stil (otomatik toplandi). Her sayfa/panel kendi
   body.* sinifi altinda kapsanir; cakisma olmaz.
   ============================================================ */


/* ===================== APP — panel tasarım sistemi (_head) ===================== */

body.panel-app{
            /* SEOmonitor paleti: nötr siyah ink + yeşil marka aksanı (bkz docs/reference/seomonitor-design.md) */
            --sm-bg:#fafafa; --sm-sidebar:#ffffff; --sm-sidebar2:#ffffff;
            --sm-primary:#171717; --sm-primary2:#404040; --sm-primary-ink:#171717;
            --sm-accent:#1ba84d; --sm-accent-bright:#22ca5c; --sm-accent-ink:#16a34a;
            --sm-ink:#171717; --sm-ink-soft:#404040; --sm-muted:#737373; --sm-faint:#a3a3a3;
            --sm-border:#e5e5e5; --sm-border-strong:#d4d4d4; --sm-card:#ffffff; --sm-hover:#f5f5f5;
            --sm-ok:#1ba84d; --sm-warn:#f59e0b; --sm-bad:#ef4444; --sm-info:#3b82f6;
            --sm-grad:linear-gradient(135deg,#22ca5c,#1ba84d);
            --sm-r-xs:8px; --sm-r-sm:10px; --sm-r:14px; --sm-r-lg:18px; --sm-r-xl:24px;
            --sm-control:44px;
            --sm-sh-xs:0 1px 2px rgba(23,23,23,.05);
            --sm-sh-sm:0 2px 6px -1px rgba(23,23,23,.08),0 1px 2px rgba(23,23,23,.05);
            --sm-sh:0 12px 28px -10px rgba(23,23,23,.16);
            --sm-sh-lg:0 32px 64px -22px rgba(23,23,23,.28);
            --sm-ring:0 0 0 4px rgba(34,202,92,.18);
        }
body.panel-app *{ font-family:'Inter',system-ui,sans-serif; }
body.panel-app *, body.panel-app *::before, body.panel-app *::after{ box-sizing:border-box; }
body.panel-app{ background:var(--sm-bg); color:var(--sm-ink); margin:0; font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
body.panel-app a{ text-decoration:none; color:var(--sm-primary-ink); }
body.panel-app h1, body.panel-app h2, body.panel-app h3, body.panel-app h4, body.panel-app h5, body.panel-app h6{ letter-spacing:-.012em; }
body.panel-app ::selection{ background:rgba(99,102,241,.18); }
body.panel-app *::-webkit-scrollbar{ width:10px; height:10px; }
body.panel-app *::-webkit-scrollbar-thumb{ background:rgba(100,116,139,.32); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
body.panel-app *::-webkit-scrollbar-thumb:hover{ background:rgba(100,116,139,.5); background-clip:content-box; }
body.panel-app .sm-app{ display:flex; flex-direction:column; min-height:100vh; }
/* Sidebar */
body.panel-app .sm-sidebar{ width:248px; flex-shrink:0; background:linear-gradient(180deg,var(--sm-sidebar),var(--sm-sidebar2));
            color:#cbd5e1; position:fixed; top:0; bottom:0; left:0; display:flex; flex-direction:column; z-index:1030; }
body.panel-app .sm-brand{ padding:20px 22px; font-weight:800; font-size:19px; color:#fff; letter-spacing:-.4px; display:flex; align-items:center; gap:10px; }
body.panel-app .sm-brand i{ background:linear-gradient(135deg,var(--sm-primary),var(--sm-primary2)); width:34px;height:34px; border-radius:9px; display:grid; place-items:center; font-size:18px; }
body.panel-app .sm-nav{ padding:6px 12px; overflow-y:auto; flex:1; }
body.panel-app .sm-nav .lbl{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#5b6885; padding:14px 12px 6px; }
body.panel-app .sm-nav a{ display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:9px; color:#aeb9d4; font-weight:500; margin-bottom:2px; transition:.15s; }
body.panel-app .sm-nav a i{ font-size:17px; width:20px; text-align:center; }
body.panel-app .sm-nav a:hover{ background:rgba(255,255,255,.06); color:#fff; }
body.panel-app .sm-nav a.active{ background:linear-gradient(135deg,var(--sm-primary),var(--sm-primary2)); color:#fff; box-shadow:0 8px 18px -6px rgba(99,102,241,.6); }
/* Main */
body.panel-app .sm-main{ flex:1; margin-left:0; min-width:0; display:flex; flex-direction:column; }
body.panel-app .sm-topbar{ height:64px; background:rgba(255,255,255,.85); backdrop-filter:blur(8px); border-bottom:1px solid var(--sm-border);
            display:flex; align-items:center; gap:16px; padding:0 24px; position:sticky; top:0; z-index:1020; }
body.panel-app .sm-topbar h1{ font-size:18px; font-weight:700; margin:0; }
/* Topbar kontrolleri tek yükseklik/font (ikon + butonlar + profil hizalı) */
body.panel-app .sm-topbar .btn{ min-height:40px; font-size:13px; border-radius:10px; }
body.panel-app .sm-page{ padding:24px; flex:1; }
body.panel-app .sm-icon-btn{ width:40px;height:40px; border-radius:10px; border:1px solid var(--sm-border); background:#fff; display:grid; place-items:center; color:var(--sm-muted); position:relative; cursor:pointer; }
body.panel-app .sm-icon-btn:hover{ color:var(--sm-primary); border-color:#c7cbf3; }
body.panel-app .sm-badge-dot{ position:absolute; top:-5px; right:-5px; background:var(--sm-bad); color:#fff; font-size:10px; font-weight:700; border-radius:999px; padding:1px 6px; }
/* Cards */
body.panel-app .card{ border:1px solid var(--sm-border); border-radius:var(--sm-r-lg); box-shadow:var(--sm-sh-xs); background:var(--sm-card); }
body.panel-app .card-header{ background:transparent; border-bottom:1px solid var(--sm-border); font-weight:700; font-size:15px; letter-spacing:-.01em; border-radius:var(--sm-r-lg) var(--sm-r-lg) 0 0 !important; padding:18px 22px; }
body.panel-app .card-body{ padding:22px; }
body.panel-app .card-footer{ background:transparent; border-top:1px solid var(--sm-border); padding:16px 22px; }
body.panel-app .sm-stat{ border-radius:var(--sm-r-lg); padding:20px; background:var(--sm-card); border:1px solid var(--sm-border); box-shadow:var(--sm-sh-xs); transition:transform .18s ease, box-shadow .18s ease; }
body.panel-app .sm-stat:hover{ transform:translateY(-3px); box-shadow:var(--sm-sh); }
body.panel-app .sm-stat .ic{ width:46px;height:46px; border-radius:13px; display:grid; place-items:center; font-size:22px; color:#fff; box-shadow:0 10px 20px -8px rgba(99,102,241,.5); }
body.panel-app .sm-stat .val{ font-size:28px; font-weight:800; letter-spacing:-.5px; }
body.panel-app .sm-stat .lbl{ color:var(--sm-muted); font-size:13px; font-weight:500; }
body.panel-app .grad-1{ background:linear-gradient(135deg,#6366f1,#8b5cf6);}
body.panel-app .grad-2{ background:linear-gradient(135deg,#10b981,#059669);}
body.panel-app .grad-3{ background:linear-gradient(135deg,#f59e0b,#d97706);}
body.panel-app .grad-4{ background:linear-gradient(135deg,#3b82f6,#2563eb);}
/* Buttons — flat single colour, no shadow, equal height with inputs */
body.panel-app .btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:var(--sm-control); border-radius:var(--sm-r-sm); font-weight:600; padding:0 16px; line-height:1.2; box-shadow:none!important; transition:background-color .15s ease, border-color .15s ease, color .15s ease; }
body.panel-app .btn-sm{ min-height:36px; border-radius:var(--sm-r-xs); padding:0 12px; font-size:13px; }
body.panel-app .btn-lg{ min-height:50px; padding:0 22px; font-size:15px; border-radius:var(--sm-r); }
body.panel-app .btn svg{ flex-shrink:0; }
body.panel-app .btn-primary{ background:var(--sm-primary); border:1px solid var(--sm-primary); color:#fff; }
body.panel-app .btn-primary:hover, body.panel-app .btn-primary:focus, body.panel-app .btn-primary:active{ background:var(--sm-primary-ink)!important; border-color:var(--sm-primary-ink)!important; filter:none; transform:none; }
body.panel-app .btn-light{ background:#fff; border:1px solid var(--sm-border-strong); color:var(--sm-ink-soft); }
body.panel-app .btn-light:hover{ background:var(--sm-hover); border-color:var(--sm-faint); color:var(--sm-ink); }
body.panel-app .btn-outline-secondary{ border-color:var(--sm-border-strong); color:var(--sm-ink-soft); }
body.panel-app .btn-outline-secondary:hover{ background:var(--sm-hover); color:var(--sm-ink); border-color:var(--sm-faint); }
/* Forms — one consistent control across every panel */
body.panel-app .form-label{ font-size:12.5px; font-weight:600; color:var(--sm-ink-soft); margin-bottom:6px; letter-spacing:.005em; }
body.panel-app .form-label.text-muted{ color:var(--sm-muted)!important; }
body.panel-app .col-form-label{ font-weight:600; color:var(--sm-ink-soft); }
body.panel-app .form-control, body.panel-app .form-select{ min-height:var(--sm-control); padding:10px 14px; border-radius:var(--sm-r-sm); border:1.5px solid var(--sm-border-strong); color:var(--sm-ink); font-size:14px; background-color:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
body.panel-app .form-control::placeholder{ color:var(--sm-faint); }
body.panel-app .form-control:hover, body.panel-app .form-select:hover{ border-color:var(--sm-faint); }
body.panel-app .form-control:focus, body.panel-app .form-select:focus{ border-color:var(--sm-primary); box-shadow:var(--sm-ring); background-color:#fff; }
body.panel-app .form-control-sm, body.panel-app .form-select-sm{ min-height:36px; padding:6px 11px; font-size:13px; border-radius:var(--sm-r-xs); }
/* Select okunun metnin üstüne binmemesi için sağ boşluk + ok konumu */
body.panel-app .form-select{ padding-right:40px; background-position:right 14px center; background-size:15px 11px; }
body.panel-app .form-select-sm{ padding-right:34px; background-position:right 11px center; }
body.panel-app .form-control-lg{ min-height:50px; font-size:15px; border-radius:var(--sm-r); }
body.panel-app textarea.form-control{ min-height:auto; padding-top:11px; line-height:1.55; }
body.panel-app .input-group>.form-control, body.panel-app .input-group>.form-select{ min-height:var(--sm-control); }
body.panel-app .input-group-text{ border-radius:var(--sm-r-sm); border:1.5px solid var(--sm-border-strong); background:var(--sm-hover); color:var(--sm-muted); font-weight:500; }
body.panel-app .form-check-input{ width:18px; height:18px; margin-top:.16em; border:1.5px solid var(--sm-border-strong); cursor:pointer; }
body.panel-app .form-check-input:checked{ background-color:var(--sm-primary); border-color:var(--sm-primary); }
body.panel-app .form-check-input:focus{ box-shadow:var(--sm-ring); border-color:var(--sm-primary); }
body.panel-app .form-check-label{ cursor:pointer; padding-top:1px; }
body.panel-app .form-switch .form-check-input{ width:38px; height:20px; }
body.panel-app .form-text{ color:var(--sm-muted); font-size:12px; }
body.panel-app .is-invalid{ border-color:var(--sm-bad)!important; }
body.panel-app .invalid-feedback{ font-size:12px; }
body.panel-app .badge{ font-weight:600; padding:.42em .7em; border-radius:7px; }
body.panel-app .badge.rounded-pill{ border-radius:999px; }
body.panel-app .text-muted{ color:var(--sm-muted)!important; }
/* Modals */
body.panel-app .modal-content{ border:0; border-radius:var(--sm-r-lg); box-shadow:var(--sm-sh-lg); overflow:hidden; }
body.panel-app .modal-header{ padding:20px 24px; border-bottom:1px solid var(--sm-border); }
body.panel-app .modal-title{ font-weight:700; font-size:17px; letter-spacing:-.01em; }
body.panel-app .modal-body{ padding:24px; }
body.panel-app .modal-footer{ padding:16px 24px; border-top:1px solid var(--sm-border); gap:8px; }
body.panel-app .modal-backdrop.show{ opacity:.45; }
/* Dropdowns */
body.panel-app .dropdown-menu{ border:1px solid var(--sm-border); border-radius:var(--sm-r); box-shadow:var(--sm-sh); padding:6px; }
body.panel-app .dropdown-item{ border-radius:var(--sm-r-xs); padding:9px 12px; font-weight:500; font-size:13.5px; }
body.panel-app .dropdown-item:hover, body.panel-app .dropdown-item:focus{ background:var(--sm-hover); }
body.panel-app .dropdown-divider{ border-color:var(--sm-border); }
/* Alerts */
body.panel-app .alert{ border-radius:var(--sm-r); border:1px solid transparent; }
/* Plain tables (dashboard, analytics) */
body.panel-app .table{ color:var(--sm-ink); margin-bottom:0; }
body.panel-app .table>thead th{ font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--sm-muted); font-weight:700; border-bottom:1px solid var(--sm-border)!important; padding:12px 14px; background:var(--sm-hover); }
body.panel-app .table>tbody td{ padding:13px 14px; border-bottom:1px solid var(--sm-border); vertical-align:middle; }
body.panel-app .table>tbody tr:last-child td{ border-bottom:0; }
body.panel-app .table-hover>tbody>tr:hover>*{ background:var(--sm-hover); }
/* DataTables — premium */
body.panel-app table.dataTable{ border-collapse:separate!important; border-spacing:0; width:100%!important; }
body.panel-app table.dataTable thead th{ font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--sm-muted); font-weight:700; background:var(--sm-hover); border-bottom:1px solid var(--sm-border)!important; padding:13px 14px; }
body.panel-app table.dataTable thead th:first-child{ border-top-left-radius:var(--sm-r-sm); }
body.panel-app table.dataTable thead th:last-child{ border-top-right-radius:var(--sm-r-sm); }
body.panel-app table.dataTable tbody td{ vertical-align:middle; padding:14px; border-top:1px solid var(--sm-border); }
body.panel-app table.dataTable tbody tr:first-child td{ border-top:0; }
body.panel-app table.dataTable tbody tr{ transition:background .12s ease; }
body.panel-app table.dataTable tbody tr:hover td{ background:var(--sm-hover); }
body.panel-app .dt-container .dt-layout-row{ align-items:center; margin-bottom:14px; }
body.panel-app .dt-container .dt-layout-row:last-child{ margin-bottom:0; margin-top:16px; }
body.panel-app .dt-search input{ min-height:42px; min-width:240px; padding:9px 14px 9px 38px!important; border-radius:var(--sm-r-sm)!important; border:1.5px solid var(--sm-border-strong)!important; background:var(--sm-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2394a3b8' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E") no-repeat 13px center; }
body.panel-app .dt-search input:focus{ border-color:var(--sm-primary)!important; box-shadow:var(--sm-ring); outline:0; }
body.panel-app .dt-length select{ min-height:42px; border-radius:var(--sm-r-sm)!important; border:1.5px solid var(--sm-border-strong)!important; }
body.panel-app .dt-info{ color:var(--sm-muted); font-size:13px; }
/* Pagination — premium & kibar. Bootstrap5 markup'ı: <li class="dt-paging-button page-item"> (DIŞ sarmalayıcı) > <button class="page-link"> (ASIL buton). "Kutu içinde kutu" olmaması için DIŞ li sadeleştirilir; çerçeve/zemin yalnız asıl butona verilir. */
body.panel-app .dt-container .dt-paging{ display:flex; justify-content:flex-end; align-items:center; }
body.panel-app .dt-container .dt-paging nav, body.panel-app .dt-container .dt-paging .pagination{ display:inline-flex!important; align-items:center; gap:3px; margin:0!important; padding:0!important; flex-wrap:wrap; list-style:none; }
/* DIŞ sarmalayıcı (li) — şeffaf, çerçevesiz */
body.panel-app .dt-container .dt-paging .page-item, body.panel-app .dt-container .dt-paging li.dt-paging-button{
            margin:0!important; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; display:inline-flex;
        }
/* ASIL buton */
body.panel-app .dt-container .dt-paging .page-link, body.panel-app .dt-container .dt-paging button.dt-paging-button, body.panel-app .dt-container .dt-paging a.dt-paging-button{
            display:inline-flex!important; align-items:center; justify-content:center;
            min-width:30px; height:30px; padding:0 8px!important; margin:0!important;
            border-radius:8px!important; border:1px solid var(--sm-border)!important;
            background:var(--sm-card)!important; color:var(--sm-muted)!important;
            font-weight:600; font-size:12.5px; line-height:1; cursor:pointer; box-shadow:none!important;
            transition:background .13s ease, border-color .13s ease, color .13s ease;
        }
body.panel-app .dt-container .dt-paging .page-item:not(.active):not(.disabled) .page-link:hover, body.panel-app .dt-container .dt-paging button.dt-paging-button:hover:not(.disabled):not(.current){
            background:var(--sm-hover)!important; border-color:var(--sm-border-strong)!important; color:var(--sm-ink)!important;
        }
body.panel-app .dt-container .dt-paging .page-item.active .page-link, body.panel-app .dt-container .dt-paging button.dt-paging-button.current{
            background:#171717!important; border-color:#171717!important; color:#fff!important;
            box-shadow:0 2px 5px -1px rgba(23,23,23,.3)!important;
        }
body.panel-app .dt-container .dt-paging .page-item.disabled .page-link, body.panel-app .dt-container .dt-paging button.dt-paging-button.disabled{
            opacity:.35; cursor:default; background:var(--sm-card)!important; border-color:var(--sm-border)!important; color:var(--sm-faint)!important;
        }
body.panel-app table.dataTable>tbody>tr.selected>*{ box-shadow:inset 0 0 0 9999px rgba(99,102,241,.08); }
@media (max-width:860px){
body.panel-app .sm-sidebar{ transform:translateX(-100%); transition:.2s; }
body.panel-app .sm-sidebar.open{ transform:none; }
body.panel-app .sm-main{ margin-left:0; }}
/* --- Dark mode (Bootstrap data-bs-theme + özel --sm-* override) --- */
[data-bs-theme="dark"] body.panel-app{
            --sm-bg:#0a0e1a; --sm-sidebar:#060912; --sm-sidebar2:#0d1426;
            --sm-ink:#e8edf6; --sm-ink-soft:#cbd5e1; --sm-muted:#94a3b8; --sm-faint:#64748b;
            --sm-border:#1f2a44; --sm-border-strong:#2a3654; --sm-card:#111a2e; --sm-hover:#16203a;
        }
[data-bs-theme="dark"] body.panel-app{ background:var(--sm-bg); color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-app .sm-topbar{ background:rgba(13,20,38,.82); }
[data-bs-theme="dark"] body.panel-app .card, [data-bs-theme="dark"] body.panel-app .sm-stat, [data-bs-theme="dark"] body.panel-app .sm-icon-btn{ background:var(--sm-card); }
[data-bs-theme="dark"] body.panel-app .modal-content, [data-bs-theme="dark"] body.panel-app .dropdown-menu{ background:var(--sm-card); }
[data-bs-theme="dark"] body.panel-app .form-control, [data-bs-theme="dark"] body.panel-app .form-select, [data-bs-theme="dark"] body.panel-app .dt-search input, [data-bs-theme="dark"] body.panel-app .dt-length select{ background-color:#0e1626!important; border-color:var(--sm-border-strong)!important; color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-app .input-group-text{ background:#0e1626; border-color:var(--sm-border-strong); }
[data-bs-theme="dark"] body.panel-app .btn-light{ background:#16203a; border-color:var(--sm-border-strong); color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-app .btn-light:hover{ background:#1c2949; color:#fff; }
[data-bs-theme="dark"] body.panel-app .table>thead th, [data-bs-theme="dark"] body.panel-app table.dataTable thead th{ background:#0e1626; }
[data-bs-theme="dark"] body.panel-app .table>tbody td, [data-bs-theme="dark"] body.panel-app table.dataTable tbody td{ border-color:var(--sm-border); }
[data-bs-theme="dark"] body.panel-app .table-hover>tbody>tr:hover>*, [data-bs-theme="dark"] body.panel-app table.dataTable tbody tr:hover td{ background:var(--sm-hover); }
[data-bs-theme="dark"] body.panel-app .dropdown-item{ color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-app .dropdown-item:hover, [data-bs-theme="dark"] body.panel-app .dropdown-item:focus{ background:var(--sm-hover); }
[data-bs-theme="dark"] body.panel-app .bg-light{ background:#16203a!important; color:var(--sm-ink); }
/* ============ Premium bileşenler (rank-tracker gösterimleri) ============ *//* Segment toggle — Masaüstü/Mobil gibi görünüm anahtarı */
body.panel-app .sm-seg{ display:inline-flex; padding:4px; gap:4px; background:var(--sm-hover); border:1px solid var(--sm-border); border-radius:var(--sm-r); }
body.panel-app .sm-seg button{ display:inline-flex; align-items:center; gap:7px; border:0; background:transparent; color:var(--sm-muted);
            font-weight:650; font-size:13.5px; padding:8px 16px; border-radius:var(--sm-r-sm); cursor:pointer; transition:all .15s ease; white-space:nowrap; }
body.panel-app .sm-seg button:hover{ color:var(--sm-ink); }
body.panel-app .sm-seg button.active{ background:var(--sm-card); color:var(--sm-primary-ink); box-shadow:var(--sm-sh-sm); }
body.panel-app .sm-seg button .cnt{ font-size:11px; font-weight:700; padding:1px 7px; border-radius:999px; background:var(--sm-border); color:var(--sm-muted); }
body.panel-app .sm-seg button.active .cnt{ background:rgba(99,102,241,.14); color:var(--sm-primary-ink); }
/* Delta pill — sıra değişimi ▲▼ */
body.panel-app .sm-delta{ display:inline-flex; align-items:center; gap:3px; font-weight:750; font-size:12.5px; padding:3px 9px; border-radius:999px; line-height:1; }
body.panel-app .sm-delta.up{ background:rgba(16,185,129,.12); color:#0f9d6e; }
body.panel-app .sm-delta.down{ background:rgba(239,68,68,.12); color:#dc2626; }
body.panel-app .sm-delta.flat{ background:var(--sm-hover); color:var(--sm-muted); }
[data-bs-theme="dark"] body.panel-app .sm-delta.up{ color:#34d399; }
[data-bs-theme="dark"] body.panel-app .sm-delta.down{ color:#f87171; }
/* Metric tile — best/avg/current küçük kutular */
body.panel-app .sm-tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; }
body.panel-app .sm-tile{ background:var(--sm-card); border:1px solid var(--sm-border); border-radius:var(--sm-r); padding:16px 18px; transition:border-color .15s ease; }
body.panel-app .sm-tile:hover{ border-color:var(--sm-border-strong); }
body.panel-app .sm-tile .tlbl{ font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--sm-muted); font-weight:700; margin-bottom:7px; display:flex; align-items:center; gap:6px; }
body.panel-app .sm-tile .tval{ font-size:25px; font-weight:800; letter-spacing:-.6px; line-height:1; }
body.panel-app .sm-tile .tsub{ font-size:12px; color:var(--sm-faint); margin-top:5px; }
/* Hero rank — seçili cihazın büyük sırası */
body.panel-app .sm-hero{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
body.panel-app .sm-hero .rk{ font-size:56px; font-weight:850; letter-spacing:-2px; line-height:.9; }
body.panel-app .sm-hero .rk small{ font-size:22px; font-weight:700; color:var(--sm-faint); letter-spacing:0; }
body.panel-app .badge-dev{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:var(--sm-muted);
            background:var(--sm-hover); border:1px solid var(--sm-border); padding:5px 11px; border-radius:999px; }
body.panel-app .text-faint{ color:var(--sm-faint)!important; }
/* Rank rozeti (tablo) — renkli sıra çipi */
body.panel-app .sm-rank{ display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:26px; padding:0 9px; border-radius:8px; font-weight:750; font-size:13px; }
body.panel-app .sm-rank.top3{ background:rgba(16,185,129,.14); color:#0f9d6e; }
body.panel-app .sm-rank.top10{ background:rgba(99,102,241,.13); color:var(--sm-primary-ink); }
body.panel-app .sm-rank.top30{ background:rgba(245,158,11,.14); color:#b45309; }
body.panel-app .sm-rank.rest{ background:var(--sm-hover); color:var(--sm-ink-soft); }
body.panel-app .sm-rank.none{ background:transparent; color:var(--sm-faint); font-weight:600; }
[data-bs-theme="dark"] body.panel-app .sm-rank.top3{ color:#34d399; }
[data-bs-theme="dark"] body.panel-app .sm-rank.top30{ color:#fbbf24; }
/* Hedef URL eşleşme şeridi */
body.panel-app .sm-target{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; padding:5px 11px; border-radius:999px; }
body.panel-app .sm-target.match{ background:rgba(16,185,129,.12); color:#0f9d6e; }
body.panel-app .sm-target.miss{ background:rgba(245,158,11,.13); color:#b45309; }
body.panel-app .sm-target.none{ background:var(--sm-hover); color:var(--sm-muted); }
/* Skeleton shimmer — yüklenirken */
body.panel-app .sm-sk{ position:relative; overflow:hidden; background:var(--sm-hover); border-radius:8px; color:transparent!important; }
body.panel-app .sm-sk::after{ content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent); animation:sm-shimmer 1.3s infinite; }
[data-bs-theme="dark"] body.panel-app .sm-sk::after{ background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent); }
@keyframes sm-shimmer{ 100%{ transform:translateX(100%); } }
/* SERP satırı — bizim domain vurgusu */
body.panel-app .sm-serp-us{ background:rgba(16,185,129,.08)!important; }
body.panel-app .sm-pos{ display:inline-grid; place-items:center; width:26px; height:26px; border-radius:7px; background:var(--sm-hover); font-weight:700; font-size:12px; color:var(--sm-muted); }
/* Tehlikeli aksiyon butonu (modal onay / sil) */
body.panel-app .btn-danger{ background:var(--sm-bad); border:1px solid var(--sm-bad); color:#fff; }
body.panel-app .btn-danger:hover, body.panel-app .btn-danger:focus, body.panel-app .btn-danger:active{ background:#dc2626!important; border-color:#dc2626!important; color:#fff; }
/* ============ Rank Tracker (SeoMonitor-tarzı birleşik görünüm) ============ *//* Görünüm sekmeleri — Strategy / Competition / Analysis */
body.panel-app .sm-tabs{ display:inline-flex; gap:4px; padding:4px; background:var(--sm-hover); border:1px solid var(--sm-border); border-radius:var(--sm-r); }
body.panel-app .sm-tabs button{ display:inline-flex; align-items:center; gap:7px; border:0; background:transparent; color:var(--sm-muted);
            font-weight:650; font-size:13.5px; padding:8px 16px; border-radius:var(--sm-r-sm); cursor:pointer; transition:all .15s ease; white-space:nowrap; }
body.panel-app .sm-tabs button:hover{ color:var(--sm-ink); }
body.panel-app .sm-tabs button.active{ background:#0b1020; color:#fff; box-shadow:var(--sm-sh-sm); }
[data-bs-theme="dark"] body.panel-app .sm-tabs button.active{ background:var(--sm-primary); }
/* Kanal çipi — Google / AI Overview / AI Search filtre rozetleri */
body.panel-app .sm-channel{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:600; color:var(--sm-ink-soft);
            background:var(--sm-card); border:1px solid var(--sm-border-strong); padding:7px 13px; border-radius:999px; cursor:pointer; transition:.15s; }
body.panel-app .sm-channel:hover{ border-color:var(--sm-faint); }
body.panel-app .sm-channel.active{ border-color:var(--sm-primary); color:var(--sm-primary-ink); background:rgba(99,102,241,.06); }
body.panel-app .sm-channel .dot{ width:9px; height:9px; border-radius:50%; }
/* Özet kart (SERP Data · Search Data · Visibility · AI Search) */
body.panel-app .sm-sumcard{ background:var(--sm-card); border:1px solid var(--sm-border); border-radius:var(--sm-r-lg); padding:18px 20px; box-shadow:var(--sm-sh-xs); height:100%; }
body.panel-app .sm-sumcard .head{ display:flex; align-items:center; gap:7px; color:var(--sm-muted); font-size:12.5px; font-weight:650; margin-bottom:10px; }
body.panel-app .sm-sumcard .head i{ font-size:14px; }
body.panel-app .sm-sumcard .big{ font-size:30px; font-weight:850; letter-spacing:-1px; line-height:1; display:flex; align-items:baseline; gap:8px; }
body.panel-app .sm-sumcard .cap{ font-size:12px; color:var(--sm-faint); font-weight:600; margin-top:5px; }
body.panel-app .sm-sumcard .subs{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:13px; padding-top:12px; border-top:1px solid var(--sm-border); }
body.panel-app .sm-sumcard .sub{ font-size:12px; color:var(--sm-muted); font-weight:600; }
body.panel-app .sm-sumcard .sub b{ color:var(--sm-ink); font-weight:750; }
/* YoY pill — yeşil/kırmızı yüzde değişimi (146K -16%) */
body.panel-app .sm-yoy{ display:inline-flex; align-items:center; gap:2px; font-size:11.5px; font-weight:750; }
body.panel-app .sm-yoy.up{ color:#0f9d6e; }
body.panel-app .sm-yoy.down{ color:#dc2626; }
body.panel-app .sm-yoy.flat{ color:var(--sm-faint); }
[data-bs-theme="dark"] body.panel-app .sm-yoy.up{ color:#34d399; }
[data-bs-theme="dark"] body.panel-app .sm-yoy.down{ color:#f87171; }
/* I·N·C·T mini bar — SERP feature yoğunluğu */
body.panel-app .sm-inct{ display:inline-flex; align-items:flex-end; gap:3px; height:26px; }
body.panel-app .sm-inct .b{ width:7px; border-radius:2px 2px 0 0; background:var(--sm-border-strong); position:relative; }
body.panel-app .sm-inct .b.i{ background:#6366f1; }
body.panel-app .sm-inct .b.n{ background:#3b82f6; }
body.panel-app .sm-inct .b.c{ background:#f59e0b; }
body.panel-app .sm-inct .b.t{ background:#ef4444; }
/* SERP feature ikon satırı (tablo hücresi) */
body.panel-app .sm-feat{ display:inline-flex; gap:5px; color:var(--sm-faint); font-size:14px; }
body.panel-app .sm-feat i{ line-height:1; }
body.panel-app .sm-feat .on{ color:var(--sm-primary); }
/* AI durumu rozeti (AIO / AI Search): cited / mentioned / competitors / none */
body.panel-app .sm-ai{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; padding:3px 9px; border-radius:999px; }
body.panel-app .sm-ai i{ font-size:13px; }
body.panel-app .sm-ai.cited{ background:rgba(16,185,129,.13); color:#0f9d6e; }
body.panel-app .sm-ai.mentioned{ background:rgba(99,102,241,.13); color:var(--sm-primary-ink); }
body.panel-app .sm-ai.competitors{ background:rgba(245,158,11,.14); color:#b45309; }
body.panel-app .sm-ai.none{ background:var(--sm-hover); color:var(--sm-faint); }
[data-bs-theme="dark"] body.panel-app .sm-ai.cited{ color:#34d399; }
[data-bs-theme="dark"] body.panel-app .sm-ai.competitors{ color:#fbbf24; }
/* Opportunity halkası — 0–10 dairesel skor */
body.panel-app .sm-oppring{ --v:0; --c:var(--sm-primary); width:38px; height:38px; border-radius:50%; display:inline-grid; place-items:center;
            background:conic-gradient(var(--c) calc(var(--v)*36deg), var(--sm-border) 0); position:relative; }
body.panel-app .sm-oppring::before{ content:""; position:absolute; inset:4px; border-radius:50%; background:var(--sm-card); }
body.panel-app .sm-oppring span{ position:relative; font-size:13px; font-weight:800; color:var(--sm-ink); }
body.panel-app .sm-oppring.lo{ --c:#ef4444; }
body.panel-app .sm-oppring.mid{ --c:#f59e0b; }
body.panel-app .sm-oppring.hi{ --c:#10b981; }
body.panel-app .sm-oppring.na{ background:var(--sm-hover); }
body.panel-app .sm-oppring.na span{ color:var(--sm-faint); font-size:11px; }
/* Trend grafik sarmalı */
body.panel-app .sm-chartwrap{ position:relative; height:300px; }
/* ============================================================
           SEOmonitor birebir-eşleştirme katmanı (Adım 1: tasarımı benzet).
           Üstteki indigo/mor sabit değerleri tek noktadan ezer.
           Palet/karar: docs/reference/seomonitor-design.md
           ============================================================ *//* Başlık + iri sayı tipografisi → Manrope */
body.panel-app h1, body.panel-app h2, body.panel-app h3, body.panel-app h4, body.panel-app h5, body.panel-app h6, body.panel-app .sm-brand, body.panel-app .modal-title, body.panel-app .card-header, body.panel-app .sm-stat .val, body.panel-app .sm-sumcard .big, body.panel-app .sm-tile .tval, body.panel-app .sm-hero .rk, body.panel-app .sm-oppring span{
            font-family:'Manrope','Inter',system-ui,sans-serif; font-weight:800;
        }
body.panel-app .card-header{ font-weight:700; }
/* --- Sidebar: koyu gradient → BEYAZ --- */
body.panel-app .sm-sidebar{ background:#fff; border-right:1px solid var(--sm-border); }
body.panel-app .sm-brand{ color:var(--sm-ink); }
body.panel-app .sm-brand i{ background:var(--sm-grad); }
body.panel-app .sm-nav .lbl{ color:var(--sm-faint); }
body.panel-app .sm-nav a{ color:var(--sm-ink-soft); font-weight:600; }
body.panel-app .sm-nav a i{ color:var(--sm-muted); }
body.panel-app .sm-nav a:hover{ background:var(--sm-hover); color:var(--sm-ink); }
body.panel-app .sm-nav a:hover i{ color:var(--sm-ink); }
body.panel-app .sm-nav a.active{ background:#171717; color:#fff; box-shadow:none; }
body.panel-app .sm-nav a.active i{ color:#fff; }
/* --- Topbar: cam beyaz → SİYAH --- */
body.panel-app .sm-topbar{ background:#171717; border-bottom:0; backdrop-filter:none; }
body.panel-app .sm-topbar h1{ color:#fff; }
body.panel-app .sm-topbar .sm-icon-btn{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.16); color:#d4d4d4; }
body.panel-app .sm-topbar .sm-icon-btn:hover{ background:rgba(255,255,255,.18); color:#fff; border-color:rgba(255,255,255,.28); }
body.panel-app .sm-topbar .btn-light{ background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.16); color:#fff; }
body.panel-app .sm-topbar .btn-light:hover{ background:rgba(255,255,255,.20); border-color:rgba(255,255,255,.28); color:#fff; }
body.panel-app .sm-topbar .btn-light .text-muted, body.panel-app .sm-topbar .btn-light .bi-chevron-down{ color:#a3a3a3!important; }
/* --- Aktif pill / segment / kanal → SEOmonitor siyahı --- */
body.panel-app .sm-tabs button.active{ background:#171717; color:#fff; }
body.panel-app .sm-seg button.active{ background:#171717; color:#fff; }
body.panel-app .sm-seg button.active .cnt{ background:rgba(255,255,255,.20); color:#fff; }
body.panel-app .sm-channel.active{ background:#171717; border-color:#171717; color:#fff; }
body.panel-app .sm-feat .on{ color:#171717; }
/* --- Yeşil marka aksanı: pozitif delta / yoy / rank / cited / score / hedef --- */
body.panel-app .sm-delta.up{ background:rgba(34,202,92,.14); color:var(--sm-accent-ink); }
body.panel-app .sm-yoy.up{ color:var(--sm-accent-ink); }
body.panel-app .sm-rank.top3{ background:rgba(34,202,92,.16); color:#15803d; }
body.panel-app .sm-rank.top10{ background:var(--sm-hover); color:var(--sm-ink); }
body.panel-app .sm-ai.cited{ background:rgba(34,202,92,.14); color:var(--sm-accent-ink); }
body.panel-app .sm-ai.mentioned{ background:var(--sm-hover); color:var(--sm-ink-soft); }
body.panel-app .sm-target.match{ background:rgba(34,202,92,.13); color:var(--sm-accent-ink); }
body.panel-app .sm-oppring.hi{ --c:var(--sm-accent-bright); }
body.panel-app .sm-serp-us{ background:rgba(34,202,92,.09)!important; }
body.panel-app table.dataTable>tbody>tr.selected>*{ box-shadow:inset 0 0 0 9999px rgba(34,202,92,.08); }
/* --- I·N·C·T mini bar → nötr + sıcaklar --- */
body.panel-app .sm-inct .b.i{ background:#171717; }
body.panel-app .sm-inct .b.n{ background:#737373; }
/* --- Stat ikonu grad-1 = marka yeşili; gölge yeşil --- */
body.panel-app .grad-1{ background:linear-gradient(135deg,#22ca5c,#1ba84d)!important; }
body.panel-app .sm-stat .ic{ box-shadow:0 10px 20px -8px rgba(34,202,92,.42); }
/* --- Form odak + checkbox + primary buton --- */
body.panel-app .form-control:focus, body.panel-app .form-select:focus, body.panel-app .dt-search input:focus{ border-color:var(--sm-accent-bright)!important; }
body.panel-app .form-check-input:checked{ background-color:var(--sm-accent-bright); border-color:var(--sm-accent-bright); }
body.panel-app .btn-primary{ background:#171717; border-color:#171717; }
body.panel-app .btn-primary:hover, body.panel-app .btn-primary:focus, body.panel-app .btn-primary:active{ background:#000!important; border-color:#000!important; }
body.panel-app ::selection{ background:rgba(34,202,92,.20); }
/* ============================================================
           Yatay üst-nav (sidebar yerine) — SEOmonitor tarzı floating siyah bar.
           ============================================================ */
body.panel-app .sm-topwrap{ position:sticky; top:0; z-index:1031; background:var(--sm-bg); }
body.panel-app .sm-topnav{ position:relative; display:flex; align-items:center; gap:6px; height:58px; padding:0 12px 0 14px;
            background:#171717; box-shadow:0 8px 24px -12px rgba(0,0,0,.45); }
body.panel-app .sm-brand2{ display:flex; align-items:center; gap:9px; font-family:'Manrope','Inter',sans-serif; font-weight:800; font-size:17px; letter-spacing:-.4px; color:#fff; padding-right:6px; white-space:nowrap; }
body.panel-app .sm-brand2 .lg{ width:32px;height:32px;border-radius:9px; background:var(--sm-grad); display:grid; place-items:center; }
body.panel-app .sm-brand2 .lg img{ height:60%; width:auto; }
body.panel-app .sm-topnav-menu{ display:flex; align-items:center; gap:1px; margin-left:6px; flex:1; min-width:0; }
body.panel-app .sm-topnav-menu a, body.panel-app .sm-topnav-menu .nav-drop>button{ display:inline-flex; align-items:center; gap:7px; color:#c0c4cc; font-weight:600; font-size:13.5px;
            padding:8px 12px; border-radius:9px; text-decoration:none; background:transparent; border:0; cursor:pointer; white-space:nowrap; transition:.13s; }
body.panel-app .sm-topnav-menu a i, body.panel-app .sm-topnav-menu .nav-drop>button i{ font-size:15px; }
body.panel-app .sm-topnav-menu a:hover, body.panel-app .sm-topnav-menu .nav-drop>button:hover{ background:rgba(255,255,255,.09); color:#fff; }
body.panel-app .sm-topnav-menu a.active{ background:rgba(255,255,255,.16); color:#fff; }
body.panel-app .sm-topnav-right{ margin-left:auto; display:flex; align-items:center; gap:8px; padding-left:6px; }
body.panel-app .sm-topnav .sm-icon-btn{ width:38px;height:38px;border-radius:10px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); color:#d4d4d4; }
body.panel-app .sm-topnav .sm-icon-btn:hover{ background:rgba(255,255,255,.18); color:#fff; border-color:rgba(255,255,255,.26); }
body.panel-app .sm-topnav .prof{ display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:999px; padding:4px 12px 4px 4px; color:#fff; cursor:pointer; }
body.panel-app .sm-topnav .prof:hover{ background:rgba(255,255,255,.16); }
body.panel-app .sm-topnav .prof .av{ width:28px;height:28px;border-radius:50%; background:var(--sm-grad); color:#fff; display:grid;place-items:center; font-weight:700; font-size:13px; }
body.panel-app .sm-burger{ display:none; }
body.panel-app .sm-page{ padding:22px 24px; }
body.panel-app .sm-phead{ margin-bottom:18px; }
body.panel-app .sm-phead h1{ font-family:'Manrope','Inter',sans-serif; font-size:23px; font-weight:800; letter-spacing:-.5px; margin:0; color:var(--sm-ink); }
@media (max-width:1080px){
body.panel-app .sm-topnav-menu{ position:absolute; top:64px; left:0; right:0; flex-direction:column; align-items:stretch; gap:2px;
                background:#171717; border-radius:14px; padding:10px; box-shadow:0 18px 40px -14px rgba(0,0,0,.5); display:none; z-index:1032; }
body.panel-app .sm-topnav-menu.open{ display:flex; }
body.panel-app .sm-topnav-menu a, body.panel-app .sm-topnav-menu .nav-drop>button{ width:100%; }
body.panel-app .sm-burger{ display:grid; }}
/* --- Dark-mode korumaları (beyaz sidebar / siyah topbar light'a özgü) --- */
[data-bs-theme="dark"] body.panel-app .sm-sidebar{ background:linear-gradient(180deg,#060912,#0d1426); border-right-color:var(--sm-border); }
[data-bs-theme="dark"] body.panel-app .sm-brand{ color:#fff; }
[data-bs-theme="dark"] body.panel-app .sm-nav a{ color:#aeb9d4; }
[data-bs-theme="dark"] body.panel-app .sm-nav a i{ color:#7e8db0; }
[data-bs-theme="dark"] body.panel-app .sm-nav a:hover{ color:#fff; }
[data-bs-theme="dark"] body.panel-app .sm-topbar{ background:#0d1426; }


/* ===================== STAFF — panel tasarım sistemi (_head) ===================== */

body.panel-staff{
            --sm-bg:#f3f5fb; --sm-sidebar:#0b1020; --sm-sidebar2:#141d36;
            --sm-primary:#6366f1; --sm-primary2:#8b5cf6; --sm-primary-ink:#4f46e5;
            --sm-ink:#0f172a; --sm-ink-soft:#334155; --sm-muted:#64748b; --sm-faint:#94a3b8;
            --sm-border:#e9ecf5; --sm-border-strong:#dde2ee; --sm-card:#ffffff; --sm-hover:#f6f8fc;
            --sm-ok:#10b981; --sm-warn:#f59e0b; --sm-bad:#ef4444; --sm-info:#3b82f6;
            --sm-grad:linear-gradient(135deg,#6366f1,#8b5cf6);
            --sm-r-xs:8px; --sm-r-sm:10px; --sm-r:14px; --sm-r-lg:18px; --sm-r-xl:24px;
            --sm-control:44px;
            --sm-sh-xs:0 1px 2px rgba(15,23,42,.05);
            --sm-sh-sm:0 2px 6px -1px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.05);
            --sm-sh:0 12px 28px -10px rgba(15,23,42,.18);
            --sm-sh-lg:0 32px 64px -22px rgba(15,23,42,.32);
            --sm-ring:0 0 0 4px rgba(99,102,241,.16);
        }
body.panel-staff *{ font-family:'Inter',system-ui,sans-serif; }
body.panel-staff *, body.panel-staff *::before, body.panel-staff *::after{ box-sizing:border-box; }
body.panel-staff{ background:var(--sm-bg); color:var(--sm-ink); margin:0; font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
body.panel-staff a{ text-decoration:none; color:var(--sm-primary-ink); }
body.panel-staff h1, body.panel-staff h2, body.panel-staff h3, body.panel-staff h4, body.panel-staff h5, body.panel-staff h6{ letter-spacing:-.012em; }
body.panel-staff ::selection{ background:rgba(99,102,241,.18); }
body.panel-staff *::-webkit-scrollbar{ width:10px; height:10px; }
body.panel-staff *::-webkit-scrollbar-thumb{ background:rgba(100,116,139,.32); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
body.panel-staff *::-webkit-scrollbar-thumb:hover{ background:rgba(100,116,139,.5); background-clip:content-box; }
body.panel-staff .sm-app{ display:flex; min-height:100vh; }
/* Sidebar */
body.panel-staff .sm-sidebar{ width:248px; flex-shrink:0; background:linear-gradient(180deg,var(--sm-sidebar),var(--sm-sidebar2));
            color:#cbd5e1; position:fixed; top:0; bottom:0; left:0; display:flex; flex-direction:column; z-index:1030; }
body.panel-staff .sm-brand{ padding:20px 22px; font-weight:800; font-size:19px; color:#fff; letter-spacing:-.4px; display:flex; align-items:center; gap:10px; }
body.panel-staff .sm-brand i{ background:linear-gradient(135deg,var(--sm-primary),var(--sm-primary2)); width:34px;height:34px; border-radius:9px; display:grid; place-items:center; font-size:18px; }
body.panel-staff .sm-nav{ padding:6px 12px; overflow-y:auto; flex:1; }
body.panel-staff .sm-nav .lbl{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#5b6885; padding:14px 12px 6px; }
body.panel-staff .sm-nav a{ display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:9px; color:#aeb9d4; font-weight:500; margin-bottom:2px; transition:.15s; }
body.panel-staff .sm-nav a i{ font-size:17px; width:20px; text-align:center; }
body.panel-staff .sm-nav a:hover{ background:rgba(255,255,255,.06); color:#fff; }
body.panel-staff .sm-nav a.active{ background:linear-gradient(135deg,var(--sm-primary),var(--sm-primary2)); color:#fff; box-shadow:0 8px 18px -6px rgba(99,102,241,.6); }
/* Main */
body.panel-staff .sm-main{ flex:1; margin-left:248px; min-width:0; display:flex; flex-direction:column; }
body.panel-staff .sm-topbar{ height:64px; background:rgba(255,255,255,.85); backdrop-filter:blur(8px); border-bottom:1px solid var(--sm-border);
            display:flex; align-items:center; gap:16px; padding:0 24px; position:sticky; top:0; z-index:1020; }
body.panel-staff .sm-topbar h1{ font-size:18px; font-weight:700; margin:0; }
/* Topbar kontrolleri tek yükseklik/font (ikon + butonlar + profil hizalı) */
body.panel-staff .sm-topbar .btn{ min-height:40px; font-size:13px; border-radius:10px; }
body.panel-staff .sm-page{ padding:24px; flex:1; }
body.panel-staff .sm-icon-btn{ width:40px;height:40px; border-radius:10px; border:1px solid var(--sm-border); background:#fff; display:grid; place-items:center; color:var(--sm-muted); position:relative; cursor:pointer; }
body.panel-staff .sm-icon-btn:hover{ color:var(--sm-primary); border-color:#c7cbf3; }
body.panel-staff .sm-badge-dot{ position:absolute; top:-5px; right:-5px; background:var(--sm-bad); color:#fff; font-size:10px; font-weight:700; border-radius:999px; padding:1px 6px; }
/* Cards */
body.panel-staff .card{ border:1px solid var(--sm-border); border-radius:var(--sm-r-lg); box-shadow:var(--sm-sh-xs); background:var(--sm-card); }
body.panel-staff .card-header{ background:transparent; border-bottom:1px solid var(--sm-border); font-weight:700; font-size:15px; letter-spacing:-.01em; border-radius:var(--sm-r-lg) var(--sm-r-lg) 0 0 !important; padding:18px 22px; }
body.panel-staff .card-body{ padding:22px; }
body.panel-staff .card-footer{ background:transparent; border-top:1px solid var(--sm-border); padding:16px 22px; }
body.panel-staff .sm-stat{ border-radius:var(--sm-r-lg); padding:20px; background:var(--sm-card); border:1px solid var(--sm-border); box-shadow:var(--sm-sh-xs); transition:transform .18s ease, box-shadow .18s ease; }
body.panel-staff .sm-stat:hover{ transform:translateY(-3px); box-shadow:var(--sm-sh); }
body.panel-staff .sm-stat .ic{ width:46px;height:46px; border-radius:13px; display:grid; place-items:center; font-size:22px; color:#fff; box-shadow:0 10px 20px -8px rgba(99,102,241,.5); }
body.panel-staff .sm-stat .val{ font-size:28px; font-weight:800; letter-spacing:-.5px; }
body.panel-staff .sm-stat .lbl{ color:var(--sm-muted); font-size:13px; font-weight:500; }
body.panel-staff .grad-1{ background:linear-gradient(135deg,#6366f1,#8b5cf6);}
body.panel-staff .grad-2{ background:linear-gradient(135deg,#10b981,#059669);}
body.panel-staff .grad-3{ background:linear-gradient(135deg,#f59e0b,#d97706);}
body.panel-staff .grad-4{ background:linear-gradient(135deg,#3b82f6,#2563eb);}
/* Buttons — flat single colour, no shadow, equal height with inputs */
body.panel-staff .btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:var(--sm-control); border-radius:var(--sm-r-sm); font-weight:600; padding:0 16px; line-height:1.2; box-shadow:none!important; transition:background-color .15s ease, border-color .15s ease, color .15s ease; }
body.panel-staff .btn-sm{ min-height:36px; border-radius:var(--sm-r-xs); padding:0 12px; font-size:13px; }
body.panel-staff .btn-lg{ min-height:50px; padding:0 22px; font-size:15px; border-radius:var(--sm-r); }
body.panel-staff .btn svg{ flex-shrink:0; }
body.panel-staff .btn-primary{ background:var(--sm-primary); border:1px solid var(--sm-primary); color:#fff; }
body.panel-staff .btn-primary:hover, body.panel-staff .btn-primary:focus, body.panel-staff .btn-primary:active{ background:var(--sm-primary-ink)!important; border-color:var(--sm-primary-ink)!important; filter:none; transform:none; }
body.panel-staff .btn-light{ background:#fff; border:1px solid var(--sm-border-strong); color:var(--sm-ink-soft); }
body.panel-staff .btn-light:hover{ background:var(--sm-hover); border-color:var(--sm-faint); color:var(--sm-ink); }
body.panel-staff .btn-danger{ background:var(--sm-bad); border:1px solid var(--sm-bad); color:#fff; }
body.panel-staff .btn-danger:hover, body.panel-staff .btn-danger:focus, body.panel-staff .btn-danger:active{ background:#dc2626!important; border-color:#dc2626!important; color:#fff; }
body.panel-staff .btn-outline-secondary{ border-color:var(--sm-border-strong); color:var(--sm-ink-soft); }
body.panel-staff .btn-outline-secondary:hover{ background:var(--sm-hover); color:var(--sm-ink); border-color:var(--sm-faint); }
/* Forms — one consistent control across every panel */
body.panel-staff .form-label{ font-size:12.5px; font-weight:600; color:var(--sm-ink-soft); margin-bottom:6px; letter-spacing:.005em; }
body.panel-staff .form-label.text-muted{ color:var(--sm-muted)!important; }
body.panel-staff .col-form-label{ font-weight:600; color:var(--sm-ink-soft); }
body.panel-staff .form-control, body.panel-staff .form-select{ min-height:var(--sm-control); padding:10px 14px; border-radius:var(--sm-r-sm); border:1.5px solid var(--sm-border-strong); color:var(--sm-ink); font-size:14px; background-color:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
body.panel-staff .form-control::placeholder{ color:var(--sm-faint); }
body.panel-staff .form-control:hover, body.panel-staff .form-select:hover{ border-color:var(--sm-faint); }
body.panel-staff .form-control:focus, body.panel-staff .form-select:focus{ border-color:var(--sm-primary); box-shadow:var(--sm-ring); background-color:#fff; }
body.panel-staff .form-control-sm, body.panel-staff .form-select-sm{ min-height:36px; padding:6px 11px; font-size:13px; border-radius:var(--sm-r-xs); }
/* Select okunun metnin üstüne binmemesi için sağ boşluk + ok konumu */
body.panel-staff .form-select{ padding-right:40px; background-position:right 14px center; background-size:15px 11px; }
body.panel-staff .form-select-sm{ padding-right:34px; background-position:right 11px center; }
body.panel-staff .form-control-lg{ min-height:50px; font-size:15px; border-radius:var(--sm-r); }
body.panel-staff textarea.form-control{ min-height:auto; padding-top:11px; line-height:1.55; }
body.panel-staff .input-group>.form-control, body.panel-staff .input-group>.form-select{ min-height:var(--sm-control); }
body.panel-staff .input-group-text{ border-radius:var(--sm-r-sm); border:1.5px solid var(--sm-border-strong); background:var(--sm-hover); color:var(--sm-muted); font-weight:500; }
body.panel-staff .form-check-input{ width:18px; height:18px; margin-top:.16em; border:1.5px solid var(--sm-border-strong); cursor:pointer; }
body.panel-staff .form-check-input:checked{ background-color:var(--sm-primary); border-color:var(--sm-primary); }
body.panel-staff .form-check-input:focus{ box-shadow:var(--sm-ring); border-color:var(--sm-primary); }
body.panel-staff .form-check-label{ cursor:pointer; padding-top:1px; }
body.panel-staff .form-switch .form-check-input{ width:38px; height:20px; }
body.panel-staff .form-text{ color:var(--sm-muted); font-size:12px; }
body.panel-staff .is-invalid{ border-color:var(--sm-bad)!important; }
body.panel-staff .invalid-feedback{ font-size:12px; }
body.panel-staff .badge{ font-weight:600; padding:.42em .7em; border-radius:7px; }
body.panel-staff .badge.rounded-pill{ border-radius:999px; }
body.panel-staff .text-muted{ color:var(--sm-muted)!important; }
/* Modals */
body.panel-staff .modal-content{ border:0; border-radius:var(--sm-r-lg); box-shadow:var(--sm-sh-lg); overflow:hidden; }
body.panel-staff .modal-header{ padding:20px 24px; border-bottom:1px solid var(--sm-border); }
body.panel-staff .modal-title{ font-weight:700; font-size:17px; letter-spacing:-.01em; }
body.panel-staff .modal-body{ padding:24px; }
body.panel-staff .modal-footer{ padding:16px 24px; border-top:1px solid var(--sm-border); gap:8px; }
body.panel-staff .modal-backdrop.show{ opacity:.45; }
/* Dropdowns */
body.panel-staff .dropdown-menu{ border:1px solid var(--sm-border); border-radius:var(--sm-r); box-shadow:var(--sm-sh); padding:6px; }
body.panel-staff .dropdown-item{ border-radius:var(--sm-r-xs); padding:9px 12px; font-weight:500; font-size:13.5px; }
body.panel-staff .dropdown-item:hover, body.panel-staff .dropdown-item:focus{ background:var(--sm-hover); }
body.panel-staff .dropdown-divider{ border-color:var(--sm-border); }
/* Alerts */
body.panel-staff .alert{ border-radius:var(--sm-r); border:1px solid transparent; }
/* Plain tables (dashboard, analytics) */
body.panel-staff .table{ color:var(--sm-ink); margin-bottom:0; }
body.panel-staff .table>thead th{ font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--sm-muted); font-weight:700; border-bottom:1px solid var(--sm-border)!important; padding:12px 14px; background:var(--sm-hover); }
body.panel-staff .table>tbody td{ padding:13px 14px; border-bottom:1px solid var(--sm-border); vertical-align:middle; }
body.panel-staff .table>tbody tr:last-child td{ border-bottom:0; }
body.panel-staff .table-hover>tbody>tr:hover>*{ background:var(--sm-hover); }
/* DataTables — premium */
body.panel-staff table.dataTable{ border-collapse:separate!important; border-spacing:0; width:100%!important; }
body.panel-staff table.dataTable thead th{ font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--sm-muted); font-weight:700; background:var(--sm-hover); border-bottom:1px solid var(--sm-border)!important; padding:13px 14px; }
body.panel-staff table.dataTable thead th:first-child{ border-top-left-radius:var(--sm-r-sm); }
body.panel-staff table.dataTable thead th:last-child{ border-top-right-radius:var(--sm-r-sm); }
body.panel-staff table.dataTable tbody td{ vertical-align:middle; padding:14px; border-top:1px solid var(--sm-border); }
body.panel-staff table.dataTable tbody tr:first-child td{ border-top:0; }
body.panel-staff table.dataTable tbody tr{ transition:background .12s ease; }
body.panel-staff table.dataTable tbody tr:hover td{ background:var(--sm-hover); }
body.panel-staff .dt-container .dt-layout-row{ align-items:center; margin-bottom:14px; }
body.panel-staff .dt-container .dt-layout-row:last-child{ margin-bottom:0; margin-top:16px; }
body.panel-staff .dt-search input{ min-height:42px; min-width:240px; padding:9px 14px 9px 38px!important; border-radius:var(--sm-r-sm)!important; border:1.5px solid var(--sm-border-strong)!important; background:var(--sm-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2394a3b8' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E") no-repeat 13px center; }
body.panel-staff .dt-search input:focus{ border-color:var(--sm-primary)!important; box-shadow:var(--sm-ring); outline:0; }
body.panel-staff .dt-length select{ min-height:42px; border-radius:var(--sm-r-sm)!important; border:1.5px solid var(--sm-border-strong)!important; }
body.panel-staff .dt-info{ color:var(--sm-muted); font-size:13px; }
/* Pagination — premium & kibar. Bootstrap5 markup'ı: <li class="dt-paging-button page-item"> (DIŞ sarmalayıcı) > <button class="page-link"> (ASIL buton). "Kutu içinde kutu" olmaması için DIŞ li sadeleştirilir; çerçeve/zemin yalnız asıl butona verilir. */
body.panel-staff .dt-container .dt-paging{ display:flex; justify-content:flex-end; align-items:center; }
body.panel-staff .dt-container .dt-paging nav, body.panel-staff .dt-container .dt-paging .pagination{ display:inline-flex!important; align-items:center; gap:3px; margin:0!important; padding:0!important; flex-wrap:wrap; list-style:none; }
/* DIŞ sarmalayıcı (li) — şeffaf, çerçevesiz */
body.panel-staff .dt-container .dt-paging .page-item, body.panel-staff .dt-container .dt-paging li.dt-paging-button{
            margin:0!important; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; display:inline-flex;
        }
/* ASIL buton */
body.panel-staff .dt-container .dt-paging .page-link, body.panel-staff .dt-container .dt-paging button.dt-paging-button, body.panel-staff .dt-container .dt-paging a.dt-paging-button{
            display:inline-flex!important; align-items:center; justify-content:center;
            min-width:30px; height:30px; padding:0 8px!important; margin:0!important;
            border-radius:8px!important; border:1px solid var(--sm-border)!important;
            background:var(--sm-card)!important; color:var(--sm-muted)!important;
            font-weight:600; font-size:12.5px; line-height:1; cursor:pointer; box-shadow:none!important;
            transition:background .13s ease, border-color .13s ease, color .13s ease;
        }
body.panel-staff .dt-container .dt-paging .page-item:not(.active):not(.disabled) .page-link:hover, body.panel-staff .dt-container .dt-paging button.dt-paging-button:hover:not(.disabled):not(.current){
            background:var(--sm-hover)!important; border-color:var(--sm-border-strong)!important; color:var(--sm-ink)!important;
        }
body.panel-staff .dt-container .dt-paging .page-item.active .page-link, body.panel-staff .dt-container .dt-paging button.dt-paging-button.current{
            background:#171717!important; border-color:#171717!important; color:#fff!important;
            box-shadow:0 2px 5px -1px rgba(23,23,23,.3)!important;
        }
body.panel-staff .dt-container .dt-paging .page-item.disabled .page-link, body.panel-staff .dt-container .dt-paging button.dt-paging-button.disabled{
            opacity:.35; cursor:default; background:var(--sm-card)!important; border-color:var(--sm-border)!important; color:var(--sm-faint)!important;
        }
body.panel-staff table.dataTable>tbody>tr.selected>*{ box-shadow:inset 0 0 0 9999px rgba(99,102,241,.08); }
@media (max-width:860px){
body.panel-staff .sm-sidebar{ transform:translateX(-100%); transition:.2s; }
body.panel-staff .sm-sidebar.open{ transform:none; }
body.panel-staff .sm-main{ margin-left:0; }}
/* --- Dark mode (Bootstrap data-bs-theme + özel --sm-* override) --- */
[data-bs-theme="dark"] body.panel-staff{
            --sm-bg:#0a0e1a; --sm-sidebar:#060912; --sm-sidebar2:#0d1426;
            --sm-ink:#e8edf6; --sm-ink-soft:#cbd5e1; --sm-muted:#94a3b8; --sm-faint:#64748b;
            --sm-border:#1f2a44; --sm-border-strong:#2a3654; --sm-card:#111a2e; --sm-hover:#16203a;
        }
[data-bs-theme="dark"] body.panel-staff{ background:var(--sm-bg); color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-staff .sm-topbar{ background:rgba(13,20,38,.82); }
[data-bs-theme="dark"] body.panel-staff .card, [data-bs-theme="dark"] body.panel-staff .sm-stat, [data-bs-theme="dark"] body.panel-staff .sm-icon-btn{ background:var(--sm-card); }
[data-bs-theme="dark"] body.panel-staff .modal-content, [data-bs-theme="dark"] body.panel-staff .dropdown-menu{ background:var(--sm-card); }
[data-bs-theme="dark"] body.panel-staff .form-control, [data-bs-theme="dark"] body.panel-staff .form-select, [data-bs-theme="dark"] body.panel-staff .dt-search input, [data-bs-theme="dark"] body.panel-staff .dt-length select{ background-color:#0e1626!important; border-color:var(--sm-border-strong)!important; color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-staff .input-group-text{ background:#0e1626; border-color:var(--sm-border-strong); }
[data-bs-theme="dark"] body.panel-staff .btn-light{ background:#16203a; border-color:var(--sm-border-strong); color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-staff .btn-light:hover{ background:#1c2949; color:#fff; }
[data-bs-theme="dark"] body.panel-staff .table>thead th, [data-bs-theme="dark"] body.panel-staff table.dataTable thead th{ background:#0e1626; }
[data-bs-theme="dark"] body.panel-staff .table>tbody td, [data-bs-theme="dark"] body.panel-staff table.dataTable tbody td{ border-color:var(--sm-border); }
[data-bs-theme="dark"] body.panel-staff .table-hover>tbody>tr:hover>*, [data-bs-theme="dark"] body.panel-staff table.dataTable tbody tr:hover td{ background:var(--sm-hover); }
[data-bs-theme="dark"] body.panel-staff .dropdown-item{ color:var(--sm-ink); }
[data-bs-theme="dark"] body.panel-staff .dropdown-item:hover, [data-bs-theme="dark"] body.panel-staff .dropdown-item:focus{ background:var(--sm-hover); }
[data-bs-theme="dark"] body.panel-staff .bg-light{ background:#16203a!important; color:var(--sm-ink); }


/* ===================== APP sayfa: dashboard ===================== */

body.panel-app .rt{ display:flex; gap:18px; align-items:flex-start; }
body.panel-app .rt-main{ flex:1; min-width:0; }
/* --- Groups paneli --- */
body.panel-app .rt-groups{ width:460px; flex-shrink:0; background:#fff; border:1px solid var(--sm-border); border-radius:var(--sm-r-lg);
        padding:14px 12px; position:sticky; top:88px; display:flex; flex-direction:column; max-height:calc(100vh - 104px); }
body.panel-app .rt-ghead{ display:flex; align-items:center; gap:6px; padding:2px 4px 12px; }
body.panel-app .rt-ghead h2{ font-family:'Manrope','Inter',sans-serif; font-size:20px; font-weight:800; letter-spacing:-.4px; margin:0; flex:1; }
body.panel-app .rt-ghead .ico{ width:32px;height:32px;border-radius:9px;border:1px solid var(--sm-border); background:#fff; display:grid;place-items:center; color:var(--sm-muted); cursor:pointer; }
body.panel-app .rt-ghead .ico:hover{ color:var(--sm-ink); border-color:var(--sm-border-strong); }
body.panel-app .rt-devseg{ display:inline-flex; padding:3px; gap:2px; background:var(--sm-hover); border-radius:9px; }
body.panel-app .rt-devseg button{ border:0; background:transparent; color:var(--sm-muted); width:30px;height:26px; border-radius:7px; cursor:pointer; font-size:13px; }
body.panel-app .rt-devseg button.active{ background:#171717; color:#fff; }
body.panel-app .rt-gsearch{ position:relative; margin-bottom:8px; }
body.panel-app .rt-gsearch input{ width:100%; min-height:40px; border:1px solid var(--sm-border); border-radius:10px; padding:8px 12px 8px 34px; font-size:13.5px; background:var(--sm-hover); }
body.panel-app .rt-gsearch input:focus{ outline:0; border-color:var(--sm-accent-bright); background:#fff; box-shadow:0 0 0 3px rgba(34,202,92,.15); }
body.panel-app .rt-gsearch i{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--sm-faint); font-size:14px; }
body.panel-app .rt-glist{ overflow-y:auto; margin:0 -4px; padding:0 4px; flex:1; }
body.panel-app .grp{ display:flex; align-items:center; gap:11px; padding:9px 10px; border-radius:12px; cursor:pointer; transition:background .12s ease; margin-bottom:1px; }
body.panel-app .grp:hover{ background:var(--sm-hover); }
body.panel-app .grp.active{ background:var(--sm-hover); }
body.panel-app .grp .gi{ width:30px;height:30px;border-radius:9px; display:grid;place-items:center; background:#f0f0f0; color:var(--sm-muted); font-size:14px; flex-shrink:0; }
body.panel-app .grp.active .gi{ background:#171717; color:#fff; }
body.panel-app .grp .gbody{ min-width:0; flex:1; }
body.panel-app .grp .gname{ font-weight:700; font-size:13px; color:var(--sm-ink); line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.panel-app .grp .gname .gnum{ display:inline-grid; place-items:center; min-width:15px;height:15px; padding:0 4px; border-radius:5px; background:var(--sm-hover); color:var(--sm-faint); font-size:9.5px; font-weight:800; vertical-align:1px; margin-right:5px; }
body.panel-app .grp .gsub{ font-size:11px; color:var(--sm-faint); font-weight:600; margin-top:1px; }
body.panel-app .gpct{ display:inline-flex; align-items:center; gap:4px; flex-shrink:0; }
body.panel-app .gpct .v{ font-size:12.5px; font-weight:750; color:var(--sm-ink); }
body.panel-app .gpct .d{ font-size:11px; font-weight:750; }
body.panel-app .gpct .d.up{ color:var(--sm-accent-ink); }
body.panel-app .gpct .d.down{ color:#dc2626; }
body.panel-app .gpct .d.flat{ color:var(--sm-faint); }
body.panel-app .grp .chev{ color:var(--sm-faint); font-size:12px; }
/* --- Üst toolbar --- */
body.panel-app .rt-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
body.panel-app .site-sel{ display:inline-flex; align-items:center; gap:9px; border:1px solid var(--sm-border); border-radius:11px; background:#fff; padding:7px 10px; min-width:230px; }
body.panel-app .site-sel .av{ width:26px;height:26px;border-radius:7px; background:var(--sm-grad); color:#fff; display:grid;place-items:center; font-size:13px; flex-shrink:0; }
body.panel-app .site-sel select{ border:0; background:transparent; font-weight:700; font-size:14px; color:var(--sm-ink); flex:1; min-width:0; outline:0; cursor:pointer; padding:0; }
body.panel-app .rt-title{ display:flex; align-items:center; gap:10px; }
body.panel-app .rt-title h1{ font-family:'Manrope','Inter',sans-serif; font-size:23px; font-weight:800; letter-spacing:-.5px; margin:0; }
body.panel-app .count-pill{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:750; color:var(--sm-ink-soft); background:var(--sm-hover); border-radius:999px; padding:4px 11px; }
body.panel-app .rt-tabs{ display:inline-flex; gap:3px; padding:4px; background:var(--sm-hover); border-radius:12px; }
body.panel-app .rt-tabs button{ display:inline-flex; align-items:center; gap:7px; border:0; background:transparent; color:var(--sm-muted); font-weight:650; font-size:13.5px; padding:8px 15px; border-radius:9px; cursor:pointer; transition:.15s; white-space:nowrap; }
body.panel-app .rt-tabs button:hover{ color:var(--sm-ink); }
body.panel-app .rt-tabs button.active{ background:#171717; color:#fff; }
body.panel-app .date-pill{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--sm-border); border-radius:11px; background:#fff; padding:0 6px 0 12px; }
body.panel-app .date-pill i{ color:var(--sm-muted); font-size:14px; }
body.panel-app .date-pill select{ border:0; background:transparent; font-weight:650; font-size:13px; color:var(--sm-ink-soft); outline:0; cursor:pointer; min-height:38px; padding:0 4px; }
/* --- Özet kart ek detayları --- */
body.panel-app .sm-sumcard .big.sm{ font-size:26px; }
body.panel-app .sm-sumcard .head .x{ margin-left:auto; color:var(--sm-faint); cursor:pointer; }
body.panel-app .sm-sumcard .head .x:hover{ color:var(--sm-ink); }
body.panel-app .opp-wrap{ display:flex; align-items:center; gap:14px; }
body.panel-app .opp-status{ display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; margin-top:13px; padding-top:12px; border-top:1px solid var(--sm-border); }
body.panel-app .opp-status .dot{ width:8px;height:8px;border-radius:50%; }
/* --- Trend grafik kartı --- */
body.panel-app .rt-metric{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700; color:var(--sm-ink-soft); background:var(--sm-hover); border:0; padding:7px 13px; border-radius:999px; cursor:pointer; }
body.panel-app .rt-metric .dot{ width:9px;height:9px;border-radius:50%; }
body.panel-app .rt-iconbtn{ width:38px;height:38px;border-radius:10px;border:1px solid var(--sm-border); background:#fff; display:grid;place-items:center; color:var(--sm-muted); cursor:pointer; }
body.panel-app .rt-iconbtn:hover{ color:var(--sm-ink); border-color:var(--sm-border-strong); }
body.panel-app .rt-add{ display:inline-flex; align-items:center; gap:7px; border:1px solid var(--sm-border); background:#fff; border-radius:11px; padding:0 14px; min-height:38px; font-weight:650; font-size:13px; color:var(--sm-ink-soft); cursor:pointer; }
body.panel-app .rt-add:hover{ border-color:var(--sm-border-strong); color:var(--sm-ink); }
/* --- FAB --- */
body.panel-app .rt-fab{ position:fixed; right:26px; bottom:26px; width:54px;height:54px; border-radius:50%; background:#171717; color:#fff; border:0; font-size:24px; display:grid;place-items:center; box-shadow:0 12px 30px -8px rgba(23,23,23,.5); cursor:pointer; z-index:1040; transition:transform .15s ease; }
body.panel-app .rt-fab:hover{ transform:scale(1.06); background:#000; }
@media (max-width:1100px){
body.panel-app .rt{ flex-direction:column; }
body.panel-app .rt-groups{ width:100%; position:static; max-height:none; }}
/* --- Rakip karşılaştırma matrisi --- */
body.panel-app .cmp-search{ position:relative; }
body.panel-app .cmp-search input{ min-height:36px; border:1px solid var(--sm-border); border-radius:10px; padding:6px 12px 6px 32px; font-size:13px; background:var(--sm-hover); min-width:240px; }
body.panel-app .cmp-search input:focus{ outline:0; border-color:var(--sm-accent-bright); background:#fff; box-shadow:0 0 0 3px rgba(34,202,92,.15); }
body.panel-app .cmp-search i{ position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--sm-faint); font-size:13px; }
body.panel-app .cmp-scroll{ overflow-x:auto; }
body.panel-app .cmp-tbl{ border-collapse:separate; border-spacing:0; width:max-content; min-width:100%; }
body.panel-app .cmp-tbl th, body.panel-app .cmp-tbl td{ box-sizing:border-box; padding:13px 14px; border-bottom:1px solid var(--sm-border); background:#fff; vertical-align:middle; font-size:13px; }
body.panel-app .cmp-tbl thead th{ position:sticky; top:0; z-index:3; background:#fafafa; font-size:10.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--sm-faint); white-space:nowrap; }
body.panel-app .cmp-tbl tbody tr:hover td{ background:var(--sm-hover); }
body.panel-app .cmp-stick{ position:sticky; z-index:2; }
body.panel-app .cmp-tbl thead .cmp-stick{ z-index:4; }
body.panel-app .c-kw{ left:0;   width:230px; }
body.panel-app .c-ft{ left:230px; width:122px; }
body.panel-app .c-ct{ left:352px; width:64px;  text-align:center; }
body.panel-app .c-vol{ left:416px; width:88px; text-align:right; box-shadow:7px 0 9px -7px rgba(0,0,0,.18); }
body.panel-app .cmp-kwname{ font-weight:700; color:var(--sm-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:200px; }
body.panel-app .cmp-kwname .grp{ font-weight:600; color:var(--sm-faint); font-size:11px; }
body.panel-app .cmp-dom{ width:158px; min-width:158px; border-left:1px solid var(--sm-border); }
body.panel-app .cmp-dom.us{ background:rgba(34,202,92,.05); }
body.panel-app .cmp-tbl tbody tr:hover td.cmp-dom.us{ background:rgba(34,202,92,.09); }
body.panel-app .cmp-dom.us::before{ content:''; position:absolute; }
body.panel-app .cmp-dh{ display:flex; align-items:center; gap:8px; text-transform:none; }
body.panel-app .cmp-av{ width:24px;height:24px;border-radius:50%; display:grid;place-items:center; color:#fff; font-size:11px; font-weight:800; flex-shrink:0; }
body.panel-app .cmp-dn{ font-size:12.5px; font-weight:750; color:var(--sm-ink); letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:104px; text-transform:none; }
body.panel-app .cmp-sub{ font-size:9.5px; font-weight:800; color:var(--sm-faint); letter-spacing:.06em; margin-top:1px; }
body.panel-app .cmp-cell{ display:inline-flex; align-items:center; gap:7px; }
body.panel-app .cmp-rk{ display:inline-grid; place-items:center; min-width:40px;height:30px;padding:0 11px; border-radius:999px; background:var(--sm-hover); font-weight:750; color:var(--sm-ink); }
body.panel-app .cmp-rk.na{ color:var(--sm-faint); font-weight:600; }
body.panel-app .cmp-tr{ display:inline-grid; place-items:center; min-width:38px;height:26px;padding:0 8px; border-radius:999px; font-weight:800; font-size:12px; }
body.panel-app .cmp-tr.up{ background:#16a34a; color:#fff; }
body.panel-app .cmp-tr.down{ background:#dc2626; color:#fff; }
body.panel-app .cmp-tr.flat{ background:var(--sm-hover); color:var(--sm-faint); }


/* ===================== APP sayfa: audit ===================== */

body.panel-app .au-gauge{ --v:0; --col:var(--sm-ok); width:132px; height:132px; border-radius:50%;
        background:conic-gradient(var(--col) calc(var(--v)*1%), var(--sm-border) 0); display:grid; place-items:center; }
body.panel-app .au-gauge .inner{ width:104px; height:104px; border-radius:50%; background:var(--sm-card); display:grid; place-items:center; text-align:center; }
body.panel-app .au-gauge .num{ font-size:30px; font-weight:800; line-height:1; letter-spacing:-1px; }
body.panel-app .au-gauge .cap{ font-size:11px; color:var(--sm-muted); font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
body.panel-app .au-mini .ic{ width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:18px;color:#fff; }
body.panel-app .au-mini .v{ font-size:22px;font-weight:800;letter-spacing:-.5px; }
body.panel-app .au-mini .l{ font-size:12px;color:var(--sm-muted); }
body.panel-app .au-pill{ cursor:pointer; }
body.panel-app .au-bd-row{ display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--sm-border); }
body.panel-app .au-bd-row:last-child{ border-bottom:0; }


/* ===================== APP sayfa: geo ===================== */

body.panel-app .geo-gauge{ --v:0; --col:var(--sm-primary); width:132px; height:132px; border-radius:50%;
        background:conic-gradient(var(--col) calc(var(--v)*1%), var(--sm-border) 0); display:grid; place-items:center; }
body.panel-app .geo-gauge .inner{ width:104px; height:104px; border-radius:50%; background:var(--sm-card); display:grid; place-items:center; text-align:center; }
body.panel-app .geo-gauge .num{ font-size:30px; font-weight:800; line-height:1; letter-spacing:-1px; }
body.panel-app .geo-gauge .cap{ font-size:11px; color:var(--sm-muted); font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
body.panel-app .geo-mini .v{ font-size:22px;font-weight:800;letter-spacing:-.5px; }
body.panel-app .geo-mini .l{ font-size:12px;color:var(--sm-muted); }
body.panel-app .geo-opp{ display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--sm-border);cursor:pointer; }
body.panel-app .geo-opp:last-child{ border-bottom:0; }
body.panel-app .geo-opp:hover{ background:var(--sm-hover); }


/* ===================== STAFF sayfa: database ===================== */

body.panel-staff #tblList .list-group-item{cursor:pointer;border:0;border-radius:8px;padding:6px 10px;display:flex;align-items:center;gap:6px}
body.panel-staff #tblList .list-group-item.active{background:var(--sm-primary,#6366f1);color:#fff}
body.panel-staff #tblList .list-group-item .ct{margin-left:auto;font-size:11px;opacity:.7}
body.panel-staff .ed-ov{position:fixed;inset:0;z-index:1096;display:none;place-items:center;padding:18px;background:rgba(15,23,42,.5)}
body.panel-staff .ed-ov.show{display:grid}
body.panel-staff .ed-box{width:min(720px,100%);max-height:90vh;display:flex;flex-direction:column;background:var(--sm-card,#fff);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
body.panel-staff .ed-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(0,0,0,.08)}
body.panel-staff .ed-body{padding:16px 20px;overflow:auto}
body.panel-staff .ed-foot{display:flex;gap:10px;justify-content:flex-end;padding:14px 20px;border-top:1px solid rgba(0,0,0,.08)}
body.panel-staff .ed-f{margin-bottom:12px}
body.panel-staff .ed-f label{font-size:12px;font-weight:600;color:var(--sm-muted,#64748b);display:block;margin-bottom:3px}
body.panel-staff .ed-f .meta{font-size:11px;color:#94a3b8;font-weight:400}
body.panel-staff .pk-chip{display:inline-block;font-size:10px;background:#fde68a;color:#92400e;border-radius:4px;padding:0 5px;margin-left:4px}


/* ===================== Standalone: app/login ===================== */
/* SEOmonitor kimliği: siyah ink + yeşil marka aksanı (bkz docs/reference/seomonitor-design.md) */
body.page-login-app{ --ink:#171717; --soft:#404040; --muted:#737373; --faint:#a3a3a3; --border:#e5e5e5;
               --green:#1ba84d; --green2:#22ca5c; --green-ink:#16a34a; }
body.page-login-app *{ font-family:'Inter',system-ui,sans-serif; box-sizing:border-box; }
body.page-login-app{ min-height:100vh; margin:0; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased; }
body.page-login-app .auth-wrap{ min-height:100vh; display:grid; grid-template-columns:1.05fr .95fr; }
/* Marka vitrini — SEOmonitor: siyah zemin + yeşil ışıma */
body.page-login-app .auth-brand{ position:relative; overflow:hidden; padding:56px; color:#fff; display:flex; flex-direction:column;
            background:radial-gradient(820px 520px at 8% -5%, rgba(34,202,92,.30), transparent), radial-gradient(760px 560px at 105% 108%, rgba(27,168,77,.26), transparent), #171717; }
body.page-login-app .auth-brand::after{ content:''; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px); background-size:22px 22px; opacity:.6; pointer-events:none; }
body.page-login-app .auth-brand .inner{ position:relative; z-index:1; margin:auto 0; max-width:440px; }
body.page-login-app .auth-logo{ display:flex; align-items:center; gap:12px; font-family:'Manrope','Inter',sans-serif; font-weight:800; font-size:24px; letter-spacing:-.5px; margin-bottom:42px; }
body.page-login-app .auth-logo i{ background:linear-gradient(135deg,var(--green2),var(--green)); width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:22px; box-shadow:0 12px 28px -8px rgba(34,202,92,.6); }
body.page-login-app .auth-brand h2{ font-family:'Manrope','Inter',sans-serif; font-size:34px; font-weight:800; line-height:1.18; letter-spacing:-.6px; margin:0 0 16px; }
body.page-login-app .auth-brand .sub{ color:#cfd4dc; font-size:15px; line-height:1.6; margin:0 0 36px; }
body.page-login-app .auth-feat{ display:flex; align-items:center; gap:13px; color:#e3e6ea; font-size:14.5px; font-weight:500; margin-bottom:16px; }
body.page-login-app .auth-feat i{ width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(34,202,92,.16);color:#4ade80; font-size:16px; flex-shrink:0; }
/* Form paneli */
body.page-login-app .auth-form{ display:grid; place-items:center; padding:40px 24px; background:#fafafa; }
body.page-login-app .auth-card{ width:100%; max-width:412px; }
body.page-login-app .auth-logo-m{ display:none; }
body.page-login-app .auth-card h1{ font-family:'Manrope','Inter',sans-serif; font-size:25px; font-weight:800; letter-spacing:-.5px; margin:0 0 5px; }
body.page-login-app .auth-card .lead{ color:var(--muted); font-size:14px; margin:0 0 26px; }
body.page-login-app .seg{ display:flex; gap:4px; background:#f0f0f0; padding:5px; border-radius:13px; margin-bottom:24px; }
body.page-login-app .seg a{ flex:1; text-align:center; padding:9px 0; border-radius:9px; font-weight:600; font-size:14px; color:var(--muted); transition:.15s; text-decoration:none;}
body.page-login-app .seg a.active{ background:#171717; color:#fff; box-shadow:0 2px 8px -2px rgba(23,23,23,.22); }
body.page-login-app .fld{ margin-bottom:16px; }
body.page-login-app .fld label{ display:block; font-size:12.5px; font-weight:600; color:var(--soft); margin-bottom:6px; }
body.page-login-app .form-control{ width:100%; min-height:46px; border-radius:11px; border:1.5px solid var(--border); padding:11px 14px; font-size:14px; transition:.15s; }
body.page-login-app .form-control::placeholder{ color:var(--faint); }
body.page-login-app .form-control:focus{ border-color:var(--green2); box-shadow:0 0 0 4px rgba(34,202,92,.18); outline:0; }
body.page-login-app .btn-primary{ width:100%; min-height:48px; background:#171717; border:0; border-radius:12px; color:#fff; font-weight:700; font-size:15px; transition:background-color .15s; cursor:pointer; }
body.page-login-app .btn-primary:hover{ background:#000; }
body.page-login-app .link-muted{ color:var(--green-ink); font-weight:600; cursor:pointer; }
body.page-login-app .alert{ border-radius:11px; }
@media (max-width:900px){
body.page-login-app .auth-wrap{ grid-template-columns:1fr; }
body.page-login-app .auth-brand{ display:none; }
body.page-login-app .auth-form{ min-height:100vh; align-items:flex-start; padding-top:56px; }
body.page-login-app .auth-logo-m{ display:flex; align-items:center; gap:10px; font-family:'Manrope','Inter',sans-serif; font-weight:800; font-size:22px; color:var(--ink); margin-bottom:24px; }
body.page-login-app .auth-logo-m i{ background:linear-gradient(135deg,var(--green2),var(--green)); width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:19px; }}


/* ===================== Standalone: staff/login ===================== */

body.page-login-staff{ --p:#6366f1; --p2:#8b5cf6; --ink:#0f172a; --muted:#64748b; --faint:#94a3b8; --border:#e3e7f1; }
body.page-login-staff *{ font-family:'Inter',system-ui,sans-serif; box-sizing:border-box; }
body.page-login-staff{ min-height:100vh; margin:0; color:var(--ink); background:#060912; -webkit-font-smoothing:antialiased; }
body.page-login-staff .auth-wrap{ min-height:100vh; display:grid; grid-template-columns:1.05fr .95fr; }
/* Marka vitrin paneli (yönetim) */
body.page-login-staff .auth-brand{ position:relative; overflow:hidden; padding:56px; color:#fff; display:flex; flex-direction:column;
            background:radial-gradient(900px 500px at 12% 0%, #1e293b, transparent), radial-gradient(900px 600px at 100% 100%, #312e81, transparent), #060912; }
body.page-login-staff .auth-brand::after{ content:''; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px); background-size:22px 22px; opacity:.5; pointer-events:none; }
body.page-login-staff .auth-brand .inner{ position:relative; z-index:1; margin:auto 0; max-width:440px; }
body.page-login-staff .auth-logo{ display:flex; align-items:center; gap:12px; font-weight:800; font-size:24px; letter-spacing:-.5px; margin-bottom:42px; }
body.page-login-staff .auth-logo i{ background:linear-gradient(135deg,var(--p),var(--p2)); width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:22px; box-shadow:0 12px 28px -8px rgba(99,102,241,.7); }
body.page-login-staff .auth-logo .tag{ font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#a5b4fc; background:rgba(99,102,241,.16); border:1px solid rgba(99,102,241,.35); padding:3px 9px; border-radius:999px; }
body.page-login-staff .auth-brand h2{ font-size:32px; font-weight:800; line-height:1.18; letter-spacing:-.6px; margin:0 0 16px; }
body.page-login-staff .auth-brand .sub{ color:#9aa6c4; font-size:15px; line-height:1.6; margin:0 0 36px; }
body.page-login-staff .auth-feat{ display:flex; align-items:center; gap:13px; color:#c6cee6; font-size:14.5px; font-weight:500; margin-bottom:16px; }
body.page-login-staff .auth-feat i{ width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.07);color:#a5b4fc; font-size:16px; flex-shrink:0; }
/* Form paneli */
body.page-login-staff .auth-form{ display:grid; place-items:center; padding:40px 24px; background:#f7f8fc; }
body.page-login-staff .auth-card{ width:100%; max-width:400px; }
body.page-login-staff .auth-logo-m{ display:none; }
body.page-login-staff .auth-card h1{ font-size:25px; font-weight:800; letter-spacing:-.5px; margin:0 0 5px; }
body.page-login-staff .auth-card .lead{ color:var(--muted); font-size:14px; margin:0 0 26px; }
body.page-login-staff .fld{ margin-bottom:16px; }
body.page-login-staff .fld label{ display:block; font-size:12.5px; font-weight:600; color:#334155; margin-bottom:6px; }
body.page-login-staff .form-control{ width:100%; min-height:46px; border-radius:11px; border:1.5px solid var(--border); padding:11px 14px; font-size:14px; transition:.15s; }
body.page-login-staff .form-control::placeholder{ color:var(--faint); }
body.page-login-staff .form-control:focus{ border-color:var(--p); box-shadow:0 0 0 4px rgba(99,102,241,.15); outline:0; }
body.page-login-staff .btn-primary{ width:100%; min-height:48px; background:var(--p); border:0; border-radius:12px; color:#fff; font-weight:700; font-size:15px; transition:background-color .15s; cursor:pointer; }
body.page-login-staff .btn-primary:hover{ background:#4f46e5; }
body.page-login-staff .link-muted{ color:var(--p); font-weight:600; cursor:pointer; }
body.page-login-staff .alert{ border-radius:11px; }
@media (max-width:900px){
body.page-login-staff .auth-wrap{ grid-template-columns:1fr; }
body.page-login-staff .auth-brand{ display:none; }
body.page-login-staff .auth-form{ min-height:100vh; align-items:flex-start; padding-top:64px; }
body.page-login-staff .auth-logo-m{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:22px; color:var(--ink); margin-bottom:24px; }
body.page-login-staff .auth-logo-m i{ background:linear-gradient(135deg,var(--p),var(--p2)); width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:19px; }}


/* ===================== Standalone: verify-email ===================== */
/* SEOmonitor kimliği: siyah ink + yeşil aksan */
body.page-verify *{ font-family:'Inter',sans-serif; }
body.page-verify{ min-height:100vh; margin:0; display:grid; place-items:center;
            background:radial-gradient(1100px 600px at 8% -8%, rgba(34,202,92,.28), transparent), radial-gradient(950px 520px at 108% 110%, rgba(27,168,77,.24), transparent), #171717; padding:20px; }
body.page-verify .auth{ width:100%; max-width:420px; }
body.page-verify .auth .brand{ color:#fff; font-family:'Manrope','Inter',sans-serif; font-weight:800; font-size:26px; text-align:center; margin-bottom:22px; letter-spacing:-.5px; }
body.page-verify .auth .brand i{ background:linear-gradient(135deg,#22ca5c,#1ba84d); width:42px;height:42px;border-radius:11px;display:inline-grid;place-items:center;vertical-align:middle;margin-right:8px; }
body.page-verify .card{ border:0; border-radius:20px; box-shadow:0 30px 60px -20px rgba(0,0,0,.5); }
body.page-verify .btn-primary{ background:#171717; border:0; font-weight:700; border-radius:10px; }
body.page-verify .btn-primary:hover, body.page-verify .btn-primary:focus, body.page-verify .btn-primary:active{ background:#000; border-color:#000; }
body.page-verify .ic{ width:64px;height:64px;border-radius:16px;display:grid;place-items:center;font-size:32px;margin:0 auto 14px; }


/* ===================== Standalone: reset-password ===================== */
/* SEOmonitor kimliği: siyah ink + yeşil aksan */
body.page-reset *{ font-family:'Inter',sans-serif; }
body.page-reset{ min-height:100vh; margin:0; display:grid; place-items:center;
            background:radial-gradient(1100px 600px at 8% -8%, rgba(34,202,92,.28), transparent), radial-gradient(950px 520px at 108% 110%, rgba(27,168,77,.24), transparent), #171717; padding:20px; }
body.page-reset .auth{ width:100%; max-width:420px; }
body.page-reset .auth .brand{ color:#fff; font-family:'Manrope','Inter',sans-serif; font-weight:800; font-size:26px; text-align:center; margin-bottom:22px; letter-spacing:-.5px; }
body.page-reset .auth .brand i{ background:linear-gradient(135deg,#22ca5c,#1ba84d); width:42px;height:42px;border-radius:11px;display:inline-grid;place-items:center;vertical-align:middle;margin-right:8px; }
body.page-reset .card{ border:0; border-radius:20px; box-shadow:0 30px 60px -20px rgba(0,0,0,.5); }
body.page-reset .btn-primary{ background:#171717; border:0; font-weight:700; border-radius:10px; }
body.page-reset .btn-primary:hover, body.page-reset .btn-primary:focus, body.page-reset .btn-primary:active{ background:#000; border-color:#000; }
body.page-reset .form-control{ border-radius:10px; padding:11px 13px; }
body.page-reset .form-control:focus{ border-color:#22ca5c; box-shadow:0 0 0 3px rgba(34,202,92,.18); }
body.page-reset a{ color:#16a34a; }


/* ===================== Standalone: landing ===================== */

body.page-landing *{ font-family:'Inter',system-ui,sans-serif; }
body.page-landing{
            --p:#6366f1; --p2:#8b5cf6; --ink:#1e293b; --muted:#64748b; --bd:#e6e9f2;
            --soft:#f7f8fc; --navy:#0b1224; --ok:#10b981;
        }
body.page-landing{ margin:0; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased; }
body.page-landing a{ text-decoration:none; }
body.page-landing .wrap{ max-width:1120px; margin:0 auto; padding:0 20px; }
body.page-landing .eyebrow{ display:inline-block; color:var(--p); font-weight:700; font-size:13px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:12px; }
/* Topbar */
body.page-landing header.top{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.85); backdrop-filter:saturate(180%) blur(12px); border-bottom:1px solid var(--bd); }
body.page-landing .nav{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; }
body.page-landing .brand{ font-weight:800; font-size:21px; letter-spacing:-.5px; color:var(--ink); display:flex; align-items:center; gap:10px; }
body.page-landing .brand i{ background:linear-gradient(135deg,var(--p),var(--p2)); width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:#fff;font-size:19px; }
body.page-landing .nav .links{ display:flex; align-items:center; }
body.page-landing .nav .links a{ color:var(--muted); font-weight:600; margin-left:24px; font-size:14px; }
body.page-landing .nav .links a:hover{ color:var(--p); }
body.page-landing .nav .links a.btn-p, body.page-landing .nav .links a.btn-p:hover{ color:#fff; }
body.page-landing .btn-p{ background:linear-gradient(135deg,var(--p),var(--p2)); color:#fff; padding:10px 20px; border-radius:11px; font-weight:600; display:inline-block; box-shadow:0 10px 22px -10px rgba(99,102,241,.7); border:0; cursor:pointer; }
body.page-landing .btn-p:hover{ filter:brightness(1.07); color:#fff; }
body.page-landing .btn-o{ border:1px solid var(--bd); color:var(--ink); padding:10px 20px; border-radius:11px; font-weight:600; display:inline-block; background:#fff; }
body.page-landing .btn-o:hover{ border-color:var(--p); color:var(--p); }
/* Announcement */
body.page-landing .ann{ background:linear-gradient(135deg,var(--p),var(--p2)); color:#fff; text-align:center; font-size:13.5px; font-weight:600; padding:9px 16px; }
body.page-landing .ann a{ color:#fff; text-decoration:underline; }
/* Hero */
body.page-landing .hero{ background:radial-gradient(1100px 520px at 50% -10%, #ede9fe, transparent); padding:62px 0 30px; text-align:center; }
body.page-landing .hero .pill{ display:inline-block; background:#f1f0ff; color:var(--p); font-weight:600; font-size:13px; padding:6px 14px; border-radius:999px; margin-bottom:20px; }
body.page-landing .hero h1{ font-size:48px; font-weight:900; letter-spacing:-1.6px; line-height:1.07; margin:0 0 18px; }
body.page-landing .hero h1 .g{ background:linear-gradient(135deg,var(--p),var(--p2)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
body.page-landing .hero p.lead{ font-size:18px; color:var(--muted); max-width:700px; margin:0 auto 28px; line-height:1.6; }
body.page-landing .hero .cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
body.page-landing .hero .micro{ color:var(--muted); font-size:13px; margin-top:16px; }
body.page-landing .hero .micro i{ color:var(--ok); }
/* Dashboard mockup under hero */
body.page-landing .shot{ max-width:980px; margin:42px auto 0; border-radius:18px; border:1px solid var(--bd); background:#fff; box-shadow:0 40px 80px -40px rgba(16,24,40,.4); overflow:hidden; }
body.page-landing .shot .bar{ display:flex; gap:7px; padding:13px 16px; border-bottom:1px solid var(--bd); background:var(--soft); }
body.page-landing .shot .bar span{ width:11px;height:11px;border-radius:50%; background:#cdd3e3; }
body.page-landing .shot .bd{ padding:22px; display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
body.page-landing .kpi{ border:1px solid var(--bd); border-radius:13px; padding:15px; text-align:left; }
body.page-landing .kpi .l{ font-size:12px; color:var(--muted); font-weight:600; }
body.page-landing .kpi .v{ font-size:26px; font-weight:800; letter-spacing:-.5px; margin-top:4px; }
body.page-landing .kpi .d{ font-size:12px; font-weight:700; margin-top:2px; }
body.page-landing .kpi .up{ color:var(--ok); }
body.page-landing .kpi .dn{ color:#ef4444; }
body.page-landing .shot .chart{ grid-column:1/-1; height:120px; border:1px solid var(--bd); border-radius:13px; padding:14px; display:flex; align-items:flex-end; gap:8px; }
body.page-landing .shot .chart i{ flex:1; background:linear-gradient(180deg,var(--p),var(--p2)); border-radius:6px 6px 0 0; opacity:.85; }
/* Logo / trust strip */
body.page-landing .trust{ padding:30px 0 8px; text-align:center; }
body.page-landing .trust .t{ color:var(--muted); font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; margin-bottom:16px; }
body.page-landing .trust .stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; max-width:840px; margin:0 auto; }
body.page-landing .trust .stats .s .n{ font-size:30px; font-weight:900; letter-spacing:-1px; background:linear-gradient(135deg,var(--p),var(--p2)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
body.page-landing .trust .stats .s .c{ color:var(--muted); font-size:13.5px; font-weight:600; margin-top:2px; }
/* Sections */
body.page-landing section{ padding:64px 0; }
body.page-landing .sec-h{ text-align:center; margin-bottom:46px; }
body.page-landing .sec-h h2{ font-size:34px; font-weight:800; letter-spacing:-.9px; margin:0 0 12px; }
body.page-landing .sec-h p{ color:var(--muted); font-size:16.5px; max-width:600px; margin:0 auto; line-height:1.6; }
/* Problem / contrast */
body.page-landing .prob{ background:var(--soft); }
body.page-landing .twin{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
body.page-landing .card-x{ border-radius:18px; padding:30px; }
body.page-landing .card-x h3{ font-size:18px; font-weight:800; margin:0 0 16px; display:flex; align-items:center; gap:9px; }
body.page-landing .card-x ul{ margin:0; padding:0; list-style:none; }
body.page-landing .card-x li{ display:flex; gap:10px; align-items:flex-start; font-size:14.5px; line-height:1.5; margin-bottom:11px; color:var(--muted); }
body.page-landing .bad{ background:#fff; border:1px solid var(--bd); }
body.page-landing .bad h3{ color:#ef4444; }
body.page-landing .bad li i{ color:#ef4444; }
body.page-landing .good{ background:var(--navy); }
body.page-landing .good h3{ color:#fff; }
body.page-landing .good li{ color:#cbd5e1; }
body.page-landing .good li i{ color:#34d399; }
/* 3 pillars */
body.page-landing .pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
body.page-landing .pillar{ text-align:center; padding:14px; }
body.page-landing .pillar .ic{ width:56px;height:56px;border-radius:15px;display:grid;place-items:center;font-size:26px;color:#fff;margin:0 auto 16px;background:linear-gradient(135deg,var(--p),var(--p2)); }
body.page-landing .pillar h3{ font-size:18px; font-weight:800; margin:0 0 8px; }
body.page-landing .pillar p{ color:var(--muted); font-size:14.5px; line-height:1.6; margin:0; }
/* Feature grid */
body.page-landing .grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
body.page-landing .feat{ border:1px solid var(--bd); border-radius:18px; padding:26px; background:#fff; transition:.18s; }
body.page-landing .feat:hover{ box-shadow:0 18px 40px -22px rgba(16,24,40,.25); transform:translateY(-3px); }
body.page-landing .feat .ic{ width:48px;height:48px;border-radius:13px; display:grid;place-items:center; font-size:23px; color:#fff; margin-bottom:16px; }
body.page-landing .feat h3{ font-size:17px; font-weight:700; margin:0 0 8px; }
body.page-landing .feat p{ color:var(--muted); font-size:14px; line-height:1.6; margin:0; }
body.page-landing .g1{background:linear-gradient(135deg,#6366f1,#8b5cf6);}
body.page-landing .g2{background:linear-gradient(135deg,#10b981,#059669);}
body.page-landing .g3{background:linear-gradient(135deg,#f59e0b,#d97706);}
body.page-landing .g4{background:linear-gradient(135deg,#3b82f6,#2563eb);}
body.page-landing .g5{background:linear-gradient(135deg,#ec4899,#db2777);}
body.page-landing .g6{background:linear-gradient(135deg,#06b6d4,#0891b2);}
body.page-landing .g7{background:linear-gradient(135deg,#8b5cf6,#6d28d9);}
body.page-landing .g8{background:linear-gradient(135deg,#14b8a6,#0d9488);}
body.page-landing .g9{background:linear-gradient(135deg,#f43f5e,#e11d48);}
/* Steps */
body.page-landing .steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; counter-reset:s; }
body.page-landing .step{ position:relative; border:1px solid var(--bd); border-radius:18px; padding:26px 22px; }
body.page-landing .step::before{ counter-increment:s; content:"0" counter(s); font-size:38px; font-weight:900; letter-spacing:-1px; background:linear-gradient(135deg,var(--p),var(--p2)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; display:block; margin-bottom:8px; }
body.page-landing .step h3{ font-size:16px; font-weight:800; margin:0 0 8px; }
body.page-landing .step p{ color:var(--muted); font-size:13.5px; line-height:1.6; margin:0; }
/* SoV table */
body.page-landing .sov{ border:1px solid var(--bd); border-radius:18px; overflow:hidden; max-width:880px; margin:0 auto; box-shadow:0 30px 60px -40px rgba(16,24,40,.3); }
body.page-landing .sov table{ width:100%; border-collapse:collapse; font-size:14.5px; }
body.page-landing .sov th{ background:var(--soft); text-align:left; padding:14px 18px; font-weight:700; color:var(--muted); font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; }
body.page-landing .sov td{ padding:14px 18px; border-top:1px solid var(--bd); }
body.page-landing .sov tr.us{ background:#f5f4ff; }
body.page-landing .sov .dom{ font-weight:700; }
body.page-landing .sov .tag{ font-size:11px; font-weight:700; color:var(--p); background:#ece9ff; padding:2px 8px; border-radius:999px; margin-left:8px; }
body.page-landing .sov .barc{ background:#eef0f6; border-radius:999px; height:9px; overflow:hidden; min-width:90px; }
body.page-landing .sov .barc i{ display:block; height:100%; background:linear-gradient(90deg,var(--p),var(--p2)); }
body.page-landing .sov .up{ color:var(--ok); font-weight:700; }
body.page-landing .sov .dn{ color:#ef4444; font-weight:700; }
/* Economics / why split */
body.page-landing .why{ background:var(--navy); color:#cbd5e1; }
body.page-landing .why .sec-h h2{ color:#fff; }
body.page-landing .why .sec-h p{ color:#94a3b8; }
body.page-landing .why .grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
body.page-landing .why .wc{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:28px; }
body.page-landing .why .wc i{ font-size:26px; color:#a5b4fc; }
body.page-landing .why .wc h3{ color:#fff; font-size:17px; font-weight:800; margin:14px 0 8px; }
body.page-landing .why .wc p{ font-size:14px; line-height:1.6; margin:0; color:#94a3b8; }
/* FAQ */
body.page-landing .faq{ max-width:780px; margin:0 auto; }
body.page-landing .faq details{ border:1px solid var(--bd); border-radius:14px; padding:0; margin-bottom:12px; background:#fff; overflow:hidden; }
body.page-landing .faq summary{ list-style:none; cursor:pointer; padding:18px 22px; font-weight:700; font-size:15.5px; display:flex; justify-content:space-between; align-items:center; gap:14px; }
body.page-landing .faq summary::-webkit-details-marker{ display:none; }
body.page-landing .faq summary i{ transition:.2s; color:var(--p); }
body.page-landing .faq details[open] summary i{ transform:rotate(45deg); }
body.page-landing .faq .a{ padding:0 22px 20px; color:var(--muted); font-size:14.5px; line-height:1.65; }
/* Final CTA */
body.page-landing .final{ text-align:center; }
body.page-landing .final .box{ background:linear-gradient(135deg,var(--p),var(--p2)); border-radius:26px; padding:56px 30px; color:#fff; box-shadow:0 40px 80px -40px rgba(99,102,241,.8); }
body.page-landing .final h2{ font-size:34px; font-weight:900; letter-spacing:-1px; margin:0 0 14px; }
body.page-landing .final p{ font-size:17px; opacity:.92; max-width:560px; margin:0 auto 28px; line-height:1.6; }
body.page-landing .final .btn-w{ background:#fff; color:var(--p); padding:14px 30px; border-radius:13px; font-weight:700; display:inline-block; font-size:16px; }
body.page-landing .final .btn-w:hover{ filter:brightness(.97); color:var(--p); }
body.page-landing .final .micro{ font-size:13px; opacity:.85; margin-top:16px; }
/* Footer */
body.page-landing footer{ border-top:1px solid var(--bd); padding:54px 0 30px; color:var(--muted); font-size:14px; }
body.page-landing footer .cols{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:30px; margin-bottom:36px; }
body.page-landing footer .cols h4{ font-size:12.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink); font-weight:700; margin:0 0 14px; }
body.page-landing footer .cols a{ color:var(--muted); display:block; margin-bottom:9px; font-weight:500; }
body.page-landing footer .cols a:hover{ color:var(--p); }
body.page-landing footer .cols p{ font-size:13.5px; line-height:1.6; margin:12px 0 0; max-width:280px; }
body.page-landing footer .row2{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; border-top:1px solid var(--bd); padding-top:22px; }
@media (max-width:860px){
body.page-landing .grid, body.page-landing .pillars, body.page-landing .steps, body.page-landing .twin, body.page-landing .why .grid3, body.page-landing .shot .bd{ grid-template-columns:1fr; }
body.page-landing footer .cols{ grid-template-columns:1fr 1fr; }
body.page-landing .trust .stats{ grid-template-columns:1fr 1fr; }
body.page-landing .hero h1{ font-size:34px; }
body.page-landing .sec-h h2{ font-size:27px; }
body.page-landing .nav .links a:not(.btn-p){ display:none; }}


/* ===================== Standalone: legal ===================== */

body.page-legal *{ font-family:'Inter',system-ui,sans-serif; box-sizing:border-box; }
body.page-legal{ --p:#6366f1; --p2:#8b5cf6; --ink:#1e293b; --muted:#64748b; --bd:#e6e9f2; }
body.page-legal{ margin:0; color:var(--ink); background:#fff; line-height:1.7; }
body.page-legal a{ color:var(--p); text-decoration:none; }
body.page-legal a:hover{ text-decoration:underline; }
body.page-legal .wrap{ max-width:780px; margin:0 auto; padding:0 20px; }
body.page-legal header{ border-bottom:1px solid var(--bd); }
body.page-legal .nav{ display:flex; align-items:center; justify-content:space-between; padding:18px 0; }
body.page-legal .brand{ font-weight:800; font-size:20px; letter-spacing:-.5px; color:var(--ink); display:flex; align-items:center; gap:10px; }
body.page-legal .brand i{ background:linear-gradient(135deg,var(--p),var(--p2)); width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff;font-size:18px; }
body.page-legal .nav a.back{ color:var(--muted); font-weight:600; font-size:14px; }
body.page-legal main{ padding:48px 0 64px; }
body.page-legal h1{ font-size:34px; font-weight:800; letter-spacing:-1px; margin:0 0 6px; }
body.page-legal .upd{ color:var(--muted); font-size:14px; margin-bottom:36px; }
body.page-legal h2{ font-size:20px; font-weight:700; margin:34px 0 12px; letter-spacing:-.3px; }
body.page-legal p, body.page-legal li{ color:#334155; font-size:15.5px; }
body.page-legal ul{ padding-left:22px; }
body.page-legal li{ margin-bottom:6px; }
body.page-legal .box{ background:#f8fafc; border:1px solid var(--bd); border-radius:14px; padding:18px 20px; margin:18px 0; }
body.page-legal footer{ border-top:1px solid var(--bd); padding:26px 0; color:var(--muted); font-size:14px; }
body.page-legal footer a{ margin-left:16px; font-weight:600; }