https://www.pandoraburo.ru/taro-sonnik-i-vse-tipy-gadaniya
Таро, сонник, все типы гадания + теория вероятности (физика и математика)
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Мистический салон — с байесовским анализом</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="crossorigin" />
<link href="https://fonts.googleapis.com/css2?family=Cormorant:wght@500;600;700&family=Manrope:wght@400;600;800&family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet" />
<style>
:root{
--bg:#0d0a1c; --ink:#efe9dc; --dim:#a79ec9;
--gold:#d9b45c; --gold2:#f0d68a; --vio:#8f6bff; --vio2:#5b3fa8;
--parch:#f1e3c0; --inkp:#3a2c1a; --cyan:#5eead4;
--disp:'Cormorant',serif; --body:'Manrope',sans-serif; --mono:'JetBrains Mono',monospace;
--cw:110px; --ch:180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--bg);color:var(--ink);overflow-x:hidden;min-height:100vh;
background-image:radial-gradient(1000px 520px at 80% -10%,rgba(91,63,168,.28),transparent 60%),
radial-gradient(800px 500px at -10% 40%,rgba(217,180,92,.08),transparent 60%),
radial-gradient(900px 600px at 55% 110%,rgba(91,63,168,.18),transparent 60%);
background-attachment:fixed;}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:70;opacity:.05;mix-blend-mode:overlay;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none}
#lightningCanvas{position:fixed;inset:0;z-index:1;pointer-events:none}
#particlesCanvas{position:fixed;inset:0;z-index:2;pointer-events:none}
#screenFlash{position:fixed;inset:0;z-index:69;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.85),rgba(200,220,255,.4) 40%,transparent 80%);transition:opacity .08s}
#screenFlash.go{animation:screenFlash .6s ease-out}
@keyframes screenFlash{0%{opacity:.9}100%{opacity:0}}
.nebula{position:fixed;border-radius:50%;filter:blur(100px);pointer-events:none;z-index:0;opacity:0.3;animation:nebulaDrift 30s infinite alternate ease-in-out;}
.nebula1{width:600px;height:600px;background:radial-gradient(#8f6bff,transparent);top:-10%;left:-10%;animation-duration:35s;}
.nebula2{width:500px;height:500px;background:radial-gradient(#d9b45c,transparent);bottom:-5%;right:-5%;animation-duration:40s;animation-delay:-10s;}
.nebula3{width:400px;height:400px;background:radial-gradient(#5b3fa8,transparent);top:40%;left:60%;animation-duration:30s;animation-delay:-5s;}
@keyframes nebulaDrift{0%{transform:translate(0,0) scale(1)}100%{transform:translate(80px,-60px) scale(1.2)}}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px;position:relative;z-index:1}
h1,h2,h3,h4{font-family:var(--disp);font-weight:600;letter-spacing:.5px}
button,input,textarea,select{font-family:var(--body)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
.hdr{text-align:center;padding:48px 0 24px}
.kick{font-size:11px;letter-spacing:4px;color:var(--gold);text-transform:uppercase;margin-bottom:12px}
.hdr h1{font-size:clamp(36px,6vw,64px);line-height:1;color:var(--gold2);text-shadow:0 0 30px rgba(217,180,92,.35)}
.hdr h1 em{font-style:italic;color:var(--vio)}
.hdr .sub{margin-top:12px;color:var(--dim);font-size:16px;max-width:52ch;margin-inline:auto}
.navchips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.navchips a{font-size:12px;letter-spacing:2px;text-transform:uppercase;text-decoration:none;color:var(--ink);border:1px solid rgba(143,107,255,.5);border-radius:999px;padding:9px 18px;transition:.25s;cursor:pointer}
.navchips a:hover,.navchips a.on{background:var(--vio2);border-color:var(--vio);transform:translateY(-2px)}
.divider{display:flex;align-items:center;gap:14px;color:var(--gold);margin:30px 0 20px;font-size:18px}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(217,180,92,.6),transparent)}
.section{display:none;animation:fadeUp 0.5s ease}
.section.active{display:block}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
/* ══════════════════════════════════════
ПЛАШКА ВЕРОЯТНОСТНОГО АНАЛИЗА
══════════════════════════════════════ */
.prob-panel{
margin:20px 0;padding:20px 24px;
background:linear-gradient(135deg,rgba(94,234,212,0.06),rgba(143,107,255,0.04));
border:1px solid rgba(94,234,212,0.25);
border-radius:16px;
position:relative;overflow:hidden;
}
.prob-panel::before{
content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;
background:radial-gradient(circle,rgba(94,234,212,0.12),transparent 70%);
pointer-events:none;
}
.prob-header{
display:flex;align-items:center;gap:10px;margin-bottom:14px;
font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;
color:var(--cyan);
}
.prob-header .dot{width:8px;height:8px;background:var(--cyan);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;box-shadow:0 0 8px var(--cyan)}50%{opacity:.5;box-shadow:0 0 16px var(--cyan)}}
.prob-title{font-family:var(--disp);font-size:18px;color:var(--gold2);margin-bottom:4px;font-style:italic}
.prob-subtitle{font-size:12px;color:var(--dim);margin-bottom:14px}
.prob-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:14px}
.prob-stat{
background:rgba(20,14,44,0.5);
border:1px solid rgba(94,234,212,0.15);
border-radius:10px;padding:10px 12px;
}
.prob-stat .lbl{font-size:10px;color:var(--dim);letter-spacing:1px;text-transform:uppercase;margin-bottom:4px;font-family:var(--mono)}
.prob-stat .val{font-family:var(--mono);font-size:20px;font-weight:700;color:var(--gold2);line-height:1}
.prob-stat .val small{font-size:11px;color:var(--dim);font-weight:400}
.prob-stat .note{font-size:10px;color:var(--dim);margin-top:2px}
.prob-insight{
background:rgba(217,180,92,0.08);
border-left:3px solid var(--gold);
padding:10px 14px;border-radius:0 8px 8px 0;
font-size:13px;color:var(--ink);line-height:1.5;
}
.prob-insight b{color:var(--gold2);font-family:var(--disp);font-size:14px}
.prob-formula{
font-family:var(--mono);font-size:12px;color:var(--cyan);
background:rgba(10,6,18,0.6);padding:6px 12px;border-radius:6px;
display:inline-block;margin-top:8px;
}
.tbar{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.tbar h2{font-size:clamp(28px,4vw,42px);color:var(--gold2)}
.sbtns{display:flex;gap:8px;flex-wrap:wrap}
.sbtn{background:transparent;border:1px solid rgba(217,180,92,.55);color:var(--gold2);border-radius:999px;padding:9px 16px;font-size:13px;cursor:pointer;transition:.25s}
.sbtn:hover{transform:translateY(-2px);background:rgba(217,180,92,.12)}
.sbtn.on{background:var(--gold);color:#241448;border-color:var(--gold);box-shadow:0 0 18px rgba(217,180,92,.5)}
.ttable{position:relative;height:400px;border:1px solid rgba(143,107,255,.35);border-radius:20px;overflow:hidden;
background:radial-gradient(700px 340px at 50% 0%,#241a52,#120d2e 75%);box-shadow:0 24px 60px rgba(0,0,0,.55),inset 0 0 80px rgba(0,0,0,.5)}
.tring{position:absolute;left:50%;top:50%;width:480px;height:480px;margin:-240px 0 0 -240px;border-radius:50%;opacity:.12;pointer-events:none;
background:repeating-conic-gradient(var(--gold) 0 2deg,transparent 2deg 15deg);animation:slowspin 60s linear infinite}
@keyframes slowspin{to{transform:rotate(360deg)}}
.candle{position:absolute;bottom:12px;width:8px;height:40px;background:linear-gradient(#f7e9c4,#caa64e);border-radius:4px;pointer-events:none}
.candle::before{content:"";position:absolute;left:50%;top:-14px;width:10px;height:16px;margin-left:-5px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(#fff8d8,#ffb648 60%,transparent 75%);animation:flick .35s ease-in-out infinite alternate}
.candle::after{content:"";position:absolute;left:50%;top:-40px;width:80px;height:80px;margin-left:-40px;background:radial-gradient(rgba(255,182,72,.25),transparent 70%);animation:flick .5s ease-in-out infinite alternate}
@keyframes flick{from{transform:scale(1) rotate(-2deg)}to{transform:scale(1.15) rotate(3deg)}}
.cl{left:24px}.cr{right:24px}
.deckzone{position:absolute;left:3%;top:50%;transform:translateY(-50%);width:var(--cw);height:var(--ch);z-index:2}
.dback{position:absolute;inset:0;border-radius:12px;border:2px solid var(--gold);background:radial-gradient(circle at 50% 45%,#3b2a78,#241448 72%);box-shadow:-4px 4px 0 #17102f,-8px 8px 0 #100a24,0 12px 30px rgba(0,0,0,.6);transition:transform 0.4s ease, box-shadow 0.4s ease}
.deckzone:hover .dback{transform:scale(1.03) rotate(2deg);box-shadow:-4px 4px 0 #17102f,-8px 8px 0 #100a24,0 20px 40px rgba(0,0,0,.8)}
.dback::before{content:"";position:absolute;inset:8px;border:1px solid rgba(240,214,138,.5);border-radius:8px}
.dback::after{content:"✶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:38px;color:var(--gold2);text-shadow:0 0 16px rgba(240,214,138,.9)}
.dcount{position:absolute;left:50%;bottom:-28px;transform:translateX(-50%);font-size:10px;letter-spacing:2px;color:var(--dim)}
#marks{position:absolute;inset:0}
.smark{position:absolute;width:var(--cw);height:var(--ch);transform:translate(-50%,-50%);border:2px dashed rgba(240,214,138,.3);border-radius:12px;display:flex;align-items:flex-end;justify-content:center}
.smark .sl{position:absolute;bottom:-24px;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.tcard{position:absolute;width:var(--cw);height:var(--ch);perspective:1000px;z-index:3;cursor:pointer;
transition:left .8s cubic-bezier(.25,.8,.3,1),top .8s cubic-bezier(.25,.8,.3,1),opacity .6s, transform .6s;
transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotate(var(--rot,0deg)) scale(var(--sc,1));
}
.tcard:hover{filter:drop-shadow(0 0 20px rgba(217,180,92,0.6));transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotate(var(--rot,0deg)) translateY(-6px) scale(1.02);}
.tfl{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .75s cubic-bezier(.3,.7,.2,1)}
.tcard.up .tfl{transform:rotateY(180deg)}
.tface{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px;border:2px solid var(--gold);overflow:hidden}
.tback{background:radial-gradient(circle at 50% 45%,#3b2a78,#241448 72%)}
.tback::before{content:"";position:absolute;inset:8px;border:1px solid rgba(240,214,138,.5);border-radius:8px}
.tback::after{content:"✶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:36px;color:var(--gold2);text-shadow:0 0 16px rgba(240,214,138,.9)}
.tfront{transform:rotateY(180deg);background:linear-gradient(180deg,#2c1f60,#180f3a);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:10px 8px;text-align:center}
.tfront::before{content:"";position:absolute;inset:6px;border:1px solid rgba(240,214,138,.4);border-radius:8px;pointer-events:none}
.tfront .rn{font-family:var(--disp);font-size:13px;color:var(--gold);letter-spacing:2px}
.tfront .g{font-size:42px;filter:drop-shadow(0 0 10px rgba(240,214,138,.5));transition:transform .5s}
.tcard.rev .tfront .g{transform:rotate(180deg)}
.tfront .n{font-family:var(--disp);font-size:14px;color:#fff;line-height:1.1}
.tfront .rv{position:absolute;top:6px;right:6px;font-size:9px;color:#0d0a1c;background:var(--gold);border-radius:4px;padding:2px 5px;display:none}
.tcard.rev .rv{display:block}
.log{margin-top:36px;background:var(--parch);color:var(--inkp);border-radius:6px;padding:24px 28px;position:relative;box-shadow:0 20px 50px rgba(0,0,0,.5);
background-image:repeating-linear-gradient(0deg,rgba(58,44,26,.04) 0 1px,transparent 1px 24px)}
.log::before{content:"❦";position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--parch);padding:0 12px;font-size:18px;color:#8a6a2c}
.log h3{font-size:22px;color:#6d4a12;margin-bottom:8px}
.lline{font-size:15px;line-height:1.55;margin-bottom:6px;min-height:1em}
.lline b{font-family:var(--disp);font-size:16px;color:#6d4a12}
.lline .pos{letter-spacing:2px;font-size:9px;text-transform:uppercase;color:#8a6a2c;border:1px solid #c9a15c;border-radius:4px;padding:2px 6px;margin-right:6px;vertical-align:2px}
.log .empty{color:#8a7355;font-style:italic}
.caret{display:inline-block;width:7px;height:13px;background:#6d4a12;vertical-align:-2px;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.dream-panel{border:1px solid rgba(143,107,255,.35);border-radius:20px;background:rgba(20,14,44,.6);padding:28px;box-shadow:0 18px 44px rgba(0,0,0,.4);position:relative;overflow:hidden}
.dream-panel::before{content:"☾";position:absolute;right:-10px;top:-20px;font-size:140px;color:rgba(217,180,92,.06);pointer-events:none}
.dream-panel h2{font-size:clamp(26px,4vw,38px);color:var(--gold2);margin-bottom:6px}
.dream-panel .hint{color:var(--dim);font-size:14px;margin-bottom:18px}
.search-wrap{position:relative;margin-bottom:16px}
.search-wrap input{width:100%;background:#171034;border:2px solid rgba(217,180,92,.4);color:var(--ink);border-radius:12px;padding:14px 48px 14px 18px;font-size:16px;transition:border-color .2s}
.search-wrap input:focus{border-color:var(--gold);outline:none}
.search-wrap input::placeholder{color:#6b6390}
.search-wrap .ico{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:20px;color:var(--gold);pointer-events:none}
.search-wrap .clear{position:absolute;right:44px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--dim);font-size:18px;cursor:pointer;display:none;padding:4px}
.search-wrap .clear.show{display:block}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.tag{font-size:12px;border:1px solid rgba(143,107,255,.4);border-radius:999px;padding:5px 12px;color:var(--dim);cursor:pointer;transition:.2s;background:transparent}
.tag:hover,.tag.on{background:var(--vio2);border-color:var(--vio);color:var(--ink)}
.results{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;max-height:420px;overflow-y:auto;padding-right:4px}
.results::-webkit-scrollbar{width:6px}
.results::-webkit-scrollbar-thumb{background:var(--vio2);border-radius:3px}
.rcard{border:1px solid rgba(217,180,92,.3);border-radius:12px;padding:14px 16px;background:rgba(36,26,82,.4);transition:.25s;cursor:pointer;animation:fadeUp 0.3s ease forwards; opacity:0}
.rcard:nth-child(1){animation-delay:0.02s}.rcard:nth-child(2){animation-delay:0.04s}.rcard:nth-child(3){animation-delay:0.06s}
.rcard:hover{border-color:var(--gold);background:rgba(217,180,92,.08);transform:translateY(-2px)}
.rcard .sym{font-size:24px;margin-right:8px;vertical-align:middle}
.rcard .kw{font-family:var(--disp);font-size:17px;color:var(--gold2);vertical-align:middle}
.rcard .txt{font-size:13.5px;color:var(--dim);margin-top:6px;line-height:1.5;display:none}
.rcard.open .txt{display:block}
.rcard.open{border-color:var(--gold);background:rgba(217,180,92,.1)}
.no-res{text-align:center;color:var(--dim);padding:30px;font-style:italic}
.day-sym{margin-top:24px;border-top:1px dashed rgba(217,180,92,.3);padding-top:18px;display:flex;gap:16px;align-items:flex-start}
.day-sym .ds-icon{font-size:40px;flex-shrink:0;filter:drop-shadow(0 0 10px rgba(217,180,92,.5))}
.day-sym .ds-body h4{font-family:var(--disp);font-size:18px;color:var(--gold2);margin-bottom:4px}
.day-sym .ds-body p{font-size:13.5px;color:var(--dim);line-height:1.5}
.day-sym .ds-btn{margin-top:8px;background:none;border:1px solid rgba(217,180,92,.4);color:var(--gold);border-radius:8px;padding:6px 14px;font-size:11px;cursor:pointer;transition:.2s;letter-spacing:1px}
.day-sym .ds-btn:hover{background:rgba(217,180,92,.12);border-color:var(--gold)}
.play-card-table{position:relative;height:400px;border:1px solid rgba(143,107,255,.35);border-radius:20px;overflow:hidden;
background:radial-gradient(700px 340px at 50% 0%,#241a52,#120d2e 75%);box-shadow:0 24px 60px rgba(0,0,0,.55),inset 0 0 80px rgba(0,0,0,.5)}
.pcard{position:absolute;width:80px;height:120px;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.6);transition:left .8s cubic-bezier(.25,.8,.3,1),top .8s cubic-bezier(.25,.8,.3,1),opacity .6s, transform .6s;cursor:pointer;border:2px solid var(--gold);}
.pcard .inner{transform-style:preserve-3d;transition:transform .6s;width:100%;height:100%;position:relative}
.pcard.flipped .inner{transform:rotateY(180deg)}
.pcard .front, .pcard .back{position:absolute;inset:0;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.pcard .front{background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotateY(180deg)}
.pcard .front .rank{font-size:20px;margin-bottom:4px;font-weight:bold}
.pcard .front .suit{font-size:32px}
.pcard .front .corner{position:absolute;top:4px;left:6px;font-size:12px;display:flex;flex-direction:column;align-items:center;font-weight:bold}
.pcard .front .corner-bottom{position:absolute;bottom:4px;right:6px;font-size:12px;display:flex;flex-direction:column;align-items:center;transform:rotate(180deg);font-weight:bold}
.pcard.red .front{color:#d32f2f}
.pcard.black .front{color:#222}
.pcard .back{background:radial-gradient(circle at 50% 45%,#3b2a78,#241448 72%);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:36px;color:var(--gold2)}
.pcard .back::after{content:"✶";text-shadow:0 0 10px rgba(240,214,138,.8)}
.coffee-area{display:flex;flex-wrap:wrap;gap:30px;align-items:center;justify-content:center;padding:20px 0}
.cup-container{position:relative;width:200px;height:200px;perspective:800px;cursor:pointer}
.cup{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform 1.2s cubic-bezier(.4,.2,.2,1)}
.cup.flipped{transform:rotateX(180deg)}
.cup-front,.cup-back{position:absolute;inset:0;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;backface-visibility:hidden;border:4px solid var(--gold);overflow:hidden}
.cup-front{background:radial-gradient(#f5e6d3,#c9a87c);display:flex;align-items:center;justify-content:center;font-size:60px;color:#4a2f1a;box-shadow:inset 0 -20px 40px rgba(0,0,0,.2)}
.cup-front .handle{position:absolute;right:-20px;top:40px;width:30px;height:60px;border-radius:0 20px 20px 0;border:4px solid #c9a87c;border-left:none;background:radial-gradient(#f5e6d3,#c9a87c)}
.cup-back{transform:rotateY(180deg);background:#2c1a0e;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;padding:20px;gap:6px;color:var(--gold2);font-size:30px;box-shadow:inset 0 0 60px rgba(0,0,0,.8),0 0 60px rgba(217,180,92,.4);animation:cupGlow 2s ease-in-out infinite alternate}
@keyframes cupGlow{0%{box-shadow:inset 0 0 60px rgba(0,0,0,.8),0 0 40px rgba(217,180,92,.3)}100%{box-shadow:inset 0 0 60px rgba(0,0,0,.8),0 0 80px rgba(217,180,92,.6)}}
.cup-back .pattern{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;font-size:28px;opacity:0.9;text-shadow:0 0 10px rgba(217,180,92,.3);animation:patternReveal 1s ease-out}
@keyframes patternReveal{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
.steam-wrap{position:absolute;left:50%;bottom:60%;width:0;height:0;pointer-events:none}
.steam-wrap div{position:absolute;width:6px;height:60px;background:linear-gradient(to top,rgba(255,255,255,.4),transparent);border-radius:50%;filter:blur(4px);animation:steamRise 3s ease-in infinite;opacity:0}
.cup.flipped ~ .steam-wrap div{opacity:.6}
.steam-wrap div:nth-child(1){left:-15px;animation-delay:0s}
.steam-wrap div:nth-child(2){left:0;animation-delay:.5s}
.steam-wrap div:nth-child(3){left:15px;animation-delay:1s}
@keyframes steamRise{0%{transform:translateY(0) scale(1);opacity:0}30%{opacity:.6}100%{transform:translateY(-80px) scale(2);opacity:0}}
.coffee-interp{flex:1;min-width:200px;background:rgba(20,14,44,.6);padding:20px;border-radius:16px;border:1px solid rgba(217,180,92,.3)}
.coffee-interp h4{color:var(--gold2);font-family:var(--disp);font-size:24px;margin-bottom:10px}
.coffee-interp p{color:var(--dim);line-height:1.6}
.runes-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:20px 0}
.rune-symbol{width:50px;height:60px;background:#1a1230;border:1px solid rgba(217,180,92,.3);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:18px;color:var(--gold);transition:.3s;cursor:pointer;position:relative;overflow:hidden}
.rune-symbol::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(217,180,92,.3),transparent 70%);opacity:0;transition:opacity .3s}
.rune-symbol:hover{background:#2f1f5a;border-color:var(--gold);transform:scale(1.05);box-shadow:0 0 20px rgba(217,180,92,.5)}
.rune-symbol:hover::before{opacity:1}
.rune-symbol .rune-name{font-size:8px;color:var(--dim);letter-spacing:1px;margin-top:2px}
.rune-result{text-align:center;padding:20px;background:rgba(20,14,44,.6);border-radius:16px;border:1px solid rgba(217,180,92,.3);margin-top:20px;transition:box-shadow .5s}
.rune-result.flash{box-shadow:0 0 60px rgba(217,180,92,.8),inset 0 0 30px rgba(217,180,92,.3);animation:runeFlash .6s ease-out}
@keyframes runeFlash{0%{box-shadow:0 0 80px rgba(217,180,92,1),inset 0 0 60px rgba(217,180,92,.5)}100%{box-shadow:0 0 0 rgba(217,180,92,0),inset 0 0 0 rgba(217,180,92,0)}}
.rune-result .big-rune{font-size:60px;color:var(--gold2);display:block;margin-bottom:8px;text-shadow:0 0 30px rgba(217,180,92,.7);animation:runeGlow 2s ease-in-out infinite alternate}
@keyframes runeGlow{from{text-shadow:0 0 20px rgba(217,180,92,.5)}to{text-shadow:0 0 40px rgba(217,180,92,1)}}
.rune-result h4{font-family:var(--disp);color:var(--gold2);font-size:22px}
.rune-result p{color:var(--dim);margin-top:6px}
.wheel-wrap{display:flex;flex-direction:column;align-items:center;gap:20px;position:relative}
.wheel-canvas-wrap{position:relative;width:300px;height:300px}
#wheelCanvas{width:100%;height:100%;border-radius:50%;box-shadow:0 0 40px rgba(217,180,92,.4),0 0 80px rgba(143,107,255,.3),inset 0 0 40px rgba(0,0,0,.5);transition:box-shadow .5s}
#wheelCanvas.stopped{box-shadow:0 0 80px rgba(217,180,92,.9),0 0 120px rgba(240,214,138,.6),inset 0 0 40px rgba(0,0,0,.5);animation:wheelPulse 1s ease-out}
@keyframes wheelPulse{0%{transform:scale(1.05)}100%{transform:scale(1)}}
.wheel-btn{padding:10px 30px;background:var(--gold);color:#241448;border:none;border-radius:999px;font-size:18px;font-weight:bold;cursor:pointer;transition:.3s;box-shadow:0 0 20px rgba(217,180,92,.4)}
.wheel-btn:hover{transform:scale(1.05);box-shadow:0 0 40px rgba(217,180,92,.6)}
.wheel-result{margin-top:10px;text-align:center;font-size:18px;color:var(--gold2);min-height:2em}
footer{padding:40px 0 60px;text-align:center;color:var(--dim);font-size:13px}
footer .fx{color:var(--gold);font-size:18px;display:inline-block;margin-bottom:8px;animation:slowspin 30s linear infinite}
/* ══════════════════════════════════════
ЗАСТАВКА (починенная)
══════════════════════════════════════ */
#introCanvas{
position:fixed;inset:0;z-index:99999;
display:block;background:#0d0a1c;
transition:opacity 0.8s ease;
}
#introSkip{
position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:100000;
background:rgba(217,180,92,0.15);color:#f0d68a;
padding:10px 24px;border-radius:24px;
font-size:12px;letter-spacing:3px;
border:1px solid rgba(217,180,92,0.5);cursor:pointer;
backdrop-filter:blur(8px);
transition:all 0.3s;
font-family:var(--mono);
}
#introSkip:hover{background:rgba(217,180,92,0.3);transform:translateX(-50%) translateY(-2px)}
@media(max-width:760px){
:root{--cw:88px;--ch:144px}
.ttable{height:340px}
.tfront .g{font-size:30px}
.tfront .n{font-size:12px}
.results{grid-template-columns:1fr}
.day-sym{flex-direction:column;align-items:center;text-align:center}
.play-card-table{height:340px}
.pcard{width:64px;height:96px}
.pcard .front .rank{font-size:16px}
.pcard .front .suit{font-size:24px}
.cup-container{width:150px;height:150px}
.wheel-canvas-wrap{width:220px;height:220px}
.prob-grid{grid-template-columns:repeat(2,1fr)}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}}
</style>
</head>
<body>
<canvas id="stars"></canvas>
<canvas id="lightningCanvas"></canvas>
<canvas id="particlesCanvas"></canvas>
<div id="screenFlash"></div>
<div class="nebula nebula1"></div>
<div class="nebula nebula2"></div>
<div class="nebula nebula3"></div>
<canvas id="introCanvas"></canvas>
<button id="introSkip">ПРОПУСТИТЬ ✕</button>
<header class="wrap hdr">
<div class="kick">✦ мистический салон ✦</div>
<h1>Все <em>гадания</em></h1>
<p class="sub">Шесть древних языков подсознания + современный байесовский анализ вероятностей</p>
<div class="navchips">
<a class="on" data-tab="taro">? Таро</a>
<a data-tab="dreams">? Сонник</a>
<a data-tab="cards">? Карты</a>
<a data-tab="coffee">☕ Гуща</a>
<a data-tab="runes">ᚠ Руны</a>
<a data-tab="wheel">? Колесо</a>
<a data-tab="lab">? Лаборатория</a>
</div>
</header>
<main class="wrap">
<section id="taro" class="section active">
<div class="divider">☽ ✦ ☾</div>
<div class="tbar">
<h2>? Стол таролога</h2>
<div class="sbtns">
<button class="sbtn on" data-s="day">Карта дня</button>
<button class="sbtn" data-s="three">Три карты</button>
<button class="sbtn" data-s="love">Отношения</button>
<button class="sbtn" data-s="career">Карьера</button>
<button class="sbtn" id="dealbtn" style="background:var(--gold);color:#241448;border-color:var(--gold)">РАЗДАТЬ</button>
<button class="sbtn" id="shufflebtn">⟲ В КОЛОДУ</button>
</div>
</div>
<div class="ttable" id="ttable">
<div class="tring"></div>
<div class="candle cl"></div><div class="candle cr"></div>
<div class="deckzone" id="deckzone"><div class="dback"></div><div class="dcount" id="dcount">В КОЛОДЕ: 22</div></div>
<div id="marks"></div>
</div>
<div class="log">
<h3>Журнал толкований</h3>
<div id="logbody"><div class="empty">Нажмите «Раздать» — и здесь появится расшифровка расклада, строка за строкой…</div></div>
</div>
<div class="prob-panel" id="prob-taro">
<div class="prob-header"><span class="dot"></span> БАЙЕСОВСКИЙ АНАЛИЗ · ТЕОРИЯ ВЕРОЯТНОСТЕЙ</div>
<div class="prob-title">Что говорит физика и математика?</div>
<div class="prob-subtitle">Таро — это не магия, а система из 22 символов, подчиняющаяся законам комбинаторики</div>
<div class="prob-grid" id="prob-taro-stats">
<div class="prob-stat"><div class="lbl">Карт в колоде</div><div class="val">22</div><div class="note">Старшие Арканы</div></div>
<div class="prob-stat"><div class="lbl">P(любая карта)</div><div class="val">4.55%</div><div class="note">= 1/22</div></div>
<div class="prob-stat"><div class="lbl">Вариантов расклада</div><div class="val" id="prob-taro-combinations">9 240</div><div class="note">с учётом порядка</div></div>
<div class="prob-stat"><div class="lbl">Энтропия</div><div class="val">4.46 <small>бит</small></div><div class="note">мера неопределённости</div></div>
<div class="prob-stat"><div class="lbl">Ваша история</div><div class="val" id="prob-taro-history">0</div><div class="note">раскладов</div></div>
<div class="prob-stat"><div class="lbl">Любимая карта</div><div class="val" id="prob-taro-favorite" style="font-size:14px">—</div><div class="note">по частоте</div></div>
</div>
<div class="prob-insight">
<b>? Байесовское обновление:</b> Каждый расклад обновляет ваши априорные ожидания. Если за 20 раскладов «Смерть» выпадала 5 раз (25%), а математическое ожидание — 4.5%, это **отклонение в 5.5 раз**. Физически: это статистическая флуктуация на малой выборке (закон больших чисел ещё не сработал).<br />
<span class="prob-formula">P(H|E) = P(E|H)·P(H) / P(E) — формула Байеса</span>
</div>
</div>
</section>
<section id="dreams" class="section">
<div class="divider">☾ ✧ ☽</div>
<div class="dream-panel">
<h2>? Толкователь снов</h2>
<p class="hint">Вспомни яркий образ из сна и начни печатать — или выбери тег ниже.</p>
<div class="search-wrap">
<input type="text" id="dreamSearch" placeholder="Например: вода, змея, полёт, зубы…" autocomplete="off" />
<span class="ico">?</span>
<button class="clear" id="dreamClear">✕</button>
</div>
<div class="tags" id="dreamTags"></div>
<div class="results" id="dreamResults"></div>
<div class="day-sym">
<div class="ds-icon" id="dsIcon">?</div>
<div class="ds-body">
<h4 id="dsTitle">Символ ночи</h4>
<p id="dsText">Нажми кнопку — выпадет случайный символ.</p>
<button class="ds-btn" id="dsBtn">✦ ВЫТАЩИТЬ СИМВОЛ НОЧИ</button>
</div>
</div>
</div>
<div class="prob-panel" id="prob-dreams">
<div class="prob-header"><span class="dot"></span> СТАТИСТИКА СНОВИДЕНИЙ · ТЕОРИЯ ВЕРОЯТНОСТЕЙ</div>
<div class="prob-title">Почему одни символы снятся чаще?</div>
<div class="prob-subtitle">Исследования Холла и Ван де Касла (30 000 снов) показали универсальные частоты</div>
<div class="prob-grid">
<div class="prob-stat"><div class="lbl">Символов в базе</div><div class="val">150+</div><div class="note">архетипов</div></div>
<div class="prob-stat"><div class="lbl">Топ-символ</div><div class="val" style="font-size:14px">? Зубы</div><div class="note">~8% всех снов</div></div>
<div class="prob-stat"><div class="lbl">P(полёт во сне)</div><div class="val">12%</div><div class="note">по данным Hall</div></div>
<div class="prob-stat"><div class="lbl">P(падение)</div><div class="val">17%</div><div class="note">гипнагогия</div></div>
<div class="prob-stat"><div class="lbl">Энтропия сна</div><div class="val">~7.2 <small>бит</small></div><div class="note">выше, чем у Таро</div></div>
<div class="prob-stat"><div class="lbl">Ваши поиски</div><div class="val" id="prob-dream-searches">0</div><div class="note">за сессию</div></div>
</div>
<div class="prob-insight">
<b>? Нейрофизиология:</b> Во время REM-фазы префронтальная кора (логика) отключена, а миндалевидное тело (эмоции) гиперактивно. Вероятность появления «страшных» символов растёт в 2.3 раза. Байесовский мозг **обновляет** свои модели мира во сне — поэтому повторяющиеся символы = нерешённые задачи.<br />
<span class="prob-formula">H(X) = −Σ P(x)·log₂P(x) — энтропия распределения</span>
</div>
</div>
</section>
<section id="cards" class="section">
<div class="divider">♠ ♥ ♦ ♣</div>
<div class="tbar">
<h2>? Игральные карты</h2>
<div class="sbtns">
<button class="sbtn on" data-p="one">Одна карта</button>
<button class="sbtn" data-p="three">Три карты</button>
<button class="sbtn" data-p="cross">Кельтский крест</button>
<button class="sbtn" id="dealCards" style="background:var(--gold);color:#241448;border-color:var(--gold)">РАЗДАТЬ</button>
<button class="sbtn" id="shuffleCards">⟲ В КОЛОДУ</button>
</div>
</div>
<div class="play-card-table" id="playTable">
<div id="playMarks" style="position:absolute;inset:0;pointer-events:none"></div>
</div>
<div class="log" style="margin-top:20px">
<h3>Толкование</h3>
<div id="playLog"><div class="empty">Нажмите «Раздать» для расклада.</div></div>
</div>
<div class="prob-panel" id="prob-cards">
<div class="prob-header"><span class="dot"></span> КОМБИНАТОРИКА · ТЕОРИЯ ВЕРОЯТНОСТЕЙ</div>
<div class="prob-title">Физика колоды из 36 карт</div>
<div class="prob-subtitle">Чистая математика: 36! возможных перестановок — больше, чем атомов в видимой Вселенной</div>
<div class="prob-grid">
<div class="prob-stat"><div class="lbl">Карт в колоде</div><div class="val">36</div><div class="note">4 масти × 9 рангов</div></div>
<div class="prob-stat"><div class="lbl">Всего перестановок</div><div class="val" style="font-size:13px">3.72·10⁴¹</div><div class="note">36! факториал</div></div>
<div class="prob-stat"><div class="lbl">P(туз)</div><div class="val">11.1%</div><div class="note">= 4/36</div></div>
<div class="prob-stat"><div class="lbl">P(червы)</div><div class="val">25%</div><div class="note">= 9/36</div></div>
<div class="prob-stat"><div class="lbl">P(туз червей)</div><div class="val">2.78%</div><div class="note">= 1/36</div></div>
<div class="prob-stat"><div class="lbl">Ваши раздачи</div><div class="val" id="prob-cards-deals">0</div><div class="note">за сессию</div></div>
</div>
<div class="prob-insight">
<b>? Парадокс тасовки:</b> Исследования Диакониса (Стэнфорд) показали: чтобы колода стала **по-настоящему случайной**, её нужно перетасовать не менее **7 раз** (riffle shuffle). После 1-3 тасовок остаются статистические паттерны — теоретически предсказуемые!<br />
<span class="prob-formula">C(n,k) = n! / (k!·(n−k)!) — сочетания из n по k</span>
</div>
</div>
</section>
<section id="coffee" class="section">
<div class="divider">☕ ✦ ☕</div>
<h2 style="color:var(--gold2);font-size:clamp(28px,4vw,42px);text-align:center">Гадание на кофейной гуще</h2>
<div class="coffee-area">
<div class="cup-container" id="cupContainer">
<div class="cup" id="cup">
<div class="cup-front"><span>☕</span><div class="handle"></div></div>
<div class="cup-back" id="cupBack"><div class="pattern" id="coffeePattern"></div></div>
</div>
<div class="steam-wrap"><div></div><div></div><div></div></div>
</div>
<div class="coffee-interp">
<h4 id="coffeeTitle">Загадай желание</h4>
<p id="coffeeText">Нажми на чашку, чтобы перевернуть её и увидеть узор из гущи.</p>
<button class="ds-btn" id="coffeeBtn" style="margin-top:12px">✦ ПЕРЕВЕРНУТЬ</button>
</div>
</div>
<div class="prob-panel" id="prob-coffee">
<div class="prob-header"><span class="dot"></span> ТЕОРИЯ ПАТТЕРНОВ · АПОФЕНИЯ</div>
<div class="prob-title">Почему мы видим фигуры в гуще?</div>
<div class="prob-subtitle">Физика случайных распределений + психология распознавания образов</div>
<div class="prob-grid">
<div class="prob-stat"><div class="lbl">Символов в системе</div><div class="val">50</div><div class="note">2 набора</div></div>
<div class="prob-stat"><div class="lbl">Символов на чашке</div><div class="val">5–10</div><div class="note">случайно</div></div>
<div class="prob-stat"><div class="lbl">Всего комбинаций</div><div class="val" style="font-size:13px">10⁸–10¹³</div><div class="note">практически ∞</div></div>
<div class="prob-stat"><div class="lbl">P(совпадения)</div><div class="val">~100%</div><div class="note">парадокс дней рождения</div></div>
<div class="prob-stat"><div class="lbl">Ваши гадания</div><div class="val" id="prob-coffee-readings">0</div><div class="note">за сессию</div></div>
<div class="prob-stat"><div class="lbl">Уникальных узоров</div><div class="val" id="prob-coffee-unique">0</div><div class="note">увидено</div></div>
</div>
<div class="prob-insight">
<b>? Апофения и парейдолия:</b> Человеческий мозг эволюционно «заточен» находить паттерны даже в случайном шуме. P(увидеть «лицо» или «знак» в хаотичных пятнах) → **стремится к 100%**. Это не баг, а фича: наши предки, замечавшие шорох в траве (даже если это ветер), выживали чаще. Формула Байеса работает в обратную сторону: мозг подгоняет гипотезу под данные.<br />
<span class="prob-formula">P(паттерн|данные) ≠ P(данные|паттерн)</span>
</div>
</div>
</section>
<section id="runes" class="section">
<div class="divider">ᚠ ✦ ᚢ</div>
<h2 style="color:var(--gold2);font-size:clamp(28px,4vw,42px);text-align:center">Руны Старшего Футарка</h2>
<div style="text-align:center;margin:10px 0">
<button class="sbtn" id="drawRune" style="background:var(--gold);color:#241448;border-color:var(--gold);padding:12px 30px;font-size:18px">ВЫТЯНУТЬ РУНУ</button>
</div>
<div class="rune-result" id="runeResult">
<span class="big-rune" id="runeSymbol">ᚠ</span>
<h4 id="runeName">Феху</h4>
<p id="runeMeaning">Богатство, скот, изобилие. Начало нового цикла.</p>
</div>
<div class="runes-grid" id="runeGrid"></div>
<div class="prob-panel" id="prob-runes">
<div class="prob-header"><span class="dot"></span> ДРЕВНЯЯ КОМБИНАТОРИКА · СТАТИСТИКА</div>
<div class="prob-title">24 руны: язык вероятностей викингов</div>
<div class="prob-subtitle">Futhark — возможно, первая в истории система дивинации с формальной структурой</div>
<div class="prob-grid">
<div class="prob-stat"><div class="lbl">Рун в наборе</div><div class="val">24</div><div class="note">Старший Футарк</div></div>
<div class="prob-stat"><div class="lbl">P(любая руна)</div><div class="val">4.17%</div><div class="note">= 1/24</div></div>
<div class="prob-stat"><div class="lbl">Атт (семейств)</div><div class="val">3×8</div><div class="note">Фрейр, Хеймдалль, Тюр</div></div>
<div class="prob-stat"><div class="lbl">Пар рун</div><div class="val">276</div><div class="note">C(24,2)</div></div>
<div class="prob-stat"><div class="lbl">Ваши вытягивания</div><div class="val" id="prob-runes-draws">0</div><div class="note">за сессию</div></div>
<div class="prob-stat"><div class="lbl">Самая частая</div><div class="val" id="prob-runes-top" style="font-size:14px">—</div><div class="note">по статистике</div></div>
</div>
<div class="prob-insight">
<b>⚖️ Закон больших чисел:</b> Если вытянуть руны 1000 раз, каждая выпадет ~41.7 раз с отклонением ±σ (σ≈6.3). Отклонения свыше 3σ (в 3 раза больше ожидаемого) — статистически значимы. На малых выборках (5-10 вытягиваний) «магические совпадения» — это **нормальная статистическая флуктуация**, а не знак свыше.<br />
<span class="prob-formula">σ = √(n·p·(1−p)) — стандартное отклонение</span>
</div>
</div>
</section>
<section id="wheel" class="section">
<div class="divider">? ✦ ?</div>
<h2 style="color:var(--gold2);font-size:clamp(28px,4vw,42px);text-align:center">Колесо Фортуны</h2>
<div class="wheel-wrap">
<div class="wheel-canvas-wrap">
<canvas id="wheelCanvas" width="400" height="400"></canvas>
</div>
<button class="wheel-btn" id="spinWheel">КРУТИТЬ КОЛЕСО</button>
<div class="wheel-result" id="wheelResult">Нажмите кнопку, чтобы узнать судьбу</div>
</div>
<div class="prob-panel" id="prob-wheel">
<div class="prob-header"><span class="dot"></span> ТЕОРИЯ ВЕРОЯТНОСТЕЙ · МАТЕМАТИЧЕСКОЕ ОЖИДАНИЕ</div>
<div class="prob-title">Равномерное распределение и закон серии</div>
<div class="prob-subtitle">Колесо — идеальный генератор равномерной случайности</div>
<div class="prob-grid">
<div class="prob-stat"><div class="lbl">Секторов</div><div class="val">12</div><div class="note">равных</div></div>
<div class="prob-stat"><div class="lbl">P(каждый сектор)</div><div class="val">8.33%</div><div class="note">= 1/12</div></div>
<div class="prob-stat"><div class="lbl">P(2 раза подряд)</div><div class="val">0.69%</div><div class="note">= (1/12)²</div></div>
<div class="prob-stat"><div class="lbl">P(3 «Удача» из 5)</div><div class="val">0.7%</div><div class="note">биномиальное</div></div>
<div class="prob-stat"><div class="lbl">Ваши вращения</div><div class="val" id="prob-wheel-spins">0</div><div class="note">за сессию</div></div>
<div class="prob-stat"><div class="lbl">Самый частый</div><div class="val" id="prob-wheel-top" style="font-size:14px">—</div><div class="note">сектор</div></div>
</div>
<div class="prob-insight">
<b>? Ошибка игрока (Gambler's Fallacy):</b> Если «Удача» выпала 5 раз подряд, **вероятность шестого раза НЕ уменьшается**. У колеса нет памяти. P(Удача|5 раз подряд Удача) = всё те же 8.33%. Это фундаментальное свойство независимых событий — и главный когнитивный баг, на котором зарабатывают казино.<br />
<span class="prob-formula">P(A|B) = P(A) если A и B независимы</span>
</div>
</div>
</section>
<section id="lab" class="section">
<div class="divider">? ✦ ?</div>
<h2 style="color:var(--gold2);font-size:clamp(28px,4vw,42px);text-align:center;margin-bottom:10px">Лаборатория вероятностей</h2>
<p style="text-align:center;color:var(--dim);max-width:600px;margin:0 auto 30px">Ваша личная статистика по всем гаданиям. Байесовский мозг обновляет апостериорные вероятности с каждым действием.</p>
<div class="prob-grid" style="grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px">
<div class="prob-stat" style="padding:16px">
<div class="lbl">Всего действий</div>
<div class="val" id="lab-total" style="font-size:32px">0</div>
<div class="note">за сессию</div>
</div>
<div class="prob-stat" style="padding:16px">
<div class="lbl">Любимое гадание</div>
<div class="val" id="lab-favorite" style="font-size:16px">—</div>
</div>
<div class="prob-stat" style="padding:16px">
<div class="lbl">Энтропия выбора</div>
<div class="val" id="lab-entropy">0 <small>бит</small></div>
<div class="note">разнообразие</div>
</div>
<div class="prob-stat" style="padding:16px">
<div class="lbl">Среднее в день</div>
<div class="val" id="lab-avg">0</div>
</div>
</div>
<div class="prob-panel" style="margin-top:24px">
<div class="prob-title">Ваше распределение по гаданиям</div>
<div id="lab-chart" style="margin-top:16px"></div>
<div class="prob-insight" style="margin-top:16px">
<b>? Байесовский портрет:</b> Чем равномернее вы распределены по гаданиям — тем выше энтропия вашего выбора (максимум log₂6 ≈ 2.58 бит при равном использовании всех 6). Низкая энтропия = «любимое» гадание. Это не хорошо и не плохо — просто ваша статистическая сигнатура.
</div>
</div>
<div style="text-align:center;margin-top:24px">
<button class="sbtn" id="labReset" style="color:var(--dim);border-color:rgba(255,100,100,0.3)">⟲ Сбросить статистику</button>
</div>
</section>
</main>
<footer>
<span class="fx">✶</span><br />
Мистический салон · развлечения ради, решения — за вами · ☽ ✦ ☾
</footer>
<script>
(function(){
"use strict";
function $(s){return document.querySelector(s)}
function $$(s){return Array.prototype.slice.call(document.querySelectorAll(s))}
/* ══════════════════════════════════════
БАЙЕСОВСКИЙ АНАЛИЗАТОР
══════════════════════════════════════ */
var Bayes = {
data: null,
init: function(){
try {
this.data = JSON.parse(localStorage.getItem('bayes_data')) || this.empty();
} catch(e) { this.data = this.empty(); }
},
empty: function(){
return {
tarot: {count:0, cards:{}},
dreams: {searches:0},
cards: {deals:0, cards:{}},
coffee: {readings:0, patterns:{}},
runes: {draws:0, runes:{}},
wheel: {spins:0, sectors:{}},
session: {start: Date.now()}
};
},
save: function(){
try { localStorage.setItem('bayes_data', JSON.stringify(this.data)); } catch(e){}
},
logTarot: function(cardName){
this.data.tarot.count++;
this.data.tarot.cards[cardName] = (this.data.tarot.cards[cardName]||0) + 1;
this.save(); this.updateTaroStats();
},
logDream: function(){
this.data.dreams.searches++;
this.save(); this.updateDreamStats();
},
logCard: function(card){
this.data.cards.deals++;
var key = card.rank + card.suit;
this.data.cards.cards[key] = (this.data.cards.cards[key]||0) + 1;
this.save(); this.updateCardStats();
},
logCoffee: function(pattern){
this.data.coffee.readings++;
var key = pattern.join('');
this.data.coffee.patterns[key] = (this.data.coffee.patterns[key]||0) + 1;
this.save(); this.updateCoffeeStats();
},
logRune: function(runeName){
this.data.runes.draws++;
this.data.runes.runes[runeName] = (this.data.runes.runes[runeName]||0) + 1;
this.save(); this.updateRuneStats();
},
logWheel: function(sector){
this.data.wheel.spins++;
this.data.wheel.sectors[sector] = (this.data.wheel.sectors[sector]||0) + 1;
this.save(); this.updateWheelStats();
},
topKey: function(obj){
var top='', max=0;
for(var k in obj){ if(obj[k]>max){max=obj[k];top=k;} }
return top ? top + ' ('+max+')' : '—';
},
entropy: function(obj){
var total=0; for(var k in obj) total += obj[k];
if(total===0) return 0;
var H=0;
for(var k in obj){ var p=obj[k]/total; if(p>0) H -= p*Math.log2(p); }
return H;
},
updateTaroStats: function(){
var e1=$('#prob-taro-history'), e2=$('#prob-taro-favorite');
if(e1) e1.textContent = this.data.tarot.count;
if(e2) e2.textContent = this.topKey(this.data.tarot.cards);
},
updateDreamStats: function(){
var e=$('#prob-dream-searches');
if(e) e.textContent = this.data.dreams.searches;
},
updateCardStats: function(){
var e=$('#prob-cards-deals');
if(e) e.textContent = this.data.cards.deals;
},
updateCoffeeStats: function(){
var e1=$('#prob-coffee-readings'), e2=$('#prob-coffee-unique');
if(e1) e1.textContent = this.data.coffee.readings;
if(e2) e2.textContent = Object.keys(this.data.coffee.patterns).length;
},
updateRuneStats: function(){
var e1=$('#prob-runes-draws'), e2=$('#prob-runes-top');
if(e1) e1.textContent = this.data.runes.draws;
if(e2) e2.textContent = this.topKey(this.data.runes.runes);
},
updateWheelStats: function(){
var e1=$('#prob-wheel-spins'), e2=$('#prob-wheel-top');
if(e1) e1.textContent = this.data.wheel.spins;
if(e2) e2.textContent = this.topKey(this.data.wheel.sectors);
},
updateLab: function(){
var total = this.data.tarot.count + this.data.dreams.searches +
this.data.cards.deals + this.data.coffee.readings +
this.data.runes.draws + this.data.wheel.spins;
var eT=$('#lab-total'); if(eT) eT.textContent = total;
var counts = {
'? Таро': this.data.tarot.count,
'? Сонник': this.data.dreams.searches,
'? Карты': this.data.cards.deals,
'☕ Гуща': this.data.coffee.readings,
'ᚠ Руны': this.data.runes.draws,
'? Колесо': this.data.wheel.spins
};
var fav = this.topKey(counts);
var eF=$('#lab-favorite'); if(eF) eF.textContent = fav;
var H = this.entropy(counts);
var eH=$('#lab-entropy'); if(eH) eH.innerHTML = H.toFixed(2)+' <small>бит</small>';
var days = Math.max(1, Math.ceil((Date.now()-this.data.session.start)/(1000*60*60*24)));
var eA=$('#lab-avg'); if(eA) eA.textContent = (total/days).toFixed(1);
// Chart
var chart = $('#lab-chart');
if(chart){
chart.innerHTML='';
var max = Math.max.apply(null, Object.values(counts)) || 1;
for(var k in counts){
var row = document.createElement('div');
row.style.cssText = 'display:flex;align-items:center;gap:10px;margin-bottom:8px;';
var lbl = document.createElement('div');
lbl.style.cssText = 'width:90px;font-size:12px;color:var(--dim)';
lbl.textContent = k;
var bar = document.createElement('div');
bar.style.cssText = 'flex:1;height:24px;background:rgba(20,14,44,0.6);border-radius:6px;overflow:hidden;position:relative';
var fill = document.createElement('div');
fill.style.cssText = 'height:100%;background:linear-gradient(90deg,#d9b45c,#5eead4);width:'+(counts[k]/max*100)+'%;transition:width 0.5s;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;color:#0d0a1c;font-weight:bold;font-size:12px;font-family:var(--mono)';
fill.textContent = counts[k];
bar.appendChild(fill);
row.appendChild(lbl);
row.appendChild(bar);
chart.appendChild(row);
}
}
},
reset: function(){
this.data = this.empty();
this.save();
this.updateAll();
},
updateAll: function(){
this.updateTaroStats();
this.updateDreamStats();
this.updateCardStats();
this.updateCoffeeStats();
this.updateRuneStats();
this.updateWheelStats();
this.updateLab();
}
};
Bayes.init();
/* ЗВЁЗДЫ */
var cv=$('#stars'),cx=cv.getContext('2d'),stars=[];
function sizeStars(){cv.width=innerWidth;cv.height=innerHeight;stars=[];for(var i=0;i<180;i++)stars.push({x:Math.random()*cv.width,y:Math.random()*cv.height,r:Math.random()*1.8+.3,p:Math.random()*6.28,s:.4+Math.random()*1.6});}
sizeStars();addEventListener('resize',sizeStars);
function drawStars(t){
cx.clearRect(0,0,cv.width,cv.height);
for(var i=0;i<stars.length;i++){var s=stars[i];var a=.2+.8*Math.abs(Math.sin(s.p+t/1200*s.s));
cx.shadowBlur=15;cx.shadowColor=i%7?'#efe9dc':'#f0d68a';
cx.globalAlpha=a;cx.fillStyle=i%7?'#efe9dc':'#f0d68a';cx.beginPath();cx.arc(s.x,s.y,s.r,0,7);cx.fill();}
cx.shadowBlur=0;cx.globalAlpha=1;requestAnimationFrame(drawStars);
}
requestAnimationFrame(drawStars);
/* МОЛНИИ */
var lc=$('#lightningCanvas'),lctx=lc.getContext('2d');
function sizeLC(){lc.width=innerWidth;lc.height=innerHeight}
sizeLC();addEventListener('resize',sizeLC);
var flashEl=$('#screenFlash');
function triggerFlash(x,y){
flashEl.style.background='radial-gradient(circle at '+x+'px '+y+'px,rgba(255,255,255,.9),rgba(200,220,255,.5) 30%,transparent 70%)';
flashEl.classList.remove('go');void flashEl.offsetWidth;flashEl.classList.add('go');
}
function drawLightning(){
lctx.clearRect(0,0,lc.width,lc.height);
if(Math.random()<0.012){
var x=Math.random()*lc.width;
var targetY=lc.height*0.8+Math.random()*lc.height*0.2;
lctx.shadowBlur=40; lctx.shadowColor='#aaccff';
lctx.beginPath();lctx.moveTo(x,0);
var px=x,py=0; var steps=15;
for(var i=0;i<steps;i++){
var nx=px+(Math.random()-0.5)*40, ny=py+targetY/steps;
lctx.lineTo(nx,ny); px=nx; py=ny;
}
lctx.strokeStyle='rgba(255,255,255,0.95)';lctx.lineWidth=3;lctx.stroke();
lctx.shadowBlur=0;
triggerFlash(x,targetY);
}
requestAnimationFrame(drawLightning);
}
drawLightning();
/* ЧАСТИЦЫ */
var pc=$('#particlesCanvas'),pctx=pc.getContext('2d');
function sizePC(){pc.width=innerWidth;pc.height=innerHeight}
sizePC();addEventListener('resize',sizePC);
var particles=[];
function spawnParticles(x,y,count,colors,opts){
opts=opts||{};
for(var i=0;i<count;i++){
var angle=Math.random()*Math.PI*2;
var speed=(opts.speed||5)+Math.random()*(opts.speedVar||8);
particles.push({x:x,y:y,vx:Math.cos(angle)*speed,vy:Math.sin(angle)*speed,
life:1,decay:0.01+Math.random()*0.02,size:1+Math.random()*(opts.size||3),
color:colors[Math.floor(Math.random()*colors.length)],gravity:opts.gravity||0,type:'spark'});
}
if(particles.length>800) particles.splice(0,particles.length-800);
}
function spawnFirework(x,y){
var colors=['#d9b45c','#f0d68a','#8f6bff','#ff6a4d','#4fd6e0','#fff'];
for(var i=0;i<60;i++){
var angle=Math.random()*Math.PI*2;
var speed=2+Math.random()*8;
particles.push({x:x,y:y,vx:Math.cos(angle)*speed,vy:Math.sin(angle)*speed,
life:1,decay:0.012+Math.random()*0.01,size:1+Math.random()*3,
color:colors[Math.floor(Math.random()*colors.length)],gravity:0.1,type:'spark'});
}
}
function drawParticles(){
pctx.clearRect(0,0,pc.width,pc.height);
for(var i=particles.length-1;i>=0;i--){
var p=particles[i];
p.x+=p.vx; p.y+=p.vy; p.vy+=p.gravity;
p.vx*=0.98; p.vy*=0.98; p.life-=p.decay;
if(p.life<=0){particles.splice(i,1);continue;}
pctx.globalAlpha=p.life;
pctx.shadowBlur=10;pctx.shadowColor=p.color;
pctx.fillStyle=p.color;pctx.beginPath();pctx.arc(p.x,p.y,p.size,0,7);pctx.fill();
pctx.shadowBlur=0;
}
pctx.globalAlpha=1;
requestAnimationFrame(drawParticles);
}
requestAnimationFrame(drawParticles);
/* НАВИГАЦИЯ */
$$('.navchips a').forEach(function(a){
a.addEventListener('click',function(){
$$('.navchips a').forEach(function(x){x.classList.remove('on')});
a.classList.add('on');
var tab=a.dataset.tab;
$$('.section').forEach(function(s){s.classList.remove('active')});
var sec=document.getElementById(tab);
if(sec)sec.classList.add('active');
if(tab==='lab') Bayes.updateLab();
});
});
/* ТАРО */
var TAROT=[
{n:'Шут',r:'0',g:'?',u:'Новое начало.',d:'Беспечность.'},
{n:'Маг',r:'I',g:'?',u:'Воля и мастерство.',d:'Распыление.'},
{n:'Жрица',r:'II',g:'?',u:'Интуиция.',d:'Заглушённый голос.'},
{n:'Императрица',r:'III',g:'?',u:'Изобилие.',d:'Застой.'},
{n:'Император',r:'IV',g:'?️',u:'Порядок.',d:'Жёсткость.'},
{n:'Иерофант',r:'V',g:'?',u:'Традиция.',d:'Догмы.'},
{n:'Влюблённые',r:'VI',g:'?',u:'Союз.',d:'Сомнения.'},
{n:'Колесница',r:'VII',g:'?',u:'Прорыв.',d:'Суета.'},
{n:'Сила',r:'VIII',g:'?',u:'Мягкая мощь.',d:'Неуверенность.'},
{n:'Отшельник',r:'IX',g:'?️',u:'Поиск смысла.',d:'Изоляция.'},
{n:'Колесо',r:'X',g:'?',u:'Счастливый поворот.',d:'Сопротивление.'},
{n:'Справедливость',r:'XI',g:'⚖️',u:'Равновесие.',d:'Перекос.'},
{n:'Повешенный',r:'XII',g:'?',u:'Пауза.',d:'Зависание.'},
{n:'Смерть',r:'XIII',g:'?',u:'Трансформация.',d:'Цепляние.'},
{n:'Умеренность',r:'XIV',g:'?',u:'Гармония.',d:'Крайности.'},
{n:'Дьявол',r:'XV',g:'⛓️',u:'Страсть.',d:'Освобождение.'},
{n:'Башня',r:'XVI',g:'?️',u:'Прозрение.',d:'Страх.'},
{n:'Звезда',r:'XVII',g:'⭐',u:'Надежда.',d:'Поколебленная вера.'},
{n:'Луна',r:'XVIII',g:'?',u:'Интуиция.',d:'Страхи уходят.'},
{n:'Солнце',r:'XIX',g:'☀️',u:'Радость.',d:'Временно.'},
{n:'Суд',r:'XX',g:'?',u:'Пробуждение.',d:'Самокритика.'},
{n:'Мир',r:'XXI',g:'?',u:'Завершение.',d:'Незавершённость.'}
];
var SPREADS={
day:[{x:50,y:50,l:'Карта дня'}],
three:[{x:22,y:50,l:'Прошлое'},{x:50,y:50,l:'Настоящее'},{x:78,y:50,l:'Будущее'}],
love:[{x:30,y:40,l:'Вы'},{x:70,y:40,l:'Партнёр'},{x:50,y:70,l:'Отношения'}],
career:[{x:30,y:40,l:'Текущее'},{x:70,y:40,l:'Препятствие'},{x:50,y:70,l:'Результат'}]
};
var spread='day',tbusy=false;
var table=$('#ttable'),deckzone=$('#deckzone'),marks=$('#marks'),cards=[];
for(var ci=0;ci<4;ci++){
var card=document.createElement('div');card.className='tcard';card.style.opacity='0';
card.innerHTML='<div class="tfl"><div class="tface tback"></div><div class="tface tfront"><span class="rv">⟲</span><span class="rn">✶</span><span class="g">✶</span><span class="n">…</span></div></div>';
table.appendChild(card);cards.push(card);
}
function rel(el){var t=table.getBoundingClientRect(),r=el.getBoundingClientRect();return{l:r.left-t.left,t:r.top-t.top}}
function parkAll(){var d=rel(deckzone);cards.forEach(function(c,i){c.classList.remove('up','rev');c.style.opacity='0';c.style.left=(d.l+(i*5-10))+'px';c.style.top=(d.t-i*4)+'px';c.style.setProperty('--rot',((i*5-10))+'deg');c.style.setProperty('--sc','1');});}
addEventListener('resize',function(){if(!tbusy)parkAll()});
setTimeout(parkAll,80);
function renderMarks(){marks.innerHTML='';SPREADS[spread].forEach(function(p){var m=document.createElement('div');m.className='smark';m.style.left=p.x+'%';m.style.top=p.y+'%';m.innerHTML='<span class="sl">'+p.l+'</span>';marks.appendChild(m);});}
renderMarks();
$$('.sbtn[data-s]').forEach(function(b){b.addEventListener('click',function(){$$('.sbtn[data-s]').forEach(function(x){x.classList.remove('on')});b.classList.add('on');spread=b.dataset.s;renderMarks();if(!tbusy)parkAll();});});
function type(el,text){return new Promise(function(res){var i=0;var t=setInterval(function(){el.textContent=text.slice(0,++i);if(i>=text.length){clearInterval(t);res();}},14);});}
function shuffleArr(a){for(var i=a.length-1;i>0;i--){var j=Math.floor(Math.random()*(i+1)),t=a[i];a[i]=a[j];a[j]=t;}return a;}
$('#dealbtn').addEventListener('click',function(){
if(tbusy)return;tbusy=true;
var pos=SPREADS[spread];renderMarks();parkAll();
$('#logbody').innerHTML='';
var picked=shuffleArr(TAROT.slice()).slice(0,pos.length);
var done=0;
var colors=['#d9b45c','#f0d68a','#8f6bff','#fff'];
var centerX=table.offsetWidth/2, centerY=table.offsetHeight/2;
var tableRect=table.getBoundingClientRect();
cards.forEach(function(c,i){
if(i<pos.length){
c.style.transition='left .4s, top .4s, transform .4s, opacity .3s';
c.style.left=(centerX - 55)+'px';
c.style.top=(centerY - 90)+'px';
c.style.setProperty('--sc','0.3');
c.style.setProperty('--rot', (i*40)+'deg');
c.style.opacity='1';
} else { c.style.opacity='0'; }
});
setTimeout(function(){
cards.forEach(function(c,i){
if(i<pos.length){
var angle = i * (2*Math.PI / pos.length);
var radius = 130;
var cx = centerX + Math.cos(angle)*radius - 55;
var cy = centerY + Math.sin(angle)*radius - 90;
c.style.left=cx+'px'; c.style.top=cy+'px';
c.style.setProperty('--rot', (i*60+30)+'deg');
c.style.setProperty('--sc','0.7');
}
});
spawnParticles(tableRect.left+centerX,tableRect.top+centerY,40,colors,{speed:3,speedVar:6,size:3});
setTimeout(function(){
pos.forEach(function(p,i){
if(i<cards.length){
var card=cards[i];
var mk=marks.children[i];
var r=rel(mk);
card.style.transition='left .8s cubic-bezier(.25,.8,.3,1), top .8s cubic-bezier(.25,.8,.3,1), transform .8s';
card.style.left=r.l+'px'; card.style.top=r.t+'px';
card.style.setProperty('--rot','0deg');
card.style.setProperty('--sc','1');
}
});
setTimeout(function(){
pos.forEach(function(p,i){
setTimeout(function(){
var d=picked[i], rev=Math.random()<.3;
var f=cards[i].querySelector('.tfront');
f.querySelector('.rn').textContent=d.r; f.querySelector('.g').textContent=d.g; f.querySelector('.n').textContent=d.n;
cards[i].classList.toggle('rev',rev); cards[i].classList.add('up');
var rect=cards[i].getBoundingClientRect();
spawnParticles(rect.left+rect.width/2,rect.top+rect.height/2,15,colors,{speed:4,speedVar:5,size:2,gravity:0.08});
Bayes.logTarot(d.n);
}, 300 + i*200);
});
pos.forEach(function(p,i){
setTimeout(function(){
var d=picked[i], rev=cards[i].classList.contains('rev');
var line=document.createElement('div');line.className='lline';
line.innerHTML='<span class="pos">'+p.l+'</span><b>'+d.n+(rev?' ⟲':'')+'</b> — <span class="lt"></span><span class="caret"></span>';
$('#logbody').appendChild(line);
type(line.querySelector('.lt'),(rev?d.d:d.u)).then(function(){line.querySelector('.caret').remove();done++;if(done===pos.length)tbusy=false;});
}, 1200 + i*300);
});
}, 900);
}, 600);
}, 400);
});
$('#shufflebtn').addEventListener('click',function(){
if(tbusy)return;tbusy=true;
cards.forEach(function(c,i){c.classList.remove('up','rev');setTimeout(function(){var d=rel(deckzone);c.style.left=(d.l+i*4)+'px';c.style.top=(d.t-i*3)+'px';c.style.opacity='0';},i*90);});
setTimeout(function(){parkAll();$('#logbody').innerHTML='<div class="empty">Колода перетасована.</div>';tbusy=false;},700);
});
/* СОННИК */
var DREAMS=[
{k:'вода',s:'?',t:'Эмоции, подсознание.'},
{k:'река',s:'?️',t:'Течение жизни.'},
{k:'море океан',s:'?',t:'Бессознательное.'},
{k:'дождь',s:'?️',t:'Очищение.'},
{k:'огонь пламя',s:'?',t:'Страсть, трансформация.'},
{k:'змея',s:'?',t:'Мудрость или угроза.'},
{k:'птица',s:'?',t:'Свобода, весть.'},
{k:'собака',s:'?',t:'Дружба, верность.'},
{k:'кошка',s:'?',t:'Интуиция.'},
{k:'лошадь',s:'?',t:'Сила, свобода.'},
{k:'полёт летать',s:'?',t:'Свобода, подъём.'},
{k:'падение',s:'⬇️',t:'Потеря контроля.'},
{k:'зубы',s:'?',t:'Тревога, потеря.'},
{k:'дом',s:'?',t:'Личность.'},
{k:'смерть покойник',s:'⚰️',t:'Трансформация.'}
];
var TAGS=['вода','животные','дом','дорога','тело','эмоции','природа'];
var searchInput=$('#dreamSearch'),clearBtn=$('#dreamClear'),tagsEl=$('#dreamTags'),resultsEl=$('#dreamResults');
TAGS.forEach(function(tag){
var btn=document.createElement('button');btn.className='tag';btn.textContent=tag;
btn.addEventListener('click',function(){
$$('.tag').forEach(function(t){t.classList.remove('on')});
btn.classList.add('on');
searchInput.value=tag;clearBtn.classList.add('show');
renderResults(tag); Bayes.logDream();
});
tagsEl.appendChild(btn);
});
function normalize(str){return str.toLowerCase().replace(/ё/g,'е').trim();}
function matchSymbol(q,sym){
var keywords=sym.k.split(/\s+/);
for(var i=0;i<keywords.length;i++){if(normalize(keywords[i]).indexOf(normalize(q))>=0)return true;}
return normalize(sym.t).indexOf(normalize(q))>=0;
}
function renderResults(query){
resultsEl.innerHTML='';
if(!query||!query.trim()){renderAll();return;}
var found=DREAMS.filter(function(d){return matchSymbol(query,d);});
if(!found.length){resultsEl.innerHTML='<div class="no-res">Не найдено.</div>';return;}
found.forEach(function(d){resultsEl.appendChild(makeCard(d));});
}
function renderAll(){
resultsEl.innerHTML='';
DREAMS.slice(0,30).forEach(function(d){resultsEl.appendChild(makeCard(d));});
}
function makeCard(d){
var div=document.createElement('div');div.className='rcard';
div.innerHTML='<span class="sym">'+d.s+'</span><span class="kw">'+d.k.split(' ')[0]+'</span><div class="txt">'+d.t+'</div>';
div.addEventListener('click',function(){div.classList.toggle('open');});
return div;
}
searchInput.addEventListener('input',function(){
var v=this.value;clearBtn.classList.toggle('show',v.length>0);
$$('.tag').forEach(function(t){t.classList.remove('on')});
renderResults(v);
if(v.length>2) Bayes.logDream();
});
clearBtn.addEventListener('click',function(){searchInput.value='';this.classList.remove('show');$$('.tag').forEach(function(t){t.classList.remove('on')});renderAll();});
$('#dsBtn').addEventListener('click',function(){
var d=DREAMS[Math.floor(Math.random()*DREAMS.length)];
$('#dsIcon').textContent=d.s;
$('#dsTitle').textContent=d.k.split(' ')[0];
$('#dsText').textContent=d.t;
this.textContent='✦ ДРУГОЙ СИМВОЛ';
Bayes.logDream();
});
renderAll();
/* ИГРАЛЬНЫЕ КАРТЫ */
var SUITS=['♠','♥','♦','♣'], RANKS=['6','7','8','9','10','В','Д','К','Т'];
var fullDeck=[];
SUITS.forEach(function(s){
RANKS.forEach(function(r){fullDeck.push({rank:r,suit:s,color:(s=='♥'||s=='♦')?'red':'black'});});
});
var playSpread='one';
var playCards=[], playTable=$('#playTable'), playMarks=$('#playMarks');
var playPositions={
one:[{x:50,y:50,l:'Ваша карта'}],
three:[{x:25,y:50,l:'Прошлое'},{x:50,y:50,l:'Настоящее'},{x:75,y:50,l:'Будущее'}],
cross:[{x:50,y:35,l:'Вы'},{x:50,y:60,l:'Препятствие'},{x:30,y:45,l:'Прошлое'},{x:70,y:45,l:'Будущее'},{x:50,y:80,l:'Итог'}]
};
function renderPlayMarks(){
playMarks.innerHTML='';
playPositions[playSpread].forEach(function(p){
var m=document.createElement('div');
m.style.cssText='position:absolute;left:'+p.x+'%;top:'+p.y+'%;transform:translate(-50%,-50%);color:var(--gold);font-size:10px;letter-spacing:2px;';
m.textContent=p.l;
playMarks.appendChild(m);
});
}
renderPlayMarks();
$$('.sbtn[data-p]').forEach(function(b){
b.addEventListener('click',function(){
$$('.sbtn[data-p]').forEach(function(x){x.classList.remove('on')});
b.classList.add('on');
playSpread=b.dataset.p;
renderPlayMarks();
if(!playBusy) resetPlayCards();
});
});
var playBusy=false;
function resetPlayCards(){
playCards.forEach(function(c){c.remove();});
playCards=[];
$('#playLog').innerHTML='<div class="empty">Нажмите «Раздать».</div>';
}
function shuffleDeck(){var a=fullDeck.slice();for(var i=a.length-1;i>0;i--){var j=Math.floor(Math.random()*(i+1)),t=a[i];a[i]=a[j];a[j]=t;}return a;}
function getPlayCardHTML(card){
var div=document.createElement('div');
div.className='pcard '+card.color;
var inner=document.createElement('div');inner.className='inner';
var front=document.createElement('div');front.className='front';
front.innerHTML='<div class="corner"><span>'+card.rank+'</span><span>'+card.suit+'</span></div><div class="rank">'+card.rank+'</div><div class="suit">'+card.suit+'</div><div class="corner-bottom"><span>'+card.rank+'</span><span>'+card.suit+'</span></div>';
var back=document.createElement('div');back.className='back';
back.innerHTML='✶';
inner.appendChild(front); inner.appendChild(back); div.appendChild(inner);
return div;
}
function dealPlayCards(){
if(playBusy)return; playBusy=true;
resetPlayCards();
var pos=playPositions[playSpread];
var deck=shuffleDeck();
var picked=deck.slice(0,pos.length);
var cx=playTable.offsetWidth/2, cy=playTable.offsetHeight/2;
var created=[];
picked.forEach(function(card, i){
var el=getPlayCardHTML(card);
el.style.left=(cx-40)+'px'; el.style.top=(cy-60)+'px';
el.style.opacity='0';
el.style.transform='scale(0.3) rotate('+(i*30)+'deg)';
el.style.transition='all .6s cubic-bezier(.25,.8,.3,1)';
playTable.appendChild(el);
created.push(el);
setTimeout(function(){
el.style.opacity='1';
el.style.transform='scale(0.7) rotate('+(i*50+20)+'deg)';
el.style.left=(cx-40 + Math.cos(i*1.8)*80)+'px';
el.style.top=(cy-60 + Math.sin(i*1.8)*80)+'px';
}, 100 + i*80);
});
setTimeout(function(){
created.forEach(function(el, i){
var p=pos[i];
var x=p.x/100*playTable.offsetWidth - 40;
var y=p.y/100*playTable.offsetHeight - 60;
el.style.left=x+'px'; el.style.top=y+'px';
el.style.transform='scale(1) rotate(0deg)';
});
setTimeout(function(){
created.forEach(function(el, i){
setTimeout(function(){
el.classList.add('flipped');
Bayes.logCard(picked[i]);
var card=picked[i];
var map={'6':'Стабильность.','7':'Удача.','8':'Перемены.','9':'Успех.','10':'Итог.','В':'Новости.','Д':'Интуиция.','К':'Власть.','Т':'Новое начало.'};
var m=map[card.rank]||'';
if(card.suit=='♠') m+=' (пики — вызовы)';
else if(card.suit=='♥') m+=' (черви — чувства)';
else if(card.suit=='♦') m+=' (бубны — финансы)';
else if(card.suit=='♣') m+=' (трефы — работа)';
var line=document.createElement('div');line.className='lline';
line.innerHTML='<span class="pos">'+pos[i].l+'</span><b>'+card.rank+card.suit+'</b> — '+m;
$('#playLog').appendChild(line);
}, 300 + i*200);
});
playBusy=false;
}, 900);
}, 600);
}
$('#dealCards').addEventListener('click',dealPlayCards);
$('#shuffleCards').addEventListener('click',function(){
if(playBusy)return;
resetPlayCards();
$('#playLog').innerHTML='<div class="empty">Колода перетасована.</div>';
});
/* КОФЕЙНАЯ ГУЩА */
var coffeePatterns=[
['★','●','▲','◆','✿','✦','☯','☼','☽','♻','∞','⚡'],
['?','☀','⭐','?','?','?','?','?','☁','?','?','?']
];
function getCoffeePattern(){
var arr=coffeePatterns[Math.floor(Math.random()*coffeePatterns.length)];
var count=5+Math.floor(Math.random()*6);
var symbols=[];
for(var i=0;i<count;i++) symbols.push(arr[Math.floor(Math.random()*arr.length)]);
return symbols;
}
var coffeeMeanings=[
'Новые начинания, свежий ветер перемен.',
'Финансовый успех, неожиданная прибыль.',
'Любовное приключение.',
'Препятствие, которое скоро исчезнет.',
'Путешествие, дальняя дорога.',
'Духовный рост, интуитивные прозрения.',
'Семейное счастье, гармония.',
'Творческий подъём, вдохновение.'
];
function flipCup(){
var cup=$('#cup');
if(cup.classList.contains('flipped')){
cup.classList.remove('flipped');
$('#coffeeTitle').textContent='Загадай желание';
$('#coffeeText').textContent='Нажми на чашку.';
return;
}
var syms=getCoffeePattern();
$('#coffeePattern').innerHTML=syms.map(function(s){return '<span style="font-size:28px;margin:2px;display:inline-block">'+s+'</span>';}).join('');
cup.classList.add('flipped');
var rect=$('#cupContainer').getBoundingClientRect();
spawnParticles(rect.left+rect.width/2,rect.top+rect.height/2,25,['#d9b45c','#8a6a2c','#f0d68a'],{speed:2,speedVar:4,size:2,gravity:0.02});
var meaning=coffeeMeanings[Math.floor(Math.random()*coffeeMeanings.length)];
$('#coffeeTitle').textContent='Узор из гущи';
$('#coffeeText').textContent='Ты видишь: '+syms.join(' ') + ' — ' + meaning;
Bayes.logCoffee(syms);
}
$('#cupContainer').addEventListener('click',flipCup);
$('#coffeeBtn').addEventListener('click',flipCup);
/* РУНЫ */
var runesData=[
{name:'Феху',symbol:'ᚠ',meaning:'Богатство, изобилие.'},
{name:'Уруз',symbol:'ᚢ',meaning:'Сила, здоровье.'},
{name:'Турисаз',symbol:'ᚦ',meaning:'Защита, преграда.'},
{name:'Ансуз',symbol:'ᚨ',meaning:'Коммуникация, мудрость.'},
{name:'Райдо',symbol:'ᚱ',meaning:'Путь, путешествие.'},
{name:'Кеназ',symbol:'ᚲ',meaning:'Огонь, творчество.'},
{name:'Гебо',symbol:'ᚷ',meaning:'Дар, партнёрство.'},
{name:'Вуньо',symbol:'ᚹ',meaning:'Радость, успех.'},
{name:'Хагалаз',symbol:'ᚺ',meaning:'Разрушение, перемены.'},
{name:'Наутиз',symbol:'ᚾ',meaning:'Нужда, терпение.'},
{name:'Иса',symbol:'ᛁ',meaning:'Лёд, застой.'},
{name:'Йера',symbol:'ᛃ',meaning:'Урожай, награда.'},
{name:'Эйваз',symbol:'ᛇ',meaning:'Защита, связь миров.'},
{name:'Перто',symbol:'ᛈ',meaning:'Тайна, судьба.'},
{name:'Альгиз',symbol:'ᛉ',meaning:'Защита, интуиция.'},
{name:'Совило',symbol:'ᛊ',meaning:'Солнце, победа.'},
{name:'Тейваз',symbol:'ᛏ',meaning:'Мужество, честь.'},
{name:'Беркана',symbol:'ᛒ',meaning:'Рост, рождение.'},
{name:'Эваз',symbol:'ᛖ',meaning:'Движение, доверие.'},
{name:'Манназ',symbol:'ᛗ',meaning:'Человек, общество.'},
{name:'Лагуз',symbol:'ᛚ',meaning:'Интуиция, поток.'},
{name:'Ингуз',symbol:'ᛝ',meaning:'Завершение, семья.'},
{name:'Дагаз',symbol:'ᛞ',meaning:'Прозрение, трансформация.'},
{name:'Отал',symbol:'ᛟ',meaning:'Наследие, дом.'}
];
var runeGrid=$('#runeGrid');
runesData.forEach(function(r){
var div=document.createElement('div');div.className='rune-symbol';
div.innerHTML='<span>'+r.symbol+'</span><span class="rune-name">'+r.name+'</span>';
div.addEventListener('click',function(){
document.getElementById('runeSymbol').textContent=r.symbol;
document.getElementById('runeName').textContent=r.name;
document.getElementById('runeMeaning').textContent=r.meaning;
$$('.rune-symbol').forEach(function(x){x.style.background='#1a1230'});
div.style.background='#2f1f5a';
var runeResult=$('#runeResult');
runeResult.classList.remove('flash');void runeResult.offsetWidth;runeResult.classList.add('flash');
var rect=div.getBoundingClientRect();
spawnParticles(rect.left+rect.width/2,rect.top+rect.height/2,20,['#d9b45c','#f0d68a','#8f6bff'],{speed:3,speedVar:5,size:2,gravity:0.05});
Bayes.logRune(r.name);
});
runeGrid.appendChild(div);
});
$('#drawRune').addEventListener('click',function(){
var r=runesData[Math.floor(Math.random()*runesData.length)];
document.getElementById('runeSymbol').textContent=r.symbol;
document.getElementById('runeName').textContent=r.name;
document.getElementById('runeMeaning').textContent=r.meaning;
$$('.rune-symbol').forEach(function(x){x.style.background='#1a1230'});
var runeResult=$('#runeResult');
runeResult.classList.remove('flash');void runeResult.offsetWidth;runeResult.classList.add('flash');
var rect=runeResult.getBoundingClientRect();
spawnParticles(rect.left+rect.width/2,rect.top+rect.height/2,40,['#d9b45c','#f0d68a','#8f6bff','#fff'],{speed:4,speedVar:6,size:3,gravity:0.08});
triggerFlash(rect.left+rect.width/2,rect.top+rect.height/2);
Bayes.logRune(r.name);
});
/* КОЛЕСО */
var wheelSegments=['Удача','Любовь','Деньги','Здоровье','Путешествие','Карьера','Семья','Творчество','Мудрость','Перемены','Спокойствие','Выбор'];
var wheelColors=['#d9b45c','#8f6bff','#f0d68a','#5b3fa8','#d9b45c','#8f6bff','#f0d68a','#5b3fa8','#d9b45c','#8f6bff','#f0d68a','#5b3fa8'];
var wheelCanvas=$('#wheelCanvas'), wctx=wheelCanvas.getContext('2d');
var wheelAngle=0, spinning=false;
function drawWheel(angle){
var cx=200,cy=200,r=180;
wctx.clearRect(0,0,400,400);
var n=wheelSegments.length;
var segAngle=2*Math.PI/n;
for(var i=0;i<n;i++){
var start=angle+i*segAngle;
var end=start+segAngle;
wctx.beginPath();
wctx.moveTo(cx,cy);
wctx.arc(cx,cy,r,start,end);
wctx.closePath();
wctx.fillStyle=wheelColors[i];
wctx.fill();
wctx.strokeStyle='#fff';wctx.lineWidth=2;wctx.stroke();
wctx.save();wctx.translate(cx,cy);wctx.rotate(start+segAngle/2);
wctx.textAlign='center';wctx.textBaseline='middle';
wctx.fillStyle='#fff';wctx.font='bold 14px Manrope';
wctx.shadowBlur=8;wctx.shadowColor='rgba(0,0,0,0.8)';
wctx.fillText(wheelSegments[i], r*0.65, 0);
wctx.restore();
}
wctx.beginPath();wctx.moveTo(cx,20);wctx.lineTo(cx-12,40);wctx.lineTo(cx+12,40);wctx.closePath();
wctx.fillStyle='#d9b45c';wctx.fill();
}
drawWheel(0);
$('#spinWheel').addEventListener('click',function(){
if(spinning)return;
spinning=true;
var targetAngle=(5+Math.random()*4)*2*Math.PI + Math.random()*2*Math.PI;
var start=wheelAngle;
var duration=4000+Math.random()*2000;
var startTime=performance.now();
function animate(time){
var elapsed=time-startTime;
var progress=Math.min(elapsed/duration,1);
var eased=1-Math.pow(1-progress,3);
var current=start+targetAngle*eased;
wheelAngle=current;
drawWheel(current);
if(progress<1) requestAnimationFrame(animate);
else {
spinning=false;
var segAngle=2*Math.PI/wheelSegments.length;
var raw=(2*Math.PI - (current % (2*Math.PI))) % (2*Math.PI);
var idx=Math.floor(raw/segAngle);
if(idx>=wheelSegments.length) idx=0;
var result=wheelSegments[idx];
var rect=wheelCanvas.getBoundingClientRect();
var cx=rect.left+rect.width/2;
var cy=rect.top+rect.height/2;
for(var w=0;w<3;w++){
(function(delay){setTimeout(function(){spawnFirework(cx+(Math.random()-0.5)*100,cy+(Math.random()-0.5)*100);},delay);})(w*400);
}
triggerFlash(cx,cy);
wheelCanvas.classList.add('stopped');
setTimeout(function(){wheelCanvas.classList.remove('stopped');},1500);
var msg='Выпало: «'+result+'»!';
$('#wheelResult').textContent=msg;
Bayes.logWheel(result);
}
}
requestAnimationFrame(animate);
});
/* СБРОС ЛАБОРАТОРИИ */
$('#labReset').addEventListener('click',function(){
if(confirm('Сбросить всю статистику?')){
Bayes.reset();
alert('Статистика сброшена.');
}
});
/* ПЕРВОНАЧАЛЬНОЕ ОБНОВЛЕНИЕ */
Bayes.updateAll();
/* ══════════════════════════════════════
ПОЧИНЕННАЯ ЗАСТАВКА
══════════════════════════════════════ */
(function(){
var canvas = document.getElementById('introCanvas');
var skipBtn = document.getElementById('introSkip');
if(!canvas || !canvas.getContext) return; // Защита от отсутствия canvas
var ctx = canvas.getContext('2d');
var W, H, finished = false;
function resize(){
W = canvas.width = window.innerWidth;
H = canvas.height = window.innerHeight;
}
resize();
window.addEventListener('resize', resize);
var phase = 0, time = 0;
var raven = {x:-200,y:H*0.3,targetY:H*0.3,speed:5,phase:0};
var fairy = {x:W*0.75,y:H*0.4,scale:0,appear:false,wandAngle:0,waving:false};
var fireworks = [];
var candles = [];
for(var i=0;i<5;i++){
candles.push({x:0.1+i*0.2,y:0.95,height:0.08+Math.random()*0.04});
}
function drawCandles(){
var baseY = H*0.92;
candles.forEach(function(c,idx){
var cx = W*c.x;
var cy = baseY;
var h = H*c.height;
var w = 8 + Math.sin(time*2+idx)*2;
ctx.save();
ctx.shadowColor = '#d9b45c';
ctx.shadowBlur = 10;
ctx.fillStyle = '#f5e6d3';
ctx.fillRect(cx-w/2, cy-h, w, h);
ctx.shadowBlur = 0;
var flick = Math.sin(time*4+idx*2)*0.08+1;
var fh = 14*flick;
var fw = 8*(0.8+Math.sin(time*5+idx*3)*0.2);
var grad = ctx.createRadialGradient(cx,cy-h-fh*0.3,2,cx,cy-h-fh*0.5,fw);
grad.addColorStop(0,'#fff8d8');
grad.addColorStop(0.4,'#ffb648');
grad.addColorStop(1,'rgba(255,180,72,0)');
ctx.shadowBlur = 30;
ctx.shadowColor = '#ffb648';
ctx.fillStyle = grad;
ctx.beginPath();
ctx.ellipse(cx,cy-h-fh*0.5,fw,fh,0,0,Math.PI*2);
ctx.fill();
ctx.shadowBlur = 0;
ctx.restore();
});
}
function drawRaven(){
if(raven.phase===2) return;
ctx.save();
ctx.translate(raven.x, raven.y);
ctx.shadowColor = '#d9b45c';
ctx.shadowBlur = 8;
ctx.fillStyle = '#1a1a1a';
ctx.beginPath();
ctx.ellipse(0,0,50,28,0,0,Math.PI*2);
ctx.fill();
ctx.fillStyle = '#222';
ctx.beginPath();
ctx.ellipse(-10,-10,40,18,-0.2+Math.sin(time*8)*0.1,0,Math.PI*2);
ctx.fill();
ctx.fillStyle = '#111';
ctx.beginPath();
ctx.arc(30,-8,20,0,Math.PI*2);
ctx.fill();
ctx.shadowBlur = 4;
ctx.fillStyle = '#e8c840';
ctx.beginPath();
ctx.moveTo(46,-4);ctx.lineTo(60,-1);ctx.lineTo(46,2);ctx.closePath();
ctx.fill();
ctx.shadowBlur = 0;
ctx.fillStyle = '#e8c840';
ctx.beginPath();ctx.arc(34,-14,6,0,Math.PI*2);ctx.fill();
ctx.fillStyle = '#111';
ctx.beginPath();ctx.arc(36,-14,3,0,Math.PI*2);ctx.fill();
ctx.restore();
}
function drawFairy(){
if(!fairy.appear) return;
ctx.save();
ctx.translate(fairy.x,fairy.y);
ctx.scale(fairy.scale,fairy.scale);
ctx.shadowColor = '#f0d68a';
ctx.shadowBlur = 40;
ctx.fillStyle = 'rgba(240,214,138,0.15)';
ctx.beginPath();
ctx.arc(0,0,80,0,Math.PI*2);
ctx.fill();
ctx.shadowBlur = 0;
var grad = ctx.createLinearGradient(0,10,0,40);
grad.addColorStop(0,'#8f6bff');
grad.addColorStop(1,'#5b3fa8');
ctx.fillStyle = grad;
ctx.beginPath();
ctx.moveTo(-12,10);ctx.quadraticCurveTo(0,45,12,10);ctx.fill();
ctx.fillStyle = '#f5e6d3';
ctx.beginPath();ctx.arc(0,-8,14,0,Math.PI*2);ctx.fill();
ctx.fillStyle = '#e8c840';
ctx.beginPath();ctx.arc(0,-16,16,0,Math.PI*2);ctx.fill();
ctx.fillStyle = '#3a2c1a';
ctx.beginPath();ctx.arc(-5,-10,2.5,0,Math.PI*2);ctx.fill();
ctx.beginPath();ctx.arc(5,-10,2.5,0,Math.PI*2);ctx.fill();
ctx.shadowColor = '#d9b45c';
ctx.shadowBlur = 25;
ctx.fillStyle = 'rgba(240,214,138,0.35)';
ctx.beginPath();ctx.ellipse(-18,-2,24,12,-0.3+Math.sin(time*2)*0.05,0,Math.PI*2);ctx.fill();
ctx.beginPath();ctx.ellipse(18,-2,24,12,0.3-Math.sin(time*2)*0.05,0,Math.PI*2);ctx.fill();
ctx.shadowBlur = 0;
ctx.save();
ctx.translate(20,-5);
ctx.rotate(fairy.wandAngle);
ctx.strokeStyle = '#d9b45c';
ctx.lineWidth = 2;
ctx.shadowColor = '#f0d68a';
ctx.shadowBlur = 15;
ctx.beginPath();
ctx.moveTo(0,0);ctx.lineTo(40,-5);ctx.stroke();
ctx.shadowBlur = 25;
ctx.fillStyle = '#f0d68a';
ctx.font = '18px sans-serif';
ctx.fillText('✦', 36, -12);
ctx.shadowBlur = 0;
ctx.restore();
ctx.restore();
}
function drawFireworks(){
fireworks.forEach(function(f){
ctx.save();
ctx.globalAlpha = f.life;
ctx.shadowColor = f.color;
ctx.shadowBlur = 12;
ctx.fillStyle = f.color;
ctx.beginPath();
ctx.arc(f.x,f.y,f.size*f.life,0,Math.PI*2);
ctx.fill();
ctx.shadowBlur = 0;
ctx.restore();
});
}
function fadeOut(){
var op = 1;
var interval = setInterval(function(){
op -= 0.04;
if(op > 0){
canvas.style.opacity = op;
skipBtn.style.opacity = op;
} else {
clearInterval(interval);
canvas.style.display = 'none';
skipBtn.style.display = 'none';
finished = true;
}
}, 30);
}
function skipIntro(){
if(finished) return;
finished = true;
fadeOut();
}
canvas.addEventListener('click', skipIntro);
skipBtn.addEventListener('click', skipIntro);
function update(){
time += 0.02;
if(phase===0){
if(time > 1.5){
phase = 1;
raven.x = -200;
raven.y = H*0.25+Math.random()*80-40;
raven.targetY = H*0.25+Math.random()*80-40;
raven.speed = 4+Math.random()*2;
}
} else if(phase===1){
raven.x += raven.speed*1.5;
raven.y += (raven.targetY-raven.y)*0.02;
if(raven.x > W*0.6){
phase = 2;
fairy.appear = true;
fairy.x = W*0.75;
fairy.y = H*0.4;
fairy.scale = 0;
}
} else if(phase===2){
fairy.scale += 0.03;
if(fairy.scale>=1.2) fairy.scale=1.2;
if(fairy.scale>0.5 && !fairy.waving){
fairy.waving = true;
phase = 3;
}
} else if(phase===3){
fairy.wandAngle += 0.12;
if(fairy.wandAngle>0.8){
fairy.wandAngle = 0.8;
raven.phase = 2;
for(var i=0;i<80;i++){
var angle = Math.random()*Math.PI*2;
var speed = 2+Math.random()*8;
fireworks.push({
x:raven.x,y:raven.y,
vx:Math.cos(angle)*speed,
vy:Math.sin(angle)*speed-1,
life:1,decay:0.008+Math.random()*0.012,
size:2+Math.random()*4,
color:['#d9b45c','#f0d68a','#8f6bff','#ff6a4d','#4fd6e0','#fff'][Math.floor(Math.random()*6)]
});
}
phase = 4;
time = 0;
}
} else if(phase===4){
if(time>2){
phase = 5;
time = 0;
}
} else if(phase===5){
if(time>2.5){
phase = 6;
fadeOut();
}
}
for(var i=fireworks.length-1;i>=0;i--){
var f = fireworks[i];
f.x += f.vx;
f.y += f.vy;
f.vy += 0.05;
f.life -= f.decay;
if(f.life<=0) fireworks.splice(i,1);
}
}
function draw(){
if(finished) return;
ctx.clearRect(0,0,W,H);
var grad = ctx.createLinearGradient(0,0,0,H);
grad.addColorStop(0,'#0d0a1c');
grad.addColorStop(0.4,'#1a1230');
grad.addColorStop(1,'#120d2e');
ctx.fillStyle = grad;
ctx.fillRect(0,0,W,H);
for(var i=0;i<80;i++){
var sx = (i*137.5+123) % W;
var sy = (i*97.3+45) % (H*0.7);
var br = 0.3+0.7*Math.sin(time*0.5+i);
ctx.globalAlpha = br;
ctx.fillStyle = '#efe9dc';
ctx.beginPath();
ctx.arc(sx,sy,0.8+Math.sin(time+i)*0.3,0,Math.PI*2);
ctx.fill();
}
ctx.globalAlpha = 1;
drawCandles();
if(raven.phase!==2 && phase>=1) drawRaven();
drawFairy();
drawFireworks();
if(phase>=5 && phase<6){
ctx.save();
ctx.shadowColor = '#f0d68a';
ctx.shadowBlur = 30;
ctx.fillStyle = '#f0d68a';
ctx.font = 'bold '+Math.min(36,W*0.05)+'px Cormorant,serif';
ctx.textAlign = 'center';
ctx.fillText('✨ Добро пожаловать в Мистический салон ✨', W/2, H*0.15);
ctx.font = Math.min(20,W*0.03)+'px Manrope,sans-serif';
ctx.fillStyle = '#a79ec9';
ctx.fillText('Присаживайся, я покажу тебе тайны', W/2, H*0.22);
ctx.shadowBlur = 0;
ctx.restore();
}
update();
requestAnimationFrame(draw);
}
canvas.style.opacity = 1;
draw();
})();
})();
</script>
</body>
</html>
2026-08-26T07:08:06Z
https://pandoraburo.ru/ssl/u/pic/23/28e0c6a04211f1a10691d899ddef63/-/1787633987.png
1592962
https://www.pandoraburo.ru/