*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Comic Sans MS,Chalkboard SE,Marker Felt,sans-serif}.home-page{background:linear-gradient(135deg,#ffe5d0 0%,#ffccb3 50%,#ffe5d0 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;position:relative;overflow:hidden}.home-page:before{content:"";background-image:radial-gradient(circle at 20% 30%,#ffc8964d 0%,#0000 50%),radial-gradient(circle at 80% 70%,#ffb4c833 0%,#0000 50%),radial-gradient(circle,#ffdcb433 0%,#0000 50%);width:200%;height:200%;animation:20s ease-in-out infinite float;position:absolute}@keyframes float{0%,to{transform:translate(0)rotate(0)}33%{transform:translate(-5%,5%)rotate(1deg)}66%{transform:translate(5%,-5%)rotate(-1deg)}}.home-container{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);text-align:center;z-index:1;background:#fffffff2;border:2px solid #fff9;border-radius:28px;width:100%;max-width:500px;padding:48px 32px;position:relative;box-shadow:0 8px 32px #ff966426,0 2px 8px #0000000d,inset 0 1px #fffc}.home-title{color:#8b4513;text-shadow:2px 2px #ffc89680;margin-bottom:12px;font-family:Comic Sans MS,Chalkboard SE,Marker Felt,sans-serif;font-size:36px;font-weight:800}.home-subtitle{color:#d4a574;margin-bottom:40px;font-size:18px;font-weight:500}.start-btn{color:#fff;cursor:pointer;letter-spacing:.3px;background:linear-gradient(135deg,#07c160 0%,#06ad56 100%);border:none;border-radius:16px;width:100%;max-width:320px;margin:0 auto;padding:18px 32px;font-size:18px;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);display:block;box-shadow:0 8px 20px #07c16059}.start-btn:hover:not(:disabled){background:linear-gradient(135deg,#06ad56 0%,#059e4f 100%);transform:translateY(-2px);box-shadow:0 12px 28px #07c16066}.start-btn:active{transform:translateY(0)}.start-btn:disabled{cursor:not-allowed;box-shadow:none;opacity:.6;background:linear-gradient(135deg,#e0e0e0 0%,#ccc 100%)}.home-tip{color:#d4a574;margin-top:20px;font-size:14px;font-weight:500}.user-preview{background:linear-gradient(135deg,#fff8f0 0%,#ffe8d6 100%);border:2px solid #ffe5d0;border-radius:16px;justify-content:center;align-items:center;gap:12px;margin-top:24px;padding:16px;display:flex}.user-preview-avatar{object-fit:cover;border:3px solid #ffe5d0;border-radius:50%;width:48px;height:48px;box-shadow:0 2px 8px #ff966433}.user-preview-name{color:#8b4513;font-size:16px;font-weight:700}.form-page{background:linear-gradient(135deg,#ffe5d0 0%,#ffccb3 50%,#ffe5d0 100%);min-height:100vh;padding:20px 15px;position:relative;overflow:hidden}.form-page:before{content:"";background-image:radial-gradient(circle at 20% 30%,#ffc8964d 0%,#0000 50%),radial-gradient(circle at 80% 70%,#ffb4c833 0%,#0000 50%);width:200%;height:200%;animation:20s ease-in-out infinite float;position:absolute}.form-container{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:1;background:#fffffff2;border:2px solid #fff9;border-radius:28px;width:100%;max-width:500px;margin:0 auto;padding:32px 24px;position:relative;box-shadow:0 8px 32px #ff966426,0 2px 8px #0000000d,inset 0 1px #fffc}.form-header{margin-bottom:24px}.user-info{background:linear-gradient(135deg,#fff8f0 0%,#ffe8d6 100%);border:2px solid #ffe5d0;border-radius:16px;align-items:center;gap:12px;padding:12px 16px;display:flex;box-shadow:0 2px 8px #ff96641a,inset 0 1px #fffc}.user-avatar{object-fit:cover;border:3px solid #ffe5d0;border-radius:50%;flex-shrink:0;width:42px;height:42px;box-shadow:0 2px 8px #ff966433}.user-details{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.user-name{color:#8b4513;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:700;overflow:hidden}.user-badge{color:#ff9980;background:#ff99801a;border-radius:8px;width:fit-content;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.form-content{flex-direction:column;gap:20px;display:flex}.checkbox-label{cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#fff8f0 0%,#fff 100%);border:2px solid #ffe5d0;border-radius:14px;align-items:center;padding:16px 18px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:inset 0 1px 3px #0000000d}.checkbox-label:hover{border-color:#ffccb3;box-shadow:0 2px 8px #ff96641a}.checkbox-input{opacity:0;cursor:pointer;position:absolute}.checkbox-custom{background:#ffe5d0;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;margin-right:12px;font-size:18px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.checkbox-input:checked+.checkbox-custom{background:linear-gradient(135deg,#ff9980 0%,#ff8066 100%);transform:scale(1.1);box-shadow:0 2px 8px #ff80664d}.checkbox-text{color:#8b4513;letter-spacing:.3px;font-size:15px;font-weight:600}.form-label{color:#8b4513;align-items:center;gap:8px;margin-bottom:10px;font-size:14px;font-weight:700;display:flex}.textarea-group{flex-direction:column;margin-bottom:20px;display:flex}.form-textarea{color:#5d4037;resize:none;background:linear-gradient(135deg,#fff8f0 0%,#fff 100%);border:2px solid #ffe5d0;border-radius:14px;width:100%;min-height:80px;padding:14px 18px;font-family:Comic Sans MS,Chalkboard SE,Marker Felt,sans-serif;font-size:16px;line-height:1.5;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 1px 3px #0000000d}.form-textarea:focus{background:#fff;border-color:#ff9980;outline:none;box-shadow:0 0 0 4px #ff99801a,inset 0 1px 3px #0000000d}.form-textarea::placeholder{color:#d4a574;font-weight:400}.char-count{text-align:right;color:#d4a574;margin-top:8px;font-size:12px;font-weight:500}.char-count #charCount{color:#ff9980;font-weight:700}.color-selector{margin-bottom:20px}.color-options{background:linear-gradient(135deg,#fff8f0 0%,#fff 100%);border:2px solid #ffe5d0;border-radius:16px;grid-template-columns:repeat(5,1fr);gap:12px;padding:16px;display:grid;box-shadow:inset 0 2px 8px #00000008}.color-option{aspect-ratio:1;cursor:pointer;border:3px solid #0000;border-radius:12px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 2px 8px #0000001a,inset 0 1px #ffffff4d}.color-option:hover{transform:scale(1.1);box-shadow:0 4px 12px #00000026,inset 0 1px #ffffff80}.color-option.selected{border-color:#fff;transform:scale(1.1);box-shadow:0 0 0 3px #ff9980,0 4px 16px #ff806666}.color-option.selected:after{content:"✓";color:#fff;text-shadow:0 1px 2px #0000004d;font-size:20px;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.submit-btn{color:#fff;cursor:pointer;letter-spacing:.3px;background:linear-gradient(135deg,#ff9980 0%,#ff8066 100%);border:none;border-radius:16px;justify-content:center;align-items:center;gap:8px;width:100%;padding:16px 24px;font-family:Comic Sans MS,Chalkboard SE,Marker Felt,sans-serif;font-size:18px;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 6px 20px #ff806659}.submit-btn:hover:not(:disabled){background:linear-gradient(135deg,#ff8066 0%,#ff664d 100%);transform:translateY(-2px);box-shadow:0 8px 24px #ff664d66}.submit-btn:active:not(:disabled){transform:translateY(0)}.submit-btn:disabled{cursor:not-allowed;box-shadow:none;opacity:.6;background:linear-gradient(135deg,#e0e0e0 0%,#ccc 100%)}.success-page{background:linear-gradient(135deg,#ffe5d0 0%,#ffccb3 50%,#ffe5d0 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;animation:.4s ease-out fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.success-container{text-align:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border:2px solid #fff9;border-radius:28px;width:100%;max-width:400px;padding:48px 32px;animation:.5s cubic-bezier(.34,1.56,.64,1) slideUp;box-shadow:0 8px 32px #ff966426,0 2px 8px #0000000d,inset 0 1px #fffc}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.success-icon{color:#fff;background:linear-gradient(135deg,#ff9980 0%,#ff8066 100%);border-radius:50%;justify-content:center;align-items:center;width:100px;height:100px;margin:0 auto 32px;font-size:48px;font-weight:700;animation:.6s cubic-bezier(.34,1.56,.64,1) scaleIn;display:flex;box-shadow:0 8px 32px #ff806666}@keyframes scaleIn{0%{transform:scale(0)}50%{transform:scale(1.1)}to{transform:scale(1)}}.success-title{color:#8b4513;text-shadow:2px 2px #ffc89680;margin:0 0 16px;font-family:Comic Sans MS,Chalkboard SE,Marker Felt,sans-serif;font-size:32px;font-weight:800}.success-description{color:#8b4513;margin:0 0 48px;font-size:18px;font-weight:500}.success-actions{flex-direction:column;gap:16px;display:flex}.success-btn{cursor:pointer;letter-spacing:.3px;border:none;border-radius:16px;justify-content:center;align-items:center;gap:10px;width:100%;padding:18px 28px;font-size:18px;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.success-btn.primary{color:#fff;background:linear-gradient(135deg,#ff9980 0%,#ff8066 100%);box-shadow:0 8px 24px #ff806666}.success-btn.primary:hover{background:linear-gradient(135deg,#ff8066 0%,#ff664d 100%);transform:translateY(-2px);box-shadow:0 12px 32px #ff664d80}.success-btn.secondary{color:#8b4513;background:#fffc;border:2px solid #ffe5d0;box-shadow:0 4px 16px #ff966426}.success-btn.secondary:hover{background:#fffffff2;border-color:#ffccb3;transform:translateY(-2px);box-shadow:0 6px 20px #ff966440}@media (max-width:480px){.home-page,.form-page,.success-page{padding:15px 10px}.home-container,.form-container,.success-container{padding:32px 20px}.home-title{font-size:28px}.form-textarea{font-size:16px}}