.letter-lab{min-width:0;border:1px solid #ffffff20;border-radius:28px;background:radial-gradient(ellipse at 40% 25%,#ffffff08,transparent 65%),linear-gradient(165deg,#17191c,#0c0d0f 65%,#050607);box-shadow:inset 0 1px #ffffff12,0 25px 65px #00131f40;overflow:clip;align-self:center}
.letter-heading{display:flex;justify-content:space-between;align-items:center;padding:25px 26px 0;gap:12px}.letter-heading .eyebrow{font-size:.7rem;letter-spacing:.08em}.letter-heading h2{font-size:1.35rem;letter-spacing:-.025em;margin-top:8px}.letter-tag{font-size:.75rem;color:#c4dce8;border:1px solid #91aebb50;padding:5px 9px;border-radius:10px}
.letter-stage{position:relative;height:clamp(310px,27vw,360px);width:100%;touch-action:pan-y;cursor:grab;outline-offset:-5px;isolation:isolate}.letter-stage.is-dragging{cursor:grabbing}.letter-stage canvas{display:block;width:100%;height:100%}.letter-stage:focus-visible{outline:2px solid #e0f2ff}.letter-fallback{height:100%;display:grid;place-content:center;text-align:center;gap:15px;font-size:.85rem}.letter-fallback img{margin:auto}.letter-state{position:absolute;bottom:8px;left:26px;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:#aac6d5;pointer-events:none}
.letter-interaction{padding:8px 26px 20px}.letter-interaction>p{font-size:.78rem;color:#bbd0db;margin:0 0 13px}.letter-controls{display:flex;gap:7px;flex-wrap:wrap}.letter-controls button{min-height:40px;border:1px solid #64829470;border-radius:12px;padding:9px 13px;color:#dce8ef;background:#1c3547;font-size:.8rem}.letter-controls button[aria-pressed=true]{background:#466274;border-color:#acc7d7;color:#fff}.letter-controls button:last-child{margin-left:auto;background:transparent}.letter-controls button:hover{border-color:#d1e3ee}.letter-slider{display:flex;align-items:center;gap:13px;margin:14px 0 0;font-size:.75rem;color:#c6d8e3}.letter-slider input{min-width:0;flex:1;accent-color:#c2e69b;height:24px;cursor:ew-resize}.letter-slider output{width:38px;text-align:right;font-variant-numeric:tabular-nums}
.letter-materials{display:grid;grid-template-columns:1fr 1fr;margin:0 26px;gap:18px 15px;padding:20px 0 8px;border-top:1px solid #abc7d329}.letter-materials dt{font-size:.78rem;color:#edf4f7;display:flex;align-items:center;gap:8px}.letter-materials dd{margin:5px 0 0 18px;color:#b8cdd8;font-size:.7rem;line-height:1.5}.swatch{display:inline-block;width:9px;height:9px;border:1px solid #afc8d370;border-radius:3px;flex-shrink:0}.swatch.pmma{background:#fff;box-shadow:0 0 8px #eaf8ff80}.swatch.black{background:#111519}.swatch.pvc{background:#c5cdce}.swatch.led{background:#c2e69b}.letter-note{font-size:.65rem!important;color:#adc1cc!important;margin:8px 26px 20px!important}
@media(max-width:1100px) and (min-width:901px){.letter-heading,.letter-interaction{padding-inline:18px}.letter-materials{margin-inline:18px;gap:13px 10px}.letter-controls button{font-size:.72rem;padding:8px 9px}.letter-controls button:last-child{margin-left:0}.letter-heading h2{font-size:1.15rem}}
@media(max-width:900px){.letter-stage{height:360px}.letter-lab{width:100%}.letter-heading{padding:23px 22px 0}.letter-interaction{padding-inline:22px}.letter-materials{margin-inline:22px}}
@media(max-width:400px){.letter-stage{height:320px}.letter-heading{padding-inline:16px}.letter-heading h2{font-size:1.15rem}.letter-interaction{padding-inline:16px}.letter-controls button{font-size:.7rem;padding:8px 9px}.letter-controls button:last-child{margin-left:0}.letter-materials{margin-inline:16px;gap:14px 10px}.letter-materials dd{font-size:.67rem;margin-left:0}.letter-materials dt{font-size:.72rem}.letter-note{margin-inline:16px!important}}

.letter-stage.is-pointer-focus:focus{outline:none;box-shadow:none}

.service-hero .letter-heading p{margin-top:0}.service-hero .letter-heading h2{font-size:1.35rem}.service-hero .letter-interaction>p{margin-top:0}

.letter-lab-minimal{background:none;border:0;box-shadow:none;border-radius:0}.letter-lab-minimal .letter-heading,.letter-lab-minimal .letter-state,.letter-lab-minimal .letter-interaction,.letter-lab-minimal .letter-materials,.letter-lab-minimal .letter-note,.letter-lab-minimal .letter-fallback p{display:none}.letter-lab-minimal .letter-stage{height:clamp(360px,43vw,560px)}@media(max-width:900px){.letter-lab-minimal .letter-stage{height:380px}}
