:root{--bg: #f6f7f9;--panel: #ffffff;--panel-muted: #eef2f6;--ink: #17202a;--muted: #637083;--line: #dce2ea;--accent: #0a66c2;--accent-strong: #084f96;--shadow: 0 14px 38px rgba(28, 42, 58, .08)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}button{cursor:pointer}.app-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px clamp(18px,4vw,48px);background:#ffffffe6;border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;min-width:0;gap:14px}.brand-mark{display:grid;flex:0 0 44px;width:44px;height:44px;place-items:center;color:#fff;background:#17202a;border-radius:8px;font-weight:800;letter-spacing:0}.brand h1,.brand p,.toolbar h2,.toolbar p,.builder h2,.builder p{margin:0}.brand h1{font-size:clamp(1.2rem,2vw,1.6rem)}.brand p{color:var(--muted);font-size:.95rem}.top-actions{display:flex;gap:10px}.top-actions a{color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:9px 12px;text-decoration:none;background:#fff}.app-shell{display:grid;grid-template-columns:minmax(240px,300px) 1fr;gap:24px;padding:24px clamp(18px,4vw,48px) 48px}.sidebar{position:sticky;top:96px;align-self:start;display:grid;gap:18px}.filter-block,.stats-panel,.builder{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.filter-block{display:grid;gap:10px;padding:16px}.filter-block label,.filter-label{color:var(--muted);font-size:.84rem;font-weight:700;text-transform:uppercase}input,select{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 11px;background:#fff;color:var(--ink)}input:focus,select:focus,button:focus-visible,a:focus-visible{outline:3px solid rgba(10,102,194,.22);outline-offset:2px}.style-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.style-filters button,.badge-actions button,.load-more,.primary-button,.icon-button{border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}.style-filters button{min-height:40px;padding:8px;overflow-wrap:anywhere}.style-filters button.is-active,.primary-button,.load-more:hover,.badge-actions button:hover{color:#fff;background:var(--accent);border-color:var(--accent)}.stats-panel{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;padding:16px}.stats-panel strong{font-size:1.1rem}.stats-panel span{color:var(--muted)}.content{min-width:0}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.eyebrow{color:var(--accent);font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.toolbar h2,.builder h2{font-size:clamp(1.4rem,3vw,2rem)}.view-controls{display:flex;gap:8px}.icon-button{display:grid;width:42px;height:42px;place-items:center;font-size:1.1rem}.icon-button.is-active{color:#fff;background:#17202a;border-color:#17202a}.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.badge-card{display:grid;gap:13px;min-width:0;padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}.badge-preview{display:flex;align-items:center;min-height:38px}.badge-preview img{max-width:100%;height:auto}.badge-meta h3{margin:0;overflow-wrap:anywhere;font-size:1rem}.badge-meta p{margin:4px 0 0;color:var(--muted);font-size:.88rem}.badge-details{display:grid;gap:6px;margin:0;padding:10px;background:var(--panel-muted);border-radius:8px}.badge-details div{display:grid;grid-template-columns:58px 1fr;gap:8px}.badge-details dt{color:var(--muted);font-size:.78rem}.badge-details dd{min-width:0;margin:0;overflow-wrap:anywhere;font-size:.84rem}.badge-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.badge-actions button,.load-more,.primary-button{min-height:40px;padding:8px 12px;font-weight:700}.badge-grid.is-list{grid-template-columns:1fr}.badge-grid.is-list .badge-card{grid-template-columns:minmax(160px,250px) minmax(120px,1fr) minmax(190px,250px) minmax(210px,260px);align-items:center}.load-more{display:block;width:min(100%,280px);margin:22px auto 0}.load-more[hidden]{display:none}.builder{display:grid;gap:18px;margin-top:34px;padding:20px}.builder-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.builder-form label{display:grid;gap:8px;color:var(--muted);font-weight:700}.builder-preview{display:grid;grid-template-columns:minmax(180px,auto) minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px;background:var(--panel-muted);border-radius:8px}.builder-preview code{min-width:0;overflow-wrap:anywhere;color:#263241}.toast{position:fixed;right:22px;bottom:22px;transform:translateY(16px);padding:11px 14px;color:#fff;background:#17202a;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease}.toast.is-visible{transform:translateY(0);opacity:1}@media(max-width:920px){.app-shell{grid-template-columns:1fr}.sidebar{position:static}.builder-form{grid-template-columns:repeat(2,minmax(0,1fr))}.builder-preview,.badge-grid.is-list .badge-card{grid-template-columns:1fr}}@media(max-width:620px){.app-header,.toolbar{align-items:flex-start;flex-direction:column}.top-actions,.view-controls{width:100%}.top-actions a,.view-controls button{flex:1;text-align:center}.builder-form,.badge-actions{grid-template-columns:1fr}}