/* Brighter mineral pigments for the three landscapes. Paper and reading ink stay quiet. */
.ritual-desk{
 --vermilion:#b94335;--vermilion-deep:#9f302d;
 --world-base:#176979;--world-light:#fff6da;--world-soft:#fff0cf;
 --world-blue:#187fa3;--world-jade:#16866d;--world-bright:#65d2a8;
 --world-gold:#f3cb79;--world-gold-deep:#a57b32;
 --world-mat:#126c67;--world-mat-light:#32a28a;--world-brocade:#208b82;
 --world-sun:#ffc779;
 background:var(--world-base);color:var(--ink);
}
.ritual-desk[data-world="dusk"]{
 --world-base:#824565;--world-light:#fff4dc;--world-soft:#fff0d6;
 --world-blue:#626eaa;--world-jade:#af5a72;--world-bright:#f3aa91;
 --world-gold:#ffd18a;--world-gold-deep:#a96c38;
 --world-mat:#773e6a;--world-mat-light:#ad6789;--world-brocade:#ab5678;
 --world-sun:#ffb968;
}
.ritual-desk[data-world="night"]{
 --world-base:#292a66;--world-light:#fff2cf;--world-soft:#ece7ff;
 --world-blue:#4e65b1;--world-jade:#5c68a7;--world-bright:#a8b5e8;
 --world-gold:#f4d48a;--world-gold-deep:#aa8840;
 --world-mat:#303976;--world-mat-light:#667cba;--world-brocade:#5556a4;
 --world-sun:#ffe2a0;
}
.ritual-desk .desk-world::before{background:none}
.ritual-desk .desk-backdrop{position:fixed;inset:0;z-index:0;width:100%;height:100svh;max-width:none;opacity:1;mix-blend-mode:normal;pointer-events:none}
.ritual-desk .desk-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,#14395114,transparent 23%,transparent 77%,#17354929);pointer-events:none}
.ritual-desk .desk-backdrop #world-art{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:1;mix-blend-mode:normal}
.ritual-desk .desk-backdrop>span{top:17%;right:5%;font-size:clamp(28px,3vw,46px);color:var(--world-light);opacity:.6;text-shadow:0 2px 8px #0e28354d}
.ritual-desk .desk-header .brand{color:var(--world-light);text-shadow:0 1px 5px #0f293b55}
.ritual-desk .desk-header .brand small{color:var(--world-soft)}
.ritual-desk .desk-header .brand-seal{color:var(--paper);box-shadow:inset 0 0 0 1px #f5e7cbbf,0 3px 9px #102b3633}
.ritual-desk .desk-tool{color:var(--world-light);text-shadow:0 1px 4px #16304166}
.ritual-desk .desk-tool small{color:var(--world-gold);font-size:10px}
.ritual-desk .tool-book{background:linear-gradient(90deg,#b89457 0 4px,var(--world-brocade) 5px);border-color:var(--world-gold);box-shadow:2px 3px 0 #132b3644,inset -2px 0 0 #e8d7a744}
.ritual-desk .tool-book::before{border-left-color:#e9c882}
.ritual-desk .tool-book>i{background:#f1d99c;box-shadow:0 5px 0 #e6cd9377,0 10px 0 #e6cd9377}
.ritual-desk .tool-fold{border-color:var(--world-gold);background:linear-gradient(90deg,var(--world-blue) 0 31%,#cfb278 32% 34%,var(--world-jade) 35% 65%,#cfb278 66% 68%,var(--world-blue) 69%);box-shadow:2px 3px 0 #132b3644}
.ritual-desk .tool-fold::before{background:#efdb9c88;box-shadow:0 5px 0 #efdb9c55}

/* Landscape selection: actual 44px targets around small mineral beads. */
.ritual-desk .world-picker{position:relative;display:flex;align-items:center;justify-content:center;gap:1px;min-width:0}
.ritual-desk #world-caption{color:var(--world-soft);font:11px/1.5 var(--serif);margin-right:10px;text-shadow:0 1px 5px #17303b77;white-space:nowrap}
.ritual-desk .world-picker>button{position:relative;display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;margin:0;padding:0;background:none;border:0;border-radius:50%;touch-action:manipulation}
.ritual-desk .world-picker>button>i{display:block;width:18px;height:18px;border:1px solid #f5e5bb99;border-radius:50%;box-shadow:inset 1px 1px 2px #fff1c455,1px 2px 4px #10273566;transition:transform .18s ease,box-shadow .18s ease}
.ritual-desk .world-picker>button[data-world="jade"]>i{background:linear-gradient(135deg,#80e3b6,#16879e 70%)}
.ritual-desk .world-picker>button[data-world="dusk"]>i{background:linear-gradient(135deg,#ffbc7c,#d56891 70%)}
.ritual-desk .world-picker>button[data-world="night"]>i{background:linear-gradient(135deg,#b0b2f0,#5750ab 70%)}
.ritual-desk .world-picker>button[aria-pressed="true"]>i{transform:scale(1.1);box-shadow:0 0 0 3px #132c4544,0 0 0 4px var(--world-gold),inset 1px 1px 2px #fff1c455}
.ritual-desk .world-picker>button:focus-visible{outline:2px solid var(--world-gold);outline-offset:-3px}
.ritual-desk .world-picker>button:hover>i{transform:scale(1.12)}
.ritual-desk .desk-quest{color:var(--world-soft);text-shadow:0 1px 5px #16374866}
.ritual-desk .desk-quest::before{color:var(--world-soft)}
.ritual-desk .desk-quest>b{background:#e4d7ad66}
.ritual-desk .desk-quest>span>i{color:var(--world-soft);border-color:#e4d7ad88;background:#153d5538;text-shadow:none}
.ritual-desk .desk-quest>span.done{color:var(--world-light)}
.ritual-desk .desk-quest>span.done>i{background:var(--world-jade);color:var(--world-light);border-color:var(--world-gold)}
.ritual-desk .desk-quest>span.active{color:var(--world-light)}
.ritual-desk .desk-quest>span.active>i{color:#183d48;background:var(--world-gold);border-color:#f2dca6;box-shadow:0 0 0 3px #e1be7622}
.ritual-desk .desk-invitation{color:var(--world-light);text-shadow:0 1px 7px #183d4e88}

/* A colored silk mat gives the coins a vivid, readable play area. */
.ritual-desk .coin-field>span{width:min(100%,370px);height:225px;border:1px solid var(--world-gold);background:var(--paper-fibers),radial-gradient(ellipse at 44% 40%,var(--world-mat-light),var(--world-mat) 78%);box-shadow:inset 0 0 0 4px #133e491a,inset 0 0 0 5px #d4b56d5c,0 9px 25px #143a402b}
.ritual-desk .coin-field>i{border-color:#efcf8e40;width:68%;height:70%;box-shadow:0 0 0 1px #0d3c4922}
.ritual-desk .cast-charge-ring{background:conic-gradient(from 220deg,var(--world-gold) calc(var(--charge,0)*1turn),#d9bd7b44 0);opacity:calc(.4 + var(--charge,0)*.6);z-index:0}
.ritual-desk .cast-charge-label{left:50%;right:auto;width:max-content;max-width:94%;bottom:9px;transform:translateX(-50%);padding:3px 10px;color:var(--world-light);font-size:10px;background:var(--world-mat);border:1px solid #e2c48755;border-radius:13px;text-shadow:none;opacity:1;white-space:nowrap}
.ritual-desk .desk-casting.is-charging .cast-charge-label{color:var(--world-gold);opacity:1}
@supports selector(:has(*)){.ritual-desk .desk-casting:has(#coins.is-charging) .cast-charge-label{color:var(--world-gold);opacity:1}}
.ritual-desk .ritual-message{width:fit-content;max-width:330px;color:var(--ink);background:#fff2d8d9;padding:3px 11px;border-radius:3px;text-shadow:none;font-size:11px;box-shadow:0 2px 9px #1e3a3a0b}
.ritual-desk .desk-question{background:var(--paper-fibers),linear-gradient(112deg,#fff8e4,#fcf0d7 84%,#e9d8b5);box-shadow:3px 8px 18px #16313b2b,-1px 1px 0 #fff8e7b3;border-bottom-color:#c0aa7866}
.ritual-desk .desk-question::after{background:linear-gradient(225deg,transparent 47%,#c7b78c55 49%,#f9f0d9 55%)}
.ritual-desk #question{font-size:16px}
.ritual-desk .desk-scroll{background:var(--paper-fibers),linear-gradient(90deg,var(--world-brocade) 0 9px,#e8d3a0 9px 10px,var(--paper) 10px calc(100% - 10px),#e8d3a0 calc(100% - 10px) calc(100% - 9px),var(--world-brocade) calc(100% - 9px));border-left-color:var(--world-gold);border-right-color:var(--world-gold);box-shadow:3px 8px 17px #15384330}
.ritual-desk .scroll-rod{border-color:var(--world-gold-deep);background:linear-gradient(to bottom,#e3c58d,var(--world-gold) 25%,#a6874d 75%,#ccb176);box-shadow:0 2px 3px #18354138}
.ritual-desk .scroll-hint{color:var(--world-light);text-shadow:0 1px 6px #173d4f99}
.ritual-desk .desk-milestones>span{color:var(--world-soft);border-color:#eddbb188;background:#123e4d44;opacity:1}
.ritual-desk .desk-milestones>span.active{color:var(--world-gold);border-color:var(--world-gold);box-shadow:0 0 0 2px #dbbd7422;background:#17435999}
.ritual-desk .desk-milestones>span.filled{background:var(--world-jade);border-color:var(--world-gold);color:var(--world-light);box-shadow:0 1px 4px #17394566}
.ritual-desk[data-stage="complete"] .desk-milestones>span.filled{background:var(--vermilion);border-color:var(--world-gold);color:var(--world-light)}
.ritual-desk #cast-button{outline-color:var(--world-gold);box-shadow:inset 0 0 0 2px #efd1a966,inset 0 0 0 4px #6e20192b,1px 4px 0 #6e2d2480,0 7px 16px #163b452e}
.ritual-desk #cast-button:focus-visible{outline-color:var(--world-light);box-shadow:0 0 0 6px var(--world-blue)}
.ritual-desk #reset-button{color:var(--world-light);text-decoration-color:var(--world-gold);text-shadow:0 1px 5px #13334399}
.ritual-desk .desk-actions .under-button{color:var(--world-light);text-shadow:0 1px 5px #13334399}
.ritual-desk .desk-bottom,.ritual-desk .desk-whisper{color:var(--world-light);text-shadow:0 1px 5px #133343bb}
.ritual-desk .desk-settings-button{position:relative;min-height:44px;color:var(--world-light);text-shadow:0 1px 5px #133343bb;font-size:12px}
.ritual-desk .desk-settings-button>span{color:var(--world-gold)}
.ritual-desk .desk-scene{grid-template-rows:25px 28px minmax(0,1fr) 130px 44px}

/* Six tiny gilded brush marks appear with the six actual lines. */
.ritual-desk .scene-mote{position:absolute;z-index:1;display:block;width:25px;height:5px;max-height:5px;border-radius:50%;background:linear-gradient(90deg,transparent,var(--world-gold),#fff0b9,transparent);box-shadow:0 0 8px #eccb7b55;opacity:0;transform:rotate(-12deg) scaleX(.35);pointer-events:none;transition:opacity .6s ease,transform .6s ease}
.ritual-desk .scene-mote.revealed{opacity:.85;transform:rotate(-12deg) scaleX(1)}
.ritual-desk .scene-mote[data-scene-layer="1"]{left:15%;top:48%}
.ritual-desk .scene-mote[data-scene-layer="2"]{left:24%;top:71%;width:38px}
.ritual-desk .scene-mote[data-scene-layer="3"]{left:79%;top:36%;transform:rotate(8deg) scaleX(.35)}
.ritual-desk .scene-mote[data-scene-layer="4"]{left:88%;top:65%;width:32px}
.ritual-desk .scene-mote[data-scene-layer="5"]{left:67%;top:87%;width:43px}
.ritual-desk .scene-mote[data-scene-layer="6"]{left:35%;top:91%;width:35px}
.ritual-desk .scene-mote[data-scene-layer="3"].revealed{transform:rotate(8deg) scaleX(1)}

/* Every reading still opens on quiet paper; only its binding follows the world. */
.ritual-desk .sheet-paper{border-top-color:var(--world-brocade);border-bottom-color:var(--world-brocade);box-shadow:inset 0 1px 0 var(--world-gold),0 13px 40px #10293840}
.ritual-desk .sheet-close{min-height:44px;font-size:12px;border-color:var(--world-gold);box-shadow:0 3px 10px #14303d33}
.ritual-desk .desk-sheet::backdrop{background:#122b3b80}
.ritual-desk .manual-grid{min-width:0}
.ritual-desk .manual-grid>label{min-width:0}
.ritual-desk .manual-grid select{width:100%;min-width:0}

@media(max-width:1050px){.ritual-desk #world-caption{font-size:10px;margin-right:3px}.ritual-desk .coin-field>span{height:205px}}
@media(max-width:900px) and (min-width:761px){.ritual-desk #world-caption{display:none}.ritual-desk .world-picker{gap:0}}
@media(max-width:760px){
 .ritual-desk .desk-backdrop #world-art{object-position:70% 50%}
 .ritual-desk .desk-backdrop>span{right:5%;top:19%;font-size:25px;opacity:.45}
 .ritual-desk .world-picker{position:fixed;right:2px;top:calc(50svh - 66px);z-index:6;display:flex;flex-direction:column;gap:0;min-height:132px;width:44px;padding:0;background:#14344a20;border-radius:24px}
 .ritual-desk #world-caption{display:block;position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .ritual-desk .world-picker>button{flex-basis:44px;width:44px;height:44px;min-width:44px;min-height:44px}
 .ritual-desk .world-picker>button>i{width:16px;height:16px}
 .ritual-desk .desk-header .desk-tools{gap:17px}
 .ritual-desk .desk-tool{font-size:11px}
 .ritual-desk .desk-quest{font-size:11px}
 .ritual-desk .desk-quest>span>i{width:18px;height:18px}
 .ritual-desk .desk-invitation{font-size:16px;line-height:1.5}
 .ritual-desk .desk-scene{grid-template-rows:23px 24px minmax(0,1fr) 119px 44px}
 .ritual-desk .coin-field>span{width:290px;height:165px}
 .ritual-desk .coin-field>i{width:240px;height:135px}
 .ritual-desk .cast-charge-label{font-size:11px;bottom:3px;padding:3px 8px}
 .ritual-desk .ritual-message{font-size:11px;line-height:1.5;max-width:290px;padding:2px 8px;min-height:26px}
 .ritual-desk .desk-question-options summary{font-size:10px}
 .ritual-desk .desk-actions .under-button{font-size:10px;line-height:1.5}
 .ritual-desk #reset-button{font-size:11px}
 
 .ritual-desk .desk-settings-button{font-size:12px}
 .ritual-desk .sheet-paper input,.ritual-desk .sheet-paper textarea,.ritual-desk .sheet-paper select,.ritual-desk #detail-dialog textarea,.ritual-desk #manual-area select{font-size:16px!important;max-width:100%;min-width:0}
 .ritual-desk #manual-area select{min-height:38px}
 .ritual-desk .sheet-close{min-height:44px}
 .ritual-desk .scene-mote[data-scene-layer="1"]{left:9%;top:43%}
 .ritual-desk .scene-mote[data-scene-layer="2"]{left:18%;top:65%;width:25px}
 .ritual-desk .scene-mote[data-scene-layer="3"]{left:80%;top:33%}
 .ritual-desk .scene-mote[data-scene-layer="4"]{left:88%;top:73%;width:20px}
 .ritual-desk .scene-mote[data-scene-layer="5"]{left:67%;top:86%;width:30px}
 .ritual-desk .scene-mote[data-scene-layer="6"]{left:27%;top:94%;width:25px}
}
@media(max-width:360px){
 .ritual-desk .desk-casting{padding-right:25px}
 .ritual-desk .desk-tool{font-size:10px}
 .ritual-desk .desk-header .desk-tools{gap:13px}
 .ritual-desk .world-picker{right:0}
}
@media(max-height:720px) and (max-width:760px){
 .ritual-desk .desk-scene{grid-template-rows:21px 24px minmax(0,1fr) 108px 44px}
 .ritual-desk .coin-field>span{width:250px;height:135px}
 .ritual-desk .coin-field>i{width:215px;height:113px}
 .ritual-desk .cast-charge-label{font-size:10px;bottom:0}
 .ritual-desk .ritual-message{font-size:10px;line-height:1.4}
 
}
@media(max-height:670px) and (min-width:761px){.ritual-desk .desk-scene{grid-template-rows:22px 24px minmax(0,1fr) 109px 44px}}
/* Short phones get a taller play surface instead of compressing the coin mat,
   instructions, and scroll into the same space. The stamp remains reachable. */
@media(max-height:800px) and (max-width:760px){
 .ritual-desk .desk-world{height:max(100svh,840px);min-height:100svh;overflow:visible}
 .ritual-desk .desk-scene{grid-template-rows:23px 24px minmax(0,1fr) 113px 44px}
 .ritual-desk .desk-casting{min-height:254px}
 .ritual-desk #ritual-area{max-height:none;grid-template-rows:minmax(210px,1fr) 44px}
 .ritual-desk .desk-casting .ritual-stage{max-height:none}
 .ritual-desk .ritual-message{min-height:30px;align-self:center}
 .ritual-desk .cast-charge-label{bottom:8px}
 .ritual-desk .desk-backdrop{height:100svh}
}
@supports selector(:has(*)){
 /* Lock the document scrollport as well as the body while a native sheet is
    open. No fixed positioning or scroll-offset change: closing restores the
    same table position, and the sheet keeps its own independent scrollport. */
 html:has(body.ritual-desk dialog[open]){overflow:hidden;overscroll-behavior:none}
 .ritual-desk:has(dialog[open]){overflow:hidden;overscroll-behavior:none}
 @media(max-width:760px){
  .ritual-desk:has(#manual-area:not([hidden])) .desk-world{height:max(100svh,900px);min-height:100svh;overflow:visible}
  .ritual-desk:has(#manual-area:not([hidden])) .desk-scene{grid-template-rows:23px 24px minmax(0,1fr) 113px 44px}
  .ritual-desk #manual-area{min-height:300px}
  .ritual-desk #manual-area .manual-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;margin:14px 0}
  .ritual-desk #manual-area .manual-grid label{font-size:11px;line-height:1.4}
  .ritual-desk #manual-area select{min-height:44px;line-height:1.3;width:100%;min-width:0;text-overflow:ellipsis}
  .ritual-desk #manual-area .manual-caption{font-size:14px;line-height:1.5}
  .ritual-desk #manual-area .manual-key{font-size:11px;line-height:1.5}
 }
}
@media(prefers-reduced-motion:reduce){.ritual-desk .scene-mote,.ritual-desk .world-picker>button>i{transition:none!important}.ritual-desk .world-picker>button:hover>i{transform:none}.ritual-desk .world-picker>button[aria-pressed="true"]>i{transform:none}}
