:root {
    --bg:#080a0f; --bg-card:#0e1117; --bg-raised:#151b26; --bg-code:#0a0c10;
    --border:#1e2535; --border-hi:#2d3a52;
    --blurple:#5865F2; --blurple-d:#4752c4;
    --green:#3ba55d; --red:#ed4245; --yellow:#faa61a; --cyan:#00d4ff; --purple:#b05dff;
    --text:#c8d0e0; --text-dim:#6a7897; --text-hi:#ffffff;
    --font-ui:'Outfit',sans-serif; --font-code:'JetBrains Mono',monospace;
    --radius:10px; --radius-sm:6px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-ui);background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}
.scanline{pointer-events:none;position:fixed;inset:0;z-index:1000;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.035) 2px,rgba(0,0,0,0.035) 4px)}

/* ── HEADER ── */
header{position:sticky;top:0;z-index:100;background:rgba(8,10,15,0.95);backdrop-filter:blur(24px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;justify-content:space-between;align-items:center;max-width:1060px;margin:0 auto;padding:13px 24px}
.logo{display:flex;align-items:center;gap:12px}
.logo-icon{width:40px;height:40px;background:rgba(88,101,242,0.12);border:1px solid rgba(88,101,242,0.3);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-title{display:block;font-size:.95rem;font-weight:700;color:var(--text-hi)}
.logo-sub{display:block;font-size:.68rem;color:var(--text-dim);font-family:var(--font-code)}
.header-actions{display:flex;align-items:center;gap:14px}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-dim);transition:background .4s;flex-shrink:0}
.status-dot.online{background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 2s infinite}
.status-dot.error{background:var(--red)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
.last-updated{font-family:var(--font-code);font-size:.72rem;color:var(--text-dim)}
.btn-refresh{display:flex;align-items:center;gap:7px;background:transparent;border:1px solid var(--border-hi);color:var(--text);padding:7px 14px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-ui);font-size:.82rem;font-weight:500;transition:all .2s}
.btn-refresh:hover{border-color:var(--blurple);color:var(--blurple);background:rgba(88,101,242,.06)}
.btn-refresh.loading svg{animation:spin .8s linear infinite}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* ── PAGE NAV TABS ── */
.page-nav{border-top:1px solid var(--border)}
.page-nav-inner{display:flex;max-width:1060px;margin:0 auto;padding:0 24px;gap:2px}
.page-tab{display:flex;align-items:center;gap:6px;background:transparent;border:none;border-bottom:2px solid transparent;padding:10px 16px;color:var(--text-dim);cursor:pointer;font-family:var(--font-ui);font-size:.82rem;font-weight:600;letter-spacing:.01em;transition:all .2s;margin-bottom:-1px;position:relative}
.page-tab svg{opacity:.7;transition:opacity .2s}
.page-tab:hover{color:var(--text)}
.page-tab:hover svg{opacity:1}
.page-tab.active{color:var(--text-hi);border-bottom-color:var(--blurple)}
.page-tab.active svg{opacity:1}
.tab-badge{background:var(--cyan);color:#000;font-size:.6rem;font-weight:800;padding:1px 5px;border-radius:10px;margin-left:2px;font-family:var(--font-code);display:none}
.tab-badge.show{display:inline}

/* ── FILTERS ── */
.filters{max-width:1060px;margin:0 auto;padding:10px 24px 13px;display:flex;gap:12px;align-items:center}
.search-input{flex:1;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:8px 14px;font-family:var(--font-ui);font-size:.85rem;outline:none;transition:border-color .2s}
.search-input:focus{border-color:var(--blurple)}
.search-input::placeholder{color:var(--text-dim)}
.filter-tabs{display:flex;gap:4px}
.filter-tab{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:6px 14px;border-radius:20px;cursor:pointer;font-family:var(--font-ui);font-size:.77rem;font-weight:500;transition:all .2s}
.filter-tab:hover{border-color:var(--border-hi);color:var(--text)}
.filter-tab.active{background:var(--blurple);border-color:var(--blurple);color:#fff}

/* ── MAIN ── */
main{max-width:1060px;margin:0 auto;padding:20px 24px}
.stats-bar{display:flex;align-items:center;gap:10px;font-size:.77rem;color:var(--text-dim);font-family:var(--font-code);margin-bottom:16px}
.stat-sep{opacity:.3}
.stat-source{color:var(--blurple);opacity:.7}

/* ── LOADING ── */
.loading-screen{text-align:center;padding:80px 20px;display:flex;flex-direction:column;align-items:center;gap:20px}
.loading-spinner{width:34px;height:34px;border:2px solid var(--border);border-top-color:var(--blurple);border-radius:50%;animation:spin .8s linear infinite}
.loading-text{font-family:var(--font-code);font-size:.82rem;color:var(--text-dim);line-height:1.7}

/* ── DASHBOARD ── */
.dashboard-stats{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;margin-bottom:18px}
.stats-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.live-info{display:flex;align-items:center;font-size:.82rem;color:var(--text)}
.live-info strong{color:var(--blurple);font-family:var(--font-code)}
.pulse-icon{display:inline-block;width:8px;height:8px;background:var(--green);border-radius:50%;margin-right:8px;box-shadow:0 0 6px var(--green);animation:live-pulse 2s infinite;flex-shrink:0}
@keyframes live-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:.6}}
.activity-label{font-size:.62rem;font-weight:700;letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase}

/* ── GRAPH (FIXED) ── */
.graph-container{display:flex;align-items:flex-end;gap:5px;height:72px;padding-bottom:4px}
.graph-col{display:flex;flex-direction:column;align-items:center;flex:1;gap:4px;height:100%}
.graph-bar-wrap{flex:1;display:flex;align-items:flex-end;width:100%}
.graph-bar{width:100%;background:var(--blurple);border-radius:3px 3px 0 0;min-height:3px;cursor:default;transition:opacity .2s,filter .2s;position:relative}
.graph-bar:hover{opacity:1!important;filter:brightness(1.4)}
.graph-bar-today{background:var(--cyan)}
.graph-label{font-size:.57rem;font-family:var(--font-code);color:var(--text-dim);white-space:nowrap;text-align:center}
.graph-label-today{color:var(--cyan);font-weight:700}
/* Tooltip */
.graph-bar[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);background:var(--bg-raised);border:1px solid var(--border-hi);padding:3px 8px;border-radius:4px;font-size:.68rem;font-family:var(--font-code);color:var(--text);white-space:nowrap;z-index:10;pointer-events:none}

/* ── CARDS ── */
.update-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:12px;overflow:hidden;transition:border-color .2s;animation:slideIn .22s ease both}
.update-card:hover{border-color:var(--border-hi)}
@keyframes slideIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.card-header{padding:15px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;user-select:none;transition:background .15s}
.card-header:hover{background:rgba(255,255,255,.018)}
.card-header-left{display:flex;align-items:center;gap:14px;min-width:0}
.build-number{font-family:var(--font-code);font-size:.79rem;font-weight:700;color:var(--blurple);background:rgba(88,101,242,.1);border:1px solid rgba(88,101,242,.2);padding:3px 9px;border-radius:4px;white-space:nowrap;flex-shrink:0}
.card-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.card-title{font-size:.88rem;font-weight:600;color:var(--text-hi);display:flex;align-items:center;gap:8px}
.card-date{font-family:var(--font-code);font-size:.69rem;color:var(--text-dim)}
.card-header-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.file-counts{display:flex;gap:5px}
.count-badge{font-family:var(--font-code);font-size:.69rem;padding:2px 7px;border-radius:4px;font-weight:600}
.count-js{background:rgba(241,196,15,.12);color:#f1c40f;border:1px solid rgba(241,196,15,.2)}
.count-css{background:rgba(244,127,255,.12);color:#f47fff;border:1px solid rgba(244,127,255,.2)}
.count-other{background:rgba(200,208,224,.07);color:var(--text-dim);border:1px solid var(--border)}
.saved-badge{font-size:.7rem;font-weight:600;color:var(--green);background:rgba(59,165,93,.1);border:1px solid rgba(59,165,93,.2);padding:1px 6px;border-radius:4px;font-family:var(--font-code)}
.toggle-arrow{color:var(--text-dim);transition:transform .25s;flex-shrink:0}
.toggle-arrow.open{transform:rotate(90deg)}
.files-panel{display:none;border-top:1px solid var(--border);background:var(--bg)}
.files-panel.open{display:block}
.panel-tabs{display:flex;border-bottom:1px solid var(--border);padding:0 20px}
.panel-tab{background:transparent;border:none;border-bottom:2px solid transparent;padding:9px 14px;color:var(--text-dim);cursor:pointer;font-family:var(--font-ui);font-size:.79rem;font-weight:500;transition:all .2s;margin-bottom:-1px}
.panel-tab:hover{color:var(--text)}
.panel-tab.active{color:var(--text-hi);border-bottom-color:var(--blurple)}
.panel-content{padding:13px 20px}
.section-label{font-size:.68rem;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:7px;margin-top:12px;display:flex;align-items:center;gap:6px}
.section-label:first-child{margin-top:0}
.section-count{background:var(--border);padding:1px 5px;border-radius:3px;font-size:.63rem}
.file-row{display:flex;align-items:center;gap:10px;padding:6px 12px;border-radius:var(--radius-sm);margin-bottom:3px;background:var(--bg-raised);border:1px solid var(--border);transition:border-color .2s}
.file-row:hover{border-color:var(--border-hi)}
.file-type-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.dot-js{background:#f1c40f;box-shadow:0 0 5px rgba(241,196,15,.5)}
.dot-css{background:#f47fff;box-shadow:0 0 5px rgba(244,127,255,.5)}
.dot-other{background:var(--text-dim)}
.file-info{flex:1;min-width:0;font-family:var(--font-code);font-size:.77rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.file-basename{color:var(--text-hi);font-weight:600}
.file-hash,.file-ext{color:var(--text-dim)}
.file-status-dot{font-size:.74rem;color:var(--green);flex-shrink:0}
.file-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.btn-diff{background:transparent;border:1px solid var(--border-hi);color:var(--text-dim);padding:3px 10px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-ui);font-size:.74rem;font-weight:600;transition:all .2s;white-space:nowrap}
.btn-diff:hover{border-color:var(--blurple);color:var(--blurple);background:rgba(88,101,242,.06)}
.btn-diff.active-diff{border-color:var(--red);color:var(--red);background:rgba(237,66,69,.06)}
.btn-diff.disabled{opacity:.3;cursor:not-allowed;pointer-events:none}
.btn-icon-link{color:var(--text-dim);text-decoration:none;padding:4px;border-radius:4px;transition:color .2s;display:flex;align-items:center}
.btn-icon-link:hover{color:var(--text)}

/* ── DIFF ── */
.diff-container{margin:4px 0 8px;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}
.diff-header-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;padding:9px 13px;background:var(--bg-raised);border-bottom:1px solid var(--border);font-family:var(--font-code);font-size:.76rem}
.diff-title{color:var(--text);font-weight:600}
.diff-stats{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.diff-stat-add{color:var(--green);font-weight:700}
.diff-stat-rem{color:var(--red);font-weight:700}
.diff-mode-badge{font-size:.66rem;padding:2px 7px;border-radius:3px;border:1px solid}
.mode-full{color:var(--green);border-color:rgba(59,165,93,.3);background:rgba(59,165,93,.08)}
.mode-fast{color:var(--yellow);border-color:rgba(250,166,26,.3);background:rgba(250,166,26,.08)}
.mode-preview{color:var(--red);border-color:rgba(237,66,69,.3);background:rgba(237,66,69,.08)}
.noise-toggle{background:transparent;border:1px solid var(--border-hi);color:var(--text-dim);padding:2px 8px;border-radius:4px;cursor:pointer;font-size:.7rem;font-family:var(--font-ui);transition:all .2s;white-space:nowrap}
.noise-toggle:hover{border-color:var(--blurple);color:var(--blurple)}
.diff-body{background:var(--bg-code);max-height:560px;overflow-y:auto;font-family:var(--font-code);font-size:.78rem;line-height:1.65;scrollbar-width:thin;scrollbar-color:var(--border-hi) transparent}
.diff-line{display:block;padding:1px 13px;white-space:pre-wrap;word-break:break-all}
.diff-line:hover{filter:brightness(1.12)}
.diff-line-add{background:rgba(59,165,93,.12);color:#7ee8a2;border-left:2px solid var(--green)}
.diff-line-add::before{content:"+ ";color:var(--green);font-weight:700;opacity:.85}
.diff-line-rem{background:rgba(237,66,69,.09);color:#f5a0a2;border-left:2px solid var(--red)}
.diff-line-rem::before{content:"− ";color:var(--red);font-weight:700;opacity:.85}
.diff-noisy{opacity:.22}
.diff-status{padding:22px;text-align:center;font-family:var(--font-code);font-size:.79rem;line-height:1.8}
.status-loading{color:var(--yellow)}
.status-error{color:var(--red)}
.status-empty{color:var(--green)}
.diff-file-label{font-size:.68rem;opacity:.45;margin-top:5px;font-family:var(--font-code)}
.diff-truncated-warning{padding:6px 13px;font-size:.73rem;color:var(--yellow);background:rgba(250,166,26,.06);border-bottom:1px solid rgba(250,166,26,.15);font-family:var(--font-code)}
.progress-bar-wrap{width:160px;margin:9px auto 0;height:2px;background:var(--border);border-radius:2px;overflow:hidden}
.progress-bar{height:100%;background:var(--yellow);border-radius:2px;animation:progress 1.8s ease-in-out infinite alternate}
@keyframes progress{from{width:5%}to{width:90%}}
.diff-load-more{text-align:center;padding:9px;background:var(--bg-raised);border-top:1px solid var(--border)}
.btn-load-more{background:transparent;border:1px solid var(--border-hi);color:var(--text-dim);padding:5px 16px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-ui);font-size:.79rem;transition:all .2s}
.btn-load-more:hover{border-color:var(--blurple);color:var(--blurple)}
.no-results{text-align:center;padding:60px 20px;color:var(--text-dim);font-family:var(--font-code);font-size:.82rem}

/* ── ASSETS PAGE ── */
.assets-loading{text-align:center;padding:60px 20px;display:flex;flex-direction:column;align-items:center;gap:16px}
.assets-header-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;font-size:.79rem;color:var(--text-dim);font-family:var(--font-code)}
.assets-count{color:var(--text)}
.assets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.asset-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;cursor:pointer;transition:border-color .2s,transform .15s;animation:slideIn .2s ease both}
.asset-card:hover{border-color:var(--blurple);transform:translateY(-2px)}
.asset-preview{width:100%;height:100px;background:var(--bg-raised);display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:1px solid var(--border)}
.asset-preview img{max-width:100%;max-height:100%;object-fit:contain;padding:10px}
.asset-no-preview{font-size:2rem;opacity:.2;user-select:none}
.asset-info{padding:10px}
.asset-name{font-family:var(--font-code);font-size:.72rem;font-weight:600;color:var(--text-hi);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:5px}
.asset-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.asset-ext{font-family:var(--font-code);font-size:.63rem;background:var(--bg-raised);border:1px solid var(--border);padding:1px 5px;border-radius:3px;color:var(--text-dim)}
.asset-versions{font-size:.63rem;color:var(--blurple);font-family:var(--font-code)}
.asset-date{font-size:.63rem;color:var(--text-dim);font-family:var(--font-code)}

/* ── MODAL ── */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.75);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .2s}
.modal-overlay.visible{opacity:1}
.modal-box{background:var(--bg-card);border:1px solid var(--border-hi);border-radius:var(--radius);width:100%;max-width:540px;max-height:90vh;overflow-y:auto;animation:slideIn .2s ease}
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--border)}
.modal-title{font-family:var(--font-code);font-size:.9rem;font-weight:700;color:var(--text-hi)}
.modal-close{background:transparent;border:1px solid var(--border);color:var(--text-dim);width:28px;height:28px;border-radius:6px;cursor:pointer;font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:all .2s}
.modal-close:hover{border-color:var(--red);color:var(--red)}
.modal-img-wrap{padding:20px;background:var(--bg-raised);text-align:center;border-bottom:1px solid var(--border)}
.modal-img-wrap img{max-width:100%;max-height:260px;object-fit:contain}
.modal-img-meta{font-family:var(--font-code);font-size:.7rem;color:var(--text-dim);margin-top:10px}
.modal-versions{padding:16px 20px}
.modal-versions-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin-bottom:10px}
.modal-versions-list{display:flex;flex-direction:column;gap:4px}
.modal-version-row{display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);cursor:pointer;transition:all .2s;font-family:var(--font-code);font-size:.74rem}
.modal-version-row:hover{border-color:var(--border-hi);background:var(--bg-raised)}
.modal-version-row.active{border-color:var(--blurple);background:rgba(88,101,242,.06)}
.mv-build{color:var(--blurple);font-weight:700;flex-shrink:0}
.mv-hash{color:var(--text-dim);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mv-date{color:var(--text-dim);font-size:.67rem;flex-shrink:0}
.mv-badge-latest{background:var(--green);color:#000;font-size:.58rem;font-weight:800;padding:1px 5px;border-radius:3px;flex-shrink:0}

/* ── FEATURES PAGE ── */
.features-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.feat-stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;text-align:center}
.feat-stat-new{border-color:rgba(0,212,255,.2);background:rgba(0,212,255,.04)}
.feat-stat-rem{border-color:rgba(237,66,69,.2);background:rgba(237,66,69,.04)}
.feat-stat-num{font-family:var(--font-code);font-size:1.6rem;font-weight:700;color:var(--text-hi);margin-bottom:4px}
.feat-stat-new .feat-stat-num{color:var(--cyan)}
.feat-stat-rem .feat-stat-num{color:var(--red)}
.feat-stat-label{font-size:.7rem;color:var(--text-dim);font-weight:500}
.features-meta{font-size:.75rem;color:var(--text-dim);font-family:var(--font-code);margin-bottom:16px;padding:8px 12px;background:var(--bg-raised);border-radius:var(--radius-sm);border:1px solid var(--border)}
.features-meta strong{color:var(--text)}
.feat-section{margin-bottom:20px}
.feat-section-title{margin-bottom:10px}
.feat-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;font-size:.76rem;font-weight:600;background:var(--bg-raised);border:1px solid var(--border);color:var(--text);cursor:default}
.feat-pill-cyan{border-color:rgba(0,212,255,.3);background:rgba(0,212,255,.08);color:var(--cyan)}
.feat-pill-red{border-color:rgba(237,66,69,.3);background:rgba(237,66,69,.08);color:var(--red)}
.feat-section-all{outline:none}
.feat-section-all summary{cursor:pointer;list-style:none;outline:none}
.feat-section-all summary::-webkit-details-marker{display:none}
.feat-list{display:flex;flex-direction:column;gap:4px}
.feat-row{display:flex;align-items:center;gap:10px;padding:6px 12px;border-radius:var(--radius-sm);background:var(--bg-raised);border:1px solid var(--border);font-family:var(--font-code);font-size:.77rem;transition:border-color .2s}
.feat-row:hover{border-color:var(--border-hi)}
.feat-row-new{border-color:rgba(0,212,255,.2);background:rgba(0,212,255,.04)}
.feat-row-rem{border-color:rgba(237,66,69,.15);background:rgba(237,66,69,.03);opacity:.7}
.feat-badge{font-size:.63rem;font-weight:700;padding:2px 7px;border-radius:4px;flex-shrink:0;text-transform:uppercase}
.feat-badge-cyan{background:rgba(0,212,255,.12);color:var(--cyan);border:1px solid rgba(0,212,255,.2)}
.feat-badge-yellow{background:rgba(250,166,26,.12);color:var(--yellow);border:1px solid rgba(250,166,26,.2)}
.feat-badge-green{background:rgba(59,165,93,.12);color:var(--green);border:1px solid rgba(59,165,93,.2)}
.feat-badge-blurple{background:rgba(88,101,242,.12);color:var(--blurple);border:1px solid rgba(88,101,242,.2)}
.feat-name{flex:1;color:var(--text-hi);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feat-kind{font-size:.68rem;color:var(--text-dim);flex-shrink:0}
.feat-new-badge{background:var(--cyan);color:#000;font-size:.6rem;font-weight:800;padding:1px 6px;border-radius:3px;flex-shrink:0}
.feat-more{text-align:center;font-size:.74rem;color:var(--text-dim);padding:8px;font-family:var(--font-code)}

/* scrollbars */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-hi);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}

/* responsive */

/* ── FEATURES TOOLBAR ── */
.feat-toolbar{display:flex;flex-direction:column;gap:12px;margin-bottom:20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px}
.feat-build-picker{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.feat-picker-group{display:flex;flex-direction:column;gap:5px;flex:1;min-width:160px}
.feat-picker-label{font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}
.feat-select{background:var(--bg-raised);border:1px solid var(--border-hi);color:var(--text);padding:7px 11px;border-radius:var(--radius-sm);font-family:var(--font-code);font-size:.77rem;outline:none;cursor:pointer;transition:border-color .2s}
.feat-select:hover,.feat-select:focus{border-color:var(--blurple)}
.feat-picker-arrow{color:var(--blurple);font-size:1.1rem;font-weight:700;flex-shrink:0;padding:0 4px;margin-top:16px}
.feat-filter-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--border)}
.feat-search{flex:1;min-width:140px;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:7px 12px;font-family:var(--font-ui);font-size:.82rem;outline:none;transition:border-color .2s}
.feat-search:focus{border-color:var(--blurple)}
.feat-search::placeholder{color:var(--text-dim)}
.feat-type-tabs{display:flex;gap:4px;flex-wrap:wrap}
.feat-type-tab{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:5px 11px;border-radius:20px;cursor:pointer;font-family:var(--font-ui);font-size:.74rem;font-weight:500;transition:all .2s;white-space:nowrap}
.feat-type-tab:hover{border-color:var(--border-hi);color:var(--text)}
.feat-type-tab.active{background:var(--blurple);border-color:var(--blurple);color:#fff}

/* ── TREATMENTS & ROLLOUT ── */
.feat-treatments{display:flex;gap:4px;flex-wrap:wrap;margin-left:4px}
.feat-treat{background:rgba(88,101,242,.1);border:1px solid rgba(88,101,242,.2);color:var(--blurple);font-size:.63rem;padding:1px 6px;border-radius:3px;font-family:var(--font-code);white-space:nowrap}
.feat-rollout{background:rgba(59,165,93,.1);border:1px solid rgba(59,165,93,.2);color:var(--green);font-size:.65rem;font-weight:700;padding:1px 7px;border-radius:3px;font-family:var(--font-code);flex-shrink:0}
.feat-badge-purple{background:rgba(176,93,255,.12);color:#b05dff;border:1px solid rgba(176,93,255,.2)}
.feat-pill-purple{border-color:rgba(176,93,255,.3);background:rgba(176,93,255,.08);color:#b05dff}

@media(max-width:640px){
    .header-inner{padding:11px 14px}
    .filters{padding:8px 14px 11px;flex-wrap:wrap}
    main{padding:14px}
    .card-header{padding:12px 14px;flex-wrap:wrap}
    .file-row{flex-wrap:wrap}
    .features-summary{grid-template-columns:repeat(2,1fr)}
    .assets-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
    .page-nav-inner{padding:0 14px;overflow-x:auto}
    .page-tab{padding:9px 12px;font-size:.78rem}
}
/* ══════════════════════════════════════════════════════
   NEW FEATURES CSS (v3)
   ══════════════════════════════════════════════════════ */

/* ── Compact mode ── */
#updates-list.compact-mode .update-card { margin-bottom: 4px; }
#updates-list.compact-mode .card-header { padding: 8px 16px; }
#updates-list.compact-mode .card-meta .card-title { font-size: .8rem; }
#updates-list.compact-mode .card-date { display: none; }
#updates-list.compact-mode .build-number { font-size: .72rem; padding: 2px 7px; }

/* ── Compact / shortcuts buttons ── */
.btn-compact { display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:transparent;border:1px solid var(--border);color:var(--text-dim);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;flex-shrink:0 }
.btn-compact:hover { border-color:var(--border-hi);color:var(--text) }
.btn-compact.active { background:rgba(88,101,242,.1);border-color:var(--blurple);color:var(--blurple) }

/* ── Keyboard focus ── */
.update-card.keyboard-focused { border-color: var(--blurple) !important; box-shadow: 0 0 0 1px rgba(88,101,242,.3); }

/* ── Permalink button ── */
.btn-permalink { display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:transparent;border:1px solid transparent;color:var(--text-dim);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;flex-shrink:0 }
.btn-permalink:hover { border-color:var(--border);color:var(--blurple) }
.btn-permalink.copied { color:var(--green) }

/* ── Split diff view ── */
.split-body { overflow-x:auto; }
.split-row { display:flex;font-family:var(--font-code);font-size:.78rem;line-height:1.6;border-bottom:1px solid rgba(255,255,255,.03) }
.split-cell { flex:1;padding:1px 10px;white-space:pre-wrap;word-break:break-all;min-width:0 }
.split-rem { background:rgba(237,66,69,.08);color:#f5a0a2;border-right:1px solid var(--border) }
.split-add { background:rgba(59,165,93,.08);color:#7ee8a2 }
.split-cell.diff-noisy { opacity:.22 }

/* ── File history modal ── */
.modal-wide { max-width:700px !important; }
.modal-subtitle { font-family:var(--font-code);font-size:.7rem;color:var(--text-dim);margin-left:10px }
.fh-list { padding:0 20px 16px;display:flex;flex-direction:column;gap:4px;max-height:280px;overflow-y:auto }
.fh-row { display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:var(--radius-sm);background:var(--bg-raised);border:1px solid var(--border);transition:all .2s;font-family:var(--font-code);font-size:.75rem }
.fh-row:hover { border-color:var(--border-hi) }
.fh-row.active { border-color:var(--blurple);background:rgba(88,101,242,.06) }
.fh-build { color:var(--blurple);font-weight:700;flex-shrink:0 }
.fh-hash  { color:var(--text-dim);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.fh-date  { color:var(--text-dim);font-size:.67rem;flex-shrink:0 }
.fh-saved { font-size:.67rem;flex-shrink:0 }
.fh-saved.saved   { color:var(--green) }
.fh-saved.unsaved { color:var(--yellow) }
.fh-diff-btn { background:transparent;border:1px solid var(--border-hi);color:var(--text-dim);padding:2px 9px;border-radius:4px;cursor:pointer;font-family:var(--font-ui);font-size:.72rem;font-weight:600;transition:all .2s;white-space:nowrap;flex-shrink:0 }
.fh-diff-btn:hover { border-color:var(--blurple);color:var(--blurple) }
.fh-diff-btn-dis { opacity:.3;pointer-events:none }
#fh-diff-zone { border-bottom:1px solid var(--border);max-height:340px;overflow-y:auto }
#fh-diff-zone .diff-container { border:none;border-radius:0 }

/* ── File basename clickable ── */
.file-history-link { cursor:pointer;transition:color .15s }
.file-history-link:hover { color:var(--blurple) }

/* ── Code search page ── */
.search-page { padding: 4px 0 }
.search-bar-wrap { display:flex;gap:10px;margin-bottom:12px }
.code-search-input { flex:1;background:var(--bg-raised);border:1px solid var(--border-hi);border-radius:var(--radius-sm);color:var(--text);padding:10px 16px;font-family:var(--font-code);font-size:.86rem;outline:none;transition:border-color .2s }
.code-search-input:focus { border-color:var(--blurple) }
.code-search-input::placeholder { color:var(--text-dim) }
.btn-code-search { display:flex;align-items:center;gap:7px;background:var(--blurple);border:none;color:#fff;padding:10px 20px;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-ui);font-size:.84rem;font-weight:600;transition:background .2s;white-space:nowrap }
.btn-code-search:hover { background:var(--blurple-d) }
.search-tips { font-size:.75rem;color:var(--text-dim);margin-bottom:20px;font-family:var(--font-code) }
.search-tips code { background:var(--bg-raised);padding:1px 5px;border-radius:3px }
.search-tips kbd { background:var(--bg-raised);border:1px solid var(--border-hi);padding:1px 5px;border-radius:4px;font-size:.72rem }
.search-meta { font-family:var(--font-code);font-size:.75rem;color:var(--text-dim);margin-bottom:12px;padding:7px 12px;background:var(--bg-raised);border-radius:var(--radius-sm);border:1px solid var(--border) }
.search-meta code { color:var(--blurple) }
.search-result-block { margin-bottom:8px;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden;background:var(--bg-code) }
.search-result-pos { padding:4px 12px;font-family:var(--font-code);font-size:.67rem;color:var(--text-dim);background:var(--bg-raised);border-bottom:1px solid var(--border);opacity:.7 }
.search-snippet { padding:10px 14px;white-space:pre;overflow:auto;color:var(--text);font-family:var(--font-code);font-size:.76rem;line-height:1.65;max-height:220px;tab-size:2 }
.search-ellipsis { display:block;color:var(--text-dim);font-size:.7rem;padding:2px 0;opacity:.5 }
.search-ctx-line { display:flex;font-family:var(--font-code);font-size:.77rem;line-height:1.65 }
.search-ctx-line.search-ctx-match { background:rgba(88,101,242,.1);border-left:2px solid var(--blurple) }
.search-ctx-num { width:48px;padding:1px 10px;color:var(--text-dim);text-align:right;flex-shrink:0;user-select:none;font-size:.7rem }
.search-ctx-code { padding:1px 10px;white-space:pre-wrap;word-break:break-all;color:var(--text);flex:1 }
.search-hl { background:rgba(250,166,26,.35);color:#ffcc44;border-radius:2px;padding:0 2px;font-weight:700 }

/* ── Features: i18n + timeline ── */
.feat-badge-orange { background:rgba(250,166,26,.12);color:var(--yellow);border:1px solid rgba(250,166,26,.2) }
.feat-pill-orange  { border-color:rgba(250,166,26,.3);background:rgba(250,166,26,.08);color:var(--yellow) }
.feat-i18n-text   { font-family:var(--font-code);font-size:.7rem;color:var(--text-dim);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:italic }
.feat-timeline    { font-size:.65rem;color:var(--cyan);letter-spacing:1px;flex-shrink:0;opacity:.7 }

/* ── Keyboard shortcuts modal ── */
.shortcut-row { display:flex;align-items:center;gap:16px;padding:7px 0;border-bottom:1px solid var(--border);font-size:.83rem }
.shortcut-row:last-child { border-bottom:none }
.shortcut-row kbd { background:var(--bg-raised);border:1px solid var(--border-hi);padding:3px 8px;border-radius:4px;font-family:var(--font-code);font-size:.73rem;color:var(--text-hi);white-space:nowrap;flex-shrink:0;min-width:90px;text-align:center }
.shortcut-row span { color:var(--text-dim) }

/* ── Toast notification ── */
.dispatch-toast { position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(10px);background:var(--bg-raised);border:1px solid var(--blurple);color:var(--text-hi);padding:10px 22px;border-radius:20px;font-size:.84rem;font-weight:600;z-index:9000;opacity:0;transition:all .3s;pointer-events:none;white-space:nowrap }
.dispatch-toast.show { opacity:1;transform:translateX(-50%) translateY(0) }

/* ── Feature toolbar (carried over) ── */
.feat-toolbar{display:flex;flex-direction:column;gap:12px;margin-bottom:20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px}
.feat-build-picker{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.feat-picker-group{display:flex;flex-direction:column;gap:5px;flex:1;min-width:160px}
.feat-picker-label{font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}
.feat-select{background:var(--bg-raised);border:1px solid var(--border-hi);color:var(--text);padding:7px 11px;border-radius:var(--radius-sm);font-family:var(--font-code);font-size:.77rem;outline:none;cursor:pointer;transition:border-color .2s}
.feat-select:hover,.feat-select:focus{border-color:var(--blurple)}
.feat-picker-arrow{color:var(--blurple);font-size:1.1rem;font-weight:700;flex-shrink:0;padding:0 4px;margin-top:16px}
.feat-filter-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--border)}
.feat-search{flex:1;min-width:140px;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:7px 12px;font-family:var(--font-ui);font-size:.82rem;outline:none;transition:border-color .2s}
.feat-search:focus{border-color:var(--blurple)}
.feat-search::placeholder{color:var(--text-dim)}
.feat-type-tabs{display:flex;gap:4px;flex-wrap:wrap}
.feat-type-tab{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:5px 11px;border-radius:20px;cursor:pointer;font-family:var(--font-ui);font-size:.74rem;font-weight:500;transition:all .2s;white-space:nowrap}
.feat-type-tab:hover{border-color:var(--border-hi);color:var(--text)}
.feat-type-tab.active{background:var(--blurple);border-color:var(--blurple);color:#fff}
.feat-treatments{display:flex;gap:4px;flex-wrap:wrap;margin-left:4px}
.feat-treat{background:rgba(88,101,242,.1);border:1px solid rgba(88,101,242,.2);color:var(--blurple);font-size:.63rem;padding:1px 6px;border-radius:3px;font-family:var(--font-code);white-space:nowrap}
.feat-rollout{background:rgba(59,165,93,.1);border:1px solid rgba(59,165,93,.2);color:var(--green);font-size:.65rem;font-weight:700;padding:1px 7px;border-radius:3px;font-family:var(--font-code);flex-shrink:0}
.feat-badge-purple{background:rgba(176,93,255,.12);color:#b05dff;border:1px solid rgba(176,93,255,.2)}
.feat-pill-purple{border-color:rgba(176,93,255,.3);background:rgba(176,93,255,.08);color:#b05dff}

/* ── Features v2 ── */
.feat-kind-blurple  { background:rgba(88,101,242,.15);color:var(--blurple);border-color:rgba(88,101,242,.25) }
.feat-kind-teal     { background:rgba(0,212,255,.1);color:var(--cyan);border-color:rgba(0,212,255,.2) }
.feat-kind-orange   { background:rgba(250,166,26,.12);color:var(--yellow);border-color:rgba(250,166,26,.2) }
.feat-badge-teal    { background:rgba(0,212,255,.1);color:var(--cyan);border:1px solid rgba(0,212,255,.2) }
.feat-pill-teal     { border-color:rgba(0,212,255,.3);background:rgba(0,212,255,.07);color:var(--cyan) }
.feat-pill-red      { border-color:rgba(237,66,69,.3);background:rgba(237,66,69,.07);color:var(--red) }

.feat-default-off   { font-size:.62rem;background:rgba(237,66,69,.1);color:var(--red);border:1px solid rgba(237,66,69,.2);padding:1px 5px;border-radius:3px;flex-shrink:0 }
.feat-treat-count   { font-size:.67rem;color:var(--text-dim);font-family:var(--font-code);flex-shrink:0 }
.feat-desc          { font-size:.68rem;color:var(--text-dim);font-style:italic;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0 }

.feat-copy-btn      { background:transparent;border:none;color:var(--text-dim);cursor:pointer;font-size:.75rem;padding:1px 5px;border-radius:3px;flex-shrink:0;transition:all .15s;opacity:0 }
.feat-row:hover .feat-copy-btn { opacity:1 }
.feat-copy-btn:hover { background:var(--bg-raised);color:var(--text) }

.feat-export-btn    { background:transparent;border:1px solid var(--border-hi);color:var(--text-dim);padding:4px 10px;border-radius:var(--radius-sm);cursor:pointer;font-size:.74rem;font-family:var(--font-ui);transition:all .2s;margin-left:auto }
.feat-export-btn:hover { border-color:var(--blurple);color:var(--blurple) }

.feat-section-new   { background:rgba(88,101,242,.03);border-color:rgba(88,101,242,.15) }
.feat-new-group     { margin:8px 0 0 }
.feat-new-group-label { font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);padding:6px 0 4px;display:flex;align-items:center;gap:6px }
.feat-new-count     { background:var(--bg-raised);border:1px solid var(--border);color:var(--text-dim);padding:1px 6px;border-radius:10px;font-weight:400 }
.features-meta      { display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:.77rem;color:var(--text-dim);padding:10px 0 16px }