.tool-header{margin-bottom:var(--space-6)}.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)}.url-input-section{margin-bottom:var(--space-6)}.url-input-row{gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.url-input{font-size:var(--font-size-base);flex:1}.presets-row{gap:var(--space-2);flex-wrap:wrap;display:flex}.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)}.loading-state{align-items:center;gap:var(--space-4);padding:var(--space-12);color:var(--color-muted);font-size:var(--font-size-sm);flex-direction:column;animation:.3s fadeIn;display:flex}.loading-spinner{border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.grade-card{align-items:center;gap:var(--space-5);margin-bottom:var(--space-5);display:flex}.grade-badge{border-radius:var(--radius-lg);width:56px;height:56px;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:#fff;flex-shrink:0;justify-content:center;align-items:center;display:flex}.grade--a{background:linear-gradient(135deg,#059669,#10b981)}.grade--b{background:linear-gradient(135deg,#2563eb,#3b82f6)}.grade--c{background:linear-gradient(135deg,#d97706,#f59e0b)}.grade--f{background:linear-gradient(135deg,#dc2626,#ef4444)}.grade-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semi);margin-bottom:var(--space-1)}.grade-subtitle{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.preview-tabs{border-bottom:2px solid var(--color-border);margin-bottom:var(--space-5);gap:0;display:flex;overflow-x:auto}.preview-tab{padding:var(--space-3) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-muted);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px}.preview-tab:hover{color:var(--color-text)}.preview-tab--active{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:var(--font-weight-semi)}.preview-panel{animation:.2s fadeIn}.preview-image--empty{justify-content:center;align-items:center;display:flex;background:var(--color-surface-2)!important}.preview-image__placeholder{color:var(--color-muted);font-size:var(--font-size-sm)}.fb-card{background:#fff;border:1px solid #dadde1;border-radius:4px;max-width:524px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;overflow:hidden}.fb-card__image{background-color:#f0f2f5;background-position:50%;background-size:cover;width:100%;height:274px}.fb-card__body{border-top:1px solid #dadde1;padding:10px 12px}.fb-card__domain{color:#606770;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;font-size:12px}.fb-card__title{color:#1d2129;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:4px;font-size:16px;font-weight:600;line-height:1.3;display:-webkit-box;overflow:hidden}.fb-card__desc{color:#606770;-webkit-line-clamp:1;-webkit-box-orient:vertical;font-size:14px;line-height:1.4;display:-webkit-box;overflow:hidden}.tw-card{background:#fff;border:1px solid #e1e8ed;border-radius:14px;max-width:504px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.tw-card--large .tw-card__image{background-color:#f0f2f5;background-position:50%;background-size:cover;width:100%;height:252px}.tw-card--summary{display:flex}.tw-card--summary .tw-card__image{background-color:#f0f2f5;background-position:50%;background-size:cover;flex-shrink:0;width:128px;min-height:128px}.tw-card__body{padding:12px}.tw-card__domain{color:#8899a6;margin-bottom:2px;font-size:13px}.tw-card__title{color:#14171a;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:4px;font-size:15px;font-weight:700;line-height:1.3;display:-webkit-box;overflow:hidden}.tw-card__desc{color:#657786;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;line-height:1.4;display:-webkit-box;overflow:hidden}.li-card{background:#fff;border:1px solid #e0e0e0;border-radius:2px;max-width:552px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.li-card__image{background-color:#f3f2ef;background-position:50%;background-size:cover;width:100%;height:288px}.li-card__body{padding:12px 16px}.li-card__title{color:#000000e6;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:4px;font-size:14px;font-weight:600;line-height:1.3;display:-webkit-box;overflow:hidden}.li-card__domain{color:#0009;font-size:12px}.dc-embed{background:#2f3136;border-radius:4px;max-width:520px;font-family:gg sans,Noto Sans,Helvetica Neue,Helvetica,Arial,sans-serif;display:flex;overflow:hidden}.dc-embed__bar{background:#7289da;flex-shrink:0;width:4px}.dc-embed__content{flex:1;min-width:0;padding:12px 16px}.dc-embed__site{color:#dcddde;margin-bottom:4px;font-size:12px}.dc-embed__title{color:#00aff4;margin-bottom:6px;font-size:16px;font-weight:600;line-height:1.25}.dc-embed__desc{color:#dcddde;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-bottom:12px;font-size:14px;line-height:1.4;display:-webkit-box;overflow:hidden}.dc-embed__image{background-color:#36393f;background-position:50%;background-size:cover;border-radius:4px;width:100%;max-width:400px;height:200px}.wa-bubble{background:#005c4b;border-radius:8px;max-width:380px;padding:4px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;overflow:hidden}.wa-bubble__preview{background:#025144;border-radius:6px;overflow:hidden}.wa-bubble__image{background-color:#0a3d34;background-position:50%;background-size:cover;width:100%;height:160px}.wa-bubble__body{padding:8px 10px}.wa-bubble__title{color:#e9edef;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:2px;font-size:13px;font-weight:600;line-height:1.3;display:-webkit-box;overflow:hidden}.wa-bubble__desc{color:#8696a0;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.4;display:-webkit-box;overflow:hidden}.wa-bubble__domain{color:#8696a0;text-transform:lowercase;margin-top:2px;font-size:11px}.wa-bubble__url{color:#53bdeb;word-break:break-all;padding:6px 10px;font-size:14px;text-decoration:underline}.audit-table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.audit-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)}.audit-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);vertical-align:top}.audit-table tr:last-child td{border-bottom:none}.audit-value{word-break:break-word;max-width:400px}.audit-table code{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}.audit--pass td:first-child{color:#059669}.audit--fail td:first-child{color:#dc2626}.audit--warn td:first-child{color:#d97706}.section-header-row{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.tags-table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.tags-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)}.tags-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);vertical-align:top}.tags-table tr:last-child td{border-bottom:none}.tags-table code{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}.tag-value{word-break:break-word;max-width:500px}.snippet-code{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);white-space:pre;tab-size:2;color:var(--color-text);overflow-x:auto}.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<=768px){.tool-header__title{font-size:var(--font-size-2xl)}.tool-header__description{font-size:var(--font-size-base)}.url-input-row{flex-direction:column}.grade-card{text-align:center;flex-direction:column}.fb-card,.tw-card,.li-card,.dc-embed,.wa-bubble{max-width:100%}.fb-card__image,.tw-card--large .tw-card__image,.li-card__image{height:180px}.tw-card--summary{flex-direction:column}.tw-card--summary .tw-card__image{width:100%;min-height:160px}.audit-value,.tag-value{max-width:200px;font-size:12px}.preview-tabs{gap:0}.preview-tab{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs)}}