/* Předměty se umisťují samostatně na společný ubrus podle dodané předlohy. */
:root{--header-height:74px;--panel-space:72px}
body{padding:0;min-height:100svh}
main{height:100svh;min-height:0;padding:0;overflow:visible}
.table{position:fixed;inset:var(--header-height) 0 0;z-index:1;display:flex;align-items:flex-start;justify-content:center;height:auto;min-height:0;margin:0;padding:0;overflow:hidden}
.scene-layout{position:relative;flex:none;width:min(100vw,calc((100svh - var(--header-height) - var(--panel-space))*1.3672));aspect-ratio:1009/738}
.candle-place{position:absolute;left:5%;top:3%;width:22%;padding:0;min-width:0;z-index:3}
.candle-place .svicka{width:100%;--velikost:100%}
.scene-object{position:absolute;display:block;height:auto;max-width:none;pointer-events:none;user-select:none}
.pins{left:24%;top:0%;width:24%;z-index:2}
.hair-twig{left:-4%;top:25%;width:33%;z-index:2}
.doll{left:70%;top:49%;width:62%;transform:translate(-50%,-50%) rotate(65deg);transform-origin:center;z-index:2}
.reading{position:fixed;inset:auto 8% 0;z-index:90;width:auto;margin:0;padding:18px 26px;border-radius:16px 16px 0 0;max-height:calc(100svh - var(--header-height) - 12px);overflow-y:auto;scrollbar-gutter:auto}
.reading-guide{display:block;min-width:0}
.reading-guide p{font-size:clamp(16px,1.4vw,22px);font-weight:700;line-height:1.4;margin:0;color:#fff;overflow-wrap:break-word}
@media(max-width:1000px){.reading{inset:auto 5% 0;padding:14px 20px}}
@media(max-width:700px){
:root{--header-height:112px;--panel-space:80px}
.reading{inset:auto 3% 0;padding:12px 16px}
.reading-guide p{font-size:16px}
}

/* Systémová ruka jen pro přesný ukazatel s podporou najetí. */
@media (hover: hover) and (pointer: fine){
  html, body, body *{cursor:pointer}
}

.doll-image{display:block;width:100%;height:auto;pointer-events:none}
.pins{pointer-events:auto;touch-action:auto}
.stuck-pin{position:absolute;display:block;width:0;height:0;pointer-events:none;--pin-color:#ee263c;--pin-light:#ff6573;--pin-dark:#a00b20;transform:rotate(var(--pin-angle));transform-origin:0 0;z-index:5}
.stuck-pin::before{content:"";position:absolute;width:2px;height:36px;left:-1px;bottom:0;background:linear-gradient(90deg,#555,#fff,#737373);box-shadow:1px 1px 1px #0005}
/* Lesklé plastové kuličky společné pro tažené i uložené špendlíky. */
.stuck-pin::after{content:"";position:absolute;width:18px;height:18px;left:-9px;bottom:29px;border-radius:50%;background:radial-gradient(ellipse 22% 17% at 30% 23%,#fff 0%,#fffffff0 40%,#ffffff00 100%),radial-gradient(ellipse 50% 42% at 33% 28%,#ffffff60 0%,#ffffff00 100%),radial-gradient(circle at 35% 30%,var(--pin-light) 0%,var(--pin-color) 48%,var(--pin-dark) 100%);box-shadow:inset -1px -2px 3px #0003,inset 1px 1px 1px #ffffff55,1px 2px 3px #0005}
.stuck-pin[data-color=green]{--pin-color:#00a75a;--pin-light:#23cf80;--pin-dark:#006a36}
.stuck-pin[data-color=yellow]{--pin-color:#ffcf00;--pin-light:#ffe64b;--pin-dark:#bc8500}
.stuck-pin[data-color=black]{--pin-color:#202326;--pin-light:#50575c;--pin-dark:#080a0c}
.stuck-pin[data-color=ivory]{--pin-color:#eeedde;--pin-light:#fffff4;--pin-dark:#a7aa91}

.dragged-pin{position:fixed;z-index:300;transform:rotate(var(--pin-angle)) scale(1.2);filter:drop-shadow(2px 3px 2px #0006)}
.dragged-pin.valid-drop::after{outline:2px solid #fff9}
.reading-guide .pin-status{font-size:14px;line-height:1.35;font-weight:400;margin-top:6px;color:#ddd}
@media (hover:hover) and (pointer:fine){body.holding-pin,body.holding-pin *{cursor:none}}