:root{--navy:#0B1220;--navy2:#0F1A2E;--gold:#C9A227;--gold2:#e6c65a;--parch:#E8DCC4;--ink:#2b2114;--glyph:"Noto Sans Egyptian Hieroglyphs","Segoe UI Historic","Aegyptus",serif}
*{box-sizing:border-box}html,body{margin:0}
body{background:radial-gradient(ellipse at top,#16254a 0%,var(--navy2) 40%,var(--navy) 100%) fixed;color:var(--parch);font:1.12rem/1.65 "EB Garamond",Georgia,serif;min-height:100vh}
.stars{position:fixed;inset:0;pointer-events:none;z-index:0;background-image:
radial-gradient(1px 1px at 10% 20%,#fff8 50%,transparent),radial-gradient(1.5px 1.5px at 30% 70%,#f5e39a 50%,transparent),radial-gradient(1px 1px at 55% 15%,#fff9 50%,transparent),radial-gradient(1px 1px at 80% 40%,#fff7 50%,transparent),radial-gradient(2px 2px at 90% 80%,#e6c65a 50%,transparent),radial-gradient(1px 1px at 20% 90%,#fff6 50%,transparent),radial-gradient(1px 1px at 65% 60%,#fff8 50%,transparent),radial-gradient(1.5px 1.5px at 42% 38%,#fff5 50%,transparent);background-size:340px 340px;animation:tw 8s ease-in-out infinite alternate}
@keyframes tw{to{opacity:.55}}@media (prefers-reduced-motion:reduce){.stars{animation:none}}
header,main,footer{position:relative;z-index:1}
.top{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;align-items:center;justify-content:space-between;padding:.9rem 1.2rem;border-bottom:1px solid #c9a22755;background:#0b1220cc;backdrop-filter:blur(4px);position:sticky;top:0}
.brand{font-family:Cinzel,serif;color:var(--gold);text-decoration:none;font-size:1.15rem;letter-spacing:.06em}
nav{display:flex;flex-wrap:wrap;gap:.2rem .9rem}nav a{color:var(--parch);text-decoration:none;font-family:Cinzel,serif;font-size:.85rem;letter-spacing:.05em;opacity:.8}nav a.on,nav a:hover{color:var(--gold2);opacity:1}
main{max-width:980px;margin:0 auto;padding:2rem 1.2rem 4rem;outline:none}
h1,h2,h3{font-family:Cinzel,serif;color:var(--gold);font-weight:500;letter-spacing:.04em;line-height:1.2}
h1{font-size:clamp(2rem,6vw,3.4rem);text-align:center;margin:.5rem 0}h2{font-size:1.6rem;margin-top:2.4rem}
.sub{font-family:"Cormorant Garamond",serif;font-style:italic;text-align:center;font-size:1.4rem;color:#f0e6cf}
.rule{border:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:2rem auto;max-width:520px}
.glyph,.g{font-family:var(--glyph)}
.hero-g{font-family:var(--glyph);font-size:clamp(2.6rem,10vw,5rem);text-align:center;color:var(--gold2);letter-spacing:.15em;margin:1rem 0}
a{color:var(--gold2)}
.btn{display:inline-block;font-family:Cinzel,serif;letter-spacing:.06em;background:linear-gradient(#d8b440,#a8831a);color:#1a1208;border:0;border-radius:3px;padding:.7rem 1.4rem;text-decoration:none;cursor:pointer;font-size:.95rem;margin:.3rem}
.btn.ghost{background:transparent;color:var(--gold2);border:1px solid var(--gold)}
.center{text-align:center}
.parch{background:var(--parch);color:var(--ink);border-radius:4px;padding:1.4rem 1.6rem;box-shadow:0 0 0 1px #c9a227,0 0 0 6px #0f1a2e,0 0 0 7px #c9a22777,0 10px 40px #0008}
.parch h2,.parch h3{color:#7a5a0c}.parch a{color:#7a4d00}
.essay p{max-width:68ch}
sup a{text-decoration:none;font-size:.75em}
.notes{font-size:.98rem;border-top:1px solid #c9a22766;margin-top:2rem}.notes li{margin:.7rem 0}
.walk{display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-end;gap:.35rem;margin:1.2rem 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.walk div{text-align:center;flex:1 1 0;min-width:0;max-width:4.2rem}.walk .g{font-size:clamp(1.6rem,9vw,3rem);display:block;color:#3a2a10;line-height:1.1}.walk small{display:block;font-family:Cinzel,serif;font-size:clamp(.65rem,2.8vw,.85rem)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}
.card{background:#0f1a2ecc;border:1px solid #c9a22766;border-radius:6px;padding:1rem;text-align:center;cursor:pointer;transition:.2s;color:var(--parch);font:inherit}
.card:hover,.card:focus{border-color:var(--gold);transform:translateY(-2px)}
.card .g{font-size:3.2rem;color:var(--gold2);display:block;line-height:1.2}
.card .tr{font-family:Cinzel,serif;font-size:1.2rem}.card .nm{font-size:.9rem;opacity:.8}
.card.done{box-shadow:inset 0 0 0 2px #c9a22755}
.detail{margin-top:1.5rem}
.detail .g{font-size:5rem}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.7rem;margin:1rem 0}
.opt{background:#0f1a2e;border:1px solid #c9a22788;color:var(--parch);border-radius:5px;padding:.8rem;font:inherit;cursor:pointer;font-size:1.1rem}
.opt .g{font-size:2.4rem}.opt:hover{border-color:var(--gold2)}
.opt.right{background:#1f3b23;border-color:#7fc98a}.opt.wrong{background:#4a1d1d;border-color:#d07a7a}
.q-g{font-size:5rem;text-align:center;color:var(--gold2)}
.expl{border-left:3px solid var(--gold);padding:.4rem 1rem;background:#0f1a2e;margin:1rem 0}
.bar{height:10px;background:#1b2945;border-radius:5px;overflow:hidden;border:1px solid #c9a22755}.bar i{display:block;height:100%;background:linear-gradient(90deg,#a8831a,#e6c65a)}
.list{display:grid;gap:.8rem}.row{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:.9rem 1.1rem;border:1px solid #c9a22755;border-radius:6px;background:#0f1a2e99}
.foot{text-align:center;font-size:.9rem;opacity:.8;padding:2rem 1rem;border-top:1px solid #c9a22733}
.tease{font-style:italic;opacity:.85}
@media(max-width:600px){.top{justify-content:center}.parch{padding:1rem}}
.card.flip{padding:0;perspective:900px;background:none;border:0;transition:none}
.card.flip:hover,.card.flip:focus{transform:none}
.card.flip .fi{display:grid;transition:transform .55s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d;height:100%}
.card.flip.open .fi{transform:rotateY(180deg)}
.card.flip .face{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid #c9a22766;border-radius:6px;padding:1rem;background:#0f1a2ecc}
.card.flip .front{display:flex;flex-direction:column;justify-content:center}
.card.flip:hover .front,.card.flip:focus .front{border-color:var(--gold)}
.card.flip.done .front{box-shadow:inset 0 0 0 2px #c9a22755}
.card.flip .back{transform:rotateY(180deg);background:var(--parch);color:var(--ink);box-shadow:0 0 0 1px #c9a227,0 6px 24px #0008;font-size:.92rem;line-height:1.4;text-align:center}
.card.flip .back p{margin:.35rem 0}.card.flip .back .g{font-size:2.2rem;color:#3a2a10;display:inline}.card.flip .back .tr{color:#7a5a0c}
.card.flip .back .bb{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem;margin-top:.4rem}
.btn.sm{padding:.45rem .7rem;font-size:.78rem;margin:0}.back .btn.ghost{color:#7a4d00;border-color:#a8831a}
.card.flip .src{display:block;opacity:.6;font-size:.7rem;margin-top:.3rem}
.card.flip.open{z-index:2}
@media(prefers-reduced-motion:reduce){.card.flip .fi{transition:none}}
/* hieroglyphs-in-a-weekend */