@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,600;0,700;1,600;1,700&display=swap");
.xinsam-app{--deep:#6f1d1b;--gold:#b88d48;--ink:#2f2119;--muted:#75675d;--line:#dac7aa;max-width:1180px;margin:28px auto;padding:clamp(20px,4vw,48px);color:var(--ink);background:linear-gradient(145deg,#fbf3df,#f5e5c4);border:1px solid var(--line);border-radius:28px;box-shadow:0 22px 60px rgba(67,43,23,.12)}
.xinsam-app *{box-sizing:border-box}.xinsam-intro{text-align:center;max-width:760px;margin:0 auto 28px}.xinsam-kicker{font:700 12px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.18em;color:var(--deep);margin:0 0 8px}.xinsam-intro h2{font-size:clamp(28px,5vw,48px);line-height:1.05;margin:0 0 12px}.xinsam-intro p{color:var(--muted);margin:0;line-height:1.65}.xinsam-grid{display:grid;grid-template-columns:minmax(300px,1fr) minmax(280px,.82fr);gap:clamp(24px,4vw,52px);align-items:center}
.xinsam-wheel-panel{display:grid;place-items:center;min-width:0}.xinsam-wheel-wrap{position:relative;width:min(100%,530px);padding:14px}.xinsam-pointer{position:absolute;z-index:8;left:50%;top:0;transform:translateX(-50%);width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-top:0;border-bottom:28px solid var(--deep);filter:drop-shadow(0 3px 2px rgba(0,0,0,.15))}.xinsam-wheel{position:relative;width:100%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#fff8e8 0 16%,#d8b76e 16.5% 18%,transparent 18.5%),repeating-radial-gradient(circle,transparent 0 56px,rgba(80,49,27,.13) 57px 58px);box-shadow:inset 0 0 0 2px #b88d48,0 14px 35px rgba(73,44,21,.16);overflow:hidden}.xinsam-wheel:before,.xinsam-wheel:after{content:"";position:absolute;inset:1.5%;border:1px solid rgba(111,29,27,.22);border-radius:50%;pointer-events:none}.xinsam-wheel:after{inset:18%;border-color:rgba(111,29,27,.18)}.xinsam-ring{position:absolute;border-radius:50%;will-change:transform}.xinsam-ring-outer{inset:5%;border:2px solid rgba(93,55,30,.42)}.xinsam-ring-outer span{position:absolute;left:50%;top:50%;font-size:clamp(11px,2.1vw,17px);font-weight:700;transform:translate(-50%,-50%) rotate(calc(var(--i)*45deg)) translateY(calc(-1 * min(39vw,195px))) rotate(calc(var(--i)*-45deg));white-space:nowrap}.xinsam-ring-middle{inset:23%;border:1px solid rgba(93,55,30,.35)}.xinsam-ring-middle span{position:absolute;left:50%;top:50%;font:700 clamp(10px,1.7vw,15px)/1 ui-sans-serif,system-ui,sans-serif;transform:translate(-50%,-50%) rotate(calc(var(--i)*72deg)) translateY(calc(-1 * min(25vw,112px))) rotate(calc(var(--i)*-72deg))}.xinsam-ring-zodiac{inset:32%;border:1px solid rgba(93,55,30,.28)}.xinsam-ring-zodiac span{position:absolute;left:50%;top:50%;font:700 clamp(8px,1.35vw,11px)/1 ui-sans-serif,system-ui,sans-serif;color:#68533f;transform:translate(-50%,-50%) rotate(calc(var(--i)*30deg)) translateY(calc(-1 * min(16vw,72px))) rotate(calc(var(--i)*-30deg))}.xinsam-spin-btn{position:absolute;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(92px,22%,118px);aspect-ratio:1;border-radius:50%;border:2px solid #c49a54;background:radial-gradient(circle at 35% 28%,#8c2c28,var(--deep) 68%);color:#fff8e8;display:grid;place-items:center;align-content:center;gap:1px;box-shadow:0 8px 25px rgba(80,27,22,.28),inset 0 0 0 4px rgba(255,239,197,.12);cursor:pointer;touch-action:manipulation}.xinsam-spin-btn:hover{filter:brightness(1.06)}.xinsam-spin-btn:focus-visible{outline:4px solid rgba(111,29,27,.24);outline-offset:4px}.xinsam-spin-btn:disabled{cursor:wait;opacity:.78}.xinsam-yinyang{font-size:clamp(30px,5vw,48px);line-height:1}.xinsam-spin-btn strong{font:900 clamp(13px,2vw,17px)/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.08em}.xinsam-spin-btn small{font:700 8px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.12em;opacity:.84}.xinsam-wheel.is-casting .xinsam-spin-btn{box-shadow:0 0 0 7px rgba(111,29,27,.10),0 8px 25px rgba(80,27,22,.28)}.xinsam-wheel-hint{margin:14px 0 0;color:var(--muted);font:500 13px/1.5 ui-sans-serif,system-ui,sans-serif;text-align:center}
.xinsam-form-panel{background:rgba(255,255,255,.66);border:1px solid rgba(184,141,72,.3);padding:24px;border-radius:22px}.xinsam-form-panel form{display:grid;gap:18px}.xinsam-form-panel label{display:grid;gap:8px;font:700 14px/1.4 ui-sans-serif,system-ui,sans-serif}.xinsam-form-panel label span{font-weight:400;color:var(--muted)}.xinsam-form-panel input,.xinsam-form-panel select,.xinsam-form-panel textarea{width:100%;font:400 16px/1.4 ui-sans-serif,system-ui,sans-serif;border:1px solid #cdbda9;border-radius:12px;background:#fffdf8;color:#241c17;padding:12px 14px;outline:none}.xinsam-form-panel input:focus,.xinsam-form-panel select:focus,.xinsam-form-panel textarea:focus{border-color:var(--deep);box-shadow:0 0 0 3px rgba(111,29,27,.12)}.xinsam-ritual-note{display:grid;gap:4px;padding:14px 15px;border:1px dashed rgba(111,29,27,.3);border-radius:14px;background:rgba(255,249,235,.72);font:500 13px/1.5 ui-sans-serif,system-ui,sans-serif;color:var(--muted)}.xinsam-ritual-note strong{color:var(--deep);font-size:14px}.xinsam-status{min-height:22px;margin:0;color:var(--deep);font:650 13px/1.5 ui-sans-serif,system-ui,sans-serif}
.xinsam-result{margin-top:34px;padding-top:28px;border-top:1px solid var(--line);scroll-margin-top:24px}.xinsam-result-head{display:flex;gap:20px;align-items:center}.xinsam-glyph{width:82px;height:82px;border-radius:22px;display:grid;place-items:center;background:var(--deep);color:#f9e7b8;font-size:56px;line-height:1}.xinsam-result h3{font-size:clamp(24px,4vw,38px);margin:0 0 6px}.xinsam-result-head p:last-child{margin:0;color:var(--muted);font:500 13px/1.5 ui-sans-serif,system-ui,sans-serif}.xinsam-result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}.xinsam-result-grid>div{background:rgba(255,255,255,.65);border:1px solid rgba(184,141,72,.3);border-radius:16px;padding:14px;min-width:0}.xinsam-result-grid span{display:block;color:var(--muted);font:600 11px/1.4 ui-sans-serif,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.xinsam-result-grid strong{font-size:15px;overflow-wrap:anywhere}.xinsam-ai-box{background:#fffdf8;border:1px solid var(--line);border-radius:20px;padding:20px}.xinsam-ai-box h4{font-size:20px;margin:0 0 12px}.xinsam-ai-text{white-space:pre-wrap;font:400 15px/1.75 ui-sans-serif,system-ui,sans-serif;color:#3b3029}
@media(max-width:760px){.xinsam-app{margin:12px 0;border-radius:20px;padding:18px}.xinsam-grid{grid-template-columns:1fr}.xinsam-form-panel{order:1}.xinsam-wheel-panel{order:2}.xinsam-wheel-wrap{width:min(94vw,450px)}.xinsam-ring-outer span{transform:translate(-50%,-50%) rotate(calc(var(--i)*45deg)) translateY(calc(-1 * min(39vw,166px))) rotate(calc(var(--i)*-45deg))}.xinsam-ring-middle span{transform:translate(-50%,-50%) rotate(calc(var(--i)*72deg)) translateY(calc(-1 * min(24vw,104px))) rotate(calc(var(--i)*-72deg))}.xinsam-ring-zodiac span{transform:translate(-50%,-50%) rotate(calc(var(--i)*30deg)) translateY(calc(-1 * min(15vw,63px))) rotate(calc(var(--i)*-30deg))}.xinsam-result-grid{grid-template-columns:1fr 1fr}.xinsam-result-head{align-items:flex-start}.xinsam-glyph{width:66px;height:66px;font-size:44px;flex:0 0 auto}}
@media(max-width:420px){.xinsam-result-grid{grid-template-columns:1fr}.xinsam-ring-outer span{font-size:9px}.xinsam-ring-middle span{font-size:9px}.xinsam-ring-zodiac span{font-size:7px}.xinsam-form-panel{padding:18px}}
@media(prefers-reduced-motion:reduce){.xinsam-ring{transition:none!important}}

/* v0.1.2: immediate ritual animation while the server is calculating the cast. */
@keyframes xinsam-spin-outer{from{transform:rotate(0deg)}to{transform:rotate(1080deg)}}
@keyframes xinsam-spin-middle{from{transform:rotate(0deg)}to{transform:rotate(-900deg)}}
@keyframes xinsam-spin-zodiac{from{transform:rotate(0deg)}to{transform:rotate(1260deg)}}
.xinsam-wheel.is-ritual-spinning .xinsam-ring-outer{animation:xinsam-spin-outer 2.2s linear infinite}
.xinsam-wheel.is-ritual-spinning .xinsam-ring-middle{animation:xinsam-spin-middle 2.7s linear infinite}
.xinsam-wheel.is-ritual-spinning .xinsam-ring-zodiac{animation:xinsam-spin-zodiac 1.9s linear infinite}
@media(prefers-reduced-motion:reduce){.xinsam-wheel.is-ritual-spinning .xinsam-ring{animation:none!important}}

/* v0.1.4: compact prophecy + focused interpretation. */
.xinsam-ai-box{display:grid;gap:20px}
.xinsam-sam-block{padding:20px clamp(16px,3vw,28px);border:1px solid rgba(111,29,27,.18);border-radius:18px;background:linear-gradient(145deg,rgba(111,29,27,.055),rgba(184,141,72,.08));text-align:center}
.xinsam-ai-kicker{margin:0 0 12px;color:#111;font:800 11px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.2em}
.xinsam-sam-text{white-space:pre-line;color:#111;font-family:"Cormorant Garamond","Noto Serif","Times New Roman",serif;font-size:clamp(24px,3.2vw,38px);font-style:italic;font-weight:700;line-height:1.8;letter-spacing:.02em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
.xinsam-luan-block h4{margin:0 0 10px}
.xinsam-ai-text{max-width:900px;white-space:pre-line;line-height:1.7}

/* v0.2.2: manual DOB fields. No date/tel input is used, preventing mobile date pickers. */
.xinsam-birth-fieldset{margin:0;padding:0;border:0;min-width:0}
.xinsam-birth-fieldset legend{margin:0 0 8px;padding:0;font:700 14px/1.4 ui-sans-serif,system-ui,sans-serif}
.xinsam-birth-fieldset legend span{font-weight:400;color:var(--muted)}
.xinsam-birth-grid{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:10px}
.xinsam-birth-part{display:grid!important;gap:6px!important;min-width:0}
.xinsam-birth-part>span{font:600 12px/1.3 ui-sans-serif,system-ui,sans-serif!important;color:var(--muted)!important}
.xinsam-birth-part input{min-width:0;text-align:center;font-variant-numeric:tabular-nums}
@media(max-width:420px){.xinsam-birth-grid{grid-template-columns:1fr 1fr 1.4fr;gap:8px}.xinsam-birth-part input{padding-left:8px;padding-right:8px}}

/* v0.2.3: visible build marker for cache diagnosis. */
.xinsam-version-badge{display:inline-block;margin:0 0 10px;padding:3px 8px;border:1px solid rgba(47,33,25,.22);border-radius:999px;color:#5f534a;background:rgba(255,255,255,.55);font:700 10px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.06em}