:root{
--color-bg:#030712;
--color-surface-start:#0B1528;
--color-surface-end:#111C44;
--color-text:#F3F4F6;
--color-text-muted:#C7D0E0;
--color-accent:#818CF8;
--color-border:rgba(129,140,248,0.18);
--color-overlay:rgba(17,28,68,0.72);
--color-danger:#F43F5E;
--color-success:#12B488;

--font-heading:"Inter Tight","Inter","Segoe UI",Arial,sans-serif;
--font-body:"Inter","Segoe UI",Arial,sans-serif;

--fs-1:clamp(2.2rem,4vw,3.2rem);
--fs-2:clamp(1.8rem,3vw,2.4rem);
--fs-3:1.8rem;
--fs-4:1.4rem;
--fs-5:1.125rem;
--fs-6:1rem;
--fs-7:0.875rem;

--space-0:0px;
--space-1:4px;
--space-2:8px;
--space-3:16px;
--space-4:24px;
--space-5:32px;
--space-6:48px;
--space-7:64px;

--radius-lg:20px;
--radius-md:16px;

--shadow-soft:0 4px 24px rgba(17,28,68,0.18);

--container-max:1200px;
--container-pad:24px;
--container-pad-sm:16px;

--sr-ribbon-height:32px;
--sr-header-height:72px;
--sr-chrome-height:calc(var(--sr-ribbon-height) + var(--sr-header-height));

--transition:200ms ease;
}

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

html{
font-size:16px;
-webkit-text-size-adjust:100%;
scroll-padding-top:calc(var(--sr-chrome-height) + var(--space-3));
}

body{
min-height:100vh;
padding-top:var(--sr-chrome-height);
background:var(--color-bg);
color:var(--color-text);
font-family:var(--font-body);
font-size:var(--fs-6);
line-height:1.5;
text-rendering:optimizeLegibility;
-webkit-font-smoothing:antialiased;
overflow-x:hidden;
}

main,
section,
article{
min-width:0;
}

img,
picture,
video,
canvas,
svg{
display:block;
max-width:100%;
height:auto;
}

input,
button,
textarea,
select{
font:inherit;
color:inherit;
background:none;
border:none;
outline:none;
}

button{
cursor:pointer;
}

a{
color:inherit;
text-decoration:none;
}

ul,
ol{
list-style:none;
}

h1,
h2,
h3,
h4,
h5,
h6{
font-family:var(--font-heading);
line-height:1.3;
letter-spacing:-0.01em;
margin-bottom:var(--space-3);
overflow-wrap:anywhere;
}

h1{font-size:var(--fs-1);}
h2{font-size:var(--fs-2);}
h3{font-size:var(--fs-3);}
h4{font-size:var(--fs-4);}
h5{font-size:var(--fs-5);}
h6{font-size:var(--fs-6);}

p{
margin-bottom:var(--space-3);
color:var(--color-text-muted);
overflow-wrap:anywhere;
}

blockquote{
margin-bottom:var(--space-4);
padding-left:var(--space-3);
border-left:2px solid var(--color-border);
color:var(--color-text-muted);
}

:where(main,article,section) ul:not([class]):not([role]),
:where(main,article,section) ol:not([class]):not([role]){
margin-bottom:var(--space-3);
padding-left:var(--space-4);
list-style:disc;
}

:where(main,article,section) ol:not([class]):not([role]){
list-style:decimal;
}

:where(main,article,section) li:not([class]){
margin-bottom:var(--space-2);
}

main > section:first-child{
margin-top:0;
}

section[id]{
scroll-margin-top:calc(var(--sr-chrome-height) + var(--space-3));
}

hr{
border:none;
height:1px;
background:var(--color-border);
margin:var(--space-5) 0;
}

:focus-visible{
outline:2px solid var(--color-accent);
outline-offset:2px;
}

.container{
width:100%;
max-width:var(--container-max);
margin-inline:auto;
padding-inline:var(--container-pad);
}

@media (max-width:768px){
.container{
padding-inline:var(--container-pad-sm);
}
}

.surface{
background:linear-gradient(135deg,var(--color-surface-start),var(--color-surface-end));
border:1.5px solid var(--color-border);
border-radius:var(--radius-lg);
box-shadow:var(--shadow-soft);
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);
}

@media (max-width:768px){
.surface{
border-radius:var(--radius-md);
}
}

.card{
padding:var(--space-4);
}

@media (max-width:768px){
.card{
padding:var(--space-3);
}
}

.stack > * + *{
margin-top:var(--space-3);
}

.cluster{
display:flex;
flex-wrap:wrap;
gap:var(--space-3);
align-items:center;
}

.row{
display:flex;
flex-wrap:wrap;
gap:var(--space-4);
}

.row > *{
min-width:0;
flex:1 1 0;
}

.button{
display:inline-flex;
min-width:0;
align-items:center;
justify-content:center;
gap:var(--space-2);
padding:10px 18px;
border-radius:999px;
font-weight:500;
font-size:var(--fs-6);
background:linear-gradient(135deg,var(--color-surface-start),var(--color-surface-end));
border:1.5px solid var(--color-border);
color:var(--color-text);
transition:var(--transition);
white-space:normal;
}

.button:hover{
box-shadow:0 0 0 1px var(--color-accent),0 0 12px rgba(129,140,248,0.4);
}

.button--primary{
border-color:transparent;
background:var(--color-accent);
color:#fff;
}

.button--danger{
background:var(--color-danger);
color:#fff;
}

.button--success{
background:var(--color-success);
color:#fff;
}

.input,
textarea,
select{
width:100%;
padding:12px 14px;
border-radius:12px;
background:var(--color-overlay);
border:1.5px solid var(--color-border);
color:var(--color-text);
transition:var(--transition);
}

.input:focus,
textarea:focus,
select:focus{
border-color:var(--color-accent);
box-shadow:0 0 0 1px var(--color-accent);
}

label{
display:block;
margin-bottom:var(--space-1);
font-size:var(--fs-7);
color:var(--color-text-muted);
}

.form-group{
margin-bottom:var(--space-4);
}

.small{
font-size:var(--fs-7);
color:var(--color-text-muted);
}

.text-center{
text-align:center;
}

.hidden{
display:none !important;
}

.sr-only{
position:absolute !important;
width:1px !important;
height:1px !important;
padding:0 !important;
margin:-1px !important;
overflow:hidden !important;
clip:rect(0,0,0,0) !important;
white-space:nowrap !important;
border:0 !important;
}

body > *:last-child,
.surface > *:last-child,
.card > *:last-child{
margin-bottom:0;
}

@media (max-width:900px){
:root{
--sr-ribbon-height:48px;
--sr-header-height:64px;
}
}
