@font-face{font-family:"Archivo Text";font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/archivo-text-400-600.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/jost-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/jost-latin-300-italic.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jost-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/jost-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:500 700;font-display:swap;src:url(../fonts/jost-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo Aulory";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/archivo-800-112.woff2) format("woff2")}

/* Aulory design system · tokens (Kombi E). Three page themes: hell (white), navy, wald (Waldgrün). No black anywhere. */
:root{
  --navy:#0F2752;--waldgruen:#2D4A2D;--zitrone:#E6DF6B;--koralle:#F96558;--salbei:#8FA08F;--wald:#5A7A5A;--off-white:#FBFCFA;
  --sans:Jost,Helvetica,Arial,sans-serif;--serif:var(--sans);--mono:var(--sans);
  --display:"Archivo Aulory",Archivo,"Helvetica Neue",Arial,sans-serif;
  --w:1040px;--gutter:clamp(16px,4vw,32px);
}
:root,:is([data-theme="hell"],[data-theme="koralle"]){
  --bg:#FFFFFF;--bg-deep:#FBFCFA;--tint:#FBF9E8;--surface:#FBFCFA;--surface-2:#F0F3F9;
  --text:#0F2752;--muted:#3B4E70;--faint:#5A7A5A;--body:#0F2752;
  --line:#DDE2DD;--line-2:#D5DBE5;--line-3:#A9B4C6;
  --volt:#F96558;--volt-hover:#F7796E;--on-volt:#0F2752;--accent:#2D4A2D;
  --hover:#F0F3F9;--input:#FFFFFF;--input-line:#C9D0E0;
  --sun:#0F2752;--speck:#F96558;--wm:#0F2752;--em:#0F2752;--mark:#E6DF6B;--card:#2D4A2D;--card-ink:#FBFCFA;
  color-scheme:light;
}
[data-theme="navy"]{
  --bg:#0F2752;--bg-deep:#0C2148;--tint:#132D5C;--surface:#1A3566;--surface-2:#22407A;
  --text:#FBFCFA;--muted:#C9D0E0;--faint:#9EABC8;--body:#E9EDF5;
  --line:#2C4778;--line-2:#34507F;--line-3:#5A72A0;
  --volt:#E6DF6B;--volt-hover:#EEE98F;--on-volt:#0F2752;--accent:#E6DF6B;
  --hover:#FFFFFF0A;--input:#FFFFFF10;--input-line:#5A72A0;
  --sun:#E6DF6B;--speck:#F96558;--wm:#E6DF6B;--em:#E6DF6B;--mark:transparent;--card:#2D4A2D;--card-ink:#FBFCFA;
  color-scheme:dark;
}
[data-theme="wald"]{
  --bg:#2D4A2D;--bg-deep:#274227;--tint:#2A462A;--surface:#365636;--surface-2:#3F613F;
  --text:#FBFCFA;--muted:#C9D6C9;--faint:#A3B6A3;--body:#EEF2EE;
  --line:#3D5E3D;--line-2:#466846;--line-3:#6A8A6A;
  --volt:#E6DF6B;--volt-hover:#EEE98F;--on-volt:#2D4A2D;--accent:#E6DF6B;
  --hover:#FFFFFF0A;--input:#FFFFFF10;--input-line:#6A8A6A;
  --sun:#E6DF6B;--speck:#F96558;--wm:#FBFCFA;--em:#E6DF6B;--mark:transparent;--card:#0F2752;--card-ink:#FBFCFA;
  color-scheme:dark;
}
.sc{--sec:var(--sec-d);--sec-ink:var(--ink-d)}
:is([data-theme="hell"],[data-theme="koralle"]) .sc{--sec:var(--sec-l);--sec-ink:var(--ink-l)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
button{font-family:inherit}
::selection{background:var(--volt);color:var(--on-volt)}
:focus-visible{outline:2px solid var(--volt);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--volt);color:var(--on-volt);padding:8px 12px;z-index:50;border-radius:6px}
.skip:focus{left:8px}
.lbl{font:500 11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin:0}
.lbl.acc{color:var(--accent)}
.eyebrow{font:500 11.5px/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:0 0 12px}
.micro{font:500 10.5px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin:10px 0 0}
.micro a{color:var(--muted)}
.display{font:600 clamp(2.2rem,5.6vw,3.8rem)/1.04 var(--serif);letter-spacing:-.025em;margin:0 0 20px}
.display.sm{font-size:clamp(1.9rem,4.4vw,3rem)}
.display em{color:var(--accent);font-weight:400}

/* header controls */
.lang{display:inline-flex;border:1px solid var(--line-2);border-radius:8px;overflow:hidden}
.lang-link{font:500 11.5px/1 var(--mono)!important;letter-spacing:.06em;padding:8px 9px;color:var(--faint)!important;text-decoration:none}
.lang-link.on{background:var(--text);color:var(--bg)!important}

/* top */
.top{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;justify-content:space-between;height:60px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;letter-spacing:-.01em}
.top-nav{display:flex;align-items:center;gap:14px}
.top-nav .nl{margin-right:6px}
.top-nav a{font-size:14px;color:var(--muted);text-decoration:none}
.top-nav a:hover{color:var(--text)}
.top-nav .top-cta{font:600 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--volt);color:var(--on-volt);padding:10px 14px;border-radius:8px}
.top-nav .top-cta:hover{background:var(--volt-hover);color:var(--on-volt)}

/* hero */
.hero{position:relative;padding:clamp(56px,10vw,120px) 0 clamp(48px,7vw,80px);overflow:hidden}
.byline{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:14px;color:var(--muted);border:1px solid var(--line-2);border-radius:999px;padding:4px 14px 4px 4px;margin-bottom:28px;transition:border-color .15s}
.byline b{color:var(--text);font-weight:500}
.byline:hover{border-color:var(--accent)}
.hero h1{font:600 clamp(2.8rem,7.6vw,5.4rem)/1 var(--serif);letter-spacing:-.035em;margin:0 0 24px}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero-sub{font-size:clamp(1.05rem,1.8vw,1.22rem);color:var(--muted);max-width:44ch;margin:0 0 14px;line-height:1.6}
.hero-sub strong{color:var(--text);font-weight:500}
.hero-own{font:400 clamp(1rem,1.6vw,1.1rem)/1.6 var(--serif);font-style:italic;color:var(--muted);max-width:52ch;margin:0 0 36px;padding-left:14px;border-left:2px solid var(--volt)}
.hero-own b{font-style:normal;font-weight:600;color:var(--text)}
.hero-cta{max-width:540px}
.hero-next{display:inline-flex;align-items:center;gap:12px;margin-top:48px;padding:12px 16px 12px 12px;border:1px solid var(--line-2);border-radius:4px;text-decoration:none;color:var(--muted);font-size:15px;transition:border-color .15s,color .15s}
.hero-next b{color:var(--text);font-weight:500}
.hn-tag{font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;background:var(--volt);color:var(--on-volt);padding:6px 8px;border-radius:6px}
.hn-arrow{color:var(--accent)}
.hero-next:hover{border-color:var(--accent);color:var(--text)}

/* own */
.own{margin:0 0 36px;max-width:760px}
.own-intro{font:500 11.5px/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin:0 0 12px}
.own ul{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.own li{border:1px solid var(--line-2);border-radius:4px;padding:14px 16px;background:color-mix(in srgb,var(--surface) 60%,transparent)}
.own li b{display:block;font:600 1.1rem/1.25 var(--serif);color:var(--text);margin-bottom:4px}
.own li span{font-size:14px;line-height:1.5;color:var(--muted)}
.own-close{font:italic 400 clamp(1.05rem,1.8vw,1.2rem)/1.5 var(--serif);color:var(--text);margin:0}
.own-close em{color:var(--accent)}

/* avatar */
.avatar{border-radius:50%;object-fit:cover;border:1px solid var(--line-2);flex:none}
.avatar.mono{display:inline-grid;place-items:center;background:var(--surface-2);color:var(--accent);font-family:var(--serif);font-weight:600}
.avatar.xs{width:30px;height:30px;font-size:12px}
.avatar.lg{width:128px;height:128px;font-size:2.4rem}

/* dictionary intro */
.dict{border-top:1px solid var(--line);padding:clamp(56px,9vw,104px) 0 32px;scroll-margin-top:60px}
.dict-sub{font-size:clamp(1rem,1.6vw,1.12rem);color:var(--muted);max-width:60ch;margin:0 0 24px}


























/* topics */
.topics-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px}
.topics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.topic{all:unset;box-sizing:border-box;cursor:pointer;position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 16px 18px;border:1px solid var(--line-2);border-radius:4px;background:var(--bg);overflow:hidden;transition:border-color .15s,transform .15s,background .15s}
.topic::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--sec)}
.topic:hover{border-color:var(--line-3);transform:translateY(-2px)}
.topic:focus-visible{outline:2px solid var(--volt);outline-offset:2px}
.topic[aria-pressed="true"]{border-color:var(--sec);background:color-mix(in srgb,var(--sec) 9%,var(--bg))}
.tp-top{display:flex;justify-content:space-between;font:500 11px var(--mono);color:var(--faint)}
.tp-count{color:var(--text);background:var(--surface-2);border-radius:999px;padding:1px 8px}
.tp-name{font:600 1.12rem/1.25 var(--serif);color:var(--text)}
.tp-desc{font-size:13px;line-height:1.45;color:var(--muted)}
.soon-card{cursor:default;border-style:dashed;background:transparent}
.soon-card::before{background:repeating-linear-gradient(90deg,var(--line-3) 0 6px,transparent 6px 12px)}
.soon-card:hover{transform:none}
.soon-card .tp-count{background:transparent;border:1px dashed var(--line-3);color:var(--faint)}

/* toolbar */
.toolbar{position:sticky;top:60px;z-index:20;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0}
.tb-in{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.search{position:relative;flex:1 1 260px;min-width:0}
.s-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--faint)}
.search input{width:100%;height:44px;padding:0 44px 0 42px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font:400 15.5px var(--sans);transition:border-color .15s,box-shadow .15s}
.search input::placeholder{color:var(--faint)}
.search input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--volt) 25%,transparent)}
.search kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:500 11px var(--mono);color:var(--faint);border:1px solid var(--line-2);border-radius:6px;padding:1px 7px}
.sel{position:relative}
.sel select{appearance:none;-webkit-appearance:none;height:44px;padding:0 36px 0 14px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font:500 14px var(--sans);cursor:pointer}
.sel::after{content:"";position:absolute;right:14px;top:50%;width:7px;height:7px;border-right:1.5px solid var(--faint);border-bottom:1.5px solid var(--faint);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.sel select:focus{outline:none;border-color:var(--accent)}
.seg{display:inline-flex;background:var(--surface);border:1px solid var(--line-2);border-radius:8px;padding:3px;gap:2px}
.seg button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:7px;font:500 13.5px var(--sans);color:var(--muted);transition:background .15s,color .15s;white-space:nowrap}
.seg button:hover{color:var(--text)}
.seg button[aria-checked="true"]{background:var(--text);color:var(--bg)}
.seg button:focus-visible{outline:2px solid var(--volt);outline-offset:1px}
.cnt{font:500 10.5px var(--mono);opacity:.65}
.result{font:500 12px var(--mono);color:var(--faint);margin-left:auto}
.clear{all:unset;cursor:pointer;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);padding:6px 4px}
.clear[hidden]{display:none}
.lv{display:inline-block;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-sizing:border-box;flex:none}
.lv-intermediate{background:linear-gradient(90deg,currentColor 50%,transparent 50%)}
.lv-advanced{background:currentColor}

/* list */
.list{padding-top:8px;padding-bottom:40px}
.sec{padding-top:48px;scroll-margin-top:140px}
.sec[hidden]{display:none}
.sec-head{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:start;padding-bottom:18px;border-bottom:1px solid var(--line-2)}
.sec-no{font:500 13px/1 var(--mono);color:var(--sec-ink);background:var(--sec);border-radius:6px;padding:7px 8px;margin-top:6px}
.sec-head h3{font:600 clamp(1.6rem,3.2vw,2.1rem)/1.15 var(--serif);letter-spacing:-.015em;margin:0 0 4px}
.sec-head p{margin:0;color:var(--muted);font-size:15px}
.sec-count{font:500 12px var(--mono);color:var(--faint);margin-top:10px;white-space:nowrap}
.term{border-bottom:1px solid var(--line);scroll-margin-top:140px}
.term[hidden]{display:none}
.term summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(150px,250px) 1fr auto 22px;gap:6px 24px;align-items:baseline;padding:18px 6px;position:relative;border-radius:8px;transition:background .15s}
.term summary:hover{background:var(--hover)}
.term summary::-webkit-details-marker{display:none}
.term summary::before{content:"";position:absolute;left:-10px;top:22px;width:3px;height:18px;border-radius:2px;background:var(--sec);opacity:0;transition:opacity .15s}
.term summary:hover::before,.term[open] summary::before{opacity:1}
.t-name{font:600 1.18rem/1.3 var(--serif);letter-spacing:-.01em}

.t-one{color:var(--muted);font-size:15px;line-height:1.5}
.lvl{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font:500 10.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);border:1px solid var(--line-2);border-radius:999px;padding:5px 9px}
.lvl-basic{color:var(--muted)}.lvl-intermediate{color:var(--zitrone)}.lvl-advanced{color:var(--koralle)}
:is([data-theme="hell"],[data-theme="koralle"]) .lvl-basic{color:#5A7A5A}:is([data-theme="hell"],[data-theme="koralle"]) .lvl-intermediate{color:#2D4A2D;background:#FBF9E8}:is([data-theme="hell"],[data-theme="koralle"]) .lvl-advanced{color:#0F2752;background:#FEF2EF}
.plus{width:18px;height:18px;position:relative;align-self:center}
.plus::before,.plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:var(--faint);transform:translate(-50%,-50%);transition:transform .2s,background .2s}
.plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.term summary:hover .plus::before,.term summary:hover .plus::after{background:var(--volt)}
.term[open] .plus::after{transform:translate(-50%,-50%) rotate(0)}
.term[open] summary .t-one{display:none}
.term[open] summary .t-name{font-size:1.6rem;grid-column:1/3}
.term.flash summary{animation:flash 1.4s ease-out}
@keyframes flash{0%{background:color-mix(in srgb,var(--zitrone) 35%,transparent)}100%{background:transparent}}
.t-body{padding:0 6px 32px;max-width:72ch}
.t-body p{margin:0 0 14px;font-size:16.5px;line-height:1.72;color:var(--body)}
.t-body p.lead{font:400 1.3rem/1.5 var(--serif);font-style:italic;color:var(--text);margin-bottom:20px}
.t-body strong{color:var(--text);font-weight:600}
.tl{color:var(--accent);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.tl:hover{border-bottom-color:var(--accent)}
h3.hsub{display:flex;align-items:center;gap:12px;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:28px 0 12px}
h3.hsub::after{content:"";flex:1;height:1px;background:var(--line-2)}
.dialogue{background:var(--surface);border-left:2px solid var(--sec);border-radius:0 4px 4px 0;padding:16px 20px;margin:4px 0 8px}
.dialogue p{margin:0 0 10px;font-size:15.5px}
.dialogue p:last-child{margin:0}
.who{display:block;font:500 10.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:2px}
.t-foot{margin-top:24px;padding-top:18px;border-top:1px dashed var(--line-2);display:grid;gap:14px}
.rel{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.rel .lbl{margin-right:6px}
.chip{font-size:13px;text-decoration:none;border:1px solid var(--line-2);border-radius:999px;padding:5px 11px;color:var(--muted);transition:all .15s}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.t-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.copy{font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:none;border:1px solid var(--line-2);border-radius:6px;padding:8px 10px;cursor:pointer}
.copy:hover{color:var(--accent);border-color:var(--accent)}
.empty{padding:48px 0;color:var(--muted);font-size:17px}
.empty a{color:var(--accent)}
.list-note{margin:40px 0 0;font-size:13px;color:var(--faint)}

/* origin + external links */
.origin-box{margin-top:26px;border:1px solid var(--line-2);border-radius:4px;padding:4px 18px 6px;background:color-mix(in srgb,var(--surface) 70%,transparent)}
.origin-box h3.hsub{margin-top:16px}
.origin-box p{font-size:15.5px!important}
.ext{color:var(--accent);text-decoration:none;border-bottom:1px dotted color-mix(in srgb,var(--accent) 60%,transparent)}
.ext:hover{border-bottom-style:solid}

/* signup */
.signup{display:flex;gap:8px;flex-wrap:wrap;max-width:540px}
.signup input{flex:1 1 220px;height:50px;padding:0 16px;border-radius:8px;border:1px solid var(--input-line);background:var(--input);color:var(--text);font:400 16px var(--sans)}
.signup input::placeholder{color:var(--faint)}
.signup input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--volt) 25%,transparent)}
.signup button{height:50px;padding:0 20px;border-radius:8px;border:0;background:var(--volt);color:var(--on-volt);font:600 12.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.signup button:hover{background:var(--volt-hover)}
.signup button[disabled]{opacity:.7;cursor:wait}
.signup.big input,.signup.big button{height:56px}
.form-msg{width:100%;margin:6px 0 0;font:500 12px var(--mono);color:var(--muted)}
.form-msg:empty{display:none}
.form-msg a{color:var(--accent)}
.done{display:flex;align-items:center;gap:10px;padding:14px 18px;border:1px solid var(--line-3);background:var(--tint);border-radius:8px;font:italic 400 1.05rem var(--serif);max-width:540px;margin:0}
.done::before{content:"✓";color:var(--text);font-style:normal}
.soon{display:inline-block;border:1px dashed var(--line-3);border-radius:8px;padding:14px 18px;color:var(--muted)}

/* about */
.about-sara{border-top:1px solid var(--line);padding:clamp(56px,8vw,96px) 0}
.about-in{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:start}
.about-sara:not(.has-photo) .about-in{grid-template-columns:1fr}
.about-sara .display{margin-bottom:6px}
.role{font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin:0 0 20px}
.about-sara p:not(.eyebrow):not(.role):not(.closing){color:var(--muted);font-size:1.05rem;max-width:62ch}
.closing{font:italic 400 1.3rem/1.4 var(--serif);color:var(--accent);margin:20px 0 22px}
.li{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-size:14px;border:1px solid var(--line-2);border-radius:999px;padding:9px 16px;color:var(--text);transition:border-color .15s,color .15s}
.li:hover{border-color:var(--accent);color:var(--accent)}

/* build */
.build{padding:0 0 clamp(56px,8vw,96px)}
.build-card{--volt:#E6DF6B;--volt-hover:#EEE98F;--on-volt:#0F2752;--accent:#E6DF6B;color:var(--card-ink);background:var(--card);border-radius:4px;padding:clamp(32px,6vw,72px);position:relative;overflow:hidden}
.build-card .display{color:#FBFCFA}
.build-card .display em{color:#fbfcfab3;font-style:italic}
.build-card .eyebrow{color:#E6DF6B}
.build-card .signup input{color:#FBFCFA}
.build-card .form-msg{color:#fbfcfacc}
.build-sub{font:400 1.12rem/1.6 var(--serif);color:#fbfcfacc;max-width:54ch;margin:0 0 28px}
.build-card .signup input{background:#ffffff14;border-color:#ffffff33}
.build-card .micro{color:#fbfcfa99}

/* footer */
.foot{border-top:1px solid var(--line);padding:28px 0 40px;font-size:13px;color:var(--faint)}
.foot-in{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center}
.foot a{color:var(--muted);text-decoration:none}
.foot a:hover{color:var(--accent)}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--text);color:var(--bg);font:500 13px var(--sans);padding:10px 16px;border-radius:999px;opacity:0;transition:all .2s;pointer-events:none;z-index:60}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:900px){
  .own ul{grid-template-columns:1fr}
  .topics{grid-template-columns:repeat(2,1fr)}
  
}
@media (max-width:820px){
  .top-nav .nl{display:none}
  .top-nav{gap:8px}
  .term summary{grid-template-columns:1fr auto 22px;gap:6px 12px}
  .t-one{grid-column:1/-1;grid-row:2}
  .term[open] summary .t-name{grid-column:1}
  .about-in{grid-template-columns:1fr;gap:20px}
  .avatar.lg{width:96px;height:96px;font-size:1.8rem}
  .sec-head{grid-template-columns:auto 1fr}
  .sec-count{display:none}
  .seg{overflow-x:auto;max-width:100%;scrollbar-width:none}
  .seg::-webkit-scrollbar{display:none}
  .result{margin-left:0}
  .term summary::before{left:-6px}
}
@media (max-width:560px){
  .top-cta{padding:9px 10px!important;font-size:11px!important}
  .lang-link{padding:8px 7px}
  .topics{grid-template-columns:1fr 1fr;gap:8px}
  .topic{padding:14px 12px}
  .tp-desc{display:none}
  .toolbar{position:static}
  .sec,.term{scroll-margin-top:72px}
  .search{flex-basis:100%}
  .sel{flex:1}
  .sel select{width:100%}
  .seg{order:3;width:100%}
  .seg button{flex:1;justify-content:center;padding:0 8px}
  .cnt{display:none}
  .t-body p{font-size:16px}
  .hero-next{font-size:14px}
}
@media (min-width:901px){
  .tb-in{flex-wrap:nowrap}
  .search{flex:1 1 200px}
  .sel select{width:178px}
  .seg button{padding:0 10px}
  .result{white-space:nowrap}
}

/* own line (v5) */
.own-line{font:400 clamp(1.15rem,2.2vw,1.45rem)/1.55 var(--serif);color:var(--muted);margin:0 0 10px;max-width:48ch}
.own-line .own-intro{font:inherit;letter-spacing:0;text-transform:none;color:var(--text);margin:0}
.own-line b{font-weight:600;color:var(--text);background:linear-gradient(transparent 62%,color-mix(in srgb,var(--zitrone) 30%,transparent) 62%);padding:0 2px}
:is([data-theme="hell"],[data-theme="koralle"]) .own-line b{background:linear-gradient(transparent 60%,var(--zitrone) 60%)}
.own-close{font-size:clamp(1rem,1.6vw,1.1rem)}

/* path tabs (v5) */



















/* ===== Aulory design system layer ===== */
body{font:300 16px/1.75 var(--sans);transition:background-color .25s,color .25s}
strong,b{font-weight:500}
/* display: Archivo ExtraBold 800, width 112, capitals */
.hero h1,.display,.sec-head h3{font-family:var(--display);font-weight:800;font-style:normal;text-transform:uppercase;letter-spacing:.02em;font-synthesis:none}
.hero h1{font-size:clamp(2.1rem,6.2vw,4.4rem);line-height:1.02;margin:0 0 26px}
.display{font-size:clamp(1.75rem,4.6vw,3.1rem);line-height:1.05}
.display.sm{font-size:clamp(1.5rem,3.6vw,2.4rem)}
.sec-head h3{font-size:clamp(1.15rem,2.4vw,1.55rem);letter-spacing:.04em;line-height:1.2;margin:2px 0 6px}
.hero h1 em,.display em{font-style:normal;font-weight:800;color:var(--em);background:linear-gradient(transparent 62%,var(--mark) 62%,var(--mark) 92%,transparent 92%);padding:0 .06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.build-card .display em{color:#E6DF6B;background:none}
/* labels: spaced Jost capitals */
.lbl,.eyebrow,.micro,.own-intro,.role,.who,h3.hsub,.lvl,.copy,.clear,.hn-tag,.top-nav .top-cta,.signup button,.lang-link{font-family:var(--sans)!important;letter-spacing:.16em}
.eyebrow,.lbl{font-weight:400}
.top-nav .top-cta,.signup button,.hn-tag{font-weight:500!important;letter-spacing:.12em}
/* text styles */
.hero-own,.own-line,.own-close,.build-sub,.closing,.t-body p.lead,.done{font-family:var(--sans)}
.own-line{font-weight:300;font-size:clamp(1.15rem,2.1vw,1.4rem);line-height:1.6}
.own-close{font-style:normal;font-weight:300;color:var(--muted)}
.own-close em{font-style:normal;color:var(--text);font-weight:500}
.t-body p.lead{font-weight:300;font-style:normal;font-size:1.25rem;line-height:1.6}
.closing{font-weight:400;font-style:normal;color:var(--text)}
.t-name,.tp-name{font-family:var(--sans)!important;font-weight:500!important;letter-spacing:0}
.t-name{font-size:1.15rem}
.term[open] summary .t-name{font-family:var(--display)!important;font-weight:800!important;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(1.25rem,2.6vw,1.6rem)}

.t-body p{font-weight:300}
.dialogue p{font-weight:300}
.hero-sub{font-weight:300}
.byline,.byline b{font-weight:400}
.byline b{font-weight:500}
.hero-own b{font-weight:500}

/* header logo lockup: sun + AULORY wordmark */
.brand{gap:9px}
.sun{display:block;overflow:visible}
.sun .s-fill{fill:var(--sun);transition:fill .25s}
.sun feFlood{flood-color:var(--speck)}
.wm{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding-left:.06em;line-height:1;color:var(--wm);transition:color .25s}
.brand .wm{font-size:17px}
.foot .brand-sm{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;margin-right:4px}
.foot .brand-sm .wm{font-size:12px}

/* theme picker: three colours */
.swatches{display:inline-flex;gap:3px;padding:3px;border:1px solid var(--line-2);border-radius:8px}
.swatch{all:unset;box-sizing:border-box;cursor:pointer;position:relative;width:26px;height:26px;border-radius:6px;background:var(--sw-bg);border:1px solid #0F275226;overflow:hidden;transition:transform .15s}
.swatch::after{content:"";position:absolute;left:50%;bottom:4px;width:14px;height:7px;margin-left:-7px;border-radius:14px 14px 0 0;background:var(--sw-sun)}
.swatch:hover{transform:translateY(-1px)}
.swatch[aria-checked="true"]{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--text)}
.swatch:focus-visible{outline:2px solid var(--koralle);outline-offset:3px}
.swatch[data-set="hell"]{--sw-bg:#FFFFFF;--sw-sun:#0F2752}
.swatch[data-set="navy"]{--sw-bg:#0F2752;--sw-sun:#E6DF6B;border-color:#FFFFFF30}
.swatch[data-set="wald"]{--sw-bg:#2D4A2D;--sw-sun:#E6DF6B;border-color:#FFFFFF30}
.lang-link.on{background:var(--text);color:var(--bg)!important}

/* hero sun */
.hero{position:relative;border-bottom:2px solid var(--text)}
.hero .wrap{position:relative}
.hero-sun{position:absolute;right:var(--gutter);bottom:calc(-1 * clamp(48px,7vw,80px));width:clamp(240px,36vw,440px);pointer-events:none}
.hero-sun svg{width:100%;height:auto}
.hero > .wrap > *:not(.hero-sun){position:relative;z-index:1}
.dict{border-top:0}

/* buttons & accents */
.top-nav .top-cta,.signup button{border-radius:8px}
.signup input{font-weight:300}
.hn-tag{border-radius:4px}
.topic::before{height:4px}
.sec-no{border-radius:4px;font-family:var(--sans);font-weight:500}
.chip,.lvl,.byline,.li{font-weight:400}





:is([data-theme="hell"],[data-theme="koralle"]) .tl,:is([data-theme="hell"],[data-theme="koralle"]) .ext{color:var(--navy);border-bottom-color:var(--koralle)}
:is([data-theme="hell"],[data-theme="koralle"]) .clear,:is([data-theme="hell"],[data-theme="koralle"]) .hn-arrow{color:var(--navy)}
:is([data-theme="hell"],[data-theme="koralle"]) .eyebrow,:is([data-theme="hell"],[data-theme="koralle"]) .lbl.acc,:is([data-theme="hell"],[data-theme="koralle"]) h3.hsub{color:var(--waldgruen)}
:is([data-theme="hell"],[data-theme="koralle"]) .hero-own{border-left-color:var(--koralle)}
.done{border-radius:4px}

@media (max-width:820px){
  .hero-sun{position:static;display:block;width:min(240px,62vw);margin:44px 0 calc(-1 * clamp(48px,7vw,80px)) auto}
}
@media (max-width:560px){
  .brand .wm{font-size:15px}
  .swatch{width:22px;height:22px}
  .swatch::after{width:12px;height:6px;margin-left:-6px;bottom:3px}
}
@media (max-width:420px){
  .top-nav .top-cta{display:none}
}
/* dark themes: owned words in Zitrone, no marker */
[data-theme="navy"] .own-line b,[data-theme="wald"] .own-line b{background:none;color:var(--zitrone);padding:0}
/* newsletter card: sun on the horizon */
.build-card{--sun:#E6DF6B;--speck:#F96558;position:relative;overflow:hidden}
.build-card > *:not(.card-sun){position:relative;z-index:1}
.card-sun{position:absolute;right:clamp(32px,6vw,72px);bottom:0;width:clamp(170px,24vw,290px);pointer-events:none}
.card-sun svg{width:100%;height:auto}
@media (max-width:820px){.card-sun{position:static;width:min(200px,55vw);margin:36px 0 calc(-1 * clamp(32px,6vw,72px)) auto}}
@media (min-width:821px){.build-card .signup,.build-sub{max-width:min(540px,calc(100% - 300px))}}
/* long German compounds on small screens */
.term summary>*{min-width:0}
.t-name,.t-one,.t-body,.display,.hero h1,.sec-head h3,.tp-name{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}

/* ===== v7: Sonnenstaub, no marker lines, no colour stripes ===== */
/* no underlines / markers */
.hero h1 em,.display em,:is([data-theme="hell"],[data-theme="koralle"]) .hero h1 em,:is([data-theme="hell"],[data-theme="koralle"]) .display em{background:none;padding:0}
:is([data-theme="hell"],[data-theme="koralle"]) .hero h1 em,:is([data-theme="hell"],[data-theme="koralle"]) .dict .display em{color:var(--waldgruen)}
.own-line b,:is([data-theme="hell"],[data-theme="koralle"]) .own-line b{background:none;padding:0;font-weight:500;color:var(--text)}
[data-theme="navy"] .own-line b,[data-theme="wald"] .own-line b{color:var(--zitrone)}
.tl,.ext,:is([data-theme="hell"],[data-theme="koralle"]) .tl,:is([data-theme="hell"],[data-theme="koralle"]) .ext{border-bottom:0!important;text-decoration:none;font-weight:500;color:var(--accent)}
.tl:hover,.ext:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}


.hero-own{border-left:0;padding-left:0}
h3.hsub::after{background:var(--line)}

/* no colour stripes anywhere */
.topic::before,.soon-card::before{display:none}
.term summary::before{display:none}
.dialogue{border-left:0;border-radius:4px;background:var(--surface-2);padding:18px 22px}
:is([data-theme="hell"],[data-theme="koralle"]) .dialogue{background:#F0F3F9}

/* section numbers: Archivo figures instead of colour chips */
.sec-head{align-items:baseline}
.sec-no{background:none;color:var(--text);font-family:var(--display);font-weight:800;font-size:clamp(1.15rem,2.4vw,1.55rem);letter-spacing:.04em;padding:0;margin:0;border-radius:0}

/* topic cards: Sonnenstaub point shadow (Schatten) */
.topics{position:relative;z-index:0;gap:16px}
.topic{overflow:visible;padding:20px 20px 22px;gap:8px;border-color:var(--line-2);background:var(--bg);transition:transform .2s,border-color .2s}
.topic::after{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:4px;background:var(--dust-shadow) right bottom/cover no-repeat;transform:translate(0,0);opacity:0;transition:transform .2s,opacity .2s}
.topic:not(.soon-card):hover{transform:translate(-3px,-3px);border-color:var(--text)}
.topic:not(.soon-card):hover::after{opacity:1;transform:translate(9px,9px)}
.topic[aria-pressed="true"]{border-color:var(--text);background:var(--bg);transform:translate(-3px,-3px)}
.topic[aria-pressed="true"]::after{opacity:1;transform:translate(9px,9px)}
.tp-top{align-items:center}
.tp-no{font-family:var(--display);font-weight:800;font-size:1.05rem;letter-spacing:.04em;color:var(--text)}
.tp-count{background:none;border:1px solid var(--line-2);font-size:11px}
.tp-name{font-size:1.1rem;line-height:1.3;margin-top:4px}
.soon-card{border-style:solid;background:var(--bg);padding-right:84px}
.soon-card .tp-no{font-family:var(--sans);font-weight:400;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}

/* sticker */
.sticker{position:absolute;display:grid;place-items:center;flex:none;transform:rotate(-8deg)}
.sticker svg{position:absolute;inset:0;width:100%;height:100%}
.sticker b{position:relative;font-family:var(--display);font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#0F2752}
.soon-card .sticker{right:12px;top:12px}

/* buttons: Sonnenstaub accent on hover */
.top-nav .top-cta,.signup button{background-repeat:no-repeat;background-position:right top;background-size:auto 100%}
.top-nav .top-cta:hover,.signup button:hover{background-color:var(--volt);background-image:var(--dust-btn)}
.build-card .signup button:hover{background-color:#E6DF6B}

/* reading progress */


/* footer: Zitrone band, dissolving upward (Übergang) */
.foot{position:relative;background:#E6DF6B;color:#0F2752;border-top:0;margin-top:80px;padding:36px 0 44px;--sun:#0F2752;--speck:#F96558;--wm:#0F2752}
.foot::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:90px;background:var(--dust-rise) center bottom/auto 90px repeat-x;pointer-events:none}
.foot a{color:#0F2752}
.foot a:hover{color:#0F2752;text-decoration:underline;text-underline-offset:4px}
.foot .brand-sm .wm{font-size:13px}
.build{padding-bottom:0}

/* spacing rhythm (4 · 8 · 16 · 24 · 32 · 52 · 80) */
.hero{padding:80px 0 80px}
.byline{margin-bottom:32px}
.hero h1{margin-bottom:24px}
.hero-sub{margin-bottom:16px}
.own{margin-bottom:32px}
.hero-next{margin-top:52px}
.dict{padding:80px 0 32px}
.dict-sub{margin-bottom:24px}


.topics-head{margin-bottom:16px}
.list{padding-bottom:52px}
.sec{padding-top:52px}
.about-sara{padding:80px 0}
.build-card{padding:52px}
@media (max-width:820px){
  .hero{padding:52px 0 52px}
  .hero-sun{margin-bottom:-52px}
  .dict{padding-top:52px}
  
  .about-sara{padding:52px 0}
  .build-card{padding:32px 24px}
  .card-sun{margin-bottom:-32px}
  .topics{gap:12px}
}
@media (max-width:560px){
  .hero{padding-top:32px}
  .byline{margin-bottom:24px;font-size:13px}
  
  .topic{padding:16px 14px 18px}
  .soon-card{padding-right:14px;padding-top:16px}
  .soon-card .sticker{width:52px!important;height:52px!important;right:8px;top:-14px}
  .soon-card .sticker b{font-size:10px}
  .foot{margin-top:64px}
}
.hero-sun{bottom:-80px}
.card-sun{right:52px}
/* v7.1 topic card: face + dust shadow both behind content */
.topic,.topic:hover,.topic[aria-pressed="true"]{background:transparent;border-color:transparent}
.topic::before{display:block!important;content:"";position:absolute;inset:0;z-index:-1;border:1px solid var(--line-2);border-radius:4px;background:var(--bg);height:auto;transition:border-color .2s}
.topic::after{z-index:-2;inset:0}
.topic:not(.soon-card):hover::before,.topic[aria-pressed="true"]::before{border-color:var(--text)}
.topic[aria-pressed="true"]::before{border-width:2px}
.sticker b{font-size:11px;transform:translate(-4px,3px)}
@media (max-width:820px){
  .hero-sun{margin-top:24px;margin-bottom:-52px}
  .hero-next{margin-top:40px}
}

@media (max-width:560px){
  .foot-in{flex-direction:column;align-items:flex-start;gap:16px}
  .foot-in > span{display:flex;flex-direction:column;gap:8px}
  .foot .brand-sm{margin:0}
}
.foot-l{display:inline-flex;align-items:center;gap:16px;flex-wrap:wrap}
@media (max-width:560px){.foot-in > span{display:flex}.foot-l{flex-direction:column;align-items:flex-start;gap:10px}}
:is([data-theme="hell"],[data-theme="koralle"]) .build-card .eyebrow{color:#E6DF6B}
/* v7.2: "Own your AI" in Koralle (Sara, 20.10.: large display only) */
.hero h1 em,:is([data-theme="hell"],[data-theme="koralle"]) .hero h1 em,:is([data-theme="hell"],[data-theme="koralle"]) .dict .display em,.dict .display em{color:var(--koralle)}
/* v7.3: no pale-yellow tints on White; Hauch Navy instead (Sara, 20.10.) */
:root,:is([data-theme="hell"],[data-theme="koralle"]){--tint:#F0F3F9}


:is([data-theme="hell"],[data-theme="koralle"]) .lvl-intermediate{background:#F0F3F9}
:is([data-theme="hell"],[data-theme="koralle"]) .lvl-advanced{background:#FEF2EF}
@keyframes flash{0%{background:color-mix(in srgb,var(--koralle) 14%,transparent)}100%{background:transparent}}

:is([data-theme="hell"],[data-theme="koralle"]) .dialogue{background:#F0F3F9}
/* v7.4: no horizon line; more Sonnenstaub */
.hero{border-bottom:0}
/* Kante: Find-your-path box, dust from the upper right */



/* Feld: About, dust field in the free right corner (desktop) */
.about-sara{position:relative;overflow:hidden}
@media (min-width:900px){.about-sara::before{content:"";position:absolute;right:0;top:0;width:420px;height:240px;background:var(--dust-corner) right top/cover no-repeat;pointer-events:none}}
.about-sara .wrap{position:relative}
/* Akzent: chosen path tab gathers dust at its right edge */

/* reading progress fills with dust */





.about-sara{border-top:0}



/* ===== v8 palette: two light (Weiß, Koralle), two dark (Navy, Waldgrün). Koralle leads, Zitrone only as speckle. ===== */
:root,[data-theme="hell"]{--em:#F96558;--num:#F96558;--sel:#F96558;--on-sel:#0F2752}
[data-theme="koralle"]{
  --bg:#FEF2EF;--bg-deep:#FEF2EF;--tint:#FFFFFF;--surface:#FFFFFF;--surface-2:#FCE6E1;
  --text:#0F2752;--muted:#33466A;--faint:#4A644A;--body:#0F2752;
  --line:#F2D6CF;--line-2:#EBC8C0;--line-3:#D7A69C;--hover:#FFFFFF99;--input:#FFFFFF;--input-line:#E2B6AC;
  --volt:#F96558;--volt-hover:#F96558;--on-volt:#0F2752;--accent:#2D4A2D;
  --sun:#F96558;--speck:#0F2752;--wm:#0F2752;--em:#F25446;--num:#F25446;--sel:#0F2752;--on-sel:#FBFCFA;--card:#0F2752;
  color-scheme:light;
}
[data-theme="navy"]{
  --accent:#F96558;--volt:#F96558;--volt-hover:#F96558;--on-volt:#0F2752;
  --sun:#F96558;--speck:#E6DF6B;--wm:#FBFCFA;--em:#F96558;--num:#F96558;--sel:#F96558;--on-sel:#0F2752;
  --faint:#A9B5CF;--tint:#132D5C;--surface:#1A3566;--surface-2:#22407A;--card:#2D4A2D;
}
[data-theme="wald"]{
  --accent:#FFB4AC;--volt:#F96558;--volt-hover:#F96558;--on-volt:#0F2752;
  --sun:#F96558;--speck:#E6DF6B;--wm:#FBFCFA;--em:#F96558;--num:#F96558;--sel:#F96558;--on-sel:#0F2752;
  --faint:#B4C5B4;--muted:#D3DED3;--tint:#284428;--surface:#355435;--surface-2:#3E5F3E;--card:#0F2752;
}
/* large display accents */
.hero h1 em,:is([data-theme="hell"],[data-theme="koralle"]) .hero h1 em,.dict .display em,:is([data-theme="hell"],[data-theme="koralle"]) .dict .display em{color:var(--em)}
.sec-no{color:var(--num)}
.tp-no{color:var(--num);font-size:1.25rem}
/* owned words */
.own-line b,:is([data-theme="hell"],[data-theme="koralle"]) .own-line b,[data-theme="navy"] .own-line b,[data-theme="wald"] .own-line b{color:var(--text)}
[data-theme="navy"] .own-line b{color:#F96558}
[data-theme="wald"] .own-line b{color:#FFB4AC}
/* small accent text */
[data-theme="navy"] .eyebrow,[data-theme="navy"] .lbl.acc,[data-theme="navy"] h3.hsub,[data-theme="wald"] .eyebrow,[data-theme="wald"] .lbl.acc,[data-theme="wald"] h3.hsub{color:var(--accent)}
.tl,.ext,:is([data-theme="hell"],[data-theme="koralle"]) .tl,:is([data-theme="hell"],[data-theme="koralle"]) .ext{color:var(--accent)}
/* levels and badges, no yellow */
.lvl-basic{color:var(--muted)}
.lvl-intermediate,[data-theme="navy"] .lvl-intermediate,[data-theme="wald"] .lvl-intermediate{color:var(--text);background:transparent}
.lvl-advanced,[data-theme="navy"] .lvl-advanced,[data-theme="wald"] .lvl-advanced{color:var(--accent)}
:is([data-theme="hell"],[data-theme="koralle"]) .lvl-intermediate{color:#0F2752;background:#F0F3F9}
:is([data-theme="hell"],[data-theme="koralle"]) .lvl-advanced{color:#0F2752;background:#FEF2EF;border-color:#F96558}
[data-theme="koralle"] .lvl-advanced{background:#FFFFFF}



/* selected states: Koralle (Navy on the Coral theme) */
.seg button[aria-checked="true"]{background:var(--sel);color:var(--on-sel)}
.topic::before{background:var(--bg)}
[data-theme="koralle"] .topic::before{background:#FFFFFF}
.topic[aria-pressed="true"]::before{border:2px solid var(--sel)}


[data-theme="koralle"] .search input,[data-theme="koralle"] .sel select,[data-theme="koralle"] .seg{background:#FFFFFF}

.dialogue,:is([data-theme="hell"],[data-theme="koralle"]) .dialogue{background:var(--surface-2)}
[data-theme="hell"] .dialogue{background:#FEF2EF}
/* no motion-triggered dust */
.topic::after{display:none!important}
.topic:not(.soon-card):hover,.topic[aria-pressed="true"]{transform:none}
.top-nav .top-cta:hover,.signup button:hover{background-image:none;filter:none}

.top-nav .top-cta:hover,.signup button:hover{background-color:var(--volt);box-shadow:inset 0 0 0 2px var(--on-volt)}
/* newsletter card: Koralle instead of Zitrone */
.build-card{--volt:#F96558;--volt-hover:#F96558;--on-volt:#0F2752;--accent:#FFB4AC;--sun:#F96558;--speck:#E6DF6B}
.build-card .display em{color:#F96558}
.build-card .eyebrow,:is([data-theme="hell"],[data-theme="koralle"]) .build-card .eyebrow{color:#FFB4AC}
.build-card .signup button:hover,.build-card .signup button{background-color:#F96558}
/* footer: Koralle sunset */
.foot{background:#F96558;--sun:#0F2752;--speck:#E6DF6B;--wm:#0F2752}
.foot,.foot a,.foot a:hover{color:#0F2752}


/* hero sun on dark themes: Koralle with Zitrone speckle via tokens */
.swatch[data-set="koralle"]{--sw-bg:#FEF2EF;--sw-sun:#F96558;border-color:#F9655866}
.swatch[data-set="navy"]{--sw-sun:#F96558}
.swatch[data-set="wald"]{--sw-sun:#F96558}
.lang-link.on{background:var(--text);color:var(--bg)!important}
/* v8.1 contrast fixes */
[data-theme="hell"]{--em:#F25446;--num:#F25446;--faint:#4A644A}
[data-theme="koralle"]{--faint:#3F5A3F}
[data-theme="wald"] .dialogue{background:#264026}
[data-theme="wald"]{--faint:#C2D1C2}
[data-theme="navy"]{--accent:#FF8A7F}
:is([data-theme="hell"],[data-theme="koralle"]) .lvl-basic{color:var(--faint)}
.build-card .signup input::placeholder{color:#FBFCFAB3}.build-card .signup input{color:#FBFCFA}

/* ===== v9: colour play. theme.js sets every token from the chosen background + sun; this layer only maps tokens. ===== */
html[data-theme] body{background:var(--bg);color:var(--text);transition:background-color .45s,color .45s}
html[data-theme] .top{background:color-mix(in srgb,var(--bg) 90%,transparent);border-bottom-color:var(--line)}
html[data-theme] .toolbar{background:color-mix(in srgb,var(--bg) 94%,transparent);border-color:var(--line)}
html[data-theme] .sun .s-fill{transition:fill .45s}
html[data-theme] .hero h1 em,html[data-theme] .dict .display em{color:var(--em)}
html[data-theme] .sec-no,html[data-theme] .tp-no{color:var(--em)}
html[data-theme] .soon-card .tp-no{color:var(--faint)}
html[data-theme] .own-line b{color:var(--text)}
html[data-theme] .eyebrow,html[data-theme] .lbl.acc,html[data-theme] h3.hsub{color:var(--muted)}
html[data-theme] .tl,html[data-theme] .ext{color:var(--accent)}
html[data-theme] .clear,html[data-theme] .hn-arrow{color:var(--text)}
html[data-theme] .lvl{border-color:var(--line-2);background:transparent}
html[data-theme] .lvl-basic{color:var(--muted)}
html[data-theme] .lvl-intermediate{color:var(--text)}
html[data-theme] .lvl-advanced{color:var(--text);border-color:var(--acc-line)}

html[data-theme] .seg,html[data-theme] .search input,html[data-theme] .sel select{background:var(--surface);border-color:var(--line-2);color:var(--text)}
html[data-theme] .seg button{color:var(--muted)}
html[data-theme] .seg button[aria-checked="true"]{background:var(--acc);color:var(--on-acc)}



html[data-theme] .topic::before{background:var(--surface);border-color:var(--line-2)}
html[data-theme] .topic:not(.soon-card):hover::before{border-color:var(--text)}
html[data-theme] .topic[aria-pressed="true"]::before{border:2px solid var(--acc-line)}
html[data-theme] .tp-count{border-color:var(--line-2);color:var(--text)}
html[data-theme] .dialogue{background:var(--tint)}
html[data-theme] .origin-box{background:var(--tint);border-color:var(--line-2)}



html[data-theme] .top-nav .top-cta,html[data-theme] .signup button,html[data-theme] .hn-tag{background:var(--acc);color:var(--on-acc)}
html[data-theme] .top-nav .top-cta:hover,html[data-theme] .signup button:hover{background:var(--acc);box-shadow:inset 0 0 0 2px var(--on-acc)}
html[data-theme] .signup input{background:var(--surface);border-color:var(--line-3);color:var(--text)}
html[data-theme] .signup input::placeholder{color:var(--faint)}
html[data-theme] .lang,html[data-theme] .swatches,html[data-theme] .byline,html[data-theme] .hero-next,html[data-theme] .li,html[data-theme] .chip,html[data-theme] .copy{border-color:var(--line-2)}
html[data-theme] .lang-link.on{background:var(--text);color:var(--bg)!important}
html[data-theme] .done{background:var(--tint);border-color:var(--line-3)}
html[data-theme] ::selection{background:var(--acc);color:var(--on-acc)}
html[data-theme] :focus-visible{outline-color:var(--acc-line)}
/* sticker = the sun in miniature */
.sticker .st-base{fill:var(--acc)}
.sticker feFlood{flood-color:var(--speck)}
html[data-theme] .sticker b{color:var(--on-acc)}
/* newsletter card: contrast block */
html[data-theme] .build-card{background:var(--card);color:var(--card-ink);--sun:var(--card-sun);--speck:var(--card-speck)}
html[data-theme] .build-card .display,html[data-theme] .build-card .build-sub,html[data-theme] .build-card .micro,html[data-theme] .build-card .eyebrow,html[data-theme] .build-card .form-msg{color:var(--card-ink)}
html[data-theme] .build-card .display em{color:var(--card-em)}
html[data-theme] .build-card .signup input{background:color-mix(in srgb,var(--card-ink) 10%,var(--card));border-color:color-mix(in srgb,var(--card-ink) 35%,var(--card));color:var(--card-ink)}
html[data-theme] .build-card .signup input::placeholder{color:color-mix(in srgb,var(--card-ink) 75%,var(--card))}
html[data-theme] .build-card .signup button{background:var(--card-btn);color:var(--card-btn-ink)}
html[data-theme] .build-card .signup button:hover{background:var(--card-btn);box-shadow:inset 0 0 0 2px var(--card-btn-ink)}
/* footer: the sun colour as a sunset band */
html[data-theme] .foot{background:var(--foot);color:var(--foot-ink);--sun:var(--foot-sun);--speck:var(--foot-speck);--wm:var(--foot-ink)}
html[data-theme] .foot a,html[data-theme] .foot a:hover{color:var(--foot-ink)}
/* five background chips */
.swatch[data-set="hell"]{--sw-bg:#FFFFFF;--sw-sun:#F96558;border-color:#0F275233}
.swatch[data-set="zitrone"]{--sw-bg:#E6DF6B;--sw-sun:#F96558;border-color:#0F275233}
.swatch[data-set="koralle"]{--sw-bg:#F96558;--sw-sun:#E6DF6B;border-color:#0F275233}
.swatch[data-set="navy"]{--sw-bg:#0F2752;--sw-sun:#E6DF6B;border-color:#FFFFFF40}
.swatch[data-set="wald"]{--sw-bg:#2D4A2D;--sw-sun:#E6DF6B;border-color:#FFFFFF40}
html[data-theme] .swatch[aria-checked="true"]{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--text)}
/* tap-the-sun */
.hero-sun{pointer-events:auto;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.sun-btn{all:unset;cursor:pointer;display:block;width:100%;line-height:0;-webkit-tap-highlight-color:transparent}
.sun-btn:focus-visible{outline:2px solid var(--acc-line);outline-offset:6px;border-radius:4px}
.sun-btn svg{width:100%;height:auto;transition:transform .35s cubic-bezier(.3,1.4,.5,1)}
.sun-btn:hover svg{transform:translateY(-4px)}
.sun-btn:active svg{transform:translateY(1px)}
.sun-cap{margin:0;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px 12px;font:400 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.sun-hint{display:inline-flex;align-items:center;gap:8px;color:var(--text);font-weight:500}
.sun-hint::after{content:"↓";font-size:14px;letter-spacing:0}
#sun-name:not(:empty)::before{content:"· ";color:var(--faint)}
.shuffle{all:unset;cursor:pointer;position:absolute;left:0;bottom:16px;font:500 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text);border:1px solid var(--line-3);border-radius:8px;padding:10px 12px;background:var(--bg)}
.shuffle span{color:var(--acc-line)}
.shuffle:hover{border-color:var(--text)}
.shuffle:focus-visible{outline:2px solid var(--acc-line);outline-offset:2px}
.hero-sun{width:clamp(260px,36vw,440px)}
@media (min-width:821px){.shuffle{left:auto;right:calc(100% + 16px);bottom:12px;white-space:nowrap}}
@media (max-width:820px){
  .hero-sun{position:relative;width:min(280px,72vw);margin:40px 0 -52px auto}
  .shuffle{position:absolute;left:auto;right:calc(100% + 12px);bottom:10px;white-space:nowrap}
  .sun-cap{font-size:11px}
}
@media (max-width:420px){.hero-sun{width:62vw}.shuffle{padding:9px 10px;font-size:11px}}
@media (prefers-reduced-motion:reduce){.sun-btn svg,html[data-theme] body{transition:none}}
.sun-btn:hover svg,.sun-btn:active svg{transform:none}
/* v9.1 shuffle lives in the caption row */
.shuffle,.hero-sun .shuffle{position:static!important;right:auto!important;left:auto!important;bottom:auto!important;padding:7px 10px;font-size:11px;white-space:nowrap}
.sun-cap{row-gap:8px}
.hero-sun{width:clamp(300px,38vw,460px)}
@media (max-width:820px){.hero-sun{width:min(320px,86vw)}.hero-sun .sun-btn{width:min(280px,72vw)}}
.sun-cap{flex-direction:column;align-items:flex-end;gap:8px}
.sun-cap > span:first-child{display:inline-flex;gap:8px}
@media (min-width:821px){.hero-sun{width:clamp(280px,30vw,400px)}}

/* ===== v10 typography (Sara, 20.10.): Archivo for reading, Archivo 112/800 for headlines, Jost 500 for labels ===== */
:root{--sans:"Archivo Text",Archivo,"Helvetica Neue",Arial,sans-serif;--label:Jost,Helvetica,Arial,sans-serif}
html[data-theme] body{font:400 17px/1.7 var(--sans)}
@media (max-width:600px){html[data-theme] body{font-size:16px}}
/* labels */
.lbl,.eyebrow,.micro,.role,.who,h3.hsub,.lvl,.copy,.clear,.hn-tag,.top-nav .top-cta,.signup button,.lang-link,.sun-cap,.shuffle,.sec-count,.tp-count,.cnt,.result,.tp-no.next,.soon-card .tp-no,.sticker b,.form-msg,.seg button,.s-ico + input + kbd,.search kbd{font-family:var(--label)!important;font-weight:500!important}
.lbl,.eyebrow,.micro,.role,.who,h3.hsub,.lvl,.copy,.clear,.hn-tag,.top-nav .top-cta,.signup button,.lang-link,.sun-cap,.shuffle,.soon-card .tp-no{font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.lvl{font-size:10.5px}
.seg button{text-transform:none;letter-spacing:.02em;font-size:14px}
.sticker b{font-family:var(--display)!important;font-weight:800!important}
/* reading text: Archivo 400 */
.hero-sub,.own-line,.own-close,.t-body p,.t-body p.lead,.dialogue p,.build-sub,.signup input,.dict-sub,.tp-desc,.t-one,.about-sara p,.list-note,.empty,.search input,.sel select,.top-nav a,.byline,.hero-next,.chip,.li,.foot,.closing{font-weight:400}
.t-body p{font-size:17px;line-height:1.7}
.t-body p.lead{font-size:1.2rem;line-height:1.6}
.own-line{font-size:clamp(1.1rem,2vw,1.3rem)}
strong,b,.t-body strong,.own-line b,.hero-sub strong,.hero-own b,.byline b{font-weight:600}
/* h3 role: Archivo 600 */
.t-name,.tp-name{font-family:var(--sans)!important;font-weight:600!important;letter-spacing:0}

.tp-name{font-size:1.06rem;line-height:1.35}
.t-name{font-size:1.1rem;line-height:1.35}
/* paragraphs */
.t-body p,.hero-sub,.dict-sub,.about-sara p,.build-sub{max-width:680px}
.t-body{max-width:none}
.t-body h3.hsub,.t-body .dialogue,.t-body .origin-box{max-width:680px}
/* v10.1 footer without dust (Sara, 20.10.) */
.foot::before{display:none!important}
html[data-theme] .foot{margin-top:80px}

/* ===== v11: colour studio, dust only where Sara wants it ===== */
.about-sara::before{display:none!important}
.foot::before{display:block!important}
html[data-theme] .byline{padding:7px 16px;gap:6px}
/* header: one small palette button instead of five dots */
.pal-btn{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px 0 8px;border:1px solid var(--line-2);border-radius:8px;text-decoration:none;color:var(--text)!important;font:500 12px/1 var(--label)!important;letter-spacing:.14em;text-transform:uppercase}
.pal-btn:hover{border-color:var(--text)}
.pal-dot{position:relative;width:22px;height:22px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-3);overflow:hidden;flex:none}
.pal-dot::after{content:"";position:absolute;left:3px;right:3px;bottom:5px;height:8px;border-radius:8px 8px 0 0;background:var(--sun)}
@media (max-width:560px){.pal-t{display:none}.pal-btn{padding:0 6px}}
/* studio panel */
.hero-sun{display:flex;flex-direction:column;align-items:stretch;gap:12px}
.studio{background:var(--surface);border:1px solid var(--line-2);border-radius:4px;padding:20px;display:grid;gap:12px;text-align:left}
.studio .lbl{margin:0}
.studio-h{margin:0;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.03em;font-size:1.05rem;line-height:1.25;color:var(--text)}
.st-row{display:grid;grid-template-columns:52px 1fr;align-items:center;gap:12px}
.st-k{font:500 11px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.sky{--pos:0;position:relative;display:grid;grid-template-columns:repeat(5,1fr);height:34px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-3);cursor:pointer;touch-action:none;user-select:none;overflow:visible}
.sky-seg:first-child{border-radius:999px 0 0 999px;box-shadow:inset 1px 1px 0 #0F275226,inset 0 -1px 0 #0F275226}
.sky-seg:nth-child(5){border-radius:0 999px 999px 0}
.sky-ring{position:absolute;top:50%;left:calc((var(--pos) + .5) * 20%);width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:3px solid var(--text);box-shadow:0 0 0 2px var(--bg);transition:left .35s cubic-bezier(.3,1.3,.5,1);pointer-events:none}
.sky:focus-visible{outline:2px solid var(--acc-line);outline-offset:4px}
.sun-chips{display:flex;gap:8px;flex-wrap:wrap}
.sun-chip{all:unset;cursor:pointer;position:relative;width:44px;height:28px;border-radius:44px 44px 4px 4px;background:var(--c1);box-shadow:inset 0 0 0 1px #0F275226;overflow:hidden}
.sun-chip::after{content:"";position:absolute;right:5px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--c2);box-shadow:-6px 4px 0 -2px var(--c2),-2px 9px 0 -2.5px var(--c2)}
.sun-chip[aria-checked="true"]{outline:3px solid var(--text);outline-offset:2px}
.sun-chip:focus-visible{outline:3px solid var(--acc-line);outline-offset:3px}
.studio .sun-cap{display:block;margin:0;font:500 12px/1.4 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text)}
.studio #sun-name::before{content:none}
.st-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.keep{all:unset;cursor:pointer;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;padding:11px 14px;border-radius:8px;background:var(--acc);color:var(--on-acc)}
.keep[aria-pressed="true"]{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--line-3)}
.keep:focus-visible,.reset:focus-visible{outline:2px solid var(--acc-line);outline-offset:2px}
.studio .shuffle{padding:10px 12px;font-size:12px;background:transparent}
.reset{all:unset;cursor:pointer;font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:8px 2px}
.reset:hover{color:var(--text)}
.st-msg{margin:0;font-size:13px;color:var(--text)}
.st-msg:empty{display:none}
.sun-hint{margin:8px 0 0;text-align:right;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text)}
.sun-hint::after{content:none}
/* layout: studio + sun stand on the hero's lower right */
@media (min-width:1001px){.hero-sun{width:400px}.hero .hero-sub,.hero .own,.hero-cta{max-width:min(560px,calc(100% - 440px))}}
@media (min-width:821px) and (max-width:1000px){.hero-sun{position:static;width:min(440px,100%);margin:48px 0 -80px auto}}
@media (max-width:820px){.hero-sun{width:min(420px,100%);margin:40px 0 -52px auto}.hero-sun .sun-btn{width:min(280px,72vw);align-self:flex-end}}
@media (max-width:1000px){.hero-sun{right:auto!important;bottom:auto!important;left:auto!important}}
@media (max-width:1000px){.hero-sun{width:100%!important}.hero-sun .sun-hint{text-align:right}}

/* ===== v12 TYPE SYSTEM: exactly 8 styles. Everything else inherits. =====
   1 Display XL  Archivo 800 / width 112, caps   hero h1
   2 Display L   Archivo 800 / width 112, caps   section h2
   3 Display M   Archivo 800 / width 112, caps   h3, numbers, open term name
   4 Title       Archivo 600, 19px               term names, card titles, steps, paths
   5 Lead        Archivo 400, 20px               intros under headlines
   6 Body        Archivo 400, 17px               reading text (16px on phones)
   7 Small       Archivo 400, 15px               descriptions, meta sentences, inputs
   8 Label       Jost 500, 12px, caps, .14em     labels, buttons, badges, counts, nav
   Weights: 400 and 600 for text, 800 for display. No italics. */
:root{--t-d1:clamp(2.5rem,6.2vw,4.4rem);--t-d2:clamp(1.75rem,3.6vw,2.6rem);--t-d3:1.375rem;--t-title:1.1875rem;--t-lead:1.25rem;--t-body:1.0625rem;--t-small:.9375rem;--t-label:.75rem}
@media (max-width:600px){:root{--t-d3:1.25rem;--t-title:1.125rem;--t-lead:1.125rem;--t-body:1rem;--t-small:.875rem}}
html[data-theme] body *{font-style:normal!important}
html[data-theme] body :is(.hero h1,.hero h1 em){font:800 var(--t-d1)/1.0 var(--display)!important;letter-spacing:.01em!important;text-transform:uppercase!important}
html[data-theme] body :is(.display,.display em,.display.sm){font:800 var(--t-d2)/1.05 var(--display)!important;letter-spacing:.02em!important;text-transform:uppercase!important}


html[data-theme] body :is(.hero-sub,.own-line,.own-line .own-intro,.t-body p.lead,.dict-sub,.build-sub,.closing){font:400 var(--t-lead)/1.55 var(--sans)!important;letter-spacing:0!important;text-transform:none!important}



html[data-theme] body :is(b,strong,.tl,.ext){font-weight:600!important;font-family:inherit!important;font-size:inherit!important;letter-spacing:inherit!important}
html[data-theme] body .lbl b{font-weight:500!important}
/* label inside a sentence keeps the sentence's case */
html[data-theme] body .seg button .cnt{opacity:.7}
html[data-theme] body .sticker b{font:800 11px/1 var(--display)!important;letter-spacing:.06em!important}
/* measure */



html[data-theme] body :is(.own-close em,.t-body em,.dialogue em){font-weight:600!important;font-family:inherit!important;font-size:inherit!important}

/* v12.1 hero grid: headline full width, text left, studio + sun right */
@media (min-width:1001px){
  .hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) 380px;column-gap:56px;align-items:start}
  .hero .wrap > *{grid-column:1}
  .hero .wrap > .byline{justify-self:start}
  .hero .wrap > h1{grid-column:1 / -1}
  .hero .hero-sun{grid-column:2;grid-row:3 / span 4;position:static!important;width:auto!important;align-self:end;margin:0 0 -80px}
  html[data-theme] body .hero :is(.hero-sub,.own,.hero-cta){max-width:none!important}
}
@media (max-width:560px){html[data-theme] body .seg button{letter-spacing:.06em!important;padding:0 6px}}
.hero .wrap > .hero-next{justify-self:start}
/* v12.2 fixes from user simulations */
.term,.sec{scroll-margin-top:200px}
@media (max-width:560px){.term,.sec{scroll-margin-top:80px}}
.results{padding-top:24px}
.results .term summary::before{display:none}
.sun-chip{height:36px;width:52px;border-radius:52px 52px 4px 4px}
.reset{padding:14px 4px}
.studio .keep,.studio .shuffle{min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center}
html[data-theme] .signup input:focus{border-color:var(--text);box-shadow:0 0 0 3px var(--acc-line)}
.toolbar .tb-in{min-height:44px}

/* ===== v13: calmer type scale (fewer, clearly different sizes) + studio window ===== */
/* scale: label 12 · small 14 · body 17 · lead 22 · display 24 / L / XL. Title = body size, weight 600. */
:root{--t-small:.875rem;--t-body:1.0625rem;--t-lead:1.375rem;--t-title:1.0625rem;--t-d3:1.5rem}
@media (max-width:600px){:root{--t-small:.875rem;--t-body:1rem;--t-lead:1.1875rem;--t-title:1rem;--t-d3:1.3125rem}}
html[data-theme] body :is(.hero-sub,.own-line,.own-line .own-intro,.own-close,.t-body p.lead,.dict-sub,.build-sub,.closing){font:400 var(--t-lead)/1.45 var(--sans)!important;letter-spacing:-.005em!important;text-transform:none!important}
/* hero: one voice under the headline */
html[data-theme] .hero :is(.hero-sub,.own-line,.own-close){color:var(--text)!important;max-width:30ch;margin:0 0 20px}
html[data-theme] .hero .own{margin:0 0 40px}
html[data-theme] .hero .own-line b{font-weight:600!important}
@media (min-width:1001px){html[data-theme] .hero :is(.hero-sub,.own-line,.own-close){max-width:34ch}}
/* hero right column: just the sun */
@media (min-width:1001px){.hero .wrap{grid-template-columns:minmax(0,1fr) 420px}}
.hero{cursor:pointer}
.hero .wrap > *{cursor:auto}
.hero .sun-btn,.hero a,.hero button{cursor:pointer}
.sun-hint{text-align:right;margin:0 0 12px}
@media (max-width:1000px){.hero-sun{align-items:flex-end}.hero-sun .sun-btn{width:min(300px,76vw)}}
/* studio window */
.studio-dlg{border:0;padding:0;margin:72px max(16px,env(safe-area-inset-right,0px)) auto auto;width:min(380px,calc(100vw - 32px));background:transparent;color:var(--text);overflow:visible}
.studio-dlg::backdrop{background:transparent}
.studio-dlg .studio{background:var(--bg);border:1px solid var(--line-3);border-radius:8px;padding:20px 20px 16px;box-shadow:0 0 0 4px color-mix(in srgb,var(--bg) 70%,transparent)}
.st-top{display:flex;justify-content:space-between;align-items:center}
.st-close{all:unset;cursor:pointer;width:36px;height:36px;display:grid;place-items:center;border-radius:8px;color:var(--text);font-size:16px}
.st-close:hover{box-shadow:inset 0 0 0 1px var(--line-3)}
.st-close:focus-visible{outline:2px solid var(--acc-line)}
@media (max-width:600px){.studio-dlg{margin:auto 0 0 0;width:100vw;max-width:100vw}.studio-dlg .studio{border-radius:12px 12px 0 0;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}}
.pal-btn{cursor:pointer;background:transparent}
html[data-theme] body #main .own p.own-close{font:400 var(--t-lead)/1.45 var(--sans)!important;letter-spacing:-.005em!important}
html[data-theme] body .sec-head div p{font:400 var(--t-body)/1.6 var(--sans)!important;color:var(--muted)}
html[data-theme] body .st-close{font:400 16px/1 var(--sans)!important}
@media (min-width:1001px){.hero .wrap{grid-template-columns:minmax(0,1fr) 460px}}
html[data-theme] body .studio .shuffle span{margin-right:6px}

/* ===== v14 Friends of Aulory ===== */
.friends{padding:32px 0 80px}
.friends .display{margin:0 0 12px}
html[data-theme] body .friends-sub{font:400 var(--t-body)/1.6 var(--sans)!important;color:var(--muted);margin:0 0 32px;max-width:60ch}
.zorya{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);text-decoration:none;color:inherit;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;background:var(--surface)}
.zorya:hover{border-color:var(--text)}
.zorya:focus-visible{outline:2px solid var(--acc-line);outline-offset:3px}
.zorya-logo{display:grid;place-items:center;min-height:220px;padding:32px}
.zorya-logo img{width:min(100%,360px);height:auto;display:block}
.zorya-body{display:flex;flex-direction:column;gap:12px;padding:32px;justify-content:center}
html[data-theme] body .zorya-h{font:800 var(--t-d3)/1.2 var(--display)!important;letter-spacing:.03em!important;text-transform:uppercase;color:var(--text)}
html[data-theme] body .zorya-t{font:400 var(--t-body)/1.65 var(--sans)!important;color:var(--text);max-width:52ch}
html[data-theme] body .zorya-cta{align-self:flex-start;margin-top:8px;font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;padding:14px 16px;border-radius:8px;background:var(--acc);color:var(--on-acc)}
.friend-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.friend{display:grid;grid-template-rows:auto 1fr auto;text-decoration:none;color:inherit;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;background:var(--surface)}
.friend:hover{border-color:var(--text)}
.friend:focus-visible{outline:2px solid var(--acc-line);outline-offset:3px}
.friend-logo{display:grid;place-items:center;height:120px;padding:24px}
.friend-logo img{max-height:56px;max-width:80%;width:auto;height:auto;display:block}
html[data-theme] body .friend-txt{font:400 var(--t-small)/1.55 var(--sans)!important;color:var(--text);padding:20px 20px 8px}
html[data-theme] body .friend-go{font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;padding:8px 20px 20px;color:var(--text)}
@media (max-width:820px){.zorya{grid-template-columns:1fr}.zorya-logo{min-height:160px;padding:24px}.zorya-body{padding:24px}}
@media (max-width:560px){.friend-row{grid-template-columns:1fr}}
.friend-logo img{max-height:64px}
/* v14.1 footer: brand line + legal */
html[data-theme] .foot .foot-l a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
html[data-theme] .foot nav a{font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em;text-transform:uppercase}
.foot nav{display:flex;gap:20px;flex-wrap:wrap}
.friend.is-soon:hover{border-color:var(--line-2)}
.soon-pill{display:inline-block;padding:7px 10px;border-radius:999px;background:var(--acc);color:var(--on-acc)}
.friend-row:has(> .friend:only-child){grid-template-columns:1fr}
@media (min-width:821px){
  .friend:only-child{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:1fr auto}
  .friend:only-child .friend-logo{grid-row:1 / 3;height:auto;min-height:150px}
  html[data-theme] body .friend:only-child .friend-txt{padding:32px 32px 8px;align-self:end}
  html[data-theme] body .friend:only-child .friend-go{padding:8px 32px 32px}
}

/* v15 legal windows: Impressum + Datenschutz */
.legal-dlg{border:0;padding:0;margin:auto;width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 48px);background:transparent;color:var(--text);overflow:visible}
.legal-dlg::backdrop{background:color-mix(in srgb,var(--text) 45%,transparent)}
.legal-dlg .legal{background:var(--bg);border:1px solid var(--line-3);border-radius:8px;padding:24px 32px 32px;max-height:calc(100dvh - 48px);overflow-y:auto;overscroll-behavior:contain}
.legal-dlg .display{margin:8px 0 24px}
html[data-theme] body .legal-body h3{font:600 var(--t-body)/1.4 var(--sans)!important;color:var(--text);margin:24px 0 4px;letter-spacing:0;text-transform:none}
html[data-theme] body .legal-body p{font:400 var(--t-small)/1.65 var(--sans)!important;color:var(--text);margin:0 0 8px;max-width:64ch}
html[data-theme] body .legal-body p.legal-date{color:var(--muted)}
.legal-body a{color:inherit;font-weight:600;text-decoration:none}
@media (max-width:600px){.legal-dlg{width:100vw;max-width:100vw;margin:auto 0 0 0;max-height:92dvh}.legal-dlg .legal{border-radius:12px 12px 0 0;padding:20px 20px calc(28px + env(safe-area-inset-bottom,0px));max-height:92dvh}}
html[data-theme] body .legal-dlg h2.display{font-size:clamp(1.1rem,5vw,2rem)!important;line-height:1.1!important;overflow-wrap:anywhere}

/* v15.1 friends: one logo size, one button */
.zorya-logo,.friend-logo{min-height:0!important;height:160px!important;padding:24px!important;display:grid;place-items:center}
.zorya-logo{height:auto!important;min-height:160px!important}
.zorya-logo img,.friend-logo img{width:auto!important;height:auto!important;max-width:min(200px,80%)!important;max-height:64px!important;display:block}
html[data-theme] body .f-btn{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;padding:14px 16px;border-radius:8px;background:var(--acc);color:var(--on-acc);border:1px solid var(--acc);margin-top:0}
html[data-theme] body .zorya-cta.f-btn{margin-top:8px}
html[data-theme] body .f-btn.is-soon{background:transparent;color:var(--text);border-color:var(--line-3)}
html[data-theme] body .friend-go{padding:8px 20px 20px!important;letter-spacing:0!important}
.friend:hover .f-btn:not(.is-soon),.zorya:hover .f-btn{filter:brightness(.95)}
@media (max-width:820px){.zorya-logo{min-height:160px!important}}

/* v15.2 partner logos in the visitor's colours (shape as mask, colour from the theme) */
html[data-theme] .zorya-logo,html[data-theme] .friend-logo{background:var(--card)!important}
.logo-mark{display:block;width:min(200px,80%);height:64px;background:var(--card-ink);-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat}

/* v16 friends: three equal cards, one type scale */
.friend-row{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px;margin-top:0;align-items:stretch}
.friend{grid-template-rows:auto 1fr auto!important;grid-template-columns:none!important}
.friend .friend-logo{height:140px!important}
.friend-body{display:flex;flex-direction:column;gap:12px;padding:24px 24px 8px}
html[data-theme] body .friend-lbl{font:500 var(--t-label)/1.3 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;color:var(--muted)}
html[data-theme] body .friend-h{font:800 var(--t-d3)/1.2 var(--display)!important;font-stretch:112%;letter-spacing:.03em!important;text-transform:uppercase;color:var(--text)}
html[data-theme] body .friend-h em{font-style:normal;color:var(--em);background:none;padding:0}
html[data-theme] body .friend-txt{font:400 var(--t-small)/1.6 var(--sans)!important;color:var(--text);padding:0!important}
html[data-theme] body .friend-src{font:400 12px/1.5 var(--sans)!important;color:var(--faint)}
html[data-theme] body .friend-go{padding:16px 24px 24px!important}
@media (max-width:960px){.friend-row{grid-template-columns:minmax(0,1fr)!important}}
html[data-theme] body .micro a[data-legal]{color:inherit!important;text-decoration:none!important;font-weight:600;background:none!important;border:0!important}
html[data-theme] body .friend-h em{color:var(--em-surf,var(--em))}

/* ===== v17 studio "Horizon": the window is the sky; tap the sun, tap the sky ===== */
#studio.studio-dlg{width:min(400px,calc(100vw - 32px))}
#studio .studio.hz{display:flex;flex-direction:column;gap:0;padding:0;overflow:hidden;border-radius:16px;background:var(--bg);color:var(--text);border:1px solid var(--line-3);box-shadow:0 24px 48px -24px rgba(15,39,82,.45)}
#studio .st-top{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 0 24px}
#studio .st-top .lbl{margin:0;color:var(--text)}
#studio .st-close{width:44px;height:44px;border:0;border-radius:22px;background:var(--hover);color:var(--text);font-size:16px;cursor:pointer}
#studio .st-close:focus-visible{outline:2px solid var(--acc-line);outline-offset:2px}
html[data-theme] body #studio .studio-h{margin:12px 24px 0;font:800 clamp(26px,6vw,30px)/1.1 var(--display)!important;font-stretch:112%;letter-spacing:.02em!important;text-transform:uppercase!important;color:var(--text)}
html[data-theme] body #studio .studio-h em{font-style:normal;color:var(--em);background:none;padding:0}
html[data-theme] body #studio .st-sub{margin:10px 24px 0;font:400 var(--t-small)/1.55 var(--sans)!important;color:var(--muted);max-width:34ch}
#studio .st-stage{position:relative;height:190px;border-bottom:1px solid var(--line-3)}
#studio .st-sun{all:unset;cursor:pointer;position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:300px;height:150px;display:block;line-height:0}
#studio .st-sun svg{width:300px;height:150px;display:block}
#studio .st-sun:focus-visible{outline:3px solid var(--acc-line);outline-offset:4px;border-radius:150px 150px 0 0}
html[data-theme] body #studio .st-hint{position:absolute;left:24px;top:20px;font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;color:var(--em)}
#studio .st-foot{background:var(--tint);padding:16px 24px 20px;display:flex;flex-direction:column;gap:14px}
#studio .st-row{display:flex;justify-content:space-between;align-items:center;gap:12px;grid-template-columns:none}
html[data-theme] body #studio #sun-name,html[data-theme] body #studio .st-count{font:500 var(--t-label)/1.3 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;color:var(--text)}
html[data-theme] body #studio .st-count{color:var(--muted);white-space:nowrap}
#studio .st-skies{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
#studio .sky-btn{height:44px;border-radius:22px;border:1px solid color-mix(in srgb,var(--text) 22%,transparent);background:var(--c);cursor:pointer;padding:0}
#studio .sky-btn[aria-pressed="true"]{outline:2px solid var(--text);outline-offset:2px}
#studio .sky-btn:focus-visible{outline:3px solid var(--acc-line);outline-offset:2px}
#studio .st-actions{display:flex;gap:10px;flex-wrap:nowrap}
html[data-theme] body #studio .keep{flex:1 1 auto;justify-content:center;min-height:52px;border-radius:10px;background:var(--acc);color:var(--on-acc);box-shadow:none;font:500 13px/1 var(--label)!important;letter-spacing:.14em!important}
html[data-theme] body #studio .keep::before{content:"♥";margin-right:8px;letter-spacing:0}
html[data-theme] body #studio .keep[aria-pressed="true"]{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--line-3)}
html[data-theme] body #studio .shuffle{flex:0 0 52px;width:52px;min-height:52px;justify-content:center;padding:0;border-radius:10px;border:1px solid var(--line-3);background:transparent;color:var(--text);font-size:18px!important}
html[data-theme] body #studio .shuffle span{margin:0}
#studio .st-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:24px}
html[data-theme] body #studio .st-msg{margin:0;font:400 var(--t-small)/1.4 var(--sans)!important;color:var(--text)}
html[data-theme] body #studio .reset{all:unset;cursor:pointer;margin-left:auto;font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase;color:var(--muted);padding:12px 0}
@media (max-width:600px){#studio.studio-dlg{width:100vw;max-width:100vw}#studio .studio.hz{border-radius:16px 16px 0 0;border-bottom:0}#studio .st-foot{padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}#studio .st-stage{height:170px}}
/* v17.1 dialogs also work where showModal is unavailable (embedded previews): fixed, on top */
#studio.studio-dlg[open],.legal-dlg[open]{position:fixed;inset:0;z-index:2147483000;height:fit-content;max-height:calc(100dvh - 16px)}
.legal-dlg[open]{max-height:calc(100dvh - 48px)}
#studio .studio.hz{cursor:pointer}
#studio .st-foot{cursor:default}

/* ===== v18 original logo lockup: sun above, wordmark below ===== */
.brand.stack,.foot .brand-sm.stack{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;line-height:1}
.brand.stack svg{width:36px;height:18px;display:block}
html[data-theme] body .brand.stack .wm{font-size:14px;letter-spacing:.08em;padding-left:.08em}
.foot .brand-sm.stack svg{width:26px;height:13px;display:block}
html[data-theme] body .foot .brand-sm.stack .wm{font-size:11px;letter-spacing:.08em;padding-left:.08em}
.foot .brand-sm.stack{margin:0 12px 0 0;vertical-align:middle}
@media (max-width:600px){.brand.stack svg{width:32px;height:16px}html[data-theme] body .brand.stack .wm{font-size:13px}}

/* ===== v18 About: Sara cut out, standing in a soft sun halo, dissolving into the page ===== */
.about-sara.has-photo .about-in{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:center}
.portrait{position:relative;margin:0;aspect-ratio:1/1;display:flex;align-items:flex-end;justify-content:center;isolation:isolate}
.portrait .p-disc{position:absolute;left:6%;right:6%;top:2%;aspect-ratio:1/1;border-radius:50%;z-index:-1;background:var(--sun);-webkit-mask-image:linear-gradient(to bottom,#000 40%,transparent 90%);mask-image:linear-gradient(to bottom,#000 40%,transparent 90%)}
.portrait .p-img{display:block;width:100%;height:auto;border:0;border-radius:0;-webkit-mask-image:linear-gradient(to bottom,#000 58%,transparent 97%);mask-image:linear-gradient(to bottom,#000 58%,transparent 97%)}
@media (max-width:899px){
  .about-sara.has-photo .about-in{grid-template-columns:minmax(0,1fr);gap:0}
  .portrait{width:min(380px,88%);margin:0 0 12px}
}
/* v18.1 portrait a bit larger */
@media (min-width:900px){
  .about-sara.has-photo .about-in{grid-template-columns:minmax(0,11fr) minmax(0,12fr)}
  .portrait{max-width:540px;width:100%;justify-self:start}
}
.portrait .p-disc{left:9%;right:9%;top:4%}
.portrait .p-img{width:108%;max-width:none;margin:0 -4%}
.portrait .p-disc{display:none}
/* v18.2 byline: the same cut-out portrait, small, dissolving at the bottom */
.byline .by-cut{width:36px;height:36px;display:block;flex:none;margin:-4px 0 -4px -6px;-webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,#000 62%,transparent 100%)}
/* v18.3 logo proportions: bigger sun, smaller wordmark */
.brand.stack svg{width:50px;height:25px}
html[data-theme] body .brand.stack .wm{font-size:11px;letter-spacing:.1em;padding-left:.1em}
.brand.stack{gap:3px}
.foot .brand-sm.stack svg{width:38px;height:19px}
html[data-theme] body .foot .brand-sm.stack .wm{font-size:9px;letter-spacing:.1em;padding-left:.1em}
@media (max-width:600px){.brand.stack svg{width:44px;height:22px}html[data-theme] body .brand.stack .wm{font-size:10px}}
/* v18.4 footer lockup in the original proportions (wordmark = 0.7 x sun width, gap = 0.065 x sun width); header stays side by side */
.foot .brand-sm.stack{gap:6px;margin-right:20px}
.foot .brand-sm.stack svg{width:92px;height:46px}
html[data-theme] body .foot .brand-sm.stack .wm{font-size:12px;letter-spacing:.08em;padding-left:.08em}

/* ===== v19 hero "Horizont": big sun standing on the horizon, ground band below ===== */
.hz{position:relative}
.hz-sky{position:relative;cursor:pointer;padding-top:clamp(36px,6vw,72px);overflow:hidden}
.hz-top{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(18px,2.4vw,28px)}
.hz-top .byline{cursor:pointer}
html[data-theme] body .hz h1{margin:0;font:800 clamp(2.3rem,7.2vw,6.3rem)/.98 var(--display)!important;font-stretch:112%;letter-spacing:.01em!important;text-transform:uppercase;color:var(--text);text-wrap:balance}
html[data-theme] body .hz h1 em{font:inherit!important;font-style:normal;color:var(--em);background:none;padding:0}
.hz-stage{position:relative;width:min(1040px,94vw);margin:clamp(24px,4vw,52px) auto 0;line-height:0}
.hz-stage .sun-btn{all:unset;display:block;width:100%;cursor:pointer;line-height:0}
.hz-stage .sun-btn svg{display:block;width:100%;height:auto}
.hz-stage .sun-btn:focus-visible{outline:3px solid var(--acc-line);outline-offset:6px;border-radius:999px 999px 0 0}
html[data-theme] body .hz-stage .sun-hint{position:absolute;right:0;top:-6px;margin:0;line-height:1.3;color:var(--muted)}
@media (max-width:700px){html[data-theme] body .hz-stage .sun-hint{position:static;text-align:center;margin:0 0 12px}}
.hz-ground{background:var(--card);color:var(--card-ink);padding:clamp(40px,6vw,72px) 0 clamp(44px,6vw,80px)}
.hz-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start}
@media (max-width:900px){.hz-in{grid-template-columns:minmax(0,1fr)}}
html[data-theme] body .hz-ground :is(.hero-sub,.own-line,.own-line .own-intro,.own-close,.hero-sub strong,.own-line b,.own-close em,.eyebrow,.micro,.form-msg,.done,.hero-next,.hero-next b){color:var(--card-ink)!important;background:none!important}
html[data-theme] body .hz-ground :is(.hero-sub,.own-line,.own-close){margin:0 0 16px;max-width:36ch}
html[data-theme] body .hz-ground .own{margin:0}
html[data-theme] body .hz-ground :is(.eyebrow,.micro){opacity:.85}
html[data-theme] body .hz-ground .hero-cta{max-width:none;margin:0}
html[data-theme] body .hz-ground .signup input{background:color-mix(in srgb,var(--card-ink) 10%,var(--card))!important;border:1px solid color-mix(in srgb,var(--card-ink) 40%,var(--card))!important;color:var(--card-ink)!important}
html[data-theme] body .hz-ground .signup input::placeholder{color:color-mix(in srgb,var(--card-ink) 70%,var(--card))}
html[data-theme] body .hz-ground .signup input:focus{border-color:var(--card-ink)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--card-ink) 35%,transparent)!important}
html[data-theme] body .hz-ground .signup button{background:var(--card-btn)!important;color:var(--card-btn-ink)!important;border:0!important}
html[data-theme] body .hz-ground .hero-next{display:inline-flex;margin-top:32px;border:1px solid color-mix(in srgb,var(--card-ink) 40%,var(--card))!important}
html[data-theme] body .hz-ground .hn-tag{background:var(--card-btn)!important;color:var(--card-btn-ink)!important}
html[data-theme] body .hz-ground :is(a,button,input):focus-visible{outline:2px solid var(--card-ink);outline-offset:2px}
/* v19.1 hero fits the first screen better */
.hz-sky{padding-top:clamp(28px,4.5vw,56px)}
html[data-theme] body .hz h1{font-size:clamp(2.3rem,6vw,5.3rem)!important}
.hz-stage{width:min(880px,92vw);margin-top:clamp(20px,3vw,40px);display:flex;flex-direction:column}
@media (max-width:700px){html[data-theme] body .hz-stage .sun-hint{order:-1}}
/* only the painted half circle is the sun; its empty corners belong to the sky */
.hz-stage .sun-btn,#studio .st-sun{pointer-events:none}
.hz-stage .sun-btn svg g,#studio .st-sun svg g{pointer-events:auto;cursor:pointer}
/* v19.2 no horizon line: the sun dissolves into the sky, the text follows on the same sky */
.hz-stage .sun-btn svg{-webkit-mask-image:linear-gradient(to bottom,#000 40%,transparent 98%);mask-image:linear-gradient(to bottom,#000 40%,transparent 98%)}
.hz-ground{background:transparent!important;color:var(--text);padding-top:clamp(8px,2vw,24px)}
html[data-theme] body .hz-ground :is(.hero-sub,.own-line,.own-line .own-intro,.own-close,.hero-sub strong,.own-line b,.own-close em,.form-msg,.done,.hero-next,.hero-next b){color:var(--text)!important}
html[data-theme] body .hz-ground :is(.eyebrow,.micro){color:var(--muted)!important;opacity:1}
html[data-theme] body .hz-ground .signup input{background:var(--input)!important;border:1px solid var(--input-line)!important;color:var(--text)!important}
html[data-theme] body .hz-ground .signup input::placeholder{color:var(--faint)}
html[data-theme] body .hz-ground .signup input:focus{border-color:var(--text)!important;box-shadow:0 0 0 3px var(--acc-line)!important}
html[data-theme] body .hz-ground .signup button{background:var(--acc)!important;color:var(--on-acc)!important}
html[data-theme] body .hz-ground .hero-next{border:1px solid var(--line-2)!important}
html[data-theme] body .hz-ground .hn-tag{background:var(--acc)!important;color:var(--on-acc)!important}
html[data-theme] body .hz-ground :is(a,button,input):focus-visible{outline:2px solid var(--acc-line)}
html[data-theme] body #main .hz-ground :is(.eyebrow,.eyebrow span,.micro,.micro a){color:var(--muted)!important;opacity:1!important}
/* v20 hero final: claim, descriptor, sun, sign-up first, one short line, vocabulary */
html[data-theme] body .hz-tag{margin:0;font:400 var(--t-lead)/1.45 var(--sans)!important;color:var(--text);max-width:40ch}
.hz-in{display:flex!important;flex-direction:column;align-items:center;text-align:center;gap:28px}
html[data-theme] body .hz-ground .hero-cta{width:min(560px,100%);display:flex;flex-direction:column;align-items:center;gap:0}
html[data-theme] body .hz-ground .hero-cta .signup{width:100%}
html[data-theme] body .hz-ground .hero-sub{max-width:52ch!important;margin:0 auto!important}
html[data-theme] body .hz-ground .hero-next{margin-top:0}
@media (max-width:560px){html[data-theme] body .hz-ground .signup button{width:100%;justify-content:center}}

/* ===== v21 clean-ups: level bars, smaller "Start here", mobile menu ===== */
/* level: three small bars like a signal, filled up to the level */
html[data-theme] body .lv{display:inline-flex;align-items:flex-end;gap:2px;width:auto;height:11px;border:0;border-radius:0;background:none!important;flex:none}
html[data-theme] body .lv b{display:block;width:3px;border-radius:1px;background:currentColor;opacity:.22}
.lv b:nth-child(1){height:5px}.lv b:nth-child(2){height:8px}.lv b:nth-child(3){height:11px}
html[data-theme] body .lv-basic b:nth-child(1),html[data-theme] body .lv-intermediate b:nth-child(-n+2),html[data-theme] body .lv-advanced b{opacity:1}
/* level tag on terms: quiet text, no box */
html[data-theme] body .term .lvl{border:0!important;background:none!important;padding:0!important;gap:6px;color:var(--muted)!important}
/* "Start here": a small quiet mark instead of a framed badge */


/* mobile menu */
.menu-btn{display:none}
.mnav[hidden]{display:none}
@media (max-width:820px){
  .menu-btn{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--line-2);border-radius:8px;background:transparent;color:var(--text);cursor:pointer;padding:0}
  .menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:18px;height:2px;background:currentColor;border-radius:1px;position:relative;transition:transform .2s}
  .menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
  .menu-btn span::before{top:-6px}.menu-btn span::after{top:6px}
  .menu-btn[aria-expanded="true"] span{background:transparent}
  .menu-btn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
  .menu-btn:focus-visible{outline:2px solid var(--acc-line);outline-offset:2px}
  .mnav{border-top:1px solid var(--line);background:var(--bg)}
  .mnav .wrap{display:flex;flex-direction:column;padding-top:8px;padding-bottom:16px}
  html[data-theme] body .mnav a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text);font:500 13px/1 var(--label)!important;letter-spacing:.14em;text-transform:uppercase}
  html[data-theme] body .mnav a.mnav-cta{border-bottom:0;margin-top:16px;justify-content:center;border-radius:8px;background:var(--acc);color:var(--on-acc)}
  @media (prefers-reduced-motion:reduce){.menu-btn span::before,.menu-btn span::after{transition:none}}
}
#about-sara,#friends,#join,#vocabulary{scroll-margin-top:64px}
/* v22 links inside entries: clearly clickable (own colour + underline), no arrow icon */
html[data-theme] body :is(.t-body .tl,.t-body .ext,.legal-body a){color:var(--link)!important;text-decoration:underline!important;text-decoration-thickness:1.5px!important;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--link) 55%,transparent)!important;border:0!important;font-weight:600!important}
html[data-theme] body :is(.t-body .tl,.t-body .ext,.legal-body a):hover{text-decoration-color:var(--link)!important;text-decoration-thickness:2px!important}
html[data-theme] body :is(.t-body .tl,.t-body .ext):focus-visible{outline:2px solid var(--acc-line);outline-offset:2px;border-radius:2px}
/* v23 sign-up visible on the first screen: the form sits in the faded lower part of the sun */
.hz{--sunw:min(880px,92vw)}
@media (min-width:901px) and (max-height:820px){.hz{--sunw:min(760px,92vw)}}
.hz-stage{width:var(--sunw)!important}
.hz-stage .sun-btn svg{-webkit-mask-image:linear-gradient(to bottom,#000 28%,transparent 80%)!important;mask-image:linear-gradient(to bottom,#000 28%,transparent 80%)!important}
.hz-ground{position:relative;z-index:2;margin-top:calc(var(--sunw) * -.18);padding-top:0!important}
.hz-top{gap:clamp(14px,2vw,24px)}
.hz-stage{margin-top:clamp(12px,2.4vw,32px)!important}
@media (min-width:901px) and (max-height:740px){.hz{--sunw:min(640px,92vw)}.hz-sky{padding-top:20px!important}}
html[data-theme] body .hz-stage .sun-hint{position:static!important;order:-1;text-align:center;margin:0 0 10px!important}
html[data-theme] body .hz-stage .sun-hint{align-self:center!important;text-align:center!important;max-width:none!important}
/* v24 four friends: two by two */
@media (min-width:961px){.friend-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* ===== v25: progress bar plain, no Sonnenstaub ===== */


/* v26 personalisation: greeting, back to my colour, welcome pop-up */
.hello{margin:0 0 6px;font:500 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:8px 14px;border-radius:999px;border:1px solid currentColor;display:inline-block}
.mine-btn{margin-top:10px;font:500 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:10px 16px;border-radius:999px;border:1.5px solid currentColor;background:transparent;color:var(--text);cursor:pointer}
.mine-btn:focus-visible,.welcome-dlg button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.signup input.fn{flex:1 1 140px}
.welcome-dlg{border:0;border-radius:18px;max-width:min(420px,calc(100vw - 32px));padding:28px;background:var(--bg);color:var(--text);text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.28)}
.welcome-dlg::backdrop{background:rgba(15,39,82,.5)}
.welcome-dlg h2{margin:6px 0 10px;font-family:var(--display,inherit);font-weight:800;font-stretch:112%;text-transform:uppercase;font-size:28px;line-height:1.05;color:var(--em)}
.welcome-dlg p{margin:0 0 12px;font-size:16px}
.welcome-dlg .welcome-hint{font-size:14px;background:var(--tint);border-radius:10px;padding:12px}
.welcome-dlg button{margin-top:4px;height:48px;padding:0 22px;border-radius:8px;border:0;background:var(--volt);color:var(--on-volt);font:500 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.me-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin-bottom:6px}
.me-row:has(> :not([hidden])){min-height:32px}
.me-row .hello,.me-row .mine-btn{margin:0}
.mine-btn{padding:8px 14px}
.signup input[type=email]{flex-basis:180px}
.signup input.fn{flex:1 1 110px}
.hello[hidden],.mine-btn[hidden],#join[hidden]{display:none!important}

/* v27 side panel: menu button on every width, panel opens on the right below the header; the top bar stays as it is */
.menu-btn{display:inline-grid!important;place-items:center;width:44px;height:44px;border:1px solid var(--line-2);border-radius:8px;background:transparent;color:var(--text);cursor:pointer;padding:0;margin-left:6px}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:18px;height:2px;background:currentColor;border-radius:1px;position:relative;transition:transform .2s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
.menu-btn span::before{top:-6px}.menu-btn span::after{top:6px}
.menu-btn[aria-expanded="true"] span{background:transparent}
.menu-btn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.menu-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mnav{position:fixed;top:61px;right:0;bottom:0;width:min(340px,100vw);background:var(--bg);border-left:1px solid var(--line);border-top:1px solid var(--line);box-shadow:-18px 0 50px rgba(15,39,82,.14);overflow-y:auto;z-index:29;padding-right:env(safe-area-inset-right,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.mnav[hidden]{display:none}
.mnav-in{display:flex;flex-direction:column;padding:12px 20px 24px}
html[data-theme] body .mnav a,html[data-theme] body .mnav .mnav-colours{display:flex;align-items:center;gap:10px;min-height:50px;border:0;border-bottom:1px solid var(--line);background:none;text-decoration:none;color:var(--text);font:500 13px/1 var(--label)!important;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;text-align:left;padding:0;width:100%}
html[data-theme] body .mnav .mnav-sub a{min-height:42px;font:400 15px/1.2 var(--sans)!important;letter-spacing:0;text-transform:none;padding-left:4px}
.mnav-h{margin:16px 0 4px;font:500 11px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.mnav-sub{display:flex;flex-direction:column;margin-bottom:8px}
.mnav-dot{width:10px;height:10px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(15,39,82,.25)}
html[data-theme] body .mnav a.mnav-cta{border-bottom:0;margin-top:18px;justify-content:center;border-radius:8px;background:var(--volt);color:var(--on-volt)}
html[data-theme] body .mnav a:hover,html[data-theme] body .mnav .mnav-colours:hover{color:var(--em)}
@media (prefers-reduced-motion:no-preference){.mnav:not([hidden]){animation:mnavIn .22s ease-out}@keyframes mnavIn{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}}
/* v28 studio: personal link right after "keep" */
.st-own{display:grid;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.st-own-h{margin:0;font-size:15px;line-height:1.45}
.st-own .signup{max-width:none}
/* v29 hero fits the first screen on every device: compact on short screens, sun size set by fitHero() in app.js */
.me-row:not(:has(> :not([hidden]))){display:none}
.hz{--sunw:clamp(170px,calc((100svh - 600px) / .32),min(880px,92vw))}
.hz-stage{width:var(--sunw)!important}
@media (max-height:760px){
  .hz-sky{padding-top:14px!important}
  html[data-theme] body .hz .byline{display:none}
  html[data-theme] body .hz h1{font-size:clamp(2rem,min(6vw,8.5vh),5.3rem)!important}
  .hz-top{gap:10px!important}
  .hz-stage{margin-top:8px!important}
}
@media (max-width:560px){html[data-theme] body .hz-ground .signup :is(input,button){height:46px}}
/* v30 header: no wrapping labels; text links move into the side panel when space is short */
.top-nav :is(.nl,.pal-t,.top-cta,.lang a){white-space:nowrap}
@media (max-width:1360px){html[data-theme] body .top-nav .nl{display:none}}

/* v31 side panel on the LEFT, like Claude or Notion: docked from 900px, page shifts right; overlay on phones */
.top-left{display:flex;align-items:center;gap:12px}
.side-btn{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--line-2);border-radius:8px;background:transparent;color:var(--text);cursor:pointer;padding:0;flex:none}
.side-btn:hover{background:var(--tint)}
.side-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.side-btn .side-fill{opacity:0;transition:opacity .15s}
.side-btn[aria-expanded="true"] .side-fill{opacity:.9}
.menu-btn{display:none!important}
.mnav{left:0!important;right:auto!important;width:260px!important;border-left:0!important;border-right:1px solid var(--line);box-shadow:none!important;padding-left:env(safe-area-inset-left,0px);padding-right:0}
@media (max-width:899px){.mnav{width:min(300px,86vw)!important;box-shadow:18px 0 50px rgba(15,39,82,.18)!important}}
@media (prefers-reduced-motion:no-preference){.mnav:not([hidden]){animation:sideIn .2s ease-out!important}@keyframes sideIn{from{transform:translateX(-16px);opacity:0}to{transform:none;opacity:1}}}
@media (min-width:900px){
  html.side-open #main,html.side-open body>footer,html.side-open .foot,html.side-open footer{margin-left:260px}
  html.side-open .hz{--sunw:clamp(170px,calc((100svh - 600px) / .32),min(880px,calc((100vw - 260px) * .92)))}
  #main,footer{transition:margin-left .2s ease}
}
@media (prefers-reduced-motion:reduce){#main,footer{transition:none}}
html.side-open .tb-in{flex-wrap:wrap!important}html.side-open .result{white-space:nowrap}
@media (min-width:1200px){.side-btn{position:absolute;left:max(16px,env(safe-area-inset-left,0px));top:10px}}
html.side-open .top-nav .nl{display:none!important}

/* v32 first-visit guide, personalise first in the side panel, signal dots on sun and sky */
html[data-theme] body .mnav .mnav-top{border:1px solid var(--line-2)!important;border-radius:10px;padding:0 12px!important;margin:4px 0 10px;min-height:46px;background:var(--tint)!important}
.mnav-top .pal-dot{width:14px;height:14px;border-radius:50%;background:var(--sun,var(--volt));flex:none}
.ob-dlg{border:0;border-radius:20px;width:min(460px,calc(100vw - 32px));padding:26px 26px 18px;background:var(--bg);color:var(--text);box-shadow:0 28px 80px rgba(0,0,0,.3);display:grid;gap:10px}
.ob-dlg:not([open]){display:none}
.ob-dlg::backdrop{background:rgba(15,39,82,.35)}
.ob-dlg .eyebrow{margin:0;color:var(--muted)}
.ob-step{margin:0;font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.ob-dlg h2{margin:2px 0 0;font-family:var(--display);font-weight:800;font-stretch:112%;text-transform:uppercase;font-size:clamp(24px,5vw,30px);line-height:1.04;text-wrap:balance;color:var(--text)}
.ob-p{margin:0 0 6px;font-size:16px;line-height:1.5}
.ob-body{display:grid;gap:12px}
.ob-skies{display:flex;gap:8px;flex-wrap:wrap}
.ob-sky{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);cursor:pointer;padding:0}
.ob-sky[aria-pressed="true"]{outline:3px solid var(--text);outline-offset:2px}
.ob-row{display:flex;gap:8px;flex-wrap:wrap}
.ob-sun,.ob-ghost,.ob-cta{height:46px;padding:0 18px;border-radius:8px;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.ob-sun{border:0;background:var(--sun);color:var(--on-sel,var(--on-volt))}
.ob-ghost{border:1px solid var(--line-2);background:transparent;color:var(--text)}
.ob-foot{display:flex;justify-content:flex-end;margin-top:6px}
.ob-cta{border:0;background:var(--volt);color:var(--on-volt)}
.ob-form{display:grid;gap:8px}
.ob-form input{height:48px;padding:0 14px;border-radius:8px;border:1px solid var(--input-line);background:var(--input);color:var(--text);font:400 16px var(--sans)}
.ob-form .form-msg{margin:0;font-size:14px}
.ob-later{justify-self:center;background:none;border:0;color:var(--muted);font:400 14px var(--sans);text-decoration:underline;cursor:pointer;padding:8px}
.ob-dlg :is(button,input):focus-visible{outline:2px solid var(--text);outline-offset:2px}
.hz-stage{position:relative}
.sig{position:absolute;display:flex;align-items:center;gap:8px;pointer-events:none;z-index:3}
.sig i{width:14px;height:14px;border-radius:50%;background:var(--text);box-shadow:0 0 0 4px color-mix(in srgb,var(--bg) 70%,transparent)}
.sig b{font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;background:var(--bg);color:var(--text);padding:6px 9px;border-radius:999px;border:1px solid var(--line-2);white-space:nowrap}
.sig-sun{left:50%;top:58%;transform:translate(-7px,-7px)}
.sig-sky{left:2%;top:22%}
@media (max-width:600px){.sig-sky{left:0;top:6%}.sig b{font-size:10px;padding:5px 7px}}
html.played .sig{opacity:0;transition:opacity .4s}
@media (prefers-reduced-motion:no-preference){
  .sig i{animation:sigPulse 1.8s ease-out infinite}
  .sig-sky i{animation-delay:.9s}
  @keyframes sigPulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--text) 45%,transparent)}70%{box-shadow:0 0 0 16px transparent}100%{box-shadow:0 0 0 0 transparent}}
}
html[data-theme] body .sig b{font:500 11px/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase}
.sig-sun{top:36%}
.sig-sky{left:0;top:4%}
@media (max-width:600px){.sig-sun{top:40%}}
.ob-dlg::backdrop{background:rgba(15,39,82,.14)}
@media (max-width:600px){.sig-sky{top:19%}.sig-sun{top:46%}}
/* v33 guide step 1: sun choices above, the sun to tap, sky choices below */
.ob-swrow{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ob-swl{font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text)}
.ob-sws{display:flex;gap:6px;flex-wrap:wrap}
.ob-sw{width:30px;height:30px;border-radius:50%;border:1px solid color-mix(in srgb,var(--text) 30%,transparent);cursor:pointer;padding:0;position:relative}
.ob-sw::after{content:"";position:absolute;right:3px;bottom:3px;width:7px;height:7px;border-radius:50%;background:var(--dust,transparent)}
.ob-sw-sky::after{display:none}
.ob-sw[aria-pressed="true"]{outline:2px solid var(--text);outline-offset:2px}
.ob-stage{cursor:pointer;display:flex;justify-content:center;padding:6px 0 0;border-radius:12px}
.ob-sunbtn{background:none;border:0;padding:0;cursor:pointer;width:min(320px,100%);line-height:0}
.ob-sunbtn svg{width:100%;height:auto;display:block;-webkit-mask-image:linear-gradient(to bottom,#000 45%,transparent 100%);mask-image:linear-gradient(to bottom,#000 45%,transparent 100%)}
.ob-foot{justify-content:space-between!important;gap:8px;flex-wrap:wrap}
.ob-dlg{transition:background .25s,color .25s}
/* v34 side panel: Vokabular folds open like a page tree */
.mnav-grp{display:flex;align-items:center;border-bottom:1px solid var(--line)}
html[data-theme] body .mnav .mnav-grp a{border-bottom:0!important;flex:1}
.mnav-tog{width:36px;height:36px;display:grid;place-items:center;border:0;background:transparent;color:var(--text);border-radius:8px;cursor:pointer;flex:none}
.mnav-tog:hover{background:var(--tint)}
.mnav-tog:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.mnav-tog svg{transition:transform .18s}
.mnav-tog[aria-expanded="true"] svg{transform:rotate(90deg)}
.mnav-sub[hidden]{display:none!important}
.mnav-sub{margin:4px 0 8px;padding-left:10px;border-left:1px solid var(--line);margin-left:4px}
html[data-theme] body .mnav .mnav-sub a{border-bottom:0!important;min-height:38px;border-radius:6px;padding-left:8px}
html[data-theme] body .mnav .mnav-sub a:hover{background:var(--tint)}
@media (prefers-reduced-motion:reduce){.mnav-tog svg{transition:none}}
/* v35 personalise button: just the half sun, no ring */
.pal-dot{width:22px!important;height:11px!important;border-radius:11px 11px 0 0!important;background:var(--sun)!important;box-shadow:none!important;overflow:visible!important}
.pal-dot::after{display:none!important}
/* v36 jumps land instantly, no scroll animation */
html{scroll-behavior:auto!important}
/* v37 topics in the side panel: quiet numbers instead of colour dots (same 01 to 07 as the sections) */
.mnav-no{font:500 11px/1 var(--label);letter-spacing:.08em;color:var(--muted);min-width:20px;font-variant-numeric:tabular-nums}
html[data-theme] body .mnav .mnav-sub a{color:var(--muted)}
html[data-theme] body .mnav .mnav-sub a:hover{color:var(--text);background:var(--tint)}
html[data-theme] body .mnav .mnav-sub a:hover .mnav-no{color:var(--em)}
/* v38 guide on one screen: colours, then name, email and save */
.ob-dlg{max-height:calc(100dvh - 24px);overflow-y:auto;gap:8px}
.ob-surrow{display:flex;justify-content:flex-start}
.ob-surrow .ob-ghost{height:38px;font-size:11px}
.ob-sunbtn{width:min(260px,100%)}
.ob-formh{margin:6px 0 0;font-size:15px;line-height:1.45}
.ob-form{border-top:1px solid color-mix(in srgb,var(--text) 18%,transparent);padding-top:10px}
.ob-frow{display:flex;gap:8px;flex-wrap:wrap}
.ob-frow input{flex:1 1 150px;min-width:0}
.ob-form .ob-cta{width:100%;height:50px}
.ob-foot:empty{display:none}
@media (max-height:760px){.ob-dlg{padding:18px 18px 10px;gap:6px}.ob-dlg h2{font-size:22px}.ob-p{display:none}.ob-sunbtn{width:min(170px,100%)}.ob-sw{width:26px;height:26px}.ob-formh{font-size:13px}.ob-form input{height:44px}.ob-form .ob-cta{height:46px}.ob-later{padding:4px}}
html[data-theme] body .hz-stage .sun-hint.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:0!important;padding:0;border:0;white-space:nowrap}
.sig-sky{top:-2%!important}@media (max-width:600px){.sig-sky{top:-6%!important}}
/* v39 permalink next to share */
.t-tools .tpage{font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-decoration:none;margin-left:auto;margin-right:12px}
.t-tools .tpage:hover{color:var(--text);text-decoration:underline}

/* v40 hero: category label above the claim, lighter subline; Vokabular always in the top bar; Build with me goes to the closing card */
.hub-kicker{display:inline-flex;align-items:center;gap:10px;margin:0;font:500 13px/1 var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--text)}
.hub-sun{width:18px;height:9px;border-radius:9px 9px 0 0;background:var(--sun);flex:none}
html[data-theme] body .hz-ground .hero-sub{font-size:clamp(.98rem,1.4vw,1.08rem)!important;font-weight:300!important;line-height:1.6;opacity:.85;max-width:46ch!important}
html[data-theme] body .hz-ground .hero-sub strong{font-weight:500!important}
@media (max-width:1360px){html[data-theme] body .top-nav .nl.nl-vocab{display:inline-flex!important}}
html.side-open .top-nav .nl.nl-vocab{display:inline-flex!important}
@media (max-width:479px){html[data-theme] body .top-nav .nl.nl-vocab{display:none!important}}
html[data-theme] body .mnav a.mnav-cta:hover{color:var(--on-volt)!important;background:var(--volt-hover)}
.build{scroll-margin-top:72px}
html[data-theme] body #main .hz-ground p.hero-sub{font-size:clamp(.98rem,1.4vw,1.1rem)!important;font-weight:300!important;line-height:1.6!important}html[data-theme] body #main .hz-ground p.hero-sub strong{font-weight:500!important}
@media (max-width:479px){html[data-theme] body .top-nav .nl.nl-vocab{display:inline-flex!important;font-size:10.5px!important;letter-spacing:.1em!important;padding:0 2px}html[data-theme] body .top-in{gap:6px}}
@media (max-width:479px){html[data-theme] body .top .brand .wm{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
@media (max-width:339px){html[data-theme] body .top-nav .nl.nl-vocab{display:none!important}}
/* v41 About portrait: never cut at the screen edge; the image fades out softly at the sides and bottom */
.portrait .p-img{width:100%!important;margin:0!important;max-width:100%!important;
  -webkit-mask-image:linear-gradient(to bottom,#000 58%,transparent 97%),linear-gradient(to right,transparent 0,#000 8%,#000 92%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 58%,transparent 97%),linear-gradient(to right,transparent 0,#000 8%,#000 92%,transparent 100%)!important;
  -webkit-mask-composite:source-in;mask-composite:intersect}
@media (max-width:899px){.portrait{width:min(360px,100%)!important;margin:0 auto 12px!important}}
.about-sara{overflow:visible}
/* v42 guide close cross; hero breathes; signal dots fade one by one */
.ob-dlg{position:relative}
.ob-x{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:var(--text);font-size:18px;cursor:pointer;display:grid;place-items:center}
.ob-x:hover{background:color-mix(in srgb,var(--text) 10%,transparent)}
.ob-dlg .eyebrow{padding-right:44px}
.hub-kicker{font-size:clamp(13px,1.15vw,16px)!important;letter-spacing:.24em!important}
.hz-top{gap:0!important}
html[data-theme] body .hz .byline{margin-bottom:clamp(28px,4.5vh,52px)}
.me-row{margin-bottom:0}
.hub-kicker{margin-bottom:clamp(14px,2.2vh,22px)!important}
html[data-theme] body .hz-tag{margin-top:clamp(14px,2.4vh,26px)!important}
@media (max-height:760px){html[data-theme] body .hz .byline{margin-bottom:0}.hub-kicker{margin:6px 0 10px!important}html[data-theme] body .hz-tag{margin-top:10px!important}}
html.played .sig{opacity:1}
html.played-sun .sig-sun,html.played-sky .sig-sky{opacity:0;transition:opacity .4s}
/* v43 guide: always centred in the visible screen (also iPhone Safari), compact on phones, minimal tap hints */
.ob-dlg{position:fixed!important;inset:0!important;margin:auto!important;height:fit-content;max-height:calc(100dvh - 24px)}
.ob-stage{position:relative}
.ob-sig{position:absolute;display:flex;align-items:center;gap:6px;pointer-events:none;transition:opacity .35s}
.ob-sig i{width:10px;height:10px;border-radius:50%;background:var(--text);box-shadow:0 0 0 3px color-mix(in srgb,var(--bg) 70%,transparent)}
.ob-sig b{font:500 10px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--text);background:var(--bg);padding:4px 7px;border-radius:999px;border:1px solid color-mix(in srgb,var(--text) 22%,transparent);white-space:nowrap}
.ob-sig-sun{left:50%;top:48%;transform:translateX(-5px)}
.ob-sig-sky{left:0;top:4px}
.ob-sig.gone{opacity:0}
@media (prefers-reduced-motion:no-preference){.ob-sig i{animation:sigPulse 1.8s ease-out infinite}.ob-sig-sky i{animation-delay:.9s}}
@media (max-width:600px){
  .ob-dlg{width:calc(100vw - 20px)!important;padding:16px 16px 8px!important;gap:6px!important}
  .ob-dlg h2{font-size:21px!important;padding-right:30px}
  .ob-p{font-size:14px!important;line-height:1.4!important;margin:0!important}
  .ob-sunbtn{width:min(190px,100%)!important}
  .ob-sw{width:28px!important;height:28px!important}
  .ob-surrow .ob-ghost{height:34px}
  .ob-formh{font-size:13px!important;margin:2px 0 0!important}
  .ob-frow{flex-wrap:nowrap}.ob-frow input{flex:1 1 0!important;height:44px!important;font-size:16px}
  .ob-form .ob-cta{height:46px!important}
  .ob-later{padding:2px!important}
  .ob-x{top:6px;right:6px}
}
@media (max-width:600px) and (max-height:600px){.ob-p{display:none}.ob-sunbtn{width:min(150px,100%)!important}}
.ob-dlg{grid-template-columns:minmax(0,1fr)!important;box-sizing:border-box}
.ob-dlg>*,.ob-body>*,.ob-form>*{min-width:0}
.ob-frow input{min-width:0;width:100%}
html[data-theme] body .ob-sig b{font:500 10px/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase}
.ob-sig-sun{top:46%}

/* v44 "More is coming": chapter one, People to Follow teaser, Stay in the loop; quiet nudge after three terms */
.more{border-top:1px solid var(--line);padding:clamp(56px,9vw,104px) 0;scroll-margin-top:60px}
.more .eyebrow{margin:0 0 10px}
.more-lead{max-width:56ch;font-size:clamp(1rem,1.5vw,1.15rem);line-height:1.6;margin:14px 0 32px}
.people{border:1px solid var(--line-2);border-radius:16px;padding:clamp(20px,3vw,32px);background:var(--tint)}
.people-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.people-head h3{margin:0;font-family:var(--display);font-weight:800;font-stretch:112%;text-transform:uppercase;font-size:clamp(20px,2.4vw,26px)}
.soon{font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:var(--volt);color:var(--on-volt)}
.people-p{margin:10px 0 22px;max-width:60ch;line-height:1.6}
.pcats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:900px){.pcats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.pcats{grid-template-columns:minmax(0,1fr)}}
.pcat{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:16px;display:grid;gap:6px;align-content:start}
.pcat-n{margin:0;font:500 11px/1.2 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pcat-names{margin:0;font-size:15px;line-height:1.45}
.pcat-more{margin:0;font-size:13px;color:var(--muted)}
.loop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:center;margin-top:28px}
@media (max-width:800px){.loop{grid-template-columns:minmax(0,1fr)}}
.loop h3{margin:0 0 6px;font-family:var(--display);font-weight:800;font-stretch:112%;text-transform:uppercase;font-size:clamp(18px,2vw,22px)}
.loop p{margin:0;line-height:1.55}
.loop .signup{max-width:none}
.mnav-soon{font:500 9px/1 var(--label);letter-spacing:.12em;padding:4px 6px;border-radius:999px;background:var(--volt);color:var(--on-volt);margin-left:6px}
.nudge{position:fixed;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:40;width:min(360px,calc(100vw - 32px));background:var(--bg);color:var(--text);border:1px solid var(--line-2);border-radius:14px;box-shadow:0 18px 50px rgba(15,39,82,.22);padding:16px 16px 12px}
.nudge-x{position:absolute;top:6px;right:6px;width:34px;height:34px;border:0;border-radius:50%;background:transparent;color:var(--text);cursor:pointer;font-size:15px}
.nudge-h{margin:0 30px 4px 0;font-family:var(--display);font-weight:800;font-stretch:112%;text-transform:uppercase;font-size:18px}
.nudge-p{margin:0 0 10px;font-size:14px;line-height:1.45}
.nudge-f{display:flex;gap:6px;flex-wrap:wrap}
.nudge-f input{flex:1 1 150px;min-width:0;height:42px;padding:0 12px;border-radius:8px;border:1px solid var(--input-line);background:var(--input);color:var(--text);font:400 16px var(--sans)}
.nudge-f button{height:42px;padding:0 14px;border:0;border-radius:8px;background:var(--volt);color:var(--on-volt);font:500 11px/1 var(--label);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.nudge-f .form-msg{flex-basis:100%;margin:4px 0 0;font-size:13px}
@media (prefers-reduced-motion:no-preference){.nudge{animation:nudgeIn .3s ease-out}@keyframes nudgeIn{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}}
.pn-x{white-space:nowrap}
.next-up{margin:0 0 8px;font:500 11px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.loop h3 em{font-style:normal;color:var(--em)}
.loop h3{line-height:1.12!important;text-wrap:balance}

/* ===== Freunde von Aulory · Aus meiner Werkstatt (Startseite: Kurzfassung, /werkstatt/: eigene Seite) ===== */
/* lockup: the friend's logo, a plain "&", the Aulory main logo, always on Navy */
.ws-lockup{display:flex;align-items:center;justify-content:center;gap:14px;min-height:120px;padding:20px;border-radius:8px;background:#0F2752;color:#FBFCFA}
[data-theme="navy"] .ws-lockup{box-shadow:inset 0 0 0 1px var(--line-3)}
.ws-logo{display:block;width:var(--lw);height:var(--lh);max-width:100%;background:#FBFCFA;-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat}
.ws-amp{font:400 20px/1 Helvetica,Arial,sans-serif;color:#FBFCFA}
.ws-au{display:block;height:44px;width:auto}
.ws-lockup.big .ws-au{height:44px}

/* home: four lockups, linking to the workshop */
.ws-home .eyebrow{margin:0 0 10px}
.ws-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ws-tile{display:flex;flex-direction:column;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;background:var(--surface);color:var(--text);text-decoration:none}
.ws-tile:hover{border-color:var(--text)}
.ws-tile:focus-visible{outline:2px solid var(--acc-line);outline-offset:3px}
.ws-tile .ws-lockup{border-radius:0;min-height:112px;gap:10px;padding:16px}
.ws-tile-b{display:flex;flex-direction:column;gap:6px;padding:16px 18px 18px}
.ws-tile-n{display:flex;align-items:baseline;gap:10px;font:500 var(--t-label)/1.3 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ws-tile-n b{font:800 15px/1 var(--display);font-stretch:112%;letter-spacing:.04em;color:var(--em)}
.ws-tile-t{font:400 var(--t-small)/1.5 var(--sans)}
.ws-go{display:inline-flex;align-items:center;min-height:48px;margin-top:24px;padding:0 20px;border-radius:8px;background:var(--acc);color:var(--on-acc);text-decoration:none;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ws-go:hover{filter:brightness(.95)}
@media (max-width:960px){.ws-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.ws-tiles{grid-template-columns:minmax(0,1fr)}.ws-go{width:100%;justify-content:center}}

/* home: "More is coming" now points to the women list instead of keeping a second list */
.pcat-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px}
.pcat-tags span{font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;padding:8px 10px;border:1px solid var(--line-2);border-radius:999px;background:var(--bg);color:var(--muted)}
.ws-start{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;align-items:center;padding:18px 20px;border-radius:12px;background:var(--bg);border:1px solid var(--line);color:var(--text);text-decoration:none}
.ws-start:hover{border-color:var(--text)}
.ws-start-k{font:800 clamp(17px,2vw,20px)/1.2 var(--display);font-stretch:112%;letter-spacing:.02em;text-transform:uppercase}
.ws-start-p{grid-column:1;font:400 var(--t-small)/1.5 var(--sans);color:var(--muted)}
.ws-start-go{grid-column:2;grid-row:1 / 3;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;padding:14px 16px;border-radius:8px;background:var(--acc);color:var(--on-acc);white-space:nowrap}
@media (max-width:600px){.ws-start{grid-template-columns:minmax(0,1fr)}.ws-start-go{grid-column:1;grid-row:auto;justify-self:start;margin-top:8px}}

/* workshop page */
.ws-intro{padding:clamp(48px,8vw,88px) 0 24px}
.ws-intro .eyebrow{margin:0 0 14px}
.ws-intro .display{margin:0 0 20px}
.ws-lead{margin:0;max-width:680px;font:400 var(--t-lead)/1.55 var(--sans);color:var(--text)}
.ws-marker{display:flex;align-items:baseline;gap:14px;padding:40px 0 14px;border-bottom:1px solid var(--line)}
.ws-marker b{font:800 clamp(1.15rem,2.4vw,1.55rem)/1.2 var(--display);font-stretch:112%;letter-spacing:.04em;color:var(--em)}
.ws-marker.flat{border:0;padding:0}
.ws-marker .lbl{color:var(--muted)}
.ws-women{padding:clamp(40px,6vw,72px) 0 clamp(48px,7vw,80px);scroll-margin-top:64px}
.ws-stack{display:flex;flex-direction:column;gap:clamp(48px,7vw,72px)}
.ws-head{display:flex;flex-direction:column;gap:20px}
.ws-head .display{margin:0;max-width:1000px}
.display em,.ws-insp-h em,.ws-note-h em{font-style:normal;color:var(--em)}

.ws-invite{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:48px;align-items:end;background:#0F2752;color:#FBFCFA;border-radius:8px;padding:clamp(32px,6vw,64px) clamp(24px,5vw,56px)}
[data-theme="navy"] .ws-invite{box-shadow:inset 0 0 0 1px var(--line-3)}
.ws-invite-t{display:flex;flex-direction:column;gap:22px}
.ws-invite-t p{margin:0;max-width:600px;color:#FBFCFA}
.ws-invite-h{margin:0;font:800 clamp(1.5rem,3vw,2.3rem)/1.08 var(--display);font-stretch:112%;letter-spacing:.02em;text-transform:uppercase;color:#FBFCFA;text-wrap:balance}
.ws-invite-h em{font-style:normal;color:#E6DF6B}
.ws-invite-go{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.ws-invite .ws-lockup{padding:0;min-height:0;justify-content:flex-start;background:none;box-shadow:none}
.ws-invite-note{margin:0;font:400 var(--t-small)/1.5 var(--sans);color:#FBFCFA;opacity:.85}
.ws-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:8px;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;text-align:center}
.ws-btn.sun{background:var(--card-btn);color:var(--card-btn-ink)}
.ws-btn.navy{background:var(--card);color:var(--card-ink)}
.ws-btn:hover{filter:brightness(.95)}
.ws-tlink{color:inherit;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--acc-line)}
.ws-invite .ws-tlink{font-size:var(--t-small);color:#FBFCFA;text-decoration-color:#E6DF6B}
.ws-tlink.is-soon{text-decoration:none;opacity:.6;font:500 12px/1 var(--label);letter-spacing:.14em;text-transform:uppercase}

.ws-insp{display:flex;flex-direction:column;gap:24px;scroll-margin-top:64px}
.ws-insp .eyebrow{margin:0}
.ws-insp-h{margin:0;font:800 var(--t-d2)/1.06 var(--display);font-stretch:112%;letter-spacing:.02em;text-transform:uppercase}
.ws-seg{flex-wrap:wrap;align-self:flex-start;max-width:100%}
.ws-seg button{font:500 12px/1.3 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ws-seg .cnt{margin-left:2px}
.ws-groups{display:flex;flex-direction:column;gap:52px;margin-top:8px}
.ws-group[hidden]{display:none}
.ws-group{display:flex;flex-direction:column;gap:18px}
.ws-ghead{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.ws-ghead h4{margin:0;font:800 clamp(1.15rem,2.4vw,1.55rem)/1.2 var(--display);font-stretch:112%;letter-spacing:.04em;text-transform:uppercase;hyphens:auto}
.ws-ghead .lbl{color:var(--muted)}
.ws-people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ws-person{display:flex;flex-direction:column;gap:10px;padding:18px 20px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface);color:var(--text);text-decoration:none}
.ws-person:hover{border-color:var(--text)}
.ws-person:focus-visible{outline:2px solid var(--acc-line);outline-offset:3px}
.ws-pname{margin-top:4px;font:800 17px/1.2 var(--display);font-stretch:112%;letter-spacing:.02em;text-transform:uppercase}
.ws-pwhy{font:400 var(--t-small)/1.5 var(--sans)}
.ws-plink{margin-top:auto;padding-top:10px;font:600 14px/1.2 var(--sans);color:var(--muted)}

.ws-more{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:36px 40px;background:#E6DF6B;color:#0F2752;border-radius:8px}
[data-theme="zitrone"] .ws-more{box-shadow:inset 0 0 0 1px #0F2752}
.ws-more h3{margin:0 0 8px;font:800 clamp(1.5rem,3vw,2.2rem)/1.05 var(--display);font-stretch:112%;letter-spacing:.02em;text-transform:uppercase}
.ws-more p{margin:0;max-width:620px}

.ws-notes{padding:24px 0 clamp(56px,8vw,96px)}
.ws-note{display:grid;grid-template-columns:280px minmax(0,1fr);gap:40px;align-items:start;padding:40px 0;border-bottom:1px solid var(--line);scroll-margin-top:64px}
.ws-body{display:flex;flex-direction:column;gap:14px;min-width:0}
.ws-body p{margin:0}
.ws-note-h{margin:0;font:800 clamp(1.3rem,2.6vw,1.75rem)/1.15 var(--display);font-stretch:112%;letter-spacing:.02em;text-transform:uppercase}
.ws-sub{display:flex;flex-direction:column;gap:12px;padding-top:18px;margin-top:6px;border-top:1px solid var(--line)}
.ws-sub .lbl{color:var(--muted)}
.ws-sub h4{margin:0;font:800 clamp(1.05rem,2vw,1.25rem)/1.2 var(--display);font-stretch:112%;letter-spacing:.03em;text-transform:uppercase}
.ws-comp{display:grid;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.ws-comp > div{display:grid;grid-template-columns:44px 150px minmax(0,1fr);gap:12px;align-items:baseline;padding:12px 16px;border-top:1px solid var(--line);font:400 var(--t-small)/1.5 var(--sans)}
.ws-comp > div:first-child{border-top:0}
.ws-comp b{font:800 18px/1 var(--display);font-stretch:112%;color:var(--em)}
.ws-comp strong{font:500 12px/1.4 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ws-levels,.ws-steps{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font:400 var(--t-small)/1.5 var(--sans)}
.ws-step{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;font:500 11px/1 var(--label);letter-spacing:.12em;text-transform:uppercase}
.ws-step b{font:800 12px/1 var(--display);color:var(--em)}
.ws-quiet{font:400 var(--t-small)/1.55 var(--sans);color:var(--muted)}
.ws-gaps-l{padding-top:6px}
.ws-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ws-card{border:1px solid var(--line);border-radius:8px;padding:14px 16px;font:400 var(--t-small)/1.55 var(--sans);background:var(--surface)}
.ws-card strong{display:block;margin-bottom:6px;font:500 12px/1.4 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ws-card strong b{color:var(--em);margin-right:6px;font-family:var(--display);font-weight:800}
.ws-indep{margin:32px 0 0;font:400 var(--t-small)/1.55 var(--sans);color:var(--muted)}
#werkstatt{scroll-margin-top:64px}

@media (max-width:820px){
  .ws-invite,.ws-more{grid-template-columns:minmax(0,1fr)}
  .ws-invite{gap:28px}
  .ws-more{padding:28px 24px}
  .ws-btn{width:100%}
  .ws-people{grid-template-columns:minmax(0,1fr)}
  .ws-seg{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .ws-seg button{letter-spacing:.06em;padding:0 8px}
  .ws-note{grid-template-columns:minmax(0,1fr);gap:20px;padding:28px 0}
  .ws-note .ws-lockup{min-height:96px}
  .ws-cards{grid-template-columns:minmax(0,1fr)}
  .ws-comp > div{grid-template-columns:32px minmax(0,1fr)}
  .ws-comp > div span{grid-column:2}
}
@media (min-width:821px) and (max-width:1000px){.ws-people{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* the vocabulary toolbar moves .seg to the end on phones; the women filter stays under its heading */
.ws-seg{order:0!important;width:auto!important}
.ws-seg button{flex:none!important}
.pcats + .ws-start{margin-top:16px}
.more-lead{max-width:none}
/* women in AI: its own page */
.wo-page{padding-top:clamp(48px,8vw,88px)}
.wo-page .ws-head .eyebrow{margin:0}
/* women in AI: filter and sections in the vocabulary's look (topic cards, section headers, term-style names) */
.ws-insp .display{margin:0}
.ws-insp .topics-head{margin:8px 0 0}
.wo-topics{grid-template-columns:repeat(3,minmax(0,1fr))}
.ws-groups{gap:56px;margin-top:24px}
.ws-group{gap:20px;scroll-margin-top:72px}
.ws-group .sec-head{padding-bottom:18px}
html[data-theme] body .ws-pname{margin-top:0;font:600 var(--t-title)/1.35 var(--sans)!important;letter-spacing:0;text-transform:none}
html[data-theme] body .ws-pwhy{font:400 var(--t-small)/1.5 var(--sans)!important;color:var(--muted)}
.ws-person{border-radius:4px;background:var(--surface)}
@media (max-width:900px){.wo-topics{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* women in AI: each woman is a row like a term in the vocabulary (name, one line, link type, arrow) */
.wo-list{display:block}
.wo-row{display:grid;grid-template-columns:minmax(150px,250px) minmax(0,1fr) auto 22px;gap:6px 24px;align-items:baseline;padding:18px 6px;border-bottom:1px solid var(--line);border-radius:8px;color:var(--text);text-decoration:none;transition:background .15s}
.wo-row:hover{background:var(--hover)}
.wo-row:focus-visible{outline:2px solid var(--acc-line);outline-offset:2px}
.wo-row > *{min-width:0}
.wo-row .lvl{align-self:center}
.wo-go{align-self:center;justify-self:end;font-size:15px;color:var(--muted);transition:color .15s,transform .15s}
.wo-row:hover .wo-go{color:var(--text);transform:translate(2px,-2px)}
.ws-group{gap:8px}
@media (max-width:760px){.wo-row{grid-template-columns:minmax(0,1fr) auto 22px;gap:6px 12px}.wo-row .t-one{grid-column:1/-1;grid-row:2}}
.ws-person.wo-row{border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;padding:18px 6px}
.ws-person.wo-row:hover{border-color:var(--line);background:var(--hover)}
.ws-group .sec-head{grid-template-columns:auto 1fr}
/* lockups, tiles and the Zorya invitation follow the visitor's colours (same tokens as the "Build with me" card) */
html[data-theme] .ws-lockup,html[data-theme] .ws-invite{background:var(--card);color:var(--card-ink);--sun:var(--card-sun);--speck:var(--card-speck);box-shadow:none}
html[data-theme] .ws-logo{background:var(--card-ink)}
html[data-theme] .ws-amp{color:var(--card-ink)}
.ws-au{display:inline-flex;flex-direction:column;align-items:center;gap:4px;line-height:1}
.ws-au .sun{display:block;width:40px;height:20px}
html[data-theme] .ws-au .wm{font-size:8px;letter-spacing:.08em;color:var(--card-ink)}
.ws-lockup.big .ws-au .sun{width:46px;height:23px}
html[data-theme] .ws-lockup.big .ws-au .wm{font-size:9px}
html[data-theme] .ws-invite :is(.ws-invite-h,.ws-invite-t p,.ws-invite-note,.ws-tlink){color:var(--card-ink)}
html[data-theme] .ws-invite .ws-invite-h em{color:var(--card-em)}
html[data-theme] .ws-invite .ws-tlink{text-decoration-color:var(--card-em)}
html[data-theme] .ws-invite .ws-btn.sun{background:var(--card-btn);color:var(--card-btn-ink)}
html[data-theme] .ws-more{background:var(--acc);color:var(--on-acc);box-shadow:none}
html[data-theme] .ws-more .ws-btn.navy{background:var(--on-acc);color:var(--acc)}
/* home: overview of the vocabulary (what it is, where to start, topics, one way in) */
.vt .eyebrow{margin:0 0 10px}
.vt .dict-sub{max-width:62ch}
.vt-block{margin-top:clamp(32px,5vw,48px)}



.vt-topics .topic:focus-visible{outline:2px solid var(--acc-line);outline-offset:2px}



.vt-topics .topic{text-decoration:none}
.vt-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:clamp(28px,4vw,40px)}
.vt-cta .ws-go{margin-top:0}
html[data-theme] body .vt-note{margin:0;font:400 var(--t-small)/1.5 var(--sans);color:var(--muted);max-width:52ch}

html[data-theme] .vt-all::before{background:var(--acc)!important;border-color:var(--acc)!important}
html[data-theme] .vt-all :is(.tp-no,.tp-name,.tp-desc){color:var(--on-acc)!important}

/* ======================= Erde (v33): the hero sun becomes a calm earth; welcome window with free colours, view, air, fonts ======================= */
@font-face{font-family:Fraunces;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/fraunces-latin-opsz-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/instrument-sans-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:Syne;font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/syne-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:Unbounded;font-style:normal;font-weight:200 900;font-display:swap;src:url(../fonts/unbounded-latin-wght-normal.woff2) format("woff2")}
/* serif display faces have one weight: no faux bold */
html[data-font="editorial"] .hero h1,html[data-font="editorial"] .display,html[data-font="editorial"] .wm,html[data-font="editorial"] .ob-dlg h2{font-weight:400!important;letter-spacing:0}

/* hero: the earth sits where the sun was (2:1, half globe on the horizon) */
.hz-stage .earth-btn{pointer-events:auto!important;position:relative}
.hz-stage .earth-btn canvas.earth{display:block;width:100%;aspect-ratio:2/1;height:auto;-webkit-mask-image:linear-gradient(to bottom,#000 55%,transparent 98%);mask-image:linear-gradient(to bottom,#000 55%,transparent 98%)}
.hz-stage .earth-btn::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:overlay;opacity:.22;border-radius:50% 50% 0 0/100% 100% 0 0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.2 -.3'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>")}
.hz-stage .earth-btn::after{display:none!important}
.hz-stage .earth-btn:focus-visible{outline:3px solid var(--acc-line);outline-offset:6px;border-radius:999px 999px 0 0}
/* the earth is the hero's background: B "side" = text left, globe right; C "horizon" = text centred, flat arc along the bottom */
html[data-theme] body section.hz{position:relative;overflow:hidden;isolation:isolate}
html[data-theme] body section.hz .hz-sky{position:static!important;overflow:visible!important;pointer-events:none}
html[data-theme] body section.hz .hz-ground{position:relative;z-index:2;margin-top:0!important;background:transparent!important;pointer-events:none}
html[data-theme] body section.hz :is(.hz-top,.hz-in) > *{pointer-events:auto}
html[data-theme] body section.hz .hz-top{position:relative;z-index:2}
html[data-theme] body section.hz .hz-stage{position:absolute!important;inset:0!important;width:auto!important;margin:0!important;z-index:0;display:block!important}
html[data-theme] body section.hz .hz-stage .earth-btn{position:absolute!important;inset:0;width:100%;height:100%;display:block;pointer-events:auto!important;cursor:pointer}
html[data-theme] body section.hz .hz-stage canvas.earth{width:100%!important;height:100%!important;aspect-ratio:auto!important;-webkit-mask-image:none!important;mask-image:none!important}
html[data-theme] body section.hz .hz-stage .earth-btn:focus-visible{outline:3px solid var(--acc-line);outline-offset:-6px;border-radius:12px}
html[data-theme] body section.hz .hz-stage .sun-hint{display:none!important}
html[data-theme] body section.hz .sig{position:absolute!important;z-index:3}
/* C: horizon */
html:not([data-view="side"]) body section.hz{--arc:clamp(150px,21vw,300px);padding-bottom:calc(var(--arc) + 8px)}
html:not([data-view="side"]) body section.hz .hz-ground{padding-top:clamp(18px,2.6vw,32px)!important}
/* the arc fades softly into the page below: no hard edge where the hero ends */
html:not([data-view="side"]) body section.hz .hz-stage canvas.earth{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - var(--arc) * .62),transparent 100%)!important;mask-image:linear-gradient(to bottom,#000 calc(100% - var(--arc) * .62),transparent 100%)!important}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--arc:clamp(130px,36vw,200px)}}
/* B: side (from 901px; smaller screens use the horizon) */
@media (min-width:901px){
  html[data-view="side"] body section.hz{min-height:clamp(620px,50vw,800px);display:flex;flex-direction:column;justify-content:center;padding-block:clamp(24px,4vw,56px)}
  html[data-view="side"] body section.hz :is(.hz-top,.hz-in){align-items:flex-start!important;text-align:left!important}
  html[data-view="side"] body section.hz :is(.hz-top,.hz-in) > *{max-width:min(600px,48vw)!important}
  html[data-view="side"] body section.hz .hz-sky{padding-top:0!important}
  html[data-view="side"] body section.hz .hero h1,html[data-view="side"] body section.hz h1{font-size:clamp(48px,6.6vw,108px)!important;line-height:.95!important}
  html[data-view="side"] body section.hz h1 em{display:block}
  html[data-view="side"] body section.hz .hz-ground .hero-cta{width:min(540px,46vw)!important;align-items:flex-start!important}
  html[data-view="side"] body section.hz .hz-ground .hero-sub{margin:0!important;max-width:44ch!important}
  html[data-view="side"] body section.hz .hz-ground{padding-top:clamp(20px,3vw,36px)!important}
  html[data-view="side"] body section.hz .hz-stage canvas.earth{-webkit-mask-image:linear-gradient(to bottom,#000 76%,transparent 100%)!important;mask-image:linear-gradient(to bottom,#000 76%,transparent 100%)!important}
}
/* welcome window */
.ob-dlg.obx{width:min(500px,calc(100vw - 20px));padding:24px 24px 18px;gap:12px;max-height:calc(100dvh - 20px);overflow-y:auto;overscroll-behavior:contain}
.ob-dlg.obx h2{font-size:clamp(24px,6vw,32px);margin:0 0 4px}
.ob-dlg.obx .ob-body{gap:14px}
.obx-screen{padding:6px;border-radius:16px;background:var(--surface-2,var(--tint));border:1px solid var(--line)}
.obx-pv{position:relative;aspect-ratio:16/10;border-radius:11px;overflow:hidden;cursor:pointer;container-type:inline-size;color:#0F2752}
.obx-pv.dark{color:#FBFCFA}
.obx-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.obx-nav{position:absolute;top:4cqw;left:4.5cqw;right:4.5cqw;display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.obx-nav .obx-logo{display:flex;align-items:center;gap:1.4cqw;font-family:var(--display);font-weight:800;font-size:4cqw;text-transform:uppercase;letter-spacing:.05em}
.obx-nav .obx-logo i{width:4.4cqw;height:2.2cqw;border-radius:4cqw 4cqw 0 0;background:currentColor;opacity:.85;display:block}
.obx-nav span{display:flex;gap:1.6cqw}.obx-nav span i{width:7cqw;height:1.2cqw;border-radius:2cqw;background:currentColor;opacity:.22;display:block}
.obx-pin{position:absolute;z-index:2;display:flex;align-items:center;gap:8px;pointer-events:none;transform:translateY(-50%);transition:opacity .4s}
.obx-pin i{width:12px;height:12px;border-radius:50%;background:currentColor;box-shadow:0 0 0 6px color-mix(in srgb,currentColor 14%,transparent);flex:none}
.obx-pin .obx-pl{font:500 10.5px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:color-mix(in srgb,#fff 88%,transparent);color:#0F2752;border:1px solid rgba(15,39,82,.16);white-space:nowrap}
.obx-pv.dark .obx-pin .obx-pl{background:rgba(15,39,82,.6);color:#FBFCFA;border-color:rgba(251,252,250,.28)}
.obx-pin.gone{opacity:0}
.obx-ctl{display:grid;gap:6px}
.obx-row{display:grid;grid-template-columns:56px minmax(0,1fr);align-items:center;gap:8px}
.obx-lab{font:500 11px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--text)}
.obx-car{position:relative;min-width:0}
.obx-track{display:flex;gap:7px;overflow-x:auto;scroll-snap-type:x proximity;padding:5px;scrollbar-width:none;overscroll-behavior-x:contain;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%)}
.obx-track::-webkit-scrollbar{display:none}
.obx-sw{flex:none;width:32px;height:32px;border-radius:50%;border:0;padding:0;background:var(--c);cursor:pointer;position:relative;scroll-snap-align:center;box-shadow:inset 0 0 0 1px rgba(15,39,82,.18)}
.obx-sw[aria-pressed="true"]{box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--text)}
.obx-sp{position:absolute;right:4px;bottom:4px;width:7px;height:7px;border-radius:50%;background:color-mix(in srgb,var(--c) 60%,#0F2752)}
.obx-arr{display:none}
@media (hover:hover){.obx-arr{display:grid;place-items:center;position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:24px;height:24px;border-radius:50%;border:1px solid var(--line-2);background:var(--bg);color:var(--text);cursor:pointer;font-size:14px;line-height:1;padding:0}
  .obx-arr.l{left:-6px}.obx-arr.r{right:-6px}.obx-arr:disabled{opacity:0;pointer-events:none}}
.obx-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
@media (max-width:380px){.obx-opts{grid-template-columns:1fr}}
.obx-tog{display:flex;border:1px solid var(--line-2);border-radius:999px;padding:3px;min-width:0}
.obx-tog button{flex:1;min-width:0;border:0;background:none;color:var(--muted);border-radius:999px;padding:7px 6px;font:500 11px/1 var(--label);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.obx-tog button[aria-pressed="true"]{background:var(--text);color:var(--bg)}
.obx-tune{display:flex;align-items:center;gap:10px;margin-top:2px}
.obx-tune .obx-lab{width:56px;flex:none}
.obx-tune input{flex:1;min-width:0;accent-color:var(--text)}
.obx-chip{flex:none;border:1px solid var(--line-2);background:transparent;color:var(--text);border-radius:999px;padding:7px 11px;font:500 11px/1 var(--label);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.obx-chip[aria-checked="true"]{background:var(--text);color:var(--bg);border-color:var(--text)}
.obx-icon{width:30px;height:30px;padding:0;display:grid;place-items:center;font-size:13px;letter-spacing:0}
.obx-fonts{display:grid;gap:4px;border-top:1px solid var(--line);padding-top:12px}
.obx-fh{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.obx-fn{font-size:13px;color:var(--muted)}
.obx-fp{margin:0;font-size:13.5px;color:var(--muted)}
.obx-ftrack{gap:8px}
.obx-font{flex:none;scroll-snap-align:center;width:84px;display:grid;gap:3px;padding:7px 9px 6px;border:1px solid var(--line-2);border-radius:12px;background:transparent;color:var(--text);cursor:pointer;text-align:left}
.obx-font[aria-pressed="true"]{border-color:var(--text);box-shadow:inset 0 0 0 1.5px var(--text)}
.obx-aa{font-size:20px;line-height:1.05;font-family:var(--display);font-weight:700}
.obx-font .obx-fname{font:500 11px/1.2 var(--label);letter-spacing:.06em}
.obx-font[data-f="aulory"] .obx-aa{font-family:"Archivo Aulory",Archivo,sans-serif;font-weight:800}
.ob-dlg.obx .ob-form{border-top:1px solid var(--line);padding-top:12px}
.ob-dlg.obx .obx-save{background:var(--obx-save);color:var(--obx-save-ink);border:1.5px solid var(--obx-save);width:100%}
.ob-dlg.obx.obx-white .obx-save{border-color:#0F2752}
@media (prefers-reduced-motion:reduce){.obx-pin{transition:none}}

/* ======================= Farben (v34): free colours follow the earth everywhere ======================= */
html.free .sc{--sec:var(--fam-mid);--sec-ink:var(--text)}
html.free[data-theme] .vt-all::before{background:var(--sig)!important;border-color:var(--sig)!important}
html.free[data-theme] .vt-all :is(.tp-no,.tp-name,.tp-desc){color:var(--sig-ink)!important}
html.free[data-theme] .foot a{color:var(--foot-ink)!important;text-decoration:underline;text-decoration-color:var(--foot-link);text-underline-offset:4px}
html.free[data-theme] .build-card .eyebrow{color:var(--card-em)!important}
html.free[data-theme] .ws-more{background:var(--tint)!important;color:var(--text)!important;box-shadow:inset 0 0 0 1px var(--line-2)!important}


/* ======================= Kopfzeile, Hero, Gespräch (v35) ======================= */
/* header: every page of the side panel is in the bar, calm sentence-case links, two clear actions */
html[data-theme] body .top-nav{gap:clamp(10px,1.4vw,18px)}
html[data-theme] body .top-nav .nls{display:flex;align-items:center;gap:clamp(16px,2vw,30px);margin-right:clamp(4px,1.2vw,18px)}
html[data-theme] body .top-nav .nls .nl{display:inline-flex!important;align-items:baseline;gap:4px;position:relative;padding:8px 0;font:450 15px/1 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--text)!important;opacity:.78;text-decoration:none;transition:opacity .15s}
html[data-theme] body .top-nav .nls .nl:hover{opacity:1}
html[data-theme] body .top-nav .nls .nl[aria-current]{opacity:1}
html[data-theme] body .top-nav .nls .nl[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--acc)}
html[data-theme] body .top-nav .nl-soon{font:500 9.5px/1 var(--label);letter-spacing:.12em;text-transform:uppercase;opacity:.7;transform:translateY(-6px)}
/* personalise becomes a round colour dot; the label stays for screen readers */
html[data-theme] body .top-nav .pal-btn{width:36px;height:36px;padding:0;justify-content:center;border-radius:999px}
html[data-theme] body .top-nav .pal-btn .pal-t{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html[data-theme] body .top-nav :is(.top-call,.top-cta){display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:8px;font:500 var(--t-label)/1 var(--label)!important;letter-spacing:.14em!important;text-transform:uppercase!important;text-decoration:none;white-space:nowrap}
html[data-theme] body .top-nav .top-call{color:var(--text)!important;box-shadow:inset 0 0 0 1.5px var(--text);background:transparent}
html[data-theme] body .top-nav .top-call:hover{background:var(--tint)}
@media (max-width:1240px){html[data-theme] body .top-nav .nls .nl:nth-child(5){display:none!important}}
@media (max-width:1100px){html[data-theme] body .top-nav .top-call{display:none}html[data-theme] body .top-nav .nls{gap:18px}}
@media (max-width:960px){html[data-theme] body .top-nav .nls .nl:not(.nl-vocab){display:none!important}html[data-theme] body .top-nav .nls{margin-right:0}}
@media (max-width:479px){html[data-theme] body .top-nav .nls .nl.nl-vocab{font-size:13px!important}}
@media (max-width:339px){html[data-theme] body .top-nav .nls{display:none}}
html.side-open[data-theme] body .top-nav .nls .nl:not(.nl-vocab){display:none!important}
.mnav .mnav-call{display:block;text-align:center;margin-top:10px;padding:12px 14px;border-radius:8px;box-shadow:inset 0 0 0 1.5px var(--text);color:var(--text)!important;text-decoration:none;font:500 var(--t-label)/1 var(--label);letter-spacing:.14em;text-transform:uppercase}

/* hero: one line on top (hub · with Sara), headline, promise, then the one action sitting on the horizon */
html[data-theme] body section.hz .hub-line{display:inline-flex!important;align-items:center;gap:10px;margin:0 0 clamp(22px,4vh,40px)!important;padding:5px 16px 5px 6px!important;border:1px solid var(--line-2);border-radius:999px;text-decoration:none;color:var(--text)!important;background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(6px)}
html[data-theme] body section.hz .hub-line .hl-k{font:500 var(--t-label)/1 var(--label);letter-spacing:.18em;text-transform:uppercase}
html[data-theme] body section.hz .hub-line .hl-dot{opacity:.5}
html[data-theme] body section.hz .hub-line .hl-by{font:400 14px/1.2 var(--sans)}
html[data-theme] body section.hz .hub-line .hl-by b{font-weight:600}
html[data-theme] body section.hz .hub-line:hover{border-color:var(--text)}
@media (max-width:560px){html[data-theme] body section.hz .hub-line{flex-wrap:wrap;justify-content:center;row-gap:2px;border-radius:22px;padding:6px 14px!important;text-align:center}html[data-theme] body section.hz .hub-line .by-cut{display:none}html[data-theme] body section.hz .hub-line .hl-dot{display:none}html[data-theme] body section.hz .hub-line .hl-k{width:100%}}
html[data-theme] body section.hz .hz-sky{padding-top:clamp(28px,6vh,72px)!important}
html[data-theme] body section.hz .hz-tag{margin-top:clamp(14px,2.4vh,24px)!important}
html:not([data-view="side"]) body section.hz .hz-ground{padding-top:clamp(28px,5.5vh,60px)!important}
html[data-theme] body section.hz .hero-cta .eyebrow{margin-bottom:14px!important}
html[data-theme] body section.hz .hero-call{margin:14px 0 0;font:400 15px/1.4 var(--sans);color:var(--text)}
html[data-theme] body :is(.hero-call,.card-call) a{color:inherit;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;text-decoration-color:var(--acc)}
html[data-theme] body :is(.hero-call,.card-call) a:hover{text-decoration-thickness:2.5px}
@media (max-height:760px){html[data-theme] body section.hz .hz-sky{padding-top:22px!important}html[data-theme] body section.hz .hub-line{margin-bottom:18px!important}html:not([data-view="side"]) body section.hz .hz-ground{padding-top:24px!important}}
/* the promise moves out of the hero and gets its own quiet line */
html[data-theme] body .hz-after{padding:clamp(8px,2vw,24px) 0 clamp(40px,6vw,80px)}
html[data-theme] body .hz-after .hero-sub{margin:0 auto!important;max-width:40ch!important;text-align:center;font:400 clamp(1.15rem,2vw,1.5rem)/1.5 var(--sans)!important;color:var(--text)!important}
html[data-theme] body .hz-after .hero-sub strong{font-weight:600}
/* the build card and about: a second, quieter way in */
html[data-theme] body .build-card .card-call{position:relative;z-index:1;margin:18px 0 0;font:400 15px/1.4 var(--sans);color:var(--card-ink)!important}
html.free[data-theme] body .build-card .card-call a{text-decoration-color:var(--sig)}
html[data-theme] body .about-links{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:22px}
html[data-theme] body .about-links .li{margin:0!important}
html[data-theme] body .btn-call{display:inline-flex;align-items:center;height:46px;padding:0 20px;border-radius:8px;background:var(--acc);color:var(--on-acc)!important;text-decoration:none;font:500 var(--t-label)/1 var(--label);letter-spacing:.14em;text-transform:uppercase}
html[data-theme] body .btn-call:hover{box-shadow:inset 0 0 0 2px var(--on-acc)}
html[data-theme] body .foot .foot-call{font-weight:600}
/* the bar uses the full width so all links fit beside the logo */
html[data-theme] body header.top .wrap.top-in{max-width:1440px;width:100%;gap:16px}
@media (min-width:1200px){html[data-theme] body header.top .wrap.top-in{padding-left:72px;padding-right:24px}}
html[data-theme] body .top-nav .nls .nl{font-size:var(--t-label)!important}
@media (max-width:560px){html[data-theme] body .top-nav .nls{display:none!important}}
@media (max-width:1340px){html[data-theme] body .top-nav .nls .nl:nth-child(5){display:none!important}}
@media (max-width:1180px){html[data-theme] body .top-nav .top-call{display:none}}
@media (max-width:1060px){html[lang="de"][data-theme] body .top-nav .nls .nl:not(.nl-vocab){display:none!important}}
@media (max-width:1240px){html[lang="de"][data-theme] body .top-nav .top-call{display:none}}
@media (max-width:600px){.ws-start-go{white-space:normal;max-width:100%;line-height:1.3}}

/* v35 the sign-up sits inside the planet, at the bottom of the hero (Horizon view) */
html:not([data-view="side"]) body section.hz{--arc:clamp(250px,27vw,350px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--arc:clamp(280px,78vw,340px)}}
html:not([data-view="side"]) body section.hz .hz-stage canvas.earth{-webkit-mask-image:none!important;mask-image:none!important}
html:not([data-view="side"]) body section.hz .hz-ground{position:absolute!important;left:0;right:0;bottom:clamp(22px,3vw,40px);padding:0!important}

/* v36 "Your AI Learning Hub" stands on its own above the headline; face and name follow below as the byline */
html[data-theme] body section.hz .hub-kicker{margin:0;font:600 clamp(14px,1.5vw,19px)/1.2 var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--text)}
html[data-theme] body section.hz .hub-line.by-line{margin:clamp(2px,1vh,10px) 0 0!important}

/* v37 the planet fades slowly into the page below: no hard edge, the sign-up stays fully visible above the fade */
html:not([data-view="side"]) body section.hz{--fade:clamp(90px,9vw,130px);--arc:clamp(420px,42vw,540px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--fade:100px;--arc:clamp(430px,118vw,480px)}}
html:not([data-view="side"]) body section.hz .hz-stage canvas.earth{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - var(--fade) * 1.5),rgba(0,0,0,.75) calc(100% - var(--fade) * 1.05),rgba(0,0,0,.35) calc(100% - var(--fade) * .55),transparent 100%)!important;mask-image:linear-gradient(to bottom,#000 calc(100% - var(--fade) * 1.5),rgba(0,0,0,.75) calc(100% - var(--fade) * 1.05),rgba(0,0,0,.35) calc(100% - var(--fade) * .55),transparent 100%)!important}
html:not([data-view="side"]) body section.hz .hz-ground{bottom:calc(var(--fade) * 1.5 + 12px)}

/* v38 "Go AI-native ..." sits under the e-mail field inside the planet: the five things only you have become small pills */
html:not([data-view="side"]) body section.hz{--arc:clamp(450px,44vw,580px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--arc:clamp(470px,128vw,520px)}}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin:20px auto 0!important;max-width:44ch!important;text-align:center;font:400 clamp(15px,1.5vw,18px)/1.9 var(--sans)}

/* v39 the whole sign-up, with the AI-native line, is visible on the first screen: tighter headline block, shorter planet, the fade falls below the fold */
html[data-theme] body section.hz .hz-sky{padding-top:clamp(14px,2.2vw,30px)!important}
html[data-theme] body section.hz .hz-top{gap:clamp(8px,1.4vw,16px)!important}
html[data-theme] body section.hz h1{font-size:clamp(2.2rem,5vw,4.4rem)!important}
html:not([data-view="side"]) body section.hz{--fade:clamp(70px,6.5vw,100px);--arc:clamp(380px,32vw,440px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--fade:60px;--arc:clamp(450px,118vw,480px)}html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{font-size:14px;line-height:1.8;margin-top:14px!important}}

/* v40 more air: the sign-up sits deeper in the planet, more space between headline block, form and the AI-native line */
html:not([data-view="side"]) body section.hz{--arc:clamp(430px,36vw,500px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--arc:clamp(500px,132vw,540px)}}
html:not([data-view="side"]) body section.hz .hz-ground{bottom:calc(var(--fade) * 1.25 + 4px)}
html:not([data-view="side"]) body section.hz .hz-stage canvas.earth{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - var(--fade) * 1.25),rgba(0,0,0,.75) calc(100% - var(--fade) * .9),rgba(0,0,0,.35) calc(100% - var(--fade) * .45),transparent 100%)!important;mask-image:linear-gradient(to bottom,#000 calc(100% - var(--fade) * 1.25),rgba(0,0,0,.75) calc(100% - var(--fade) * .9),rgba(0,0,0,.35) calc(100% - var(--fade) * .45),transparent 100%)!important}
html[data-theme] body section.hz .hz-top{margin-bottom:clamp(18px,3vw,40px)}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .eyebrow{margin-bottom:14px!important}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:30px!important}
@media (max-width:720px){html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:22px!important}}

/* v41 deeper still: the sign-up moves further down the planet, more space above and inside it */
html:not([data-view="side"]) body section.hz{--arc:clamp(490px,41vw,560px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--arc:clamp(560px,145vw,600px)}}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .eyebrow{margin-bottom:18px!important}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:36px!important}
@media (max-width:720px){html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:26px!important}}

/* v42 the AI-native line is plain text again: no pills, no borders, at most two lines */
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{max-width:min(60ch,100%)!important;font-size:clamp(14px,1.45vw,17px);line-height:1.6}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub strong:not(:first-of-type){display:inline;padding:0;margin:0;border:0;border-radius:0;line-height:inherit;white-space:normal;font-weight:700}
@media (max-width:720px){html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{max-width:100%!important;font-size:13.5px;line-height:1.55}}

/* v43 more air above the first line: the headline block starts a little lower */
html[data-theme] body section.hz .hz-sky{padding-top:clamp(36px,4.5vw,64px)!important}

/* v44 a longer, softer transition: the planet fades out over almost twice the distance; the sign-up keeps its place */
html:not([data-view="side"]) body section.hz{--fade:clamp(130px,12vw,190px);--arc:clamp(565px,46vw,670px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--fade:110px;--arc:clamp(620px,160vw,665px)}}

/* v45 balance: the sign-up sits in the lower part of the first screen with room below it, the fade carries on beneath the fold */
html:not([data-view="side"]) body section.hz{--fade:clamp(120px,10.5vw,160px);--arc:clamp(430px,33vw,480px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--fade:90px;--arc:clamp(420px,108vw,450px)}}

/* v46 text on the planet follows the page text colour again (the planet is light under the sign-up); the tap hints keep clear of the sign-up */
html[data-theme]:not([data-view="side"]) body section.hz .sig-sun{top:auto!important;bottom:calc(var(--arc) - 34px)!important}
@media (max-width:600px){html[data-theme]:not([data-view="side"]) body section.hz .sig-sky{top:10px!important;left:8px!important}}

/* v47 header: the logo as in the original (half circle above, Aulory below), and beside it "Your AI Learning Hub" */
.brand-stk{display:inline-flex;flex-direction:column;align-items:center;gap:3px;line-height:1}
.brand-stk svg{width:40px;height:20px;display:block}
html[data-theme] body .brand-stk .wm{font-size:10px;letter-spacing:.14em;padding-left:.14em}
html[data-theme] body .brand-hub{font:500 11px/1.25 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-left:4px;padding-left:12px;border-left:1px solid var(--line-2);max-width:12ch}
@media (max-width:900px){.brand-hub{display:none!important}}

/* v48 menu "Book a call": label centred in the button, with room to both edges */
html[data-theme] body .mnav a.mnav-call{display:flex!important;justify-content:center!important;align-items:center;text-align:center!important;padding:14px 18px!important;border-bottom:0!important}

/* v49 the whole menu uses the text face (Archivo Text, normal case) instead of the tracked capitals */
html[data-theme] body .mnav :is(a,.mnav-colours,.mnav-tog){font:500 16px/1.2 var(--sans)!important;letter-spacing:0!important;text-transform:none!important}
html[data-theme] body .mnav a.mnav-call,html[data-theme] body .mnav a.mnav-cta{font:600 16px/1.2 var(--sans)!important}
html[data-theme] body .mnav .mnav-sub a{font:400 15px/1.2 var(--sans)!important}
html[data-theme] body .mnav .mnav-soon,html[data-theme] body .mnav .mnav-no{font:600 10px/1 var(--sans)!important;letter-spacing:.04em!important;text-transform:none!important}

/* v50 welcome window preview: the mock header reads "Your AI Learning Hub" instead of "Aulory" */
.obx-nav .obx-logo{font-weight:600;font-size:2.7cqw;letter-spacing:.1em;white-space:nowrap}
.obx-nav .obx-logo i{width:3.8cqw;height:1.9cqw}

/* v51 more air between the e-mail field and the AI-native line */
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:56px!important}
@media (max-width:720px){html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:42px!important}}

/* v53 the hints sit on the horizon line, never over the sign-up text */
html[data-theme]:not([data-view="side"]) body section.hz .sig-sun{top:auto!important;bottom:calc(var(--arc) + 6px)!important;left:auto!important;right:8%!important}
@media (max-width:600px){html[data-theme]:not([data-view="side"]) body section.hz .sig-sun{right:4%!important}}
html[data-theme] body .brand-hub{max-width:16ch!important}

/* v54 the AI-native line is back under the sign-up, at the very end, with air between the e-mail field and the text */
html:not([data-view="side"]) body section.hz{--arc:clamp(430px,33vw,480px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz{--arc:clamp(420px,108vw,450px)}}

/* v55 header: "Your AI Learning Hub" on one line where there is room */
@media (min-width:1200px){html[data-theme] body .brand-hub{max-width:none!important;white-space:nowrap}}

/* v56 the hero button sits under the e-mail field on every screen */
html[data-theme] body .hz-ground .hero-cta .signup{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important;max-width:min(440px,100%)!important;margin-left:auto!important;margin-right:auto!important}
html[data-theme] body .hz-ground .hero-cta .signup :is(input,button){width:100%!important;flex:none!important;height:50px;justify-content:center}

/* v57 the AI-native line sits a little lower, further from the button */
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:28px!important}
@media (max-width:720px){html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:60px!important}}
html:not([data-view="side"]) body section.hz .hz-ground{bottom:calc(var(--fade) * 1.25 - 20px)}

/* v58 the whole sign-up block, with the line under it, a little lower still */
html:not([data-view="side"]) body section.hz .hz-ground{bottom:calc(var(--fade) * 1.25 - 40px)}


/* v60 from the design file: bigger kicker, tighter tagline, horizon and sign-up lower, "OWN IT." on its own line on phones, Arial ampersand */
html[data-theme] body section.hz .hub-kicker{font-size:clamp(13px,1.4vw,20px)!important}
html[data-theme] body section.hz .hz-tag{margin-top:clamp(4px,.9vh,10px)!important}
html[data-theme] body section.hz .amp{font-family:Arial,Helvetica,sans-serif;font-weight:400;font-style:normal}
html:not([data-view="side"]) body section.hz{--arc:calc(clamp(576px,calc(33vw + 146px),626px) - var(--tuck,0px))}
@media (max-width:720px){
  html:not([data-view="side"]) body section.hz{--arc:clamp(550px,calc(108vw + 130px),580px)}
  html[data-theme] body section.hz h1 em{display:block}
}
html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:48px!important}
@media (max-width:720px){html[data-theme]:not([data-view="side"]) body #main section.hz .hz-ground .hero-sub{margin-top:64px!important}}
html:not([data-view="side"]) body section.hz .hz-ground{bottom:calc(var(--fade) * 1.25 - 34px)}
@media (max-width:720px){html:not([data-view="side"]) body section.hz .hz-ground{bottom:calc(var(--fade) * 1.25 - 50px)}}
/* Begriffe: alle Texte gleich (Textschrift, eine Größe, normal), nur die Titel (Why it matters for you, Own it, …) fett, ohne Trennlinie */
html[data-theme] body details.term:not(#x) .t-body.t-body :is(p,p.lead,.dialogue p,.origin-box p){font:400 var(--t-body)/1.7 var(--sans)!important;font-style:normal!important;letter-spacing:0!important;text-transform:none!important;color:var(--body)!important}
html[data-theme] body details.term:not(#x) .t-body.t-body h3.hsub{display:block!important;font:600 var(--t-title)/1.35 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--text)!important;margin:28px 0 8px}
html[data-theme] body details.term:not(#x) .t-body.t-body h3.hsub::after{content:none!important;display:none!important}
/* Das Zeichen & überall in der normalen Form (Arial/Helvetica), nur dieses eine Zeichen; Rest der Schrift bleibt */
@font-face{font-family:Amp;font-style:normal;font-weight:100 599;unicode-range:U+26;src:local("Arial"),local("ArialMT"),local("Helvetica"),local("Liberation Sans"),local("Roboto")}
@font-face{font-family:Amp;font-style:normal;font-weight:600 900;unicode-range:U+26;src:local("Arial Bold"),local("Arial-BoldMT"),local("Helvetica Bold"),local("Helvetica-Bold"),local("Liberation Sans Bold"),local("Roboto Bold")}
:root{--sans:Amp,"Archivo Text",Archivo,"Helvetica Neue",Arial,sans-serif;--label:Amp,Jost,Helvetica,Arial,sans-serif;--display:Amp,"Archivo Aulory",Archivo,"Helvetica Neue",Arial,sans-serif}

/* Simple bullet lists inside term texts (vocabulary expansion, 25.10.): same type as body text */
html[data-theme] body details.term:not(#x) .t-body.t-body ul.t-list,html[data-theme] body .t-body ul.t-list{margin:0 0 16px;padding-left:1.2em;list-style:disc;max-width:680px;box-sizing:border-box}
html[data-theme] body details.term:not(#x) .t-body.t-body ul.t-list li,html[data-theme] body .t-body ul.t-list li{font:400 var(--t-body)/1.7 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--body)!important;margin:0 0 6px}
html[data-theme] body .t-body ul.t-list li strong{font-weight:600;color:var(--text)}


/* ---- AI stack page (/ai-layers/): isometric stack, side panel, comparison table. Last layer, wins. ---- */
.ly{padding:clamp(28px,5vw,64px) 0 0}
.ly-wrap{display:flex;flex-direction:column;gap:clamp(28px,4vw,48px)}
.ly-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.ly-head>div{max-width:780px}
.ly-head .display{margin:8px 0 14px}
.ly-hint{display:inline-flex;align-items:center;gap:10px;margin:0;padding:10px 16px;border:1.5px solid var(--text);border-radius:999px;font:500 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.ly-hint span{width:10px;height:10px;border-radius:50%;background:var(--acc)}
.ly-stage{position:relative;scroll-margin-top:84px}
.ly-svg{display:block;width:100%;max-width:480px;height:auto;margin:0 auto}
.ly-lead{stroke:var(--line-3);stroke-width:1.5;stroke-dasharray:3 5}
.ly-brk{font:500 12px/1 var(--sans);letter-spacing:.22em;fill:var(--muted)}
.ly-slab{cursor:pointer;transition:transform .25s ease,opacity .25s ease}
.ly-slab.on{transform:translateY(-16px)}
.ly-slab.on .ly-top{stroke:var(--acc-line);stroke-width:4}
.ly-stage.open .ly-slab:not(.on){opacity:.45}
.ly-calls{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.ly-call{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:16px;width:100%;padding:10px 12px;border-radius:4px;cursor:pointer;color:var(--text)}
.ly-call:hover .ly-cn,.ly-call[aria-expanded="true"] .ly-cn{text-decoration:underline;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:4px}
.ly-call:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ly-ic{flex:none;width:52px;height:52px;border-radius:50%;border:1.5px solid var(--text);display:inline-flex;align-items:center;justify-content:center}
.ly-ic.big{width:60px;height:60px;background:var(--card)}
.ly-ct{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.ly-ct .lbl{font-size:11px}
.ly-cn{font:800 17px/1.15 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.02em}
.ly-cs{font-size:15px;line-height:1.4;color:var(--muted)}
.ly-drawer{margin-top:28px;display:flex;flex-direction:column;gap:20px}
.ly-panel{border:1px solid var(--line);border-radius:4px;background:var(--surface);padding:clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:24px}
.ly-panel:focus{outline:none}
.ly-ph{display:flex;align-items:flex-start;gap:16px}
.ly-ph>div{flex:1;min-width:0}
.ly-ph .lbl{margin:0;font-size:11px;color:var(--muted)}
.ly-h2{hyphens:auto;overflow-wrap:break-word;font:800 clamp(22px,2.6vw,27px)/1.08 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.02em;margin:4px 0}
.ly-pro{margin:0;font-size:14px;color:var(--muted)}
.ly-x{display:none;flex:none;width:44px;height:44px;border-radius:4px;border:2px solid var(--text);background:transparent;color:var(--text);font-size:18px;cursor:pointer}
.ly-js .ly-x{display:inline-flex;align-items:center;justify-content:center}
.ly-panel section{display:flex;flex-direction:column;gap:10px}
.ly-panel h3.lbl{margin:0;font-size:12px;color:var(--muted)}
.ly-panel p{margin:0;font-size:16px;line-height:1.7}
.ly-panel .ly-lead-p{font-size:17px}
.ly-part{display:flex;flex-direction:column;gap:6px}
.ly-part .ly-pl{font-size:14px;font-weight:600;line-height:1.3}
.ly-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.ly-tags li{padding:5px 12px;border-radius:999px;border:1.5px solid var(--line-3);background:var(--bg);font-size:14px;line-height:1.35}
.ly-ex{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ly-ex li{padding-left:14px;border-left:2px solid var(--zitrone);font-size:15px;line-height:1.6}
.ly-facts{list-style:none;margin:0;padding:0}
.ly-facts li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:4px 16px;padding:12px 0;border-top:1px solid var(--line)}
.ly-fv{font:800 17px/1.2 var(--display);font-stretch:112%;text-transform:uppercase}
.ly-ft{display:flex;flex-direction:column;gap:4px;font-size:15px;line-height:1.5}
.ly-fs{font-size:13px;color:var(--muted)}
.ly-voices{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.55}
.ly-voices a{font-weight:700}
.ly a{color:var(--text);text-decoration:underline;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:3px}
.ly a:hover{color:var(--accent)}
.ly-terms{display:flex;flex-wrap:wrap;gap:8px}
.ly a.ly-term{display:inline-flex;padding:7px 12px;border-radius:4px;border:1.5px solid var(--text);background:var(--bg);font-size:14px;font-weight:600}
.ly-tn{font-size:14px;font-weight:600;text-decoration:underline;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:3px}
.ly-ta{font-size:11.5px;color:var(--muted)}
.ly-pn{display:none;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ly-js .ly-pn{display:flex}
.ly-btn{height:44px;padding:0 18px;border-radius:4px;border:2px solid var(--text);background:var(--text);color:var(--bg);font:800 12px/1 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}
.ly-btn.ghost{background:transparent;color:var(--text)}
/* with script: panels only show when a layer is chosen */
.ly-js .ly-drawer{display:none}
.ly-js .ly-panel{display:none}
.ly-js .ly-panel.on{display:flex}
.ly-js .ly-stage.open .ly-drawer{display:block}
@media (min-width:1000px){
  .ly-stage{display:grid;grid-template-columns:560px minmax(0,1fr);align-items:start}
  .ly-svg{width:560px;max-width:none;height:800px;margin:0}
  .ly-side{position:relative;height:800px}
  .ly-calls{position:relative;height:800px;margin:0;display:block}
  .ly-calls li{position:absolute;left:0;right:0;top:var(--top)}
  .ly-call{padding:0 8px}
  .ly-cs{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ly-drawer{margin:0}
  .ly-js .ly-stage.open .ly-calls{visibility:hidden}
  .ly-js .ly-stage.open .ly-drawer{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain}
  .ly-js .ly-panel{min-height:100%;box-sizing:border-box}
}
@media (max-width:999px){
  .ly-js .ly-stage.open .ly-drawer{position:fixed;inset:0;z-index:300;overflow-y:auto;background:var(--bg);padding:12px;margin:0;overscroll-behavior:contain}
  html.ly-lock,html.ly-lock body{overflow:hidden}
}
.ly-own{margin:0;max-width:900px;font-size:15px;line-height:1.65;color:var(--muted)}
.ly-cmp{display:flex;flex-direction:column;gap:12px}
.ly-cmp .display{margin:0}
.ly-cmp-p{margin:0 0 8px;max-width:820px;font-size:17px;line-height:1.65}
.ly-tw{overflow-x:auto;border-top:2px solid var(--text)}
.ly-table{width:100%;min-width:880px;border-collapse:separate;border-spacing:4px 0;table-layout:fixed}
.ly-table th,.ly-table td{padding:8px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.ly-table thead th{font:500 10.5px/1.3 var(--sans);letter-spacing:.08em;hyphens:auto;overflow-wrap:anywhere;text-transform:uppercase;color:var(--muted);text-align:center}
.ly-table thead th:first-child,.ly-table tbody th{text-align:left;width:180px}
.ly-table tbody th{display:table-cell;font-weight:400}
.ly-table tbody th a,.ly-table tbody th b{display:block;font-size:15px;font-weight:700}
.ly-table tbody th span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.ly-seg{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:6px 8px;border-radius:4px;background:var(--sig);color:var(--sig-ink);font-size:13px;font-weight:600;line-height:1.25;hyphens:auto;overflow-wrap:anywhere}
.ly-seg.ours{background:var(--card);color:var(--card-ink)}
.ly-note{margin:0;max-width:900px;font-size:14px;line-height:1.65;color:var(--muted)}
.ly-law{display:flex;flex-wrap:wrap;gap:24px;padding:32px;border-radius:4px;background:var(--card);color:var(--card-ink)}
.ly-law>div{flex:1 1 280px;display:flex;flex-direction:column;gap:8px}
.ly-law .lbl{margin:0;color:var(--card-em)}
.ly-law .ly-h2{font-size:22px;margin:0}
.ly-law p{margin:0;font-size:15px;line-height:1.6;color:var(--card-ink)}
.ly-law ul{flex:2 1 480px;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 24px;font-size:15px;line-height:1.5}
.ly-law b{color:var(--card-em);margin-right:6px}
.ly-end{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;padding-bottom:16px}
/* top bar order (Sara, 25.10.): AI Vocabulary, AI Stack, Women in AI, What else I'm building, People to Follow, About.
   When space runs out, the hub tagline goes first, then the call button, then "People to Follow" (all stay in the side menu). */
@media (max-width:1599px){html[data-theme] body .top .brand-hub{display:none}}
@media (max-width:1180px){html[data-theme] body .top-nav .top-call{display:none}}

/* ---- AI stack: short card, linked terms with explanation on tap, one page per layer (/ai-layers/<id>/) ---- */
.ly-panel.ly-card{gap:18px}
.ly-js .ly-panel.ly-card{min-height:0}
.ly-short{margin:0;font-size:17px!important;line-height:1.75!important}
.ly-hint-terms{margin:0;font-size:13px!important;color:var(--muted)}
.ly a.ly-tl,.lp a.ly-tl{color:var(--text);text-decoration:underline;text-decoration-style:dotted;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:4px;cursor:help}
.ly a.ly-tl:hover,.lp a.ly-tl:hover{text-decoration-style:solid}
.ly a.ly-more{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-radius:4px;background:var(--card);color:var(--card-ink);text-decoration:none}
.ly a.ly-more:hover{background:color-mix(in srgb,var(--card) 80%,var(--card-ink))}
.ly a.ly-more:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.ly-more-t{display:flex;flex-direction:column;gap:4px}
.ly-more-h{font:800 15px/1.2 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.04em;color:var(--card-em)}
.ly-more-s{font-size:14px;line-height:1.45;color:var(--card-ink)}
.ly-more-a{flex:none;width:44px;height:44px;border-radius:50%;background:var(--card-btn);color:var(--card-btn-ink);display:inline-flex;align-items:center;justify-content:center;font-size:20px;font-weight:700}
.ly-pop{position:absolute;z-index:400;max-width:340px;padding:16px 18px;border-radius:4px;background:var(--bg);color:var(--text);border:1.5px solid var(--text);box-shadow:none;display:flex;flex-direction:column;gap:8px}
.ly-pop[hidden]{display:none}
.ly-pop .ly-pop-n{font:800 15px/1.2 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.03em;margin:0}
.ly-pop p{margin:0;font-size:15px;line-height:1.55}
.ly-pop a{color:var(--text);font-weight:600;text-decoration:underline;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:3px}
.ly-pop-x{position:absolute;top:6px;right:6px;width:32px;height:32px;border:0;background:transparent;color:var(--text);font-size:15px;cursor:pointer}
@media (max-width:640px){.ly-pop{position:fixed;left:12px!important;right:12px;top:auto!important;bottom:12px;max-width:none}}
/* layer page */
.lp{padding:clamp(20px,4vw,40px) 0 48px}
.lp-wrap{display:flex;flex-direction:column;gap:28px}
.lp-crumbs{font-size:14px;color:var(--muted)}
.lp-crumbs a{color:var(--muted);text-decoration:underline;text-decoration-color:var(--acc-line);text-underline-offset:3px}
.lp-head{display:flex;gap:20px;align-items:flex-start}
.lp-head>div{max-width:820px}
.lp-head .display{margin:6px 0 10px}
.lp-pro{margin:0 0 14px;font-size:14px;color:var(--muted)}
.lp-lead{margin:0}
.lp-grid{display:grid;grid-template-columns:1fr;gap:32px}
@media (min-width:1000px){.lp-grid{grid-template-columns:230px minmax(0,1fr);gap:48px}.lp-side{position:sticky;top:88px;align-self:start;max-height:calc(100vh - 110px);overflow:auto}}
.lp-side .lbl{margin:0 0 10px;font-size:11px;color:var(--muted)}
.lp-nav,.lp-toc{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-direction:column;gap:4px}
.lp-nav a{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:4px;color:var(--text);text-decoration:none;font-size:14px}
.lp-nav a:hover{background:var(--hover)}
.lp-nav a[aria-current="page"]{background:var(--surface);outline:1.5px solid var(--text);font-weight:700}
.lp-ni{flex:none;width:28px;height:28px;border-radius:50%;background:var(--c);display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--text)}
.lp-toc a{display:block;padding:4px 8px;font-size:14px;color:var(--muted);text-decoration:none;border-left:2px solid var(--line)}
.lp-toc a:hover{color:var(--text);border-left-color:var(--acc-line)}
@media (max-width:999px){.lp-side{display:none}}
.lp-body{display:flex;flex-direction:column;gap:44px;min-width:0;max-width:760px}
.lp-sec{display:flex;flex-direction:column;gap:14px;scroll-margin-top:90px}
.lp-h2{font:800 clamp(21px,2.4vw,26px)/1.15 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.02em;margin:0;hyphens:auto}
.lp-sec p{margin:0;font-size:17px;line-height:1.75}
.lp-points,.lp-steps,.lp-myths,.lp-voices,.lp-terms,.lp-sources{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.lp-points li{font-size:16px;line-height:1.7;padding-left:14px;border-left:2px solid var(--acc-line)}
.lp-steps li{display:flex;gap:14px;font-size:16px;line-height:1.7}
.lp-step-n{flex:none;font:800 14px/1.9 var(--display);font-stretch:112%;color:var(--muted)}
.lp-note{font-size:14px!important;color:var(--muted)}
.lp-parts{display:flex;flex-direction:column;gap:12px}
.lp-table{width:100%;min-width:640px;border-collapse:collapse;font-size:14.5px;line-height:1.5}
.lp-table th,.lp-table td{padding:10px 12px 10px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.lp-table thead th{font:500 11px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.lp-table tbody th{font-weight:700;width:140px}
.lp-myths li{padding:16px 18px;border-radius:4px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.lp-myth{font-weight:700;text-decoration:line-through;text-decoration-color:var(--acc-line);text-decoration-thickness:2px}
.lp-voices{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.lp-voice{padding:18px 20px;border-radius:4px;border:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;gap:8px}
.lp-voice p{font-size:15.5px;line-height:1.65}
.lp-vn{font:800 16px/1.2 var(--display)!important;font-stretch:112%;text-transform:uppercase;letter-spacing:.03em}
.lp-vr,.lp-vs{font-size:13px!important;color:var(--muted)}
.lp-terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.lp a.lp-term{display:flex;flex-direction:column;gap:4px;height:100%;box-sizing:border-box;padding:14px 16px;border-radius:4px;border:1.5px solid var(--text);background:var(--bg);text-decoration:none;color:var(--text)}
.lp a.lp-term:hover{background:var(--hover)}
.lp-tn{font-weight:700;font-size:15px;text-decoration:underline;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:3px}
.lp-to{font-size:14px;line-height:1.5;color:var(--muted)}
.lp-sources{counter-reset:s;gap:8px;font-size:14px;line-height:1.55}
.lp-sources li{color:var(--muted)}
.lp a{color:var(--text);text-decoration:underline;text-decoration-color:var(--acc-line);text-decoration-thickness:2px;text-underline-offset:3px}
.lp-pns{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lp a.lp-pn{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:4px;border:1.5px solid var(--text);text-decoration:none}
.lp a.lp-pn.next{text-align:right;background:var(--card);color:var(--card-ink);border-color:var(--card)}
.lp a.lp-pn.next .lbl{color:var(--card-em)}
.lp-pn b{font:800 16px/1.2 var(--display);font-stretch:112%;text-transform:uppercase}
.lp-back{margin:0;font-size:15px}

.lp .lp-nav a,.lp .lp-toc a{text-decoration:none}
.lp .lp-nav a[aria-current="page"]{outline:none;border:1.5px solid var(--text)}
html[data-theme] body .mnav .mnav-sub a[aria-current]{font-weight:600!important;color:var(--text)}

/* Colour defaults for the AI-stack layers; theme.js overrides them with a ramp built from the chosen earth and sky. */
:root{--ly1:#2d4a2d;--ly1-l:#223a22;--ly1-r:#1b2f1b;--ly1-i:#fbfcfa;--ly2:#5a7a5a;--ly2-l:#496349;--ly2-r:#3d533d;--ly2-i:#fbfcfa;--ly3:#8fa08f;--ly3-l:#738573;--ly3-r:#627362;--ly3-i:#0f2752;--ly4:#34507f;--ly4-l:#274068;--ly4-r:#1f3356;--ly4-i:#fbfcfa;--ly5:#0f2752;--ly5-l:#0a1c3d;--ly5-r:#071530;--ly5-i:#e6df6b;--ly6:#fbfcfa;--ly6-l:#dde2dd;--ly6-r:#c9d0e0;--ly6-i:#0f2752;--ly7:#e6df6b;--ly7-l:#c9c255;--ly7-r:#b3ac47;--ly7-i:#0f2752}

/* Vocabulary page: the A–Z tile is a full-width bar under the eight topics (no orphan tile in the last row) */
.topics>#topic-all.vt-all{grid-column:1/-1;display:flex;flex-direction:row;align-items:center;gap:8px 28px;flex-wrap:wrap;text-align:left;min-height:0;padding:20px 24px}
.topics>#topic-all .tp-top{margin:0;flex:none}
.topics>#topic-all .tp-no{font-size:26px}
.topics>#topic-all .tp-name{flex:none;margin:0}
.topics>#topic-all .tp-desc{flex:1 1 260px;margin:0}

/* v61 the "Go AI-native ..." line is visible on the first screen of a laptop: tighter hero on short screens (--tuck is set by earth.js), less air above the line */
[data-speck="n"]{--dust-bar:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDQwMCA4IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWF4WU1pbiBzbGljZSI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAuNSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjYiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjQwMCIgaGVpZ2h0PSI4IiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZVR1cmJ1bGVuY2UgdHlwZT0iZnJhY3RhbE5vaXNlIiBiYXNlRnJlcXVlbmN5PSIwLjM0IiBudW1PY3RhdmVzPSIyIiBzZWVkPSIxMiIgcmVzdWx0PSJuIi8+PGZlQ29tcG9zaXRlIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9Im4iIG9wZXJhdG9yPSJhcml0aG1ldGljIiBrMT0iMCIgazI9IjEiIGszPSIxIiBrND0iLS41IiByZXN1bHQ9Im0iLz48ZmVDb21wb25lbnRUcmFuc2ZlciBpbj0ibSIgcmVzdWx0PSJ0Ij48ZmVGdW5jQSB0eXBlPSJkaXNjcmV0ZSIgdGFibGVWYWx1ZXM9IjAgMSIvPjwvZmVDb21wb25lbnRUcmFuc2Zlcj48ZmVGbG9vZCBmbG9vZC1jb2xvcj0iIzBGMjc1MiIgcmVzdWx0PSJrIi8+PGZlQ29tcG9zaXRlIGluPSJrIiBpbjI9InQiIG9wZXJhdG9yPSJpbiIvPjwvZmlsdGVyPjwvZGVmcz48Zz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjgiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-speck="k"]{--dust-bar:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDQwMCA4IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWF4WU1pbiBzbGljZSI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAuNSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjYiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjQwMCIgaGVpZ2h0PSI4IiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZVR1cmJ1bGVuY2UgdHlwZT0iZnJhY3RhbE5vaXNlIiBiYXNlRnJlcXVlbmN5PSIwLjM0IiBudW1PY3RhdmVzPSIyIiBzZWVkPSIxMiIgcmVzdWx0PSJuIi8+PGZlQ29tcG9zaXRlIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9Im4iIG9wZXJhdG9yPSJhcml0aG1ldGljIiBrMT0iMCIgazI9IjEiIGszPSIxIiBrND0iLS41IiByZXN1bHQ9Im0iLz48ZmVDb21wb25lbnRUcmFuc2ZlciBpbj0ibSIgcmVzdWx0PSJ0Ij48ZmVGdW5jQSB0eXBlPSJkaXNjcmV0ZSIgdGFibGVWYWx1ZXM9IjAgMSIvPjwvZmVDb21wb25lbnRUcmFuc2Zlcj48ZmVGbG9vZCBmbG9vZC1jb2xvcj0iI0Y5NjU1OCIgcmVzdWx0PSJrIi8+PGZlQ29tcG9zaXRlIGluPSJrIiBpbjI9InQiIG9wZXJhdG9yPSJpbiIvPjwvZmlsdGVyPjwvZGVmcz48Zz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjgiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-speck="z"]{--dust-bar:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDQwMCA4IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWF4WU1pbiBzbGljZSI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAuNSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjYiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjQwMCIgaGVpZ2h0PSI4IiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZVR1cmJ1bGVuY2UgdHlwZT0iZnJhY3RhbE5vaXNlIiBiYXNlRnJlcXVlbmN5PSIwLjM0IiBudW1PY3RhdmVzPSIyIiBzZWVkPSIxMiIgcmVzdWx0PSJuIi8+PGZlQ29tcG9zaXRlIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9Im4iIG9wZXJhdG9yPSJhcml0aG1ldGljIiBrMT0iMCIgazI9IjEiIGszPSIxIiBrND0iLS41IiByZXN1bHQ9Im0iLz48ZmVDb21wb25lbnRUcmFuc2ZlciBpbj0ibSIgcmVzdWx0PSJ0Ij48ZmVGdW5jQSB0eXBlPSJkaXNjcmV0ZSIgdGFibGVWYWx1ZXM9IjAgMSIvPjwvZmVDb21wb25lbnRUcmFuc2Zlcj48ZmVGbG9vZCBmbG9vZC1jb2xvcj0iI0U2REY2QiIgcmVzdWx0PSJrIi8+PGZlQ29tcG9zaXRlIGluPSJrIiBpbjI9InQiIG9wZXJhdG9yPSJpbiIvPjwvZmlsdGVyPjwvZGVmcz48Zz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjgiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-speck="g"]{--dust-bar:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDQwMCA4IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWF4WU1pbiBzbGljZSI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAuNSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjYiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjQwMCIgaGVpZ2h0PSI4IiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZVR1cmJ1bGVuY2UgdHlwZT0iZnJhY3RhbE5vaXNlIiBiYXNlRnJlcXVlbmN5PSIwLjM0IiBudW1PY3RhdmVzPSIyIiBzZWVkPSIxMiIgcmVzdWx0PSJuIi8+PGZlQ29tcG9zaXRlIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9Im4iIG9wZXJhdG9yPSJhcml0aG1ldGljIiBrMT0iMCIgazI9IjEiIGszPSIxIiBrND0iLS41IiByZXN1bHQ9Im0iLz48ZmVDb21wb25lbnRUcmFuc2ZlciBpbj0ibSIgcmVzdWx0PSJ0Ij48ZmVGdW5jQSB0eXBlPSJkaXNjcmV0ZSIgdGFibGVWYWx1ZXM9IjAgMSIvPjwvZmVDb21wb25lbnRUcmFuc2Zlcj48ZmVGbG9vZCBmbG9vZC1jb2xvcj0iIzJENEEyRCIgcmVzdWx0PSJrIi8+PGZlQ29tcG9zaXRlIGluPSJrIiBpbjI9InQiIG9wZXJhdG9yPSJpbiIvPjwvZmlsdGVyPjwvZGVmcz48Zz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjgiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-foot="n"]{--dust-rise:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwMCA5MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1heFlNaW4gc2xpY2UiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZyIgeDE9IjAiIHkxPSIxIiB4Mj0iMCIgeTI9IjAiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjY0Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMyIgbnVtT2N0YXZlcz0iMiIgc2VlZD0iMjEiIHJlc3VsdD0ibiIvPjxmZUNvbXBvc2l0ZSBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJuIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazE9IjAiIGsyPSIxIiBrMz0iMSIgazQ9Ii0uNSIgcmVzdWx0PSJtIi8+PGZlQ29tcG9uZW50VHJhbnNmZXIgaW49Im0iIHJlc3VsdD0idCI+PGZlRnVuY0EgdHlwZT0iZGlzY3JldGUiIHRhYmxlVmFsdWVzPSIwIDEiLz48L2ZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRmxvb2QgZmxvb2QtY29sb3I9IiMwRjI3NTIiIHJlc3VsdD0iayIvPjxmZUNvbXBvc2l0ZSBpbj0iayIgaW4yPSJ0IiBvcGVyYXRvcj0iaW4iLz48L2ZpbHRlcj48L2RlZnM+PGc+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-foot="k"]{--dust-rise:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwMCA5MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1heFlNaW4gc2xpY2UiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZyIgeDE9IjAiIHkxPSIxIiB4Mj0iMCIgeTI9IjAiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjY0Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMyIgbnVtT2N0YXZlcz0iMiIgc2VlZD0iMjEiIHJlc3VsdD0ibiIvPjxmZUNvbXBvc2l0ZSBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJuIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazE9IjAiIGsyPSIxIiBrMz0iMSIgazQ9Ii0uNSIgcmVzdWx0PSJtIi8+PGZlQ29tcG9uZW50VHJhbnNmZXIgaW49Im0iIHJlc3VsdD0idCI+PGZlRnVuY0EgdHlwZT0iZGlzY3JldGUiIHRhYmxlVmFsdWVzPSIwIDEiLz48L2ZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRmxvb2QgZmxvb2QtY29sb3I9IiNGOTY1NTgiIHJlc3VsdD0iayIvPjxmZUNvbXBvc2l0ZSBpbj0iayIgaW4yPSJ0IiBvcGVyYXRvcj0iaW4iLz48L2ZpbHRlcj48L2RlZnM+PGc+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-foot="z"]{--dust-rise:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwMCA5MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1heFlNaW4gc2xpY2UiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZyIgeDE9IjAiIHkxPSIxIiB4Mj0iMCIgeTI9IjAiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjY0Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMyIgbnVtT2N0YXZlcz0iMiIgc2VlZD0iMjEiIHJlc3VsdD0ibiIvPjxmZUNvbXBvc2l0ZSBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJuIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazE9IjAiIGsyPSIxIiBrMz0iMSIgazQ9Ii0uNSIgcmVzdWx0PSJtIi8+PGZlQ29tcG9uZW50VHJhbnNmZXIgaW49Im0iIHJlc3VsdD0idCI+PGZlRnVuY0EgdHlwZT0iZGlzY3JldGUiIHRhYmxlVmFsdWVzPSIwIDEiLz48L2ZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRmxvb2QgZmxvb2QtY29sb3I9IiNFNkRGNkIiIHJlc3VsdD0iayIvPjxmZUNvbXBvc2l0ZSBpbj0iayIgaW4yPSJ0IiBvcGVyYXRvcj0iaW4iLz48L2ZpbHRlcj48L2RlZnM+PGc+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-foot="g"]{--dust-rise:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwMCA5MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1heFlNaW4gc2xpY2UiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZyIgeDE9IjAiIHkxPSIxIiB4Mj0iMCIgeTI9IjAiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjY0Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMyIgbnVtT2N0YXZlcz0iMiIgc2VlZD0iMjEiIHJlc3VsdD0ibiIvPjxmZUNvbXBvc2l0ZSBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJuIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazE9IjAiIGsyPSIxIiBrMz0iMSIgazQ9Ii0uNSIgcmVzdWx0PSJtIi8+PGZlQ29tcG9uZW50VHJhbnNmZXIgaW49Im0iIHJlc3VsdD0idCI+PGZlRnVuY0EgdHlwZT0iZGlzY3JldGUiIHRhYmxlVmFsdWVzPSIwIDEiLz48L2ZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRmxvb2QgZmxvb2QtY29sb3I9IiMyRDRBMkQiIHJlc3VsdD0iayIvPjxmZUNvbXBvc2l0ZSBpbj0iayIgaW4yPSJ0IiBvcGVyYXRvcj0iaW4iLz48L2ZpbHRlcj48L2RlZnM+PGc+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-foot="s"]{--dust-rise:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwMCA5MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1heFlNaW4gc2xpY2UiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZyIgeDE9IjAiIHkxPSIxIiB4Mj0iMCIgeTI9IjAiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjY0Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMyIgbnVtT2N0YXZlcz0iMiIgc2VlZD0iMjEiIHJlc3VsdD0ibiIvPjxmZUNvbXBvc2l0ZSBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJuIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazE9IjAiIGsyPSIxIiBrMz0iMSIgazQ9Ii0uNSIgcmVzdWx0PSJtIi8+PGZlQ29tcG9uZW50VHJhbnNmZXIgaW49Im0iIHJlc3VsdD0idCI+PGZlRnVuY0EgdHlwZT0iZGlzY3JldGUiIHRhYmxlVmFsdWVzPSIwIDEiLz48L2ZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRmxvb2QgZmxvb2QtY29sb3I9IiM4RkEwOEYiIHJlc3VsdD0iayIvPjxmZUNvbXBvc2l0ZSBpbj0iayIgaW4yPSJ0IiBvcGVyYXRvcj0iaW4iLz48L2ZpbHRlcj48L2RlZnM+PGc+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}[data-foot="o"]{--dust-rise:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwMCA5MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1heFlNaW4gc2xpY2UiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZyIgeDE9IjAiIHkxPSIxIiB4Mj0iMCIgeTI9IjAiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjY0Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9ImYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9IjAuMyIgbnVtT2N0YXZlcz0iMiIgc2VlZD0iMjEiIHJlc3VsdD0ibiIvPjxmZUNvbXBvc2l0ZSBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJuIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazE9IjAiIGsyPSIxIiBrMz0iMSIgazQ9Ii0uNSIgcmVzdWx0PSJtIi8+PGZlQ29tcG9uZW50VHJhbnNmZXIgaW49Im0iIHJlc3VsdD0idCI+PGZlRnVuY0EgdHlwZT0iZGlzY3JldGUiIHRhYmxlVmFsdWVzPSIwIDEiLz48L2ZlQ29tcG9uZW50VHJhbnNmZXI+PGZlRmxvb2QgZmxvb2QtY29sb3I9IiNGQkZDRkEiIHJlc3VsdD0iayIvPjxmZUNvbXBvc2l0ZSBpbj0iayIgaW4yPSJ0IiBvcGVyYXRvcj0iaW4iLz48L2ZpbHRlcj48L2RlZnM+PGc+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iOTAiIGZpbGw9InVybCgjZykiIGZpbHRlcj0idXJsKCNmKSIvPjwvZz48L3N2Zz4=")}