/* Extreme priorities survey v1.0.2: shared styles.
   Palette is read from Extreme's slide template: black ground, deep violet header band,
   bright violet for emphasis, pale cyan for headings and numbers, green for "live" and success.
   Change a colour here and every page follows. */

@font-face{font-family:'Poppins';font-weight:400;font-style:normal;font-display:swap;src:url('fonts/poppins-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-weight:500;font-style:normal;font-display:swap;src:url('fonts/poppins-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-weight:600;font-style:normal;font-display:swap;src:url('fonts/poppins-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-weight:700;font-style:normal;font-display:swap;src:url('fonts/poppins-latin-700-normal.woff2') format('woff2')}

:root{
  --ink:#05030b;            /* page ground */
  --ink-2:#0d0820;          /* raised surface */
  --ink-3:#150c33;          /* card surface */
  --violet-900:#1a0b4a;     /* header band, dark end */
  --violet-700:#32108a;     /* header band, light end */
  --violet:#7b2cff;         /* emphasis, bars, selected */
  --violet-soft:rgba(123,44,255,.18);
  --cyan:#8fe3f7;           /* headings, numbers */
  --green:#22d284;          /* live, success */
  --red:#ff6b81;            /* errors */
  --text:#ffffff;
  --text-dim:rgba(255,255,255,.68);
  --text-faint:rgba(255,255,255,.42);
  --line:rgba(255,255,255,.14);
  --font:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;min-height:100vh;background:var(--ink);color:var(--text);
  font-family:var(--font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
}
body.bare{padding-left:0;padding-right:0}
button,select,input{font-family:inherit;font-size:inherit;color:inherit}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
[hidden]{display:none!important}

.eyebrow{margin:0 0 6px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.muted{color:var(--text-dim)}
.err{color:var(--red);font-weight:500}

/* Header band, after the title area of Extreme's slides */
.band{
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 200' preserveAspectRatio='xMaxYMin slice'%3E%3Cg fill='none' stroke='%23a98bff' stroke-opacity='.35' stroke-width='1.2'%3E%3Cpath d='M380 0C520 70 640 110 800 118'/%3E%3Cpath d='M470 0C590 52 700 86 800 92'/%3E%3C/g%3E%3C/svg%3E") right top/cover no-repeat,
    linear-gradient(115deg,var(--violet-900),var(--violet-700));
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 26px;
  border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--text);
  font-weight:600;cursor:pointer;text-decoration:none;touch-action:manipulation;transition:background .18s,border-color .18s,transform .18s,opacity .18s;
}
.btn:hover{border-color:rgba(255,255,255,.4)}
.btn.primary{background:var(--violet);border-color:var(--violet);color:#fff}
.btn.primary:hover{background:#8d48ff;border-color:#8d48ff}
.btn.cyan{background:var(--cyan);border-color:var(--cyan);color:#06121a}
.btn:disabled{opacity:.38;cursor:not-allowed}
.btn.small{min-height:40px;padding:8px 18px;font-size:.9rem}

/* Sign-in and other plain pages */
body.plain{display:grid;place-items:center;padding-block:32px}
.login{width:100%;max-width:400px;display:flex;flex-direction:column;gap:14px}
.login h1{margin:0;font-size:1.6rem;line-height:1.25;text-wrap:balance}
.login p{margin:0}
.login form{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.login label{font-size:.85rem;font-weight:500;color:var(--text-dim)}
.login input{
  min-height:50px;padding:10px 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--ink-3);
}
.login input:focus{border-color:var(--violet);outline:none;box-shadow:0 0 0 3px var(--violet-soft)}
.foot{color:var(--text-faint);font-size:.78rem;margin-top:10px!important}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}