@font-face{font-family:Pixelify Sans;src:url(/feelable-materials/assets/PixelifySans-VariableFont_wght-BOgNfX6E.ttf) format("truetype");font-display:swap;font-weight:400 800}:root{color:#fff3d2;background:#10121a;font-family:Pixelify Sans,Chalk,Chalkboard SE,Comic Sans MS,cursive;font-synthesis:none;--ink: #10121a;--panel: #171b27;--panel-soft: #1d2230;--chalk: #fff3d2;--chalk-muted: #b9b6aa;--red: #ff7b72;--yellow: #ffd66b;--aqua: #68e8ff;--mint: #a7d88b;--line: rgba(255, 243, 210, .23);--shadow: 0 18px 48px rgba(0, 0, 0, .24)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--ink)}a{color:inherit}button,input,select{font:inherit}:focus-visible{outline:3px solid var(--aqua);outline-offset:4px}.demo-shell{width:min(1180px,calc(100% - 40px));margin:0 auto}.site-header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:78px;border-bottom:1px solid var(--line)}.brand,nav{display:flex;align-items:center;gap:18px;font-size:.95rem;text-decoration:none}.brand{font-weight:700}.brand-mark{color:var(--aqua);font-size:1.65rem;line-height:0}nav a{color:var(--chalk-muted);text-decoration:none}nav a:hover{color:var(--chalk)}.section-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:56px;align-items:end}.hero{min-height:490px;padding:92px 0 84px}.eyebrow{margin:0 0 16px;color:var(--aqua);font-size:.78rem;font-weight:700;letter-spacing:.08em}h1,h2,h3,p{margin-top:0}h1{margin-bottom:18px;color:var(--aqua);font-size:5.8rem;line-height:.9;letter-spacing:.01em}h2{margin-bottom:16px;font-size:2.25rem;line-height:1.05}h3{margin-bottom:8px;font-size:1.25rem}.hero-lede{max-width:580px;margin-bottom:18px;font-size:1.7rem;line-height:1.15}.hero-body,.section-heading>p:last-child,.feature-item p,.install-section p{color:var(--chalk-muted);line-height:1.55}.hero-body{max-width:570px;font-size:1.05rem}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.button,.text-button{border:1px solid var(--line);cursor:pointer;text-decoration:none}.button{display:inline-flex;align-items:center;min-height:46px;padding:10px 18px}.button-primary{border-color:var(--aqua);color:var(--ink);background:var(--aqua)}.button-quiet{color:var(--chalk);background:transparent}.button:hover,.text-button:hover,.material-choice:hover{transform:translateY(-1px)}.hero-note{align-self:center;padding:24px 22px;border:1px solid var(--yellow);color:var(--yellow);transform:rotate(-2deg);box-shadow:var(--shadow)}.note-line{display:block;margin:6px 0;font-size:1.05rem}.section-block{padding:72px 0;border-top:1px solid var(--line)}.section-heading{max-width:700px;margin-bottom:30px}.bench-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(290px,.65fr);gap:18px}.canvas-panel,.control-panel,.code-panel{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}.canvas-panel{min-height:610px;overflow:hidden;position:relative}.canvas-panel canvas{display:block;width:100%;height:610px;touch-action:none}.canvas-message{display:grid;min-height:610px;place-items:center;color:var(--chalk-muted)}.control-panel{padding:24px}.control-panel-heading,.code-panel-heading{display:flex;align-items:start;justify-content:space-between;gap:16px}.control-panel-heading{margin-bottom:10px}.control-panel-heading h3{margin:0}.control-actions{display:flex;gap:8px}.text-button{padding:7px 10px;color:var(--chalk);background:transparent}.text-button:disabled{cursor:not-allowed;opacity:.45;transform:none}.selected-detail{margin-bottom:20px;color:var(--chalk-muted)}.material-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:24px}.material-choice{display:grid;gap:3px;width:100%;padding:10px 12px;border:1px solid var(--line);color:var(--chalk);background:var(--panel-soft);cursor:pointer;text-align:left}.material-choice small{color:var(--chalk-muted)}.material-choice.is-selected{border-color:var(--aqua);color:var(--aqua)}.control-field{display:grid;gap:7px;margin-bottom:17px}.control-field>span{color:var(--chalk);font-size:.92rem}.control-field select{width:100%;min-height:40px;padding:7px 9px;border:1px solid var(--line);border-radius:0;color:var(--chalk);background:var(--panel-soft)}.check-field{display:flex;align-items:center;gap:9px;margin-top:13px;color:var(--chalk-muted);font-size:.9rem}.check-field input{width:17px;height:17px;accent-color:var(--aqua)}.canvas-status{margin:20px 0 0;padding-top:15px;border-top:1px solid var(--line);color:var(--chalk-muted);font-size:.88rem;line-height:1.4}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.feature-item{padding-top:18px;border-top:2px solid var(--aqua)}.feature-number{color:var(--aqua);font-size:.82rem}.feature-item h3{margin-top:20px}.feature-item p{margin-bottom:0}.code-panel{max-width:740px;padding:20px 22px;background:#0b0d12}.code-panel-heading{color:var(--chalk-muted)}pre{margin:22px 0 0;overflow-x:auto;line-height:1.6;white-space:pre-wrap}pre code{color:var(--chalk);font-family:Pixelify Sans,Chalk,monospace}.install-section{display:flex;align-items:end;justify-content:space-between;gap:28px}.install-section h2{margin-bottom:10px}.install-command{display:block;padding:14px 18px;border:1px solid var(--aqua);color:var(--aqua);white-space:nowrap}.site-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding:28px 0 40px;border-top:1px solid var(--line);color:var(--chalk-muted);font-size:.9rem}.site-footer a{color:var(--chalk)}@media(max-width:850px){.section-grid,.bench-layout{grid-template-columns:1fr}.hero{min-height:auto}.hero-note{justify-self:start}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.demo-shell{width:min(100% - 28px,520px)}.site-header{align-items:start;flex-direction:column;padding:18px 0}nav{flex-wrap:wrap;gap:10px 16px}.hero{padding:64px 0}h1{font-size:4.1rem}h2{font-size:1.85rem}.hero-lede{font-size:1.35rem}.canvas-panel,.canvas-panel canvas,.canvas-message{min-height:540px;height:540px}.feature-grid{grid-template-columns:1fr;gap:24px}.install-section{align-items:stretch;flex-direction:column}.install-command{white-space:normal;overflow-wrap:anywhere}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}