.nematic-page{padding-block:0 2.5rem}.nematic-intro{padding:clamp(2.5rem,5vw,4rem) 0 clamp(2rem,3vw,2.5rem)}.nematic-intro h1{font-size:var(--page-title-size);display:block}.nematic-intro h1 span{color:var(--accent);display:inline}.nematic-intro p{max-width:54ch;font:1.0625rem/1.6 var(--body-font);margin:1rem 0 0}.material-lab{border:1px solid var(--rule);background:var(--reading-surface);grid-template-columns:minmax(0,1fr) 310px;height:clamp(640px,74svh,740px);display:grid;overflow:clip}.material-sample{background:var(--ink);min-width:0;color:var(--surface);flex-direction:column;display:flex}.material-sample-bar{justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 1.25rem .25rem;display:flex}.material-sample-state{flex-wrap:wrap;align-items:center;gap:.65rem;display:flex}.material-sample-state h2{margin:0;font:700 .875rem/1.4 Courier New,Courier,monospace}.material-state-prefix{opacity:.65;font-size:.6875rem;font-weight:400}.material-live-dot{background:#99c49e;background:lab(75.3915% -20.3323 14.2155);border-radius:50%;width:6px;height:6px}.material-live-dot[data-paused=true]{background:var(--accent)}.material-count{opacity:.6;font-variant-numeric:tabular-nums;margin-left:.35rem;font-size:.6875rem}.material-pause{width:44px;height:44px;color:inherit;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:50%;flex-shrink:0;place-items:center;padding:12px;display:grid}.material-pause:hover{border-color:color-mix(in oklch, var(--surface), transparent 70%);background:color-mix(in oklch, var(--surface), transparent 95%)}.material-pause:focus-visible{outline-color:var(--surface);outline-offset:2px}.material-pause svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.material-canvas{flex:1;min-height:0;position:relative}.material-canvas canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block;position:absolute;inset:0}.material-canvas canvas:active{cursor:grabbing}.material-canvas canvas:focus-visible{outline:1px dashed var(--surface);outline-offset:-5px}.material-sample-footer{color:color-mix(in oklch, var(--surface), transparent 28%);flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem;padding:.75rem 1.25rem 1.25rem;font-size:.6875rem;display:flex}.material-sample-footer>span{align-items:center;gap:.5rem;display:inline-flex}.material-sample-footer i{background:linear-gradient(90deg,#b9907b,#b4d2bc);border-radius:4px;width:22px;height:5px;display:inline-block}.material-controls{border-left:1px solid color-mix(in oklch, var(--ink), transparent 85%);flex-direction:column;min-width:0;min-height:0;font-family:Arial,Helvetica,sans-serif;display:flex;overflow:hidden}.material-control-header{border-bottom:1px solid color-mix(in oklch, var(--ink), transparent 82%);background:var(--reading-surface);flex-shrink:0;padding:1.15rem 1.25rem 1rem}.material-control-header h2{margin:0 0 .85rem;font-size:1rem;font-weight:600}.material-start-label{color:color-mix(in oklch, var(--ink), transparent 20%);margin-bottom:.5rem;font-size:.6875rem}.material-preset-help{color:color-mix(in oklch, var(--ink), transparent 22%);margin:.6rem 0 0;font-size:.6875rem;line-height:1.5}.material-detail-options{gap:.25rem;margin-block:.5rem;display:grid}.material-detail-options label{cursor:pointer;align-items:center;gap:.6rem;min-height:44px;font-size:.8125rem;display:flex}.material-detail-options input{width:18px;height:18px;accent-color:var(--link-hover);margin:0}.material-detail-options input:focus-visible{outline:2px solid var(--link-hover);outline-offset:3px}.material-mode-note{color:var(--link-hover);margin:0 0 1rem;font-size:.6875rem;line-height:1.6}.material-stats{grid-template-columns:1fr 1fr;gap:.5rem 1rem;margin:.75rem 0 0;display:grid}.material-stats div:last-child{grid-column:1/-1;justify-content:space-between;align-items:baseline;display:flex}.material-stats dt{opacity:.75;font-size:.625rem}.material-stats dd{margin:.25rem 0 0;font:.75rem Courier New,Courier,monospace}.material-stats dd span{font-size:.625rem}.material-control-panel{scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:var(--accent) transparent;flex:1;min-height:0;padding:.5rem 1.25rem 1rem;overflow-y:auto}.material-control-footer{border-top:1px solid color-mix(in oklch, var(--ink), transparent 82%);flex-shrink:0;padding:1rem 1.25rem 1.15rem}.material-control-footer .material-order{border:0;margin:0;padding:0}.material-field-group{border:0;min-width:0;margin:0 0 1.5rem;padding:0}.material-field-group legend{margin-bottom:1rem;padding:0;font-size:.875rem;font-weight:600}.material-field-group+.material-field-group{border-top:1px solid color-mix(in oklch, var(--ink), transparent 82%);padding-top:1rem}.material-field-group+.material-field-group legend{padding-right:.5rem}.material-field-range{margin-top:.5rem}.material-field-range .material-parameter-label label{font-size:.8125rem;font-weight:400}.material-field-note{color:color-mix(in oklch, var(--ink), transparent 22%);margin:.35rem 0 0;font-size:.6875rem;line-height:1.65}.material-plane-label{margin:.5rem 0;font-size:.8125rem;display:block}.material-field-group select{border:1px solid color-mix(in oklch, var(--ink), transparent 65%);background:var(--reading-surface);width:100%;min-height:44px;color:var(--ink);border-radius:4px;padding:.5rem;font:.75rem Arial,Helvetica,sans-serif;display:block}.material-field-group select:focus-visible{outline:2px solid var(--link-hover);outline-offset:2px}.material-charge-switch{cursor:pointer;justify-content:space-between;align-items:center;gap:1rem;min-height:54px;margin-top:.25rem;font-size:.8125rem;display:flex}.material-charge-switch small{color:var(--link-hover);margin-top:.3rem;font-size:.6875rem;display:block}.material-charge-switch input{appearance:none;border:1px solid color-mix(in oklch, var(--ink), transparent 65%);background:var(--code-surface);cursor:pointer;border-radius:20px;flex-shrink:0;width:40px;height:24px;margin:0;position:relative}.material-charge-switch input:before{content:"";background:var(--ink);border-radius:50%;width:16px;height:16px;transition:transform .15s ease-out;position:absolute;top:3px;left:3px}.material-charge-switch input:checked{border-color:var(--link-hover);background:var(--link-hover)}.material-charge-switch input:checked:before{background:var(--reading-surface);transform:translate(16px)}.material-charge-switch input:focus-visible{outline:2px solid var(--link-hover);outline-offset:3px}.material-ion-count{margin:.65rem 0 0;font:.6875rem/1.5 Courier New,Courier,monospace}.material-field-actions{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.material-field-actions button{border:1px solid color-mix(in oklch, var(--ink), transparent 65%);min-height:44px;color:var(--ink);cursor:pointer;background:0 0;border-radius:4px;padding:.5rem .25rem;font:.6875rem Arial,Helvetica,sans-serif}.material-field-actions button:hover{background:var(--code-surface)}.material-ion-key b{width:13px;height:13px;color:var(--ink);border-radius:50%;place-items:center;font:700 10px Arial,sans-serif;display:inline-grid}.material-ion-key .ion-positive{background:#d3a28b}.material-ion-key .ion-negative{background:#9ecab3}.material-ion-key .ion-neutral{background:#b8c3b5}.material-presets{border:1px solid color-mix(in oklch, var(--ink), transparent 78%);border-radius:6px;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:3px;display:grid}.material-presets button{min-width:0;min-height:44px;color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:3px;padding:.5rem .25rem;font:600 .8125rem/1.2 Arial,Helvetica,sans-serif}.material-presets button:hover{background:var(--code-surface)}.material-presets button[aria-pressed=true]{background:var(--ink);color:var(--reading-surface)}.material-presets button:focus-visible{outline-offset:2px}.material-sliders{gap:1rem;display:grid}.material-parameter-label{justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.material-parameter-label label{font-size:.875rem;font-weight:600}.material-parameter-label output{font-variant-numeric:tabular-nums;font:700 .8125rem/1.4 Courier New,Courier,monospace}.material-parameter-label output span{margin-left:2px;font-size:.6875rem;font-weight:400}.material-parameter>p{color:color-mix(in oklch, var(--ink), transparent 25%);margin:.35rem 0 0;font-size:.75rem;line-height:1.6}.material-parameter input[type=range]{appearance:none;cursor:pointer;width:100%;height:44px;accent-color:var(--link-hover);background:0 0;border:0;border-radius:0;margin:0;padding:0;display:block}.material-parameter input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--link-hover) 0 var(--range-progress), var(--code-surface) var(--range-progress) 100%);border-radius:3px;height:4px}.material-parameter input[type=range]::-moz-range-track{background:var(--code-surface);border-radius:3px;height:4px}.material-parameter input[type=range]::-moz-range-progress{background:var(--link-hover);height:4px}.material-parameter input[type=range]::-webkit-slider-thumb{appearance:none;border:2px solid var(--reading-surface);background:var(--link-hover);width:18px;height:18px;box-shadow:0 0 0 1px var(--link-hover);border-radius:50%;margin-top:-7px}.material-parameter input[type=range]::-moz-range-thumb{border:2px solid var(--reading-surface);background:var(--link-hover);width:15px;height:15px;box-shadow:0 0 0 1px var(--link-hover);border-radius:50%}.material-parameter input:focus-visible{outline:2px solid var(--link-hover);outline-offset:2px;border-radius:3px}.material-range-ends{color:color-mix(in oklch, var(--ink), transparent 28%);justify-content:space-between;margin-top:-4px;font-size:.6875rem;display:flex}.material-order{border-top:1px solid color-mix(in oklch, var(--ink), transparent 82%);margin-top:1rem;padding-top:.85rem}.material-order>div{justify-content:space-between;gap:.75rem;font-size:.75rem;display:flex}.material-order output{font-variant-numeric:tabular-nums;font-family:Courier New,Courier,monospace}.material-order progress{appearance:none;background:var(--code-surface);width:100%;height:4px;accent-color:var(--link-hover);border:0;border-radius:0;margin-top:.6rem;display:block}.material-order progress::-webkit-progress-bar{background:var(--code-surface)}.material-order progress::-webkit-progress-value{background:var(--link-hover)}.material-order progress::-moz-progress-bar{background:var(--link-hover)}.material-order p{color:color-mix(in oklch, var(--ink), transparent 28%);margin:.5rem 0 0;font-size:.6875rem;line-height:1.6}.material-reset{border:1px solid color-mix(in oklch, var(--ink), transparent 80%);width:100%;min-height:44px;color:var(--ink);cursor:pointer;background:0 0;border-radius:4px;justify-content:center;align-items:center;gap:.5rem;margin-top:.75rem;padding:.5rem;font:.75rem Arial,Helvetica,sans-serif;display:inline-flex}.material-reset:hover{background:var(--code-surface)}.material-reset svg{fill:none;stroke:currentColor;stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round;width:15px;height:15px}.material-model-note{max-width:75ch;color:color-mix(in oklch, var(--ink), transparent 28%);margin:.85rem 0 0;font:.6875rem/1.7 Arial,Helvetica,sans-serif}.material-fallback{background:var(--ink);color:var(--surface);place-items:center;margin:0;padding:1.5rem;font-size:.875rem;line-height:1.6;display:grid;position:absolute;inset:0}.material-lab button:disabled,.material-lab input:disabled{opacity:.45;cursor:default}@media (max-width:850px){.material-lab{--material-sample-height:min(420px, 42svh);grid-template-columns:minmax(0,1fr);height:auto;overflow:visible}.material-sample{z-index:1;height:var(--material-sample-height);align-self:start;position:sticky;top:0;overflow:hidden}.material-canvas{min-height:0}.material-controls{border-left:0;border-top:1px solid color-mix(in oklch, var(--ink), transparent 85%);padding:0;overflow:visible}.material-control-header{top:var(--material-sample-height);z-index:2;position:sticky}.material-control-panel{scrollbar-gutter:auto;overflow:visible}.material-field-group{margin-bottom:1.75rem}.material-field-group legend{font-size:1rem}.material-field-note{font-size:.75rem}.material-sliders{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.material-parameter input,.material-field-group select,.material-charge-switch input,.material-detail-options input,.material-control-panel button,.material-control-footer button{scroll-margin-top:calc(var(--material-sample-height) + 195px)}.material-parameter-label{gap:.5rem}.material-parameter-label label{font-size:.8125rem}.material-order{margin-top:1.25rem}}@media (max-width:600px){.nematic-intro{padding-block:2.5rem 2rem}.material-lab{--material-sample-height:clamp(240px, 42svh, 350px)}.material-sample-bar{padding:.4rem .85rem 0}.material-sample-footer{padding:.5rem .85rem .85rem;font-size:.5625rem}.material-sliders{grid-template-columns:1fr;gap:1.25rem}.material-parameter>p{font-size:.75rem}.material-parameter-label label{font-size:.9375rem}.material-range-ends{font-size:.6875rem}.material-parameter input,.material-field-group select,.material-charge-switch input,.material-detail-options input,.material-control-panel button,.material-control-footer button{scroll-margin-top:calc(var(--material-sample-height) + 195px)}}@media (max-width:850px) and (max-height:600px){.material-lab{--material-sample-height:max(200px, 30svh)}.material-sample-bar{padding:.25rem .75rem 0}.material-sample-footer{padding:.25rem .75rem .5rem;font-size:.5625rem}.material-control-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem 1rem;display:flex}.material-control-header h2,.material-start-label,.material-preset-help{display:none}.material-control-header .material-presets{flex:1 0 180px}.material-parameter input,.material-field-group select,.material-charge-switch input,.material-detail-options input,.material-control-panel button,.material-control-footer button{scroll-margin-top:calc(var(--material-sample-height) + 85px)}}@media (forced-colors:active){.material-parameter input[type=range]{appearance:auto}.material-presets button[aria-pressed=true]{outline:2px solid highlight}}@media print{.material-lab{display:none}}
