:root { --void:#071019; --deep:#0b1825; --ink:#102333; --mineral:#78a8c2; --silver:#c7d5da; --mist:#8ba0a8; --ember:#ff8066; --phosphor:#9ed8ce; }
.possession { min-height:100dvh; color:var(--silver); background:radial-gradient(circle at 53% 45%,#132b3c 0,#091722 32%,var(--void) 72%); font-family:Inter,system-ui,sans-serif; overflow:hidden; }
.possession button,.possession input,.possession textarea,.possession select { font:inherit; }
.possession__bar { height:88px; box-sizing:border-box; display:grid; grid-template-columns:160px 1fr auto; align-items:center; gap:24px; padding:14px 24px; border-bottom:1px solid rgba(199,213,218,.12); background:rgba(4,12,18,.72); backdrop-filter:blur(18px); }
.possession__bar h1 { margin:2px 0 0; font-family:Georgia,"Times New Roman",serif; font-size:23px; font-weight:400; letter-spacing:.01em; color:#edf4f2; }
.possession__kicker,.oracle__head span { color:var(--mineral); font-size:10px; letter-spacing:.18em; text-transform:uppercase; }
.possession__back,.possession__actions button { border:0; background:none; color:var(--mist); cursor:pointer; padding:10px; }
.possession__back { text-align:left; }
.possession__actions { display:flex; align-items:center; gap:8px; }
.possession__actions button { border:1px solid rgba(199,213,218,.16); border-radius:999px; padding:9px 14px; }
.possession__actions button:first-of-type { color:var(--void); background:var(--silver); }
.possession__checksum { font:10px ui-monospace,SFMono-Regular,monospace; color:#6f858e; margin-right:8px; }
.possession__body { height:calc(100dvh - 88px); display:grid; grid-template-columns:220px minmax(360px,1fr) 390px; }
.possession__lenses { padding:28px 12px; border-right:1px solid rgba(199,213,218,.1); background:rgba(5,15,22,.46); }
.possession__lens { width:100%; display:block; text-align:left; color:var(--mist); border:0; border-left:1px solid transparent; background:none; padding:14px 16px; cursor:pointer; transition:.2s ease; }
.possession__lens span { display:block; color:inherit; font-family:Georgia,serif; font-size:16px; }
.possession__lens small { display:block; margin-top:4px; font-size:10px; line-height:1.3; color:#617680; }
.possession__lens:hover,.possession__lens.is-active { color:#edf4f2; border-left-color:var(--ember); background:linear-gradient(90deg,rgba(255,128,102,.09),transparent); }
.possession__sky { position:relative; min-width:0; }
.cosmos { position:absolute; inset:0; overflow:hidden; }
.cosmos::before { content:""; position:absolute; inset:13%; border:1px solid rgba(120,168,194,.08); border-radius:50%; box-shadow:0 0 0 8vw rgba(120,168,194,.018),0 0 0 16vw rgba(120,168,194,.012); }
.cosmos__breath { position:absolute; width:48%; aspect-ratio:1; left:26%; top:24%; border-radius:50%; background:radial-gradient(circle,rgba(120,168,194,.13),transparent 67%); animation:world-breathe 7s ease-in-out infinite; }
.cosmos svg { position:absolute; inset:0; width:100%; height:100%; }
.cosmos path { fill:none; stroke:rgba(158,216,206,.22); stroke-width:.16; stroke-dasharray:1 1; }
.cosmos__heart { position:absolute; left:50%; top:48%; transform:translate(-50%,-50%); width:116px; aspect-ratio:1; border:1px solid rgba(199,213,218,.2); border-radius:50%; display:grid; place-content:center; text-align:center; box-shadow:0 0 42px rgba(120,168,194,.11); }
.cosmos__heart span { font-family:Georgia,serif; color:#fff; font-size:32px; }
.cosmos__heart small { color:var(--mineral); font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.cosmos__thread { --x:50%;--y:50%; position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); width:150px; color:#8299a2; border:0; background:none; cursor:pointer; text-align:center; }
.cosmos__thread i { display:block; width:7px; height:7px; margin:0 auto 7px; border-radius:50%; background:#547486; box-shadow:0 0 16px #547486; }
.cosmos__thread span { display:block; font-family:Georgia,serif; font-size:12px; line-height:1.2; }
.cosmos__thread small { font-size:8px; letter-spacing:.14em; text-transform:uppercase; color:#516975; }
.cosmos__thread.is-foreground { color:#e6efed; }
.cosmos__thread.is-foreground i { background:var(--ember); box-shadow:0 0 19px var(--ember); }
.cosmos__mind { position:absolute; right:calc(5% + (var(--i) % 2) * 7%); bottom:calc(7% + var(--i) * 7%); width:28px; height:28px; border:1px solid rgba(199,213,218,.25); border-radius:50%; background:var(--deep); color:var(--silver); cursor:pointer; }
.cosmos__empty { position:absolute; left:50%; top:67%; transform:translateX(-50%); color:#8299a2; font-family:Georgia,serif; text-align:center; line-height:1.8; }.cosmos__empty span{font:11px Inter,sans-serif;color:#566d77}
.possession__oracle { overflow:auto; padding:38px 30px 60px; border-left:1px solid rgba(199,213,218,.1); background:linear-gradient(145deg,rgba(13,30,43,.72),rgba(4,13,20,.9)); }
.oracle__head { padding-bottom:18px; border-bottom:1px solid rgba(199,213,218,.12); margin-bottom:22px; }
.oracle__head h2 { margin:5px 0 0; font-family:Georgia,serif; font-weight:400; font-size:30px; color:#f0f5f3; }
.possession__oracle>p { color:#8ba0a8; font-family:Georgia,serif; font-size:15px; line-height:1.65; }
.possession__oracle form { display:grid; gap:12px; margin-top:24px; }
.possession__oracle input,.possession__oracle textarea,.possession__oracle select { width:100%; box-sizing:border-box; border:1px solid rgba(199,213,218,.15); border-radius:3px; background:rgba(4,13,20,.72); color:#e8efed; padding:12px; outline:none; }
.possession__oracle textarea { min-height:112px; resize:vertical; font-family:Georgia,serif; font-size:16px; line-height:1.5; }
.possession__oracle input:focus,.possession__oracle textarea:focus,.possession__oracle select:focus { border-color:var(--mineral); box-shadow:0 0 0 2px rgba(120,168,194,.1); }
.oracle__row { display:flex; gap:9px; }.oracle__row input{min-width:0}.oracle__row button,.oracle__primary { flex:none; border:0; border-radius:3px; background:var(--ember); color:#190d0b; font-weight:600; padding:11px 14px; cursor:pointer; }
.oracle__primary { margin:16px 0; }.oracle__primary:disabled,.oracle__row button:disabled{opacity:.45}
.oracle__cards,.oracle__currents,.oracle__dreams { display:grid; gap:8px; margin-top:22px; }
.oracle__cards button,.oracle__currents article,.oracle__dreams article { border:1px solid rgba(199,213,218,.12); background:rgba(5,15,22,.46); color:var(--silver); padding:14px; text-align:left; }
.oracle__cards button { cursor:pointer; }.oracle__cards b,.oracle__cards span{display:block}.oracle__cards span,.oracle__currents p{margin-top:5px;color:#718791;font-size:10px}.oracle__currents h3{font-family:Georgia,serif;font-weight:400;font-size:15px;margin:5px 0}.oracle__currents article>span,.oracle__dreams span{font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--ember)}
.oracle__dreams p{font-family:Georgia,serif;color:#9fb0b5;line-height:1.5;margin:7px 0 0}.oracle__result{margin-top:20px;border-left:2px solid var(--phosphor);padding:12px;color:#a8c2c2;background:rgba(158,216,206,.04)}.oracle__result pre{white-space:pre-wrap;font:10px/1.5 ui-monospace,monospace;margin:0;max-height:260px;overflow:auto}
.time__now { margin:30px 0; display:flex; align-items:baseline; gap:12px; }.time__now span{font:56px Georgia,serif;color:#fff}.time__now small{color:var(--mineral);text-transform:uppercase;letter-spacing:.14em;font-size:9px}
.possession--loading { display:grid; place-items:center; }.possession__awakening{display:grid;place-items:center;gap:18px;color:var(--mineral);font:10px Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase}.possession__awakening i{width:60px;height:60px;border:1px solid var(--mineral);border-radius:50%;box-shadow:0 0 35px rgba(120,168,194,.3);animation:world-breathe 2s infinite}
@keyframes world-breathe { 50% { transform:scale(1.08); opacity:.72; } }
@media (prefers-reduced-motion:reduce){.cosmos__breath,.possession__awakening i{animation:none}}
@media (max-width:1000px){.possession__body{grid-template-columns:170px 1fr 340px}.possession__checksum{display:none}}
@media (max-width:760px){.possession{overflow:auto}.possession__bar{height:auto;grid-template-columns:auto 1fr;padding:12px}.possession__actions{grid-column:1/-1}.possession__body{height:auto;display:block}.possession__lenses{display:flex;overflow:auto;padding:8px;border-right:0}.possession__lens{min-width:150px}.possession__sky{height:58vh}.possession__oracle{border-left:0;border-top:1px solid rgba(199,213,218,.1);min-height:60vh}.possession__bar h1{font-size:18px}}
