/* Ink, aged gold and small paper objects share the same quiet night scene. */
body.ritual-desk[data-scene="3d"]{
  --bg:#262823;--xuan:#262823;--paper:#f5ecd6;--paper-shade:#e8dabd;
  --ink:#342e27;--ink-soft:#564a3e;--muted:#6f6252;--line:#d4c3a5;
  --bronze:#a88c54;--bronze-soft:#c6b18a;--world-gold:#b99b5e;
  --world-gold-deep:#79623a;--world-brocade:#423b26;
  --scene-ink:#eee0ba;--scene-soft:#cebd96;--scene-muted:#b7aa8b;
  background:#262823;
}
body.ritual-desk[data-scene="3d"] .desk-header .brand,
body.ritual-desk[data-scene="3d"] #desk3d-intro h2{color:var(--scene-ink)}
body.ritual-desk[data-scene="3d"] .desk-header .brand small,
body.ritual-desk[data-scene="3d"] #desk3d-intro :is([data-desk3d-copy="eyebrow"],[data-desk3d-copy="hint"],.desk3d-loading){color:var(--scene-muted)}
body.ritual-desk[data-scene="3d"] #desk3d-intro h2{ text-shadow:0 2px 18px #0008 }
body.ritual-desk[data-scene="3d"] .desk-header .brand-seal{background:#8b4233;color:#f7e9c9;box-shadow:inset 0 0 0 1px #b88f59,0 3px 8px #0004}
body.ritual-desk[data-scene="3d"] .desk-header .desk-tool{color:var(--scene-soft)}
body.ritual-desk[data-scene="3d"] .desk-header .desk-tool small{color:#d2ae67}
body.ritual-desk[data-scene="3d"] .desk-header .tool-book{background:linear-gradient(90deg,#b29860 0 4px,#443a24 5px);border-color:#a78a4f}
body.ritual-desk[data-scene="3d"] .desk-header .tool-fold{background:linear-gradient(90deg,#695735 0 31%,#c1a56a 32% 34%,#3c3827 35% 65%,#c1a56a 66% 68%,#695735 69%);border-color:#a78a4f}
body.ritual-desk[data-scene="3d"] .desk-header .language-toggle,
body.ritual-desk[data-scene="3d"] #desk3d-reset-view,
body.ritual-desk[data-scene="3d"] .desk3d-coin-key,
body.ritual-desk[data-scene="3d"] #ritual-message,
body.ritual-desk[data-scene="3d"] .desk-actions :is(#reset-button,.under-button){background:#151a16ed;color:var(--scene-soft);border-color:#9a814966}
body.ritual-desk[data-scene="3d"] .desk-header .language-toggle{box-shadow:0 2px 8px #0003}
body.ritual-desk[data-scene="3d"] .desk-question{background:var(--paper-fibers),linear-gradient(115deg,#f7eed8,#eaddbf);box-shadow:1px 6px 20px #0005;border-bottom-color:#a88c5480}
body.ritual-desk[data-scene="3d"] .desk-scroll{box-shadow:2px 6px 20px #0005}
body.ritual-desk[data-scene="3d"] .desk-milestones>span{color:#dac9a1;border-color:#9b824f;background:#1d221bd9}
body.ritual-desk[data-scene="3d"] .desk-milestones>span.active{color:#f3dda4;border-color:#d4ad5f;background:#3e3825}
body.ritual-desk[data-scene="3d"] .desk-milestones>span.filled{color:#201f18;border-color:#baa16b;background:#c5aa6e}
body.ritual-desk[data-scene="3d"] .desk-actions #cast-button{border-color:#c4a56a;background:linear-gradient(115deg,#d4ba7f,#b29453);box-shadow:inset 0 1px 0 #f5dfaa,0 4px 0 #4f4227,0 8px 22px #0006}
body.ritual-desk[data-scene="3d"] .desk-actions #cast-button:hover{background:linear-gradient(115deg,#e0c68c,#c1a15f);box-shadow:inset 0 1px 0 #f5dfaa,0 5px 0 #4f4227,0 10px 24px #0007}
body.ritual-desk[data-scene="3d"] .desk-actions #cast-button:active{box-shadow:inset 0 1px 0 #f5dfaa,0 1px 0 #4f4227,0 3px 10px #0006}
body.ritual-desk[data-scene="3d"] .desk-actions #cast-button :is(.seal-character,.seal-label){color:#292518}
body.ritual-desk[data-scene="3d"] .desk-actions #cast-button:focus-visible{outline-color:#ecd5a2}
body.ritual-desk[data-scene="3d"] .desk-bottom,
body.ritual-desk[data-scene="3d"] .desk-bottom .desk-whisper{color:var(--scene-muted)}
body.ritual-desk[data-scene="3d"] .desk-bottom-tools :is(.feedback-entry,.desk-settings-button,.sound-toggle){color:var(--scene-soft)}
body.ritual-desk[data-scene="3d"] .desk-bottom-tools :is(.feedback-entry,.desk-settings-button,.sound-toggle):hover{color:#f0d9a2}
body.ritual-desk[data-scene="3d"] :is(.desk-sheet,.desk-detail-sheet,.yaojian-feedback-dialog)::backdrop{background:#080c0bd1}
body.ritual-desk[data-scene="3d"] .sheet-paper{border-top-color:#5e4f30;border-bottom-color:#5e4f30}
body.ritual-desk[data-scene="3d"] .desk-header :is(button,a):focus-visible,
body.ritual-desk[data-scene="3d"] .desk-bottom button:focus-visible,
body.ritual-desk[data-scene="3d"] #desk3d-canvas canvas:focus-visible{outline-color:#d4b572}

/* The scroll is a readable paper object, with one shared pair of brocade
   rails. The small local ornaments stay at the edges, outside the ink. */
body.ritual-desk[data-scene="3d"] .desk-lines{width:166px}
body.ritual-desk[data-scene="3d"] .desk-scroll{
  --scroll-rail:12px;--scroll-trim:13px;
  width:162px;height:310px;min-height:310px;padding:33px 22px 27px;
  background-image:url("./assets/scroll-cloud-border.svg"),var(--paper-fibers),linear-gradient(90deg,var(--world-brocade) 0 var(--scroll-rail),#bca573 var(--scroll-rail) var(--scroll-trim),var(--paper) var(--scroll-trim) calc(100% - var(--scroll-trim)),#bca573 calc(100% - var(--scroll-trim)) calc(100% - var(--scroll-rail)),var(--world-brocade) calc(100% - var(--scroll-rail)));
  background-position:center,center,center;background-size:calc(100% - 30px) calc(100% - 12px),auto,100% 100%;background-repeat:no-repeat,repeat,no-repeat;
  box-shadow:2px 7px 22px #0006;
}
body.ritual-desk[data-scene="3d"] .scroll-rod{left:-9px;right:-9px;height:11px;border-radius:7px}
body.ritual-desk[data-scene="3d"] .scroll-heading{font-size:29px;margin:0 0 22px}
body.ritual-desk[data-scene="3d"] .desk-scroll .line-ladder{width:104px;height:132px;min-height:132px;gap:11px;margin:0 auto}
body.ritual-desk[data-scene="3d"] .desk-scroll .ladder-row{width:104px;height:10px;min-height:10px;flex:0 0 10px;font-size:10px;gap:9px;color:#877447}
body.ritual-desk[data-scene="3d"] .desk-scroll .yao-line{width:75px;height:6px;gap:13px;color:#342e27}
body.ritual-desk[data-scene="3d"] .desk-scroll .move-dot{font-size:13px;right:-12px;top:-5px}
body.ritual-desk[data-scene="3d"] .scroll-footer{font-size:14px;line-height:1.5;margin:20px 0 0;max-width:114px;color:#6d5d45}
body.ritual-desk[data-scene="3d"] .desk-milestones{gap:7px;height:15px;margin-top:16px}
body.ritual-desk[data-scene="3d"] .desk-milestones>span{width:15px;height:15px}

@media(min-width:761px) and (max-width:1000px){
  body.ritual-desk[data-scene="3d"] .desk-lines{width:140px}
  body.ritual-desk[data-scene="3d"] .desk-scroll{width:136px;height:270px;min-height:270px;padding:29px 17px 23px;--scroll-rail:10px;--scroll-trim:11px}
  body.ritual-desk[data-scene="3d"] .scroll-heading{font-size:26px;margin-bottom:18px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .line-ladder{width:89px;height:116px;min-height:116px;gap:10px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .ladder-row{width:89px;height:9px;min-height:9px;flex-basis:9px;font-size:9px;gap:7px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .yao-line{width:63px;height:5px;gap:11px}
  body.ritual-desk[data-scene="3d"] .scroll-footer{margin-top:17px;font-size:13px}
  body.ritual-desk[data-scene="3d"] .desk-milestones{gap:6px}
  body.ritual-desk[data-scene="3d"] .desk-milestones>span{width:14px;height:14px}
}
@media(min-width:761px) and (max-height:700px){
  body.ritual-desk[data-scene="3d"] .desk-scroll{height:260px;min-height:260px;padding-top:27px;padding-bottom:23px}
  body.ritual-desk[data-scene="3d"] .scroll-heading{font-size:25px;margin-bottom:17px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .line-ladder{height:108px;min-height:108px;gap:8px}
  body.ritual-desk[data-scene="3d"] .scroll-footer{margin-top:16px}
}
@media(max-width:760px){
  body.ritual-desk[data-scene="3d"] .desk-question{width:calc(100vw - 148px)}
  body.ritual-desk[data-scene="3d"] .desk-lines{right:18px;width:100px}
  body.ritual-desk[data-scene="3d"] .desk-scroll{--scroll-rail:7px;--scroll-trim:8px;width:96px;height:224px;min-height:224px;padding:25px 10px 20px;background-size:calc(100% - 20px) calc(100% - 12px),auto,100% 100%}
  body.ritual-desk[data-scene="3d"] .scroll-rod{left:-6px;right:-6px;height:9px}
  body.ritual-desk[data-scene="3d"] .scroll-heading{font-size:23px;margin-bottom:16px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .line-ladder{width:69px;height:92px;min-height:92px;gap:7px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .ladder-row{width:69px;height:7px;min-height:7px;flex-basis:7px;font-size:8px;gap:5px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .yao-line{width:48px;height:4px;gap:8px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .move-dot{font-size:10px;right:-9px;top:-4px}
  body.ritual-desk[data-scene="3d"] .scroll-footer{font-size:12px;margin-top:15px;max-width:74px}
  body.ritual-desk[data-scene="3d"] .desk-milestones{gap:4px;height:11px;margin-top:12px}
  body.ritual-desk[data-scene="3d"] .desk-milestones>span{width:11px;height:11px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-lines{left:16px;right:16px;width:auto;gap:10px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll{display:grid;grid-template-columns:20px 68px minmax(0,1fr);gap:8px;width:calc(100% - 80px);height:84px;min-height:84px;padding:12px 9px;background-image:url("./assets/scroll-cloud-strip.svg"),var(--paper-fibers),linear-gradient(90deg,#e8dabd,var(--paper) 8% 92%,#e8dabd);background-size:100% 100%,auto,100% 100%}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .scroll-heading{font-size:21px;margin:0}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll .line-ladder{width:68px;height:58px;min-height:58px;gap:4px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll .ladder-row{width:68px;height:6px;min-height:6px;flex-basis:6px;font-size:8px;gap:5px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll .yao-line{width:47px;height:4px;gap:8px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .scroll-footer{max-width:none;margin:0;font-size:12px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-milestones{flex:0 0 70px;width:70px;gap:3px;height:10px;margin:0}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-milestones>span{width:9px;height:9px}
}
@media(max-width:350px){
  body.ritual-desk[data-scene="3d"] .desk-question{width:calc(100vw - 141px)}
  body.ritual-desk[data-scene="3d"] .desk-lines{right:13px}
}
/* Phone paper starts above the rear tabletop props. Repeated introductory
   copy yields to the coin key, while a cast retains its reserved strip. */
@media(max-width:760px) and (min-height:451px){
  body.ritual-desk[data-scene="3d"] #desk3d-intro{top:64px}
  body.ritual-desk[data-scene="3d"] #desk3d-intro :is([data-desk3d-copy="eyebrow"],h2,[data-desk3d-copy="hint"]){display:none}
  body.ritual-desk[data-scene="3d"] .desk3d-view-tools{margin-top:0}
  body.ritual-desk[data-scene="3d"] .desk-question,
  body.ritual-desk[data-scene="3d"] .desk-lines{top:118px}
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-lines{top:119px}
}
@media(max-height:450px){
  body.ritual-desk[data-scene="3d"] .desk-question{width:150px}
  body.ritual-desk[data-scene="3d"] .desk-lines,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-lines{top:97px;left:auto;right:15px;width:108px;gap:0;flex-direction:column}
  body.ritual-desk[data-scene="3d"] .desk-scroll,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll{display:flex;flex-direction:column;gap:0;width:104px;height:176px;min-height:176px;padding:20px 12px 16px;--scroll-rail:7px;--scroll-trim:8px;background-image:url("./assets/scroll-cloud-border.svg"),var(--paper-fibers),linear-gradient(90deg,var(--world-brocade) 0 var(--scroll-rail),#bca573 var(--scroll-rail) var(--scroll-trim),var(--paper) var(--scroll-trim) calc(100% - var(--scroll-trim)),#bca573 calc(100% - var(--scroll-trim)) calc(100% - var(--scroll-rail)),var(--world-brocade) calc(100% - var(--scroll-rail)));background-size:calc(100% - 20px) calc(100% - 10px),auto,100% 100%}
  body.ritual-desk[data-scene="3d"] .scroll-heading,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .scroll-heading{font-size:20px;margin:0 0 9px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .line-ladder,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll .line-ladder{width:68px;height:68px;min-height:68px;gap:5px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .ladder-row,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll .ladder-row{width:68px;height:7px;min-height:7px;flex-basis:7px;font-size:8px;gap:5px}
  body.ritual-desk[data-scene="3d"] .desk-scroll .yao-line,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-scroll .yao-line{width:47px;height:4px;gap:8px}
  body.ritual-desk[data-scene="3d"] .scroll-footer,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .scroll-footer{font-size:12px;margin:9px 0 0;max-width:78px}
  body.ritual-desk[data-scene="3d"] .desk-milestones,
  body.ritual-desk[data-scene="3d"]:is([data-stage="tossing"],[data-stage="casting"],[data-stage="complete"]) .desk-milestones{width:78px;flex:0 0 auto;gap:3px;height:10px;margin:10px 0 0}
  body.ritual-desk[data-scene="3d"] .desk-milestones>span{width:10px;height:10px}
}

/* A projected, invisible hit area gives the real fortune tube keyboard and
   touch access without placing a permanent label over the tabletop. */
body.ritual-desk[data-scene="3d"] :is(#desk3d-lot,.desk3d-prop-target){
  position:absolute;z-index:1;min-width:44px;min-height:44px;padding:0;
  transform:translate(-50%,-50%);border:0;border-radius:14px;
  background:transparent;box-shadow:none;outline:2px solid transparent;
  outline-offset:4px;pointer-events:auto;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
body.ritual-desk[data-scene="3d"] :is(#desk3d-lot,.desk3d-prop-target):focus-visible{outline-color:#d4b57288}
body.ritual-desk[data-scene="3d"] :is(#desk3d-lot,.desk3d-prop-target):disabled{pointer-events:none;opacity:1;cursor:default;outline-color:transparent;background:transparent}