*{box-sizing:border-box}body{margin:0;color:#12486c;font-family:Arial,sans-serif;background:radial-gradient(ellipse at 90% 15%,#efffff 0,transparent 42%),linear-gradient(145deg,#d6faff,#b1e8f5 65%,#cdeba9);min-height:100vh}header{height:84px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:#ffffff68;border-bottom:1px solid #fff}a{color:inherit;text-decoration:none}.brand{font-size:25px;font-weight:800;letter-spacing:4px}.brand small{font-size:10px;letter-spacing:2px;display:block;margin:4px 0 0 33px}#connection{font-size:10px;letter-spacing:2px;margin-right:15px}main{max-width:1600px;padding:40px 5%;margin:auto;display:grid;grid-template-columns:280px minmax(0,1fr);gap:34px}aside{padding:12px 0}.eyebrow{font-size:10px;letter-spacing:2px;color:#258daa}h1{font-size:40px;line-height:1.08;letter-spacing:-1.5px;margin:20px 0}h2{font-size:20px;margin-top:28px}.intro,#description,.small{line-height:1.6;color:#427287}.intro{margin-bottom:32px}.small{font-size:12px}label{font-size:13px}select{width:100%;margin-top:9px;padding:14px;border:1px solid #fff;border-radius:12px;background:#ffffffa8;color:#12486c}button,.upload{border:1px solid #fff;border-radius:12px;background:linear-gradient(#ffffffed,#e3f6ffb8);padding:11px 14px;box-shadow:0 3px 10px #147a9b16;color:#165779;cursor:pointer;font-weight:600}button:hover,.upload:hover{background:white}button[aria-pressed=true]{background:linear-gradient(#76d5e8,#1c9bbf);color:white}button:focus-visible,select:focus-visible,.upload:focus-visible{outline:3px solid #168cb0;outline-offset:3px}.divider{height:1px;background:#fff;margin:24px 0}.upload{display:inline-block}#upload{display:block;max-width:100%;font-size:11px;margin:12px 0}.studio{min-width:0;border:1px solid #fff;border-radius:28px;padding:12px;background:#ffffff55;box-shadow:0 22px 60px #147da12a;overflow:hidden}#canvas{position:relative;height:520px;border-radius:20px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#fff 0,#daf4f8 60%,#9dd4e8);touch-action:none}canvas{display:block;width:100%;height:100%}.badge{position:absolute;top:18px;left:18px;background:#ffffffbd;padding:9px 13px;border:1px solid white;border-radius:20px;font-size:11px;max-width:90%;z-index:1}.hint{position:absolute;bottom:18px;left:0;right:0;text-align:center;font-size:11px;pointer-events:none}nav{display:flex;flex-wrap:wrap;gap:8px;padding:16px 4px}nav label{display:flex;align-items:center;gap:9px}input[type=range]{width:100px;accent-color:#148cb3}footer{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;padding:8px 10px;color:#487c8f}.studio:fullscreen{background:#bce9f4;border-radius:0;display:flex;flex-direction:column}.studio:fullscreen #canvas{flex:1;height:auto}@media(max-width:800px){main{grid-template-columns:1fr;padding:20px;gap:16px}h1{font-size:30px;margin:12px 0}aside{padding:0}.intro{margin-bottom:12px}#canvas{height:420px}.small{max-width:500px}header{height:70px}#connection{display:none}h2{margin-top:16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
:root{--mx:75vw;--my:10vh;--ink:#12486c;--muted:#427287;--glass:#ffffff70;--line:#ffffffb8;--surface:#d6faff}body{color:var(--ink);background:radial-gradient(650px circle at var(--mx) var(--my),#62cddd40,transparent 75%),linear-gradient(145deg,var(--surface),#8cb4be33);background-color:var(--surface)}header{background:var(--glass);border-color:var(--line)}.studio{background:var(--glass);border-color:var(--line);backdrop-filter:blur(20px)}.intro,#description,.small,footer{color:var(--muted)}#cover{width:100%;max-height:180px;object-fit:cover;border-radius:18px;margin-top:20px}#cover[hidden]{display:none}nav select{width:auto;margin:0;padding:10px}nav label{gap:8px}#trail{position:fixed;inset:0;pointer-events:none;z-index:90}#pen{position:fixed;top:0;left:0;pointer-events:none;z-index:91;font-size:32px;color:#47a4c9;text-shadow:1px 2px #0b354d,3px 5px 8px #16374b60}#pen[hidden]{display:none}[data-theme=dark]{--ink:#e5f5ff;--muted:#a1bbc9;--glass:#142838ba;--line:#6db4d32b;--surface:#07121d}[data-theme=dark] #canvas{background:radial-gradient(ellipse at 50% 35%,#274354,#142735 60%,#0c1a28)}[data-theme=dark] button,[data-theme=dark] select,[data-theme=dark] .upload{background:linear-gradient(#274658,#182f41);color:#d8f7ff;border-color:#558da947}[data-theme=dark] button[aria-pressed=true]{background:#197a96}[data-theme=dark] .badge{background:#132b3ee6;border-color:#558da947}[data-theme=dark] .divider{background:#558da947}[data-theme=dark] .studio:fullscreen{background:#07121d}@media(max-width:800px){nav select{max-width:160px}#pen,#trail{display:none}}@media(prefers-reduced-motion:reduce){#pen,#trail{display:none}}
.textures{margin-top:22px;padding:14px;border:1px solid var(--line);border-radius:16px}.textures summary{cursor:pointer;font-size:13px}.textures label{display:block;margin-top:12px}.textures input{max-width:100%;margin-top:14px;font-size:11px}#image-stage{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:55px 16px}#image-stage[hidden],#canvas canvas[hidden]{display:none}
#pen{width:9px;height:35px;border-radius:4px 4px 1px 1px;background:linear-gradient(90deg,#12364e,#87def4 40%,#287ca0 75%,#133a52);border:1px solid #9ee5fc;box-shadow:3px 4px 8px #001d3960}#pen:after{content:'';position:absolute;left:0;bottom:-8px;border-left:3px solid transparent;border-right:3px solid transparent;border-top:8px solid #85d9f0}#pen:before{content:'';position:absolute;inset:4px 1px auto;height:3px;background:#dcfaff;border-radius:2px}

[hidden]{display:none!important}.studio-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:10px 8px 20px}.studio-top .eyebrow{margin:0 0 10px}.view-tabs{display:flex;gap:6px}.view-tabs button{box-shadow:none;font-size:12px}.view-tabs button[aria-selected=true]{background:#147f9e;color:#fff}.view-tabs span{opacity:.7;padding-left:6px}.discord-cta{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#606be9,#434cc0);border:1px solid #b8c3ff;color:#fff;border-radius:16px;padding:14px 20px;box-shadow:0 8px 24px #5865f245;transition:transform .2s}.discord-cta:hover{transform:translateY(-2px)}.discord-cta>span:first-child{font-size:24px}.discord-cta strong{display:block;font-size:12px;letter-spacing:1px}.discord-cta small{display:block;font-size:10px;margin-top:5px;opacity:.85}#media-screen{height:490px;display:flex;align-items:center;justify-content:center;border-radius:18px;background:#07121d;overflow:hidden}#media-screen img,#media-screen video{max-width:100%;max-height:100%;object-fit:contain}#media-screen:empty:after{content:'GALERIA / GALLERY';font-size:12px;letter-spacing:3px;color:#91aab8}.media-navigation{display:flex;align-items:center;justify-content:center;gap:24px;margin:16px 0}.media-navigation span{font-size:12px;letter-spacing:2px}#media-caption{text-align:center;font-size:13px;color:var(--muted);min-height:18px}#media-thumbs{display:flex;gap:10px;overflow-x:auto;padding:10px 4px 16px}#media-thumbs button{flex:0 0 104px;padding:5px;border-radius:12px;overflow:hidden}#media-thumbs img{width:92px;height:64px;object-fit:cover;border-radius:7px}#media-thumbs span{display:block;height:64px;line-height:64px;font-size:22px}#media-thumbs small{display:block;padding-top:5px;font-size:9px;letter-spacing:1px}#media-thumbs button[aria-current=true]{outline:2px solid #36b8da;outline-offset:1px}button:disabled{opacity:.45;cursor:default}.discord-cta:focus-visible{outline:3px solid #36b8da;outline-offset:4px}@media(max-width:1050px){.studio-top{align-items:stretch;flex-direction:column;gap:14px}.discord-cta{justify-content:center}}@media(max-width:600px){#media-screen{height:320px}.view-tabs{justify-content:center}.studio-top .eyebrow{text-align:center}}

#media-screen video{width:100%;height:100%}