.tool-header{margin-bottom:var(--space-4)}.tool-header__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.tool-header__description{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--space-3)}.privacy-badge{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);font-size:var(--font-size-sm);color:#059669;font-weight:var(--font-weight-medium);background:#10b9811a;border:1px solid #10b98140;display:inline-flex}.notice-banner{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);margin-bottom:var(--space-4);border-left:3px solid var(--color-primary);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--color-text-secondary);background:#3b82f614;display:flex}.jwt-input-section{margin-bottom:var(--space-5)}.input-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semi);margin-bottom:var(--space-2);color:var(--color-text);display:block}.jwt-textarea{font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);resize:vertical;min-height:100px}.input-actions{margin-top:var(--space-3);justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.presets-row{gap:var(--space-2);flex-wrap:wrap;display:flex}.btn-group{gap:var(--space-2);align-items:center;display:flex}.colored-input{font-family:var(--font-mono);font-size:var(--font-size-xs);line-height:var(--line-height-relaxed);padding:var(--space-3);margin-top:var(--space-3);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);word-break:break-all;overflow-wrap:break-word}.jwt-part--header{color:#e11d48;font-weight:var(--font-weight-semi)}.jwt-part--payload{color:#7c3aed;font-weight:var(--font-weight-semi)}.jwt-part--signature{color:#0891b2;font-weight:var(--font-weight-semi)}.jwt-dot{color:var(--color-muted);font-weight:var(--font-weight-bold)}.jwt-invalid{color:var(--color-error)}.error-banner{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);background:var(--color-error-light);border-left:3px solid var(--color-error);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--color-error);animation:.3s fadeIn;display:flex}.error-banner__icon{font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);flex-shrink:0}.error-banner__message{margin-top:var(--space-1);line-height:var(--line-height-relaxed)}.exp-badge{font-size:var(--font-size-base);font-weight:var(--font-weight-semi);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);margin-bottom:var(--space-5);animation:.3s fadeIn}.exp-badge--valid{color:#059669;background:#10b9811a;border:1px solid #10b9814d}.exp-badge--expired{color:#dc2626;background:#ef44441a;border:1px solid #ef44444d}.exp-badge--none{background:var(--color-surface-2);border:1px solid var(--color-border);color:var(--color-muted)}.exp-badge__date{font-weight:var(--font-weight-normal);font-size:var(--font-size-sm);opacity:.8}.decode-grid{gap:var(--space-4);margin-bottom:var(--space-5);grid-template-columns:1fr 1fr;display:grid}.decode-pane{border-radius:var(--radius-lg);border:1px solid var(--color-border);overflow:hidden}.decode-pane__header{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.decode-pane__title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semi);text-transform:uppercase;letter-spacing:.5px}.decode-pane__code{font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);padding:var(--space-3);white-space:pre;tab-size:2;min-height:60px;margin:0;overflow-x:auto}.decode-pane__code--sig{word-break:break-all;white-space:pre-wrap;font-size:var(--font-size-xs);color:var(--color-muted)}.decode-pane--header{background:#e11d480a}.decode-pane--header .decode-pane__header{background:#e11d4814}.decode-pane--header .decode-pane__title{color:#e11d48}.decode-pane--payload{background:#7c3aed0a}.decode-pane--payload .decode-pane__header{background:#7c3aed14}.decode-pane--payload .decode-pane__title{color:#7c3aed}.decode-pane--signature{background:#0891b20a;grid-column:1/-1}.decode-pane--signature .decode-pane__header{background:#0891b214}.decode-pane--signature .decode-pane__title{color:#0891b2}.json-key{color:#e11d48}.json-string{color:#059669}.json-number{color:#2563eb}.json-boolean{color:#d97706}.json-null{color:var(--color-muted)}.claims-table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.claims-table th{text-align:left;font-weight:var(--font-weight-semi);padding:var(--space-2) var(--space-3);background:var(--color-surface-2);border-bottom:2px solid var(--color-border);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.5px;color:var(--color-text)}.claims-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);vertical-align:top}.claims-table tr:last-child td{border-bottom:none}.claim-key{font-family:var(--font-mono);font-size:var(--font-size-xs);background:var(--color-surface-2);border-radius:var(--radius-sm);color:var(--color-primary);padding:.125rem .375rem}.claim-label{color:var(--color-muted);cursor:help;border-bottom:1px dotted var(--color-muted);margin-top:2px;font-size:11px;display:inline-block}.claim-value-cell{font-family:var(--font-mono);font-size:var(--font-size-xs);word-break:break-word;max-width:400px}.claim-timestamp{color:var(--color-muted);font-size:11px;font-family:var(--font-sans)}.claim-section-badge{border-radius:var(--radius-sm);font-size:10px;font-weight:var(--font-weight-semi);text-transform:uppercase;letter-spacing:.5px;padding:1px 6px;display:inline-block}.claim-section--header{color:#e11d48;background:#e11d481a}.claim-section--payload{color:#7c3aed;background:#7c3aed1a}.seo-content{margin-top:var(--space-12)}.seo-content__text{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-6)}.seo-content__list{padding-left:var(--space-6);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);list-style-type:disc}.seo-content__list li{margin-bottom:var(--space-3)}.seo-content__list code,.faq-item__answer code{font-family:var(--font-mono);font-size:var(--font-size-sm);background:var(--color-surface-2);border-radius:var(--radius-sm);color:var(--color-primary);padding:.125rem .375rem}.faq-item{margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--color-border)}.faq-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.faq-item__question{font-size:var(--font-size-lg);font-weight:var(--font-weight-semi);margin-bottom:var(--space-2)}.faq-item__answer{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-card{margin-bottom:var(--space-6);padding:var(--space-5);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:border-color var(--transition-base)}.example-card:hover{border-color:var(--color-primary)}.example-card:last-child{margin-bottom:0}.example-card__header{justify-content:space-between;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-3);display:flex}.example-card__title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semi);margin-bottom:var(--space-1)}.example-card__desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-card__desc code{font-family:var(--font-mono);font-size:var(--font-size-xs);background:var(--color-surface);border-radius:var(--radius-sm);color:var(--color-primary);padding:.125rem .375rem}.example-load-btn{white-space:nowrap;flex-shrink:0}.example-code{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-family:var(--font-mono);font-size:var(--font-size-xs);line-height:var(--line-height-relaxed);margin-bottom:var(--space-3);color:var(--color-text-secondary);overflow-x:auto}.example-code code{font-family:inherit;font-size:inherit;color:inherit}.example-note{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.example-note code{font-family:var(--font-mono);font-size:var(--font-size-xs);background:var(--color-surface);border-radius:var(--radius-sm);color:var(--color-primary);padding:.125rem .375rem}.cross-links{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.cross-link{padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);color:inherit;transition:all var(--transition-base);text-decoration:none;display:block}.cross-link:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.cross-link strong{color:var(--color-text);margin-bottom:var(--space-1);display:block}.cross-link span{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.results .card{margin-bottom:var(--space-5)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width<=640px){.tool-header__title{font-size:var(--font-size-2xl)}.tool-header__description{font-size:var(--font-size-base)}.input-actions{flex-direction:column;align-items:stretch}.btn-group{justify-content:stretch}.btn-group .btn--primary{flex:1}.decode-grid{grid-template-columns:1fr}.decode-pane--signature{grid-column:auto}.claim-value-cell{max-width:180px}.example-card__header{flex-direction:column}}