:root{--purple-deep: #4B2E96;--purple: #5B3FD9;--purple-light: #7B5CFA;--coral: #FF6B6B;--teal: #2FD8C9;--yellow: #FFD93D;--cream: #FFF8ED;--ink: #2A2140;--card-shadow: 0 12px 0 rgba(42, 33, 64, .15), 0 20px 30px rgba(42, 33, 64, .25);--font-display: "Baloo 2", system-ui, sans-serif;--font-body: "Nunito", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-body);color:var(--ink);background:radial-gradient(circle at 15% 20%,rgba(255,255,255,.06),transparent 40%),radial-gradient(circle at 85% 80%,rgba(255,255,255,.05),transparent 40%),linear-gradient(160deg,var(--purple-deep) 0%,var(--purple) 55%,var(--purple-light) 100%);min-height:100vh}.app-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;overflow:hidden}.chain-bg-motif{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.12;background-image:repeating-linear-gradient(45deg,transparent 0 40px,rgba(255,255,255,.5) 40px 42px);-webkit-mask-image:radial-gradient(circle at center,black,transparent 75%);mask-image:radial-gradient(circle at center,black,transparent 75%)}.logo{font-family:var(--font-display);font-weight:800;font-size:3rem;line-height:.95;text-align:center;color:#fff;text-shadow:0 4px 0 rgba(42,33,64,.35);letter-spacing:.5px}.logo .accent-coral{color:var(--coral)}.logo .accent-teal{color:var(--teal)}.logo-sub{text-align:center;color:#ffffffd9;font-weight:700;margin-top:4px;font-size:.95rem;letter-spacing:.5px}.card{background:var(--cream);border-radius:28px;box-shadow:var(--card-shadow);padding:32px}.panel-row{display:flex;gap:20px;align-items:stretch;flex-wrap:wrap;justify-content:center}.btn{font-family:var(--font-display);font-weight:700;font-size:1.05rem;border:none;border-radius:16px;padding:14px 24px;cursor:pointer;transition:transform .08s ease,box-shadow .08s ease;box-shadow:0 6px #00000026}.btn:active{transform:translateY(4px);box-shadow:0 2px #00000026}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--coral);color:#fff}.btn-secondary{background:var(--teal);color:#fff}.btn-ghost{background:#fff;color:var(--ink);border:2px solid #e7e1f5}.btn-yellow{background:var(--yellow);color:var(--ink)}.btn.full{width:100%}input[type=text]{font-family:var(--font-body);font-weight:700;font-size:1.1rem;padding:14px 16px;border-radius:14px;border:2px solid #e7e1f5;outline:none;width:100%}input[type=text]:focus{border-color:var(--purple-light)}.home-wrap{width:100%;max-width:460px}.tab-row{display:flex;gap:8px;margin-bottom:20px}.tab-btn{flex:1;font-family:var(--font-display);font-weight:700;padding:10px;border-radius:12px;border:2px solid #e7e1f5;background:#fff;cursor:pointer;color:var(--ink);opacity:.6}.tab-btn.active{opacity:1;border-color:var(--purple-light);background:#f2effc}.field-label{font-weight:800;font-size:.85rem;text-transform:uppercase;letter-spacing:.6px;color:#8a80a8;margin-bottom:6px;display:block}.error-text{color:var(--coral);font-weight:700;margin-top:8px}.lobby-wrap{display:flex;gap:24px;width:100%;max-width:1100px;flex-wrap:wrap;align-items:flex-start}.lobby-side{flex:0 0 300px}.lobby-main{flex:1;min-width:340px}.room-code-box{background:#fff;border-radius:18px;padding:16px 20px;text-align:center;margin-bottom:16px}.room-code-box .label{font-size:.8rem;font-weight:800;color:#8a80a8;letter-spacing:1px}.room-code-box .code{font-family:var(--font-display);font-size:2.1rem;font-weight:800;color:var(--purple);letter-spacing:4px}.circle-lobby{position:relative;width:100%;aspect-ratio:1 / 1;max-width:460px;margin:0 auto}.player-chip{position:absolute;width:92px;transform:translate(-50%,-50%);text-align:center}.avatar{width:68px;height:68px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:1.4rem;color:#fff;margin:0 auto 6px;border:3px solid white;box-shadow:0 4px #2a214033}.avatar.small{width:40px;height:40px;font-size:.9rem}.player-name{font-weight:800;font-size:.9rem}.host-crown{font-size:.9rem}.center-info{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;font-weight:800;color:var(--purple)}.center-info .big{font-size:1.4rem;font-family:var(--font-display)}.center-info .small{font-size:.85rem;color:#8a80a8}.play-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px}.pill{background:#fff;border-radius:999px;padding:8px 16px;font-weight:800;font-size:.85rem;color:var(--purple)}.progress-track{height:10px;background:#e7e1f5;border-radius:999px;overflow:hidden;margin-top:8px}.progress-fill{height:100%;background:var(--teal);transition:width .3s ease}.prev-drawing-frame{border:3px solid #e7e1f5;border-radius:18px;padding:8px;background:#fff;text-align:center;margin-bottom:18px}.prev-drawing-frame img{max-width:100%;border-radius:10px;display:block;margin:0 auto}.prev-phrase-box{background:#f2effc;border-radius:18px;padding:20px;text-align:center;font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--ink);margin-bottom:18px}canvas.draw-canvas{width:100%;aspect-ratio:4 / 3;background:#fff;border-radius:18px;border:3px solid #e7e1f5;touch-action:none;cursor:crosshair}.tool-row{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;align-items:center}.color-dot{width:28px;height:28px;border-radius:50%;border:3px solid transparent;cursor:pointer}.color-dot.active{border-color:var(--ink)}.waiting-overlay{text-align:center;padding:40px 20px;color:#fff}.waiting-overlay .big{font-family:var(--font-display);font-size:1.6rem;font-weight:800}.reveal-strip{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px}.reveal-card{flex:0 0 220px;background:#fff;border-radius:16px;padding:12px;box-shadow:0 6px #2a214014}.reveal-card .tag{font-size:.7rem;font-weight:800;color:var(--purple);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}.reveal-card img{width:100%;border-radius:10px;display:block}.reveal-card .text-content{font-family:var(--font-display);font-weight:700;font-size:1.05rem}.reveal-vs{display:flex;gap:14px;margin-top:20px;flex-wrap:wrap}.vs-box{flex:1;min-width:200px;border-radius:16px;padding:18px;font-weight:800}.vs-box.original{background:#ffe3e3;color:#b83b3b}.vs-box.final{background:#e6e0ff;color:var(--purple)}.vs-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.5px;opacity:.7;margin-bottom:4px}.footer-features{display:flex;gap:14px;margin-top:24px;flex-wrap:wrap;justify-content:center}.feature-pill{background:#ffffff1f;color:#fff;border-radius:14px;padding:12px 16px;font-size:.85rem;max-width:220px}.feature-pill b{display:block;font-family:var(--font-display);margin-bottom:2px}.mascot-note{display:flex;align-items:center;gap:10px;margin-top:16px;color:#fff;font-weight:700;font-size:.9rem}.pencil-emoji{font-size:1.8rem}@media (max-width: 640px){.logo{font-size:2.1rem}.card{padding:20px;border-radius:20px}.dev-footer{flex-direction:column;gap:6px;text-align:center}}.developer-card{margin-top:24px;background:#ffffff29;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;max-width:520px;color:#fff;box-shadow:0 8px 24px #0000001f}.dev-info{display:flex;align-items:center;gap:12px}.dev-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--coral),var(--yellow));color:var(--ink);font-family:var(--font-display);font-weight:800;font-size:1.1rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0003}.dev-title{font-size:.72rem;text-transform:uppercase;letter-spacing:1px;color:var(--teal);font-weight:800}.dev-name{font-family:var(--font-display);font-weight:800;font-size:1.1rem;letter-spacing:.5px}.dev-linkedin-btn{display:inline-flex;align-items:center;gap:6px;background:#0a66c2;color:#fff;text-decoration:none;font-family:var(--font-display);font-weight:700;font-size:.85rem;padding:8px 16px;border-radius:12px;transition:transform .15s ease,background .15s ease;box-shadow:0 4px 12px #0a66c24d}.dev-linkedin-btn:hover{background:#004182;transform:translateY(-2px)}.dev-avatar-img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:2px solid var(--teal);box-shadow:0 4px 12px #00000040}.dev-footer-img{width:24px;height:24px;border-radius:50%;object-fit:cover;border:1px solid var(--teal)}.dev-footer{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;font-size:.82rem;color:#fffc;white-space:nowrap;z-index:10}.dev-footer strong{color:#fff}.dev-linkedin-link{display:inline-flex;align-items:center;color:var(--teal);text-decoration:none;font-weight:700;transition:opacity .15s ease}.dev-linkedin-link:hover{opacity:.85;text-decoration:underline}.page-fade-enter{animation:fadeInScale .28s cubic-bezier(.16,1,.3,1) forwards}@keyframes fadeInScale{0%{opacity:0;transform:scale(.97) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.timer-badge{font-weight:800;transition:background .3s ease,color .3s ease,transform .3s ease}.timer-badge.warning{background:var(--coral)!important;color:#fff!important;animation:timerPulse .6s infinite alternate ease-in-out}@keyframes timerPulse{0%{transform:scale(1)}to{transform:scale(1.08)}}.progress-fill.timer-warning{background:var(--coral)!important}.settings-panel{background:#ffffff24;border-radius:16px;padding:12px 16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.select-input{width:100%;padding:10px 14px;border-radius:12px;border:2px solid rgba(255,255,255,.3);background:#fff;font-family:var(--font-display);font-weight:700;font-size:.95rem;color:var(--ink);cursor:pointer;outline:none}.settings-value-pill{background:#fff;color:var(--ink);font-family:var(--font-display);font-weight:800;padding:8px 14px;border-radius:12px;text-align:center;font-size:.9rem}.prompt-suggestion-row{margin-top:8px;margin-bottom:6px}.btn-link-prompt{background:none;border:none;color:var(--purple-light);font-family:var(--font-body);font-weight:700;font-size:.85rem;cursor:pointer;padding:0;text-decoration:underline;transition:color .15s ease}.btn-link-prompt:hover{color:var(--purple-deep)}.canvas-wrapper{display:flex;flex-direction:column;gap:10px}.color-palette{display:flex;gap:8px;align-items:center}.canvas-btn-group{display:flex;gap:6px;margin-left:auto}.size-slider{accent-color:var(--purple);width:70px;cursor:pointer}@media (max-width: 600px){.app-shell{padding:12px}.card{padding:20px;border-radius:20px}.logo{font-size:2.2rem}.logo-sub{font-size:.85rem}.draw-canvas{height:240px}.tool-row{flex-direction:column;align-items:stretch;gap:12px}.canvas-btn-group{margin-left:0;width:100%}.canvas-btn-group button{flex:1}.color-palette{justify-content:center}.size-slider{width:100%}input[type=text],input[type=password],select{font-size:16px!important}}