@keyframes fade-in-up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-ring{0%{box-shadow:0 0 #7dd3fc8c}70%{box-shadow:0 0 0 12px #7dd3fc00}to{box-shadow:0 0 #7dd3fc00}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}@keyframes success-pop{0%{transform:scale(.94);opacity:0}60%{transform:scale(1.03)}to{transform:scale(1);opacity:1}}.cl-header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 20px;background:#0e1f1e;position:relative;overflow:hidden}.cl-header:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(77,207,176,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(77,207,176,.05) 1px,transparent 1px);background-size:24px 24px;pointer-events:none}.cl-header-left{display:flex;align-items:center;gap:14px;position:relative;z-index:1}.cl-badge{width:36px;height:36px;background:#162b2a;border:1px solid #2a4a44;border-radius:6px;display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:13px;font-weight:700;color:#4dcfb0;letter-spacing:.5px;flex-shrink:0}.cl-header-text{display:flex;flex-direction:column;gap:2px}.cl-title{font-size:16px;font-weight:700;color:#e8f5f2;letter-spacing:1.5px;line-height:1.2}.cl-sub{font-size:11px;color:#4dcfb0;letter-spacing:1px;font-family:monospace;opacity:.8;text-decoration:none}.cl-sub:hover{opacity:1;text-decoration:underline}.cl-header-nav{display:flex;align-items:center;gap:8px;position:relative;z-index:1}.cl-nav-btn{padding:6px 14px;font-size:11px;font-family:monospace;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#4dcfb0;background:#162b2a;border:1px solid #2a4a44;border-radius:6px;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s}.cl-nav-btn:hover{background:#1e3c3a;border-color:#4dcfb0}.cl-theme-toggle{width:36px;height:36px;background:#162b2a;border:1px solid #2a4a44;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;color:#4dcfb0;transition:background .15s,border-color .15s;line-height:1}.cl-theme-toggle:hover{background:#1e3c3a;border-color:#4dcfb0}:root[data-theme=light] .cl-header{background:#0e1f1e}:root{--page-bg: #0f1218;--surface: rgba(22, 28, 37, .84);--surface-strong: rgba(14, 18, 26, .96);--surface-soft: rgba(31, 39, 52, .72);--text-primary: #ecf1f7;--text-muted: #9fb0c6;--accent: #7dd3fc;--accent-strong: #f59e0b;--success: #4ade80;--danger: #f87171;--border-color: rgba(157, 182, 212, .22);--shadow-color: rgba(3, 9, 18, .38);--hover-surface: rgba(39, 49, 65, .92);--hero-bg: radial-gradient(circle at top left, rgba(125, 211, 252, .22), transparent 36%), radial-gradient(circle at top right, rgba(245, 158, 11, .22), transparent 28%), linear-gradient(180deg, rgba(15, 18, 24, .98), rgba(11, 15, 22, 1));color-scheme:dark;font-family:IBM Plex Sans,sans-serif}:root[data-theme=light]{--page-bg: #f4efe6;--surface: rgba(255, 251, 245, .9);--surface-strong: rgba(255, 255, 255, .98);--surface-soft: rgba(244, 234, 216, .85);--text-primary: #1f2937;--text-muted: #5f6b7b;--accent: #0f766e;--accent-strong: #c2410c;--success: #15803d;--danger: #b91c1c;--border-color: rgba(105, 120, 137, .22);--shadow-color: rgba(43, 52, 66, .16);--hover-surface: rgba(241, 234, 223, .98);--hero-bg: radial-gradient(circle at top left, rgba(15, 118, 110, .15), transparent 35%), radial-gradient(circle at top right, rgba(194, 65, 12, .15), transparent 26%), linear-gradient(180deg, rgba(251, 247, 240, .98), rgba(241, 233, 219, 1));color-scheme:light}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--page-bg);color:var(--text-primary)}body{background-image:linear-gradient(180deg,rgba(255,255,255,.02),transparent 22%),linear-gradient(120deg,rgba(125,211,252,.08),transparent 45%)}button,input,select{font:inherit}a{color:inherit}code{font-family:IBM Plex Mono,monospace;word-break:break-all}#app{min-height:100vh}.skip-link{position:absolute;left:.75rem;top:.5rem;transform:translateY(-180%);z-index:1000;background:var(--surface-strong);color:var(--text-primary);border:1px solid var(--border-color);border-radius:999px;padding:.55rem .85rem;text-decoration:none}.skip-link:focus-visible{transform:translateY(0)}.app-shell{width:min(1380px,calc(100vw - 2rem));margin:0 auto;padding:1.25rem 0 2rem}.hero{position:relative;overflow:hidden;border:1px solid var(--border-color);border-radius:28px;padding:2rem;background:var(--hero-bg);box-shadow:0 30px 80px var(--shadow-color)}.hero-copy{max-width:56rem}.eyebrow{margin:0 0 .5rem;color:var(--accent);text-transform:uppercase;letter-spacing:.18em;font-size:.78rem}h1,h2{margin:0}h1{font-size:clamp(2.2rem,5vw,4.4rem);line-height:.96}h2{font-size:1.3rem}.lead,.scenario-line,.summary-line,.muted,.details-body,.timeline-item p,.link-card span,.callout p,.scripture-footer{color:var(--text-muted)}.lead{max-width:52rem;font-size:1.05rem}.chip-row{display:flex;flex-wrap:wrap;gap:.75rem;margin:1rem 0}.chip-row span,.preset-button,.theme-toggle{border:1px solid var(--border-color);background:var(--surface-soft);color:var(--text-primary)}.chip-row span{border-radius:999px;padding:.45rem .8rem}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem}.span-two{grid-column:1 / -1}.panel{border:1px solid var(--border-color);border-radius:24px;background:var(--surface);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 18px 50px var(--shadow-color);padding:1.2rem;animation:fade-in-up .35s ease both}.panel-heading{display:flex;align-items:start;justify-content:space-between;gap:1rem;margin-bottom:1rem}.preset-row{display:flex;flex-wrap:wrap;gap:.5rem}.preset-button,.primary-button,.theme-toggle{transition:transform .18s ease,background .18s ease,border-color .18s ease}.preset-button,.primary-button{border-radius:999px;padding:.65rem .95rem;min-height:2.75rem;cursor:pointer}.primary-button{border:none;background:linear-gradient(120deg,var(--accent),var(--accent-strong));color:var(--surface-strong);font-weight:700}.theme-toggle{z-index:10;width:2.6rem;height:2.6rem;min-width:2.75rem;min-height:2.75rem;border-radius:50%;cursor:pointer}.preset-button:hover,.primary-button:hover,.theme-toggle:hover,select:hover,input:hover,.link-card:hover{transform:translateY(-1px);background:var(--hover-surface)}.config-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.config-grid label{display:grid;gap:.4rem}.config-grid label span{font-size:.88rem;color:var(--text-muted)}select,input{width:100%;border:1px solid var(--border-color);border-radius:14px;background:var(--surface-strong);color:var(--text-primary);padding:.8rem .9rem;min-height:2.75rem}.preset-button:focus-visible,.primary-button:focus-visible,.theme-toggle:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,.link-card:focus-visible,.skip-link:focus-visible{outline:3px solid var(--accent);outline-offset:2px}table caption{text-align:left;padding:.7rem .8rem;color:var(--text-muted);font-size:.86rem}.table-shell,.matrix-shell{max-height:28rem;overflow:auto;border-radius:16px;border:1px solid var(--border-color);background:var(--surface-strong)}table{width:100%;border-collapse:collapse}th,td{padding:.8rem;text-align:left;border-bottom:1px solid var(--border-color)}.matrix-block+.matrix-block{margin-top:.8rem}.matrix-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(7rem,1fr);gap:.35rem;padding:.35rem}.short-row{background:#4ade801a}.matrix-cell{padding:.55rem;border-radius:12px;background:var(--surface-soft);font-family:IBM Plex Mono,monospace;font-size:.82rem}.recovery-banner{border-radius:18px;padding:.9rem 1rem;margin-bottom:1rem;font-weight:700;letter-spacing:.06em}.recovery-banner.success{background:#4ade8029;color:var(--success);animation:success-pop .45s cubic-bezier(.34,1.56,.64,1) both}.recovery-banner.failure{background:#f871711f;color:var(--danger)}.recovery-grid,.meta-grid,.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.key-card,.callout,.meta-grid article,.link-card{border:1px solid var(--border-color);border-radius:18px;background:var(--surface-strong);padding:1rem}.key-card,.meta-grid article{display:grid;gap:.4rem}.info-stack{display:grid;gap:.85rem;margin-top:1rem}.details-stack{display:grid;gap:.75rem}.explain-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.explain-panel h3{margin:0;font-size:1rem}.explain-panel .callout p{margin:.55rem 0 0;line-height:1.6}details{border:1px solid var(--border-color);border-radius:16px;background:var(--surface-strong);padding:.8rem 1rem}summary{cursor:pointer;font-weight:700}.details-body{padding-top:.8rem}.timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}.timeline-item{padding:1rem;border-left:3px solid var(--accent);background:var(--surface-strong);border-radius:18px}.timeline-item span{font-size:1.25rem;font-weight:700}.link-card{display:grid;gap:.45rem;text-decoration:none}.meta-panel{margin-bottom:1rem}.scripture-footer{text-align:center;padding:2rem 1rem;font-size:.85rem;border-top:1px solid var(--border-color);margin-top:2rem}.attack-pipeline{display:flex;align-items:center;flex-wrap:wrap;gap:0;margin:1rem 0 .5rem}.pipeline-step{display:flex;align-items:center;gap:.45rem;padding:.45rem .85rem;border-radius:999px;border:1px solid var(--border-color);background:var(--surface-soft);font-size:.82rem;font-weight:600;color:var(--text-muted);transition:background .2s,color .2s,border-color .2s;white-space:nowrap}.pipeline-step.active{background:#7dd3fc24;border-color:var(--accent);color:var(--accent);animation:pulse-ring 1.6s ease-out infinite}.pipeline-step.done{background:#4ade801a;border-color:#4ade8059;color:var(--success)}.pipeline-step.failed{background:#f871711a;border-color:#f8717159;color:var(--danger)}.pipeline-arrow{color:var(--text-muted);font-size:.75rem;opacity:.5;padding:0 .15rem;-webkit-user-select:none;user-select:none}.spinner{width:1.1rem;height:1.1rem;border:2px solid rgba(125,211,252,.22);border-top-color:var(--accent);border-radius:50%;display:inline-block;animation:spin .72s linear infinite;vertical-align:middle;flex-shrink:0}.loading-label{display:flex;align-items:center;gap:.6rem;color:var(--text-muted)}.elapsed-badge{font-family:IBM Plex Mono,monospace;font-size:.8rem;background:var(--surface-soft);border:1px solid var(--border-color);border-radius:999px;padding:.15rem .7rem;color:var(--accent)}.copy-btn{border:1px solid var(--border-color);background:var(--surface-soft);color:var(--text-muted);border-radius:8px;padding:.2rem .55rem;font-size:.76rem;cursor:pointer;line-height:1;transition:background .15s,color .15s,border-color .15s;font-family:IBM Plex Sans,sans-serif}.copy-btn:hover{background:var(--hover-surface);color:var(--text-primary);border-color:var(--accent)}.copy-btn.copied{border-color:#4ade8066;color:var(--success)}.key-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.2rem}.key-compare{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}.key-compare-row{display:flex;gap:.3rem;flex-wrap:wrap;font-family:IBM Plex Mono,monospace;font-size:.78rem}.key-byte{padding:.15rem .3rem;border-radius:4px;background:var(--surface-soft)}.key-byte.match{background:#4ade801f;color:var(--success)}.key-byte.mismatch{background:#f8717126;color:var(--danger)}.prose-card p{margin:.5rem 0;line-height:1.65;color:var(--text-muted)}.prose-card p:first-of-type{margin-top:.75rem}h1{background:linear-gradient(130deg,var(--text-primary) 40%,var(--accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.preset-button[data-preset=ps3]{border-color:#f8717166}.preset-button[data-preset=defender]{border-color:#4ade8066}.dashboard-grid>*:nth-child(1){animation-delay:0ms}.dashboard-grid>*:nth-child(2){animation-delay:50ms}.dashboard-grid>*:nth-child(3){animation-delay:.1s}.dashboard-grid>*:nth-child(4){animation-delay:.15s}.dashboard-grid>*:nth-child(5){animation-delay:.2s}.dashboard-grid>*:nth-child(6){animation-delay:.25s}@media(max-width:960px){.dashboard-grid,.timeline,.card-grid,.meta-grid,.recovery-grid,.config-grid{grid-template-columns:1fr}.app-shell{width:min(100vw - 1rem,100%)}.hero{padding:1.4rem}}@media(max-width:640px){.panel{padding:1rem}.matrix-row{grid-auto-columns:minmax(5.5rem,1fr)}th,td{padding:.65rem;font-size:.9rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
