.cw-samples { border-top: 1px solid var(--v2-line); }
.cw-samples .v2-section-head { max-width: 850px; }
.cw-sample-group + .cw-sample-group { margin-top: 40px; }
body.v2 .cw-sample-group h3 { margin: 0 0 18px; font-size: 22px; line-height: 1.5; word-break: keep-all; }
body.v2 .cw-sample-warning { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 18px; color: #9b2424; font-size: 14px; font-weight: 600; line-height: 1.7; word-break: keep-all; overflow-wrap: anywhere; }
.cw-sample-warning svg { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 3px; }
.cw-sample-warning span { min-width: 0; }
.cw-samples-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.cw-samples-grid figure { min-width: 0; margin: 0; }
.cw-samples-grid .cw-sample-wide { grid-column: 1 / -1; }
.cw-samples-grid button { display: block; width: 100%; padding: 0; border: 0; border-radius: 4px; overflow: hidden; background: #f3f5f5; cursor: zoom-in; }
.cw-samples-grid button:focus-visible { outline: 3px solid #17674e; outline-offset: 4px; }
.cw-samples-grid img { display: block; width: 100%; height: auto; object-fit: contain; }
.cw-sample-viewer { width: min(1300px, calc(100% - 32px)); max-width: none; height: calc(100dvh - 40px); max-height: none; padding: 0; border: 0; border-radius: 8px; background: #15191b; color: white; }
.cw-sample-viewer::backdrop { background: rgb(0 0 0 / 80%); }
.cw-sample-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.cw-sample-toolbar { display: flex; align-items: center; gap: 8px; padding: 10px 12px; }
body.v2 .cw-sample-toolbar h2 { margin: 0 auto 0 0; font-size: 16px; line-height: 1.5; min-width: 0; }
.cw-sample-viewer button { flex: 0 0 44px; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid #5a6368; border-radius: 4px; background: #252d31; color: white; cursor: pointer; }
.cw-sample-viewer :is(button, a):focus-visible { outline: 3px solid #78dbb2; outline-offset: 2px; }
.cw-sample-viewer svg { width: 22px; height: 22px; }
.cw-sample-stage { min-height: 0; position: relative; display: flex; align-items: center; justify-content: center; padding: 0 10px; }
.cw-sample-stage img { width: 100%; height: 100%; object-fit: contain; }
.cw-sample-error { position: absolute; max-width: 90%; padding: 16px; background: #15191b; }
.cw-sample-error[hidden] { display: none; }
.cw-sample-controls { justify-content: center; }
.cw-sample-position { min-width: 70px; text-align: center; font-size: 14px; }
html.cw-sample-open { overflow: hidden; }
.cw-marketing-protected img,
.cw-marketing-protected [data-cw-sample],
.cw-marketing-protected .cw-sample-stage {
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  user-select: none;
}
@media print {
  body.cw-marketing-protected img { visibility: hidden !important; }
  body.cw-marketing-protected .cw-sample-viewer { display: none !important; }
}
@media (max-width: 760px) {
  .cw-samples-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
  .cw-samples.v2-section { padding: 40px 0; }
  .cw-sample-group + .cw-sample-group { margin-top: 28px; }
  body.v2 .cw-sample-group h3 { margin-bottom: 14px; font-size: 20px; }
  .cw-sample-viewer { width: 100%; height: 100dvh; border-radius: 0; }
  .cw-sample-toolbar { padding: 8px max(8px, env(safe-area-inset-right)) 8px max(8px, env(safe-area-inset-left)); }
  .cw-sample-controls { padding-bottom: max(8px, env(safe-area-inset-bottom)); }
}