/* ArtSpark — two worlds you can tell apart blindfolded.
   Artist: CORAL + PLUM, rounded display font, pill buttons, soft cards.
   Org: NAVY + GOLD, serif display, sharp edges, uppercase actions.
   Theme slider: Default(system)/Light/Dark -> [data-mode]. */
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);transition:background .25s,color .25s;font-family:var(--body)}
header{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 20px;max-width:1020px;margin:0 auto;flex-wrap:wrap}
.logo{font-weight:900;font-size:1.25rem;color:var(--ink);text-decoration:none;font-family:var(--display)}
.logo .for{color:var(--accent)}
.head-right{display:flex;align-items:center;gap:10px}
main{max-width:1020px;margin:0 auto;padding:8px 20px 36px;text-align:center}
h1{font-family:var(--display);font-size:clamp(2rem,6vw,3.1rem);line-height:1.08;margin:18px 0}
h2{font-family:var(--display)}
footer{text-align:center;color:var(--muted);padding:18px;font-size:.9rem}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.cute{border:none;font-weight:800;font-size:.95rem;padding:.65em 1.1em;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.back{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:.5em 1em;font-weight:700;float:left}
.learn{margin-top:22px;border:none;background:transparent;color:var(--accent);font-weight:800;font-size:1rem}
.sample{position:absolute;top:10px;right:10px;background:var(--gold);color:#231600;font-size:.75rem;font-weight:900;padding:.25em .6em;border-radius:999px;transform:rotate(3deg)}
.demo{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;text-align:left}
.screen{position:relative;background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:18px}
.screen h2{margin:.1em 0 .5em;font-size:1.15rem}
.rows{max-width:620px;margin:0 auto;text-align:left;display:grid;gap:12px}
.row{display:flex;gap:14px;align-items:center;background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:16px}
.row>span{font-size:1.9rem}
.row h2{margin:0;font-size:1.15rem}.row p{margin:2px 0 0;color:var(--muted)}
.fees{max-width:620px;margin:16px auto;display:grid;gap:8px}
.fees div{display:flex;justify-content:space-between;background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:12px 16px}
.pill{border-radius:999px;padding:.15em .6em;font-size:.78rem;font-weight:800}
.pill.ok{background:#d8f3e8;color:#065f46}.pill.wait{background:#fdf0d5;color:#7c5a1c}.pill.no{background:#eceef2;color:#5b6478}
.workline{display:flex;justify-content:space-between;align-items:center;gap:10px}
.pick{display:block;padding:8px 0;font-weight:600}
.field{display:block;margin:10px 0;font-size:.85rem;color:var(--muted);text-align:left}
.field input{display:block;width:100%;margin-top:4px;padding:10px;border:1.5px solid var(--line);border-radius:calc(var(--radius)/2);background:var(--bg);color:var(--ink);font:inherit}
.score{display:flex;gap:6px}.score button{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-weight:800}.score button.on{background:var(--gold);color:#231600}
.labelcard{border:1.5px solid var(--ink);padding:12px;margin-top:10px;background:var(--card)}
.big{border:none;font-weight:900;font-size:1.05rem;padding:.9em 1.6em;margin-top:18px}

/* theme slider, icons only */
.slider{position:relative;display:flex;background:var(--card);border:1.5px solid var(--line);border-radius:999px;padding:3px}
.slider button{position:relative;z-index:1;border:none;background:transparent;font-size:1rem;line-height:1;width:38px;height:32px;border-radius:999px}
.slider .knob{position:absolute;top:3px;left:3px;width:38px;height:32px;border-radius:999px;background:var(--ink);transition:transform .22s}
.slider[data-pos="1"] .knob{transform:translateX(38px)}
.slider[data-pos="2"] .knob{transform:translateX(76px)}

/* ============ ARTIST: coral + plum, rounded ============ */
html[data-world="artist"]{--radius:22px;--display:"Avenir Next Rounded","Nunito",ui-rounded,"Comic Sans MS",ui-sans-system,sans-serif;--body:ui-rounded,"Avenir Next",ui-sans-system,system-ui,sans-serif}
html[data-world="artist"][data-mode="light"]{--bg:#fff1e2;--card:#ffffff;--ink:#3d154e;--muted:#9a6b8f;--line:#ffd9c2;--accent:#ff4f6d;--gold:#ffb703;--btn:#ff4f6d}
html[data-world="artist"][data-mode="dark"]{--bg:#2a0a3a;--card:#42155a;--ink:#ffeef7;--muted:#d9a8e6;--line:#6b2a85;--accent:#ff8fab;--gold:#ffd166;--btn:#ff5d8f}
html[data-world="artist"] .cute{background:var(--btn);color:#fff;border-radius:999px}
html[data-world="artist"] .big{background:var(--btn);color:#fff;border-radius:999px}
html[data-world="artist"] .search{display:flex;align-items:center;gap:10px;background:var(--card);border:2.5px solid var(--accent);border-radius:999px;max-width:560px;margin:0 auto;padding:12px 18px}
html[data-world="artist"] .search input{border:none;outline:none;font-size:1.05rem;width:100%;background:transparent;color:var(--ink)}
html[data-world="artist"] .chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:18px 0 22px}
html[data-world="artist"] .chip{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:.5em 1em;font-weight:700}
html[data-world="artist"] .chip.on{background:var(--ink);color:var(--bg)}
html[data-world="artist"] .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;text-align:left}
html[data-world="artist"] .card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:16px}
html[data-world="artist"] .art{height:110px;border-radius:16px;display:grid;place-items:center;font-size:2.6rem;margin-bottom:12px}
.a1{background:linear-gradient(135deg,#ffd6a5,#ffadad)} .a2{background:linear-gradient(135deg,#caffbf,#9bf6ff)} .a3{background:linear-gradient(135deg,#bdb2ff,#ffc6ff)} .a4{background:linear-gradient(135deg,#fdffb6,#ffadad)}
html[data-world="artist"] .card h2{margin:0 0 4px;font-size:1.12rem}
html[data-world="artist"] .meta{color:var(--muted);margin:2px 0;font-size:.93rem}
html[data-world="artist"] .join{margin-top:12px;width:100%;border:none;border-radius:999px;background:var(--btn);color:#fff;font-weight:800;padding:.75em;font-size:1rem}
html[data-world="artist"] .empty{color:var(--muted)}

/* ============ ORGANIZATION: navy + gold, serif, sharp ============ */
html[data-world="org"]{--radius:6px;--display:Georgia,"Times New Roman",serif;--body:"Helvetica Neue",Arial,ui-sans-system,sans-serif}
html[data-world="org"][data-mode="light"]{--bg:#dfe9f5;--card:#ffffff;--ink:#071f3d;--muted:#4a6484;--line:#9db8d6;--accent:#0057b8;--gold:#c99700;--btn:#071f3d}
html[data-world="org"][data-mode="dark"]{--bg:#030a18;--card:#0b1c36;--ink:#eaf1ff;--muted:#8ea3c2;--line:#24476e;--accent:#7db8ff;--gold:#e9b949;--btn:#e9b949}
html[data-world="org"] header{border-bottom:3px solid var(--gold)}
html[data-world="org"] h1{text-transform:uppercase;letter-spacing:.03em}
html[data-world="org"] .cute{background:var(--btn);color:#fff;border-radius:6px;box-shadow:none;text-transform:uppercase;letter-spacing:.04em}
html[data-world="org"][data-mode="dark"] .cute{color:#071f3d}
html[data-world="org"] .big{background:var(--gold);color:#071f3d;border-radius:6px;text-transform:uppercase;letter-spacing:.05em}
html[data-world="org"] .sub{color:var(--muted);margin:-8px 0 8px;font-size:1.05rem}
html[data-world="org"] .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:640px;margin:22px auto}
@media(max-width:560px){html[data-world="org"] .steps{grid-template-columns:repeat(2,1fr)}}
html[data-world="org"] .step{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:18px 8px;display:flex;flex-direction:column;gap:8px}
html[data-world="org"] .step span{font-size:1.7rem}
html[data-world="org"] .tiny{color:var(--muted)}
