input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type=number] {
    -moz-appearance: textfield;
}
:root {
    --bg: rgba(10,10,15,.85); --card: #12121a; --card2: #12121a; --border: #1e1e2e; --text: #e0e0e0;
    --muted: #777; --green: #4ade80; --red: #f87171; --yellow: #facc15;
    --blue: #60a5fa; --purple: #c084fc; --orange: #fb923c; --cyan: #22d3ee; --gold: #ffd700;
    --theme-bg: var(--card); --theme-text-primary: var(--text); --theme-text-secondary: var(--muted);
    --theme-border: 1px solid var(--border); --theme-border-radius: 10px;
    --theme-shadow: none; --theme-glow: none;
}

/* ===== THEME: LIGHT ===== */
.theme-light {
    --bg: #f5f7fa; --card: #ffffff; --card2: #f0f2f5; --border: #e2e8f0; --text: #1a1a2e;
    --muted: #64748b; --green: #22c55e; --red: #ef4444; --yellow: #eab308;
    --blue: #3b82f6; --purple: #a855f7; --orange: #f97316; --cyan: #06b6d4;
    --theme-bg: #ffffff; --theme-text-primary: #1a1a2e; --theme-text-secondary: #64748b;
    --theme-border: 1px solid #e2e8f0; --theme-border-radius: 10px;
    --theme-shadow: 0 2px 12px rgba(0,0,0,0.08); --theme-glow: none;
}

/* ===== THEME: NEON ===== */
.theme-neon {
    --bg: #0a0a0f; --card: #12121a; --card2: #12121a; --border: #2e2e4e; --text: #e0e0e0;
    --muted: #888; --green: #39ff14; --red: #ff073a; --yellow: #f0f;
    --blue: #00d4ff; --purple: #bc13fe; --orange: #ff5e00; --cyan: #00fff2;
    --theme-bg: var(--card); --theme-text-primary: var(--text); --theme-text-secondary: var(--muted);
    --theme-border: 1px solid #2e2e4e; --theme-border-radius: 10px;
    --theme-shadow: 0 0 15px rgba(0,212,255,0.15); --theme-glow: 0 0 8px rgba(0,212,255,0.3);
}

/* ===== THEME: SOLARIZED ===== */
.theme-solarized {
    --bg: #002b36; --card: #073642; --card2: #073642; --border: #586e75; --text: #eee8d5;
    --muted: #839496; --green: #859900; --red: #dc322f; --yellow: #b58900;
    --blue: #268bd2; --purple: #d33682; --orange: #cb4b16; --cyan: #2aa198;
    --theme-bg: var(--card); --theme-text-primary: var(--text); --theme-text-secondary: var(--muted);
    --theme-border: 1px solid #586e75; --theme-border-radius: 10px;
    --theme-shadow: none; --theme-glow: none;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter','Segoe UI',system-ui,sans-serif;background:#0b0d17;color:var(--text);line-height:1.5;min-height:100vh}

/* Top Nav */
.topnav{background:var(--card);border-bottom:1px solid var(--border);padding:0 20px;display:flex;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:100;backdrop-filter:none;gap:0;height:84px;min-height:84px}
/* Mobile menu toggle hidden by default */
.topnav-brand{font-size:12.5px;font-weight:700;color:var(--green);margin-right:16px;white-space:nowrap;line-height:84px;height:84px;letter-spacing:0.5px}
.topnav-links{display:flex;gap:0;flex-wrap:wrap}
.topnav-link{display:flex;align-items:center;gap:4px;padding:0 12px;height:48px;border:none;background:transparent;color:var(--muted);font-size:15.5px;font-weight:700;text-transform:uppercase;cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent;transition:all .15s;font-family:inherit}
.topnav-link:hover{color:var(--text);background:rgba(255,255,255,.03)}
.topnav-link.active{color:var(--green);border-bottom-color:var(--green)}
.topnav-dropdown-item{padding:10px 16px;cursor:pointer;color:var(--text);font-size:15.5px;font-weight:700;transition:background .15s;text-transform:uppercase;letter-spacing:0.5px}
.topnav-dropdown-item:hover{background:rgba(255,255,255,.06)}
.topnav-link .badge{background:rgba(74,222,128,.15);color:var(--green);font-size:11px;padding:2px 6px;border-radius:8px;font-weight:600}
.topnav-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.topnav-user{font-size:12.5px;color:var(--muted)}
.btn-logout{padding:6px 14px;border:1px solid var(--border);background:transparent;color:var(--muted);border-radius:6px;cursor:pointer;font-size:12.5px;font-family:inherit}
.btn-logout:hover{border-color:var(--red);color:var(--red)}
.menu-toggle{display:block;background:transparent;border:none;color:var(--text);font-size:22px;cursor:pointer;padding:6px 10px}
@media(min-width:769px){
    .menu-toggle{display:none}
}
.dropdown-blur{background:rgba(18,18,26,.75);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

@media(max-width:768px){
    /* Navigation */
    .topnav-links{display:none;position:absolute;top:84px;left:0;right:0;background:var(--card);flex-direction:column;border-bottom:1px solid var(--border);height:auto;padding:8px 0;z-index:99}
    .topnav-links.open{display:flex;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:rgba(18,18,26,0.5)}
    .topnav-link{height:48px;border-bottom:none;border-left:3px solid transparent;padding:0 20px;font-size:15.5px}
    .topnav-link.active{border-left-color:var(--green);border-bottom:none}
    .menu-toggle{display:block;min-height:44px;min-width:44px}
    

    
    /* Shrink logo on mobile — smaller, tighter */
    .topnav-brand img{height:18px!important;width:auto!important;max-width:110px!important;object-fit:contain}
    .topnav-brand{padding:0!important;margin:0!important;line-height:1!important;height:auto!important;overflow:hidden;max-width:120px}
    .topnav{padding:0 10px!important;height:68px!important;min-height:68px!important}
    /* Hamburger on the right */
    #topnavMenuWrapper{margin-left:auto!important}
    #topnavHamburger{font-size:18px!important;padding:6px!important;min-width:40px;min-height:40px}
    #topnavDropdown{right:0!important;left:auto!important;transform:none!important;top:68px!important;min-width:180px!important}
    #topnavDropdown .topnav-dropdown-item{padding:10px 14px!important;font-size:14px!important}
    
    /* Layout */
    .container{padding:8px}
    .panel{padding:10px;border-radius:8px}
    .panel h2{font-size:15.5px!important;margin-bottom:8px!important}
    section{padding:0!important}
    .panel h2{font-size:18px}
    
    /* Stats */
    .stats-grid{grid-template-columns:repeat(2,1fr)!important;gap:8px}
    .stats-grid .stat-card{padding:12px}
    .stats-grid .stat-value{font-size:18px}
    .stats-grid .stat-label{font-size:11px}
    
    /* Tables */
    .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
    th,td{font-size:12.5px!important;padding:10px 8px!important}
    
    /* Buttons */
    .btn{padding:10px 16px!important;font-size:14px!important;min-height:44px}
    .btn-primary{padding:12px 24px!important;font-size:14px!important}
    .btn-trade{padding:10px 14px!important;font-size:12.5px!important;min-height:44px}
    
    /* Forms */
    .form-group input,.form-group select{font-size:15.5px!important;padding:12px!important;min-height:44px}
    input:focus,select:focus{outline:2px solid var(--blue);outline-offset:2px}
    
    /* Login */
    .login-box{padding:30px 20px;max-width:100%;margin:0 12px}
    .login-input-group input{font-size:15.5px!important;padding:14px 12px!important}
    
    /* Modals */
    .modal-box{padding:20px!important;max-height:80vh!important;overflow-y:auto!important}
    .modal-box h2{font-size:22px!important}
    
    /* Botlog */
    #botLogs{max-height:300px!important;font-size:12.5px!important;overflow-y:auto}
    .log-entry{flex-direction:column!important;gap:6px!important;padding:10px!important;border-left:3px solid var(--border)}
    .log-entry .log-time{min-width:auto!important;font-size:11px}
    .log-entry .log-level{min-width:auto!important;font-size:11px;display:inline-block;padding:2px 8px;border-radius:4px}
    .log-entry .log-cat{min-width:auto!important;font-size:11px}
    .log-entry .log-msg{font-size:12.5px!important;line-height:1.5;margin-top:4px}
    .log-entry button[onclick*="log-msg"]{display:block!important;width:100%;margin-top:8px!important;padding:10px!important;font-size:12.5px!important;background:var(--accent)!important;color:#fff!important;border:none!important;border-radius:6px!important;min-height:44px}
    
    /* Log controls */
    #botLogControls{flex-wrap:wrap;gap:6px}
    #botLogControls button{font-size:12.5px!important;padding:8px 12px!important;min-height:44px}
    
    /* Setup cards */
    .setup-mobile-card{padding:16px!important;margin-bottom:12px}
    .setup-mobile-pair{font-size:15.5px!important}
    .setup-mobile-meta{font-size:14px!important}
    .setup-mobile-level{padding:10px 6px!important}
    .setup-mobile-level .lvl-label{font-size:11px!important}
    .setup-mobile-level .lvl-value{font-size:14px!important}
    
    /* Position cards */
    .pos-mobile-card{padding:14px!important;margin-bottom:10px}
    
    /* Trading bot */
    .trading-bot-grid{grid-template-columns:1fr!important;gap:10px}
    .trading-bot-cell{padding:10px}
    .trading-bot-cell .cell-label{font-size:11px}
    .trading-bot-cell .cell-value,.trading-bot-cell input,.trading-bot-cell select{font-size:14px!important;padding:8px!important}
    
    /* Admin */
    .admin-grid{grid-template-columns:1fr!important}
    .admin-card{padding:14px}
    .admin-stat-grid{grid-template-columns:repeat(2,1fr)!important;gap:8px}
    
    /* General */
    .feature-grid{grid-template-columns:repeat(2,1fr)!important;gap:8px}
    .addons-grid{grid-template-columns:1fr!important}
    .form-row{flex-direction:column;gap:8px}
    .form-row > *{max-width:100%!important}
    
    /* Very small screens */
    @media(max-width:375px){
        .stats-grid{grid-template-columns:1fr!important}
        .setup-mobile-levels{grid-template-columns:repeat(2,1fr)!important}
        .admin-stat-grid{grid-template-columns:1fr!important}
    }
    
    /* Setup Scanner mobile */
    .setup-stats-grid{grid-template-columns:repeat(2,1fr)!important;gap:8px}
    .setup-stats-grid .setup-stat-card{padding:10px}
    .setup-stats-grid .setup-stat-value{font-size:18px}
    .setup-stats-grid .setup-stat-label{font-size:11px}
    .grade-pill-card{padding:6px 10px!important;font-size:12.5px!important;font-weight:700}
    
    /* Positions mobile */
    .pos-table thead{display:none}
    .pos-table tbody tr{display:block;margin-bottom:10px;background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:12px}
    .pos-table tbody td{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--border);font-size:12.5px}
    .pos-table tbody td:last-child{border-bottom:none}
    .pos-table tbody td::before{content:attr(data-label);font-weight:600;color:var(--muted);font-size:11px;text-transform:uppercase}
    
    /* Log viewer mobile */
    #botLogControls{flex-wrap:wrap;gap:6px}
    #botLogControls button{font-size:12.5px!important;padding:8px 12px!important;min-height:44px}
    
    /* Health items */
    .health-item{font-size:12.5px!important;padding:8px 10px!important}
    
    /* Exchange config */
    #exchangeConfigSection > div[style*="grid-template-columns"]{grid-template-columns:1fr!important}
    #exchangeConfigSection input,#exchangeConfigSection select{max-width:100%!important;min-height:44px}
    
    /* Login page mobile */
    .login-container{padding:0 12px}
    .login-logo{width:80px;height:80px}
    .login-title{font-size:22px}
    .login-subtitle{font-size:12.5px}
    .login-features{grid-template-columns:1fr!important;gap:8px}
    .login-feature-card{padding:10px}
    .login-input-group input{font-size:15.5px!important;padding:14px 12px!important;min-height:44px}
    
    /* General mobile fixes */
    .panel{padding:14px}
    .panel h2{font-size:15.5px}
    h2{font-size:18px!important}
    .form-row{flex-direction:column;gap:8px}
    .form-row > *{max-width:100%!important}
    
    /* Mode cards */
    .mode-card{min-width:140px;max-width:100%;padding:12px}
    .addon-card{min-width:0;padding:12px}
    
    /* Dashboard specific */
    #dashStats .stat-card{min-width:0!important;padding:12px}
    #dashMessages{grid-template-columns:1fr!important}
    #dashMessages .stat-card{grid-column:1!important}
    #dashWeeklyBreakdown .weekly-bar-label{font-size:11px!important}
    #weeklyBreakdownBody{min-height:80px!important}
    #weeklyBreakdownBody > div > div:nth-child(4){font-size:11px!important}
    #weeklyBreakdownBody > div > div:nth-child(5){font-size:8px!important}
    #weeklyBreakdownBody > div > div:nth-child(6){font-size:7px!important}
    #weeklyPnlLine > div > div:first-child{font-size:5px!important}
    #weeklyPnlLine > div > div:nth-child(2){font-size:7px!important}
    #weeklyPnlLine > div > div:last-child{font-size:5px!important}
    section .panel h2{font-size:18px!important}
    
    /* Trading Monitor mobile */
    #tradingMonitorGrid{grid-template-columns:1fr!important;gap:4px!important;font-size:11px!important}
    #dashTradingMonitor{padding:8px!important}
    /* Table fixes */
    #setups .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;position:relative;max-width:100%}
    #setups table{min-width:auto;width:100%;font-size:11px}
    #setups th,#setups td{padding:6px 4px;font-size:11px}
    #setups section{padding:0 8px}
    #setups .panel{max-width:100%;box-sizing:border-box;overflow:hidden}
    #setups .table-wrap{overflow-x:auto;max-width:100%}
    #setups table{width:100%;table-layout:auto}
    #setups tr:hover td:first-child{border-left:none!important}
    #setups .grade{font-size:11px!important;padding:3px 8px!important}
    #setups .dir-long,#setups .dir-short{font-size:12.5px!important}
    #setups td{font-size:12.5px!important;padding:10px 6px!important}
    
    /* Papertrade panel mobile */
    .papertrade-header{flex-wrap:wrap!important;gap:4px!important;white-space:normal!important}
    .papertrade-header > div:first-child{flex:1 1 100%!important;margin-bottom:2px}
    .papertrade-header > div:last-child{flex:1 1 100%!important;justify-content:flex-start!important}
    #papertradeExchangePanel .panel{padding:10px}
    #papertradeExchangePanel .papertrade-header{font-size:11px!important}
    #papertradeExchangePanel .papertrade-header span{font-size:11px!important}
    #papertradeExchangePanel .papertrade-header span:first-child{font-size:12.5px!important}
    #papertradeExchangePanel .papertrade-header .paper-badge{font-size:8px!important;padding:1px 4px!important}
    #papertradeExchangePanel input,
    #papertradeExchangePanel select{padding:8px 6px!important;font-size:12.5px!important;min-height:40px}
    #papertradeExchangePanel label{font-size:11px!important}
    /* Core Settings: 2 cols on small screens */
    #papertradeExchangePanel > div:first-of-type > div:nth-child(2){grid-template-columns:1fr 1fr!important}
    /* Filters & Execution: stack vertically */
    #papertradeExchangePanel > div:nth-of-type(2){grid-template-columns:1fr!important}
    .paper-exec-grid{grid-template-columns:1fr!important}
    /* Advanced: 1 col */
    .paper-advanced-grid{grid-template-columns:1fr!important}
    #papertradeExchangePanel .addon-toggle{font-size:11px!important;padding:6px 8px!important;min-height:36px}
    #papertradeExchangePanel #btnEngagePaper{width:100%!important;margin-left:0!important;margin-top:8px}
    #paperSaveToast{bottom:12px!important;right:12px!important;font-size:12.5px!important;padding:8px 14px!important}
    
    /* Live exchange panels mobile */
    #binanceTradePanel > div[style*="grid-template-columns:repeat(4"],
    #krakenTradePanel > div[style*="grid-template-columns:repeat(4"]{grid-template-columns:1fr 1fr!important}
    #binanceTradePanel > div[style*="grid-template-columns:repeat(3"],
    #krakenTradePanel > div[style*="grid-template-columns:repeat(3"]{grid-template-columns:1fr!important}
    #binanceTradePanel input,
    #binanceTradePanel select,
    #krakenTradePanel input,
    #krakenTradePanel select{padding:8px 6px!important;font-size:12.5px!important;min-height:40px}
    
    /* Mode selector mobile */
    #botMode{width:100%!important;margin-top:4px}
    #liveExchangesContainer > div:first-child{flex-wrap:wrap!important}
    #liveExchangesContainer > div:first-child > span:last-child{width:100%;margin-top:4px;text-align:right}
    
    /* Exchange config panels mobile */
    #exchangeConfigSection > div[style*="grid-template-columns"],
    #krakenConfigSection > div[style*="grid-template-columns"]{grid-template-columns:1fr!important}
    
    /* Clock in topnav */
    #topnavClock{font-size:12.5px!important;font-weight:700!important;margin-right:8px!important;color:var(--yellow)!important;text-shadow:0 0 8px rgba(250,204,21,0.4)!important}
    
    /* General mobile cleanliness */
    body{font-size:14px!important}
    h2{font-size:15.5px!important;margin-bottom:10px!important}
    h3{font-size:14px!important}
    p,span,label{font-size:12.5px!important}
    .btn{font-size:12.5px!important;padding:8px 12px!important;min-height:40px}
    .btn-primary{font-size:12.5px!important;padding:10px 16px!important}
    input,select{font-size:14px!important;padding:8px!important;min-height:40px}
    .stats-grid{gap:6px!important}
    .stats-grid .stat-card{padding:10px!important;border-radius:8px!important}
    .stats-grid .stat-value{font-size:15.5px!important}
    .stats-grid .stat-label{font-size:11px!important}
    .tier-badge{font-size:11px!important;padding:2px 6px!important}
    .phase-indicator{font-size:11px!important}
    
    /* Reduce gaps and margins globally on mobile */
    .container > * + *{margin-top:8px!important}
    .panel + .panel{margin-top:8px!important}
    
    /* Fix tables on very small screens */
    .table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
    table{font-size:12.5px!important}
    th,td{padding:8px 6px!important;white-space:nowrap}
    
    /* Trading control bar */
    .trading-control-bar{padding:10px!important;gap:8px!important;margin-bottom:10px!important}
    .trading-control-btn{min-width:0!important;font-size:12.5px!important;padding:8px 12px!important}
    
    /* Dashboard mobile */
    #dashStats .stats-grid{grid-template-columns:repeat(2,1fr)!important}
    #dashMessages .stat-card{padding:10px!important}
    
    /* Setups table mobile */
    #setups table{font-size:11px!important}
    #setups th,#setups td{padding:6px 4px!important}
    #setups .btn-trade{font-size:11px!important;padding:6px 8px!important;min-height:36px}
    
    /* Grade pills mobile */
    .grade-pill{font-size:11px!important;padding:2px 6px!important}
    
    /* Addon toggles */
    .addon-toggle{font-size:11px!important;padding:6px 8px!important;min-height:36px}
    
    /* Position cards */
    .pos-mobile-card{padding:10px!important}
    .pos-mobile-card .pos-pair{font-size:14px!important}
    .pos-mobile-card .pos-pnl{font-size:12.5px!important}
    
    /* Bottom spacing for mobile browsers */
    body{padding-bottom:env(safe-area-inset-bottom, 20px)!important}
    /* Mobile candle width for weekly chart */
    :root{--candle-width:14px!important;--candle-glow:6px!important}
}
    #setups .table-wrap{display:block}
    #setups table{display:table}
    #setups thead{display:table-header-group}
    #setups tbody{display:table-row-group}
    #setupsMobileCards{display:none;width:100%;padding:0 4px}
    .setup-mobile-card{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:10px}
    .setup-mobile-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:8px}
    .setup-mobile-pair{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;flex-shrink:0}
    .setup-mobile-pair .grade{font-size:11px;padding:2px 6px;border-radius:6px}
    .setup-mobile-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
    .setup-mobile-actions .btn-trade{padding:5px 10px;font-size:11px;border-radius:6px}
    .setup-mobile-meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:12px;font-size:12.5px;align-items:center}
    .setup-mobile-meta > span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
    .setup-mobile-meta strong{font-weight:700}
    .setup-mobile-levels{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
    .setup-mobile-level{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;background:var(--bg);border-radius:8px;border:1px solid var(--border);text-align:center}
    .setup-mobile-level .lvl-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600}
    .setup-mobile-level .lvl-value{font-size:12.5px;font-weight:700;white-space:nowrap}
    #setups .table-wrap{display:block}

.container{max-width:1400px;margin:0 auto;padding:16px}
/* Weekly breakdown background — applies to ALL screen sizes */
:root{--candle-bull:#33d685;--candle-bear:#fc6060;--candle-width:18px;--candle-glow:10px}
/* Chart background image removed (session 4): equity curve uses the clean performance-page design */
#dashWeeklyBreakdown{background:none!important;background-image:none!important}
.section{display:none}.section.active{display:block;animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

#abTestPanel{display:none}#abTestPanel.visible{display:block}
.panel{background:var(--theme-bg,var(--card));border:var(--theme-border,1px solid var(--border));border-radius:var(--theme-border-radius,10px);padding:14px;margin-bottom:10px;box-shadow:var(--theme-shadow,none);transition:all .2s ease}
.panel h2{font-size:15.5px;font-weight:600;margin-bottom:16px}
.panel h3{font-size:12.5px;text-transform:uppercase;color:var(--theme-text-secondary,var(--muted));margin-bottom:12px;letter-spacing:.5px}

.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;margin-bottom:12px}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px;text-align:center;display:flex;flex-direction:column;transition:all .2s ease;position:relative;overflow:hidden}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.3)}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:opacity .2s}
.stat-card:hover::before{opacity:.6}
.stat-card.market::before{background:linear-gradient(90deg,transparent,var(--blue),transparent)}
.stat-card.index::before{background:linear-gradient(90deg,transparent,var(--purple),transparent)}
.stat-card.trading::before{background:linear-gradient(90deg,transparent,var(--green),transparent)}
.stat-card.pnl::before{background:linear-gradient(90deg,transparent,var(--cyan),transparent)}
.stat-value{font-size:22px;font-weight:700;font-family:inherit;order:2}
.stat-value.green{color:var(--green)}.stat-value.red{color:var(--red)}.stat-value.blue{color:var(--blue)}.stat-value.purple{color:var(--purple)}.stat-value.yellow{color:var(--yellow)}
.stat-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;order:1;margin-bottom:2px;font-weight:700;white-space:nowrap}
.dash-section-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin:16px 0 8px 4px;display:flex;align-items:center;gap:8px}
.dash-section-label::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}
.stats-grid.market-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.stats-grid.market-grid .stat-label{font-size:10px;letter-spacing:.2px}
.stats-grid.trading-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.stats-grid.pnl-grid{grid-template-columns:repeat(3,1fr);gap:4px}
.stat-card.pnl{padding:8px 6px}
.stat-card.pnl .stat-value{font-size:18px}
.stat-card.pnl .stat-label{font-size:11px}
.stat-card.market{border-color:rgba(96,165,250,.2)}
.stat-card.market:hover{border-color:rgba(96,165,250,.5);box-shadow:0 4px 16px rgba(96,165,250,.1)}
.stat-card.trading{border-color:rgba(74,222,128,.2)}
.stat-card.trading:hover{border-color:rgba(74,222,128,.5);box-shadow:0 4px 16px rgba(74,222,128,.1)}
.stat-card.pnl{border-color:rgba(34,211,238,.2)}
.stat-card.pnl:hover{border-color:rgba(34,211,238,.5);box-shadow:0 4px 16px rgba(34,211,238,.1)}

/* Trading Bot Card Magic */
.trading-bot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px;background:var(--card);border:1px solid var(--border);border-radius:10px;margin-bottom:6px}
.trading-bot-cell{background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:8px;text-align:center;transition:all .2s ease;position:relative;overflow:hidden}
.trading-bot-cell:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.2)}
.trading-bot-cell::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:opacity .2s}
.trading-bot-cell:hover::before{opacity:.5}
.trading-bot-cell.settings::before{background:linear-gradient(90deg,transparent,var(--blue),transparent)}
.trading-bot-cell.settings:hover{border-color:rgba(96,165,250,.3)}
.trading-bot-cell.money::before{background:linear-gradient(90deg,transparent,var(--green),transparent)}
.trading-bot-cell.money:hover{border-color:rgba(74,222,128,.3)}
.trading-bot-cell .cell-label{font-size:11px;font-weight:700;color:var(--muted);display:block;margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px;text-align:center}
.trading-bot-cell .cell-value{font-size:15.5px;font-weight:700;color:var(--text);text-align:center}
.trading-bot-cell input,.trading-bot-cell select{width:100%;padding:6px 8px;background:var(--bg);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:15.5px;font-weight:700;font-family:inherit;box-sizing:border-box;text-align:center;-moz-appearance:textfield}
.trading-bot-cell .notional-value{font-size:15.5px;font-weight:700;color:var(--green);padding:6px 8px;width:100%;box-sizing:border-box;background:var(--bg);border:1px solid var(--border);border-radius:5px;opacity:0.7;cursor:default;user-select:none;text-align:center}
.stat-card.index{border-color:rgba(192,132,252,.2)}
.stat-card.index:hover{border-color:rgba(192,132,252,.5);box-shadow:0 4px 16px rgba(192,132,252,.1)}

/* Tier Badge */
.tier-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:20px;font-size:12.5px;font-weight:600;text-transform:uppercase}
.tier-badge.free{background:rgba(96,165,250,.1);color:var(--blue);border:1px solid rgba(96,165,250,.3)}
.tier-badge.vip{background:rgba(250,204,21,.12);color:#facc15;border:1px solid rgba(250,204,21,.4)}
.tier-badge.monthly{background:rgba(74,222,128,.1);color:var(--green);border:1px solid rgba(74,222,128,.3)}
.tier-badge.yearly{background:rgba(192,132,252,.1);color:var(--purple);border:1px solid rgba(192,132,252,.3)}
.tier-badge.admin{background:rgba(251,146,60,.1);color:var(--orange);border:1px solid rgba(251,146,60,.3)}
.phase-indicator{font-size:11px;color:var(--muted);margin-top:4px}

/* Features List */
.feature-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-top:12px}
.feature-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg);border:1px solid var(--border);border-radius:6px;font-size:12.5px}
.feature-item.unlocked{color:var(--green)}.feature-item.locked{color:var(--muted);opacity:.6}

/* Tables */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:separate;border-spacing:0 4px;font-size:12.5px}
th{text-align:left;padding:10px 12px;color:var(--muted);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid var(--border);white-space:nowrap}
td{padding:12px 12px}
tr{background:var(--card2);border-radius:8px;transition:all .2s ease;position:relative;overflow:hidden}
tr:hover{background:var(--card);box-shadow:0 4px 12px rgba(0,0,0,.2)}
tr::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;opacity:0;transition:opacity .2s}
tr:hover::before{opacity:.4}
tr td:first-child{border-radius:8px 0 0 8px}
tr td:last-child{border-radius:0 8px 8px 0}
tr:hover td:first-child{border-left:2px solid var(--green)}
.grade{display:inline-block;padding:4px 10px;border-radius:6px;font-weight:700;font-size:12.5px;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.grade-a{background:rgba(74,222,128,.2);color:var(--green);border:1px solid rgba(74,222,128,.3)}
.grade-b{background:rgba(96,165,250,.2);color:var(--blue);border:1px solid rgba(96,165,250,.3)}
.grade-c{background:rgba(250,204,21,.2);color:var(--yellow);border:1px solid rgba(250,204,21,.3)}
.grade-d{background:rgba(251,146,60,.2);color:var(--orange);border:1px solid rgba(251,146,60,.3)}
.grade-f{background:rgba(248,113,113,.2);color:var(--red);border:1px solid rgba(248,113,113,.3)}
.grade-s{background:rgba(255,215,0,.25);color:#ffd700;border:2px solid rgba(255,215,0,.6);box-shadow:0 0 15px rgba(255,215,0,.4),0 0 30px rgba(255,215,0,.15);animation:sGlow 2s ease-in-out infinite}
@keyframes sGlow{0%,100%{box-shadow:0 0 15px rgba(255,215,0,.4),0 0 30px rgba(255,215,0,.1)}50%{box-shadow:0 0 20px rgba(255,215,0,.6),0 0 40px rgba(255,215,0,.25),0 0 60px rgba(255,215,0,.1)}}
/* Grade letter group buttons with glowing halo */
.grade-letter{display:inline-flex;align-items:center;justify-content:center;padding:5px 14px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:700;background:var(--card2);border:2px solid var(--border);color:var(--text);transition:all .2s ease;user-select:none;line-height:1.4}
.grade-letter:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.2)}
.grade-letter.grade-a.active{background:rgba(74,222,128,.25);color:var(--green);border-color:var(--green);box-shadow:0 0 12px rgba(74,222,128,.21),0 0 24px rgba(74,222,128,.1);animation:aGlow 7s ease-in-out infinite}
.grade-letter.grade-b.active{background:rgba(96,165,250,.25);color:var(--blue);border-color:var(--blue);box-shadow:0 0 12px rgba(96,165,250,.21),0 0 24px rgba(96,165,250,.1);animation:bGlow 7s ease-in-out infinite}
.grade-letter.grade-c.active{background:rgba(250,204,21,.25);color:var(--yellow);border-color:var(--yellow);box-shadow:0 0 12px rgba(250,204,21,.21),0 0 24px rgba(250,204,21,.1);animation:cGlow 7s ease-in-out infinite}
.grade-letter.grade-d.active{background:rgba(251,146,60,.25);color:var(--orange);border-color:var(--orange);box-shadow:0 0 12px rgba(251,146,60,.21),0 0 24px rgba(251,146,60,.1);animation:dGlow 7s ease-in-out infinite}
.grade-letter.grade-f.active{background:rgba(248,113,113,.25);color:var(--red);border-color:var(--red);box-shadow:0 0 12px rgba(248,113,113,.21),0 0 24px rgba(248,113,113,.1);animation:fGlow 7s ease-in-out infinite}
@keyframes aGlow{0%,100%{box-shadow:0 0 12px rgba(74,222,128,.21),0 0 24px rgba(74,222,128,.07)}50%{box-shadow:0 0 18px rgba(74,222,128,.3),0 0 36px rgba(74,222,128,.13),0 0 54px rgba(74,222,128,.04)}}
@keyframes bGlow{0%,100%{box-shadow:0 0 12px rgba(96,165,250,.21),0 0 24px rgba(96,165,250,.07)}50%{box-shadow:0 0 18px rgba(96,165,250,.3),0 0 36px rgba(96,165,250,.13),0 0 54px rgba(96,165,250,.04)}}
@keyframes cGlow{0%,100%{box-shadow:0 0 12px rgba(250,204,21,.21),0 0 24px rgba(250,204,21,.07)}50%{box-shadow:0 0 18px rgba(250,204,21,.3),0 0 36px rgba(250,204,21,.13),0 0 54px rgba(250,204,21,.04)}}
@keyframes dGlow{0%,100%{box-shadow:0 0 12px rgba(251,146,60,.21),0 0 24px rgba(251,146,60,.07)}50%{box-shadow:0 0 18px rgba(251,146,60,.3),0 0 36px rgba(251,146,60,.13),0 0 54px rgba(251,146,60,.04)}}
@keyframes fGlow{0%,100%{box-shadow:0 0 12px rgba(248,113,113,.21),0 0 24px rgba(248,113,113,.07)}50%{box-shadow:0 0 18px rgba(248,113,113,.3),0 0 36px rgba(248,113,113,.13),0 0 54px rgba(248,113,113,.04)}}
.dir-long{color:var(--green);font-weight:700;text-shadow:0 0 8px rgba(74,222,128,.3)}.dir-short{color:var(--red);font-weight:700;text-shadow:0 0 8px rgba(248,113,113,.3)}
.blk-btn{transition:all .2s ease}
.blk-btn:hover{transform:scale(1.2);background:rgba(255,60,60,.15)!important}
.trade-btn{transition:all .2s ease;position:relative;overflow:hidden}
.trade-btn:hover{transform:scale(1.1);background:rgba(74,222,128,.15);box-shadow:0 0 12px rgba(74,222,128,.3)}

.btn-sm{padding:6px 12px;border:1px solid var(--border);background:transparent;color:var(--muted);border-radius:6px;cursor:pointer;font-size:11px;font-family:inherit;transition:all .15s}
.btn-sm:hover{border-color:var(--green);color:var(--green)}
.btn-primary{padding:10px 20px;background:rgba(74,222,128,.15);color:var(--green);border:1px solid var(--green);border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;font-family:inherit}
.btn-primary:hover{background:rgba(74,222,128,.25)}
#btnModes{background:transparent;border:2px solid #444;color:var(--text);box-shadow:0 0 6px rgba(99,125,255,0.3);transition:all .3s}
#btnModes:hover{box-shadow:0 0 10px rgba(99,125,255,0.45);border-color:#637dff}
#btnEngage{background:transparent;border:2px solid #444;color:var(--text);box-shadow:0 0 6px rgba(74,222,128,0.2);transition:all .3s}
#btnEngage:hover{box-shadow:0 0 10px rgba(74,222,128,0.35);border-color:var(--green);color:var(--green)}
#btnEngage.disengaged{color:var(--text);border-color:#444;background:transparent}
#btnEngage.engaged{color:var(--text);border-color:var(--green);font-weight:700;box-shadow:0 0 8px rgba(74,222,128,0.6);animation:pulse-glow 2s ease-in-out infinite}
#btnEngage.engaged:hover{box-shadow:0 0 14px rgba(74,222,128,0.9);color:var(--text)}
@keyframes pulse-glow{0%,100%{box-shadow:0 0 8px rgba(74,222,128,.6)}50%{box-shadow:0 0 16px rgba(74,222,128,.9)}}
.btn-danger{padding:10px 20px;background:rgba(248,113,113,.15);color:var(--red);border:1px solid var(--red);border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;font-family:inherit}
.btn-danger:hover{background:rgba(248,113,113,.25)}
.btn-purple{padding:10px 20px;background:rgba(192,132,252,.15);color:var(--purple);border:1px solid var(--purple);border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;font-family:inherit}
.btn-gold{padding:10px 20px;background:rgba(250,204,21,.12);color:var(--gold);border:1px solid var(--gold);border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;font-family:inherit}
.btn-gold:disabled{opacity:.5;cursor:wait}
.btn-cyan{padding:10px 20px;background:rgba(34,211,238,.12);color:var(--cyan);border:1px solid var(--cyan);border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;font-family:inherit}.btn-cyan:hover{background:rgba(34,211,238,.22)}.btn-cyan:disabled{opacity:.5;cursor:wait}

/* Position Cards */
.pos-card{display:grid;grid-template-columns:1fr auto auto auto auto;gap:16px;align-items:center;padding:14px;border-bottom:1px solid var(--border)}
.pos-card:last-child{border-bottom:none}
.pos-mobile-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:12px;margin-bottom:8px}
.sub-row{background:#1a2332!important;font-size:11px!important;border-bottom:none!important}
.sub-row td{border-bottom:none!important;padding:6px 8px!important}
.pos-pair{font-weight:700;font-size:15.5px}
.pos-pnl{font-size:15.5px;font-weight:700;font-family:inherit;}
.pos-pnl.pos{color:var(--green)}.pos-pnl.neg{color:var(--red)}

/* (pos-card mobile rule merged into the main @media block above) */

/* Add-ons */
.addons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.addon-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;transition:border-color .2s}
.addon-card:hover{border-color:var(--blue)}.addon-card.owned{border-color:var(--green)}
.addon-card h3{margin-bottom:8px;font-size:15.5px;color:var(--text);text-transform:none}
.addon-card p{font-size:12.5px;color:var(--muted);margin-bottom:12px}.mode-card:hover{border-color:var(--blue)}.mode-card.active{border-color:var(--green);border-width:2px}.mode-card h3{font-size:15.5px;margin:0 0 2px}.mode-card p{font-size:12.5px;color:var(--muted);margin:0;line-height:1.3}.mode-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;transition:all .2s;min-width:160px;flex:1;max-width:220px}
.mode-activate-btn{display:block;width:100%;margin-top:8px;padding:6px 0;font-size:12.5px;font-weight:600;background:var(--green);border:none;color:var(--bg);border-radius:6px;cursor:pointer;transition:all .2s}
.mode-card.active .mode-activate-btn{background:var(--red);color:white}
.addon-card .price{font-size:22px;font-weight:700;color:var(--text)}
.owned-badge{display:inline-block;background:rgba(74,222,128,.15);color:var(--green);padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600}
.btn-sm{padding:6px 12px;border:none;border-radius:6px;cursor:pointer;font-size:12.5px;background:var(--card);border:1px solid var(--border);color:var(--text)}.btn-sm:hover{border-color:var(--blue)}
.health-item{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:8px 10px;font-size:12.5px}.health-item .health-ok{color:var(--green)}.health-item .health-warn{color:var(--yellow)}.health-item .health-err{color:var(--red)}

/* Report Cards */
.report-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;margin-bottom:12px;cursor:pointer;transition:border-color .15s}
.report-card:hover{border-color:var(--purple)}
.report-card h3{font-size:15.5px;color:var(--text);margin-bottom:6px;text-transform:none}
.report-date{font-size:11px;color:var(--muted)}
.report-type{display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;background:rgba(192,132,252,.15);color:var(--purple);margin-bottom:8px}
.report-type[data-type="alpha_scan"]{background:rgba(250,204,21,.12);color:var(--yellow)}
.report-type[data-type="rob_bot_scan"]{background:rgba(74,222,128,.15);color:var(--green);border:1px solid rgba(74,222,128,.3)}
.report-type[data-type="overlap_status"]{background:rgba(251,146,60,.15);color:var(--orange);border:1px solid rgba(251,146,60,.3)}
.report-type[data-type="daily_market_briefing"]{background:rgba(96,165,250,.15);color:var(--blue);border:1px solid rgba(96,165,250,.3)}
.report-type[data-type="pre_overlap_update"]{background:rgba(192,132,252,.15);color:var(--purple);border:1px solid rgba(192,132,252,.3)}
.report-card.featured{border-left:3px solid var(--green);background:rgba(74,222,128,.03)}
.report-card.featured-orange{border-left:3px solid var(--orange);background:rgba(251,146,60,.03)}
.report-card.featured .report-content{max-height:220px}
.report-card.featured-orange .report-content{max-height:220px}
.report-content{font-size:12.5px;color:var(--text);line-height:1.6;margin-top:12px}
.report-content h2,.report-content h3{color:var(--green);margin:16px 0 8px}
.report-content table{margin:12px 0}.report-content td,.report-content th{padding:6px 10px}

/* Report Detail Modal */

.addon-toggle{padding:8px 14px;border:1px solid;border-radius:8px;cursor:pointer;font-size:15.5px;font-weight:700;font-family:inherit;color:var(--text);transition:all .15s;position:relative;overflow:hidden}
.addon-toggle:active{transform:scale(0.96)}
.addon-toggle.active{border-color:var(--green);color:var(--green);background:rgba(74,222,128,.12);box-shadow:0 0 12px rgba(74,222,128,.4),inset 0 0 8px rgba(74,222,128,.1);transform:scale(1.02)}
.modal-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:200;align-items:center;justify-content:center;padding:20px}
.modal-overlay.show{display:flex}
.modal-box{background:var(--card);border:1px solid var(--border);border-radius:12px;max-width:1000px;width:100%;max-height:85vh;overflow-y:auto;padding:30px;position:relative}.modal-box::-webkit-scrollbar{width:6px}.modal-box::-webkit-scrollbar-thumb{background:#444;border-radius:3px}.modal-box::-webkit-scrollbar-track{background:transparent}
.modal-close{position:absolute;top:12px;right:16px;background:transparent;border:none;color:var(--muted);font-size:22px;cursor:pointer}

/* Forms */
.form-group{margin-bottom:14px}
.grade-pill{display:inline-flex;align-items:center;justify-content:center;padding:5px 16px;border-radius:20px;cursor:pointer;font-size:15.5px;font-weight:600;background:var(--bg);border:1px solid rgba(255,255,255,.08);color:var(--text);transition:all .15s;user-select:none;line-height:1.4}.grade-pill:hover{border-color:var(--accent);background:rgba(255,255,255,.08)}.grade-pill.active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 0 12px rgba(99,102,241,.25)}

/* Setup Scanner Card Magic */
.setup-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-bottom:12px}
.setup-stat-card{background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:10px;text-align:center;transition:all .2s ease;position:relative;overflow:hidden}
.setup-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.2)}
.setup-stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:opacity .2s}
.setup-stat-card:hover::before{opacity:.5}
.setup-stat-card .setup-stat-value{font-size:18px;font-weight:700;color:var(--text)}
.setup-stat-card .setup-stat-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:700}
.grade-pill-card{background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:6px 12px;cursor:pointer;font-size:12.5px;font-weight:600;transition:all .2s ease;position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;line-height:1.4}
.grade-pill-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.2)}
.grade-pill-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;opacity:0;transition:opacity .2s}
.grade-pill-card:hover::before{opacity:.6}
.grade-pill-card.active{color:#fff;transform:scale(1.05)}
.grade-pill-card.grade-a::before{background:linear-gradient(90deg,transparent,var(--green),transparent)}.grade-pill-card.grade-a.active{background:rgba(74,222,128,.2);border-color:var(--green)}
.grade-pill-card.grade-b::before{background:linear-gradient(90deg,transparent,var(--blue),transparent)}.grade-pill-card.grade-b.active{background:rgba(96,165,250,.2);border-color:var(--blue)}
.grade-pill-card.grade-c::before{background:linear-gradient(90deg,transparent,var(--yellow),transparent)}.grade-pill-card.grade-c.active{background:rgba(250,204,21,.15);border-color:var(--yellow)}
.grade-pill-card.grade-d::before{background:linear-gradient(90deg,transparent,var(--orange),transparent)}.grade-pill-card.grade-d.active{background:rgba(251,146,60,.15);border-color:var(--orange)}
.grade-pill-card.grade-f::before{background:linear-gradient(90deg,transparent,var(--red),transparent)}.grade-pill-card.grade-f.active{background:rgba(248,113,113,.15);border-color:var(--red)}.form-group label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}
.form-group input,.form-group select{width:100%;max-width:400px;padding:10px 12px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:14px;font-family:inherit}
.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--blue)}
.empty{text-align:center;padding:40px;color:var(--muted);font-size:14px}

/* Login */
.login-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;padding:10px 20px 0;gap:0;position:relative;z-index:100}
.mascot{margin-bottom:-53px;position:relative;z-index:1}
.mascot svg{filter:drop-shadow(0 4px 20px rgba(74,222,128,0.15))}
.mascot circle[r="5"]{animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}
.login-box{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:32px 28px 24px;width:100%;max-width:460px;position:relative;z-index:2;box-shadow:0 0 50px rgba(34,211,238,.08),0 0 100px rgba(74,222,128,.04)}
.btn-gmail{display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;background:#fff;color:#333;border:1px solid #ddd;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s;width:100%;max-width:360px}
.btn-gmail:hover{background:#f5f5f5;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.login-box h1{font-size:28px;margin-bottom:8px;text-align:center;text-transform:uppercase;letter-spacing:3px;font-weight:700}
.login-box h1 .lg-c,.login-box h1 .lg-sm{color:#ffffff;font-weight:700}
.login-box h1 .lg-bold .lg-c,.login-box h1 .lg-bold .lg-sm{font-weight:700}
.login-box h1 .lg-sm{font-size:22px;font-weight:700}
.subtitle{text-align:center;color:var(--muted);font-size:14px;margin-bottom:24px;text-transform:uppercase;letter-spacing:2px;font-weight:700}
.login-box input{width:100%;padding:12px;margin-bottom:12px;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:15.5px;font-family:inherit}
.login-box input:focus{outline:none;border-color:var(--green)}
.btn-login{width:100%;padding:12px;background:linear-gradient(135deg,#0891b2 0%,var(--cyan) 50%,#38bdf8 100%);color:#fff;border:none;border-radius:8px;font-size:15.5px;font-weight:700;cursor:pointer;font-family:inherit;text-transform:uppercase;letter-spacing:2px;box-shadow:0 6px 24px rgba(34,211,238,.28);transition:transform .2s,box-shadow .2s}
.btn-login:hover{transform:translateY(-1px);box-shadow:0 10px 32px rgba(34,211,238,.4)}
.login-error{color:var(--red);font-size:12.5px;text-align:center;margin-top:8px}
.btn-register{width:100%;padding:10px;background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:8px;font-size:12.5px;cursor:pointer;font-family:inherit;margin-top:8px}

.api-dot{width:8px;height:8px;border-radius:50%;background:var(--red);display:inline-block}.api-dot.online{background:var(--green)}
.pulse-dot-green{display:inline-block;width:8px;height:8px;border-radius:50%;background:#4ade80;margin-right:4px;animation:pulse-dot 1.5s infinite}@keyframes pulse-dot{0%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:0.7}100%{transform:scale(1);opacity:1}}
.api-status{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted)}

.log-entry{display:flex;gap:8px;padding:6px 8px;border-bottom:1px solid var(--border)}.log-entry:last-child{border-bottom:none}
.log-time{color:var(--muted);white-space:nowrap;min-width:145px}
.log-level{font-weight:600;min-width:70px}.log-level.SUCCESS{color:var(--green)}.log-level.ERROR{color:var(--red)}.log-level.WARNING{color:var(--yellow)}.log-level.INFO{color:var(--blue)}
.log-cat{color:var(--purple);min-width:55px}
.log-msg{flex:1;word-break:break-word}
.empty{text-align:center;color:var(--muted);padding:20px 0;font-size:12.5px}
.btn-sm{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:6px;cursor:pointer;font-family:inherit}
.btn-sm:hover{border-color:var(--green)};


/* ROB stretch legs — the wider the screen, the longer the legs */
.rob-legs-stretch{transform-origin:120px 178px;transition:transform .4s cubic-bezier(0.34,1.56,0.64,1)}
.rob-legs{transform-origin:120px 178px;transition:transform .4s cubic-bezier(0.34,1.56,0.64,1)}
/* Narrow (<600px): compressed */
@media(max-width:599px){.rob-legs-stretch{transform:scaleY(0.5)}.rob-legs{transform:scaleY(0.6)}}
/* Medium (600-899): default */
@media(min-width:600px)and(max-width:899px){.rob-legs-stretch{transform:scaleY(1)}.rob-legs{transform:scaleY(1)}}
/* Wide (900-1199): a little tall */
@media(min-width:900px)and(max-width:1199px){.rob-legs-stretch{transform:scaleY(1.4)}.rob-legs{transform:scaleY(1.2)}}
/* Extra wide (1200+): LONG BOI */
@media(min-width:1200px){.rob-legs-stretch{transform:scaleY(1.8)}.rob-legs{transform:scaleY(1.4)}}

/* ROB head — blink eyes every 30 seconds, antenna pulse */
.rob-eye-left,.rob-eye-right,.rob-pupil-left,.rob-pupil-right{transition:transform .1s,opacity .1s}
@keyframes rob-blink{
    0%,95%{transform:scaleY(1);opacity:1}
    96%{transform:scaleY(0.05);opacity:0.3}
    97%{transform:scaleY(1);opacity:1}
    100%{transform:scaleY(1);opacity:1}
}
.rob-eye-left,.rob-eye-right{animation:rob-blink 30s ease-in-out infinite}
.rob-pupil-left,.rob-pupil-right{animation:rob-blink 30s ease-in-out infinite}
@keyframes rob-antenna-pulse{
    0%,100%{opacity:1;transform:scale(1)}
    50%{opacity:0.6;transform:scale(0.8)}
}
.rob-antenna-light{animation:rob-antenna-pulse 2s ease-in-out infinite}
    #bgBodyCanvas, #bgBodyCanvas * { pointer-events: none !important; }
    #bgBodyCanvas::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);pointer-events:none;z-index:2}

    /* Transparent containers */
    .panel,.stat-card,.topnav,#confirmBox,input,select,.login-box,.mode-card,.addon-card,.img-tab,.btn-primary,.btn-sm{background:var(--card2) !important}
    #bgCurrentPreview{background:var(--card2) !important}
html[data-theme="light"] {
    --bg: rgba(240,242,245,.95); --card: #ffffff; --card2: #f5f5f5; --border: #d0d0d0; --text: #000000;
    --muted: #666666; --green: #16a34a; --red: #dc2626; --yellow: #ca8a04;
    --blue: #2563eb; --purple: #7c3aed; --orange: #ea580c; --cyan: #0891b2;
    --body-bg: #f0f2f5; --btn-border: #ccc; --btn-login-bg: #222; --btn-login-text: #fff;
    --icon-bg: #e0e0e0; --icon-color: #555; --modal-scrollbar: #ccc;
    --card-color-default: #ffffff; --login-card-bg: #ffffff; --login-font-color: #111111; --login-border-color: #d0d0d0;
}
html[data-theme="light"] select option{background:#f5f5f5;color:#111}
html[data-theme="light"] .grade-pill.active{color:var(--text)}
/* Admin text color overrides */
:root{--admin-text-dark:#e0e0e0;--admin-text-light:#000000;--admin-logo:;--admin-nav-icons:;}
html[data-theme="dark"]{--text:var(--admin-text-dark)}
html[data-theme="light"]{--text:var(--admin-text-light)}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter','Segoe UI',system-ui,sans-serif;background:var(--body-bg);color:var(--text);line-height:1.5;min-height:100vh}
select{background:var(--bg);color:var(--text);border:var(--border-width) solid var(--border);appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2'><polyline points='6 9 12 15 18 9'/></svg>");background-repeat:no-repeat;background-position:right 8px center;background-size:16px;padding-right:28px}
select option{background:#12121a;color:#e0e0e0;padding:8px 12px}
select option:hover,select option:focus{background:rgba(59,130,246,.25)}

/* Top Nav */
.topnav{background:#111!important;border-bottom:var(--border-width) solid var(--border);padding:0 20px;display:flex;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:100;backdrop-filter:none;gap:0}
html[data-theme="light"] .topnav{background:#fff!important}
.topnav-brand{font-size:12.5px;font-weight:700;color:#ffffff;margin-right:16px;white-space:nowrap;line-height:64px;height:64px;display:flex;align-items:center;gap:8px;letter-spacing:0.5px}
.topnav-link{display:flex;align-items:center;gap:4px;padding:0 12px;height:48px;border:none;background:transparent;color:var(--muted);font-size:15.5px;font-weight:700;text-transform:uppercase;cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent;transition:all .15s;font-family:inherit}
.topnav-link:hover{color:var(--text);background:rgba(255,255,255,.03)}
.topnav-link.active{color:var(--green);border-bottom-color:var(--green)}
.topnav-dropdown-item{padding:10px 16px;cursor:pointer;color:var(--text);font-size:15.5px;font-weight:700;transition:background .15s;text-transform:uppercase;letter-spacing:0.5px}
.topnav-dropdown-item:hover{background:rgba(255,255,255,.06)}
.topnav-link .badge{background:rgba(74,222,128,.15);color:var(--green);font-size:11px;padding:2px 6px;border-radius:8px;font-weight:600}
@media(min-width:769px){
    .topnav-links{display:flex;gap:0;flex-wrap:wrap;flex:1;justify-content:center}
}
/* FAQ accordion */
.faq-item{border-bottom:1px solid var(--border);padding:0}
.faq-q{padding:14px 12px;cursor:pointer;font-weight:700;font-size:14px;color:var(--text);user-select:none}
.faq-q:hover{background:rgba(255,255,255,.03)}
.faq-a{padding:0 12px 16px;font-size:12.5px;color:var(--muted);line-height:1.6;display:none}
.faq-a code{background:rgba(255,255,255,.06);padding:1px 5px;border-radius:3px;font-size:12.5px}
html[data-theme="light"] .faq-a code{background:rgba(0,0,0,.06)!important}
.topnav-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.topnav-user{font-size:12.5px;color:var(--muted)}
.btn-logout{padding:6px 14px;border:var(--border-width) solid var(--border);background:transparent;color:var(--muted);border-radius:6px;cursor:pointer;font-size:12.5px;font-family:inherit}
.btn-logout:hover{border-color:var(--red);color:var(--red)}
/* Logout arrow — invert for dark mode, normal for light */
.btn-logout img.logout-arrow{height:18px;width:auto;display:block;filter:invert(1)}
html[data-theme="light"] .btn-logout img.logout-arrow{filter:invert(0)}
@media(max-width:768px){
    .menu-toggle{display:block;background:transparent;border:none;color:var(--text);font-size:22px;cursor:pointer;padding:10px 14px;min-width:44px;min-height:44px;line-height:1}
}
/* ── New User Guide ── */
#newUserGuideOverlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.7);z-index:9999;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.guide-modal{background:var(--card);border:1px solid var(--border);border-radius:16px;width:92%;max-width:520px;max-height:90vh;overflow-y:auto;padding:28px 24px 20px;box-shadow:0 16px 48px rgba(0,0,0,0.5);position:relative;animation:slideUp .35s ease}
@keyframes slideUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.guide-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--muted);font-size:22px;cursor:pointer;padding:4px 8px;line-height:1;border-radius:6px;transition:color .15s}
.guide-close:hover{color:var(--text);background:var(--bg)}
.guide-progress{display:flex;gap:6px;justify-content:center;margin-bottom:18px}
.guide-dot{width:8px;height:8px;border-radius:50%;background:var(--border);transition:all .3s;cursor:pointer}
.guide-dot.active{background:var(--green);box-shadow:0 0 6px rgba(34,197,94,0.5);width:24px;border-radius:4px}
.guide-step{display:none}
.guide-step.active{display:block}
.guide-icon{font-size:28px;text-align:center;margin-bottom:12px}
.guide-title{font-size:22px;font-weight:700;text-align:center;margin-bottom:8px;text-transform:uppercase}
.guide-desc{font-size:14px;color:var(--muted);text-align:center;line-height:1.6;margin-bottom:16px;padding:0 4px}
.guide-desc strong{color:var(--text)}
.guide-features{background:var(--bg);border-radius:10px;padding:14px 16px;margin-bottom:14px}
.guide-features div{padding:5px 0;font-size:12.5px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}
.guide-features div:last-child{border-bottom:none}
.guide-nav{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.guide-nav button{padding:10px 20px;border-radius:8px;border:1px solid var(--border);cursor:pointer;font-size:14px;font-weight:600;font-family:inherit;transition:all .15s}
.guide-btn-back{background:transparent;color:var(--muted)}
.guide-btn-back:hover{color:var(--text);border-color:var(--text)}
.guide-btn-next{background:var(--green);color:#000;border-color:var(--green)}
.guide-btn-next:hover{filter:brightness(1.15)}
.guide-btn-done{background:var(--green);color:#000;border-color:var(--green);padding:10px 28px}
.guide-btn-done:hover{filter:brightness(1.15)}
.guide-dismiss{font-size:12.5px;color:var(--muted);text-align:center;margin-top:12px;cursor:pointer}
.guide-dismiss:hover{color:var(--text)}
.guide-check{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;font-size:12.5px;color:var(--muted);cursor:pointer}
.guide-check input{accent-color:var(--green)}

/* Exchange Cards */
.exchange-card{transition:box-shadow .2s}
.exchange-card:hover{box-shadow:0 2px 12px rgba(0,0,0,.15)}
.ex-pos-list::-webkit-scrollbar{width:3px}
.ex-pos-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
/* Close button pulse on hover */
.exchange-card button[onclick*="closePosition"]{transition:transform .15s}
.exchange-card button[onclick*="closePosition"]:hover{transform:scale(1.3)}
.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.88);z-index:99999;display:none;align-items:center;justify-content:center;}.modal-overlay.show{display:flex;}
.modal-box{background:var(--panel);padding:32px;border-radius:12px;max-width:360px;width:90%;text-align:center;border:1px solid var(--border);color:var(--text);}
.modal-box h2{margin:0 0 8px;font-size:22px;color:var(--text);}
/* ===== TRADING CONTROL BAR ===== */
.trading-control-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;padding:16px;background:var(--card);border:1px solid var(--border);border-radius:12px;margin-bottom:16px}
.trading-control-btn{display:flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:10px;cursor:pointer;font-size:12.5px;font-weight:700;text-transform:uppercase;transition:all .2s;flex:1;min-width:160px;justify-content:center}
.trading-control-btn:hover{border-color:var(--green);background:rgba(74,222,128,.05)}
.trading-control-btn.active{border-color:var(--green);background:rgba(74,222,128,.1)}
.trading-control-btn.disabled{opacity:.5;cursor:not-allowed}

/* Glassbullet indicators */
.glassbullet{width:12px;height:12px;border-radius:50%;display:inline-block;position:relative;transition:all .3s}
.glassbullet-blue{background:linear-gradient(135deg,#3b82f6,#60a5fa);box-shadow:inset 0 1px 2px rgba(255,255,255,.3)}

.glassbullet-green{background:linear-gradient(135deg,#22c55e,#4ade80);box-shadow:inset 0 1px 2px rgba(255,255,255,.3)}

.glassbullet-red-dimmed{background:linear-gradient(135deg,#7f1d1d,#991b1b);box-shadow:inset 0 1px 2px rgba(0,0,0,.3);opacity:.6}

/* Papertrade Exchange Panel */
.papertrade-panel{background:linear-gradient(135deg,rgba(59,130,246,.06),rgba(96,165,250,.03));border-color:rgba(59,130,246,.25)!important}
.papertrade-panel .panel-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.papertrade-balance{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.papertrade-balance .bal-amount{font-size:22px;font-weight:700;color:var(--green)}
.papertrade-balance .bal-label{font-size:11px;color:var(--muted);text-transform:uppercase}
.papertrade-balance .bal-pnl{font-size:12.5px;font-weight:600}

/* Live Exchange Panel */
.live-exchange-panel{background:linear-gradient(135deg,rgba(74,222,128,.05),rgba(34,197,94,.02));border-color:rgba(74,222,128,.2)!important}

/* Exchange visibility */
.exchange-hidden{display:none!important}
/* Red glass ball with white cross */
.block-icon{display:inline-block;width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 0 6px rgba(239,68,68,.6),inset 0 1px 2px rgba(255,255,255,.3);position:relative}
.block-icon::before,.block-icon::after{content:'';position:absolute;background:#fff;border-radius:1px}
.block-icon::before{width:8px;height:2px;top:6px;left:3px}
.block-icon::after{width:2px;height:8px;top:3px;left:6px}

/* =========================================================
   COMPREHENSIVE MOBILE UI ENHANCEMENTS
   Inserted at end of <style> — cascades after existing rules
   ========================================================= */

@media(max-width:768px){

/* ── 1. NAVIGATION ── */
.topnav{padding:0 8px;height:56px;min-height:56px}
.topnav-brand{height:56px;line-height:56px;font-size:12.5px}
.topnav-brand img{height:40px!important}
#topnavHamburger{font-size:22px;padding:8px 12px;min-height:44px;min-width:44px}
#topnavDropdown{top:50px!important;min-width:220px!important;max-width:calc(100vw - 24px)!important}
#topnavDropdown .topnav-dropdown-item{padding:12px 16px;font-size:14px;min-height:44px;display:flex;align-items:center}
#topnavDropdown .nav-icon{font-size:18px;margin-right:8px}
#topnavDropdown .badge{font-size:11px;padding:3px 8px}
.topnav-right{gap:8px}
.topnav-user{font-size:11px;max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btn-logout{padding:8px 12px;font-size:12.5px;min-height:36px}

/* ── 2. LAYOUT & CONTAINERS ── */
.container{padding:8px 10px}
.panel{padding:12px!important;margin-bottom:8px!important;border-radius:10px!important}
.panel h2{font-size:15.5px!important;margin-bottom:12px!important}
.panel h3{font-size:11px!important;margin-bottom:8px!important}
.section.active{padding-bottom:80px}

                <div style="font-size:12.5px;font-weight:700;color:#f87171;margin-bottom:6px">⚠️ Live Mode Requirements</div>
.stats-grid{grid-template-columns:repeat(2,1fr)!important;gap:6px!important}
.stats-grid.market-grid{grid-template-columns:repeat(2,1fr)!important}
.stats-grid.trading-grid{grid-template-columns:repeat(2,1fr)!important}
.stats-grid.pnl-grid{grid-template-columns:repeat(3,1fr)!important;gap:4px!important}
.stat-card{padding:10px 6px!important;min-width:0!important}
.stat-card .stat-value{font-size:15.5px!important}
.stat-card .stat-label{font-size:11px!important}
.stat-card.pnl{padding:6px 4px!important}
.stat-card.pnl .stat-value{font-size:14px!important}
.stat-card.pnl .stat-label{font-size:8px!important}
.dash-section-label{font-size:11px!important;margin:12px 0 6px 4px!important}

/* ── 4. EXCHANGE PANELS (Dashboard) ── */
#binancePanel, #krakenPanel{padding:8px 10px!important;margin-bottom:4px!important}
#binancePanel > div:first-child, #krakenPanel > div:first-child{flex-direction:column!important;align-items:flex-start!important;gap:6px!important}
#exchangeConfigSection, #krakenConfigSection{padding-top:6px!important}
#exchangeConfigSection > div[style*="grid-template-columns"], #krakenConfigSection > div[style*="grid-template-columns"]{grid-template-columns:1fr!important;gap:6px!important}
#exchangeConfigSection input, #exchangeConfigSection select, #krakenConfigSection input, #krakenConfigSection select{font-size:14px!important;padding:10px 8px!important;min-height:44px!important;width:100%!important}
#exchangeConfigSection label, #krakenConfigSection label{font-size:12.5px!important}
#exchangeConfigSection button, #krakenConfigSection button{padding:10px 12px!important;font-size:12.5px!important;min-height:44px!important;flex:1!important}
#exchangeConfigSection > div:last-child, #krakenConfigSection > div:last-child{flex-wrap:wrap!important;gap:4px!important}
#liveModePrereqs{padding:10px!important}
#pauseLiveTradingContainer{margin-top:6px!important}
#pauseLiveTradingBtn{padding:10px 12px!important;font-size:12.5px!important;min-height:44px!important}

/* ── 5. SETUP SCANNER ── */
#setupScannerSection .setup-stats-grid{grid-template-columns:repeat(2,1fr)!important;gap:6px!important}
#setupScannerSection .setup-stat-card{padding:8px 4px!important}
#setupScannerSection .setup-stat-value{font-size:15.5px!important}
#setupScannerSection .setup-stat-label{font-size:11px!important}
#gradeFilterContainer{display:flex;flex-wrap:wrap;gap:4px!important}
#gradeFilterContainer .grade-pill-card{padding:8px 12px!important;font-size:12.5px!important}
#setups .table-wrap{display:none}
#setupsMobileCards{display:block!important;width:100%!important;padding:0 4px!important}
.setup-mobile-card{padding:14px!important;margin-bottom:10px!important;border-radius:10px!important}
.setup-mobile-pair{font-size:14px!important}
.setup-mobile-meta{font-size:12.5px!important;gap:4px 10px!important}
.setup-mobile-levels{grid-template-columns:repeat(2,1fr)!important;gap:4px!important}
.setup-mobile-level{padding:8px 4px!important}
.setup-mobile-level .lvl-value{font-size:12.5px!important}
.setup-mobile-actions .btn-trade{padding:8px 12px!important;font-size:12.5px!important;min-height:40px!important}
    /* Mobile setup header: stack filter below title+counts, shrink grades */
    #setups .setup-header-row{flex-wrap:wrap!important;gap:4px!important;margin-bottom:6px!important;position:static!important}
    #setups #gradeFilterCompact{position:static!important;transform:none!important;order:3;width:100%;justify-content:center;margin-top:4px;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:3px!important;padding:0 2px;scrollbar-width:none}
    #setups #gradeFilterCompact::-webkit-scrollbar{display:none}
    #setups #gradeFilterCompact .grade-letter{padding:2px 5px!important;font-size:11px!important;min-width:22px;min-height:22px;flex-shrink:0}
    #setups #gradeFilterCompact > span:first-child{font-size:11px!important;margin-right:2px!important;white-space:nowrap;flex-shrink:0}
    #setups .setup-counts-row{gap:6px!important}
    #setups .setup-counts-row span{font-size:11px!important}
    #setups .setup-mobile-pair .grade{font-size:11px!important;padding:2px 5px!important}
    /* Mobile card header: allow pair name to shrink, smaller actions */
    .setup-mobile-header{gap:4px!important;flex-wrap:nowrap!important}
    .setup-mobile-pair{gap:4px!important;font-size:12.5px!important;flex-shrink:1!important;min-width:0;overflow:hidden}
    .setup-mobile-pair strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
    .setup-mobile-actions{gap:4px!important;flex-shrink:0!important}
    .setup-mobile-actions .trade-btn{font-size:11px!important;padding:2px 5px!important}
    .setup-mobile-actions .blk-btn{width:20px!important;height:20px!important;font-size:11px!important}
    /* Very small screens: extra compact */
    @media(max-width:400px){
        .setup-mobile-card{padding:10px!important}
        .setup-mobile-pair{font-size:11px!important}
        .setup-mobile-actions .trade-btn{font-size:11px!important;padding:2px 4px!important}
        .setup-mobile-level .lvl-value{font-size:11px!important}
        #setups #gradeFilterCompact .grade-letter{padding:2px 4px!important;font-size:8px!important;min-width:20px;min-height:20px}
    }

/* ── DASHBOARD COMPACT CARDS MOBILE ── */
    #dashStatsTrading{padding:8px 6px!important}
    #dashStatsTrading > div:first-child{gap:2px!important;margin-bottom:6px!important}
    #dashStatsTrading > div:last-child{gap:2px!important;padding-top:6px!important}
    #dashStatsTrading .stat-value{font-size:12.5px!important}
    #dashStatsTrading div[style*="font-size:11px"]{font-size:8px!important;letter-spacing:0!important}
    #dashStatsTrading div[style*="width:1px"]{height:24px!important}
    #dashStatsPnL{padding:8px 6px!important}
    #dashStatsPnL > div{gap:4px!important}
    #dashStatsPnL .stat-value{font-size:12.5px!important}
    #dashStatsPnL div[style*="font-size:11px"]{font-size:8px!important;letter-spacing:0!important}
    #dashStatsPnL div[style*="width:1px"]{min-height:24px!important}
    /* Weekly PnL chart: smaller values on mobile */
    #weeklyPnlLine{padding:2px 0!important;gap:2px!important}
    #weeklyPnlLine div[style*="font-size:11px"]{font-size:7px!important}
    #weeklyPnlLine div[style*="font-size:8px"]{font-size:5px!important;letter-spacing:0!important}
    /* Market data: smaller text + short labels */
    #dashStatsMarket .stat-label{font-size:7px!important;letter-spacing:0!important}
    #dashStatsMarket .stat-value{font-size:11px!important}
    #dashStatsMarket .stat-value img{width:14px!important;height:14px!important}
    #dashStatsMarket .stat-value span[style*="width:18px"]{width:14px!important;height:14px!important;font-size:8px!important}
    #dashStatsMarket .stat-card{padding:6px 4px!important}
    #dashStatsMarket .stat-label[data-mobile-label]:before{content:attr(data-mobile-label);display:block}
    #dashStatsMarket .stat-label[data-mobile-label]{font-size:0!important}
    /* Weekly breakdown: even smaller on very small screens */
    @media (max-width:400px){
        #weeklyBreakdownBody > div{height:80px!important}
        #weeklyBreakdownBody > div > div:nth-child(4){font-size:8px!important}
        #weeklyBreakdownBody > div > div:nth-child(5){font-size:7px!important}
        #weeklyBreakdownBody > div > div:nth-child(6){font-size:6px!important}
    }
    /* Weekly breakdown smaller */
    #weeklyBreakdownBody{min-height:60px!important;padding:2px 0!important;gap:3px!important}
    #weeklyBreakdownBody > div{height:100px!important}
    #dashWeeklyBreakdown{padding:8px!important}

/* ── 6. POSITIONS ── */
#positions .table-wrap{display:none}
#positionsMobileCards{display:block!important;width:100%!important;padding:0 4px!important}
.pos-mobile-card{padding:12px!important;margin-bottom:8px!important;border-radius:10px!important;background:var(--card2)!important;border:1px solid var(--border)!important}
.pos-mobile-card .pos-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:8px}
.pos-mobile-card .pos-pair{font-size:15.5px;font-weight:700}
.pos-mobile-card .pos-pnl{font-size:15.5px;font-weight:700}
.pos-mobile-card .pos-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px;color:var(--muted);margin-bottom:8px}
.pos-mobile-card .pos-actions{display:flex;gap:6px;flex-wrap:wrap}
.pos-mobile-card .pos-actions button{flex:1;min-height:44px;font-size:12.5px;padding:8px 10px;border-radius:6px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer}
.pos-mobile-card .pos-actions button.btn-danger{border-color:var(--red);color:var(--red);background:rgba(248,113,113,.1)}
.pos-mobile-card .pos-actions button.btn-primary{border-color:var(--green);color:var(--green);background:rgba(74,222,128,.1)}
#activePositionsSection .panel, #closedPositionsSection .panel{padding:10px!important}
#activePositionsSection h2, #closedPositionsSection h2{font-size:15.5px!important}
/* Timezone prompt mobile */
#timezonePrompt{padding:8px!important}
#timezonePrompt > div{padding:16px!important;max-width:100%!important;border-radius:8px!important}
#timezonePrompt h3{font-size:15.5px!important}
#timezonePrompt p{font-size:12.5px!important;margin-bottom:10px!important}
#timezonePrompt select{font-size:12.5px!important;padding:8px!important}

#trading .panel{padding:10px!important}
.trading-control-bar{flex-direction:row!important;gap:4px!important;padding:6px 8px!important;flex-wrap:nowrap!important;overflow-x:auto!important}
.trading-control-btn{flex:1!important;width:auto!important;min-width:0!important;padding:2px 3px!important;font-size:7px!important;min-height:24px!important;justify-content:center!important;gap:2px!important;white-space:nowrap!important}
.trading-control-btn .glassbullet{width:5px!important;height:5px!important;flex-shrink:0}
.trading-control-bar > div:last-child{margin-left:auto!important;padding-right:0!important;gap:2px!important;flex-shrink:0;white-space:nowrap;min-width:0!important}
.trading-control-bar > div:last-child span:first-child{font-size:0!important}
.trading-control-bar > div:last-child span:first-child::after{content:'Open:';font-size:7px!important;color:var(--muted);text-transform:uppercase}
.trading-control-bar > div:last-child span:last-child{font-size:11px!important}
#botToggleLabel,#papertradeToggleLabel,#liveToggleLabel{display:inline-block;overflow:visible!important;text-overflow:clip!important;white-space:nowrap!important;max-width:none!important;vertical-align:middle}
.trading-bot-grid{grid-template-columns:repeat(2,1fr)!important;gap:6px!important;padding:8px!important}
.trading-bot-cell{padding:6px!important}
.trading-bot-cell .cell-label{font-size:11px!important}
.trading-bot-cell .cell-value, .trading-bot-cell input, .trading-bot-cell select{font-size:12.5px!important;padding:8px 4px!important}
.trading-bot-cell .notional-value{font-size:12.5px!important;padding:8px 4px!important}
#papertradeExchangePanel .panel-header, #binanceTradePanel .panel-header, #krakenTradePanel .panel-header{flex-direction:column!important;align-items:flex-start!important;gap:8px!important}
.papertrade-balance{align-items:flex-start!important}
.papertrade-balance .bal-amount{font-size:18px!important}
.papertrade-balance .bal-pnl{font-size:12.5px!important}
#botLogsPanel #botLogs{max-height:280px!important;font-size:12.5px!important}
#botLogControls{flex-wrap:wrap!important;gap:6px!important}
#botLogControls button{min-height:44px!important;padding:8px 12px!important;font-size:12.5px!important;flex:1}
#tradeSchedulePanel .form-group, #tradeSchedulePanel input, #tradeSchedulePanel select{font-size:14px!important;min-height:44px!important}
#underdogPanel .form-group input, #underdogPanel .form-group select{font-size:14px!important;min-height:44px!important}

/* ── 8. AI INTEL / REPORTS ── */
#ai .panel{padding:10px!important}
#ai .report-card{padding:14px!important;margin-bottom:8px!important}
#ai .report-card h3{font-size:14px!important}
#ai .report-content{font-size:12.5px!important;line-height:1.5!important}
#ai .report-content table{font-size:11px!important}
#ai .report-content td, #ai .report-content th{padding:4px 6px!important}
#ai .report-type{font-size:11px!important}
#ai .report-date{font-size:11px!important}

/* ── 9. ADD-ONS ── */
#addons .addons-grid{grid-template-columns:1fr!important;gap:10px!important}
#addons .addon-card{padding:14px!important}
#addons .addon-card h3{font-size:14px!important}
#addons .addon-card p{font-size:12.5px!important}
#addons .addon-card .price{font-size:18px!important}
#addons .feature-grid{grid-template-columns:1fr!important;gap:6px!important}
#addons .feature-item{font-size:12.5px!important;padding:8px 10px!important}
#addons .mode-card{min-width:0!important;max-width:100%!important;padding:10px 12px!important}
#addons .mode-card h3{font-size:14px!important}
#addons .mode-card p{font-size:11px!important}
#addons .mode-activate-btn{padding:10px 0!important;font-size:12.5px!important;min-height:44px!important}
#addons .owned-badge{font-size:11px!important;padding:3px 8px!important}

/* ── 10. SETTINGS ── */
#settings .panel{padding:12px!important}
#settings .form-group{margin-bottom:12px!important}
#settings .form-group label{font-size:11px!important}
#settings .form-group input, #settings .form-group select{font-size:15.5px!important;padding:12px 10px!important;min-height:44px!important;max-width:100%!important;width:100%!important}
#settings .form-row{flex-direction:column!important;gap:8px!important}
#settings .form-row > *{max-width:100%!important;width:100%!important}
#settings button.btn-primary, #settings button.btn-danger, #settings button.btn-purple, #settings button.btn-gold, #settings button.btn-cyan{width:100%!important;padding:12px 16px!important;font-size:14px!important;min-height:48px!important;margin-bottom:8px!important}
#settings .btn-sm{padding:10px 14px!important;font-size:12.5px!important;min-height:44px!important}
#settingsConfirmPass .modal-box{padding:20px!important}
#settingsConfirmPass input{font-size:15.5px!important;padding:12px!important;min-height:44px!important}
#settingsDebugPanel pre{font-size:11px!important;overflow-x:auto!important}
#settingsDebugPanel code{font-size:11px!important}
#settingsPassSection input, #settingsUsernameSection input{font-size:15.5px!important;min-height:44px!important}
#exchangeVisibilityPanel .form-group input, #exchangeVisibilityPanel .form-group select{font-size:14px!important;min-height:44px!important}
#tierSwitcherPanel .form-group select{font-size:14px!important;min-height:44px!important}
#invitePanel input{font-size:15.5px!important;min-height:44px!important}
#invitePanel button{width:100%!important;min-height:48px!important}
#adminPwResetPanel input{font-size:15.5px!important;min-height:44px!important}
#adminPwResetPanel button{width:100%!important;min-height:48px!important}
#guideTogglePanel .form-group{font-size:12.5px!important}
#transparencyPanel .form-group input{font-size:14px!important;min-height:44px!important}
#imageManagerPanel .form-group input, #imageManagerPanel .form-group select{font-size:14px!important;min-height:44px!important}

/* ── 11. ADMIN ── */
#admin .panel{padding:10px!important}
#admin .admin-grid{grid-template-columns:1fr!important;gap:10px!important}
#admin .admin-card{padding:12px!important}
#admin .admin-stat-grid{grid-template-columns:repeat(2,1fr)!important;gap:6px!important}
#admin .admin-stat-grid .stat-card{padding:8px 4px!important}
#admin .admin-stat-grid .stat-value{font-size:15.5px!important}
#admin .admin-stat-grid .stat-label{font-size:11px!important}
#adminUsersTable table, #adminUsersTable .table-wrap{font-size:11px!important}
#adminUsersTable th, #adminUsersTable td{padding:6px 4px!important;font-size:11px!important}
#adminUsersTable .btn-sm{padding:6px 8px!important;font-size:11px!important;min-height:32px!important}
#adminAnalyticsPanel .stats-grid{grid-template-columns:repeat(2,1fr)!important}
#adminAnalyticsPanel .stat-card{padding:8px 4px!important}
#adminOptimalPanel .form-group input, #adminOptimalPanel .form-group select{font-size:14px!important;min-height:44px!important}
#adminThemePanel .form-group select, #adminCandlePanel .form-group select, #adminTextColorPanel .form-group select, #adminIconPanel .form-group select{font-size:14px!important;min-height:44px!important}
#watchdogHeader .form-group input, #watchdogHeader .form-group select{font-size:14px!important;min-height:44px!important}
#adminLogPanel pre, #exchangeLogPanel pre{font-size:11px!important;overflow-x:auto!important}
#slotStatusPanel .form-group input, #slotStatusPanel .form-group select{font-size:14px!important;min-height:44px!important}
#reportSchedulePanel .form-group input, #reportSchedulePanel .form-group select{font-size:14px!important;min-height:44px!important}
#tierLimitsPanel .form-group input, #tierLimitsPanel .form-group select{font-size:14px!important;min-height:44px!important}
#topnavStudioPanel .form-group input, #topnavStudioPanel .form-group select{font-size:14px!important;min-height:44px!important}
#analyticsDashboardPanel .stats-grid{grid-template-columns:repeat(2,1fr)!important}
#analyticsDashboardPanel .stat-card{padding:8px 4px!important}
#abTestPanel .form-group input, #abTestPanel .form-group select{font-size:14px!important;min-height:44px!important}

/* ── 12. FAQ ── */
#faq .faq-q{padding:12px 10px!important;font-size:12.5px!important}
#faq .faq-a{padding:0 10px 12px!important;font-size:12.5px!important;line-height:1.5!important}
#faq .faq-a code{font-size:11px!important}

/* ── 13. TIER PERFORMANCE TABLE ── */
#tierPerformanceTable thead, #tierPerformanceTable .table-wrap thead{display:none}
#tierPerformanceTable tbody tr, #tierPerformanceTable .table-wrap tbody tr{display:block;margin-bottom:8px;background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:10px}
#tierPerformanceTable tbody td, #tierPerformanceTable .table-wrap tbody td{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--border);font-size:12.5px}
#tierPerformanceTable tbody td:last-child, #tierPerformanceTable .table-wrap tbody td:last-child{border-bottom:none}
#tierPerformanceTable tbody td::before, #tierPerformanceTable .table-wrap tbody td::before{content:attr(data-label);font-weight:600;color:var(--muted);font-size:11px;text-transform:uppercase}

/* ── 14. TRADE HISTORY TABLE ── */
#tradeHistoryTable thead, #tradeHistoryTable .table-wrap thead{display:none}
#tradeHistoryTable tbody tr, #tradeHistoryTable .table-wrap tbody tr{display:block;margin-bottom:8px;background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:10px}
#tradeHistoryTable tbody td, #tradeHistoryTable .table-wrap tbody td{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--border);font-size:12.5px}
#tradeHistoryTable tbody td:last-child, #tradeHistoryTable .table-wrap tbody td:last-child{border-bottom:none}
#tradeHistoryTable tbody td::before, #tradeHistoryTable .table-wrap tbody td::before{content:attr(data-label);font-weight:600;color:var(--muted);font-size:11px;text-transform:uppercase}

/* ── 15. GENERIC TABLE-TO-CARD CONVERSION (catch-all) ── */
table:not(#tierPerformanceTable):not(#tradeHistoryTable):not(.spot-table) thead{display:none}
table:not(#tierPerformanceTable):not(#tradeHistoryTable):not(.spot-table) tbody tr{display:block;margin-bottom:8px;background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:10px}
table:not(#tierPerformanceTable):not(#tradeHistoryTable):not(.spot-table) tbody td{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--border);font-size:12.5px}
table:not(#tierPerformanceTable):not(#tradeHistoryTable):not(.spot-table) tbody td:last-child{border-bottom:none}
table:not(#tierPerformanceTable):not(#tradeHistoryTable):not(.spot-table) tbody td::before{content:attr(data-label);font-weight:600;color:var(--muted);font-size:11px;text-transform:uppercase}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ── 16. MODALS ── */
.modal-overlay.show{padding:8px!important;align-items:flex-start!important;overflow-y:auto!important}
.modal-box{padding:16px!important;max-width:100%!important;width:calc(100% - 16px)!important;margin:8px auto!important;max-height:92vh!important;border-radius:12px!important}
.modal-box h2{font-size:18px!important;margin-bottom:12px!important}
.modal-close{top:8px!important;right:10px!important;font-size:28px!important;min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:center}
#modesModal .modal-box{padding:16px!important}
#modesModal .mode-card{min-width:0!important;max-width:100%!important;width:100%!important;margin-bottom:8px!important}
#reportModal .modal-box{padding:16px!important}
#reportModal .report-content{font-size:12.5px!important}
#reportModal .report-content table{font-size:11px!important}
#reportModal .report-content td, #reportModal .report-content th{padding:4px 6px!important}
#tradeModal .modal-box{padding:16px!important}
#tradeModal input, #tradeModal select{font-size:15.5px!important;padding:12px!important;min-height:44px!important;width:100%!important}
#tradeModal button{width:100%!important;min-height:48px!important;margin-bottom:6px!important}
#confirmOverlay .modal-box{padding:20px!important;max-width:calc(100% - 32px)!important}
#confirmOverlay .modal-box h2{font-size:18px!important}
#confirmOverlay .modal-box button{width:100%!important;min-height:48px!important;margin-bottom:6px!important}
#newUserGuideOverlay .guide-modal{padding:20px 16px!important;max-height:92vh!important;width:calc(100% - 16px)!important}
#newUserGuideOverlay .guide-title{font-size:18px!important}
#newUserGuideOverlay .guide-desc{font-size:12.5px!important}
#newUserGuideOverlay .guide-features div{font-size:12.5px!important}
#newUserGuideOverlay .guide-nav button{padding:10px 16px!important;font-size:12.5px!important;min-height:44px!important}
#newUserGuideOverlay .guide-icon{font-size:28px!important}

/* ── 17. CHARTS ── */
#pnlChart, #hourlyChart{max-height:200px!important;width:100%!important}
.chart-container{position:relative;height:200px!important;width:100%!important}

/* ── 18. LOGIN PAGE ── */
.login-wrapper{padding:0 10px!important}
.login-box{padding:24px 16px!important;margin:0 8px!important;border-radius:10px!important}
.login-box h1{font-size:22px!important}
.login-box h1 .lg-sm{font-size:18px!important}
.login-box .subtitle{font-size:12.5px!important;margin-bottom:16px!important}
.login-box input{font-size:15.5px!important;padding:14px 12px!important;min-height:48px!important;margin-bottom:10px!important}
.btn-login{font-size:14px!important;padding:14px!important;min-height:48px!important}
.btn-register{font-size:12.5px!important;padding:12px!important;min-height:44px!important}
.login-features{grid-template-columns:1fr!important;gap:6px!important}
.login-feature-card{padding:10px!important}
.mascot svg{width:120px!important;height:auto!important}
.mascot{margin-bottom:-40px!important}

/* ── 19. HEALTH ITEMS ── */
.health-item{padding:10px 12px!important;font-size:12.5px!important}

/* ── 20. GRADE PILLS / LETTERS ── */
.grade-pill{padding:8px 14px!important;font-size:14px!important}
.grade-letter{padding:6px 12px!important;font-size:12.5px!important}

/* ── 21. BUTTONS (global) ── */
.btn, .btn-sm, .btn-primary, .btn-danger, .btn-purple, .btn-gold, .btn-cyan, .btn-trade, .btn-logout, .mode-activate-btn, .addon-toggle{min-height:44px!important}
.btn-primary, .btn-danger, .btn-purple, .btn-gold, .btn-cyan{padding:12px 18px!important;font-size:14px!important}

/* ── 22. FORMS (global) ── */
input, select, textarea{font-size:15.5px!important;padding:12px 10px!important;min-height:44px!important;border-radius:6px!important}
input:focus, select:focus, textarea:focus{outline:2px solid var(--blue);outline-offset:2px}
.form-group input, .form-group select{width:100%!important;max-width:100%!important}

/* ── 23. TOUCH OPTIMIZATIONS ── */
button, a, .topnav-link, .topnav-dropdown-item, .faq-q, .report-card, .grade-pill, .grade-letter, .grade-pill-card, .btn-trade, .mode-card, .addon-card, .stat-card, .setup-mobile-card, .pos-mobile-card{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:active, .btn:active, .btn-sm:active, .btn-primary:active, .btn-trade:active, .grade-pill:active, .grade-letter:active, .grade-pill-card:active, .mode-card:active, .addon-card:active, .topnav-dropdown-item:active, .faq-q:active{transform:scale(0.98);opacity:0.9}
.pos-card:active, .report-card:active, .setup-mobile-card:active, .pos-mobile-card:active{transform:scale(0.99);background:var(--card)!important}
html{touch-action:manipulation;-webkit-text-size-adjust:100%}
body{-webkit-overflow-scrolling:touch}

/* Remove hover effects on touch devices (kept in @media for specificity) */
@media(hover:none) and (pointer:coarse){
    .stat-card:hover, .trading-bot-cell:hover, .setup-stat-card:hover, .grade-pill-card:hover, .grade-letter:hover, .report-card:hover, .addon-card:hover, .mode-card:hover, .pos-card:hover, tr:hover, .trade-btn:hover, .blk-btn:hover{transform:none!important;box-shadow:none!important}
    .stat-card:hover::before, .trading-bot-cell:hover::before, .setup-stat-card:hover::before, .grade-pill-card:hover::before{opacity:0!important}
    tr:hover td:first-child{border-left:none!important}
}

/* ── 24. VERY SMALL SCREENS (≤480px) ── */
@media(max-width:480px){
    .stats-grid{grid-template-columns:repeat(2,1fr)!important}

    .trading-bot-grid{grid-template-columns:repeat(2,1fr)!important}
    .setup-mobile-levels{grid-template-columns:repeat(2,1fr)!important}
    .admin-stat-grid{grid-template-columns:repeat(2,1fr)!important}
    .topnav-brand{font-size:11px}
    .topnav-brand img{height:32px!important}
    .modal-box{padding:14px!important;margin:4px auto!important}
    .modal-box h2{font-size:15.5px!important}
    .container{padding:6px 8px}
    .panel{padding:10px!important}
    .panel h2{font-size:14px!important}
    .grade-pill{padding:6px 10px!important;font-size:12.5px!important}
    .grade-letter{padding:5px 10px!important;font-size:12.5px!important}
    .btn-primary, .btn-danger, .btn-purple, .btn-gold, .btn-cyan{padding:10px 14px!important;font-size:12.5px!important}
    /* Trading control bar — abbreviated labels for very small screens */
    #botToggleLabel{font-size:0!important}
    #botToggleLabel::after{content:'BOT';font-size:7px!important}
    #papertradeToggleLabel{font-size:0!important}
    #papertradeToggleLabel::after{content:'PAPER';font-size:7px!important}
    #liveToggleLabel{font-size:0!important}
    #liveToggleLabel::after{content:'LIVE';font-size:7px!important}
}

/* ── 25. SMOOTH SCROLLING ── */
html{scroll-behavior:smooth}
.modal-box, .guide-modal, #botLogs{scroll-behavior:smooth}

/* ── 26. ANIMATION REDUCTION FOR MOTION-SENSITIVE USERS ── */
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}
    .modal-box, .guide-modal{animation:none!important}
}

/* Exchange card mobile fonts */
.exchange-card .ex-balance{font-size:11px!important}
.exchange-card .ex-stat-val{font-size:12.5px!important}
.exchange-card .ex-positions > div:first-child{font-size:11px!important}
.exchange-card .ex-pos-list{font-size:11px!important}
#exchangeCards .stats-grid{gap:6px!important}
.exchange-card{border-radius:8px!important}
.exchange-card > div:first-child > div:first-child span:nth-child(2){font-size:12.5px!important}
/* Trading activity mobile */
#botLogsPanel{padding:6px!important}
#botLogsPanel > div:first-child{padding-bottom:4px!important;margin-bottom:6px!important}
#botLogsPanel > div:first-child > div:first-child > span{font-size:11px!important}
#botLogsPanel > div:first-child > div:last-child{gap:4px!important}
#botLogsPanel > div:first-child > div:last-child button{padding:3px 6px!important;font-size:8px!important}
#tabTrades,#tabBotActivity{padding:3px 8px!important;font-size:11px!important;min-height:28px!important;border-radius:4px!important}
#tabTrades span,#tabBotActivity span{font-size:11px!important}
#activityTabTrades,#activityTabBot{max-height:calc(100vh - 280px)!important;font-size:11px!important}
#activityTabTrades > div[style*="font-size:11px;font-weight:700"],#activityTabBot > div[style*="font-size:11px;font-weight:700"]{font-size:11px!important;margin:4px 0 2px!important;padding-bottom:2px!important}
/* Mobile mode labels */
#exchangeModeLabel,#krakenModeLabel{font-size:11px!important;padding:1px 4px!important;border-radius:3px;background:rgba(59,130,246,.15)}

} /* END @media(max-width:768px) */

/* Sticky top navigation */
#topnavBar {
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* Login page - full cover for all screen sizes */
#loginPage {
  background: #000 !important;
}

/* Login page mobile fixes - ULTRA COMPACT */
@media (max-width: 768px) {
  #loginPage {
    padding: 0 !important;
    align-items: flex-start !important;
    min-width: 100vw !important;
  }
  .login-wrapper {
    padding: 8px 8px !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    width: 100% !important;
    border-radius: 0 !important;
    background: #000 !important;
    min-height: 100vh !important;
  }
  .login-wrapper h1 {
    font-size:14px !important;
    margin-bottom: 2px !important;
  }
  .login-wrapper h2 {
    font-size:11px !important;
    margin-bottom: 6px !important;
  }
  .login-wrapper .form-group {
    margin-bottom: 4px !important;
  }
  .login-wrapper input[type="text"],
  .login-wrapper input[type="password"],
  .login-wrapper input[type="email"] {
    padding: 5px 6px !important;
    font-size:12.5px !important;
    height: 32px !important;
  }
  .login-wrapper button[type="submit"] {
    padding: 6px !important;
    font-size:12.5px !important;
    height: 34px !important;
  }
  .login-wrapper .toggle-form {
    font-size:11px !important;
  }
  .login-wrapper p {
    font-size:11px !important;
    line-height: 1.2 !important;
    margin-bottom: 4px !important;
  }
  .login-wrapper label {
    font-size:11px !important;
    margin-bottom: 1px !important;
  }
}

/* Trading control positions display */
.trading-control-positions { display:flex; align-items:center; gap:6px; margin-left:auto; padding-right:12px; }
.trading-control-positions .pos-label { font-size:12.5px; font-weight:700; color:var(--muted); text-transform:uppercase; }
.trading-control-positions .pos-count { font-size:18px; font-weight:700; color:var(--text); }
.trading-control-positions .pos-max-label { font-size:11px; font-weight:700; color:var(--muted); margin-left:8px; }
.trading-control-positions .pos-max { font-size:18px; font-weight:700; color:var(--yellow); }

@media (max-width: 768px) {
    .trading-control-positions .pos-label { font-size:8px; }
    .trading-control-positions .pos-count { font-size:14px; }
    .trading-control-positions .pos-max-label { font-size:8px; margin-left:4px; }
    .trading-control-positions .pos-max { font-size:14px; }
}

/* ===== JACUZZI VIBE CONTAINER ===== */
.jacuzzi-vibe-wrap {
    width: 100%;
    padding: 0 0 12px 0;
}
.jacuzzi-vibe {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(10,10,15,0.9), rgba(20,20,35,0.95));
    border: 1px solid var(--border);
    backdrop-filter: blur(8px);
    flex-wrap: wrap;
    min-height: 52px;
}
.theme-light .jacuzzi-vibe {
    background: linear-gradient(135deg, #f0f2f5, #e2e8f0);
    border: 1px solid #e2e8f0;
}
.jacuzzi-vibe-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    flex-shrink: 0;
}
.jacuzzi-vibe-season {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size:12.5px;
    font-weight:700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: rgba(96,165,250,0.12);
    border: 1.5px solid rgba(96,165,250,0.35);
    color: var(--blue);
    white-space: nowrap;
    margin-top: 2px;
}
.jacuzzi-vibe-season.btc-season { background: rgba(251,191,36,0.12); border-color: rgba(251,191,36,0.35); color: var(--yellow); }
.jacuzzi-vibe-season.eth-season { background: rgba(96,165,250,0.12); border-color: rgba(96,165,250,0.35); color: var(--blue); }
.jacuzzi-vibe-season.alt-season { background: rgba(192,132,252,0.12); border-color: rgba(192,132,252,0.35); color: var(--purple); }
.jacuzzi-vibe-season.meme-season { background: rgba(255,100,100,0.12); border-color: rgba(255,100,100,0.35); color: var(--red); }
.jacuzzi-vibe-season.neutral { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.15); color: var(--muted); }
.jacuzzi-vibe-temp {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    margin-top: 2px;
}
.jacuzzi-vibe-temp .temp-dot {
    width: 8px; height: 8px; border-radius: 50%;
    display: inline-block;
}
.jacuzzi-vibe-temp.hot { color: var(--orange); }
.jacuzzi-vibe-temp.warm { color: var(--yellow); }
.jacuzzi-vibe-temp.cool { color: var(--cyan); }
.jacuzzi-vibe-temp.cold { color: var(--blue); }
.jacuzzi-vibe-temp.hot .temp-dot { background: var(--orange); box-shadow: 0 0 6px rgba(251,146,60,0.5); }
.jacuzzi-vibe-temp.warm .temp-dot { background: var(--yellow); box-shadow: 0 0 6px rgba(250,204,21,0.5); }
.jacuzzi-vibe-temp.cool .temp-dot { background: var(--cyan); box-shadow: 0 0 6px rgba(34,211,238,0.5); }
.jacuzzi-vibe-temp.cold .temp-dot { background: var(--blue); box-shadow: 0 0 6px rgba(96,165,250,0.5); }
.jacuzzi-vibe-center {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    flex: 1;
    justify-content: center;
    min-width: 200px;
}
.jacuzzi-vibe-fg {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    margin-top: 2px;
}
.jacuzzi-vibe-fg-bar-wrap {
    width: 100px;
    height: 6px;
    background: rgba(255,255,255,0.06);
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}
.theme-light .jacuzzi-vibe-fg-bar-wrap {
    background: rgba(0,0,0,0.08);
}
.jacuzzi-vibe-fg-bar {
    height: 100%;
    border-radius: 3px;
    transition: width 0.5s ease;
}
.jacuzzi-vibe-fg-val {
    font-size: 11px;
    font-weight:700;
    margin-top: 1px;
}
.jacuzzi-vibe-regime {
    font-size:11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 2px 8px;
    border-radius: 6px;
    white-space: nowrap;
    margin-top: 2px;
    display: inline-flex;
}
.jacuzzi-vibe-regime.trending_up { background: rgba(74,222,128,0.12); color: var(--green); }
.jacuzzi-vibe-regime.trending_down { background: rgba(248,113,113,0.12); color: var(--red); }
.jacuzzi-vibe-regime.choppy { background: rgba(250,204,21,0.12); color: var(--yellow); }
.jacuzzi-vibe-regime.ranging { background: rgba(96,165,250,0.12); color: var(--blue); }
.jacuzzi-vibe-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0;
    flex: 1;
    justify-content: center;
    min-width: 200px;
}
.jacuzzi-vibe-narrator {
    font-size:12.5px;
    font-weight: 600;
    color: var(--text);
    text-align: right;
    line-height: 1.4;
    max-width: 320px;
    margin-top: 2px;
}
.jacuzzi-vibe-hotcats {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 4px;
}
.jacuzzi-vibe-hotcat {
    font-size:11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 2px 7px;
    border-radius: 10px;
    background: rgba(255,100,100,0.1);
    border: 1px solid rgba(255,100,100,0.2);
    color: var(--orange);
    white-space: nowrap;
}
@media (max-width: 768px) {
    .jacuzzi-vibe { flex-direction: column; gap: 12px; padding: 12px 14px; }
    .jacuzzi-vibe-left { align-items: flex-start; width: 100%; }
    .jacuzzi-vibe-center { align-items: flex-start; width: 100%; }
    .jacuzzi-vibe-right { align-items: flex-start; width: 100%; }
    .jacuzzi-vibe-narrator { text-align: left; max-width: 100%; }
    .jacuzzi-vibe-hotcats { justify-content: flex-start; }
}

/* ═══ AI Chat Widget ═══ */
#chatWidget{position:fixed;top:92px;right:24px;z-index:300;font-family:'Inter',sans-serif}
#chatToggle{background:transparent;border:none;cursor:pointer;padding:4px;margin-left:8px;transition:transform .2s;display:flex;align-items:center;justify-content:center}
#chatToggle:hover img{box-shadow:0 0 12px rgba(34,211,238,.5);border-color:var(--cyan)}
#chatToggle:active{transform:scale(0.95)}
#chatWindow{display:none;position:absolute;top:68px;right:0;width:360px;max-height:500px;background:#12121a;border:1px solid rgba(255,255,255,0.08);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.6);overflow:hidden;flex-direction:column}
#chatWindow.open{display:flex}
#chatHeader{padding:14px 16px;background:linear-gradient(135deg,var(--cyan-dark),var(--cyan));color:#fff;display:flex;align-items:center;gap:10px;justify-content:space-between}
#chatHeader img{width:32px;height:32px;border-radius:50%;border:2px solid rgba(255,255,255,.3);object-fit:cover}
#chatHeader span{font-size:14px;font-weight:700}
#chatHeader .status{font-size:11px;opacity:.85;font-weight:500}
#chatHeader .chat-close-btn{background:transparent;border:none;color:#fff;font-size:22px;font-weight:700;cursor:pointer;padding:4px 8px;border-radius:6px;line-height:1;transition:background .2s;opacity:.85}
#chatHeader .chat-close-btn:hover{background:rgba(255,255,255,.2);opacity:1}
#chatMessages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;max-height:340px;background:#12121a}
.chat-msg{max-width:85%;padding:10px 14px;border-radius:14px;font-size:12.5px;line-height:1.5;word-break:break-word}
.chat-msg.user{align-self:flex-end;background:linear-gradient(135deg,var(--cyan-dark),var(--cyan));color:#fff;border-bottom-right-radius:4px}
.chat-msg.bot{align-self:flex-start;background:var(--bg);border:1px solid var(--border);color:var(--text);border-bottom-left-radius:4px}
.chat-msg .time{font-size:11px;opacity:.6;margin-top:4px}
#chatInputWrap{padding:10px 12px;border-top:1px solid rgba(255,255,255,0.06);display:flex;gap:8px;align-items:center;background:#12121a}
#chatInput{flex:1;padding:10px 14px;background:var(--bg);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:12.5px;outline:none;transition:border-color .2s}
#chatInput:focus{border-color:var(--cyan)}
#chatSend{width:36px;height:36px;border-radius:50%;background:var(--cyan);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s}
#chatSend:hover{transform:scale(1.1)}
#chatSend:active{transform:scale(0.95)}
#chatTyping{display:none;padding:4px 12px;font-size:12.5px;color:var(--muted);font-style:italic}
@media(max-width:768px){
    #chatWidget{top:84px;right:8px}
    #chatWindow{position:fixed;top:80px;left:8px;right:8px;width:auto;max-height:calc(100vh - 100px);border-radius:12px}
    #chatMessages{max-height:calc(100vh - 220px)}
    #chatHeader{padding:10px 12px}
    #chatHeader img{width:28px;height:28px}
    #chatInputWrap{padding:8px 10px}
    .chat-msg{font-size:12.5px;padding:8px 12px}
}
/* Tier cards */
.tier-card{position:relative;border-radius:16px;padding:26px;transition:transform .35s ease,box-shadow .35s ease;overflow:hidden}
.tier-card::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.12),transparent);transition:left .6s ease;pointer-events:none}
.tier-card:hover{transform:translateY(-8px);box-shadow:0 24px 48px rgba(0,0,0,0.5)}
.tier-card:hover::before{left:100%}

/* Starter — solid warm gold */
.tier-card-starter{background:linear-gradient(165deg,#2a1a00 0%,#1a0f00 60%,#120800 100%);border:2px solid #f59e0b;box-shadow:0 0 24px rgba(245,158,11,0.18),0 8px 32px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.06)}
.tier-card-starter:hover{box-shadow:0 0 36px rgba(245,158,11,0.32),0 24px 48px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.08)}

/* Pro — solid electric blue */
.tier-card-pro{background:linear-gradient(165deg,#001f3f 0%,#00152b 60%,#000e1a 100%);border:2px solid #0ea5e9;box-shadow:0 0 24px rgba(14,165,233,0.18),0 8px 32px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.06)}
.tier-card-pro:hover{box-shadow:0 0 36px rgba(14,165,233,0.32),0 24px 48px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.08)}

/* 70% OFF ribbon */
.tier-ribbon{position:absolute;top:14px;right:-42px;width:160px;text-align:center;background:linear-gradient(135deg,#ff3b3b,#ff6b35);color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:5px 0;transform:rotate(35deg);box-shadow:0 2px 10px rgba(255,0,0,0.4);z-index:3;text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.tier-ribbon::before{content:'';position:absolute;left:0;top:0;border-left:6px solid transparent;border-bottom:6px solid #c41e1e;border-right:none}
.tier-ribbon::after{content:'';position:absolute;right:0;bottom:0;border-left:none;border-top:6px solid #c41e1e;border-right:6px solid transparent}

.tier-badge-pop{position:absolute;top:-1px;right:-1px;padding:6px 16px;border-radius:0 14px 0 12px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#fff;z-index:2;text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.tier-badge-pop::after{content:'';position:absolute;inset:0;border-radius:0 14px 0 12px;box-shadow:0 0 14px currentColor;opacity:0.5;z-index:-1}

.tier-price{font-size:28px;font-weight:700;color:#fff;letter-spacing:-2px;text-shadow:0 2px 10px rgba(0,0,0,0.4),0 0 20px rgba(255,255,255,0.1)}
.tier-price-strike{font-size:15.5px;color:rgba(255,255,255,0.35);text-decoration:line-through;font-weight:700}
.tier-price-period{font-size:15.5px;color:rgba(255,255,255,0.55);font-weight:600}
.tier-offer-row{font-size:12.5px;font-weight:700;padding:6px 14px;border-radius:8px;display:inline-block;margin:8px 0 12px;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.tier-card-starter .tier-offer-row{background:linear-gradient(135deg,rgba(245,158,11,0.2),rgba(245,158,11,0.1));color:#fbbf24;border:1px solid rgba(245,158,11,0.4);text-shadow:0 0 6px rgba(245,158,11,0.3)}
.tier-card-pro .tier-offer-row{background:linear-gradient(135deg,rgba(14,165,233,0.2),rgba(14,165,233,0.1));color:#7dd3fc;border:1px solid rgba(14,165,233,0.4);text-shadow:0 0 6px rgba(14,165,233,0.3)}
.tier-features{list-style:none;padding:0;margin:0 0 20px;font-size:14px;line-height:2.4}
.tier-features li{display:flex;align-items:center;gap:10px;padding:2px 0}
.tier-features li:nth-child(odd){background:rgba(255,255,255,0.02);border-radius:4px;padding:2px 8px;margin:0 -8px}
.tier-features .yes{color:#4ade80;font-size:15.5px;text-shadow:0 0 6px rgba(74,222,128,0.25)}
.tier-features .no{color:#f87171;font-size:15.5px;opacity:0.7}
.tier-features .feat-text{color:rgba(255,255,255,0.8);font-weight:500}

.tier-btn-starter{width:100%;padding:14px;font-size:15.5px;font-weight:700;border-radius:12px;background:linear-gradient(135deg,#f59e0b,#d97706);border:none;color:#1a0a00;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 6px 20px rgba(245,158,11,0.35);text-transform:uppercase;letter-spacing:0.5px;text-shadow:none}
.tier-btn-starter:hover{transform:scale(1.03) translateY(-2px);box-shadow:0 8px 30px rgba(245,158,11,0.55)}
.tier-btn-pro{width:100%;padding:14px;font-size:15.5px;font-weight:700;border-radius:12px;background:linear-gradient(135deg,#0ea5e9,#0284c7);border:none;color:#fff;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 6px 20px rgba(14,165,233,0.35);text-transform:uppercase;letter-spacing:0.5px}
.tier-btn-pro:hover{transform:scale(1.03) translateY(-2px);box-shadow:0 8px 30px rgba(14,165,233,0.55)}

.tier-name{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:2px;margin-bottom:8px}
.tier-name-starter{color:#fbbf24;text-shadow:0 0 10px rgba(251,191,36,0.25)}
.tier-name-pro{color:#7dd3fc;text-shadow:0 0 10px rgba(125,211,252,0.25)}
.tier-subtitle{font-size:14px;color:rgba(255,255,255,0.6);margin:0 0 16px;line-height:1.5;font-weight:500}
.tier-label-tag{font-size:11px;font-weight:700;padding:3px 10px;border-radius:6px;text-transform:uppercase;letter-spacing:0.5px;margin-left:8px;vertical-align:middle}
.tier-label-tag-starter{background:linear-gradient(135deg,rgba(251,191,36,0.2),rgba(251,191,36,0.1));color:#fbbf24;border:1px solid rgba(251,191,36,0.4);box-shadow:0 0 8px rgba(251,191,36,0.15)}
.tier-label-tag-pro{background:linear-gradient(135deg,rgba(125,211,252,0.2),rgba(125,211,252,0.1));color:#7dd3fc;border:1px solid rgba(125,211,252,0.4);box-shadow:0 0 8px rgba(125,211,252,0.15)}
@media(max-width:768px){.tier-card{padding:20px}.tier-price{font-size:28px}.tier-ribbon{top:10px;right:-38px;width:140px;font-size:11px;padding:4px 0;transform:rotate(33deg)}}

/* Glowing promo banner */
.promo-banner{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:20px;background:linear-gradient(135deg,#ff6b35,#f7931a);color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;cursor:pointer;text-decoration:none;animation:pulseGlow 2s ease-in-out infinite;white-space:nowrap;flex-shrink:0;margin-left:8px;box-shadow:0 0 12px rgba(255,107,53,0.4)}
.promo-banner:hover{animation:none;transform:scale(1.05);box-shadow:0 0 20px rgba(255,107,53,0.6)}
.promo-banner .fire-emoji{font-size:12.5px}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 8px rgba(255,107,53,0.3)}50%{box-shadow:0 0 18px rgba(255,107,53,0.6)}}
@media(max-width:768px){.promo-banner{padding:4px 10px;font-size:11px;margin-left:4px}.promo-banner .fire-emoji{font-size:11px}}

#chatToggle:hover img{box-shadow:0 0 12px rgba(34,211,238,.5);border-color:var(--cyan)}
#chatToggle:active{transform:scale(0.95)}

/* ── AUTO-INJECTED: CSS-in-JS fixes ── */
.toast-notification{position:fixed;z-index:9999;padding:10px 24px;border-radius:8px;font-size:12.5px;font-weight:700;transition:opacity .3s}
.toast-notification.toast-copy{bottom:20px;left:50%;transform:translateX(-50%);background:rgba(74,222,128,.9);color:#000}
.toast-notification.toast-top-right{top:20px;right:20px;color:#fff;font-family:sans-serif;padding:12px 18px;box-shadow:0 4px 12px rgba(0,0,0,0.3);transition:opacity 0.3s}
.toast-notification.toast-bottom-right{bottom:20px;right:20px;color:#fff;padding:12px 20px;font-weight:600;z-index:10000;animation:fadeIn 0.3s ease}
.payment-banner{position:fixed;top:0;left:0;right:0;z-index:9999;padding:12px 20px;text-align:center;font-weight:600;cursor:pointer}
.bg-canvas-holder{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none;overflow:hidden}
.paper-save-toast{position:fixed;bottom:20px;right:20px;z-index:10001;padding:10px 18px;border-radius:10px;background:linear-gradient(135deg,var(--green),#16a34a);color:#fff;font-size:12.5px;font-weight:700;box-shadow:0 4px 16px rgba(34,197,94,0.45);transform:translateY(100px);opacity:0;transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .25s ease;pointer-events:none;display:flex;align-items:center;gap:8px}
.paper-save-toast.show{transform:translateY(0);opacity:1}
@keyframes fadeOut{from{opacity:1}to{opacity:0}}

/* ===== MARKET PHASE PANEL (dashboard top) ===== */
.phase-panel{width:100%;margin-bottom:10px;padding:10px 14px;border-radius:12px;background:linear-gradient(135deg,rgba(10,10,18,0.92),rgba(18,22,40,0.95));border:1px solid var(--border);backdrop-filter:blur(8px);box-sizing:border-box}
.theme-light .phase-panel{background:linear-gradient(135deg,#f0f2f5,#e2e8f0);border:1px solid #e2e8f0}
.phase-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding:0 2px}
.phase-title{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:var(--text)}
.phase-updated{font-size:11px;color:var(--muted)}
.phase-stale-warn{font-size:11px;font-weight:700;color:var(--yellow);padding:1px 6px;border-radius:4px;background:rgba(250,204,21,0.12);border:1px solid rgba(250,204,21,0.35);animation:phasePulse 1.6s ease-in-out infinite}
@keyframes phasePulse{0%,100%{opacity:1}50%{opacity:0.45}}
.phase-body{display:flex;gap:12px;align-items:stretch;flex-wrap:wrap}
.phase-regime-block{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;min-width:150px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,0.03);border:1px solid var(--border);flex-shrink:0}
.phase-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px;font-weight:700}
.phase-regime-badge{font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:1px;line-height:1.1;padding:2px 0}
.phase-regime-badge.bull{color:var(--green);text-shadow:0 0 14px rgba(74,222,128,0.45)}
.phase-regime-badge.bear{color:var(--red);text-shadow:0 0 14px rgba(248,113,113,0.45)}
.phase-regime-badge.transition{color:var(--yellow);text-shadow:0 0 14px rgba(250,204,21,0.45)}
.phase-regime-sub{font-size:11px;color:var(--muted);font-weight:600}
.phase-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:6px;flex:1;min-width:280px}
.phase-tile{padding:6px 8px;border-radius:8px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-left:3px solid var(--muted);display:flex;flex-direction:column;gap:1px;min-width:0}
.phase-tile.st-ok{border-left-color:var(--green)}
.phase-tile.st-warn{border-left-color:var(--yellow)}
.phase-tile.st-bad{border-left-color:var(--red)}
.phase-tile.st-stale{border-left-color:var(--muted);opacity:0.6}
.phase-tile-name{font-size:8px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:0.4px;white-space:nowrap}
.phase-tile-val{font-size:12.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phase-tile-sub{font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phase-tile.st-ok .phase-tile-sub{color:var(--green)}
.phase-tile.st-warn .phase-tile-sub{color:var(--yellow)}
.phase-tile.st-bad .phase-tile-sub{color:var(--red)}
.phase-jacuzzi-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,0.06)}
.theme-light .phase-jacuzzi-line{border-top:1px solid rgba(0,0,0,0.08)}
.phase-jz-badge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;padding:3px 10px;border-radius:14px;white-space:nowrap}
.phase-jz-badge.risk-on{background:rgba(74,222,128,0.14);border:1px solid rgba(74,222,128,0.4);color:var(--green)}
.phase-jz-badge.risk-off{background:rgba(248,113,113,0.14);border:1px solid rgba(248,113,113,0.4);color:var(--red)}
.phase-jz-badge.limbo{background:rgba(250,204,21,0.14);border:1px solid rgba(250,204,21,0.4);color:var(--yellow)}
.phase-jz-item{font-size:11px;font-weight:600;color:var(--text);white-space:nowrap}
.phase-jz-item.shock-on{color:var(--red);font-weight:700}
.phase-jz-narrator{font-size:11px;color:var(--muted);font-style:italic;flex:1;min-width:160px;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:768px){.phase-regime-badge{font-size:18px}.phase-jz-narrator{text-align:left}}
/* ===== BOT WAIT-MODE BANNER (My Trading Activity) ===== */
.bot-wait-banner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;padding:8px 12px;border-radius:10px;background:linear-gradient(135deg,rgba(250,204,21,0.10),rgba(251,146,60,0.06));border:1px solid rgba(250,204,21,0.35)}
.bot-wait-title{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--yellow);white-space:nowrap}
.bot-wait-reason{font-size:11px;color:var(--text);line-height:1.4}
.bot-wait-reason b{color:var(--orange)}

/* ═══ QmHelp — glowing section help (? button + intro modal + hover tips) ═══ */
.qm-help-btn{width:34px;height:34px;border-radius:50%;background:rgba(0,200,255,.15);border:2px solid rgba(0,200,255,.45);color:#7dd3fc;font-size:18px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0;box-shadow:0 0 12px rgba(0,200,255,.35);animation:qmHelpPulse 2.2s ease-in-out infinite;font-family:inherit;line-height:1;padding:0;user-select:none;-webkit-user-select:none;vertical-align:middle}
.qm-help-btn:hover{background:rgba(0,200,255,.3);border-color:rgba(0,200,255,.75);transform:scale(1.12);box-shadow:0 0 22px rgba(0,200,255,.55);color:#fff}
.qm-help-btn.qm-active{background:rgba(0,200,255,.35);color:#fff;animation:none;box-shadow:0 0 24px rgba(0,200,255,.7)}
@keyframes qmHelpPulse{0%,100%{box-shadow:0 0 10px rgba(0,200,255,.3)}50%{box-shadow:0 0 20px rgba(0,200,255,.55)}}
.qm-help-modal{position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;z-index:10000;opacity:0;transition:opacity .25s ease}
.qm-help-modal.show{display:flex;opacity:1}
.qm-help-box{background:var(--card,#12121a);border:2px solid rgba(0,200,255,.35);border-radius:18px;padding:26px 28px;max-width:440px;width:92%;max-height:85vh;overflow-y:auto;color:var(--text,#e0e0e0);position:relative;box-shadow:0 0 40px rgba(0,200,255,.15)}
.qm-help-box h2{font-size:18px;font-weight:700;color:var(--text-bright,#fff);margin:0 0 12px;display:flex;align-items:center;gap:10px}
.qm-help-box p{font-size:12.5px;line-height:1.7;margin:0 0 10px;color:var(--text,#e0e0e0)}
.qm-help-box .qm-hint{font-size:12.5px;color:#7dd3fc;background:rgba(0,200,255,.08);border:1px solid rgba(0,200,255,.25);border-radius:8px;padding:8px 12px;margin-top:6px;line-height:1.5}
.qm-help-close{position:absolute;top:10px;right:14px;background:none;border:none;color:var(--text,#fff);font-size:22px;cursor:pointer;opacity:.6;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s;line-height:1;padding:0}
.qm-help-close:hover{opacity:1;background:rgba(255,255,255,.1)}
/* Tip mode: dashed glow outline on key cards + floating tooltip */
body.qm-tips-on [data-qm-tip]{outline:2px dashed rgba(0,200,255,.55);outline-offset:3px;cursor:help}
#qmTip{position:fixed;z-index:10001;background:rgba(10,14,23,.95);border:1px solid rgba(0,200,255,.45);border-radius:10px;padding:10px 14px;font-size:12.5px;line-height:1.6;color:#e0f2fe;max-width:280px;pointer-events:none;display:none;box-shadow:0 8px 30px rgba(0,0,0,.5),0 0 16px rgba(0,200,255,.2)}
@media(max-width:768px){.qm-help-btn{width:30px;height:30px;font-size:15.5px}.qm-help-box{padding:22px 20px}}

/* ─── Mobile hardening pass (Jul 2026) ─── */
@media(max-width:768px){
    html,body{overflow-x:hidden;max-width:100vw}
    .section{padding-left:8px;padding-right:8px}
    .panel{padding:14px 12px}
    /* Wide data tables scroll horizontally instead of breaking layout */
    .section table,.panel table,.card table{max-width:100%}
    .section table,.panel table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;border-collapse:collapse}
    .section table td,.section table th,.panel table td,.panel table th{white-space:nowrap}
    /* Tap targets */
    .btn,.btn-primary,.btn-danger,.btn-purple,.btn-gold,.btn-cyan,.btn-sm,.trading-control-btn{min-height:40px}
    /* Form controls never overflow */
    input,select,textarea{max-width:100%}
    select{max-width:100%;text-overflow:ellipsis}
    /* Flex toolbars wrap instead of overflowing */
    .panel>div[style*="display:flex"],.section>div[style*="display:flex"]{flex-wrap:wrap}
    /* Headings scale down */
    h2{font-size:18px!important}
    h3{font-size:15.5px!important}
    /* Modals fit viewport */
    .modal-box,.modal-content{width:95vw!important;max-width:95vw!important;max-height:88vh;overflow-y:auto;margin:0 auto}
    .modal-overlay{padding:10px}
    /* Topnav dropdown fits screen */
    #topnavDropdown{right:4px;left:auto;max-width:calc(100vw - 16px)}
    .topnav-brand img{max-width:170px!important}
    /* Images never overflow */
    img{max-width:100%;height:auto}
    /* Chat / overlay panels */
    #chatPanel,#robChatPanel{max-width:calc(100vw - 12px)}
    /* Setup rows & pill bars scroll */
    .pos-filter-pill{min-height:40px;display:inline-flex;align-items:center}
}
@media(max-width:480px){
    .stats-grid{grid-template-columns:1fr!important}
    .setup-stats-grid{grid-template-columns:1fr!important}
    h2{font-size:18px!important}
    .panel{padding:12px 10px}
    .topnav-brand img{max-width:140px!important}
    #topnavHamburger{min-width:44px;min-height:44px}
    .btn,.btn-primary,.btn-danger,.btn-purple,.btn-gold,.btn-cyan{font-size:12.5px}
    input,select,textarea{font-size:15.5px} /* prevent iOS zoom-on-focus */
}

/* ===== DESIGN REVIEW CLEANUP (Jul 2026) — visual only ===== */
/* Theme-matched thin scrollbars everywhere (kills white native scrollbars in log panels) */
*{scrollbar-width:thin;scrollbar-color:#3a3f55 transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-thumb{background:#3a3f55;border-radius:4px}
*::-webkit-scrollbar-thumb:hover{background:#4a5068}
*::-webkit-scrollbar-track{background:transparent}

/* Trade Schedule: keep time values fully visible, hide space-hogging picker icon */
#tradeSchedulePanel input[type="time"]{width:82px!important;padding:3px 6px!important}
#tradeScheduleGrid input[type="time"]{width:78px!important}
#tradeSchedulePanel input[type="time"]::-webkit-calendar-picker-indicator{display:none}

/* Papertrade: balance Execution block into a tidy 2x2 grid on desktop (mobile keeps 1 col) */
@media(min-width:769px){
    .paper-exec-grid{grid-template-columns:repeat(2,1fr)!important}
}

/* Subscribe: keep the Best Value corner badge clear of the "3 Months" title */
.tier-card-pro .tier-name{padding-left:104px}

/* Toolbox cards: stretch to equal height, pin the tier label to the bottom */
#addonsGrid{align-items:stretch}
#addonsGrid .addon-card{display:flex;flex-direction:column}
#addonsGrid .addon-card>div:last-child{margin-top:auto}

/* Admin Logo & Icons: wider fields, left-aligned readable values */
#adminIconPanel input[type="text"]{font-size:12.5px!important;text-align:left!important}
#adminIconPanel div[style*="minmax(180px"]{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important}

/* File pickers: match the dark theme instead of default white buttons */
input[type="file"]{font-size:12px;color:var(--muted)}
input[type="file"]::file-selector-button{background:var(--card);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:5px 12px;font-size:12px;font-family:inherit;cursor:pointer;margin-right:10px}
input[type="file"]::file-selector-button:hover{border-color:var(--cyan);color:var(--cyan)}

/* Image Manager: symbol field wide enough for its placeholder */
#iconSymbolInput{width:175px!important;font-size:13px!important}

/* Trade Schedule on small screens: 4 columns, inputs stack inside day cards */
@media(max-width:768px){
    #tradeScheduleGrid{grid-template-columns:repeat(4,1fr)!important}
    #tradeScheduleGrid input[type="time"]{width:78px!important;min-width:0}
}

/* Trading control bar on small screens: wrap into two tidy rows instead of overlapping */
@media(max-width:480px){
    .trading-control-bar{flex-wrap:wrap!important;overflow-x:visible!important}
    .trading-control-btn{flex:1 1 30%!important;font-size:11px!important;padding:8px 4px!important;min-height:38px!important}
    .trading-control-bar .trading-control-positions{order:5;flex:1 1 100%!important;justify-content:center!important;margin-top:4px}
    .trading-control-bar .trading-control-positions span:first-child{font-size:11px!important}
    .trading-control-bar .trading-control-positions span:first-child::after{content:''!important}
}


/* ═══ Market Intel: time-context chips + phase-panel upgrades (2026-07-21) ═══ */
.md-chip-row{display:flex;gap:4px;margin-top:3px;flex-wrap:wrap;justify-content:center}
.md-chip{font-size:9px;font-weight:700;padding:1px 5px;border-radius:5px;white-space:nowrap;line-height:1.5}
.md-chip.up{color:var(--green);background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.25)}
.md-chip.down{color:var(--red);background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.25)}
.md-chip.flat{color:var(--muted);background:rgba(148,163,184,.08);border:1px solid rgba(148,163,184,.2)}
.phase-tile-why{font-size:9px;color:var(--muted);line-height:1.3;margin-top:2px}
.phase-summary{margin-top:8px;padding:8px 12px;border-radius:8px;background:rgba(96,165,250,.07);border:1px solid rgba(96,165,250,.18);font-size:12px;color:var(--text);line-height:1.45}
.phase-summary b{color:var(--blue)}

/* ═══ Account Command Center (dashboard) ═══ */
.cmd-acct{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.cmd-stat{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:8px;padding:8px 10px;text-align:center}
.cmd-stat-label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:700}
.cmd-stat-val{font-size:17px;font-weight:700;margin-top:2px}
.cmd-stat-sub{font-size:10px;color:var(--muted);margin-top:1px}
.cmd-bot-strip{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:10px;padding-top:8px;border-top:1px solid var(--border);font-size:11px;color:var(--muted)}
.cmd-bot-item b{margin-left:4px}
.cmd-riskbar{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:8px;padding:8px;border-radius:8px;background:rgba(255,255,255,.02);border:1px solid var(--border);font-size:11.5px;color:var(--muted)}
.cmd-risk-item b{margin-left:4px;color:var(--text)}
.cmd-sub-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.8px;margin:12px 0 6px;display:flex;align-items:center;gap:6px}
.cmd-sub-label::after{content:'';flex:1;height:1px;background:var(--border)}
.cmd-pos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:8px}
.cmd-pos-card{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:11.5px}
.cmd-pos-head{display:flex;align-items:center;gap:6px;margin-bottom:6px;flex-wrap:wrap}
.cmd-pos-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:2px}
@media (max-width:768px){
    .cmd-acct{grid-template-columns:repeat(2,1fr)}
    .cmd-pos-grid{grid-template-columns:1fr}
    .cmd-bot-strip{gap:8px}
}

/* ═══ Spot Market overview (CoinMarketCap-style top 100) ═══ */
.spot-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.spot-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.spot-table thead th{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:10px 10px;border-bottom:1px solid var(--border);white-space:nowrap;text-align:left}
.spot-table tbody td{padding:10px;border-bottom:1px solid rgba(255,255,255,.04);white-space:nowrap;vertical-align:middle}
.spot-table tbody tr{transition:background .15s}
.spot-table tbody tr:hover{background:rgba(255,255,255,.035)}
.spot-col-star{width:36px;text-align:center}
.spot-col-rank{width:44px;color:var(--muted);font-family:var(--font-num);font-variant-numeric:tabular-nums}
.spot-col-price,.spot-col-1h,.spot-col-24h,.spot-col-7d,.spot-col-vol,.spot-col-mcap{text-align:right;font-family:var(--font-num);font-variant-numeric:tabular-nums}
.spot-col-spark{text-align:right}
.spot-star{display:inline-flex;cursor:pointer;padding:3px;border-radius:6px;transition:transform .12s}
.spot-star:hover{transform:scale(1.18)}
.spot-star svg{width:15px;height:15px;fill:none;stroke:var(--muted);stroke-width:1.7;stroke-linejoin:round;transition:all .15s}
.spot-star.on svg{fill:var(--yellow);stroke:var(--yellow);filter:drop-shadow(0 0 4px rgba(250,204,21,.45))}
.spot-coin-cell{display:flex;align-items:center;gap:9px}
.spot-coin-icon{display:inline-flex;width:20px;height:20px;flex-shrink:0;border-radius:50%}
.spot-coin-icon span{width:20px!important;height:20px!important}
.spot-coin-icon img{width:20px!important;height:20px!important}
.spot-coin-name{font-weight:600;color:var(--text)}
.spot-coin-sym{color:var(--muted);font-size:11px;font-weight:700}
.spot-pct{font-weight:600}
.spot-pct .spot-tri{font-size:8px;margin-right:3px}
.spot-up{color:var(--green)}
.spot-down{color:var(--red)}
.spot-spark{display:block;margin-left:auto}
.spot-stale-badge{align-items:center;gap:5px;font-size:10px;font-weight:700;color:var(--yellow);background:rgba(250,204,21,.1);border:1px solid rgba(250,204,21,.3);border-radius:6px;padding:3px 8px;letter-spacing:.5px}
@media(max-width:900px){
    #spot .spot-col-1h,#spot .spot-col-spark{display:none}
}
@media(max-width:560px){
    #spot .spot-col-7d,#spot .spot-col-vol{display:none}
    .spot-table{min-width:540px;font-size:11px}
    .spot-table thead th,.spot-table tbody td{padding:8px 4px!important}
    .spot-coin-cell{gap:6px}
    .spot-coin-name{max-width:52px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
    .spot-coin-sym{font-size:10px}
    .spot-star svg{width:13px;height:13px}
    .spot-col-star{width:26px}
    .spot-col-rank{width:28px}
}

/* ═══════════════════════════════════════════════════════════════════
   DESIGN CONSISTENCY PASS — 2026-07-22 (visual only, no markup logic)
   One card silhouette, one section-title pattern, readable phase tiles,
   neutral 'All' filter, tabular figures in tables.
   ═══════════════════════════════════════════════════════════════════ */

/* 1. Unified card silhouette: stat cards match the panel/card radius */
.stat-card{border-radius:var(--card-radius,14px)}
.phase-tile{border-radius:10px}

/* 2. One section-title pattern across SPA sections: left-aligned,
      icon+text on one baseline (matches Scanner/Spot headers) */
#positions .panel h2,
#ai .panel h2,
#trading .panel h2{
    text-align:left!important;
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;
    margin:0 0 8px;
}
#positions .panel h2 .ic, #ai .panel h2 .ic, #trading .panel h2 .ic{font-size:20px}

/* 3. Market Phase tiles: breathe — wider minimum, legible microcopy */
.phase-tiles{grid-template-columns:repeat(auto-fit,minmax(122px,1fr));gap:8px}
.phase-tile{padding:8px 10px;gap:2px}
.phase-tile-name{font-size:9.5px;letter-spacing:.5px}
.phase-tile-why{font-size:10.5px;line-height:1.35}

/* 4. 'All' grade filter: neutral active state (red is for danger/short) */
#gradeFilterCompact .grade-letter.grade-f.active{
    background:rgba(148,163,184,.16)!important;
    color:var(--text)!important;
    border-color:#8a94a6!important;
    box-shadow:0 0 10px rgba(148,163,184,.22)!important;
    animation:none!important;
}

/* 5. Tabular figures for every table cell so numeric columns don't jitter */
td{font-variant-numeric:tabular-nums}

/* 6. Small screens: keep the unified title pattern compact */
@media (max-width:768px){
    #positions .panel h2, #ai .panel h2, #trading .panel h2{gap:8px;margin-bottom:6px}
    .phase-tiles{grid-template-columns:repeat(auto-fit,minmax(108px,1fr))}
}

/* ═══════════════════════════════════════════════════════════════════
   SESSION 2 — Papertrade compact grid, market-data card equalizer,
   calmer scanner trade buttons (visual only)
   ═══════════════════════════════════════════════════════════════════ */

/* Papertrade container: content-sized fields on a clean flex grid */
.pt-panel{padding:14px 16px}
.pt-section{margin-bottom:12px}
.pt-title{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
.pt-row{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end}
.pt-field{display:flex;flex-direction:column;gap:2px;flex:0 0 auto}
.pt-field>label{font-size:11px;color:var(--muted);white-space:nowrap}
.pt-row select,.pt-row input[type="number"]{padding:5px 8px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:12.5px;font-family:inherit;height:30px;box-sizing:border-box}
.pt-in-xs{width:76px}
.pt-in-sm{width:110px}
.pt-in-md{width:168px}
.pt-strip{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px;padding:6px 10px;background:var(--card);border:1px solid var(--border);border-radius:8px}
.pt-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px}
.pt-save{padding:6px 14px;background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.4);color:var(--blue);border-radius:8px;font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit;transition:background .15s;white-space:nowrap}
.pt-save:hover{background:rgba(59,130,246,.22)}

/* Market data cards: even heights so the row renders flat */
#dashStatsMarket .stat-card{min-height:92px;justify-content:center}

/* Calmer scanner TRADE buttons (inline styles overridden intentionally) */
.setup-col-trade .trade-btn{
    background:transparent!important;color:var(--green)!important;
    border:1px solid rgba(74,222,128,.45)!important;box-shadow:none!important;
    padding:3px 9px!important;font-size:11px!important;border-radius:6px!important;
}
.setup-col-trade .trade-btn:hover{background:rgba(74,222,128,.12)!important;box-shadow:none!important}

@media(max-width:768px){
    .pt-panel{padding:12px}
    .pt-row{gap:8px 10px}
    .pt-field{flex:0 1 auto}
    .pt-field:has(.pt-in-md){flex:1 1 calc(50% - 8px)}
    .pt-in-md{width:100%;min-width:140px}
    .pt-footer{justify-content:center}
}

/* ===== Session 3 (2026-07-22) ===== */

/* Push all SPA sections 8px down from the top bar */
.section{padding-top:8px}

/* Scanner: BLOCK column — red circle with white X (overrides JS inline styles) */
.blk-btn{
    color:transparent!important;font-size:0!important;
    background:linear-gradient(135deg,#ef4444,#dc2626)!important;
    border:none!important;box-shadow:0 0 4px rgba(239,68,68,.5)!important;
    position:relative!important;
}
.blk-btn::before,.blk-btn::after{
    content:'';position:absolute;background:#fff;border-radius:1px;
    width:10px;height:2px;top:50%;left:50%;margin:-1px 0 0 -5px;
}
.blk-btn::before{transform:rotate(45deg)}
.blk-btn::after{transform:rotate(-45deg)}
.blk-btn:hover{background:linear-gradient(135deg,#f87171,#ef4444)!important}

/* Scanner: uniform grade badges in the setups table */
.setup-col-grade .grade{
    display:inline-flex;align-items:center;justify-content:center;
    min-width:36px;padding:2px 4px;font-size:11px;
    border-width:1px!important;box-shadow:none!important;animation:none!important;
}

/* Gold-outline save button variant (Binance panel) */
.pt-save-gold{background:rgba(240,185,11,.12);border-color:rgba(240,185,11,.45);color:var(--yellow)}
.pt-save-gold:hover{background:rgba(240,185,11,.22)}

/* Control bar on very small screens: keep buttons legible (overrides the 7px 768px rule) */
@media(max-width:360px){
    .trading-control-btn{font-size:10px!important;padding:4px 6px!important;min-height:32px!important}
}

/* ═══ SESSION 4: Command Center — Market Snapshot & Recent Fills aligned column grids ═══ */
.cmd-grid-table{display:flex;flex-direction:column;gap:4px}
.cmd-grid-head,.cmd-grid-row{display:grid;gap:8px;align-items:center;padding:5px 8px}
.cmd-grid-head{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);padding:2px 8px 4px;border-bottom:1px solid var(--border)}
.cmd-grid-head .cmd-num{text-align:right}
.cmd-grid-row{font-size:12px;font-variant-numeric:tabular-nums}
.cmd-mkt-rows .cmd-grid-row{background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:6px}
.cmd-fills-rows{gap:0}
.cmd-fills-rows .cmd-grid-row{border-bottom:1px solid rgba(255,255,255,.05)}
.cmd-grid-row .cmd-num{text-align:right}
.cmd-mkt-grid{grid-template-columns:minmax(88px,1.15fr) minmax(88px,1fr) minmax(72px,.85fr) minmax(82px,.95fr) minmax(86px,1fr)}
.cmd-fills-grid{grid-template-columns:minmax(88px,1.05fr) minmax(92px,1.1fr) minmax(52px,.65fr) minmax(74px,.85fr) minmax(80px,.95fr) minmax(64px,.75fr)}
@media(max-width:640px){
    .cmd-hide-sm{display:none!important}
    .cmd-mkt-grid{grid-template-columns:minmax(80px,1.2fr) minmax(82px,1fr) minmax(68px,.9fr) minmax(80px,1fr)}
    .cmd-fills-grid{grid-template-columns:minmax(82px,1.05fr) minmax(88px,1.15fr) minmax(50px,.7fr) minmax(78px,1fr)}
    .cmd-grid-head,.cmd-grid-row{gap:6px;padding-left:6px;padding-right:6px}
}

/* ═══ SESSION 4b: Dashboard equity curve (performance-page design) + range selector ═══ */
.eq-range-bar{display:inline-flex;gap:4px}
.eq-range-btn{font-size:10.5px;font-weight:700;padding:3px 10px;border-radius:6px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;letter-spacing:.4px}
.eq-range-btn:hover{color:var(--text);border-color:var(--text)}
.eq-range-btn.active{background:rgba(74,222,128,.12);color:var(--green);border-color:rgba(74,222,128,.35)}
.eq-chart-box{position:relative;height:220px}
@media(max-width:640px){
    .eq-chart-box{height:170px}
    .eq-range-btn{padding:3px 8px;font-size:10px}
}
