@font-face{
font-family:"Tooly Sans";
src:url("/src/fonts/Inter-Regular.otf") format("opentype");
font-weight:400;
font-style:normal;
font-display:swap;
}

:root{
color-scheme:dark;
--bg:#171717;
--bg-elevated:#1d1d1d;
--bg-deep:#0f0f0f;
--surface:#171717;
--surface-raised:#1b1b1b;
--surface-muted:#141414;
--surface-code:#101010;
--card:#171717;
--input:#111111;
--input-hover:#141414;
--border:#2e2e2e;
--border-strong:#363636;
--border-soft:#242424;
--border-accent:rgba(62,207,142,0.3);
--text:#fafafa;
--text-soft:#efefef;
--muted:#898989;
--muted-strong:#b4b4b4;
--primary:#3ecf8e;
--primary-strong:#00c573;
--primary-soft:rgba(62,207,142,0.12);
--success:#3ecf8e;
--warning:#f59e0b;
--danger:#f87171;
--radius-sm:6px;
--radius-md:8px;
--radius-lg:16px;
--radius-pill:9999px;
--shadow-focus:0 4px 12px rgba(0,0,0,0.1);
--max-site-width:1100px;
--max-tool-width:860px;
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-7:32px;
--space-8:40px;
--space-9:48px;
--space-10:64px;
--space-11:96px;
--font-sans:"Tooly Sans","Inter","Helvetica Neue",Helvetica,Arial,sans-serif;
--font-mono:"Source Code Pro","SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
}

*,
*::before,
*::after{
box-sizing:border-box;
}

html{
background:var(--bg);
scroll-behavior:smooth;
scrollbar-width:thin;
scrollbar-color:rgba(154,154,154,0.56) rgba(15,15,15,0.28);
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
textarea::-webkit-scrollbar,
.textarea::-webkit-scrollbar,
.jsonOutput::-webkit-scrollbar,
.listContainer::-webkit-scrollbar{
width:12px;
height:12px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
textarea::-webkit-scrollbar-track,
.textarea::-webkit-scrollbar-track,
.jsonOutput::-webkit-scrollbar-track,
.listContainer::-webkit-scrollbar-track{
background:rgba(15,15,15,0.28);
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb,
.textarea::-webkit-scrollbar-thumb,
.jsonOutput::-webkit-scrollbar-thumb,
.listContainer::-webkit-scrollbar-thumb{
background:rgba(154,154,154,0.56);
border:2px solid rgba(15,15,15,0.28);
border-radius:999px;
background-clip:padding-box;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
textarea::-webkit-scrollbar-thumb:hover,
.textarea::-webkit-scrollbar-thumb:hover,
.jsonOutput::-webkit-scrollbar-thumb:hover,
.listContainer::-webkit-scrollbar-thumb:hover{
background:rgba(180,180,180,0.74);
border:2px solid rgba(15,15,15,0.28);
background-clip:padding-box;
}

body{
margin:0;
min-height:100vh;
display:flex;
flex-direction:column;
background:
radial-gradient(circle at top, rgba(62,207,142,0.08), transparent 32%),
linear-gradient(180deg, #171717 0%, #141414 100%);
color:var(--text);
font-family:var(--font-sans);
font-size:16px;
line-height:1.5;
letter-spacing:0;
text-rendering:optimizeLegibility;
}

body.dashboardPage{
background:
radial-gradient(circle at top right, rgba(62,207,142,0.08), transparent 28%),
linear-gradient(180deg, #171717 0%, #111111 100%);
}

a{
color:var(--primary-strong);
text-decoration:none;
}

a:hover{
color:var(--text);
}

img{
max-width:100%;
display:block;
}

button,
input,
select,
textarea{
font:inherit;
}

h1,
h2,
h3,
h4,
h5,
h6{
margin:0;
font-weight:400;
letter-spacing:normal;
color:var(--text);
}

h1{
font-size:clamp(2.4rem, 6vw, 4.5rem);
line-height:1;
}

h2{
font-size:2.25rem;
line-height:1.25;
}

h3{
font-size:1.5rem;
line-height:1.33;
letter-spacing:-0.01em;
}

p,
ul,
ol,
pre{
margin:0;
}

ul,
ol{
padding-left:20px;
}

li + li{
margin-top:8px;
}

strong{
font-weight:500;
}

code,
pre,
.code-label{
font-family:var(--font-mono);
}

::selection{
background:rgba(62,207,142,0.24);
color:var(--text);
}

:focus-visible{
outline:1px solid var(--border-accent);
outline-offset:3px;
box-shadow:var(--shadow-focus);
}

.hidden{
display:none !important;
}

.glow-1,
.glow-2,
.glow-3,
.orb{
display:none !important;
}

.container{
width:min(100%, var(--max-tool-width));
margin:0 auto;
}

.subtitle{
color:var(--muted);
font-size:0.9375rem;
}

@media (max-width:600px){
body{
font-size:15px;
}
}
