:root{color:#332c28;background:#f8f2e9;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,SF Pro Text,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--purple: #7d669a;--purple-deep: #5f4d78;--gold: #b79b58;--gold-soft: rgba(183, 155, 88, .22);--ink: #332c28;--muted: #7f766d;--paper: rgba(255, 252, 247, .74);--shadow: 0 26px 80px rgba(102, 79, 54, .18)}*{box-sizing:border-box}html{min-height:100%;background:radial-gradient(circle at 50% 0%,rgba(255,216,158,.3),transparent 34rem),linear-gradient(145deg,#fffaf3,#f7eee6 46%,#f2ecf6)}body{margin:0;min-width:320px;min-height:100vh}button{border:0;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:wait}.app-shell{position:relative;display:flex;flex-direction:column;align-items:center;min-height:100vh;overflow:hidden;padding:max(22px,env(safe-area-inset-top)) 18px max(20px,env(safe-area-inset-bottom))}.app-shell:before,.app-shell:after{position:fixed;z-index:-1;width:42vw;height:42vw;max-width:520px;max-height:520px;content:"";filter:blur(70px);opacity:.36;pointer-events:none}.app-shell:before{top:-12vw;right:-12vw;background:#ffa65e57}.app-shell:after{bottom:-18vw;left:-18vw;background:#7e669a57}.home-screen{display:flex;width:min(100%,620px);flex:1;flex-direction:column;align-items:center;justify-content:center;margin:0 auto;text-align:center}.brand-row{display:inline-flex;align-items:center;gap:10px;min-height:36px;color:var(--purple-deep)}.brand-mark{display:grid;width:32px;height:32px;place-items:center;border-radius:11px;color:#fff;font-weight:800;background:linear-gradient(135deg,#ffb24c,#ef4f6f 54%,#755eb5);box-shadow:0 10px 26px #7d669a3d}.brand-name{font-size:1.18rem;font-weight:700;letter-spacing:0}.home-logo{display:block;width:min(58vw,248px);aspect-ratio:1;margin:0 auto 18px;border-radius:30px;object-fit:cover;box-shadow:0 20px 60px #684f7d2e}.draw-logo{display:block;width:118px;height:42px;border-radius:12px;object-fit:cover;object-position:center;box-shadow:0 10px 28px #684f7d1f}.eyebrow{margin:20px 0 10px;color:var(--gold);font-size:.82rem;font-weight:700}h1{max-width:8.5em;margin:0 auto;color:#2f2925;font-size:clamp(2.9rem,13vw,6.4rem);line-height:1.12;letter-spacing:0}h1 span{display:block}.subtitle{max-width:31rem;margin:16px auto 0;color:var(--muted);font-size:.98rem;line-height:1.8}.start-button{margin-top:34px}.draw-header{position:absolute;top:max(22px,env(safe-area-inset-top));left:18px;right:18px;display:flex;align-items:center;justify-content:space-between;color:var(--gold)}.draw-header p{margin:0;font-size:.86rem;font-weight:700}.draw-stage{position:relative;display:flex;width:min(100%,520px);flex:1;flex-direction:column;align-items:center;justify-content:center;margin:24px auto 0;perspective:1200px}.fireworks{position:absolute;z-index:1;top:-18vh;right:-28vw;bottom:-18vh;left:-28vw;pointer-events:none;overflow:hidden}.fireworks span{position:absolute;top:var(--origin-y);left:var(--origin-x);width:10px;height:10px;border-radius:999px;background:var(--spark-color);box-shadow:0 0 22px color-mix(in srgb,var(--spark-color) 62%,transparent);opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(0) scale(.35);animation:fireworkPop 1.55s cubic-bezier(.16,.78,.22,1) forwards;animation-delay:var(--delay)}.fireworks span:nth-child(3n){width:7px;height:28px;border-radius:999px;background:#8e72a7;box-shadow:0 0 20px #8e72a780}.fireworks span:nth-child(4n){width:14px;height:14px;background:#f0a058;box-shadow:0 0 22px #f0a0587a}.is-draw-view{justify-content:center}.card-frame{position:relative;z-index:2;width:min(78vw,350px);aspect-ratio:1086 / 1514;border-radius:32px;overflow:hidden;transform-origin:center center;transform-style:preserve-3d;animation:floatCard 5.5s ease-in-out infinite}.card-frame.has-result{width:min(80vw,370px)}.card-frame.is-drawing{animation:drawFlip 6s forwards}.card-glow{position:absolute;top:5%;right:8%;bottom:-2%;left:8%;z-index:0;border-radius:30px;background:linear-gradient(150deg,#b79b584d,#7d669a2e);filter:blur(22px);opacity:.72}.status-card{position:relative;z-index:1;display:block;width:100%;height:100%;margin:0;border-radius:28px;object-fit:cover;box-shadow:var(--shadow);-webkit-user-select:none;user-select:none;-webkit-touch-callout:default}.status-card.is-front{clip-path:inset(1.2% 7.8% round 24px)}.status-card.is-back{transform:none;clip-path:inset(1.2% 7.8% round 24px)}.choice-board{position:relative;z-index:2;display:flex;width:min(100%,520px);flex-direction:column;align-items:center;gap:18px;animation:choiceArrive .56s cubic-bezier(.18,.72,.18,1) both}.choice-board p{margin:0;color:var(--purple-deep);font-size:1rem;font-weight:700}.choice-cards{display:grid;width:min(100%,430px);grid-template-columns:repeat(3,1fr);gap:10px;align-items:center}.choice-card{position:relative;aspect-ratio:1086 / 1514;padding:0;border-radius:20px;background:transparent;box-shadow:0 18px 44px #664f3624;transform:translateY(18px) rotateY(42deg) scale(.92);transform-style:preserve-3d;animation:choiceCardIn .72s cubic-bezier(.18,.72,.18,1) both;animation-delay:calc(var(--choice-index) * 90ms)}.choice-card:nth-child(1){transform-origin:right center}.choice-card:nth-child(2){transform-origin:center center}.choice-card:nth-child(3){transform-origin:left center}.choice-card .status-card{border-radius:18px}.choice-card:active{transform:translateY(2px) scale(.98)}.result-copy{height:0;margin-top:0;overflow:hidden;opacity:0;text-align:center;transform:translateY(8px);transition:opacity .36s ease,transform .36s ease,height .36s ease,margin-top .36s ease}.result-copy.is-visible{height:68px;margin-top:18px;opacity:1;transform:translateY(0)}.result-copy p{margin:0 0 6px;color:var(--muted);font-size:.9rem}.result-copy h2{margin:0;color:var(--purple-deep);font-size:1.2rem;font-weight:700;letter-spacing:0}.actions{display:flex;width:100%;flex-direction:column;align-items:center;gap:12px;margin-top:22px}.primary-button{width:min(100%,320px);min-height:54px;border-radius:999px;color:#fffaf5;background:linear-gradient(135deg,#735b93,#8c6e9c 44%,#bd9360);box-shadow:0 16px 34px #684f7d42;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}.primary-button:active{transform:scale(.98);box-shadow:0 10px 24px #684f7d3d}.primary-button:disabled{filter:saturate(.9)}.primary-button span{font-weight:700}.secondary-actions{display:grid;width:min(100%,320px);grid-template-columns:1fr 1fr;gap:10px}.secondary-actions button{min-height:44px;border:1px solid rgba(183,155,88,.35);border-radius:999px;color:var(--purple-deep);background:#fffcf7bd;box-shadow:0 10px 28px #664f3614;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:transform .18s ease,background .18s ease}.secondary-actions button:active{transform:scale(.98);background:#ffffffeb}.save-hint{min-height:22px;margin:12px 0 0;color:#5349409e;font-size:.84rem;text-align:center}footer{margin-top:22px;color:#b79b58d1;font-size:.78rem;letter-spacing:0;text-align:center}.toast{position:fixed;right:18px;bottom:max(20px,env(safe-area-inset-bottom));left:18px;z-index:20;width:fit-content;max-width:calc(100% - 36px);margin:0 auto;padding:10px 14px;border:1px solid rgba(183,155,88,.26);border-radius:999px;color:#4b413a;background:#fffcf7e6;box-shadow:0 18px 42px #664f3629;opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .22s ease,transform .22s ease;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.toast.is-visible{opacity:1;transform:translateY(0)}@keyframes floatCard{0%,to{transform:translateY(0) rotateX(0)}50%{transform:translateY(-9px) rotateX(1.5deg)}}@keyframes drawFlip{0%{transform:translateY(0) translateZ(0) scale(1) rotateY(0);animation-timing-function:cubic-bezier(.55,0,1,.45)}8.333%{transform:translateY(4px) translateZ(18px) scale(.96) rotateY(120deg);animation-timing-function:linear}42%{transform:translateY(-12px) translateZ(82px) scale(1.03) rotateY(2500deg);animation-timing-function:linear}75%{transform:translateY(-6px) translateZ(48px) scale(1) rotateY(5040deg);animation-timing-function:cubic-bezier(0,.55,.18,1)}to{transform:translateY(0) translateZ(0) scale(1) rotateY(5400deg)}}@keyframes choiceArrive{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes choiceCardIn{0%{opacity:0;transform:translateY(28px) rotateY(70deg) scale(.86)}70%{opacity:1;transform:translateY(-4px) rotateY(-8deg) scale(1.02)}to{opacity:1;transform:translateY(0) rotateY(0) scale(1)}}@keyframes fireworkPop{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(0) scale(.4)}18%{opacity:1}74%{opacity:.95}to{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(calc(var(--distance) * -1)) scale(1)}}@media(min-width:860px){.app-shell:not(.is-draw-view){display:grid;grid-template-rows:1fr auto;padding:54px min(7vw,96px) 24px}.home-screen{align-self:center;text-align:center}h1,.subtitle{margin-left:auto;margin-right:auto}.draw-stage{align-self:center;margin-top:0}footer{grid-column:1 / -1}}@media(max-width:390px){.app-shell{padding-inline:14px}.subtitle{font-size:.92rem;line-height:1.65}.draw-stage{margin-top:18px}.card-frame,.card-frame.has-result{width:min(76vw,318px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}