:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}#root{min-height:100vh}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}.app{color:#f2d89b;background:radial-gradient(circle at 20% 15%,#8b5b2f59,#0000 28%),radial-gradient(circle at 80% 10%,#3a5c4566,#0000 30%),radial-gradient(circle at 50% 85%,#4b253f73,#0000 35%),linear-gradient(145deg,#171418 0%,#252019 35%,#18302a 70%,#111315 100%);min-height:100vh;padding:42px 20px;font-family:Georgia,Times New Roman,serif;position:relative;overflow-x:hidden}.app:before{content:"";pointer-events:none;opacity:.35;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:44px 44px;position:fixed;inset:0}.hero{text-align:center;background:linear-gradient(#372625f5,#201c19f5),#2d2523;border:4px solid #5e3b24;border-radius:34px 18px 38px 20px;max-width:960px;margin:0 auto 30px;padding:38px 34px;position:relative;transform:rotate(-.4deg);box-shadow:0 22px #120f10,0 30px 55px #0000008c}.hero:before{content:"☾";color:#e4ba67;background:#1e2d28;border:3px solid #6d4a2d;border-radius:50%;place-items:center;width:58px;height:58px;font-size:34px;display:grid;position:absolute;top:-32px;left:38px;box-shadow:0 8px #0e1110}.hero:after{content:"⚔";color:#c39452;text-shadow:3px 3px #151112;font-size:44px;position:absolute;bottom:-26px;right:30px;transform:rotate(14deg)}.eyebrow{color:#1d1717;letter-spacing:2px;text-transform:uppercase;background:#d3a14d;border:3px solid #3d2819;border-radius:999px 999px 999px 10px;margin:0 0 14px;padding:8px 16px;font-size:14px;font-weight:700;display:inline-block;box-shadow:4px 5px #121010}h1{color:#f0c36b;letter-spacing:-2px;text-shadow:4px 4px #5c2639,8px 8px #131111;margin:0;font-size:clamp(38px,8vw,78px);line-height:.95}.hero-text{color:#d7c097;max-width:700px;margin:24px auto 30px;font-size:19px;line-height:1.6}.nav{flex-wrap:wrap;justify-content:center;gap:15px;display:flex}.nav-link{color:#f3d38d;background:#533021;border:3px solid #3f2a1b;border-radius:18px 12px 20px 10px;padding:13px 20px;text-decoration:none;transition:transform .18s,background-color .18s,color .18s,box-shadow .18s;box-shadow:5px 6px #111}.nav-link:nth-child(2){background:#35472c}.nav-link:nth-child(3){background:#543146}.nav-link:hover{color:#fff1bd;transform:translateY(-4px)rotate(-1deg);box-shadow:7px 9px #111}.nav-link.active{color:#211616;background:#d7a94e;border-color:#221711;box-shadow:0 0 0 4px #d7a94e40,5px 6px #111}.page-card{color:#251713;background:radial-gradient(circle at 0 0,#975d3038,#0000 32%),linear-gradient(#d7b16d,#b98545);border:4px solid #4d321f;border-radius:22px 38px 18px 34px;max-width:860px;margin:0 auto;padding:36px;position:relative;transform:rotate(.35deg);box-shadow:0 18px #151111,0 28px 50px #00000073}.page-card:before{content:"";pointer-events:none;border:2px dashed #3d26188c;border-radius:16px 30px 14px 26px;position:absolute;inset:14px}.content-section{z-index:1;position:relative}.content-section h2{color:#4a2138;text-shadow:2px 2px #ffe8adb3;margin-top:0;margin-bottom:18px;font-size:clamp(30px,5vw,48px);line-height:1}.content-section p{color:#2b1a14;font-size:19px;line-height:1.7}.notice{color:#ffe7a6;background:#85423f;border:3px solid #3c2618;border-radius:18px 10px 22px 12px;margin-top:28px;padding:20px 22px;font-weight:700;transform:rotate(-1deg);box-shadow:7px 8px #211515}.contact-card{background:#37472c47;border:3px solid #3c2618;border-radius:14px 24px 12px 20px;margin:26px 0;padding:22px;box-shadow:6px 7px #2014108c}.contact-card p{margin:10px 0}strong{color:#4a2138}@media (width<=640px){.app{padding:28px 14px}.hero,.page-card{padding:26px 20px}.nav{flex-direction:column}.nav-link{width:100%}}.potions-image{filter:drop-shadow(8px 12px #00000059);width:min(520px,90%);margin:8px auto 24px;display:block;transform:rotate(1deg)}.potions-image:hover{transition:transform .2s;transform:rotate(-1deg)scale(1.03)}.corner-demon-button{z-index:20;cursor:pointer;background:0 0;border:none;padding:0;position:fixed;bottom:18px;right:22px}.corner-demon{pointer-events:auto;filter:drop-shadow(3px 0 #fff)drop-shadow(-3px 0 #fff)drop-shadow(0 3px #fff)drop-shadow(0 -3px #fff)drop-shadow(7px 9px #00000059);opacity:.95;width:260px;transition:transform .2s,opacity .2s;display:block;transform:rotate(-4deg)}.corner-demon-button:hover .corner-demon{opacity:1;transform:rotate(2deg)scale(1.05)}.corner-demon-button:active .corner-demon{transform:rotate(-8deg)scale(.96)}@media (width<=640px){.corner-demon-button{bottom:10px;right:10px}.corner-demon{opacity:.85;width:150px}}
