*,*:before,*:after{box-sizing:border-box}:root{--color-modified: #ef4444;--color-exclusive: #3b82f6;--color-shared: #22c55e;--color-invalid: #6b7280;--color-uncached: #d1d5db;--color-bg: #f9fafb;--color-surface: #ffffff;--color-border: #e5e7eb;--color-text: #1f2937;--color-text-secondary: #6b7280;--color-primary: #3b82f6;--color-primary-hover: #2563eb}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--color-bg);color:var(--color-text);line-height:1.5}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:1rem 2rem;text-align:center}.app-header h1{margin:0 0 .25rem;font-size:1.5rem;font-weight:600}.app-header p{margin:0;color:var(--color-text-secondary);font-size:.875rem}.app-main{flex:1;display:flex;gap:1rem;padding:1rem;max-width:1600px;margin:0 auto;width:100%}.sidebar{width:280px;flex-shrink:0;display:flex;flex-direction:column;gap:1rem}.main-content{flex:1;display:flex;flex-direction:column;gap:1rem;min-width:0}.app-footer{background:var(--color-surface);border-top:1px solid var(--color-border);padding:1rem 2rem;text-align:center}.app-footer p{margin:0;color:var(--color-text-secondary);font-size:.75rem}.config-panel,.workload-panel,.event-log{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1rem}.config-panel h3,.workload-panel h3,.event-log h3{margin:0 0 1rem;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary)}.config-group{margin-bottom:1rem}.config-group:last-child{margin-bottom:0}.config-group label{display:block;font-size:.875rem;font-weight:500;margin-bottom:.5rem}.config-group input[type=range]{width:100%;margin-bottom:.25rem}.protocol-buttons{display:flex;gap:.5rem;margin-bottom:.5rem}.protocol-btn{flex:1;padding:.5rem;border:1px solid var(--color-border);border-radius:6px;background:var(--color-surface);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .15s}.protocol-btn:hover{border-color:var(--color-primary)}.protocol-btn-active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.protocol-info{font-size:.75rem;color:var(--color-text-secondary)}.node-count-labels{display:flex;justify-content:space-between;font-size:.75rem;color:var(--color-text-secondary)}.piranha-config-info{display:flex;flex-direction:column;gap:.25rem;padding:.75rem;background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid #86efac;border-radius:6px;font-size:.875rem;font-weight:500;color:#166534}.piranha-config-info .config-detail{font-size:.75rem;font-weight:400;color:#15803d}.workload-select select{width:100%;padding:.5rem;border:1px solid var(--color-border);border-radius:6px;font-size:.875rem;background:var(--color-surface);cursor:pointer}.workload-description{margin-top:.75rem;padding:.75rem;background:var(--color-bg);border-radius:6px;font-size:.8125rem;color:var(--color-text-secondary)}.operation-list{margin-top:1rem}.operation-list h4{margin:0 0 .5rem;font-size:.8125rem;font-weight:600}.operation-list ul{list-style:none;margin:0;padding:0}.operation-item{display:flex;gap:.5rem;padding:.375rem .5rem;border-radius:4px;font-size:.8125rem;font-family:SF Mono,Monaco,Inconsolata,monospace}.operation-done{opacity:.5;text-decoration:line-through}.operation-current{background:#dbeafe;font-weight:500}.operation-index{color:var(--color-text-secondary);min-width:1.5rem}.operation-node{color:var(--color-primary);font-weight:500}.operation-type{padding:0 .25rem;border-radius:3px}.operation-read{background:#dcfce7;color:#166534}.operation-write{background:#fee2e2;color:#991b1b}.operation-addr{color:var(--color-text-secondary)}.operation-data{color:var(--color-text)}.operation-empty{color:var(--color-text-secondary);font-style:italic;font-size:.8125rem}.event-log{flex:1;min-height:200px;display:flex;flex-direction:column}.event-list{flex:1;overflow-y:auto;max-height:400px}.event-item{display:flex;gap:.5rem;padding:.375rem 0;border-bottom:1px solid var(--color-border);font-size:.75rem;font-family:SF Mono,Monaco,Inconsolata,monospace}.event-item:last-child{border-bottom:none}.event-icon{flex-shrink:0}.event-time{color:var(--color-text-secondary);min-width:3rem}.event-text{flex:1}.event-empty{color:var(--color-text-secondary);font-style:italic;font-size:.8125rem;padding:1rem 0;text-align:center}.controls{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1rem;display:flex;align-items:center;gap:1.5rem}.controls-buttons{display:flex;gap:.5rem}.control-btn{width:40px;height:40px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-text);transition:all .15s}.control-btn:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary)}.control-btn:disabled{opacity:.5;cursor:not-allowed}.control-btn-primary{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.control-btn-primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover);color:#fff}.speed-control{display:flex;align-items:center;gap:.75rem}.speed-control label{font-size:.875rem;color:var(--color-text-secondary);white-space:nowrap}.speed-control input[type=range]{width:100px}.status-complete{margin-left:auto;padding:.375rem .75rem;background:#dcfce7;color:#166534;border-radius:9999px;font-size:.75rem;font-weight:500}.visualization{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1rem;display:flex;flex-direction:column;align-items:center}.visualization svg{max-width:100%;height:auto}.node-rect{fill:var(--color-surface);stroke:var(--color-border);stroke-width:2;transition:all .2s}.node-active .node-rect,.node-rect.node-active{stroke:var(--color-primary);stroke-width:3}.node-label{font-size:14px;font-weight:600;fill:var(--color-text)}.node-connection{stroke:var(--color-border);stroke-width:2;stroke-dasharray:4,4}.memory-rect{fill:#fef3c7;stroke:#f59e0b;stroke-width:2}.memory-label{font-size:14px;font-weight:600;fill:#92400e}.memory-cells{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.memory-cell{min-width:48px;height:22px;background:#fef9c3;border:1px solid #fbbf24;border-radius:4px;font-size:11px;display:flex;align-items:center;justify-content:center;gap:4px;font-family:SF Mono,Monaco,Inconsolata,monospace;padding:0 6px}.memory-addr{color:#92400e;font-size:9px}.memory-value{color:#1f2937;font-weight:600}.directory-rect{fill:#fae8ff;stroke:#a855f7;stroke-width:2}.directory-label{font-size:12px;font-weight:600;fill:#7e22ce}.directory-entries{font-size:10px}.directory-table{width:100%;border-collapse:collapse}.directory-table th,.directory-table td{padding:2px 4px;text-align:left;border-bottom:1px solid #e9d5ff}.directory-table th{font-weight:600;color:#7e22ce}.directory-state{display:inline-block;padding:1px 4px;border-radius:3px;color:#fff;font-weight:500}.directory-empty{text-align:center;color:var(--color-text-secondary);font-style:italic;padding:8px 0}.bus-line{stroke:#6b7280;stroke-linecap:round}.bus-active{stroke:var(--color-primary);animation:pulse .5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.bus-label{font-size:11px;fill:var(--color-text-secondary)}.bus-connector{fill:#6b7280}.message-circle{filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.message-label{font-size:9px;font-weight:600;fill:#fff;pointer-events:none}.message-path{stroke:var(--color-border);stroke-width:1;fill:none}.message-path-active{stroke:var(--color-primary);stroke-width:2}.cache-container{display:flex;flex-direction:column;gap:4px;height:100%}.cache-empty{font-size:10px;color:var(--color-text-secondary);text-align:center;padding:8px 0}.cache-line-compact{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;border-radius:4px;color:#fff;font-size:10px;font-weight:600;gap:4px}.cache-line-addr-compact,.cache-line-data-compact{font-size:9px;opacity:.9}.cache-more{font-size:9px;color:var(--color-text-secondary);text-align:center}.legend{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--color-border);width:100%}.legend h4{margin:0 0 .5rem;font-size:.75rem;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.legend-items{display:flex;gap:1rem;flex-wrap:wrap}.legend-item{display:flex;align-items:center;gap:.375rem;font-size:.8125rem}.legend-color{width:12px;height:12px;border-radius:3px}.chip-rect{fill:#f0fdf4;stroke:#16a34a;stroke-width:2}.chip-label{font-size:12px;font-weight:700;fill:#166534}.core-rect{fill:#fff;stroke:#d1d5db;stroke-width:1.5}.core-rect.core-active{stroke:var(--color-primary);stroke-width:2}.core-label{font-size:10px;font-weight:600;fill:var(--color-text)}.l1-cache-container{display:flex;gap:2px;justify-content:center;flex-wrap:wrap}.l1-empty{font-size:9px;color:var(--color-text-secondary);text-align:center}.l1-entry{width:14px;height:14px;border-radius:2px;font-size:8px;font-weight:600;color:#fff;display:flex;align-items:center;justify-content:center}.intra-chip-connection{stroke:#a7f3d0;stroke-width:1.5;stroke-dasharray:3,2}.l2-rect{fill:#fef3c7;stroke:#f59e0b;stroke-width:1.5}.l2-label{font-size:10px;font-weight:600;fill:#92400e}.l2-entries-container{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.l2-empty{font-size:9px;color:var(--color-text-secondary);font-style:italic}.l2-entry,.dir-entry{display:flex;align-items:center;gap:2px;padding:2px 4px;background:#fff;border-radius:3px;font-size:9px;font-family:SF Mono,Monaco,monospace}.l2-addr,.dir-addr{color:#92400e;font-size:8px}.l2-state,.dir-state{padding:1px 3px;border-radius:2px;color:#fff;font-weight:600;font-size:8px}.l2-data{color:var(--color-text);font-size:8px}.dir-entry{border:1px dashed #a855f7}.inter-chip-connection{stroke:#8b5cf6;stroke-width:2;stroke-dasharray:6,3}.inter-chip-ring{fill:none;stroke:#c4b5fd;stroke-width:3}.piranha-memory-rect{fill:#dbeafe;stroke:#3b82f6;stroke-width:2}.piranha-memory-label{font-size:12px;font-weight:600;fill:#1e40af}@media(max-width:1200px){.app-main{flex-direction:column}.sidebar{width:100%;flex-direction:row;flex-wrap:wrap}.sidebar>*{flex:1;min-width:250px}}@media(max-width:768px){.app-header{padding:.75rem 1rem}.app-header h1{font-size:1.25rem}.controls{flex-wrap:wrap}}
