@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#fff8f9;background:#57356c;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}canvas{position:fixed;inset:0;width:100%;height:100%;display:block}button{font:inherit;cursor:pointer;color:inherit;border:1px solid #ffffff48;background:#402c5277;border-radius:30px;padding:12px 20px;backdrop-filter:blur(15px)}button:hover{background:#75496d}button:focus-visible{outline:3px solid #ffe2a0;outline-offset:4px}header{position:fixed;top:30px;left:38px;right:38px;display:flex;justify-content:space-between;align-items:center;z-index:3}.brand{display:flex;align-items:center;gap:12px;font-size:40px}.brand span{font-size:13px;font-weight:700;letter-spacing:2px}.brand small{display:block;letter-spacing:0;font-size:13px;font-weight:400;margin-top:6px;opacity:.75}.tools{display:flex;gap:8px}.tools button{font-size:14px}main{position:fixed;inset:0;background:linear-gradient(90deg,#372044cf,transparent 77%);display:flex;align-items:center;padding:100px 7vw 70px}.card{max-width:450px}.eyebrow{font-size:12px;letter-spacing:2.5px;color:#ffdfb4}h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(54px,6.8vw,100px);line-height:1.05;font-weight:500;letter-spacing:-3px;margin:23px 0}h1 em{color:#ffc4d7}p{font-size:16px;line-height:1.75;color:#eee1ef}.intro{font-size:20px;color:#fff}.primary{background:#ffd4df;color:#4c2949;border:0;font-weight:700;padding:17px 27px;min-width:230px;margin:18px 0}.primary:hover{background:#ffe7ee}.primary span{margin-left:28px}.instructions{display:flex;gap:22px;margin:17px 0;font-size:13px}kbd{font:inherit;border:1px solid #ffffff5c;border-radius:5px;padding:4px 7px;margin-right:5px}.gentle{font-size:12px;line-height:1.8;opacity:.65}.worldCaption{position:absolute;right:45px;bottom:45px;text-align:right;letter-spacing:2px;font-size:12px}.worldCaption small{letter-spacing:0;display:block;margin-top:9px;font-size:14px;opacity:.7}#hud{position:fixed;top:115px;left:38px;right:38px;pointer-events:none;display:flex;justify-content:space-between}#hud[hidden]{display:none}.chapter{display:grid;gap:8px;text-shadow:0 2px 20px #271333}.chapter small{font-size:12px;letter-spacing:2px;color:#ffe3bb}.chapter strong{font-family:'Playfair Display',Georgia,serif;font-size:26px}.chapter span{font-size:14px}.counter{background:#3c254d77;padding:15px 22px;border:1px solid #ffffff29;border-radius:18px;height:fit-content;font-size:14px;backdrop-filter:blur(10px)}.progress{height:3px;background:#ffffff33;margin-top:12px}.progress i{display:block;width:0;height:100%;background:#ffd4df;transition:width .4s}footer{position:fixed;bottom:26px;width:100%;text-align:center;font-size:13px;text-shadow:0 1px 6px #321437;display:none}footer span{margin:0 15px;opacity:.5}dialog{background:#fff1f3;color:#563749;border:1px solid white;border-radius:25px;width:min(480px,90vw);text-align:center;padding:38px;box-shadow:0 30px 100px #26103866}dialog::backdrop{background:#21132f70;backdrop-filter:blur(8px)}dialog small{font-size:12px;letter-spacing:2px;color:#9a5676}h2{font:500 38px/1.2 'Playfair Display',Georgia,serif;margin:22px 0}dialog p{color:#715467}dialog .primary{background:#713e68;color:white}#toast{position:fixed;bottom:85px;left:50%;transform:translateX(-50%);padding:13px 24px;border-radius:30px;background:#443058da;opacity:0;transition:opacity .2s;pointer-events:none;text-align:center;width:max-content;max-width:90vw;font-size:14px}#touch{display:none;position:fixed;bottom:25px;left:20px;right:20px;justify-content:space-between;align-items:end;pointer-events:none}#touch button{touch-action:none;user-select:none;pointer-events:auto;width:53px;height:53px;padding:0;font-size:23px;background:#48305599}.dpad{display:grid;grid-template-columns:repeat(3,53px);gap:5px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}#touch .jump{width:86px;height:86px;font-size:16px;background:#ffd4df;color:#563749}#error{position:fixed;inset:35%;background:#402438;padding:25px;z-index:20}body.playing #help{display:block}@media(pointer:coarse){body.playing #touch{display:flex}body.playing #help{display:none}}@media(max-width:650px){header{top:18px;left:20px;right:20px}.brand span{font-size:10px;letter-spacing:1px}.brand small{font-size:11px}.brand{font-size:30px;gap:7px}.tools button{padding:9px 12px;font-size:12px}main{padding:110px 28px 50px;background:linear-gradient(90deg,#372044df,#37204455)}h1{font-size:62px}.card{max-width:380px}.worldCaption{display:none}.intro{font-size:18px}p{font-size:15px}#hud{left:20px;right:20px;top:90px}.chapter strong{font-size:21px}.chapter span{max-width:190px;font-size:12px}.counter{padding:12px;font-size:12px}#toast{bottom:145px}.eyebrow{font-size:10px}#help{font-size:11px}footer span{margin:0 5px}}@media(max-height:690px){h1{font-size:54px;margin:14px 0}main{padding-top:90px}.card p{margin:10px 0}.primary{margin:10px 0}.instructions{margin:10px 0}.gentle{display:none}}

/* Comfortable reading and compact screens. */
dialog p{white-space:pre-line}dialog{max-height:85dvh;overflow:auto}h2{font-size:clamp(25px,4vw,36px)}.chapter{background:#35254465;border-radius:16px;padding:13px 17px;backdrop-filter:blur(10px)}.chapter small,.chapter span,.counter,.instructions,.gentle{font-size:14px}@media(max-width:650px){.chapter{max-width:64%;padding:10px}.chapter span{font-size:14px}.chapter strong{font-size:19px}.counter{font-size:14px}.card p{font-size:16px}#hud{gap:8px}header .brand small{display:none}}
