.header{position:sticky;top:0;z-index:100;background:#0a0e17cc;backdrop-filter:blur(20px);border-bottom:1px solid var(--border-subtle)}.header-content{max-width:1400px;margin:0 auto;padding:var(--spacing-sm) var(--spacing-md);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-xl)}@media(min-width:768px){.header-content{padding:var(--spacing-md) var(--spacing-lg)}}@media(min-width:1024px){.header-content{padding:var(--spacing-md) var(--spacing-xl)}}.logo{display:flex;align-items:center;gap:var(--spacing-md)}.logo-icon{width:32px;height:32px;animation:pulse 3s ease-in-out infinite}@media(min-width:768px){.logo-icon{width:40px;height:40px}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}.logo-text{display:flex;flex-direction:column;line-height:1.2}.logo-title{font-size:1.1rem;font-weight:700;background:linear-gradient(135deg,var(--accent-purple),var(--accent-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.logo-subtitle{font-size:.65rem;color:var(--text-muted);font-weight:500;letter-spacing:.05em;text-transform:uppercase}@media(min-width:768px){.logo-title{font-size:1.25rem}.logo-subtitle{font-size:.75rem}}.nav{display:flex;gap:var(--spacing-xs);background:var(--bg-secondary);padding:var(--spacing-xs);border-radius:var(--radius-lg);border:1px solid var(--border-subtle)}.nav-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:.75rem var(--spacing-lg);min-height:44px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-secondary);font-family:var(--font-display);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-base);white-space:nowrap}@media(min-width:768px){.nav-btn{padding:var(--spacing-sm) var(--spacing-lg)}}.nav-btn:hover{color:var(--text-primary);background:#ffffff0d}.nav-btn.active{background:linear-gradient(135deg,var(--accent-purple),var(--accent-pink));color:#fff;box-shadow:0 4px 15px var(--accent-purple-glow)}.nav-icon{font-size:1rem}.docs-link{font-size:.875rem}@media(max-width:900px){.header-content{flex-wrap:wrap;gap:var(--spacing-md)}.nav{order:3;width:100%;justify-content:center}.nav-btn{flex:1;justify-content:center;padding:.75rem var(--spacing-sm);min-height:44px;font-size:.8rem}}@media(max-width:600px){.nav-btn{padding:.75rem var(--spacing-sm);font-size:.75rem;gap:var(--spacing-xs)}.nav-icon{font-size:1.1rem}}@media(max-width:375px){.nav-btn{padding:.75rem .5rem;gap:.25rem}.logo-title{font-size:1rem}.logo-subtitle{font-size:.6rem}}.signing-journey{display:flex;flex-direction:column;gap:var(--spacing-xl);padding:var(--spacing-lg);margin:calc(var(--spacing-md) * -1)}@media(min-width:768px){.signing-journey{padding:0;margin:0}}.journey-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-xl);flex-wrap:wrap}.journey-title-section{flex:1}.journey-title{font-size:2.857rem;font-weight:800;margin-bottom:var(--spacing-sm);letter-spacing:-.02em}@media(min-width:768px){.journey-title{font-size:2.5rem}}.journey-subtitle{color:var(--text-secondary);font-size:1.25rem;max-width:500px}@media(min-width:768px){.journey-subtitle{font-size:1.1rem}}.journey-controls{display:flex;gap:var(--spacing-sm)}.flow-container{overflow-x:auto;overflow-y:hidden;padding:var(--spacing-md) 0;display:flex;justify-content:flex-start;scroll-behavior:smooth;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;position:relative}.flow-container::-webkit-scrollbar{display:none}.flow-container{-ms-overflow-style:none;scrollbar-width:none}@media(min-width:768px){.flow-container{justify-content:center;overflow-x:auto;scroll-snap-type:none}}.flow-diagram{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:var(--spacing-sm);padding:0 var(--spacing-md);min-width:max-content}@media(min-width:768px){.flow-diagram{justify-content:center;gap:0;padding:0}}.flow-node{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);cursor:pointer;position:relative;padding:var(--spacing-sm) var(--spacing-sm);transition:all var(--transition-base);scroll-snap-align:center;flex-shrink:0}@media(min-width:768px){.flow-node{padding:var(--spacing-sm) var(--spacing-md);scroll-snap-align:none}}.flow-node:hover .flow-node-icon{transform:scale(1.1)}.flow-node-icon{width:70px;height:70px;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--bg-secondary);border:2px solid var(--border-subtle);border-radius:50%;transition:all var(--transition-base);position:relative;z-index:2}@media(min-width:768px){.flow-node-icon{width:60px;height:60px;font-size:1.75rem}}@media(min-width:1024px){.flow-node-icon{width:50px;height:50px;font-size:1.5rem}}.flow-node.active .flow-node-icon{background:linear-gradient(135deg,var(--accent-purple),var(--accent-cyan));border-color:transparent;box-shadow:0 0 30px var(--accent-purple-glow);animation:glow-pulse 2s ease-in-out infinite}.flow-node.completed .flow-node-icon{background:var(--accent-green);border-color:var(--accent-green)}@keyframes glow-pulse{0%,to{box-shadow:0 0 20px var(--accent-purple-glow)}50%{box-shadow:0 0 40px var(--accent-purple-glow)}}.flow-node-connector{display:block;position:absolute;top:50%;right:-50%;width:100%;height:2px;background:var(--border-subtle);transform:translateY(-50%);z-index:1}@media(min-width:768px){.flow-node-connector{display:block}}.flow-node:last-child .flow-node-connector{display:none}.flow-node.completed .flow-node-connector{background:linear-gradient(90deg,var(--accent-green),var(--accent-green))}.flow-node.active .flow-node-connector{background:linear-gradient(90deg,var(--accent-purple),var(--border-subtle))}.flow-node-label{font-size:.85rem;color:var(--text-muted);font-weight:500;white-space:nowrap;text-align:center}@media(min-width:768px){.flow-node-label{font-size:.8rem}}@media(min-width:1024px){.flow-node-label{font-size:.75rem}}.flow-node.active .flow-node-label{color:var(--text-primary)}.flow-node.completed .flow-node-label{color:var(--accent-green)}.journey-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);min-height:400px}@media(max-width:900px){.journey-content{grid-template-columns:1fr}}.journey-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:350px}.visual-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.component-visual{padding:var(--spacing-xl);background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);min-height:300px;width:100%;display:flex;align-items:center;justify-content:center}.component-visual.developer{border-color:var(--accent-green)}.component-visual.oidc{border-color:var(--accent-orange)}.component-visual.fulcio{border-color:var(--accent-purple)}.component-visual.artifact,.component-visual.rekor{border-color:var(--accent-cyan)}.component-visual.verifier{border-color:var(--accent-green)}.visual-developer{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);width:100%}.terminal{width:100%;max-width:100%;background:#1a1a2e;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 20px 40px #0000004d}@media(min-width:600px){.terminal{max-width:400px}}.terminal-header{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:#16162a;border-bottom:1px solid rgba(255,255,255,.1)}.terminal-dot{width:12px;height:12px;border-radius:50%}.terminal-dot.red{background:#ff5f56}.terminal-dot.yellow{background:#ffbd2e}.terminal-dot.green{background:#27c93f}.terminal-title{flex:1;text-align:center;font-size:.75rem;color:var(--text-muted)}.terminal-body{padding:var(--spacing-md)}.terminal-line{font-size:.85rem;margin-bottom:var(--spacing-xs);display:flex;gap:var(--spacing-sm)}.prompt{color:var(--accent-green)}.terminal-line.output{color:var(--text-secondary);padding-left:var(--spacing-md)}.terminal-line.success{color:var(--accent-green)}.key-animation{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);animation:bounce 1s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.key-icon{font-size:2rem}.key-label{font-size:.85rem;color:var(--text-secondary)}.visual-oidc{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl)}.oidc-providers{display:flex;gap:var(--spacing-lg)}.oidc-provider{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-lg);background:var(--bg-tertiary);border-radius:var(--radius-lg);transition:all var(--transition-base)}.oidc-provider:hover{transform:translateY(-5px)}.oidc-provider svg{width:40px;height:40px}.oidc-provider.github svg{color:#fff}.oidc-flow{display:flex;align-items:center;gap:var(--spacing-md)}.oidc-arrow{font-size:2rem;color:var(--accent-orange);animation:arrow-pulse 1s ease-in-out infinite}@keyframes arrow-pulse{0%,to{opacity:1;transform:translate(0)}50%{opacity:.5;transform:translate(10px)}}.oidc-token{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-md) var(--spacing-lg);background:linear-gradient(135deg,var(--accent-orange),var(--accent-pink));border-radius:var(--radius-md);color:#fff}.token-icon{font-size:1.5rem}.token-label{font-size:.85rem;font-weight:600}.visual-fulcio{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl)}.fulcio-server{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.server-icon{font-size:3rem}.server-name{font-size:1.2rem;font-weight:600;color:var(--accent-purple)}.certificate-animation{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--bg-tertiary);border:2px dashed var(--accent-purple);border-radius:var(--radius-lg);animation:certificate-appear .5s ease-out}@keyframes certificate-appear{0%{opacity:0;transform:scale(.8) rotate(-5deg)}to{opacity:1;transform:scale(1) rotate(0)}}.cert-icon{font-size:2.5rem}.cert-details{font-size:.75rem;color:var(--text-secondary);text-align:center;line-height:1.8}.visual-artifact{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg)}.artifact-box{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-lg);background:var(--bg-tertiary);border-radius:var(--radius-lg)}.artifact-icon{font-size:3rem}.artifact-label{font-size:.9rem;color:var(--text-secondary)}.signing-process{display:flex;align-items:center;gap:var(--spacing-md)}.sign-arrow{font-size:2rem;color:var(--accent-cyan);animation:rotate 2s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.signature-block{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-md);background:linear-gradient(135deg,var(--accent-cyan),var(--accent-green));border-radius:var(--radius-md);color:#fff}.sig-icon{font-size:1.5rem}.sig-label{font-size:.8rem;font-weight:600}.hash-display{font-size:.8rem;color:var(--text-muted);background:var(--bg-secondary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm)}.visual-rekor{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);width:100%;max-width:350px}.log-entries{width:100%;display:flex;flex-direction:column;gap:var(--spacing-sm)}.log-entry{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-tertiary);border-radius:var(--radius-sm);font-size:.85rem;border-left:3px solid var(--border-subtle)}.log-entry.highlight{border-left-color:var(--accent-cyan);background:#06b6d41a;animation:highlight-pulse 1s ease-in-out infinite}@keyframes highlight-pulse{0%,to{background:#06b6d41a}50%{background:#06b6d433}}.entry-hash{color:var(--text-secondary)}.entry-time{font-size:.75rem;color:var(--text-muted)}.rekor-label{display:flex;align-items:center;gap:var(--spacing-sm);color:var(--accent-cyan);font-weight:600}.visual-verifier{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl)}.verify-checklist{display:flex;flex-direction:column;gap:var(--spacing-sm)}.check-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-tertiary);border-radius:var(--radius-sm);font-size:.9rem;opacity:0;animation:check-appear .3s ease-out forwards}.check-item:nth-child(1){animation-delay:.1s}.check-item:nth-child(2){animation-delay:.2s}.check-item:nth-child(3){animation-delay:.3s}.check-item:nth-child(4){animation-delay:.4s}@keyframes check-appear{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.check-item.done{border-left:3px solid var(--accent-green)}.check-icon{font-size:1rem}.verified-badge{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);background:linear-gradient(135deg,var(--accent-green),var(--accent-cyan));border-radius:var(--radius-full);color:#fff;font-weight:700;font-size:1.2rem;animation:badge-pop .5s ease-out .5s backwards}@keyframes badge-pop{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.badge-icon{font-size:1.5rem}.particles{position:absolute;top:50%;left:50%;pointer-events:none}.particle{position:absolute;width:8px;height:8px;background:var(--accent-purple);border-radius:50%;animation:particle-fly 1s ease-out forwards;animation-delay:var(--delay)}@keyframes particle-fly{0%{opacity:1;transform:translate(-50%,-50%) rotate(var(--angle)) translate(0)}to{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translate(100px)}}.journey-details{display:flex;flex-direction:column}.step-card{padding:var(--spacing-xl);height:100%;display:flex;flex-direction:column}.step-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.step-number{font-size:.85rem;color:var(--text-muted)}.step-badge{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-full);font-size:.7rem;font-weight:600;letter-spacing:.05em}.step-badge.developer{background:#10b98133;color:var(--accent-green)}.step-badge.oidc{background:#f9731633;color:var(--accent-orange)}.step-badge.fulcio{background:#a855f733;color:var(--accent-purple)}.step-badge.artifact,.step-badge.rekor{background:#06b6d433;color:var(--accent-cyan)}.step-badge.verifier{background:#10b98133;color:var(--accent-green)}.step-title{font-size:1.25rem;font-weight:700;margin-bottom:var(--spacing-sm)}.step-description{color:var(--text-secondary);font-size:.9rem;margin-bottom:var(--spacing-lg)}@media(min-width:768px){.step-title{font-size:1.5rem}.step-description{font-size:1rem}}.step-details{flex:1}.step-details h4{font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-md)}.step-details ul{list-style:none;display:flex;flex-direction:column;gap:var(--spacing-sm)}.step-details li{padding-left:var(--spacing-lg);position:relative;color:var(--text-secondary);font-size:.9rem}.step-details li:before{content:"→";position:absolute;left:0;color:var(--accent-purple)}.step-actions{margin-top:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-md)}.action-btn{width:100%;padding:var(--spacing-md);font-size:1rem}.action-btn:disabled{opacity:.5;cursor:not-allowed}.step-nav{display:flex;justify-content:space-between}.step-nav button:disabled{opacity:.3;cursor:not-allowed}.artifact-preview{display:flex;align-items:center;gap:var(--spacing-xl);padding:var(--spacing-lg) var(--spacing-xl);flex-wrap:wrap}.artifact-header{display:flex;align-items:center;gap:var(--spacing-sm)}.artifact-icon{font-size:1.5rem}.artifact-name{font-weight:600;color:var(--text-primary)}.artifact-hash{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-xs);font-size:.75rem;color:var(--text-muted);min-width:0}@media(min-width:768px){.artifact-hash{flex-direction:row;align-items:center;gap:var(--spacing-sm);font-size:.8rem}}.hash-label{color:var(--text-secondary)}.hash-value{color:var(--accent-cyan);word-break:break-all;font-size:.7rem}@media(min-width:768px){.hash-value{font-size:.8rem}}.artifact-status{font-size:.9rem;font-weight:500}.status-pending{color:var(--text-muted)}.status-signed{color:var(--accent-green);animation:status-glow 2s ease-in-out infinite}@keyframes status-glow{0%,to{text-shadow:0 0 10px var(--accent-green-glow)}50%{text-shadow:0 0 20px var(--accent-green-glow)}}.component-explorer{display:flex;flex-direction:column;gap:var(--spacing-xl)}.explorer-header{text-align:center;margin-bottom:var(--spacing-lg)}.explorer-title{font-size:1.75rem;font-weight:800;margin-bottom:var(--spacing-sm)}.explorer-subtitle{color:var(--text-secondary);font-size:.95rem;max-width:100%;margin:0 auto}@media(min-width:768px){.explorer-title{font-size:2rem}.explorer-subtitle{font-size:1rem;max-width:600px}}@media(min-width:1024px){.explorer-title{font-size:2.5rem}.explorer-subtitle{font-size:1.1rem}}.component-selector{display:flex;justify-content:center;gap:var(--spacing-md);flex-wrap:wrap}.component-btn{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);min-height:44px;background:var(--bg-card);border:2px solid var(--border-subtle);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);flex:1 1 calc(50% - var(--spacing-md));max-width:calc(50% - var(--spacing-md));min-width:0}@media(min-width:600px){.component-btn{flex:1 1 auto;max-width:160px;padding:var(--spacing-lg) var(--spacing-xl)}}@media(min-width:768px){.component-btn{min-width:140px}}.component-btn:hover{transform:translateY(-4px);border-color:var(--component-color);box-shadow:0 10px 30px #0000004d}.component-btn.active{border-color:var(--component-color);background:#a855f71a;box-shadow:0 0 30px color-mix(in srgb,var(--component-color) 30%,transparent)}.component-btn-icon{font-size:2.5rem}.component-btn-name{font-family:var(--font-display);font-weight:600;color:var(--text-primary);font-size:1rem}.component-details{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);padding:var(--spacing-2xl)}.details-header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.details-icon{font-size:3rem;width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--component-color),color-mix(in srgb,var(--component-color) 50%,var(--accent-pink)));border-radius:var(--radius-xl)}.details-title-section{flex:1}.details-name{font-size:1.5rem;font-weight:700;margin-bottom:var(--spacing-xs);color:var(--component-color)}.details-tagline{font-size:.95rem;color:var(--text-secondary);font-style:italic}@media(min-width:768px){.details-header{flex-direction:row;align-items:center;text-align:left;gap:var(--spacing-lg)}.details-icon{font-size:4rem;width:100px;height:100px}.details-name{font-size:2rem}.details-tagline{font-size:1.1rem}}.details-description{font-size:1.1rem;line-height:1.7;color:var(--text-secondary);margin-bottom:var(--spacing-xl);max-width:800px}.details-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}@media(min-width:600px){.details-grid{gap:var(--spacing-lg)}}@media(min-width:768px){.details-grid{grid-template-columns:repeat(2,1fr)}}.details-card{padding:var(--spacing-lg)}.card-title{font-size:1rem;font-weight:600;margin-bottom:var(--spacing-md);color:var(--text-primary)}.card-list{list-style:none;display:flex;flex-direction:column;gap:var(--spacing-sm)}.card-list li{padding-left:var(--spacing-lg);position:relative;color:var(--text-secondary);font-size:.9rem;line-height:1.5}.card-list:not(.numbered) li:before{content:"→";position:absolute;left:0;color:var(--component-color)}.card-list.numbered li{display:flex;align-items:flex-start;gap:var(--spacing-sm);padding-left:0}.step-num{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--component-color);color:#fff;border-radius:50%;font-size:.75rem;font-weight:600;flex-shrink:0}.analogy-card,.fun-fact-card{background:linear-gradient(135deg,#a855f71a,#06b6d41a)}.analogy-text,.fun-fact-text{font-size:1rem;line-height:1.7;color:var(--text-secondary)}.details-links{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap}.links-label{color:var(--text-muted);font-size:.9rem}.ecosystem-diagram{padding:var(--spacing-2xl)}.diagram-title{text-align:center;font-size:1.25rem;margin-bottom:var(--spacing-xl);color:var(--text-primary)}.diagram-visual{display:flex;align-items:center;justify-content:center;gap:var(--spacing-lg);flex-wrap:wrap;padding:var(--spacing-xl) 0}.diagram-node{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);background:var(--bg-tertiary);border:2px solid var(--border-subtle);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);min-width:100px}.diagram-node:hover{transform:scale(1.05)}.diagram-node.highlighted{border-color:var(--accent-purple);box-shadow:0 0 20px var(--accent-purple-glow);background:#a855f71a}.developer-node,.cosign-node{border-color:var(--accent-green)}.oidc-node{border-color:var(--accent-orange)}.fulcio-node{border-color:var(--accent-purple)}.rekor-node,.artifact-node{border-color:var(--accent-cyan)}.node-icon{font-size:1.5rem}.node-label{font-size:.75rem;font-weight:500;color:var(--text-secondary)}.diagram-arrow{font-size:1.5rem;color:var(--text-muted);animation:arrow-flow 1.5s ease-in-out infinite}.diagram-arrow.vertical{transform:rotate(90deg)}@keyframes arrow-flow{0%,to{opacity:.5}50%{opacity:1;color:var(--accent-purple)}}.diagram-branches{display:flex;flex-direction:column;gap:var(--spacing-md);align-items:center}.branch-top,.branch-middle,.branch-bottom{display:flex;align-items:center;gap:var(--spacing-md)}.quiz{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:var(--spacing-xl)}.quiz-header{text-align:center}.quiz-title{font-size:1.75rem;font-weight:800;margin-bottom:var(--spacing-sm)}.quiz-subtitle{color:var(--text-secondary);font-size:.95rem}@media(min-width:768px){.quiz-title{font-size:2rem}.quiz-subtitle{font-size:1rem}}@media(min-width:1024px){.quiz-title{font-size:2.5rem}.quiz-subtitle{font-size:1.1rem}}.quiz-progress{display:flex;flex-direction:column;gap:var(--spacing-sm)}.progress-bar{height:8px;background:var(--bg-tertiary);border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-purple),var(--accent-cyan));border-radius:var(--radius-full);transition:width var(--transition-base)}.progress-text{font-size:.85rem;color:var(--text-muted);text-align:center}.question-card{padding:var(--spacing-2xl)}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg)}.difficulty-badge{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-full);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#fff}.score-display{font-size:.9rem;color:var(--text-secondary);font-weight:500}.question-text{font-size:1.1rem;font-weight:600;line-height:1.5;margin-bottom:var(--spacing-lg);color:var(--text-primary)}@media(min-width:768px){.question-text{font-size:1.25rem;line-height:1.4;margin-bottom:var(--spacing-xl)}}@media(min-width:1024px){.question-text{font-size:1.4rem}}.options-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.option-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:.75rem var(--spacing-md);min-height:44px;background:var(--bg-tertiary);border:2px solid var(--border-subtle);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);text-align:left;font-family:var(--font-display)}@media(min-width:768px){.option-btn{padding:var(--spacing-md) var(--spacing-lg);gap:var(--spacing-md)}}.option-btn:hover:not(:disabled){border-color:var(--accent-purple);background:#a855f71a;transform:translate(5px)}.option-btn.selected{border-color:var(--accent-purple);background:#a855f733}.option-btn.correct{border-color:var(--accent-green);background:#10b98133}.option-btn.incorrect{border-color:var(--accent-pink);background:#ec489933}.option-btn:disabled{cursor:default}.option-letter{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--bg-secondary);border-radius:50%;font-weight:600;color:var(--text-secondary);flex-shrink:0;transition:all var(--transition-base)}.option-btn:hover:not(:disabled) .option-letter,.option-btn.selected .option-letter{background:var(--accent-purple);color:#fff}.option-btn.correct .option-letter{background:var(--accent-green);color:#fff}.option-btn.incorrect .option-letter{background:var(--accent-pink);color:#fff}.option-text{flex:1;font-size:1rem;color:var(--text-primary)}.option-icon{font-size:1.2rem;font-weight:700}.option-btn.correct .option-icon{color:var(--accent-green)}.option-btn.incorrect .option-icon{color:var(--accent-pink)}.explanation{margin-top:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-lg)}.explanation-card{padding:var(--spacing-lg);border-radius:var(--radius-lg);border-left:4px solid}.explanation-card.correct{background:#10b9811a;border-left-color:var(--accent-green)}.explanation-card.incorrect{background:#ec48991a;border-left-color:var(--accent-pink)}.explanation-header{margin-bottom:var(--spacing-sm)}.explanation-result{font-weight:700;font-size:1rem}.explanation-result.correct{color:var(--accent-green)}.explanation-result.incorrect{color:var(--accent-pink)}.explanation-text{color:var(--text-secondary);line-height:1.6}.next-btn{align-self:center;min-width:200px}.question-nav{display:flex;justify-content:center;gap:var(--spacing-sm);flex-wrap:wrap}.nav-dot{width:12px;height:12px;border-radius:50%;background:var(--bg-tertiary);border:2px solid var(--border-subtle);cursor:pointer;transition:all var(--transition-base)}.nav-dot:hover{border-color:var(--accent-purple)}.nav-dot.active{background:var(--accent-purple);border-color:var(--accent-purple);transform:scale(1.2)}.nav-dot.answered{background:var(--accent-cyan);border-color:var(--accent-cyan)}.quiz-results{text-align:center;padding:var(--spacing-3xl)}.results-emoji{font-size:3.5rem;margin-bottom:var(--spacing-md);animation:bounce 1s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.results-score{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--accent-purple),var(--accent-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--spacing-md)}.results-message{font-size:1rem;color:var(--text-secondary);margin-bottom:var(--spacing-lg)}@media(min-width:768px){.results-emoji{font-size:5rem;margin-bottom:var(--spacing-lg)}.results-score{font-size:3rem}.results-message{font-size:1.2rem;margin-bottom:var(--spacing-xl)}}.results-breakdown{display:flex;align-items:center;gap:var(--spacing-md);max-width:400px;margin:0 auto var(--spacing-xl)}.breakdown-bar{flex:1;height:12px;background:var(--bg-tertiary);border-radius:var(--radius-full);overflow:hidden}.breakdown-fill{height:100%;background:linear-gradient(90deg,var(--accent-purple),var(--accent-green));border-radius:var(--radius-full);transition:width 1s ease-out}.breakdown-percent{font-size:1.25rem;font-weight:700;color:var(--text-primary);min-width:60px}.results-actions{display:flex;justify-content:center;gap:var(--spacing-md)}.footer{margin-top:auto;padding:var(--spacing-lg) var(--spacing-md) var(--spacing-md);background:#0a0e17cc;backdrop-filter:blur(20px);border-top:1px solid var(--border-subtle);position:relative;z-index:10}@media(min-width:768px){.footer{padding:var(--spacing-xl) var(--spacing-xl) var(--spacing-lg)}}.footer-content{max-width:1400px;margin:0 auto}.footer-main{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-lg);margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-lg);border-bottom:1px solid var(--border-subtle)}.footer-brand{display:flex;align-items:center;gap:var(--spacing-sm)}.footer-logo{font-size:1.5rem}.footer-text{color:var(--text-secondary);font-size:.9rem}.footer-text strong{color:var(--accent-purple);font-weight:600}.footer-links{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap}.footer-links a{color:var(--text-secondary);text-decoration:none;font-size:.9rem;transition:color var(--transition-fast)}.footer-links a:hover{color:var(--accent-purple)}.footer-links .divider{color:var(--text-muted)}.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md)}.footer-note{color:var(--text-muted);font-size:.8rem}.footer-note a{color:var(--accent-cyan);text-decoration:none}.footer-note a:hover{text-decoration:underline}.footer-tech{font-size:.75rem;color:var(--text-muted)}.footer-disclaimer{width:100%;text-align:center;font-size:.7rem;color:var(--text-muted);opacity:.7;margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--border-subtle)}@media(max-width:600px){.footer-main,.footer-bottom{flex-direction:column;text-align:center}}:root{--bg-primary: #0a0e17;--bg-secondary: #111827;--bg-tertiary: #1a2332;--bg-card: rgba(17, 24, 39, .7);--bg-card-hover: rgba(26, 35, 50, .9);--accent-purple: #a855f7;--accent-purple-glow: rgba(168, 85, 247, .4);--accent-cyan: #06b6d4;--accent-cyan-glow: rgba(6, 182, 212, .4);--accent-green: #10b981;--accent-green-glow: rgba(16, 185, 129, .4);--accent-orange: #f97316;--accent-orange-glow: rgba(249, 115, 22, .4);--accent-pink: #ec4899;--accent-pink-glow: rgba(236, 72, 153, .4);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--fulcio-color: #a855f7;--rekor-color: #06b6d4;--cosign-color: #10b981;--oidc-color: #f97316;--border-subtle: rgba(148, 163, 184, .1);--border-accent: rgba(168, 85, 247, .3);--shadow-glow: 0 0 60px rgba(168, 85, 247, .15);--font-display: "Outfit", sans-serif;--font-mono: "JetBrains Mono", monospace;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--radius-sm: .375rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--breakpoint-sm: 375px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1400px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:14px;scroll-behavior:smooth}@media(min-width:375px){html{font-size:15px}}@media(min-width:768px){html{font-size:16px}}body{font-family:var(--font-display);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{position:relative;min-height:100vh;display:flex;flex-direction:column}.background-effects{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}.gradient-orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:.4;animation:float 20s ease-in-out infinite}.orb-1{width:600px;height:600px;background:radial-gradient(circle,var(--accent-purple) 0%,transparent 70%);top:-200px;right:-100px;animation-delay:0s}@media(min-width:768px){.orb-1{width:600px;height:600px}}@media(min-width:1024px){.orb-1{width:600px;height:600px}}.orb-2{width:500px;height:500px;background:radial-gradient(circle,var(--accent-cyan) 0%,transparent 70%);bottom:-150px;left:-100px;animation-delay:-7s}@media(min-width:768px){.orb-2{width:500px;height:500px}}@media(min-width:1024px){.orb-2{width:500px;height:500px}}.orb-3{width:400px;height:400px;background:radial-gradient(circle,var(--accent-green) 0%,transparent 70%);top:40%;left:50%;transform:translate(-50%);animation-delay:-14s}@media(min-width:768px){.orb-3{width:400px;height:400px}}@media(min-width:1024px){.orb-3{width:400px;height:400px}}@keyframes float{0%,to{transform:translate(0) scale(1)}25%{transform:translate(30px,-30px) scale(1.05)}50%{transform:translate(-20px,20px) scale(.95)}75%{transform:translate(-30px,-20px) scale(1.02)}}@media(max-width:768px){.gradient-orb{animation-duration:40s}}@media(prefers-reduced-motion:reduce){.gradient-orb{animation:none}}.grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,184,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.03) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse at center,black 0%,transparent 80%)}.main-content{position:relative;z-index:1;flex:1;padding:var(--spacing-md);max-width:1400px;margin:0 auto;width:100%}@media(min-width:768px){.main-content{padding:var(--spacing-lg)}}@media(min-width:1024px){.main-content{padding:var(--spacing-xl)}}.mono{font-family:var(--font-mono)}.text-gradient{background:linear-gradient(135deg,var(--accent-purple),var(--accent-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.glass-card{background:var(--bg-card);backdrop-filter:blur(20px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:all var(--transition-base)}.glass-card:hover{background:var(--bg-card-hover);border-color:var(--border-accent);box-shadow:var(--shadow-glow)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:.75rem 1.5rem;min-height:44px;font-family:var(--font-display);font-weight:500;font-size:1rem;border-radius:var(--radius-md);border:none;cursor:pointer;transition:all var(--transition-base);text-decoration:none}@media(min-width:768px){.btn{padding:var(--spacing-sm) var(--spacing-lg);font-size:.9rem}}.btn-primary{background:linear-gradient(135deg,var(--accent-purple),var(--accent-pink));color:#fff;box-shadow:0 4px 20px var(--accent-purple-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 30px var(--accent-purple-glow)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-subtle)}.btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--border-accent)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{color:var(--text-primary);background:#ffffff0d}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}::selection{background:var(--accent-purple);color:#fff}:focus-visible{outline:2px solid var(--accent-purple);outline-offset:2px}