:root{color-scheme:dark;--bg:#191b18;--fg:#f2f3e9;--muted:#a2a69b;--accent:#d8fa61}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif}.page{max-width:1800px;margin:auto;padding:0 4.2vw}header{height:105px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #3b3e35}.brand{display:flex;align-items:center;color:var(--fg);font-size:25px;letter-spacing:-1px;font-weight:700;text-decoration:none}.brand-icon{display:grid;place-items:center;background:var(--accent);color:var(--bg);width:30px;height:30px;margin-right:10px;font-size:29px;font-weight:900;line-height:1}.muted{color:var(--muted)}.edition,.eyebrow,footer{font-family:monospace;font-size:12px;letter-spacing:1.3px}.edition{color:var(--muted)}.intro{display:flex;justify-content:space-between;align-items:flex-start;padding-top:49px}.eyebrow{color:var(--accent);padding-top:6px}.intro p{font-size:21px;line-height:1.3;margin:0;width:23%;letter-spacing:-.4px}.logo-area{position:relative;margin-top:62px;padding:38px 0 46px;background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:calc(100% / 36) 28px}.logo{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1.1vw;padding-right:3.5vw;perspective:1000px}.letter{position:relative;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(7,1fr);aspect-ratio:5/7;padding:0;border:0;background:none;cursor:pointer;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .24s;touch-action:manipulation}.pixel{background:var(--accent);box-shadow:3px 4px 0 #8b9c43;transform:translate(var(--x,0px),var(--y,0px)) rotate(var(--r,0deg));transition:transform .65s cubic-bezier(.2,.75,.2,1),background .2s,box-shadow .3s}.letter:hover .pixel{background:#e5ff92;box-shadow:5px 7px 0 #81923b}.letter:focus-visible{outline:2px dashed var(--fg);outline-offset:10px}.domain{position:absolute;right:0;bottom:39px;font-size:clamp(20px,3vw,46px);color:var(--accent);letter-spacing:-2px}.under-logo{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.hint{font-size:14px;color:var(--muted)}.hint>span{font-size:22px;margin-right:12px;color:var(--accent)}.rebuild{font:inherit;font-size:14px;border:1px solid #535747;border-radius:30px;padding:12px 20px;background:transparent;color:var(--fg);cursor:pointer}.rebuild span{display:inline-block;margin-right:8px;font-size:19px}.rebuild:hover{color:var(--bg);background:var(--accent);border-color:var(--accent)}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.bottom{display:flex;align-items:flex-end;justify-content:space-between;padding:65px 0 57px}h2{font-size:clamp(29px,3.4vw,53px);font-weight:400;letter-spacing:-1.8px;line-height:1.1;margin:0}h2 span{color:var(--muted)}.note{display:flex;gap:17px;width:23%;font-size:16px;line-height:1.6;color:var(--muted)}.note p{margin:0}.small-square{flex-shrink:0;width:9px;height:9px;background:var(--accent);margin-top:8px}footer{border-top:1px solid #3b3e35;padding:24px 0 26px;display:flex;justify-content:space-between;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1500px){.logo-area{margin-top:7vh}.bottom{padding-top:8vh}}@media(max-width:700px){.page{padding:0 6vw}header{height:82px}.edition{font-size:10px;letter-spacing:.5px}.intro{padding-top:35px}.intro p{font-size:16px;width:auto}.eyebrow{font-size:10px}.logo-area{margin-top:55px;padding:35px 0 45px}.logo{gap:1.4vw;padding-right:4vw}.pixel{box-shadow:1px 2px 0 #8b9c43}.domain{font-size:20px;bottom:41px;letter-spacing:-1px}.hint{max-width:185px;font-size:13px}.hint>span{margin-right:5px}.rebuild{padding:9px 13px}.bottom{padding:65px 0 40px;gap:30px;align-items:flex-start;flex-direction:column}h2{font-size:37px}.note{width:auto;font-size:15px}footer{font-size:10px;gap:15px}footer span:nth-child(2){display:none}}@media(prefers-reduced-motion:reduce){.letter,.pixel{transition:none}}
/* Vermilion book jacket */
:root{color-scheme:light;--bg:#e44227;--fg:#171715;--muted:#441d16;--accent:#171715}body{background:#ece8d9}.page{position:relative;background:var(--bg);max-width:1600px;padding:0 5vw 0 9vw;min-height:100vh;border-left:18px solid #171715;box-shadow:inset 7px 0 0 #ae2f21}.page:before{content:'ABURRA / THE FIRST CHAPTER';position:absolute;left:23px;top:130px;writing-mode:vertical-rl;font:13px monospace;letter-spacing:3px}header{height:86px;border-bottom:3px double #171715}.brand{font-family:Georgia,serif;font-size:27px}.brand-icon{background:#171715;color:#ece8d9;border-radius:0;transform:rotate(-7deg)}.edition{color:#171715}.intro{padding-top:28px}.eyebrow{border:1px solid #171715;padding:7px 11px;font-weight:bold;letter-spacing:2px}.intro p{font-family:Georgia,serif;font-style:italic;font-size:20px;width:auto}.logo-area{margin:30px 0 0;padding:20px 17% 18px 0;background:none;border-bottom:2px solid #171715}.logo{grid-template-columns:repeat(6,minmax(0,1fr));gap:1.4vw;padding:0;transform:skewY(-5deg);margin:35px 0 50px}.letter:nth-child(2n){transform:translateY(18px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}.pixel{background:#171715;box-shadow:2px 2px 0 #f0b096;border-radius:0}.letter:hover .pixel{background:#f3ebd7;box-shadow:4px 5px 0 #171715}.domain{right:0;top:0;bottom:0;display:flex;align-items:center;justify-content:center;width:12%;font:bold clamp(34px,7vw,100px) Georgia,serif;color:#171715;background:#ece8d9;border:2px solid #171715;writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:-7px}.under-logo{margin-top:16px}.hint{color:#171715;font-family:monospace}.hint>span{color:#171715}.rebuild{border:1px solid #171715;border-radius:0;color:#171715;font-family:monospace}.rebuild:hover{background:#171715;color:#ece8d9}.bottom{padding:40px 0 38px;align-items:center}h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(38px,5vw,74px);line-height:.98;letter-spacing:-2px}h2 span{color:#171715;font-style:italic}.note{color:#171715;font-family:Georgia,serif;font-size:18px;width:auto;border-left:1px solid #171715;padding:20px 0 20px 25px}.small-square{display:none}footer{border-top:3px double #171715;color:#171715;padding:20px 0}button:focus-visible,a:focus-visible{outline-color:#171715}.letter:focus-visible{outline-color:#171715}@media(min-width:1500px){.logo-area{margin-top:35px}.bottom{padding-top:45px}}@media(max-width:700px){.page{border-left:9px solid #171715;padding:0 6vw 0 12vw}.page:before{left:12px;top:110px;font-size:10px;letter-spacing:2px}header{height:78px}.edition{max-width:105px;text-align:right;font-size:10px}.intro{gap:15px}.intro p{font-size:16px}.eyebrow{font-size:10px;padding:6px}.logo-area{padding-right:19%;margin-top:25px}.logo{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 3vw;margin:15px 0 25px}.letter:nth-child(2n){transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}.domain{width:14%;font-size:48px;letter-spacing:-3px}.bottom{padding-top:35px;gap:25px;align-items:flex-start}h2{font-size:38px}.hint{font-size:12px;max-width:155px;line-height:1.5}.rebuild{font-size:12px;padding:8px}.note{font-size:16px;padding:0 0 0 15px}.under-logo{gap:10px}.hint>span{display:none}}
/* Wordmark only */.page{display:flex;align-items:center;justify-content:center;min-height:100svh}.page:before{content:none}.logo-area{width:100%;border:0;margin:0;padding:0}.logo{padding:0;margin:0;gap:1.4vw}@media(max-width:700px){.page{padding:10vw 8vw 10vw 10vw}.logo-area{padding:0;margin:0}.logo{gap:35px 4vw;margin:0}}