:root{--color-paper:#f7efe2;--color-paper-deep:#eadcc8;--color-ink:#241915;--color-ink-soft:#6d5b51;--color-cinnabar:#b6422c;--color-gold:#c99a45;--color-border:#5639272e;--shadow-card:0 18px 45px #4f2d181f;--radius-lg:24px;--radius-md:16px;--space-page:clamp(16px, 4vw, 32px);font-family:Inter,PingFang SC,Noto Sans SC,system-ui,sans-serif}*{box-sizing:border-box}body{min-height:100vh;color:var(--color-ink);background:radial-gradient(circle at top, #fff9ed 0, var(--color-paper) 42%, #ead6bd 100%);margin:0}button,input{font:inherit}button{cursor:pointer;border:0}.app-shell{width:min(720px,100%);padding:var(--space-page);gap:18px;margin:0 auto;display:grid}.hero-card,.control-card,.wheel-card,.result-card,.share-card,.step-card,.legal-footer{border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffbf2db;padding:20px}.eyebrow,.result-badge,.poster-mark{color:var(--color-cinnabar);letter-spacing:.08em;font-size:13px;font-weight:700}h1,h2,h3,p{margin-top:0}h1{margin-bottom:12px;font-size:clamp(32px,9vw,52px);line-height:1.03}h2{margin-bottom:12px}.hero-card p,.result-card p,.share-card p{color:var(--color-ink-soft);line-height:1.7}.disclaimer{color:var(--color-cinnabar);background:#b6422c14;border-radius:999px;margin:12px 0 0;padding:10px 12px;font-size:13px}.disclaimer.is-compact{border-radius:12px}.hint{color:var(--color-gold);margin:8px 0 0;font-size:14px}.section-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-head button,.share-actions button{color:var(--color-cinnabar);background:#b6422c17;border-radius:999px;padding:9px 13px}.field{color:var(--color-ink-soft);gap:8px;margin:12px 0 16px;display:grid}.field input{border:1px solid var(--color-border);border-radius:var(--radius-md);width:100%;color:var(--color-ink);background:#fffaf1;padding:14px}.branch-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.branch-chip{color:var(--color-ink);border:1px solid var(--color-border);background:#fff7e9;border-radius:16px;gap:4px;padding:12px 8px;display:grid}.branch-chip span{color:var(--color-ink-soft);font-size:11px}.branch-chip.is-active{background:var(--color-cinnabar);color:#fffaf4;border-color:var(--color-cinnabar)}.branch-chip.is-active span{color:#fffc}.lunar-line{color:var(--color-ink-soft);margin:14px 0}.primary-button{color:#fffaf4;background:linear-gradient(135deg, var(--color-cinnabar), #8f2d20);border-radius:18px;width:100%;padding:15px;box-shadow:0 12px 24px #b6422c38}.stage-title{color:var(--color-cinnabar);letter-spacing:.08em;margin-bottom:8px;font-size:13px;font-weight:800}.palm-card{overflow:hidden}.palm-head{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;display:flex}.palm-head h2{margin:0 0 8px;font-size:clamp(24px,5vw,34px)}.palm-head p{color:var(--color-ink-soft);margin:0;line-height:1.7}.palm-final{text-align:center;background:var(--color-ink);color:#fff8ed;border-radius:20px;min-width:128px;padding:12px 14px;box-shadow:0 14px 28px #2419152e}.palm-final span{opacity:.72;margin-bottom:4px;font-size:12px;display:block}.palm-final strong{font-size:26px}.palm-layout{grid-template-columns:1fr;align-items:start;gap:12px;display:grid}.palm-figure{background:radial-gradient(circle at 50% 34%,#fff8ebb8,#efd8bc59 62%,#b6422c0d);border:1px solid #c99a452e;border-radius:30px;place-items:center;min-height:650px;padding:18px 0;display:grid;position:relative;overflow:visible}.palm-figure:before{content:"";background-image:linear-gradient(#b6422c0b 1px,#0000 1px),linear-gradient(90deg,#b6422c0a 1px,#0000 1px);background-size:32px 32px;border-radius:26px;position:absolute;inset:18px;-webkit-mask-image:radial-gradient(circle,#000 0 58%,#0000 76%);mask-image:radial-gradient(circle,#000 0 58%,#0000 76%)}.palm-stage{z-index:1;aspect-ratio:2/3;width:min(430px,88%);position:relative}.palm-image{object-fit:contain;filter:drop-shadow(0 18px 34px #56392724);-webkit-user-select:none;user-select:none;pointer-events:none;border-radius:28px;width:100%;height:100%;position:absolute;inset:0}.palm-count-overlay,.count-path{display:none}.palm-node{pointer-events:none;position:absolute;inset:0}.palace-pin{display:none}.palace-pin em{background:var(--color-cinnabar);color:#fff8ed;width:22px;height:22px;animation:.28s both countPop;animation-delay:calc(var(--count-order) * 18ms);border-radius:999px;place-items:center;font-size:12px;font-style:normal;font-weight:900;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 18px #b6422c47}.palace-pin em.is-live-count{transform-origin:50%;animation:.46s both liveCountPop;box-shadow:0 0 0 8px #b6422c21,0 10px 22px #b6422c52}.palm-palace{--tx:-50%;--ty:-50%;transform:translate(var(--tx), var(--ty));text-align:center;width:46px;min-height:32px;box-shadow:none;z-index:3;text-shadow:0 1px #fffaf2f2,0 2px 8px #fffaf2d1;background:0 0;border:0;border-radius:0;place-items:center;gap:0;padding:0;transition:transform .28s,color .28s;display:grid;position:absolute}.palm-palace strong{color:var(--color-ink);font-size:16px;line-height:1.04}.palm-palace small,.palace-anchor{color:var(--color-cinnabar);font-size:8px;line-height:1.05}.palace-anchor{color:var(--color-gold);white-space:nowrap;font-weight:900}.palm-node.is-active .palace-pin:before{content:"";border:2px solid #b6422c6b;border-radius:999px;animation:.7s both liveHalo;position:absolute;inset:-8px}.palm-node.is-active .palm-palace{transform:translate(var(--tx), var(--ty)) scale(1.12)}.palm-node.is-active .palm-palace strong,.palm-node.is-active .palm-palace .palace-anchor{color:var(--color-cinnabar)}.palm-explain{grid-template-columns:1fr;align-items:stretch;gap:10px;display:grid}.count-rule,.count-status,.final-reading,.timeline-item{background:#fffaf285;border:1px solid #5639271a;border-radius:14px;padding:8px 10px}.compact-rule{background:0 0;border:0;flex-wrap:wrap;grid-column:1/-1;align-items:baseline;gap:8px;padding:0 2px;display:flex}.count-rule span,.count-status span,.final-reading span{color:var(--color-cinnabar);letter-spacing:.08em;margin-bottom:5px;font-size:12px;font-weight:800;display:block}.count-rule strong{color:var(--color-ink);line-height:1.6}.count-status{background:linear-gradient(135deg,#b6422c1a,#fffaf2db);border-color:#b6422c42}.count-status strong{color:var(--color-cinnabar);font-size:18px;line-height:1.35;display:block}.count-status small{color:var(--color-ink-soft);margin-top:6px;line-height:1.45;display:block}.step-timeline{gap:10px;display:grid}.timeline-item{opacity:.78;grid-template-columns:40px 1fr;gap:10px;display:grid}.timeline-item.is-current,.timeline-item.is-complete{opacity:1;border-color:#b6422c57}.timeline-index{width:40px;height:40px;color:var(--color-cinnabar);background:#b6422c17;border-radius:999px;place-items:center;font-size:15px;font-weight:900;display:grid}.timeline-item.is-current .timeline-index{background:var(--color-cinnabar);color:#fff8ed;animation:1.3s ease-in-out infinite pulseCount}.timeline-title{color:var(--color-ink);justify-content:space-between;align-items:baseline;gap:8px;display:flex}.timeline-title span{color:var(--color-ink-soft);font-size:11px}.timeline-title strong{color:var(--color-cinnabar);font-size:20px}.timeline-item p{color:var(--color-ink-soft);margin:7px 0 0;font-size:14px;line-height:1.58}.timeline-item small{color:var(--color-gold);font-size:11px;line-height:1.45}.final-reading strong{color:var(--color-cinnabar);margin-bottom:0;font-size:24px;display:block}.final-reading p{color:var(--color-ink-soft);margin:0;line-height:1.7}@keyframes tracePath{0%{stroke-dashoffset:180px;opacity:.2}to{stroke-dashoffset:0;opacity:1}}@keyframes countPop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes liveCountPop{0%{opacity:.35;transform:scale(.52)}55%{opacity:1;transform:scale(1.28)}to{opacity:1;transform:scale(1)}}@keyframes liveHalo{0%{opacity:.9;transform:scale(.86)}to{opacity:0;transform:scale(1.16)}}@keyframes pulseCount{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.step-list{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.step-card{opacity:.72;padding:14px}.step-card.is-current,.step-card.is-complete{opacity:1;border-color:#b6422c6b}.step-label{color:var(--color-cinnabar);font-size:12px;font-weight:700}.step-card p{color:var(--color-ink-soft);font-size:13px;line-height:1.55}.result-card ul{color:var(--color-ink-soft);padding-left:18px;line-height:1.7}.share-actions{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;display:grid}.share-poster{background:linear-gradient(160deg,#fff9ed,#f0ddc3);border:1px solid #c99a4573;border-radius:20px;width:100%;padding:22px}.poster-date,.share-poster p,.share-poster small{color:var(--color-ink-soft)}.poster-final{color:var(--color-cinnabar);margin:10px 0 8px;font-size:46px;font-weight:900}.poster-palm{background:radial-gradient(circle at 50% 35%,#fffaf2ad,#e9c99f42 68%,#b6422c0a);border-radius:18px;place-items:center;height:390px;margin:12px 0 8px;display:grid;position:relative;overflow:visible}.poster-palm-stage{aspect-ratio:2/3;width:min(240px,76%);position:relative}.poster-palm-image{object-fit:contain;filter:drop-shadow(0 10px 20px #5639271f);border-radius:18px;width:100%;height:100%;position:absolute;inset:0}.poster-palace{text-align:center;text-shadow:0 1px #fffaf2f0,0 2px 8px #fffaf2d1;place-items:center;gap:0;width:34px;min-height:24px;display:grid;position:absolute;transform:translate(-50%,-50%)}.poster-palace span{display:none}.poster-palace strong{color:var(--color-ink);font-size:14px;line-height:1.02}.poster-palace.is-active{transform:translate(-50%,-50%)scale(1.14)}.poster-palace.is-active strong,.poster-palace.is-active span{color:var(--color-cinnabar)}.poster-palace.is-active:before{content:none}.poster-joints{color:var(--color-gold);font-size:12px;font-weight:800;line-height:1.5}.poster-steps{flex-wrap:wrap;gap:8px;margin:12px 0;display:flex}.poster-steps span{background:#24191514;border-radius:999px;padding:6px 10px}.modal-backdrop{background:#170e0a73;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.modal,.modal-panel{background:#fff8ed;border-radius:24px;width:100%;max-width:520px;max-height:82vh;padding:20px;overflow:auto;box-shadow:0 24px 70px #0000003d}.modal button,.modal-close,.btn-primary{color:#fff;background:var(--color-cinnabar);border-radius:999px;padding:9px 12px}.modal-close{float:right;width:40px;height:40px;font-size:22px;line-height:1}.static-shell{color:#241915;background:#fff8ed;max-width:720px;margin:0 auto;padding:24px}.static-shell h1{margin:0 0 12px;font-size:36px}.static-shell p,.static-shell li,noscript{color:#6d5b51;line-height:1.75}.legal-footer p{color:var(--color-ink-soft);margin:0 0 10px;font-size:13px;line-height:1.7}.legal-footer nav{flex-wrap:wrap;gap:10px 14px;display:flex}.legal-footer a,.static-shell a{color:var(--color-cinnabar);font-weight:700}@media (width<=760px){.palm-head{display:grid}.palm-final{width:100%}.palm-layout{grid-template-columns:1fr}.palm-figure{min-height:590px}.palm-stage{width:min(390px,92%)}.palm-explain{grid-template-columns:1fr}}@media (width<=560px){.branch-grid{grid-template-columns:repeat(2,1fr)}.step-list{grid-template-columns:1fr}.palm-figure{min-height:540px;margin:0 -4px;padding:14px 0}.palm-stage{width:min(340px,94%)}.palm-palace{width:42px;min-height:30px}.palm-palace strong{font-size:15px}.palm-palace small,.palace-anchor{font-size:7px}.palace-pin{width:14px;height:14px}.palace-pin em{width:20px;height:20px;font-size:11px}.timeline-item{grid-template-columns:32px 1fr}.timeline-index{width:32px;height:32px}.share-actions{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.count-path,.palace-pin em,.palace-pin em.is-live-count,.palm-node.is-active .palace-pin:before,.timeline-item.is-current .timeline-index{animation:none}}