@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Syne:wght@400;500;600;700;800&display=swap";
:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4efe7;--bg-secondary:#e8dfd1;--panel:#fffaf1e0;--panel-dark:#10231e;--panel-dark-accent:#17372f;--text:#0e1512;--muted:#5b655f;--line:#0e15121a;--accent:#80f2c1;--accent-strong:#1d8e63;--danger:#c95047;--warning:#c89535;--shadow:0 24px 52px #111c161c;--radius-lg:30px;--radius-md:22px;--radius-sm:16px;--font-display:"Syne", "Trebuchet MS", sans-serif;--font-body:"IBM Plex Sans", "Segoe UI", sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;font-family:var(--font-body);color:var(--text);background:radial-gradient(circle at top left, #80f2c147, transparent 28%), radial-gradient(circle at top right, #16362e14, transparent 22%), linear-gradient(180deg, var(--bg) 0%, #f1e8da 100%);margin:0}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}img,video{max-width:100%;display:block}audio{width:100%}main{z-index:1;position:relative}.app-background{pointer-events:none;background-image:linear-gradient(#10231e0d 1px,#0000 1px),linear-gradient(90deg,#10231e0d 1px,#0000 1px);background-size:54px 54px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000000a6,#0000 82%);mask-image:linear-gradient(#000000a6,#0000 82%)}.page-shell{width:min(1180px,100% - 32px);margin:0 auto}.site-header{z-index:10;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);background:#f4efe7c7;position:sticky;top:0}.site-header-inner{justify-content:space-between;align-items:center;gap:20px;padding:16px 0;display:flex}.brand-lockup{align-items:center;gap:14px;min-width:0;display:flex}.brand-mark{filter:drop-shadow(0 12px 20px #1d8e632e);flex:none;place-items:center;width:54px;height:54px;display:grid}.brand-logo-svg{width:100%;height:100%}.brand-copy{gap:2px;display:grid}.brand-name{font-family:var(--font-display);letter-spacing:.01em;font-size:1.08rem;line-height:1;display:block}.brand-subtitle{color:var(--muted);font-size:.78rem;display:block}.site-nav{flex-wrap:wrap;gap:18px;display:flex}.site-nav a{color:var(--muted);font-size:.96rem;transition:color .12s}.site-nav a:hover{color:var(--text)}.header-actions{align-items:center;gap:12px;display:flex}.language-switcher{color:var(--muted);white-space:nowrap;align-items:center;gap:12px;font-size:.88rem;font-weight:700;display:inline-flex}.language-switcher-label{color:#52615a}.language-select{min-width:172px;min-height:48px;color:var(--text);background:#fffaf1d1;border:1px solid #0e15121f;border-radius:14px;padding:0 14px}.language-select:focus{outline-offset:2px;outline:2px solid #1d8e6340}.button{color:#eff8f4;letter-spacing:.01em;background:linear-gradient(135deg,#12352d,#0b1814);border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:.95rem 1.3rem;font-weight:700;transition:transform .12s,box-shadow .12s,opacity .12s;display:inline-flex;box-shadow:0 16px 28px #12352d38}.button:hover{transform:translateY(-1px);box-shadow:0 20px 30px #12352d42}.button:disabled{opacity:.56;cursor:not-allowed;box-shadow:none;transform:none}.button-small{min-height:42px;padding:.78rem 1rem;font-size:.92rem}.button-secondary{color:var(--text);box-shadow:none;background:0 0;border:1px solid #0e15121f}.homepage,.tool-page{gap:32px;padding:48px 0 88px;display:grid}.hero-grid,.tool-hero,.tool-grid-shell,.split-section,.footer-grid,.cta-panel-grid{gap:18px;display:grid}.hero-grid{grid-template-columns:minmax(0,1.22fr) minmax(0,.88fr)}.tool-hero{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:start}.tool-grid-shell{grid-template-columns:minmax(0,1.08fr) minmax(300px,.76fr);align-items:start}.split-section{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-grid{grid-template-columns:1.15fr .8fr 1fr}.footer-stack{gap:20px;display:grid}.cta-panel-grid{grid-template-columns:minmax(0,1.12fr) minmax(280px,.88fr);align-items:stretch}.panel,.tool-card,.faq-item{border-radius:var(--radius-lg);background:var(--panel);box-shadow:var(--shadow);border:1px solid #0e151214;position:relative;overflow:hidden}.panel:before,.tool-card:before,.faq-item:before{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff4d,#0000 48%);position:absolute;inset:0}.panel{padding:28px}.panel-dark{background:linear-gradient(165deg, #0d1815, var(--panel-dark) 58%, var(--panel-dark-accent));color:#eff8f4;border-color:#80f2c129}.panel-outline{background:#f8f2e9d1}.eyebrow{letter-spacing:.22em;text-transform:uppercase;color:var(--accent-strong);margin:0 0 12px;font-size:.72rem;font-weight:700}.panel-dark .eyebrow{color:var(--accent)}.display-title{max-width:12ch;font-family:var(--font-display);margin:0;font-size:clamp(2.5rem,4vw,5rem);line-height:.96}.lede,.footer-copy,.tool-card p,.faq-item p,.hero-support-copy,.metric-card p,.status-copy,.field-hint,.mini-tool-card p,.pattern-card p,.empty-note{color:var(--muted);line-height:1.65}.panel-dark .lede,.panel-dark .hero-support-copy,.panel-dark .footer-copy,.panel-dark .metric-card p,.panel-dark li,.panel-dark p{color:#eff8f4c7}.lede{max-width:60ch;margin:18px 0 0;font-size:clamp(1rem,1.6vw,1.18rem)}.compact{max-width:56ch}.hero-support-copy{max-width:58ch;margin:18px 0 0}.button-row,.choice-row,.badge-row{flex-wrap:wrap;gap:12px;display:flex}.button-row{margin-top:4px}.trust-strip,.tool-card-grid,.console-grid,.stat-chip-grid,.faq-grid,.metrics-grid,.pattern-grid,.readout-grid,.mini-card-list,.section-stack,.tool-grid-main,.tool-grid-side,.tester-panel{gap:16px;display:grid}.trust-strip{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:28px}.trust-pill,.stat-chip,.console-card,.metric-card,.pattern-card,.mini-tool-card{border-radius:var(--radius-md);border:1px solid #0e151214}.trust-pill,.stat-chip{background:#ffffff8c;gap:6px;padding:15px 16px;display:grid}.panel-dark .stat-chip,.console-card{background:#ffffff0d;border-color:#80f2c124}.trust-pill span,.stat-chip span,.metric-card span,.card-badge,.footer-heading,.status-label,.mini-tool-card span,.pattern-card span{text-transform:uppercase;letter-spacing:.16em}.trust-pill span,.stat-chip span,.metric-card span,.mini-tool-card span{color:var(--muted);font-size:.74rem}.panel-dark .stat-chip span{color:#eff8f494}.trust-pill strong,.stat-chip strong,.metric-card strong{font-size:1.06rem}.console-card{padding:16px}.console-card span{font-family:var(--font-display);color:var(--accent);font-size:1.4rem}.console-card p,.pattern-card p{margin:0}.section-heading{align-items:start;gap:10px;max-width:56rem;padding-left:2px;display:grid}.section-heading h2,.panel h2,.tool-card h3{font-family:var(--font-display);margin:0;line-height:1.04}.section-heading h2,.panel h2{max-width:20ch;font-size:clamp(1.8rem,2.7vw,3rem)}.section-heading .eyebrow{margin-bottom:0}.section-stack{gap:20px}.tool-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-card{background:radial-gradient(circle at 100% 0,#80f2c11f,#0000 36%),#fffaf1eb;padding:24px}.card-badge{color:var(--accent-strong);margin:0;font-size:.74rem;font-weight:700}.tool-card h3{font-size:1.82rem}.tool-card p{margin:0}.bullet-list,.tip-list,.step-list{gap:.72rem;margin:0;padding-left:1.2rem;display:grid}.badge-row span,.choice-chip{background:0 0;border:1px solid #0e15121a;border-radius:999px;padding:12px 14px}.faq-item{background:linear-gradient(#ffffffa8,#fffaf1e6),#fffaf1eb;padding:18px 20px}.faq-item summary{cursor:pointer;font-size:1.05rem;font-weight:700;line-height:1.35;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item p{margin:12px 0 0}.footer-heading{color:var(--accent-strong);margin:0 0 10px;font-size:.75rem;font-weight:700}.footer-links{gap:8px;display:grid}.footer-copy{margin:0}.footer-meta{border-top:1px solid #0e151214;padding-top:18px}.footer-copyright{color:var(--muted);margin:0;font-size:.88rem}.side-panel{gap:14px;display:grid}.mini-tool-card{background:#0e151208;gap:6px;padding:16px;display:grid}.mini-tool-card strong{font-size:1rem}.control-grid,.control-grid-wide{align-items:end;gap:12px;display:grid}.control-grid{grid-template-columns:minmax(220px,1fr) auto auto}.control-grid-wide{grid-template-columns:minmax(220px,1fr) auto auto auto}.field{gap:8px;display:grid}.field label,.field span{font-weight:600}.select,.range-input{border-radius:var(--radius-sm);width:100%;min-height:52px;color:var(--text);background:#ffffffe0;border:1px solid #0e15121f;padding:14px 16px}.hero-copy,.cta-panel{background:radial-gradient(circle at top right, #80f2c11f, transparent 34%), radial-gradient(circle at bottom left, #0e151209, transparent 28%), var(--panel)}.hero-console{position:relative}.hero-console:after,.cta-panel:after{content:"";pointer-events:none;border:1px solid #0e15120d;border-radius:24px;position:absolute;inset:18px}.cta-copy{align-content:start;gap:14px;display:grid}.cta-copy .button-row{margin-top:8px}.cta-rail{background:radial-gradient(circle at top,#80f2c12e,#0000 30%),linear-gradient(#0e15120a,#0e151204);border:1px solid #0e151214;border-radius:26px;min-height:100%;padding:18px;position:relative;overflow:hidden}.cta-rail:before{content:"";pointer-events:none;background-image:linear-gradient(#0e15120d 1px,#0000 1px),linear-gradient(90deg,#0e15120d 1px,#0000 1px);background-size:54px 54px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000000e6,#00000073);mask-image:linear-gradient(#000000e6,#00000073)}.cta-cluster,.cta-mini-console{z-index:1;position:relative}.cta-cluster{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:22px;display:grid}.cta-badge{letter-spacing:.03em;text-align:center;min-height:48px;color:var(--text);background:#ffffffb8;border:1px solid #0e15121a;border-radius:999px;justify-content:center;align-items:center;padding:10px 14px;font-size:.78rem;font-weight:700;display:flex}.cta-mini-console{align-content:end;gap:12px;display:grid}.cta-mini-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffc7;border:1px solid #0e151214;border-radius:22px;gap:6px;padding:16px 18px;display:grid}.cta-mini-card span{letter-spacing:.16em;text-transform:uppercase;color:var(--accent-strong);font-size:.74rem;font-weight:700}.cta-mini-card strong{font-size:1.02rem;line-height:1.35}.field-hint{margin:0;font-size:.92rem}.status-banner{border-radius:var(--radius-md);background:#0e151208;border:1px solid #0e151214;padding:18px 20px}.status-success{background:#44d3921f;border-color:#44d39242}.status-warning{background:#c8953524;border-color:#c895353d}.status-error{background:#c950471f;border-color:#c9504738}.status-label{margin:0;font-size:.82rem;font-weight:800}.status-copy{margin:6px 0 0}.signal-panel{gap:18px;display:grid}.signal-meter{background:linear-gradient(#0e15120a,#0e151203);border:1px solid #0e151214;border-radius:26px;grid-template-columns:repeat(26,minmax(0,1fr));align-items:end;gap:8px;min-height:220px;padding:24px;display:grid;position:relative;overflow:hidden}.signal-meter:before{content:"";pointer-events:none;background-image:linear-gradient(0deg,#0e15120f 1px,#0000 1px);background-size:100% 36px;position:absolute;inset:0}.meter-bar{z-index:1;background:linear-gradient(#0e15122e,#0e15120f);border-radius:999px 999px 10px 10px;min-height:14%;transition:height .12s,background .12s,box-shadow .12s;position:relative}.meter-bar.is-live{background:linear-gradient(#c2ffe0,#74ebb9 60%,#14855b);box-shadow:0 0 18px #44d39247}.readout-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.metric-card,.pattern-card,.audio-preview,.snapshot-preview,.event-log{background:#0e151208;padding:18px}.metric-card{gap:6px;display:grid}.metric-card p{margin:0;font-size:.94rem}.level-text{font-family:var(--font-display);font-size:clamp(2rem,3vw,3rem);line-height:1}.video-stage{background:radial-gradient(circle at top,#80f2c12e,#0000 32%),linear-gradient(#132521,#0d1714 85%);border:1px solid #0e151214;border-radius:26px;place-items:center;min-height:340px;display:grid;overflow:hidden}.video-stage video{object-fit:cover;width:100%;min-height:340px}.video-stage video.is-mirrored{transform:scaleX(-1)}.stage-empty{text-align:center;color:#eff8f4c2;max-width:32ch;padding:32px;line-height:1.65}.snapshot-preview img{width:100%;height:auto}.pattern-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pattern-card{gap:12px;display:grid}.choice-chip.is-selected{background:#44d39224;border-color:#44d3923d}.keyboard-board{gap:10px;padding-bottom:6px;display:grid;overflow-x:auto}.keyboard-row{grid-template-columns:repeat(42,minmax(0,1fr));gap:8px;min-width:920px;display:grid}.keycap{text-align:center;background:#ffffffb8;border:1px solid #0e151214;border-radius:16px;place-items:center;min-height:56px;padding:8px;transition:transform .12s,background .12s,border-color .12s,box-shadow .12s;display:grid}.keycap span{font-size:.82rem;font-weight:700}.keycap.is-tested{background:#0e15120f;border-color:#0e151224}.keycap.is-active{background:linear-gradient(#d7ffea,#7bf0bd);border-color:#44d39252;transform:translateY(-1px);box-shadow:0 12px 18px #44d39238}.event-log ul{gap:10px;margin:0;padding:0;list-style:none;display:grid}.event-log li{background:#fff9;border:1px solid #0e151212;border-radius:16px;justify-content:space-between;gap:12px;padding:12px 14px;display:flex}.event-log code{font-family:var(--font-body);font-weight:700}.empty-note{margin:0}@media (max-width:960px){.site-header-inner{flex-wrap:wrap}.site-nav{display:none}.header-actions{margin-left:auto}.hero-grid,.tool-hero,.tool-grid-shell,.split-section,.footer-grid,.cta-panel-grid,.tool-card-grid,.metrics-grid,.pattern-grid,.trust-strip,.readout-grid,.control-grid,.control-grid-wide{grid-template-columns:1fr}}@media (max-width:640px){.site-header-inner{gap:14px;padding:14px 0}.page-shell{width:min(100% - 20px,1180px)}.homepage,.tool-page{padding:32px 0 72px}.panel,.tool-card,.faq-item{border-radius:24px;padding:20px}.display-title{max-width:10ch}.section-heading h2,.panel h2{max-width:12ch}.button-row,.choice-row{flex-direction:column}.header-actions{justify-content:space-between;width:100%}.language-switcher{flex:1;justify-content:space-between}.language-select{width:100%;min-width:0}.cta-rail{min-height:220px}.cta-cluster{grid-template-columns:repeat(2,minmax(0,1fr))}.signal-meter{gap:5px;min-height:180px;padding:16px}.video-stage,.video-stage video{min-height:260px}}
