:root{--bg:#f7f5f2;--surface:#fff;--surface-2:#f0ede8;--border:#e5e0d8;--border-2:#d0c9be;--primary:#1a4d3a;--primary-mid:#2a6b52;--primary-dim:#1a4d3a1a;--amber:#c8a96e;--amber-dim:#c8a96e26;--text:#1c1a18;--text-2:#4a4540;--text-3:#8a8480;--red:#c0392b;--red-dim:#c0392b1a;--font-display:"DM Serif Display", Georgia, serif;--font-ui:"Inter", system-ui, -apple-system, sans-serif;--r-sm:6px;--r-md:10px;--r-lg:16px;--r-pill:999px;--shadow-card:0 1px 3px #1c1a180f, 0 4px 16px #1c1a180d;--shadow-float:0 8px 32px #1c1a1824}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-ui);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;cursor:none;min-height:100vh}button{font-family:var(--font-ui);cursor:pointer}input,select{font-family:var(--font-ui)}canvas{display:block}.main-grid{grid-template-columns:minmax(0,2fr) minmax(0,.9fr);align-items:start;gap:24px;width:100%;max-width:1280px;margin:0 auto;display:grid}@media (width<=960px){.main-grid{grid-template-columns:1fr}}@media (width<=600px){.session-stats{display:none}}.camera-container{border-radius:var(--r-lg);width:100%;height:calc(100vh - 160px);min-height:380px;max-height:640px;box-shadow:var(--shadow-card);background:#1c1a18;border:2px solid #0000;transition:border-color .3s;position:relative;overflow:hidden}.camera-container.hand-active{border-color:var(--primary);box-shadow:0 0 0 1px #1a4d3a26, var(--shadow-card)}.card{background:var(--surface);border-radius:var(--r-lg);border:1px solid var(--border);box-shadow:var(--shadow-card)}.sign-hero{font-family:var(--font-display);color:var(--primary);letter-spacing:-.02em;align-items:flex-end;min-height:92px;font-size:88px;font-style:italic;line-height:1;display:flex}.sign-hero.animating{animation:.18s ease-out fadeUp}.msg-bubble{background:var(--primary-dim);color:var(--primary);border-radius:var(--r-pill);margin:3px;padding:4px 12px;font-size:13px;font-weight:500;animation:.15s ease-out fadeUp;display:inline-block}.gesture-flash{z-index:999;background:var(--primary);justify-content:center;align-items:center;gap:16px;padding:14px 32px;animation:.18s ease-out slideDown;display:flex;position:fixed;top:0;left:0;right:0}.cursor-dot{background:var(--primary);pointer-events:none;z-index:9999;border-radius:50%;width:8px;height:8px;position:fixed;transform:translate(-50%,-50%)}.cursor-ring{border:1.5px solid var(--primary);pointer-events:none;z-index:9998;opacity:.45;border-radius:50%;width:28px;height:28px;position:fixed;transform:translate(-50%,-50%)}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-3)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}@keyframes scaleIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes fadeUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes handIn{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulseRing{0%{r:36px;opacity:.4}to{r:48px;opacity:0}}@keyframes signPop{0%{opacity:0;transform:scale(.85)}60%{opacity:1;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.skeleton{border-radius:var(--r-md);background:linear-gradient(90deg,#1a4d3a0a 25%,#1a4d3a1a 50%,#1a4d3a0a 75%) 0 0/400px 100%;animation:1.4s infinite shimmer}.shimmer{background:linear-gradient(90deg,#1a4d3a0a 25%,#1a4d3a17 50%,#1a4d3a0a 75%) 0 0/400px 100%;animation:1.4s infinite shimmer}.word-cursor:after{content:"|";animation:1s step-end infinite blink}