/* Xin Xăm Online – Black Gold Mystic UI v1.1.0. UI-only. */
.xinsam-app{
  --xxo-gold:#d2a94f;--xxo-gold2:#f3d98e;--xxo-red:#7f211f;--xxo-ink:#08090b;--xxo-panel:#0d0e11;--xxo-panel2:#15110d;
  max-width:1500px!important;margin:0 auto!important;padding:0!important;border:1px solid rgba(210,169,79,.34)!important;border-radius:0!important;
  background:#08090b!important;color:#f1e6cd!important;box-shadow:0 24px 60px rgba(0,0,0,.35)!important;overflow:hidden;
  font-family:Georgia,"Times New Roman",serif;
}
.xinsam-app *{box-sizing:border-box}.xinsam-app .xinsam-en{display:block!important;margin-top:3px;color:#c9aa70!important;font-size:.78em!important;font-style:normal!important;line-height:1.25!important;font-weight:400!important}

/* Hero */
.xxo-hero{position:relative;min-height:300px;display:grid;grid-template-columns:minmax(260px,.82fr) minmax(340px,1.18fr);align-items:center;overflow:hidden;padding:24px 6% 12px;border-bottom:1px solid rgba(210,169,79,.24);background:
 radial-gradient(circle at 67% 45%,rgba(184,128,39,.24),transparent 28%),
 radial-gradient(circle at 25% 60%,rgba(121,70,20,.12),transparent 33%),
 linear-gradient(90deg,#08090b 0%,#0c0b09 48%,#08090b 100%)}
.xxo-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-conic-gradient(from 5deg at 68% 45%,transparent 0 8deg,rgba(213,172,79,.018) 9deg 10deg,transparent 11deg 20deg);opacity:.85}
.xxo-hero-copy{position:relative;z-index:3;max-width:520px}.xxo-eyebrow{margin:0 0 5px;color:#f2e3c2;font-size:clamp(27px,3.2vw,48px);letter-spacing:.06em}.xxo-hero-copy h2{margin:0 0 15px;color:var(--xxo-gold2);font-size:clamp(18px,2vw,27px);letter-spacing:.14em}.xxo-hero-copy>p{margin:0;color:#f0e6d4;font-size:clamp(16px,1.6vw,22px);line-height:1.45}.xxo-hero-copy>small{display:block;margin-top:8px;color:#d2b979;font-size:13px;line-height:1.5;font-style:italic}
.xxo-crystal-stage{position:relative;justify-self:center;width:min(43vw,410px);aspect-ratio:1/.92;display:grid;place-items:center;isolation:isolate}.xxo-crystal-stage::before{content:"";position:absolute;width:85%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,206,101,.20),rgba(127,75,17,.08) 45%,transparent 70%);filter:blur(16px);animation:xxo-breathe 4.8s ease-in-out infinite alternate}
.xxo-crystal-ball{position:absolute;top:4%;width:65%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:1px solid rgba(218,223,225,.72);background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.96) 0 4%,rgba(255,255,255,.38) 5% 10%,transparent 12%),radial-gradient(circle at 50% 46%,rgba(233,245,255,.92) 0 18%,rgba(174,196,222,.56) 38%,rgba(84,93,124,.46) 65%,rgba(34,33,46,.64) 100%);box-shadow:inset 0 8px 26px rgba(255,255,255,.24),inset 0 -20px 30px rgba(17,19,34,.34),0 0 38px rgba(222,176,83,.24),0 18px 30px rgba(0,0,0,.35)}
.xxo-crystal-glow{position:absolute;inset:8%;border-radius:50%;background:conic-gradient(from 0deg,transparent,rgba(241,191,88,.12),transparent 30%,rgba(255,255,255,.1),transparent 67%);animation:xxo-orbit 12s linear infinite}.xxo-crystal-reflection{position:absolute;left:22%;top:13%;width:27%;height:13%;border-radius:50%;border-top:4px solid rgba(255,255,255,.55);transform:rotate(-25deg)}
.xxo-human-silhouette{position:absolute;left:50%;bottom:13%;width:26%;height:58%;transform:translateX(-50%);filter:drop-shadow(0 0 10px rgba(226,184,91,.18))}.xxo-head{position:absolute;left:50%;top:0;width:28%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:#1a1a1e}.xxo-body{position:absolute;left:50%;top:16%;width:78%;height:84%;transform:translateX(-50%);background:linear-gradient(#343136,#151419);clip-path:polygon(40% 0,60% 0,68% 10%,77% 36%,65% 60%,76% 100%,24% 100%,35% 60%,23% 36%,32% 10%)}
.xxo-bagua-orbit{position:absolute;top:-1%;width:88%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(210,169,79,.30);animation:xxo-orbit 36s linear infinite}.xxo-bagua-orbit span{position:absolute;left:50%;top:50%;color:#f0c96f;font-size:clamp(17px,2.2vw,27px);text-shadow:0 0 9px rgba(242,196,92,.45);transform:translate(-50%,-50%) rotate(calc(var(--i)*45deg)) translateY(calc(-1 * min(19vw,175px))) rotate(calc(var(--i)*-45deg))}.xxo-crystal-base{position:absolute;bottom:2%;left:50%;width:45%;height:18%;transform:translateX(-50%);border:1px solid rgba(210,169,79,.35);border-radius:50% 50% 18% 18%/38% 38% 22% 22%;background:linear-gradient(#513320,#17100b);box-shadow:inset 0 3px 7px rgba(255,221,143,.12),0 11px 20px rgba(0,0,0,.40)}.xxo-crystal-base::before{content:"";position:absolute;left:50%;top:-25%;width:72%;height:34%;transform:translateX(-50%);border-radius:50%;background:linear-gradient(#8e6137,#3e2819);border:1px solid rgba(210,169,79,.30)}
@keyframes xxo-orbit{to{transform:rotate(360deg)}}@keyframes xxo-breathe{from{transform:scale(.97);opacity:.7}to{transform:scale(1.035);opacity:1}}

/* Three-column main board */
.xxo-main-board{display:grid;grid-template-columns:minmax(260px,.78fr) minmax(420px,1.18fr) minmax(300px,.92fr);gap:8px;padding:8px;background:#08090b;align-items:start}.xxo-main-board>section{min-width:0;border:1px solid rgba(210,169,79,.36)!important;border-radius:3px!important;background:linear-gradient(160deg,rgba(16,17,20,.98),rgba(9,10,12,.98))!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.015)!important}.xxo-panel-title{text-align:center;padding:12px 14px 10px;border-bottom:1px solid rgba(210,169,79,.22);margin:-1px -1px 14px}.xxo-panel-title strong{display:block;color:#f4e6c4;font-size:16px;letter-spacing:.05em}.xxo-panel-title small{display:block;color:#caa85e;font-size:11px;letter-spacing:.07em;margin-top:3px}

/* Form */
.xinsam-form-panel{padding:0 18px 18px!important}.xinsam-form-panel form{gap:15px!important}.xinsam-form-panel fieldset,.xinsam-form-panel label{color:#f0e4ce!important;font-family:Georgia,"Times New Roman",serif!important}.xinsam-birth-fieldset{border:1px solid rgba(210,169,79,.28)!important;border-radius:3px!important;padding:14px!important}.xinsam-birth-fieldset legend{padding:0 6px;color:#f1e4ce!important}.xinsam-form-panel input,.xinsam-form-panel select,.xinsam-form-panel textarea{background:#0b0d10!important;color:#eadfc8!important;border:1px solid rgba(210,169,79,.35)!important;border-radius:7px!important;box-shadow:inset 0 0 16px rgba(0,0,0,.24)!important}.xinsam-form-panel input:focus,.xinsam-form-panel select:focus,.xinsam-form-panel textarea:focus{border-color:#d7ad55!important;box-shadow:0 0 0 2px rgba(210,169,79,.13)!important}.xinsam-ritual-note{border:1px solid rgba(210,169,79,.34)!important;background:linear-gradient(180deg,#513005,#8a4b08)!important;color:#f8e7c1!important;text-align:center;border-radius:5px!important}.xinsam-ritual-note strong{color:#fff0c9!important;font-size:16px!important}.xinsam-status{color:#d9ba77!important}

/* Wheel copied from the 1.0.2 visual language, intensified to match mockup */
.xinsam-wheel-panel{padding:0 16px 18px!important}.xinsam-wheel-wrap{position:relative;isolation:isolate;width:min(100%,620px)!important;margin:auto;filter:drop-shadow(0 18px 25px rgba(0,0,0,.44))}.xinsam-wheel-wrap::before{content:"";position:absolute;z-index:-2;inset:1%;border-radius:50%;background:radial-gradient(circle,rgba(122,42,36,.12) 0 48%,transparent 67%),conic-gradient(from 15deg,transparent 0 8%,rgba(208,166,74,.17) 9% 11%,transparent 12% 24%,rgba(111,29,27,.12) 25% 27%,transparent 28% 41%,rgba(208,166,74,.15) 42% 44%,transparent 45% 58%,rgba(111,29,27,.10) 59% 61%,transparent 62% 75%,rgba(208,166,74,.15) 76% 78%,transparent 79% 100%);filter:blur(14px)}.xinsam-wheel{background:radial-gradient(circle,#fff2c9 0 15.2%,#c99a42 15.6% 16.2%,#541615 16.6% 17.25%,transparent 17.7%),repeating-radial-gradient(circle,transparent 0 55px,rgba(210,169,79,.18) 56px 57px),repeating-conic-gradient(from 0deg,rgba(235,193,100,.055) 0 1deg,transparent 1deg 15deg),radial-gradient(circle at 50% 46%,#17120c 0%,#110e0b 58%,#0a0908 84%,#070706 100%)!important;border:1px solid rgba(210,169,79,.66)!important;box-shadow:inset 0 0 0 2px rgba(244,214,145,.10),inset 0 0 38px rgba(188,127,38,.10),0 0 0 5px rgba(210,169,79,.07),0 14px 32px rgba(0,0,0,.42)!important}.xinsam-wheel::before{border-color:rgba(226,185,91,.36)!important}.xinsam-wheel::after{border-color:rgba(210,169,79,.28)!important}.xinsam-ring-outer,.xinsam-ring-middle,.xinsam-ring-zodiac{border-color:rgba(210,169,79,.50)!important}.xinsam-ring-outer span{color:#f1cb73!important;text-shadow:0 0 8px rgba(238,195,92,.28)}.xinsam-ring-middle span{color:#d9b260!important}.xinsam-ring-zodiac span{color:#c8a562!important}.xinsam-pointer{border-bottom-color:#e0b759!important;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4))!important}.xinsam-spin-btn{color:#ffe8ae!important;border-color:#d2a94f!important;background:radial-gradient(circle at 35% 27%,#a34c42 0%,#7d2d2a 38%,#641f22 68%,#3d1015 100%)!important;box-shadow:0 0 0 5px rgba(210,169,79,.12),0 9px 25px rgba(0,0,0,.42),0 0 25px rgba(210,169,79,.12),inset 0 0 0 4px rgba(255,237,190,.09)!important}.xinsam-wheel-hint{color:#cdb27b!important}.xinsam-wheel-hint strong{color:#f2ce78!important}

/* Result */
.xinsam-result{margin:0!important;padding:0 14px 16px!important;border-top:none!important}.xinsam-result-head{padding:4px 0 12px;border-bottom:1px solid rgba(210,169,79,.22)}.xinsam-glyph{background:#17110b!important;color:#e0b75d!important;border:1px solid rgba(210,169,79,.38);border-radius:4px!important}.xinsam-result h3{color:#e8c36e!important;font-size:clamp(22px,2.2vw,34px)!important}.xinsam-result-head p{color:#bd9e66!important}.xinsam-result-grid{grid-template-columns:1fr 1fr!important;gap:7px!important;margin:12px 0!important}.xinsam-result-grid>div{background:#0c0d10!important;border:1px solid rgba(210,169,79,.28)!important;border-radius:3px!important;padding:10px!important}.xinsam-result-grid span{color:#b9a27a!important}.xinsam-result-grid strong{color:#f0dfbd!important}.xinsam-ai-box{padding:0!important;background:transparent!important;border:0!important;gap:9px!important}.xinsam-sam-block,.xinsam-luan-block{border:1px solid rgba(210,169,79,.31)!important;border-radius:3px!important}.xinsam-sam-block{padding:15px!important;background:linear-gradient(rgba(219,196,152,.94),rgba(191,164,117,.92))!important}.xinsam-ai-kicker{color:#4c2c0c!important}.xinsam-sam-text{color:#17120d!important;font-size:clamp(17px,1.6vw,22px)!important;line-height:1.55!important}.xinsam-luan-block{padding:14px;background:#0b0c0f}.xinsam-luan-block h4{color:#e6c16c!important;text-align:center}.xinsam-ai-text{color:#e5d8bf!important;font-family:Georgia,"Times New Roman",serif!important;font-size:14px!important;line-height:1.65!important}.xinsam-ai-wait{color:#d6b76f!important}

.xxo-disclaimer{display:flex;gap:12px;align-items:center;padding:13px 22px;border-top:1px solid rgba(210,169,79,.24);background:#08090b;color:#b9aa8f}.xxo-disclaimer>span{font-size:25px;color:#d1a951}.xxo-disclaimer p{margin:0;font-size:12px}.xxo-disclaimer small{display:block;color:#987e4d;font-size:11px;font-style:italic;margin-top:3px}

@media(max-width:1100px){.xxo-main-board{grid-template-columns:minmax(260px,.8fr) minmax(400px,1.2fr)}.xinsam-result{grid-column:1/-1}.xxo-hero{grid-template-columns:.8fr 1.2fr}}
@media(max-width:760px){.xinsam-app{border-left:0!important;border-right:0!important}.xxo-hero{min-height:auto;grid-template-columns:1fr;padding:20px 16px 12px;text-align:center}.xxo-hero-copy{max-width:none}.xxo-crystal-stage{width:min(84vw,340px);order:-1;margin:auto}.xxo-main-board{grid-template-columns:1fr;padding:6px}.xinsam-form-panel{order:1}.xinsam-wheel-panel{order:2}.xinsam-result{order:3;grid-column:auto}.xinsam-wheel-wrap{width:min(94vw,500px)!important}.xxo-panel-title{margin-bottom:10px}.xxo-disclaimer{padding:12px 14px}.xxo-bagua-orbit span{transform:translate(-50%,-50%) rotate(calc(var(--i)*45deg)) translateY(calc(-1 * min(34vw,145px))) rotate(calc(var(--i)*-45deg))}.xinsam-result-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:420px){.xinsam-result-grid{grid-template-columns:1fr!important}.xxo-hero-copy>p{font-size:16px}.xxo-eyebrow{font-size:28px}.xinsam-form-panel,.xinsam-wheel-panel,.xinsam-result{padding-left:12px!important;padding-right:12px!important}}
@media(prefers-reduced-motion:reduce){.xxo-crystal-stage::before,.xxo-crystal-glow,.xxo-bagua-orbit{animation:none!important}}
