@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--font-main:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;--font-heading:"Outfit", sans-serif;--bg-deep:#0a1912;--bg-meadow:#15382a;--bg-meadow-accent:#1e4d3b;--color-primary:#10b981;--color-primary-light:#34d399;--color-primary-glow:#10b98166;--color-accent-pink:#ff4d6d;--color-accent-gold:#fbbf24;--glass-bg-dark:#0a1912bf;--glass-bg-card:#ffffffe0;--glass-bg-card-dark:#0f2118d1;--glass-border:#ffffff2e;--glass-border-light:#fff9;--glass-border-glow:#34d39966;--text-dark:#0f172a;--text-muted:#64748b;--text-light:#f8fafc;--radius-sm:10px;--radius-md:18px;--radius-lg:28px;--radius-full:9999px;--shadow-subtle:0 10px 30px #0003;--shadow-glass:0 20px 50px #00000059, inset 0 1px 1px #ffffff40;--shadow-neon:0 0 30px #10b98173}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body,#root{width:100%;height:100%;font-family:var(--font-main);background-color:var(--bg-deep);color:var(--text-light);-webkit-user-select:none;user-select:none;overflow:hidden}.glass-panel{background:var(--glass-bg-dark);-webkit-backdrop-filter:blur(24px)saturate(180%);border:1px solid var(--glass-border);box-shadow:var(--shadow-glass);transition:border-color .3s,box-shadow .3s}.glass-panel:hover{border-color:var(--glass-border-glow)}.glass-card-light{-webkit-backdrop-filter:blur(28px)saturate(190%);color:var(--text-dark);background:#ffffffeb;border:1px solid #fffc;box-shadow:0 25px 60px #0000004d,inset 0 1px 2px #fff}.text-gradient{background:linear-gradient(135deg,#a7f3d0 0%,#34d399 50%,#10b981 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.btn-fab{color:#fff;border-radius:var(--radius-full);font-family:var(--font-heading);letter-spacing:.5px;cursor:pointer;box-shadow:0 12px 35px #10b98166, var(--shadow-glass);background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:1px solid #ffffff59;align-items:center;gap:12px;padding:16px 32px;font-size:1.1rem;font-weight:700;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden}.btn-fab:after{content:"";opacity:0;background:radial-gradient(circle,#ffffff4d 0%,#0000 60%);width:200%;height:200%;transition:opacity .3s;position:absolute;top:-50%;left:-50%}.btn-fab:hover{box-shadow:0 18px 45px #10b9818c, var(--shadow-neon);transform:translateY(-4px)scale(1.04)}.btn-fab:hover:after{opacity:1}.btn-fab:active{transform:translateY(0)scale(.97)}.btn-icon{border-radius:var(--radius-full);width:48px;height:48px;color:var(--text-light);border:1px solid var(--glass-border);cursor:pointer;background:#ffffff1f;justify-content:center;align-items:center;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex}.btn-icon:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.08)}.btn-primary{color:#fff;border-radius:var(--radius-md);font-family:var(--font-heading);cursor:pointer;background:linear-gradient(135deg,#10b981,#059669);border:1px solid #fff3;justify-content:center;align-items:center;gap:10px;padding:14px 24px;font-size:.98rem;font-weight:700;transition:all .25s;display:inline-flex;box-shadow:0 8px 20px #10b9814d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px #10b98173}.btn-secondary{color:var(--text-dark);border-radius:var(--radius-md);cursor:pointer;background:#0000000d;border:1px solid #0000001a;padding:12px 20px;font-weight:600;transition:all .2s}.btn-secondary:hover{background:#0000001a;transform:translateY(-1px)}.form-group{flex-direction:column;gap:8px;margin-bottom:18px;display:flex}.form-label{color:#1e293b;align-items:center;gap:8px;font-size:.9rem;font-weight:700;display:flex}.form-input,.form-textarea{border-radius:var(--radius-md);width:100%;font-family:var(--font-main);color:var(--text-dark);background:#f8fafccc;border:1px solid #cbd5e1;outline:none;padding:14px 16px;font-size:.98rem;transition:all .25s}.form-input:focus,.form-textarea:focus{border-color:var(--color-primary);background:#fff;box-shadow:0 0 0 4px #10b9812e}.drawing-canvas-wrapper{aspect-ratio:1;border-radius:var(--radius-lg);touch-action:none;background:linear-gradient(#d8f3dc 0%,#b7e4c7 100%);border:2px dashed #52b788;width:100%;max-width:320px;margin:0 auto;position:relative;overflow:hidden;box-shadow:inset 0 4px 12px #00000014}.drawing-canvas{touch-action:none;cursor:crosshair;width:100%;height:100%}.color-picker-grid{flex-wrap:wrap;justify-content:center;gap:10px;margin:14px 0;display:flex}.color-swatch{border-radius:var(--radius-full);cursor:pointer;border:2px solid #fff;width:32px;height:32px;transition:transform .2s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 8px #00000026}.color-swatch.active{box-shadow:0 0 0 3px var(--color-primary), 0 6px 12px #0003;transform:scale(1.28)}.password-box{color:#78350f;border-radius:var(--radius-md);letter-spacing:5px;text-align:center;background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px dashed #f59e0b;margin:12px 0;padding:14px;font-family:monospace;font-size:1.5rem;font-weight:900;box-shadow:inset 0 2px 4px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}@keyframes floatGentle{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.animate-fade-in{animation:.3s cubic-bezier(.16,1,.3,1) forwards fadeIn}.animate-slide-up{animation:.35s cubic-bezier(.16,1,.3,1) forwards slideUp}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0000000d}::-webkit-scrollbar-thumb{background:#ffffff59;border-radius:4px}@media (width>=560px){.header-top{flex-direction:row!important;align-items:center!important;gap:16px!important;padding:10px 22px!important}.header-row{flex:1;align-items:center;gap:12px;display:flex}.header-counter-row{flex-shrink:0;justify-content:flex-end;display:flex!important}}@media (width<=559px){.header-top{flex-direction:column!important;gap:6px!important;padding:10px 16px!important}.header-row{align-items:center;gap:10px;width:100%;display:flex}.header-counter-row{justify-content:center;width:100%;display:flex}}
