/* Výška scény i panelu se přizpůsobuje celému oknu. */
body{padding:0;min-height:100svh}
main{height:100svh;min-height:540px;padding:74px 0 0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:0;overflow:hidden}
.table{height:auto;min-height:0;margin:0;padding:0 4%;grid-template-columns:minmax(100px,20%) minmax(0,1fr);overflow:hidden}
.candle-place{position:relative;z-index:2;grid-column:1;grid-row:1;padding-top:20px;max-width:230px;width:100%}
#pendulum-canvas{position:absolute;height:150%;width:auto;max-width:none;aspect-ratio:1;right:0;bottom:-28%;pointer-events:none}
.reading{position:relative;inset:auto;z-index:3;width:84%;max-height:none;overflow:visible;scrollbar-gutter:auto;margin:0 auto;padding:18px 26px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;border-radius:16px 16px 0 0}
.reading-guide{display:grid;gap:7px;min-width:0}
.reading-guide h1{font:700 clamp(22px,1.8vw,30px)/1.15 Arial,Helvetica,sans-serif;letter-spacing:normal;margin:0 0 4px;color:white}
.reading-guide p{font-size:clamp(14px,1.15vw,19px);line-height:1.35;margin:0;font-weight:700}
.pendulum-actions{display:flex;justify-content:center;margin:0}
#ask-pendulum{border:1px solid #d99af5;border-radius:999px;background:#a344ce;color:white;font-weight:700;font-size:clamp(15px,1.15vw,20px);padding:16px 24px;min-height:52px;white-space:nowrap;box-shadow:0 4px 24px #9f41ce30}
#ask-pendulum:focus-visible{outline:3px solid white;outline-offset:5px}
#ask-pendulum:disabled{opacity:.6;cursor:wait}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1000px){
 .reading{width:90%;gap:12px;padding:14px 20px;grid-template-columns:1fr}
 .pendulum-actions{margin-top:2px}
 #ask-pendulum{padding:12px 24px;min-height:46px}
}
@media(max-width:700px){
 main{padding-top:112px}
 .table{grid-template-columns:minmax(80px,22%) minmax(0,1fr);padding:0 4%}
 .candle-place{max-width:130px;padding-top:12px}
 #pendulum-canvas{height:auto;width:180%;right:-10%;bottom:-28%}
 .reading{width:94%;padding:12px 16px;gap:10px}
 .reading-guide{gap:6px}
 .reading-guide h1{font-size:21px;line-height:1.15;margin-bottom:2px}
 .reading-guide p{font-size:14px;line-height:1.3}
 #ask-pendulum{font-size:15px;min-height:44px;padding:12px 20px}
}
@media(max-height:650px) and (min-width:701px){
 main{min-height:430px}
 .reading{padding:12px 22px;gap:16px;grid-template-columns:minmax(0,1fr) auto}
 .reading-guide{gap:4px}
 .reading-guide h1{font-size:22px}
 .reading-guide p{font-size:14px;line-height:1.25}
 #ask-pendulum{font-size:14px;padding:13px 18px}
}
/* Vrstvy přes celou plochu: ubrus, předměty a nad nimi informační panel. */
main{display:block;height:100svh;min-height:0;padding:0;overflow:visible}
.table{position:fixed;inset:74px 0 0;z-index:1;height:auto;min-height:0;margin:0;overflow:visible}
#pendulum-canvas{width:clamp(600px,calc(150svh - 410px),1800px);height:auto;aspect-ratio:1920/2320;top:-8%;right:0;bottom:auto;z-index:1}
.candle-place{z-index:2}
.reading{position:fixed;inset:auto 8% 0;z-index:90;width:auto;margin:0;max-height:calc(100svh - 90px);overflow-y:auto}
@media(max-width:1000px){.reading{inset:auto 5% 0}}
@media(max-width:700px){
 main{padding:0}
 .table{inset:112px 0 0}
 #pendulum-canvas{width:min(150vw,110svh);height:auto;top:4%;right:-10%;bottom:auto}
 .reading{inset:auto 3% 0;width:auto;max-height:calc(100svh - 124px)}
}
@media(max-height:650px) and (min-width:701px){main{min-height:0}}