@import"https://fonts.googleapis.com/css2?family=Exo+2:wght@400;600;700;800&family=Russo+One&display=swap";:root{--alph-bg-1: #041326;--alph-bg-2: #062b3f;--alph-bg-3: #154d54;--alph-panel: rgba(6, 21, 38, .74);--alph-panel-strong: rgba(7, 21, 37, .86);--alph-border: rgba(141, 215, 225, .3);--alph-ink: #f1fbff;--alph-muted: #b9dce5;--alph-accent-a: #ffaf47;--alph-accent-b: #49d9c8;--alph-left: #5ec8ff;--alph-right: #fd8370;--alph-both: #7cf1a4;--alph-shadow: 0 22px 52px rgba(0, 10, 22, .48)}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--alph-ink);font-family:"Exo 2",Segoe UI,sans-serif;background:radial-gradient(105% 90% at 7% 5%,rgba(255,176,80,.2),transparent 52%),radial-gradient(96% 88% at 92% 8%,rgba(74,217,200,.2),transparent 56%),linear-gradient(160deg,var(--alph-bg-1),var(--alph-bg-2) 54%,var(--alph-bg-3))}.alph{width:min(100%,1180px);margin:0 auto;padding:clamp(12px,2.2vw,28px);display:grid;gap:14px}.alph__hero,.alph__workspace,.alph__seo{border-radius:24px;border:1px solid var(--alph-border);background:linear-gradient(148deg,#071424db,#0a1c2db8);box-shadow:var(--alph-shadow)}.alph__hero{padding:clamp(14px,2.7vw,24px)}.alph__eyebrow{margin:0;color:#9edaf3;font-size:.74rem;letter-spacing:.17em;text-transform:uppercase}.alph__hero h1{margin:9px 0 0;font-family:Russo One,"Exo 2",sans-serif;font-size:clamp(1.8rem,5.5vw,3rem);letter-spacing:.02em}.alph__lead{margin:12px 0 0;max-width:72ch;color:var(--alph-muted);line-height:1.48}.alph__workspace{padding:clamp(12px,2.3vw,20px);display:grid;grid-template-columns:minmax(280px,.95fr) minmax(340px,1.25fr);gap:12px;align-items:start}.alph__panel,.alph__stage{border-radius:18px;border:1px solid rgba(141,214,226,.25);background:linear-gradient(145deg,#081626db,#0c2131ab);padding:clamp(11px,1.8vw,16px)}.alph__panel{display:grid;gap:10px}.alph__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.alph__stats div{border-radius:12px;border:1px solid rgba(143,214,224,.24);background:#06132394;padding:8px 10px;display:grid;gap:2px}.alph__stats span{color:#b9dae7;font-size:.79rem;text-transform:uppercase;letter-spacing:.08em}.alph__stats strong{font-size:clamp(1.1rem,2.4vw,1.35rem);font-weight:800}.alph__tempo{display:grid;gap:6px}.alph__tempo span{font-size:.85rem;color:#c6e8f0;text-transform:uppercase;letter-spacing:.08em}.alph__tempo input[type=range]{width:100%;accent-color:var(--alph-accent-b)}.alph__tempo strong{color:#d8f6ff}.alph__mode{display:grid;gap:6px}.alph__mode-note{margin:0;color:#c6dfeb;font-size:.84rem;line-height:1.4}.alph__actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.alph__btn{border:0;border-radius:12px;min-height:42px;padding:9px 12px;font-family:"Exo 2",Segoe UI,sans-serif;font-weight:800;font-size:.9rem;cursor:pointer;transition:transform .14s ease,filter .14s ease}.alph__btn:not(:disabled):hover{filter:brightness(1.07)}.alph__btn:not(:disabled):active{transform:translateY(1px)}.alph__btn--primary{color:#1e2934;background:linear-gradient(135deg,var(--alph-accent-a),#ffd278);box-shadow:0 12px 24px #ffab3c52}.alph__btn--soft{color:#e9f8ff;border:1px solid rgba(140,214,227,.3);background:linear-gradient(145deg,#2e5b7c9e,#2e687c80)}.alph__btn--ghost{color:#e7f8ff;border:1px solid rgba(138,212,227,.34);background:#081526d1}.alph__status{margin:0;min-height:1.35em;font-weight:700;color:#ddf5ff}.alph__hint{margin:0;color:#c1e2edf0;line-height:1.4;font-size:.9rem}kbd{border:1px solid rgba(150,214,228,.35);border-radius:6px;background:#061222db;padding:1px 5px;font-family:"Exo 2",Segoe UI,sans-serif;font-size:.8rem}.alph__touch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.alph__touch[hidden]{display:none}.alph__touch-btn{border:0;border-radius:12px;min-height:42px;font:inherit;font-weight:800;color:#052233;cursor:pointer}.alph__touch-btn:active{transform:translateY(1px)}.alph__touch-btn--left{background:linear-gradient(135deg,#5ec8ff,#a5ecff)}.alph__touch-btn--both{background:linear-gradient(135deg,#7cf1a4,#b9ffd0)}.alph__touch-btn--right{background:linear-gradient(135deg,#fd8370,#ffc0a4)}.alph__stage{display:grid;gap:10px}.alph__canvas-shell{position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(139,214,225,.38);background:linear-gradient(160deg,#04162c,#0c2d45 56%,#14535e);min-height:300px}#alph-canvas{width:100%;aspect-ratio:3 / 2;display:block;touch-action:none}.alph__overlay{position:absolute;inset:0;display:grid;place-items:center;background:#04101e9e;backdrop-filter:blur(2px);transition:opacity .18s ease}.alph__overlay.is-hidden{opacity:0;pointer-events:none}.alph__overlay-card{width:min(92%,460px);border-radius:16px;border:1px solid rgba(145,214,225,.34);background:linear-gradient(140deg,var(--alph-panel-strong),var(--alph-panel));padding:14px;text-align:center;display:grid;gap:8px}.alph__overlay-card h2{margin:0;font-family:Russo One,"Exo 2",sans-serif;font-size:clamp(1.2rem,4vw,1.6rem);letter-spacing:.02em}.alph__overlay-card p{margin:0;color:#c9e8f2;line-height:1.44}.alph__legend{border-radius:14px;border:1px solid rgba(141,214,226,.25);background:#0514248f;padding:10px 12px}.alph__legend h2{margin:0;font-size:1rem}.alph__legend ul{margin:9px 0 0;padding-left:18px;color:#d6edf7;line-height:1.45}.alph__seo{padding:clamp(12px,2vw,18px)}.alph__seo h2{margin:0;font-size:clamp(1.2rem,2.6vw,1.5rem)}.alph__seo p{margin:8px 0 0;color:#c6dfeb;line-height:1.5}@media(max-width:980px){.alph__workspace,.alph__actions{grid-template-columns:1fr}.alph__touch{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:560px){.alph__stats{grid-template-columns:1fr 1fr}.alph__touch{grid-template-columns:1fr}.alph__touch-btn{min-height:48px}}