:root{--bg:#0d0b24;--bg2:#15123a;--card:rgba(255,255,255,.045);--card2:rgba(255,255,255,.08);--line:rgba(224,189,120,.22);--gold:#e0bd78;--gold2:#f4dba3;--ink:#f2eee6;--mute:#a9a4c4;--ok:#7fd1a0;--danger:#e58a8a;--r:18px;--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:radial-gradient(1200px 700px at 80% -10%,#2b1d6e55,transparent 60%),radial-gradient(900px 600px at -10% 20%,#1c3a7a40,transparent 60%),var(--bg);color:var(--ink);font:16px/1.6 var(--sans);min-height:100vh}
#stars{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.6;background-image:radial-gradient(1px 1px at 20% 30%,#fff8,transparent),radial-gradient(1px 1px at 70% 20%,#fff6,transparent),radial-gradient(1.5px 1.5px at 40% 80%,#e0bd78aa,transparent),radial-gradient(1px 1px at 85% 65%,#fff6,transparent),radial-gradient(1px 1px at 10% 70%,#fff5,transparent);background-size:420px 420px}
#app{position:relative;z-index:1;display:flex;min-height:100vh}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:600;letter-spacing:.2px;line-height:1.2}
h1{font-size:2rem;margin:.2em 0 .3em}h2{font-size:1.45rem;margin:1.6em 0 .6em}h3{font-size:1.1rem;margin:1.2em 0 .4em}
a{color:var(--gold2)}p{margin:.6em 0}
.gold{color:var(--gold)}.mute{color:var(--mute)}.small{font-size:.86rem}.center{text-align:center}
.kicker{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
/* layout */
.side{width:250px;flex:none;position:sticky;top:0;height:100vh;padding:22px 14px;border-right:1px solid var(--line);background:#0a0820cc;backdrop-filter:blur(8px);overflow:auto;display:none}
.side .brand{font-family:var(--serif);font-size:1.15rem;color:var(--gold2);padding:4px 10px 18px}
.side .grp{font-size:.68rem;letter-spacing:.16em;color:var(--mute);margin:18px 10px 6px;text-transform:uppercase}
.nav-a{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;color:var(--ink);text-decoration:none;font-size:.95rem}
.nav-a:hover{background:var(--card)}.nav-a.on{background:linear-gradient(90deg,#e0bd7826,transparent);color:var(--gold2);box-shadow:inset 2px 0 0 var(--gold)}
.nav-a .ic{width:22px;text-align:center;color:var(--gold)}
.main-wrap{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;position:sticky;top:0;z-index:5;background:#0d0b24d9;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .brand{font-family:var(--serif);color:var(--gold2)}
.pill{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:.84rem;background:var(--card)}
#view{padding:20px 18px 110px;max-width:960px;width:100%;margin:0 auto;outline:none}
.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:6;display:flex;justify-content:space-around;background:#0a0820f2;backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.tabbar a{flex:1;text-align:center;color:var(--mute);text-decoration:none;font-size:.7rem;padding:6px 2px;border-radius:10px}
.tabbar a .ic{display:block;font-size:1.25rem;line-height:1.1;color:inherit}.tabbar a.on{color:var(--gold2)}
@media(min-width:900px){.side{display:block}.tabbar{display:none}#view{padding:34px 36px 60px}}
/* cards */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin:14px 0}
.card.glow{background:linear-gradient(160deg,#2b1d6e55,#15123a88);box-shadow:0 10px 40px #0006}
.grid{display:grid;gap:14px}.g2{grid-template-columns:1fr}.g3{grid-template-columns:1fr}
@media(min-width:700px){.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:1fr 1fr 1fr}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font:600 .98rem var(--sans);padding:13px 22px;border-radius:999px;background:linear-gradient(180deg,var(--gold2),var(--gold));color:#2a1d05;text-decoration:none;min-height:46px;transition:transform .15s,filter .15s}
.btn:hover{filter:brightness(1.07)}.btn:active{transform:scale(.98)}
.btn.ghost{background:transparent;color:var(--gold2);border:1px solid var(--line)}.btn.ghost:hover{background:var(--card)}
.btn.sm{padding:8px 16px;min-height:36px;font-size:.88rem}.btn.block{width:100%}.btn[disabled]{opacity:.45;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.sp{justify-content:space-between}
input,textarea,select{width:100%;font:inherit;color:var(--ink);background:#0a0820;border:1px solid var(--line);border-radius:12px;padding:12px 14px;outline:none}
input:focus,textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px #e0bd7826}
textarea{min-height:140px;resize:vertical;line-height:1.6}
label{display:block;font-size:.85rem;color:var(--mute);margin:12px 0 6px}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:9px 15px;cursor:pointer;font:inherit;font-size:.92rem}
.chip.on{background:var(--gold);color:#2a1d05;border-color:var(--gold)}
.bar{height:8px;border-radius:99px;background:#ffffff14;overflow:hidden}.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));border-radius:99px;transition:width .5s}
/* login */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;z-index:1}
.login .box{max-width:420px;width:100%;text-align:center}
.sigil{width:84px;height:84px;margin:0 auto 14px;display:block;filter:drop-shadow(0 0 18px #e0bd7866)}
/* hero */
.hero h1{font-size:2.1rem}
.ring{--p:0;width:112px;height:112px;border-radius:50%;background:conic-gradient(var(--gold) calc(var(--p)*1%),#ffffff14 0);display:grid;place-items:center;flex:none}
.ring>div{width:92px;height:92px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;text-align:center;line-height:1.1}
.ring b{font:600 1.6rem var(--serif);color:var(--gold2)}
/* trail */
.trail{display:flex;align-items:center;overflow-x:auto;padding:8px 2px 14px;gap:0;scrollbar-width:none}
.trail::-webkit-scrollbar{display:none}
.node{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line);background:var(--bg2);color:var(--mute);font:600 1.05rem var(--serif);text-decoration:none;position:relative}
.node.done{background:var(--gold);color:#2a1d05;border-color:var(--gold)}
.node.cur{border-color:var(--gold2);color:var(--gold2);box-shadow:0 0 0 5px #e0bd7822,0 0 24px #e0bd7855;animation:pulse 2.4s infinite}
.link{flex:none;width:22px;height:2px;background:var(--line)}.link.done{background:var(--gold)}
@keyframes pulse{50%{box-shadow:0 0 0 9px #e0bd7811,0 0 32px #e0bd7866}}
/* session list */
.sess{display:flex;gap:14px;align-items:center;text-decoration:none;color:inherit}
.sess .num{flex:none;width:46px;height:46px;border-radius:14px;background:var(--card2);display:grid;place-items:center;font:600 1.3rem var(--serif);color:var(--gold2)}
.sess.done .num{background:var(--gold);color:#2a1d05}
.hz{font-size:.78rem;color:var(--gold);letter-spacing:.08em}
.tag{display:inline-block;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);color:var(--gold);padding:2px 10px;border-radius:99px}
.tag.ok{color:var(--ok);border-color:#7fd1a055}
/* player */
.player{text-align:center}
.modes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.mode{border:1px solid var(--line);background:var(--card);border-radius:14px;padding:14px;cursor:pointer;color:var(--ink);text-align:left;font:inherit}
.mode.on{border-color:var(--gold);background:#e0bd7814}.mode b{display:block;color:var(--gold2)}.mode span{font-size:.82rem;color:var(--mute)}
.notice{border:1px dashed var(--line);border-radius:12px;padding:10px 14px;font-size:.88rem;color:var(--mute);background:#ffffff08;margin:10px 0}
audio{width:100%;margin:8px 0;color-scheme:dark}
.orb{width:120px;height:120px;margin:10px auto;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--gold2),var(--gold) 45%,#7a5a1f);box-shadow:0 0 50px #e0bd7855}
.orb.play{animation:breath 6s ease-in-out infinite}
@keyframes breath{50%{transform:scale(1.18);box-shadow:0 0 90px #e0bd7899}}
ul.chk{list-style:none;padding:0;margin:0}ul.chk li{padding:6px 0 6px 28px;position:relative}ul.chk li:before{content:"✦";position:absolute;left:0;color:var(--gold)}
.today li{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.today li:last-child{border:0}
.dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center;font-size:.75rem}.dot.on{background:var(--ok);border-color:var(--ok);color:#06210f}
/* ritual / modal */
.modal{position:fixed;inset:0;z-index:20;background:radial-gradient(900px 600px at 50% 0,#2b1d6e,#07061a);display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}
.modal[hidden]{display:none}
.mbox{max-width:560px;width:100%;margin:auto;text-align:center}
.mbox.wide{max-width:720px;text-align:left}
.he{font:600 1.7rem/1.9 "Times New Roman","SBL Hebrew","Ezra SIL",serif;direction:rtl;color:var(--gold2);margin:14px 0}
.tr{font-style:italic;color:var(--ink)}
.close{position:absolute;top:14px;right:16px;background:none;border:0;color:var(--mute);font-size:1.7rem;cursor:pointer}
.steps{display:flex;gap:6px;justify-content:center;margin-bottom:14px}.steps i{width:26px;height:4px;border-radius:9px;background:#ffffff22}.steps i.on{background:var(--gold)}
.opt{display:block;width:100%;text-align:left;margin:8px 0;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;font:inherit}
.opt:hover{border-color:var(--gold);background:#e0bd780f}.opt b{display:block;font-family:var(--serif);font-size:1.05rem}.opt span{font-size:.84rem;color:var(--mute)}
.tap{width:130px;height:130px;border-radius:50%;margin:16px auto;border:2px solid var(--gold);background:radial-gradient(circle,#e0bd7822,transparent 70%);color:var(--gold2);font:600 2.4rem var(--serif);cursor:pointer;display:grid;place-items:center}
.tap small{display:block;font:.7rem var(--sans);color:var(--mute);letter-spacing:.1em}
.cardview{min-height:200px;display:flex;align-items:center;justify-content:center;text-align:center;font:1.35rem/1.55 var(--serif);padding:30px 22px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,#2b1d6e66,#15123a)}
/* journal */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:8px}.cal b{font-size:.7rem;color:var(--mute);text-align:center;font-weight:500}
.day{aspect-ratio:1;border-radius:12px;border:1px solid transparent;background:var(--card);color:var(--ink);cursor:pointer;font:inherit;position:relative}
.day.sel{border-color:var(--gold);background:#e0bd7822}.day.today{color:var(--gold2);font-weight:700}.day.has:after{content:"";position:absolute;bottom:6px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--gold)}.day.off{visibility:hidden}
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin:14px 0}.tabs button{background:none;border:0;color:var(--mute);padding:10px 14px;cursor:pointer;font:inherit;border-bottom:2px solid transparent}.tabs button.on{color:var(--gold2);border-color:var(--gold)}
.stars{display:flex;gap:6px}.stars button{background:none;border:0;font-size:1.6rem;color:#ffffff30;cursor:pointer}.stars button.on{color:var(--gold)}
/* community */
.post .who{display:flex;gap:10px;align-items:center}.av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#4a2fb0,var(--gold));display:grid;place-items:center;font-weight:700;font-size:.85rem;color:#fff}
.react{background:var(--card);border:1px solid var(--line);border-radius:99px;color:var(--ink);padding:5px 12px;cursor:pointer;font:inherit;font-size:.86rem}.react.on{border-color:var(--gold);background:#e0bd781a}
.reply{margin:10px 0 0 20px;padding-left:12px;border-left:2px solid var(--line);font-size:.92rem}
.lock{filter:grayscale(.3)}
.rich h3{color:var(--gold2)}.rich ol,.rich ul{padding-left:22px}.rich li{margin:4px 0}
.badge{text-align:center;padding:14px 8px;border-radius:16px;border:1px solid var(--line);background:var(--card)}.badge i{font-style:normal;font-size:1.7rem;display:block;color:var(--gold)}.badge.off{opacity:.35;filter:grayscale(1)}.badge small{color:var(--mute);display:block;font-size:.72rem}
.toast{position:fixed;left:50%;bottom:92px;transform:translate(-50%,20px);background:#1d1752;border:1px solid var(--gold);color:var(--ink);padding:10px 18px;border-radius:99px;opacity:0;pointer-events:none;transition:.3s;z-index:40;max-width:90vw;text-align:center;font-size:.9rem}
.toast.show{opacity:1;transform:translate(-50%,0)}
.breath{width:150px;height:150px;margin:22px auto;border-radius:50%;background:radial-gradient(circle,var(--gold2),var(--gold) 60%,#7a5a1f);transition:transform 4s ease-in-out;display:grid;place-items:center;color:#2a1d05;font-weight:700}
.back{display:inline-block;color:var(--mute);text-decoration:none;font-size:.9rem;margin-bottom:6px}
.gview{background:#fff;color:#1b1738;border-radius:var(--r);padding:26px}.gview h1,.gview h3{color:#2a1b6b}
@media print{body *{visibility:hidden}.gview,.gview *{visibility:visible}.gview{position:absolute;inset:0;border-radius:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}