.edit-style-button{flex:none}.light-dark-badge{border-radius:var(--radius-full);background:var(--bg-track);font:500 var(--text-xs) / 1.2 var(--font-ui);color:var(--fg-secondary);cursor:default;flex:none;align-items:center;gap:5px;padding:3px 8px;display:inline-flex;position:relative}.more-for-site{flex-direction:column;gap:14px;display:flex}.more-for-site-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex;& h2{font:600 var(--text-lg) / 1.2 var(--font-display);letter-spacing:-.01em;color:var(--fg);margin:0}& a{font:500 var(--text-sm) / 1.2 var(--font-ui);color:var(--fg-muted);flex:none;&:hover{color:var(--fg)}}}.more-for-site-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:28px 20px;display:grid}.get-stylebot-card{border-radius:var(--radius-md);background:var(--bg-hover);flex-direction:column;gap:12px;margin-top:8px;padding:16px;display:flex;& p{font:400 var(--text-sm) / 1.5 var(--font-ui);color:var(--fg-secondary);margin:0}& .btn{font-size:var(--text-base);justify-content:center;padding:12px 18px}}.installed-notice{border-radius:var(--radius-md);background:var(--bg-hover);color:var(--fg);align-items:flex-start;gap:12px;margin-top:8px;padding:14px 16px;display:flex;& svg{flex:none;margin-top:2px}& div{font:400 var(--text-sm) / 1.4 var(--font-ui);flex-direction:column;gap:4px;display:flex}& span{color:var(--fg-muted)}}.preview-card{flex-direction:column;gap:10px;margin-top:8px;display:flex;& .btn{font-size:var(--text-base);white-space:normal;text-align:center;justify-content:center;padding:14px 18px;line-height:1.3}& p{font:400 var(--text-sm) / 1.4 var(--font-ui);color:var(--fg-muted);margin:0}}.preview-card-placeholder{border-radius:var(--radius-md);background:var(--bg-track);height:48px;margin-top:8px;animation:1.4s ease-in-out infinite preview-card-pulse}@keyframes preview-card-pulse{50%{opacity:.55}}.report-reasons{border:none;flex-direction:column;gap:8px;margin:0;padding:0;display:flex;& legend{font:500 var(--text-sm) / 1.3 var(--font-ui);color:var(--fg-secondary);margin-bottom:8px;padding:0}& label{color:var(--fg);cursor:pointer;flex-direction:row;align-items:center;gap:8px;font-weight:400}& input{width:auto;accent-color:var(--fg);margin:0}}.report-style-button{font:400 var(--text-xs) / 1.3 var(--font-ui);color:var(--fg-muted);background:0 0;border:none;align-self:flex-start;margin:4px 0 0;padding:0}button.report-style-button{cursor:pointer;text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:3px;&:hover{color:var(--fg);text-decoration-color:currentColor}}.style-css{flex-direction:column;gap:14px;display:flex}.style-css-head{justify-content:space-between;align-items:center;gap:12px;display:flex;& h2{font:600 var(--text-lg) / 1.2 var(--font-display);letter-spacing:-.01em;color:var(--fg);margin:0}}.style-page{flex-direction:column;gap:24px;display:flex;&>section{margin-top:24px}}.style-page-top{grid-template:"shot side""about side"1fr/minmax(0,2fr) minmax(300px,1fr);align-items:start;gap:24px 32px;display:grid;@media (width<=899px){grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-template-areas:"shot""side""about"}}.style-page-shot{aspect-ratio:16/10;object-fit:cover;object-position:top center;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-track);grid-area:shot;width:100%;display:block}.style-page-side{flex-direction:column;grid-area:side;gap:12px;min-width:0;display:flex;& h1{font:600 var(--text-xl) / 1.2 var(--font-display);letter-spacing:-.02em;color:var(--fg);text-wrap:balance;overflow-wrap:anywhere;margin:0}}.style-page-about{max-width:65ch;font:400 var(--text-base) / 1.55 var(--font-ui);color:var(--fg-secondary);text-wrap:pretty;white-space:pre-line;overflow-wrap:anywhere;grid-area:about;margin:0}.style-page-title{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.style-page-site{font:400 var(--text-sm) / 1.3 var(--font-ui);color:var(--fg-muted);align-self:flex-start;align-items:center;gap:7px;display:flex;&:hover{color:var(--fg)}}.style-page-facts{border-top:1px solid var(--border);font:400 var(--text-sm) / 1.3 var(--font-ui);grid-template-columns:auto 1fr;gap:8px 20px;margin:12px 0 0;padding-top:20px;display:grid;& dt{color:var(--fg-muted)}& dd{color:var(--fg);margin:0;& a{color:inherit;text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:3px;&:hover{text-decoration-color:currentColor}}}}.style-page.is-skeleton{& .style-page-shot,& .style-page-line{animation:1.4s ease-in-out infinite style-page-pulse}& .style-page-line{border-radius:var(--radius-sm);background:var(--bg-track);height:14px}}@keyframes style-page-pulse{50%{opacity:.55}}.style-page-site-row{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.style-screenshots{flex-direction:column;grid-area:shot;gap:12px;min-width:0;display:flex}.style-screenshots-thumbs{gap:12px;display:flex}.style-screenshots-thumb{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-track);cursor:pointer;opacity:.7;width:120px;padding:0;transition:opacity .15s,box-shadow .15s;overflow:hidden;&:hover{opacity:1}&[aria-pressed=true]{opacity:1;box-shadow:0 0 0 2px var(--bg-page), 0 0 0 4px var(--border-strong)}&:focus-visible{box-shadow:0 0 0 2px var(--bg-page), 0 0 0 4px var(--fg);outline:none}& img{aspect-ratio:16/10;object-fit:cover;object-position:top center;width:100%;display:block}}.version-item{align-items:flex-start;gap:16px;padding:14px 16px;display:flex;&+&{border-top:1px solid var(--border)}}.version-item-text{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex;& p{font:400 var(--text-sm) / 1.5 var(--font-ui);color:var(--fg-secondary);overflow-wrap:anywhere;margin:0}}.version-item-head{font:400 var(--text-sm) / 1.3 var(--font-ui);color:var(--fg-muted);flex-wrap:wrap;align-items:center;gap:8px;display:flex;& strong{color:var(--fg);font-weight:600}}.version-item-current{border-radius:var(--radius-full);background:var(--bg-hover);font:500 var(--text-xs) / 1.3 var(--font-ui);color:var(--fg-secondary);padding:2px 8px}.style-versions{flex-direction:column;gap:14px;display:flex;& h2{font:600 var(--text-lg) / 1.2 var(--font-display);letter-spacing:-.01em;color:var(--fg);margin:0}& ol{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-surface);margin:0;padding:0;list-style:none}}