@charset "utf-8";

/* Firefox */
* {margin:0; padding:0; box-sizing:border-box; -webkit-box-sizing:border-box; scrollbar-width:thin; scrollbar-color:var(--layout-min-lv2) transparent;}
/* WebKit (Chrome, Edge, Safari) */
::-webkit-scrollbar {width: 6px; height: 6px;}
::-webkit-scrollbar-track {	background: transparent;}
::-webkit-scrollbar-thumb {	background-color: var(--layout-min-lv3); border-radius: 10px;}
::-webkit-scrollbar-thumb:hover { background-color: var(--layout-min-lv3);}

html, body {scroll-behavior: smooth; -webkit-overflow-scrolling: touch;}
body {color:var(--text-lv1); height:100dvh; overflow:hidden;}

button {border:none;background:none;outline:none; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; -webkit-appearance:none; }
input, textarea {border:none;background:none;outline:none; -webkit-appearance:none; }
a {display:inline-block; text-decoration:none;}
a:hover, a:visited {text-decoration:none}
a:active {text-decoration:none;}

h1, h2, h3, h4, h5, h6 {margin:0;padding:0;border:0;font-weight: 600;}
form, fieldset, img {margin:0;padding:0;border:0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
ul,li,dl,dt,dd {margin:0;padding:0;list-style:none}

.sup {vertical-align: super;font-size: small;}
.no-select {user-select:none; -webkit-user-select:none}
input[type="color"] { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 2;}
.scroll-area {overflow-x:hidden; overflow-y:auto;}

/* Background Effects */
#bg-canvas {position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1;background: var(--bg-gradient);}
.aurora-container {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; overflow: hidden;transition: background 0.5s ease;}
.orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: var(--orb-opacity);transition: background 0.5s ease, opacity 0.5s ease;}
.o1 { top: -10%; left: -10%; width: 50vw; height: 50vw; background: var(--orb-color-1); }
.o2 { bottom: -10%; right: -10%; width: 50vw; height: 50vw; background: var(--orb-color-2); animation-delay: -5s; }
.o3 { top: 40%; left: 30%; width: 30vw; height: 30vw; background: var(--orb-color-3); animation-delay: -10s; }