:root{--coral: #f25c69;--rose: #f25c78;--pink: #f2b3d1;--yellow: #f0f2a2;--peach: #f2d3ac;--ink: #5a2a3a;--card-bg: #fffaf6;--radius: 28px;--shadow: 0 18px 40px rgba(180, 70, 95, .22);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Quicksand,Nunito,system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:linear-gradient(160deg,var(--pink) 0%,var(--peach) 45%,var(--yellow) 100%);background-attachment:fixed;color:var(--ink);overflow:hidden}.app{height:100dvh;display:flex;flex-direction:column;align-items:center;padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));max-width:520px;margin:0 auto}.weather{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:10;display:flex;align-items:center;gap:6px;padding:7px 13px 7px 11px;background:#ffffff8c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;box-shadow:0 6px 16px #b4465f2e;color:var(--ink);font-weight:700;animation:card-in .5s cubic-bezier(.22,.61,.36,1)}.weather__icon{font-size:1.15rem;line-height:1}.weather__temp{font-size:.95rem;letter-spacing:-.01em}.app__header{text-align:center;padding:8px 0 4px;flex-shrink:0}.app__title{margin:0;font-size:2rem;font-weight:800;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 10px rgba(180,70,95,.3)}.app__subtitle{margin:4px 0 0;font-size:.95rem;color:#5a2a3ab3}.deck{flex:1;width:100%;display:grid;place-items:center;min-height:0}.card{grid-area:1 / 1;width:min(86vw,420px);aspect-ratio:3 / 4;max-height:70vh;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);border-top:12px solid var(--accent, var(--coral));padding:40px 30px;display:flex;flex-direction:column;justify-content:center;text-align:center;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;transition:transform .4s cubic-bezier(.22,.61,.36,1),opacity .4s ease;animation:card-in .4s cubic-bezier(.22,.61,.36,1)}.card--dragging{transition:none;cursor:grabbing}.card--flying{cursor:grabbing}@keyframes card-in{0%{transform:translateY(24px) scale(.94);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.card__label{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent, var(--coral));margin-bottom:18px}.card__question{font-size:clamp(1.4rem,5.5vw,1.9rem);font-weight:700;line-height:1.3;margin:0;color:var(--ink)}.card__hint{margin-top:26px;font-size:.8rem;color:#5a2a3a73}.card--back{pointer-events:none;animation:none;box-shadow:0 10px 26px #b4465f26}.card--back-1{transform:translateY(14px) scale(.96);border-top-color:var(--peach);opacity:.9}.card--back-2{transform:translateY(28px) scale(.92);border-top-color:var(--pink);opacity:.7}.app__footer{flex-shrink:0;padding-top:16px}.next-btn{border:none;background:#fff;color:var(--coral);font-size:1.05rem;font-weight:700;padding:14px 32px;border-radius:999px;box-shadow:0 8px 20px #b4465f38;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.next-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px #b4465f47}.next-btn:active{transform:translateY(0) scale(.97)}