*{box-sizing:border-box}body{background:var(--ss-color-bg-page);color:var(--ss-color-text-primary);font:var(--ss-type-body);margin:0}main{max-width:760px;padding-block:var(--ss-space-section);padding-inline:var(--ss-space-page-gutter);margin:0 auto}h1{margin:0 0 var(--ss-space-gap);font:var(--ss-type-display);text-wrap:balance}h2{margin:var(--ss-space-section) 0 var(--ss-space-gap-tight);font:var(--ss-type-title)}p{margin:0 0 var(--ss-space-gap-loose);max-width:62ch}.lead{font-size:18px}.muted{color:var(--ss-color-text-muted);font:var(--ss-type-body-small)}.workbench{--wb-width:min(1180px, calc(100vw - 2 * var(--ss-space-page-gutter)));align-items:start;gap:var(--ss-space-gap-loose);width:var(--wb-width);margin-inline:calc((100% - var(--wb-width)) / 2);margin-block:var(--ss-space-gap-loose) var(--ss-space-section);grid-template-columns:minmax(280px,340px) minmax(0,1fr);display:grid}.workbench .controls{top:calc(env(safe-area-inset-top,0px) + 96px);max-height:calc(100vh - 120px);position:sticky;overflow-y:auto}.workbench .brand{margin-top:0}@media (max-width:820px){.workbench{grid-template-columns:minmax(0,1fr)}.workbench .controls{max-height:none;position:static}}.controls{gap:var(--ss-space-gap-loose);padding:var(--ss-space-card);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-card);background:var(--ss-color-bg-surface);display:grid}.field{gap:var(--ss-space-gap);min-width:0;display:grid}.field>span,.field>label{font:var(--ss-type-caption)}.row{align-items:center;gap:var(--ss-space-gap);flex-wrap:wrap;display:flex}.pair{gap:var(--ss-space-gap-loose);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.preset{width:var(--ss-space-target-min);height:var(--ss-space-target-min);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-pill);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;padding:0}.preset[aria-pressed=true]{outline:var(--ss-outline-focus) solid var(--ss-color-text-primary);outline-offset:var(--ss-outline-focus-offset)}.preset:focus-visible,.text-input:focus-visible,.select:focus-visible,.picker:focus-visible{outline:var(--ss-outline-focus) solid var(--ss-color-focus-ring);outline-offset:var(--ss-outline-focus-offset)}.picker{width:var(--ss-space-target-min);height:var(--ss-space-target-min);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-inner);background:var(--ss-color-bg-raised);cursor:pointer;padding:2px}.text-input,.select{min-height:var(--ss-space-target-min);padding:0 var(--ss-space-control-y);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-control);background:var(--ss-color-bg-raised);color:var(--ss-color-text-primary);font:var(--ss-type-body)}.text-input{width:112px;font:var(--ss-type-code);font-size:16px}.select{width:100%}.segment .ss-button[aria-pressed=true],.segment .ss-button[aria-pressed=true]:hover:not(:disabled){background:var(--ss-color-action-primary);color:var(--ss-color-action-on-primary)}.brand{margin-top:var(--ss-space-gap-loose);padding:var(--ss-space-card);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-card);background:var(--ss-color-bg-page);color:var(--ss-color-text-primary);font:var(--ss-type-body);gap:var(--ss-space-gap-loose);display:grid}.brand h3{font:var(--ss-type-title);text-wrap:balance;margin:0}.topbar{justify-content:space-between;align-items:center;gap:var(--ss-space-gap);flex-wrap:wrap;display:flex}.topbar strong{font:var(--ss-type-label)}.card{gap:var(--ss-space-gap);padding:var(--ss-space-card);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-card);background:var(--ss-color-bg-surface);display:grid}.card a{color:var(--ss-color-text-brand);font:var(--ss-type-label)}.actions{gap:var(--ss-space-gap);flex-wrap:wrap;display:flex}.notes{gap:var(--ss-space-gap);max-width:62ch;margin:0;padding-left:20px;display:grid}.ramp{margin-bottom:var(--ss-space-gap-loose);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-inner);display:flex;overflow:hidden}.ramp i{flex:1;height:28px}.scroll{border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-card);background:var(--ss-color-bg-surface);overflow-x:auto}table{border-collapse:collapse;width:100%;font:var(--ss-type-body-small);font-variant-numeric:tabular-nums}th,td{text-align:left;white-space:nowrap;border-bottom:var(--ss-outline-divider) solid var(--ss-color-border-subtle);padding:8px 12px}tr:last-child td{border-bottom:0}.sample{border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-inner);margin-right:8px;padding:0 8px;font-weight:700;display:inline-block}.fail{color:var(--ss-color-text-error);font-weight:700}pre{margin:0 0 var(--ss-space-gap-loose);padding:var(--ss-space-card);border:var(--ss-outline-component) solid var(--ss-color-border-strong);border-radius:var(--ss-radius-card);background:var(--ss-color-bg-raised);font:var(--ss-type-code);overflow-x:auto}.select{appearance:none;padding-right:calc(var(--ss-space-control-y) + 22px);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E2A24' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--ss-space-control-y) center;cursor:pointer;background-size:14px 14px}[data-theme=night] .select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF4DC' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
