.navbar{display:flex;align-items:center;gap:0;padding:0 24px;height:56px;border-bottom:1px solid var(--border);background:var(--bg-surface);position:sticky;top:0;z-index:100}.navbar-brand{display:flex;align-items:center;gap:10px;flex-shrink:0;margin-right:32px}.navbar-icon{font-size:22px;color:#f97316;line-height:1}.navbar-title{font-size:15px;font-weight:600;color:var(--text-white);white-space:nowrap}.navbar-tabs{display:flex;align-items:stretch;height:100%;gap:0;flex:1}.nav-tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--text-muted);padding:0 18px;font-size:13px;font-weight:500;cursor:pointer;height:100%;transition:color .15s,border-color .15s;white-space:nowrap}.nav-tab:hover{color:var(--text-white)}.nav-tab.active{color:#f97316;border-bottom-color:#f97316}.navbar-actions{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}.icon-btn{background:var(--badge-bg);border:1px solid var(--border);color:var(--text-muted);width:32px;height:32px;border-radius:6px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}.icon-btn:hover{background:var(--border);color:var(--text-white)}.overview-cards{display:flex;gap:16px;margin-bottom:32px;flex-wrap:wrap}.overview-card{flex:1;min-width:160px;padding:20px 24px;border-radius:10px;border:1px solid var(--border);background:var(--bg-surface);transition:transform .15s,box-shadow .15s}.overview-card:hover{transform:translateY(-2px);box-shadow:0 4px 20px #00000026}.card-value{font-size:32px;font-weight:700;line-height:1;margin-bottom:6px}.card-label{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}body.dark .card-blue{border-color:#3b82f633}body.dark .card-blue .card-value{color:#60a5fa}body.dark .card-green{border-color:#22c55e33}body.dark .card-green .card-value{color:#4ade80}body.dark .card-yellow{border-color:#f59e0b33}body.dark .card-yellow .card-value{color:#fbbf24}body.dark .card-purple{border-color:#a855f733}body.dark .card-purple .card-value{color:#c084fc}body.light .card-blue{border-color:#bfdbfe}body.light .card-blue .card-value{color:#2563eb}body.light .card-green{border-color:#bbf7d0}body.light .card-green .card-value{color:#16a34a}body.light .card-yellow{border-color:#fde68a}body.light .card-yellow .card-value{color:#ca8a04}body.light .card-purple{border-color:#e9d5ff}body.light .card-purple .card-value{color:#9333ea}.section-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:14px}.section-header .section-title{margin-bottom:0}.topic-filters{display:flex;align-items:center;gap:14px}.toggle-label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-label input[type=checkbox]{accent-color:#f97316;width:14px;height:14px}.search-input{background:var(--bg-surface);border:1px solid var(--border);color:var(--text);padding:6px 12px;border-radius:6px;font-size:13px;width:220px;outline:none;transition:border-color .15s}.search-input:focus{border-color:#f97316}.topic-row{cursor:pointer;transition:background .15s}.topic-row.row-hovered{background:var(--bg-hover)!important}.topic-name{font-family:SF Mono,Fira Code,monospace;font-size:12px;display:flex;align-items:center;gap:6px}.chevron{display:inline-block;font-size:16px;color:var(--text-muted);transition:transform .2s ease,color .15s;line-height:1;width:14px}.chevron.open{transform:rotate(90deg);color:#f97316}.empty-row{text-align:center;color:var(--text-muted);padding:24px!important;font-size:13px}.detail-row>td{padding:0!important;border-bottom:none!important;background:transparent}.detail-inner{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease;overflow:hidden}.detail-row.expanded .detail-inner{grid-template-rows:1fr}.detail-inner>*{overflow:hidden}.detail-content-wrap{padding:0 16px;transition:padding .28s ease}.detail-row.expanded .detail-content-wrap{padding:14px 16px 18px}.detail-loading{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-muted);padding:12px 0}.detail-meta-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.meta-chip{background:var(--badge-bg);border:1px solid var(--border);border-radius:8px;padding:6px 14px;display:flex;flex-direction:column;gap:2px}.meta-chip.accent{border-color:#f9731633}.mc-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.mc-value{font-size:16px;font-weight:600;color:var(--text-heading)}.meta-chip.accent .mc-value{color:#f97316}.partition-grid{display:flex;gap:10px;flex-wrap:wrap}.partition-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 14px;min-width:160px;flex:1;max-width:220px;transition:border-color .15s,transform .15s;animation:slideUp .2s ease both}.partition-card:hover{border-color:#f97316;transform:translateY(-2px)}@keyframes slideUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.p-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.p-id{font-size:13px;font-weight:700;color:#f97316;font-family:SF Mono,Fira Code,monospace}.p-leader{font-size:11px;color:var(--text-muted)}.p-replicas{font-size:11px;color:var(--text-muted);margin-bottom:8px;font-family:SF Mono,Fira Code,monospace}.p-offsets{display:flex;flex-direction:column;gap:3px;border-top:1px solid var(--border);padding-top:7px}.offset-row{display:flex;justify-content:space-between;align-items:center}.offset-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.offset-val{font-size:12px;font-family:SF Mono,Fira Code,monospace;color:var(--text)}.offset-val.accent{color:#4ade80;font-weight:600}.pvc-full-detail{display:flex;flex-direction:column;gap:14px}.storage-usage-block{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:14px 16px}.storage-bar-wrap{display:flex;align-items:center;gap:12px;margin-bottom:12px}.storage-bar-track{flex:1;height:10px;background:var(--badge-bg);border-radius:99px;overflow:hidden;border:1px solid var(--border)}.storage-bar-fill{height:100%;border-radius:99px;transition:width .4s ease}.storage-bar-pct{font-size:13px;font-weight:700;min-width:72px;text-align:right;font-family:SF Mono,Fira Code,monospace}.storage-stats-row{display:flex;gap:24px;flex-wrap:wrap}.storage-stat{display:flex;flex-direction:column;gap:2px}.ss-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.ss-value{font-size:14px;font-weight:600;font-family:SF Mono,Fira Code,monospace;color:var(--text-heading)}.ss-used .ss-value{color:#f87171}.ss-avail .ss-value{color:#4ade80}.ss-total .ss-value{color:#60a5fa}body.light .ss-used .ss-value{color:#dc2626}body.light .ss-avail .ss-value{color:#16a34a}body.light .ss-total .ss-value{color:#2563eb}.capacity-badge{display:inline-block;background:var(--badge-bg);border:1px solid #a855f733;color:#c084fc;font-size:12px;font-weight:600;padding:2px 10px;border-radius:10px;font-family:SF Mono,Fira Code,monospace}body.light .capacity-badge{border-color:#e9d5ff;color:#9333ea}.pvc-detail-grid{display:flex;gap:10px;flex-wrap:wrap;padding:2px 0}.pvc-detail-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 14px;min-width:150px;flex:1;max-width:240px;display:flex;flex-direction:column;gap:4px;transition:border-color .15s,transform .15s;animation:slideUp .2s ease both}.pvc-detail-card.wide{max-width:100%;flex-basis:100%}.pvc-detail-card:hover{border-color:#a855f7;transform:translateY(-2px)}.pvc-dc-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.pvc-dc-value{font-size:13px;font-weight:500;color:var(--text-heading);word-break:break-all}.pvc-dc-value.accent-val{color:#c084fc;font-weight:700}body.light .pvc-dc-value.accent-val{color:#9333ea}.label-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.label-chip{background:var(--badge-bg);border:1px solid var(--border);color:var(--text-muted);font-size:11px;padding:2px 8px;border-radius:8px;font-family:SF Mono,Fira Code,monospace}.mono-sm{font-family:SF Mono,Fira Code,monospace;font-size:12px}.text-muted{color:var(--text-muted)}.spinner{display:inline-block;width:12px;height:12px;border:2px solid var(--border);border-top-color:#f97316;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.learn-page{display:flex;flex-direction:column;gap:56px;max-width:1200px;margin:0 auto;padding:0 24px 48px}.learn-hero{text-align:center;padding:48px 0 8px}.hero-badge{display:inline-block;padding:4px 14px;border-radius:20px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:#3b82f626;color:#3b82f6;border:1px solid rgba(59,130,246,.3);margin-bottom:16px}.learn-hero h1{font-size:clamp(28px,5vw,44px);font-weight:800;color:var(--text-white);margin-bottom:14px;letter-spacing:-.5px;line-height:1.15}.learn-hero .subtitle{font-size:16px;color:var(--text-muted);max-width:600px;margin:0 auto;line-height:1.7}.section-title{font-size:22px;font-weight:700;color:var(--text-white);margin-bottom:6px}.section-subtitle{font-size:14px;color:var(--text-muted);margin-bottom:24px;line-height:1.6}.section-header-row{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:24px;flex-wrap:wrap}.arch-section{display:flex;flex-direction:column}.arch-diagram-wrap{background:var(--bg-surface);border:1px solid var(--border);border-radius:16px;padding:12px;overflow:hidden;position:relative}.arch-svg{width:100%;height:auto;display:block}.arch-hint{text-align:center;color:var(--text-muted);font-size:13px;margin-top:12px;opacity:.7;font-style:italic}.arch-node{cursor:pointer;transition:filter .2s ease}.arch-node:hover{filter:brightness(1.25)}.arch-node.active-node{filter:drop-shadow(0 0 8px var(--node-color, currentColor)) brightness(1.3)}.detail-panel{position:fixed;z-index:9999;border:1px solid var(--panel-color, var(--border));border-left-width:3px;border-radius:14px;background:var(--bg-surface);padding:20px;animation:tooltipIn .18s cubic-bezier(.22,1,.36,1);box-shadow:0 12px 40px #0000004d;pointer-events:none;overflow-y:auto;max-height:80vh}body.dark .detail-panel{box-shadow:0 12px 40px #0009}@keyframes tooltipIn{0%{opacity:0;transform:scale(.95) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}.detail-close{display:none;position:absolute;top:16px;right:16px;background:var(--border);border:none;border-radius:50%;width:28px;height:28px;font-size:18px;line-height:28px;text-align:center;cursor:pointer;color:var(--text-muted);transition:background .15s,color .15s;padding:0;display:flex;align-items:center;justify-content:center}.detail-close:hover{background:var(--panel-color, #3b82f6);color:#fff}.detail-header{display:flex;align-items:flex-start;gap:16px;margin-bottom:14px}.detail-icon{font-size:40px;line-height:1;flex-shrink:0}.detail-title{font-size:20px;font-weight:700;margin-bottom:4px}.detail-tagline{font-size:14px;color:var(--text-muted);font-style:italic}.detail-desc{font-size:14px;color:var(--text);line-height:1.7;margin-bottom:16px}.detail-facts{list-style:none;display:flex;flex-direction:column;gap:8px}.detail-facts li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--text);line-height:1.5}.detail-bullet{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-top:5px}.concepts-section{display:flex;flex-direction:column}.concept-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}@media (max-width: 700px){.concept-grid{grid-template-columns:1fr}}.concept-card{border:1px solid var(--border);border-radius:14px;background:var(--bg-surface);overflow:hidden;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,transform .15s ease;-webkit-user-select:none;user-select:none}.concept-card:hover{border-color:var(--card-color, #3b82f6);box-shadow:0 4px 24px #0000001f;transform:translateY(-1px)}body.dark .concept-card:hover{box-shadow:0 4px 24px #00000059}.concept-card.expanded{border-color:var(--card-color, #3b82f6);box-shadow:0 0 0 1px var(--card-color, #3b82f6),0 8px 32px #0000001f}body.dark .concept-card.expanded{box-shadow:0 0 0 1px var(--card-color, #3b82f6),0 8px 32px #0006}.concept-header{padding:18px 20px;display:flex;align-items:flex-start;gap:14px}.concept-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.concept-header-text{flex:1;min-width:0}.concept-title{font-size:16px;font-weight:700;color:var(--text-white);margin-bottom:4px}.concept-summary{font-size:13px;color:var(--text-muted);line-height:1.5}.concept-chevron{flex-shrink:0;color:var(--text-muted);font-size:18px;transition:transform .3s ease;margin-top:2px}.concept-chevron-open{transform:rotate(180deg);color:var(--card-color, #3b82f6)}.concept-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.22,1,.36,1)}.concept-card.expanded .concept-body{grid-template-rows:1fr}.concept-body-inner{overflow:hidden;padding:0 20px;transition:padding .35s ease}.concept-card.expanded .concept-body-inner{padding:0 20px 22px}.concept-detail{font-size:13.5px;color:var(--text);line-height:1.75;white-space:pre-line;margin-bottom:18px}.mini-diagram{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px;font-family:SF Mono,Fira Code,monospace;font-size:12px}.mini-label{font-size:11px;color:var(--text-muted);margin-bottom:10px;font-style:italic}.mini-hint{font-size:10px;color:var(--text-muted);margin-top:8px;font-family:-apple-system,sans-serif;font-style:italic}.mini-partitions{display:flex;flex-direction:column;gap:6px}.mini-partition-row{display:flex;align-items:center;gap:8px}.mini-partition-badge{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700;width:28px;text-align:center;flex-shrink:0}.mini-partition-blocks{display:flex;gap:2px;flex-wrap:nowrap}.mini-block{width:22px;height:22px;border:1px solid;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:9px}.mini-block-append{opacity:.5;border-style:dashed}.mini-offset-row{display:flex;align-items:center;gap:2px;flex-wrap:wrap}.mini-offset-box{border:1px solid var(--border);border-radius:4px;padding:4px 6px;text-align:center;min-width:38px}.mini-offset-num{font-size:9px;color:var(--text-muted)}.mini-offset-val{font-size:11px;color:var(--text);font-weight:600}.mini-offset-new{border-color:#10b981;background:#10b9811a;animation:flashNew 1.5s ease infinite}@keyframes flashNew{0%,to{opacity:.6}50%{opacity:1}}.mini-arrow{font-size:16px;color:var(--text-muted);padding:0 4px}.mini-acks{display:flex;flex-direction:column;gap:8px}.mini-ack-row{display:flex;align-items:center;gap:8px}.mini-ack-label{font-size:10px;font-weight:700;width:56px;flex-shrink:0;color:var(--text)}.mini-ack-bar-bg{flex:1;height:12px;background:var(--border);border-radius:6px;overflow:hidden}.mini-ack-bar{height:100%;border-radius:6px;transition:width .4s ease}.mini-ack-desc{font-size:10px;color:var(--text-muted);width:72px;text-align:right;flex-shrink:0}.mini-cg{display:flex;flex-direction:column;gap:10px}.mini-topic-box{text-align:center;padding:6px 10px;border:1px solid #8b5cf6;border-radius:6px;color:#8b5cf6;font-size:11px;font-weight:700;background:#8b5cf61a}.mini-cg-split{display:flex;gap:8px}.mini-cg-group{flex:1;border:1px solid;border-radius:6px;padding:8px}.mini-cg-consumers{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.mini-consumer{font-size:9px;border:1px solid;border-radius:4px;padding:2px 5px;color:var(--text)}.mini-repl-boxes{display:flex;gap:8px;align-items:flex-start}.mini-repl-box{border:1px solid var(--border);border-radius:6px;padding:8px 10px;min-width:70px}.mini-repl-leader{border-color:#f97316;background:#f9731614}.mini-repl-follower{border-color:#3b82f6;background:#3b82f614}.mini-badge-leader{font-size:9px;font-weight:800;color:#f97316;letter-spacing:.05em}.mini-badge-follower{font-size:9px;font-weight:800;color:#3b82f6;letter-spacing:.05em}.mini-repl-arrows{display:flex;flex-direction:column;justify-content:center;padding-top:20px;gap:4px}.mini-repl-arrow{font-size:16px;color:#3b82f6;animation:pulse-arrow 1.5s ease infinite}@keyframes pulse-arrow{0%,to{opacity:.3;transform:translate(-2px)}50%{opacity:1;transform:translate(2px)}}.mini-repl-followers{display:flex;flex-direction:column;gap:6px}.mini-kraft-row{display:flex;align-items:center;gap:10px}.mini-kraft-box{flex:1;border:1px solid var(--border);border-radius:6px;padding:8px 10px}.mini-kraft-quorum{border-color:#f59e0b;background:#f59e0b14}.mini-kraft-brokers{border-color:#3b82f6;background:#3b82f614}.mini-kraft-arrow{font-size:18px;color:var(--text-muted);flex-shrink:0}.commit-log-section{display:flex;flex-direction:column}.append-btn{padding:10px 20px;border-radius:8px;border:1px solid #3b82f6;background:#3b82f61f;color:#3b82f6;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s,transform .1s;white-space:nowrap;flex-shrink:0}.append-btn:hover:not(:disabled){background:#3b82f640;transform:translateY(-1px)}.append-btn:active:not(:disabled){transform:translateY(0)}.append-btn:disabled{opacity:.5;cursor:not-allowed}.log-scroll-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:12px;background:var(--bg-surface);padding:16px}.log-messages{display:flex;gap:0;align-items:stretch;min-width:max-content}.log-msg{min-width:90px;border:1px solid var(--border);border-left:none;padding:8px 10px;flex-shrink:0;background:var(--bg);transition:background .15s}.log-msg:first-child{border-left:1px solid var(--border);border-radius:6px 0 0 6px}.log-msg:last-of-type{border-radius:0 6px 6px 0}.log-msg:hover{background:var(--bg-hover)}.log-msg.new-msg{animation:appendMsg .4s cubic-bezier(.22,1,.36,1);border-color:#3b82f6;background:#3b82f614}@keyframes appendMsg{0%{opacity:0;transform:translate(20px) scaleX(.5);transform-origin:left}to{opacity:1;transform:translate(0) scaleX(1)}}.log-offset{font-size:9px;color:var(--text-muted);font-family:SF Mono,Fira Code,monospace;margin-bottom:4px}.log-key{font-size:11px;font-weight:600;color:#3b82f6;font-family:monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}.log-value{font-size:11px;color:#10b981;font-family:monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}.log-tail{display:flex;align-items:center;padding:0 16px;font-size:11px;color:var(--text-muted);font-style:italic;white-space:nowrap}.log-legend{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:14px}.log-legend-item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted)}.log-legend-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.replication-section{display:flex;flex-direction:column}.replication-wrap{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}.replica-box{flex:1;min-width:160px;border:1px solid var(--border);border-radius:12px;padding:16px;background:var(--bg-surface);transition:border-color .3s,box-shadow .3s}.leader-box{border-color:#f97316;box-shadow:0 0 16px #f973161f}body.dark .leader-box{box-shadow:0 0 16px #f9731633}.follower-box{border-color:var(--border)}.follower-box.isr-in{border-color:#3b82f6}.follower-box.isr-out{border-color:#ef4444}.replica-badge{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.08em;padding:2px 8px;border-radius:4px;margin-bottom:8px}.replica-badge-leader{background:#f9731626;color:#f97316;border:1px solid rgba(249,115,22,.4)}.replica-badge-follower{background:#3b82f61f;color:#3b82f6;border:1px solid rgba(59,130,246,.35)}.replica-broker-label{font-size:14px;font-weight:700;color:var(--text-white);margin-bottom:4px}.replica-partition{font-size:12px;color:var(--text-muted);font-family:monospace;margin-bottom:10px}.replica-offset{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--border);border-radius:6px;padding:6px 10px;background:var(--bg);margin-bottom:8px}.offset-label{font-size:11px;color:var(--text-muted)}.offset-value{font-size:18px;font-weight:800;font-family:monospace;transition:transform .3s ease}.replica-log{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}.replica-log-entry{display:flex;align-items:center;gap:8px;font-family:monospace;font-size:11px;padding:3px 6px;border-radius:4px;background:var(--bg);border:1px solid var(--border)}.replica-log-entry.log-entry-new{border-color:#f97316;background:#f9731614;animation:flashNew 1s ease}.entry-offset{color:var(--text-muted);min-width:16px}.entry-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.replica-isr-info{font-size:11px;color:var(--text-muted);text-align:center;padding:4px;border-radius:4px;background:var(--bg)}.replica-isr-info.isr-yes{color:#10b981;background:#10b9811a}.replica-isr-info.isr-no{color:#ef4444;background:#ef44441a}.replication-arrow-col{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 0;gap:2px;flex-shrink:0}.repl-arrow-label{font-size:9px;color:var(--text-muted);font-style:italic;text-align:center;writing-mode:horizontal-tb}.repl-arrow{font-size:22px;color:#3b82f6;animation:pulse-arrow-h 2s ease infinite;opacity:.5;transition:opacity .3s}.replication-arrow-col.arrow-active .repl-arrow{opacity:1;animation:pulse-arrow-fast .5s ease infinite}@keyframes pulse-arrow-h{0%,to{opacity:.3;transform:translate(-3px)}50%{opacity:.8;transform:translate(3px)}}@keyframes pulse-arrow-fast{0%,to{opacity:.7;transform:translate(-4px) scale(1.1)}50%{opacity:1;transform:translate(4px) scale(1.2)}}.followers-col{display:flex;flex-direction:column;gap:12px;flex:2}.isr-legend{margin-top:16px}.isr-info-box{padding:12px 16px;border-radius:8px;border:1px solid var(--border);background:var(--bg-surface);font-size:13px;color:var(--text-muted);line-height:1.6}.isr-info-box strong{color:var(--text)}@media (max-width: 768px){.learn-page{gap:40px;padding:0 16px 32px}.learn-hero h1{font-size:28px}.section-header-row{flex-direction:column;align-items:stretch}.append-btn{width:100%;text-align:center}.replication-wrap{flex-direction:column}.replication-arrow-col{flex-direction:row;padding:0;width:100%;justify-content:center}.repl-arrow{transform:rotate(90deg)}.followers-col{flex-direction:row;flex:unset;width:100%}.followers-col .replica-box{flex:1}.arch-diagram-wrap{padding:4px}}@media (max-width: 500px){.detail-header,.followers-col{flex-direction:column}}.app-shell{display:flex;flex-direction:column;min-height:100vh}.app-content{max-width:1400px;width:100%;margin:0 auto;padding:32px 24px 48px;flex:1}.section{margin-bottom:40px}.section-title{font-size:15px;font-weight:600;color:var(--text-heading);margin-bottom:14px;display:flex;align-items:center;gap:10px}.count-badge{background:var(--badge-bg);border:1px solid var(--border);color:var(--text-muted);font-size:11px;font-weight:500;padding:1px 8px;border-radius:10px}.namespace-badge{background:var(--badge-bg);border:1px solid var(--border);color:var(--text-muted);font-size:12px;padding:2px 10px;border-radius:12px}.last-sync{font-size:12px;color:var(--text-muted)}.table-wrap{overflow-x:auto;border-radius:10px;border:1px solid var(--border)}table{width:100%;border-collapse:collapse;font-size:13px}thead tr{background:var(--bg-surface)}thead th{text-align:left;padding:11px 16px;color:var(--text-muted);font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border)}tbody tr{border-bottom:1px solid var(--border);transition:background .15s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:var(--bg-hover)}tbody td{padding:11px 16px;color:var(--text)}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:12px;font-size:12px;font-weight:500}body.dark .badge-green{background:#14532d33;color:#4ade80;border:1px solid #4ade8033}body.dark .badge-red{background:#7f1d1d33;color:#f87171;border:1px solid #f8717133}body.dark .badge-yellow{background:#78350f33;color:#fbbf24;border:1px solid #fbbf2433}body.dark .badge-orange{background:#7c2d1233;color:#fb923c;border:1px solid #fb923c33}body.dark .badge-gray{background:var(--badge-bg);color:var(--text-muted);border:1px solid var(--border)}body.light .badge-green{background:#dcfce7;color:#16a34a;border:1px solid #86efac}body.light .badge-red{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}body.light .badge-yellow{background:#fef9c3;color:#ca8a04;border:1px solid #fde047}body.light .badge-orange{background:#ffedd5;color:#ea580c;border:1px solid #fdba74}body.light .badge-gray{background:var(--badge-bg);color:var(--text-muted);border:1px solid var(--border)}.status-msg{text-align:center;padding:48px;color:var(--text-muted);font-size:14px}.status-msg.error{color:#f87171}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh;transition:background .2s,color .2s}body.dark{--bg: #0f1117;--bg-surface: #181b27;--bg-hover: #181b27;--border: #2a2d3a;--text: #e0e0e0;--text-muted: #64748b;--text-heading: #cbd5e1;--text-white: #ffffff;--badge-bg: #1e2130;background:var(--bg);color:var(--text)}body.light{--bg: #f1f5f9;--bg-surface: #ffffff;--bg-hover: #eff6ff;--border: #cbd5e1;--text: #1e293b;--text-muted: #64748b;--text-heading: #0f172a;--text-white: #0f172a;--badge-bg: #e2e8f0;background:var(--bg);color:var(--text)}
