*{box-sizing:border-box}body{margin:0;background:#111;color:#f1f1ed;font-family:Arial,sans-serif}a{color:inherit;text-decoration:none}header{display:flex;justify-content:space-between;padding:28px 5%;border-bottom:1px solid #333;font-size:12px;letter-spacing:2px}main{max-width:1500px;margin:auto;padding:42px 5% 70px}.heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px}h1{font:400 clamp(38px,5vw,72px)/1.03 Georgia,serif;margin:0;letter-spacing:-1px}h1 em{font-weight:400}.heading p{font-size:16px;color:#aaa;max-width:260px;line-height:1.7}.stage{position:relative;height:min(68vh,720px);min-height:420px;background:#08090b;overflow:hidden;border:1px solid #303030}canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}#status{position:absolute;top:20px;left:24px;color:#ddd;font-size:14px;pointer-events:none}.tools{position:absolute;left:20px;right:20px;bottom:52px;display:flex;justify-content:center;flex-wrap:wrap;gap:12px}.tools>div{display:flex;background:#171719e8;border:1px solid #555}.tools button{border:0}.tools>button{background:#171719e8;border:1px solid #555}button{color:#ccc;font:14px Arial,sans-serif;padding:12px 16px;cursor:pointer;background:none}button[aria-pressed=true]{background:#eee;color:#151515}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #fff;outline-offset:4px}button:hover{color:#fff;background:#424242}button[aria-pressed=true]:hover{background:#fff;color:#111}.hint{position:absolute;bottom:12px;left:12px;right:12px;text-align:center;font-size:12px;color:#bbb;pointer-events:none}.scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:28px}.scenes button{padding:0;text-align:left;border:1px solid #444;background:none;color:#aaa}.scenes img{display:block;width:100%;height:100px;object-fit:cover;opacity:.65}.scenes span{display:block;padding:14px;font-size:14px}.scenes button[aria-pressed=true]{border-color:#fff;background:#252525;color:#fff}.scenes button[aria-pressed=true] img{opacity:1}footer{border-top:1px solid #333;padding:28px 5%;font-size:12px;letter-spacing:1px}.stage:fullscreen{height:100vh;width:100vw}.stage:fullscreen canvas{height:100%}@media(max-width:600px){header{font-size:12px;letter-spacing:1px}.heading{display:block}.heading p{max-width:none;margin:20px 0}.stage{height:65vh;min-height:450px}.tools{left:8px;right:8px;gap:7px;bottom:58px}button{padding:10px 12px}.hint{line-height:1.5;bottom:8px}.scenes{grid-template-columns:repeat(2,1fr);gap:12px}.scenes img{height:90px}}

.entry-prompt{position:absolute;top:24px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:16px 22px;background:#111e;border:1px solid #777;text-align:center;box-shadow:0 8px 30px #0005;animation:invitation-in .35s ease-out}
.entry-prompt[hidden]{display:none}.entry-prompt p{font:italic 22px/1.3 Georgia,serif;margin:0 0 12px}.entry-prompt button{background:#f1f1ed;color:#111;padding:10px 24px;min-width:120px}.entry-prompt button:hover{background:white}.tools button:disabled{opacity:.5;cursor:wait}.tools [aria-label="Acercar o alejar"] button{min-width:44px;font-size:20px;padding:8px 14px}.viewer-journal{padding:0 5% 25px;font-size:14px}.viewer-journal a{text-decoration:underline;text-underline-offset:5px}#status:empty{display:none}#status{max-width:calc(100% - 48px);font-size:12px;background:#111b;padding:7px 10px;border-radius:2px}
@keyframes invitation-in{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}@media(max-width:600px){.entry-prompt{top:18px;padding:12px 16px}.entry-prompt p{font-size:19px}.tools{bottom:66px}.hint{font-size:11px}.stage{min-height:510px}.tools>div{flex-shrink:0}}@media(prefers-reduced-motion:reduce){.entry-prompt{animation:none}}

.entry-prompt{top:auto;bottom:130px}@media(max-width:600px){.entry-prompt{top:auto;bottom:178px}}
