@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Marcellus&display=swap');
:root{--bg:#0b1026;--panel:#131b36;--panel2:#1b2342;--line:rgba(199,210,251,.16);--gold:#eecf87;--text:#f4f2fa;--muted:#aeb9d1;--aqua:#82e4de;--purple:#b6a2f6}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#0b1026;color:var(--text);font-family:'DM Sans',sans-serif;font-size:14px}button,select,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #82e4de;outline-offset:3px}.aurora{position:fixed;z-index:0;pointer-events:none;filter:blur(85px);border-radius:50%;opacity:.45}.a1{background:#47318c;width:390px;height:400px;top:-220px;left:-110px}.a2{background:#125c79;width:500px;height:440px;top:240px;right:-310px}.frame{max-width:1400px;margin:auto;padding:0 26px;position:relative;z-index:1}.nav{height:85px;display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line)}.mark{border:0;color:#fff;background:none;display:flex;align-items:center;gap:11px;text-align:left;flex-shrink:0}.mark-symbol{font-size:29px;color:var(--gold)}.mark b{display:block;letter-spacing:2px;font-family:Marcellus,Georgia,serif;font-size:19px}.mark small{display:block;font-size:9px;color:#aaafd2;letter-spacing:2px;margin-top:4px}.nav nav{display:flex;margin:auto;gap:3px;flex-wrap:wrap}.nav nav button{background:none;border:0;color:#bec5da;padding:11px 15px;border-radius:10px}.nav nav button:hover,.nav nav button.active{background:#23294c;color:#fff}.connection{font-size:11px;color:#9adacf;white-space:nowrap}.screen{display:none;animation:appear .23s ease}.screen.visible{display:block}@keyframes appear{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold);font-weight:800}.hero{min-height:580px;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;padding:48px 0 24px}.hero-text h1{font-family:Marcellus,Georgia,serif;font-size:clamp(49px,6vw,88px);letter-spacing:1px;margin:14px 0 5px;line-height:1.02;color:#fff}.hero-text h1 i{color:var(--gold);font-style:normal}.hero h2{font-family:Marcellus,Georgia,serif;font-size:clamp(24px,3vw,33px);font-weight:400;color:#e8d9b1;margin:12px 0 16px}.hero-text p{color:#bac4dd;font-size:16px;line-height:1.85;max-width:520px}.hero-text p strong{color:#e5e9ff}.hero-buttons{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:12px;padding:14px 19px;border:1px solid var(--line);font-weight:800;transition:transform .15s ease,background .15s ease}.btn:hover:not(:disabled){transform:translateY(-2px)}.btn.primary{background:linear-gradient(120deg,#f5df9b,#d6ae5c);color:#222036;border:0}.btn.ghost{background:rgba(255,255,255,.06);color:#f8f5fe}.btn.soft{background:#29314d;color:white}.btn.tiny{padding:9px 11px;font-size:12px}.stretch{width:100%}.mini-stats{display:flex;gap:15px;flex-wrap:wrap;color:#b6b6d2;font-size:11px}.hero-image{position:relative;border-radius:30px;min-height:480px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#2b4167,#121833 60%,#0b1026)}.hero-image>img{width:100%;height:500px;object-fit:cover;mix-blend-mode:screen;opacity:.87}.hero-halo{position:absolute;inset:40px;border-radius:100%;border:1px solid #e4c98445;box-shadow:0 0 85px #e4c9841c}.hero-label{position:absolute;bottom:24px;left:24px;right:24px;border:1px solid #c6acd355;backdrop-filter:blur(18px);background:#0c123699;padding:14px 20px;font-family:Marcellus,serif;letter-spacing:3px;font-size:16px}.hero-label span{float:right;color:#e5cc8d;font-family:DM Sans,sans-serif;font-size:10px}.hero-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 44px}.hero-foot>div{background:#19203b99;border:1px solid var(--line);padding:19px;border-radius:16px}.hero-foot b,.hero-foot span{display:block}.hero-foot b{color:#f5e7bc}.hero-foot span{color:#afb8d2;margin-top:8px;line-height:1.6}.hero-characters{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:42px}.hero-char{background:#121c35;border:1px solid var(--line);border-radius:17px;overflow:hidden}.hero-char img{width:100%;height:150px;object-fit:contain;background:radial-gradient(circle,#223a57,#10182c)}.hero-char div{padding:10px 13px}.hero-char b{display:block;color:#e8d3a4;font-size:14px}.hero-char small{display:block;color:#aabbd2;margin-top:3px}.section-heading{text-align:center;max-width:740px;margin:44px auto 30px}.section-heading h2{font-family:Marcellus,serif;color:#f6ebc8;font-size:39px;font-weight:400;margin:10px 0}.section-heading p{line-height:1.8;color:#acb6d2}.setup-grid{display:grid;grid-template-columns:1fr .82fr;gap:22px;max-width:990px;margin:0 auto 60px}.panel{background:#151e39;border:1px solid var(--line);border-radius:23px;padding:27px}.field-label{font-size:12px;color:#eddaae;font-weight:800;display:block;margin-bottom:10px}.select,.name-input{border-radius:10px;background:#242e4b;border:1px solid #384764;color:#fff;padding:12px;width:100%;min-width:0}.name-input{flex:1}.roster-row{display:flex;align-items:center;gap:12px;margin:17px 0}.number-ball{color:#ebd28d;background:#292d51;border:1px solid #747292;padding:9px;border-radius:12px;min-width:39px;text-align:center}.roster-row select{flex:.7;min-width:100px}.helper{color:#8496b3;font-size:12px;line-height:1.6}.rule-glance{background:radial-gradient(circle at 80% 10%,#3e3761,#161e36 65%)}.glance-number{font-family:Marcellus,serif;color:#f9df99;font-size:115px;line-height:1;margin:32px 0}.glance-number small{font:700 18px DM Sans;color:white}.glance-line{padding:15px 0;border-top:1px solid var(--line);color:#ccd3e5;display:flex;align-items:center;gap:16px}.glance-line b{color:#e0c57f}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 358px;gap:19px;align-items:start}.board-panel{border:1px solid var(--line);border-radius:22px;background:linear-gradient(140deg,#19223e,#0d152a);overflow:hidden}.board-bar{padding:20px 22px 7px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.board-tip{font-size:12px;color:#c0d0df}.map-holder{position:relative;width:100%;aspect-ratio:1 / 1;max-height:730px;overflow:hidden}.map-holder svg{display:block;width:100%;height:100%}.map-node{cursor:pointer;transform-origin:center}.map-node:not(.selectable){cursor:default}.map-node.selectable .node-glow{animation:pulse 1.6s infinite}@keyframes pulse{0%,100%{opacity:.24}50%{opacity:.85}}.map-node .node-dot{transition:transform .15s}.map-node.selectable:hover .node-dot{stroke:#fff;stroke-width:4}.map-label{font-family:DM Sans,sans-serif;fill:#f2eade;text-shadow:0 2px 4px #050918;font-weight:800;paint-order:stroke;stroke:#111730;stroke-width:3px;stroke-linejoin:round}.map-key{display:flex;flex-wrap:wrap;gap:14px;padding:7px 22px 20px;color:#aebbd3;font-size:11px}.key-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}.key-dot.island{background:#eacc8b}.key-dot.omen{background:#caa3f7}.key-dot.nest{background:#80e3d3}.key-dot.path{background:#4d739c}.side{display:flex;flex-direction:column;gap:14px}.sidebox{background:#192340;border:1px solid var(--line);border-radius:19px;padding:18px}.sidebox h3{margin:4px 0 15px;font-family:Marcellus,serif;color:#f0deb0;font-size:19px;font-weight:400}.turntitle{font-size:11px;color:#cbbf93;letter-spacing:1.6px}.turnstatus{font-size:13px;line-height:1.65;color:#c8d6e3;margin:8px 0 17px}.dice-area{display:flex;gap:10px;margin:15px 0}.die{border:2px solid #667091;border-radius:14px;background:#fbf9f5;color:#18223c;width:85px;height:85px;font-size:39px;font-weight:800;box-shadow:0 7px 20px #0002}.die.selected{border-color:#eed27e;box-shadow:0 0 0 3px #cfac5b33,0 8px 25px #eecf8733}.die small{display:block;font-size:9px;font-weight:800;color:#596580;margin-top:-7px}.recipient-list{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.recipient-btn{border:1px solid #506180;color:white;background:#253152;padding:9px 11px;border-radius:10px}.recipient-btn.selected{border-color:#d8b56a;background:#4a3f4f}.turn-note{font-size:12px;color:#d5e0f4;margin:12px 0;line-height:1.75}.hint{background:#182f48;border:1px solid #5473946c;border-radius:10px;padding:10px 12px;margin:9px 0;color:#c3e1ed;font-size:12px}.hero-power{width:100%;text-align:left;margin-top:11px;border:1px solid #dabb7980;border-radius:11px;background:#433b48;color:#fff1d4;padding:12px}.player-mini{padding:10px 0;border-bottom:1px solid #ffffff14;display:flex;align-items:center;gap:11px}.player-mini:last-child{border-bottom:0}.mini-avatar{width:48px;height:48px;object-fit:cover;border-radius:10px;background:#1e3452}.player-mini b{display:block}.player-mini small{display:block;margin-top:4px;color:#a6b7d1;font-size:11px}.active-player b{color:#f5d587}.feathers{display:flex;gap:4px;margin-top:5px}.feather-dot{width:12px;height:12px;border-radius:2px 12px 2px 12px;transform:rotate(-20deg);border:1px solid #eee5b777}.game-top{display:flex;gap:14px;justify-content:space-between;align-items:center;background:#1b2740c9;border:1px solid var(--line);border-radius:16px;padding:16px 19px;margin:20px 0}.game-top h2{font-family:Marcellus,serif;font-size:22px;font-weight:400;margin:4px 0;color:#f5dfa7}.game-top p{color:#aabbce;font-size:12px;margin:3px 0}.top-actions{display:flex;gap:8px;flex-wrap:wrap}.log-panel{background:#121c34;border:1px solid var(--line);padding:16px 20px;border-radius:17px;margin:16px 0 35px}.log-title{color:#e3c987;margin-bottom:9px;font-weight:800;font-size:12px}.log-entry{padding:7px 0;border-bottom:1px solid #ffffff12;color:#aebed1;font-size:12px}.log-entry:last-child{border-bottom:0}.oracle-zone{display:grid;grid-template-columns:290px 1fr;gap:40px;max-width:790px;margin:24px auto 45px;align-items:center}.oracle-showcase{min-height:390px;border:3px solid #e8c982;box-shadow:0 13px 40px #0008,0 0 0 6px #343361;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border-radius:20px;background:radial-gradient(ellipse at 50% 32%,#55417b,#191b40 67%);padding:23px}.oracle-showcase b{font-family:Marcellus,serif;color:#f4dda0;font-size:26px;line-height:1.35}.oracle-showcase small{margin-top:24px;color:#beacd8;letter-spacing:1px}.tarot-moon{font-size:83px;color:#ffdea2;margin-bottom:20px}.oracle-intro h3{font-family:Marcellus,serif;font-weight:400;font-size:28px;color:#f4db9f}.oracle-intro p{line-height:1.75;color:#b7c3dd}.oracle-intro .btn{margin-right:9px;margin-top:10px}.oracle-drawn .fortune-sub{color:#deb9fc;letter-spacing:1.3px;font-size:10px;margin:12px}.oracle-drawn h3{font-family:Marcellus,serif;color:#f4e1b9;font-size:27px;margin:12px 0}.oracle-drawn p{color:#d7dbef;line-height:1.6}.oracle-drawn .oracle-effects{text-align:left;color:#f9eac5;font-size:12px;line-height:1.6}.deck-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:25px 0}.deck-item{padding:18px;background:#19233d;border:1px solid var(--line);border-radius:13px}.deck-item h4{color:#f1dba5;margin:4px 0}.deck-item p{color:#b7c3dd;font-size:12px;line-height:1.5}.character-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:14px 0 45px}.character-card{background:#19213c;border:1px solid #c7b38b55;border-radius:15px;overflow:hidden}.character-card img{width:100%;height:165px;object-fit:cover}.character-card>div{padding:11px}.character-card b{display:block;color:#efdcaa;font-size:16px}.character-card small{color:#b7c2d3;font-size:11px;line-height:1.5}.hero-section-title{font-family:Marcellus,serif;color:#eedbb3;margin-top:45px}.rules-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:26px}.rule{padding:22px;border-radius:16px;border:1px solid var(--line);background:#19213d}.rule span{font-family:Marcellus,serif;color:#d9b574;font-size:30px}.rule h3{color:#f5e4bd;font-family:Marcellus,serif;font-size:20px;font-weight:400;margin:7px 0}.rule p{color:#bbc6dc;line-height:1.8}.explain-connection{background:#17283f;border:1px solid #50829b66;border-radius:15px;padding:18px 22px;margin-bottom:26px}.explain-connection b{color:#b5e8e3}.explain-connection p{color:#bdcadd;line-height:1.7}.hidden{display:none!important}.modal-mask{position:fixed;z-index:20;inset:0;background:#060919da;backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:18px}.modal-inner{width:min(95vw,570px);max-height:90vh;overflow:auto;border:1px solid #d5b57685;background:radial-gradient(ellipse at 50% 0,#39335a,#151c35 68%);border-radius:21px;padding:26px;box-shadow:0 24px 70px #0009}.modal-inner h2{font-family:Marcellus,serif;color:#f3db9a;font-size:31px;font-weight:400;margin:10px 0}.modal-inner p{color:#c7cee5;line-height:1.75}.modal-actions{display:grid;gap:10px;margin:19px 0 0}.choice{background:#25314c;border:1px solid #667491;border-radius:13px;color:#fff;padding:13px 15px;text-align:left;line-height:1.6;display:block}.choice:hover{background:#354362;border-color:#e6c583}.choice strong{color:#f1d996;display:block}.modal-target-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.modal-target{border:1px solid #596b92;background:#263253;color:white;padding:10px 13px;border-radius:10px}.modal-target.selected{border-color:#e4c17b;background:#53455f}.winner-img{width:132px;height:132px;object-fit:cover;border-radius:100px;border:3px solid #e3c57e;display:block;margin:15px auto}.winner-title{text-align:center;color:#f4db9a!important}.winner-body{text-align:center}.save-note{font-size:11px;color:#9eb7c6;line-height:1.7;margin:8px 0 0}.footer-actions{display:flex;gap:10px;flex-wrap:wrap}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;padding:25px 0;color:#8193b2;font-size:10px;letter-spacing:.2px}.feedback-form{display:grid;gap:10px;margin-top:20px}.feedback-form textarea{background:#212c48;border:1px solid #596d8c;border-radius:12px;color:white;width:100%;padding:12px;min-height:80px;resize:vertical}.rating{display:flex;gap:7px}.rating button{border:1px solid #536686;color:#d9cfaf;background:#243451;border-radius:10px;padding:9px 13px}.rating button.active{background:#5e4d58;border-color:#eecf87;color:#f6dda2}
@media(max-width:1060px){.play-layout{grid-template-columns:minmax(0,1fr) 310px}.frame{padding:0 18px}.hero-text h1{font-size:55px}.hero-image{min-height:380px}.hero-image>img{height:410px}}
@media(max-width:760px){.frame{padding:0 13px}.nav{height:auto;min-height:78px;padding:15px 0;flex-wrap:wrap}.mark{margin-right:auto}.mark b{font-size:16px}.mark small{font-size:8px}.connection{font-size:10px}.nav nav{width:100%;overflow:auto;justify-content:space-between}.nav nav button{font-size:12px;padding:8px}.hero{display:flex;flex-direction:column;min-height:auto;padding-top:38px;gap:25px}.hero-image{width:100%;min-height:300px}.hero-image>img{height:330px}.hero-foot{grid-template-columns:1fr}.hero-characters,.character-grid{grid-template-columns:repeat(2,1fr)}.hero-text h1{font-size:clamp(46px,12vw,70px)}.hero-buttons .btn{flex:1}.setup-grid,.play-layout{grid-template-columns:1fr}.map-holder{max-height:none}.game-top{align-items:flex-start;flex-direction:column}.side{display:grid;grid-template-columns:1fr 1fr}.rules-grid{grid-template-columns:1fr 1fr}.deck-list{grid-template-columns:1fr 1fr}.oracle-zone{grid-template-columns:1fr;justify-items:center}.oracle-showcase{width:min(86vw,320px)}.oracle-intro{text-align:center}.board-bar{padding:15px 15px 0}.map-key{padding:9px 15px 15px}footer{display:block}footer span{display:block;margin:8px 0}}
@media(max-width:480px){.side{grid-template-columns:1fr}.rules-grid{grid-template-columns:1fr}.deck-list{grid-template-columns:1fr}.board-tip{display:none}.die{width:80px;height:80px}.section-heading h2{font-size:30px}.hero-buttons{display:block}.hero-buttons .btn{width:100%;margin:5px 0}.roster-row{gap:6px}.number-ball{min-width:30px}.roster-row select{max-width:115px}.name-input{width:80px}.hero-char img{height:125px}}

/* R4 celestial world artwork, separate from the old seven-gate board */
.hero-sky{position:relative;width:100%;height:500px;background:radial-gradient(circle at 50% 58%,#365977 0%,#242a50 38%,#1a1e3d 67%,#0b1026 100%);overflow:hidden}.hero-sky:before,.hero-sky:after{content:"";position:absolute;border:1px solid #e7d3a055;border-radius:50%;width:450px;height:450px;left:50%;top:54%;transform:translate(-50%,-50%);box-shadow:0 0 80px #d9b86e15}.hero-sky:after{width:320px;height:320px;border-style:dashed;opacity:.45}.hero-sky img{position:absolute;object-fit:cover;border:3px solid #e8d39b;border-radius:25px;box-shadow:0 22px 45px #070b1dcc}.hero-leading{width:42%;height:61%;top:13%;left:29%;z-index:3}.hero-sky img.hero-partner{width:29%;height:45%;top:34%;z-index:2}.hero-sky img.left{left:5%;transform:rotate(-9deg)}.hero-sky img.right{right:5%;transform:rotate(9deg)}.hero-sky-star{position:absolute;color:#f6df9a;z-index:5;font-size:38px;text-shadow:0 0 25px #f6c77c}.hero-sky-star.one{top:12%;left:10%}.hero-sky-star.two{top:18%;right:16%}.hero-sky-star.three{bottom:10%;left:19%}.hero-image .hero-halo{z-index:1;pointer-events:none}.hero-image .hero-label{z-index:6}
@media(max-width:760px){.hero-sky{height:340px}.hero-leading{height:67%;top:10%}.hero-sky img.hero-partner{height:42%;top:40%}}

/* R4.1 — readable step-by-step wayfinding */
.key-dot.arrow{background:#ffe29b;box-shadow:0 0 0 2px #dbad5c77}
.map-node.here .node-dot{filter:drop-shadow(0 0 8px #fff1b3)}
.map-node.selectable .node-glow{animation:pulse 1.25s infinite}
.move-arrow{cursor:pointer;filter:drop-shadow(0 0 10px #ecca77);outline:none}
.move-arrow:hover circle:first-child,.move-arrow:focus-visible circle:first-child{fill:#745a39;stroke:#ffffff;stroke-width:5}
.move-arrow:active{opacity:.75}
.move-guide{background:linear-gradient(130deg,#224452,#243154);padding:16px;border:2px solid #c6a864;border-radius:15px;margin:7px 0 14px}
.move-guide p{color:#f1f3fa;line-height:1.62;margin:8px 0;font-size:13px}
.move-guide p b{color:#fff0b6}
.move-guide small{color:#c0dbe4;font-size:11px;line-height:1.6}
.guide-head{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;color:#fff4cc;font-weight:800}
.guide-head span{font-size:11px;letter-spacing:.6px}.guide-head strong{font-size:14px;background:#f5d890;color:#25243b;border-radius:9px;padding:6px 10px}
.walk-progress{display:flex;gap:3px;margin:13px 0 8px;flex-wrap:wrap}.walk-progress i{display:block;width:21px;height:9px;background:#547087;border-radius:4px}.walk-progress i.done{background:#f9dc96}
.oracle-story{font-size:16px!important;color:#fff5cc!important;font-weight:600}
.oracle-action-label{font-size:11px;letter-spacing:1px;font-weight:900;margin-top:16px;color:#a8e6e0}
.modal-actions .choice strong{font-size:15px;line-height:1.5}
@media(max-width:480px){.board-tip{display:block;line-height:1.4}.board-bar{padding-top:13px}.map-key{font-size:10px;gap:8px}.move-guide{padding:13px}}

.move-arrow{touch-action:manipulation}