/* ═══════════════════════════════════════════════════
   cclog — MISSION CONTROL
   Dense. Monospace. Phosphor glow. For nerds.
   ═══════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Geist+Mono:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');

:root {
    --void: #050508;
    --bg: #0a0c0f;
    --bg1: #0e1014;
    --bg2: #131619;
    --bg3: #1a1d22;
    --bg4: #22262c;

    --green: #00e87b;
    --green-dim: #00b862;
    --green-ghost: rgba(0, 232, 123, 0.06);
    --green-glow: rgba(0, 232, 123, 0.12);
    --green-flare: rgba(0, 232, 123, 0.25);

    --amber: #ffb020;
    --amber-dim: #cc8800;
    --amber-ghost: rgba(255, 176, 32, 0.06);
    --amber-glow: rgba(255, 176, 32, 0.12);

    --red: #ff3b5c;
    --red-ghost: rgba(255, 59, 92, 0.08);
    --cyan: #00d4ff;
    --cyan-ghost: rgba(0, 212, 255, 0.08);
    --cyan-dim: #0099bb;

    --w: #eaecf0;
    --w2: #b4b9c4;
    --w3: #8a90a0;
    --w4: #636a7a;
    --w5: #3a4050;

    --font: 'Geist Mono', 'SF Mono', 'Consolas', monospace;
    --font-display: 'Share Tech Mono', 'Geist Mono', monospace;

    --sidebar-w: 200px;
}

/* ── Reset ─────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;-webkit-font-smoothing:antialiased}
body{font-family:var(--font);background:var(--bg);color:var(--w);line-height:1.5;min-height:100vh}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}

/* ── Scanlines + grid ──────────────── */
.noise-overlay {
    position:fixed;inset:0;z-index:9999;pointer-events:none;
    background:
        repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,232,123,0.015) 2px, rgba(0,232,123,0.015) 4px),
        repeating-linear-gradient(90deg, transparent, transparent 100px, rgba(0,232,123,0.02) 100px, rgba(0,232,123,0.02) 101px),
        repeating-linear-gradient(0deg, transparent, transparent 100px, rgba(0,232,123,0.02) 100px, rgba(0,232,123,0.02) 101px);
}

/* ── Sidebar ───────────────────────── */
.sidebar {
    position:fixed;top:0;left:0;width:var(--sidebar-w);height:100vh;
    background:var(--void);border-right:1px solid var(--bg3);
    display:flex;flex-direction:column;z-index:100;padding:16px 0 12px;
}

.logo{padding:0 16px 16px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--bg3)}
.logo-icon{display:none}
.logo-text{
    font-family:var(--font-display);font-size:1.15rem;font-weight:400;
    color:var(--green);letter-spacing:0.1em;text-transform:uppercase;
    text-shadow:0 0 10px var(--green-glow);
}

.logo::before{
    content:'>';color:var(--green);font-size:1rem;
    animation:blink 1s step-end infinite;
}
@keyframes blink{50%{opacity:0}}

.nav-links{
    list-style:none;display:flex;flex-direction:column;gap:0;
    padding:12px 8px;flex:1;
}

.nav-links a{
    display:flex;align-items:center;gap:10px;
    padding:7px 10px;border-radius:2px;
    color:var(--w3);font-size:0.92rem;font-weight:400;
    transition:all 0.1s;letter-spacing:0.02em;
    border-left:2px solid transparent;
}
.nav-links a:hover{color:var(--w);background:var(--bg2);border-left-color:var(--w4)}
.nav-links a.active{color:var(--green);background:var(--green-ghost);border-left-color:var(--green)}
.nav-links a.active svg{stroke:var(--green)}
.nav-links svg{flex-shrink:0;stroke:var(--w4);width:15px;height:15px;transition:stroke 0.1s}
.nav-links a:hover svg{stroke:var(--w3)}

.sidebar-footer{padding:8px 16px;border-top:1px solid var(--bg3);margin-top:4px}
.version-badge{font-size:0.77rem;color:var(--w4);letter-spacing:0.05em}

/* ── Content ───────────────────────── */
.content{margin-left:var(--sidebar-w);padding:28px 32px 60px;max-width:1100px;min-height:100vh}

/* ── Page header ───────────────────── */
.page-header{margin-bottom:28px}
.page-header h1{
    font-family:var(--font-display);font-size:1.4rem;font-weight:400;
    color:var(--green);letter-spacing:0.08em;text-transform:uppercase;
    text-shadow:0 0 20px var(--green-ghost);margin-bottom:2px;
}
.subtitle{color:var(--w4);font-size:0.85rem;letter-spacing:0.03em}

.breadcrumb{display:flex;align-items:center;gap:6px;font-size:0.77rem;color:var(--w4);margin-bottom:10px;letter-spacing:0.04em}
.breadcrumb a{color:var(--w3);transition:color 0.1s}
.breadcrumb a:hover{color:var(--green)}
.bc-sep{color:var(--w5);font-size:0.7rem}

/* ── Stats — data readouts ─────────── */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-bottom:24px;background:var(--bg3);border:1px solid var(--bg3)}
.stat-card{background:var(--bg1);padding:16px 18px;position:relative}
.stat-card::after{content:'';position:absolute;top:8px;right:12px;width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green-glow);animation:blink 2s ease-in-out infinite}
.stat-card:nth-child(2)::after{background:var(--amber);box-shadow:0 0 6px var(--amber-glow);animation-delay:0.5s}
.stat-card:nth-child(3)::after{background:var(--cyan);box-shadow:0 0 6px var(--cyan-ghost);animation-delay:1s}
.stat-card:nth-child(4)::after{background:var(--green);animation-delay:1.5s}
.stat-glow{display:none}

.stat-value{
    font-family:var(--font-display);font-size:1.8rem;font-weight:400;
    color:var(--green);line-height:1;margin-bottom:4px;letter-spacing:0.04em;
    text-shadow:0 0 15px var(--green-ghost);
}
.stat-card:nth-child(2) .stat-value{color:var(--amber);text-shadow:0 0 15px var(--amber-ghost)}
.stat-label{font-size:0.69rem;color:var(--w4);text-transform:uppercase;letter-spacing:0.12em}

/* ── Cards ─────────────────────────── */
.card{background:var(--bg1);border:1px solid var(--bg3);padding:16px}
.card-title{
    font-size:0.77rem;font-weight:500;color:var(--w3);
    text-transform:uppercase;letter-spacing:0.1em;
    margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--bg3);
}
.card-title::before{content:'// ';color:var(--w5)}
.card-full{margin-top:16px}

/* ── Dashboard grid ────────────────── */
.dashboard-grid{display:grid;grid-template-columns:1.5fr 1fr;grid-template-rows:auto auto;gap:1px;background:var(--bg3);border:1px solid var(--bg3)}
.dashboard-grid>.card{background:var(--bg1)}
.card-wide{grid-column:1;grid-row:1/3}

/* ── Chart ─────────────────────────── */
.chart-container{height:240px;padding-top:8px}

.chart-inner{display:flex;flex-direction:column;height:100%}
.chart-bars{display:flex;align-items:flex-end;gap:3px;flex:1;min-height:0}
.chart-labels{display:flex;gap:3px;padding-top:6px;border-top:1px solid var(--bg3)}

.chart-col{
    flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;
    min-width:0;animation:bar-grow 0.4s ease both;
}
@keyframes bar-grow{from{opacity:0;transform:scaleY(0);transform-origin:bottom}to{opacity:1;transform:scaleY(1);transform-origin:bottom}}

.chart-bar{
    width:100%;border-radius:2px 2px 0 0;
    background:linear-gradient(to top, var(--green-dim), var(--green));
    opacity:0.55;transition:opacity 0.12s;position:relative;min-height:4px;
}
.chart-bar:hover{opacity:1;box-shadow:0 0 10px var(--green-glow)}
.chart-bar::after{
    content:attr(data-tooltip);
    position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);
    background:var(--bg4);border:1px solid var(--w5);padding:5px 10px;border-radius:2px;
    font-size:0.69rem;color:var(--green);white-space:nowrap;
    opacity:0;pointer-events:none;transition:opacity 0.1s;z-index:10;
}
.chart-bar:hover::after{opacity:1}

.chart-date{
    font-size:0.58rem;color:var(--w5);text-align:center;
    flex:1;min-width:0;overflow:hidden;letter-spacing:0.02em;
}

/* ── Model & project rows ──────────── */
.model-row,.project-row{
    display:flex;align-items:center;justify-content:space-between;
    padding:8px 0;border-bottom:1px solid var(--bg3);font-size:0.85rem;
}
.model-row:last-child,.project-row:last-child{border-bottom:none}
.model-name,.project-name{font-weight:500;color:var(--w);font-size:0.85rem}
.model-sessions{color:var(--w4);font-size:0.77rem}
.model-tokens{font-weight:500;color:var(--amber);font-size:0.77rem}
.project-stats{display:flex;align-items:center;gap:8px;color:var(--w4);font-size:0.77rem}
.sep{color:var(--w5)}

/* ── Session list — log entries ────── */
.session-list{display:flex;flex-direction:column;gap:0}

.session-row{
    display:grid;grid-template-columns:auto 1fr auto;align-items:center;
    padding:10px 14px;gap:16px;
    border-bottom:1px solid var(--bg3);background:var(--bg1);
    transition:all 0.1s;
}
.session-row:hover{background:var(--green-ghost)}
.session-row:first-child{border-top:1px solid var(--bg3)}

.session-row-main{display:flex;align-items:center;gap:12px;min-width:0}
.session-info{display:flex;flex-direction:column;min-width:0;gap:1px}
.session-name{font-weight:500;font-size:0.88rem;color:var(--w);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.session-project,.session-branch{font-size:0.73rem;color:var(--w4)}

.session-row-meta{display:flex;align-items:center;gap:16px;flex-shrink:0}
.session-tokens,.session-msgs{color:var(--w4);font-size:0.73rem}
.session-date{font-size:0.73rem;color:var(--w4);min-width:90px;text-align:right}

.session-models{display:flex;gap:3px}
.model-badge{font-size:0.65rem;font-weight:500;padding:1px 6px;background:var(--cyan-ghost);color:var(--cyan-dim);border:1px solid rgba(0,212,255,0.15)}

.session-tags{display:flex;gap:3px}
.fav{color:var(--w5);font-size:0.8rem;transition:all 0.1s;flex-shrink:0}
.fav.active{color:var(--amber);text-shadow:0 0 8px var(--amber-glow)}

/* ── Tags ──────────────────────────── */
.tag-pill{font-size:0.65rem;font-weight:500;padding:1px 6px;background:var(--amber-ghost);color:var(--amber-dim);border:1px solid rgba(255,176,32,0.15)}
.tags-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1px;background:var(--bg3);border:1px solid var(--bg3)}
.tag-card{background:var(--bg1);padding:16px;display:flex;flex-direction:column;gap:4px}
.tag-card:hover{background:var(--bg2)}
.tag-name{font-weight:600;font-size:0.92rem;color:var(--cyan)}
.tag-count{font-size:0.77rem;color:var(--w4)}

/* ── Projects grid ─────────────────── */
.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1px;background:var(--bg3);border:1px solid var(--bg3)}

.project-card{
    background:var(--bg1);padding:20px;display:flex;flex-direction:column;gap:6px;
    transition:all 0.15s;position:relative;
}
.project-card:hover{background:var(--green-ghost)}

.project-card-icon{
    width:28px;height:28px;border:1px solid var(--green-dim);
    display:flex;align-items:center;justify-content:center;margin-bottom:4px;
}
.project-card-icon svg{stroke:var(--green);width:14px;height:14px}
.project-card-name{font-size:1rem;font-weight:600;color:var(--w);letter-spacing:-0.01em}
.project-card-path{font-size:0.69rem;color:var(--w4);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.project-card-stats{display:flex;align-items:center;gap:8px;font-size:0.73rem;color:var(--w3);margin-top:6px;padding-top:8px;border-top:1px solid var(--bg3)}

/* ── Search ────────────────────────── */
.search-container{max-width:640px}
.search-input-wrap{position:relative;margin-bottom:24px}
.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);stroke:var(--w4);pointer-events:none;width:16px;height:16px}

.search-input{
    width:100%;background:var(--bg1);border:1px solid var(--bg3);border-radius:0;
    padding:10px 10px 10px 38px;font-family:var(--font);font-size:0.92rem;color:var(--green);
    outline:none;transition:all 0.15s;caret-color:var(--green);
}
.search-input:focus{border-color:var(--green);box-shadow:0 0 0 1px var(--green-ghost),0 0 20px var(--green-ghost)}
.search-input::placeholder{color:var(--w5)}

.search-kbd{
    position:absolute;right:10px;top:50%;transform:translateY(-50%);
    font-size:0.69rem;color:var(--w5);border:1px solid var(--bg4);padding:2px 6px;
}

.search-results{display:flex;flex-direction:column;gap:0}
.search-result{padding:12px 0;border-bottom:1px solid var(--bg3);cursor:pointer;transition:all 0.1s}
.search-result:first-child{border-top:1px solid var(--bg3)}
.search-result:hover{padding-left:10px;border-left:2px solid var(--green)}
.search-result-header{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.search-result-project{font-size:0.73rem;color:var(--green-dim);letter-spacing:0.04em;text-transform:uppercase}
.search-result-role{font-size:0.62rem;padding:1px 5px;background:var(--bg4);color:var(--w4);text-transform:uppercase;letter-spacing:0.06em}
.search-result-snippet{font-size:0.85rem;color:var(--w3);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.search-result-score{font-size:0.65rem;color:var(--w5)}

/* ── Conversation ──────────────────── */
.conversation-view{max-width:760px}
.conv-header{margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid var(--bg3)}

.conv-title-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.conv-title{font-family:var(--font);font-size:1.15rem;font-weight:600;color:var(--w);flex:1;line-height:1.3}
.conv-title[contenteditable="true"]{outline:none;border-bottom:1px solid var(--green);padding-bottom:2px}

.btn-icon{
    background:var(--bg2);border:1px solid var(--bg4);border-radius:0;
    padding:5px;color:var(--w4);transition:all 0.1s;display:flex;align-items:center;
}
.btn-icon:hover{border-color:var(--green);color:var(--green)}
.btn-fav{font-size:0.9rem}
.btn-fav.active{color:var(--amber);text-shadow:0 0 6px var(--amber-glow)}

.conv-meta-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:0.73rem;color:var(--w4)}
.conv-branch{background:var(--bg3);padding:2px 8px}
.conv-tags{display:flex;gap:3px}
.conv-actions{display:flex;align-items:center;gap:6px;margin-left:auto}

.tag-input{
    background:var(--bg2);border:1px solid var(--bg4);border-radius:0;
    padding:4px 8px;font-family:var(--font);font-size:0.73rem;color:var(--green);
    width:120px;outline:none;caret-color:var(--green);
}
.tag-input:focus{border-color:var(--green)}

.btn-small{
    background:var(--bg2);border:1px solid var(--bg4);border-radius:0;
    padding:4px 12px;font-size:0.73rem;color:var(--w3);font-family:var(--font);
    transition:all 0.1s;letter-spacing:0.03em;
}
.btn-small:hover{border-color:var(--w4);color:var(--w)}
.btn-delete{color:var(--red);border-color:rgba(255,59,92,0.2)}
.btn-delete:hover{background:var(--red-ghost);border-color:var(--red)}

/* ── Messages — chat log ───────────── */
.messages-container{display:flex;flex-direction:column;gap:6px;padding-top:4px}

.message{
    padding:18px 20px;position:relative;
    border:1px solid var(--bg3);
    animation:msg-in 0.25s ease both;
    border-left:3px solid transparent;
    border-radius:2px;
}
@keyframes msg-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

.message-user{background:var(--bg2);border-left-color:var(--amber)}
.message-assistant{background:var(--bg1);border-left-color:var(--green)}
.message-sidechain{margin-left:24px;opacity:0.55;border-left-color:var(--w5) !important;border-left-style:dashed}

.message-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.message-role{font-weight:600;text-transform:uppercase;letter-spacing:0.08em;font-size:0.65rem;padding:2px 8px}
.message-user .message-role{background:var(--amber-ghost);color:var(--amber);border:1px solid rgba(255,176,32,0.2)}
.message-assistant .message-role{background:var(--green-ghost);color:var(--green);border:1px solid rgba(0,232,123,0.2)}
.message-model{font-size:0.68rem;color:var(--w4);background:var(--bg3);padding:2px 8px}
.message-tokens{font-size:0.68rem;color:var(--w4);margin-left:auto}
.message-time{font-size:0.68rem;color:var(--w4)}

.message-body{font-size:0.95rem;line-height:1.75;color:var(--w)}
.message-body p{margin-bottom:0.75em}
.message-body p:last-child{margin-bottom:0}
.message-body strong{color:var(--w);font-weight:600}
.message-body em{color:var(--w2)}
.message-body a{color:var(--cyan);text-decoration:underline;text-decoration-color:var(--cyan-ghost)}
.message-body a:hover{text-decoration-color:var(--cyan)}

.message-body code{font-size:0.88em;background:var(--bg4);padding:2px 6px;color:var(--green);border-radius:2px}

.message-body pre{
    background:var(--void);border:1px solid var(--bg3);padding:16px;
    overflow-x:auto;margin:14px 0;position:relative;
}
.message-body pre::before{
    content:'';position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,var(--green-dim),transparent);opacity:0.3;
}
.message-body pre code{background:none;padding:0;color:var(--w2);font-size:0.85rem;line-height:1.6}

.message-body ul,.message-body ol{padding-left:1.5em;margin-bottom:0.75em}
.message-body li{margin-bottom:0.3em;color:var(--w)}
.message-body li::marker{color:var(--w4)}

.message-body h1{font-weight:700;margin:1.2em 0 0.5em;color:var(--green);letter-spacing:0.02em;font-size:1.1em;text-transform:uppercase}
.message-body h2{font-weight:600;margin:1em 0 0.4em;color:var(--green-dim);font-size:1em;letter-spacing:0.02em}
.message-body h3{font-weight:600;margin:0.8em 0 0.3em;color:var(--w);font-size:0.95em}

.message-body blockquote{border-left:2px solid var(--w5);padding-left:14px;margin:10px 0;color:var(--w3)}

.message-body table{width:100%;border-collapse:collapse;margin:12px 0;font-size:0.85rem}
.message-body th,.message-body td{padding:8px 12px;border:1px solid var(--bg3);text-align:left}
.message-body th{background:var(--bg3);font-weight:600;color:var(--green);text-transform:uppercase;font-size:0.78rem;letter-spacing:0.04em}
.message-body td{color:var(--w2)}
.message-body hr{border:none;border-top:1px solid var(--bg3);margin:16px 0}

/* Thinking */
.thinking-block{margin:12px 0;border:1px solid var(--bg4);overflow:hidden}
.thinking-toggle{
    display:flex;align-items:center;gap:8px;padding:8px 14px;background:var(--bg3);
    font-family:var(--font);font-size:0.78rem;color:var(--w3);border:none;width:100%;text-align:left;transition:color 0.1s;
}
.thinking-toggle:hover{color:var(--w)}
.thinking-toggle .arrow{transition:transform 0.15s;font-size:0.65rem;color:var(--w4)}
.thinking-toggle.open .arrow{transform:rotate(90deg);color:var(--amber)}
.thinking-content{display:none;padding:14px;font-size:0.85rem;color:var(--w3);font-style:italic;line-height:1.6;max-height:300px;overflow-y:auto;background:var(--bg2)}
.thinking-content.show{display:block}

/* Tool use */
.tool-block{margin:8px 0;background:var(--bg2);padding:10px 14px;border-left:2px solid var(--cyan);border:1px solid var(--bg3);border-left:3px solid var(--cyan)}
.tool-name{font-size:0.78rem;font-weight:600;color:var(--cyan)}
.tool-preview{font-size:0.73rem;color:var(--w3);margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Heatmap ────────────────────────── */
.heatmap-container{overflow-x:auto;padding:4px 0}
.heatmap-grid{display:grid;grid-template-columns:40px repeat(24,1fr);gap:2px;min-width:500px}
.heatmap-label{font-size:0.69rem;color:var(--w4);display:flex;align-items:center;letter-spacing:0.03em}
.heatmap-hour-label{font-size:0.6rem;color:var(--w5);text-align:center;padding-bottom:2px}
.heatmap-cell{
    aspect-ratio:1;border-radius:1px;background:var(--bg3);
    transition:all 0.15s;position:relative;min-height:14px;
}
.heatmap-cell:hover{outline:1px solid var(--green);outline-offset:1px;z-index:1}
.heatmap-cell[data-level="1"]{background:rgba(0,232,123,0.15)}
.heatmap-cell[data-level="2"]{background:rgba(0,232,123,0.30)}
.heatmap-cell[data-level="3"]{background:rgba(0,232,123,0.50)}
.heatmap-cell[data-level="4"]{background:rgba(0,232,123,0.75)}
.heatmap-cell[data-level="5"]{background:var(--green);box-shadow:0 0 4px var(--green-glow)}
.heatmap-cell::after{
    content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
    background:var(--bg4);border:1px solid var(--w5);padding:3px 8px;font-size:0.65rem;color:var(--green);
    white-space:nowrap;opacity:0;pointer-events:none;transition:opacity 0.1s;z-index:10;
}
.heatmap-cell:hover::after{opacity:1}

/* ── Empty / loading ───────────────── */
.empty-state{text-align:center;padding:48px 20px;color:var(--w5)}
.empty-state p{margin-bottom:2px}
.empty-hint{font-size:0.85rem}

.loading{display:flex;align-items:center;justify-content:center;padding:48px;gap:8px}
.loading::after{content:'Loading...';color:var(--green);font-size:0.85rem;animation:blink 0.8s step-end infinite}

/* ── Scrollbar ─────────────────────── */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bg4)}
::-webkit-scrollbar-thumb:hover{background:var(--w5)}

/* ── Responsive ────────────────────── */
/* ── Responsive ────────────────────── */
@media(max-width:1024px){
    .stats-grid{grid-template-columns:repeat(2,1fr)}
    .dashboard-grid{grid-template-columns:1fr}
    .card-wide{grid-column:1;grid-row:auto}
    .projects-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
    .landing h1{font-size:2.2rem}
    .landing-features{grid-template-columns:repeat(2,1fr)}
    .landing-stats{gap:24px}
}

@media(max-width:768px){
    .sidebar{
        position:fixed;bottom:0;top:auto;left:0;right:0;
        width:100%;height:56px;border-right:none;border-top:1px solid var(--bg3);
        flex-direction:row;padding:0;z-index:200;
    }
    .logo{display:none}
    .nav-links{flex-direction:row;padding:0 8px;gap:0;align-items:center;justify-content:space-around}
    .nav-links li{flex:1}
    .nav-links a{flex-direction:column;gap:2px;padding:8px 4px;font-size:0.6rem;justify-content:center;align-items:center;border-left:none;border-radius:0}
    .nav-links a.active{border-left:none;border-top:2px solid var(--green);background:var(--green-ghost)}
    .nav-links a.active::before{display:none}
    .nav-links svg{width:18px;height:18px}
    .sidebar-footer{display:none}

    .content{margin-left:0;margin-bottom:56px;padding:16px 14px 70px}

    .page-header h1{font-size:1.2rem}
    .stats-grid{grid-template-columns:repeat(2,1fr);gap:1px}
    .stat-card{padding:12px 14px}
    .stat-value{font-size:1.3rem}

    .projects-grid{grid-template-columns:1fr}
    .session-row{padding:10px 12px;flex-wrap:wrap}
    .session-row-meta{gap:12px;width:100%;justify-content:flex-end;margin-top:4px}
    .session-name{font-size:0.82rem}

    .conversation-view{max-width:100%}
    .message{padding:12px 14px}
    .message-body{font-size:0.88rem}
    .conv-title{font-size:1.15rem}
    .conv-meta-bar{font-size:0.68rem}
    .conv-actions{margin-left:0;margin-top:8px;width:100%}

    .search-input{font-size:0.92rem;padding:12px 12px 12px 38px}

    .heatmap-grid{min-width:400px}

    .landing{padding:24px 16px}
    .landing h1{font-size:1.8rem}
    .landing-sub{font-size:0.85rem}
    .landing-stats{flex-direction:column;gap:16px}
    .landing-stat-value{font-size:1.4rem}
    .landing-features{grid-template-columns:1fr;max-width:100%}
    .landing-cta{padding:10px 24px;font-size:0.82rem}
}

@media(max-width:480px){
    .stats-grid{grid-template-columns:1fr 1fr}
    .stat-value{font-size:1.1rem}
    .stat-label{font-size:0.6rem}
    .model-row,.project-row{flex-wrap:wrap;gap:4px}
    .tags-grid{grid-template-columns:1fr}
    .breadcrumb{font-size:0.68rem}
}

/* ── Animations ────────────────────── */
@keyframes fade-up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.stats-grid>.stat-card,.projects-grid>.project-card,.session-list>.session-row,.dashboard-grid>.card,.card-full{animation:fade-up 0.3s ease both}
.stats-grid>:nth-child(1){animation-delay:.03s}.stats-grid>:nth-child(2){animation-delay:.06s}
.stats-grid>:nth-child(3){animation-delay:.09s}.stats-grid>:nth-child(4){animation-delay:.12s}
.dashboard-grid>:nth-child(1){animation-delay:.15s}.dashboard-grid>:nth-child(2){animation-delay:.18s}.dashboard-grid>:nth-child(3){animation-delay:.21s}
.card-full{animation-delay:.24s}
.session-list>:nth-child(n){animation-delay:calc(.02s * var(--i,0))}
.session-list>:nth-child(1){animation-delay:.02s}.session-list>:nth-child(2){animation-delay:.04s}
.session-list>:nth-child(3){animation-delay:.06s}.session-list>:nth-child(4){animation-delay:.08s}
.session-list>:nth-child(5){animation-delay:.1s}.session-list>:nth-child(6){animation-delay:.12s}
.session-list>:nth-child(7){animation-delay:.14s}.session-list>:nth-child(8){animation-delay:.16s}

.projects-grid>:nth-child(1){animation-delay:.03s}.projects-grid>:nth-child(2){animation-delay:.06s}
.projects-grid>:nth-child(3){animation-delay:.09s}.projects-grid>:nth-child(4){animation-delay:.12s}
.projects-grid>:nth-child(5){animation-delay:.15s}.projects-grid>:nth-child(6){animation-delay:.18s}

::selection{background:var(--green-flare);color:var(--w)}

/* ── Landing ───────────────────────── */
.landing{
    min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;padding:40px;position:relative;overflow:hidden;
}
.landing::before{
    content:'';position:absolute;inset:0;
    background:
        radial-gradient(ellipse 500px 300px at 40% 30%, var(--green-ghost), transparent),
        radial-gradient(ellipse 400px 200px at 65% 70%, var(--amber-ghost), transparent);
    pointer-events:none;
}

.landing-badge{
    font-size:0.73rem;font-weight:500;color:var(--green);
    background:var(--green-ghost);padding:4px 14px;
    margin-bottom:24px;letter-spacing:0.08em;text-transform:uppercase;
    border:1px solid rgba(0,232,123,0.15);animation:fade-up 0.4s ease both;
}

.landing h1{
    font-family:var(--font-display);font-size:2.8rem;font-weight:400;
    letter-spacing:0.04em;text-transform:uppercase;line-height:1.15;
    color:var(--w);max-width:600px;margin-bottom:14px;
    animation:fade-up 0.4s ease both;animation-delay:.1s;
}
.landing h1 span{color:var(--green);text-shadow:0 0 30px var(--green-ghost)}

.landing-sub{
    font-size:0.92rem;color:var(--w4);max-width:420px;line-height:1.5;margin-bottom:32px;
    animation:fade-up 0.4s ease both;animation-delay:.2s;
}

.landing-stats{
    display:flex;gap:32px;margin-bottom:32px;
    animation:fade-up 0.4s ease both;animation-delay:.3s;
}
.landing-stat{text-align:center}
.landing-stat-value{font-family:var(--font-display);font-size:1.8rem;color:var(--green);line-height:1;text-shadow:0 0 15px var(--green-ghost);letter-spacing:0.04em}
.landing-stat-label{font-size:0.65rem;color:var(--w5);text-transform:uppercase;letter-spacing:0.12em;margin-top:4px}

.landing-cta{
    display:inline-flex;align-items:center;gap:8px;
    background:transparent;color:var(--green);font-weight:600;font-size:0.88rem;
    padding:10px 28px;border:1px solid var(--green);font-family:var(--font);
    letter-spacing:0.06em;text-transform:uppercase;
    transition:all 0.15s;animation:fade-up 0.4s ease both;animation-delay:.4s;
}
.landing-cta:hover{background:var(--green-ghost);box-shadow:0 0 20px var(--green-ghost)}
.landing-cta svg{width:16px;height:16px}

.landing-features{
    display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
    max-width:640px;margin-top:48px;background:var(--bg3);border:1px solid var(--bg3);
    animation:fade-up 0.4s ease both;animation-delay:.5s;
}
.landing-feature{text-align:left;padding:18px;background:var(--bg1)}
.landing-feature-icon{font-size:1.2rem;margin-bottom:8px}
.landing-feature h3{font-size:0.82rem;font-weight:600;color:var(--green);margin-bottom:3px;letter-spacing:0.02em}
.landing-feature p{font-size:0.77rem;color:var(--w4);line-height:1.4}
