/* Gestaltung nach dem gelieferten Gruppenbildner-Entwurf. */
@font-face{font-family:Manrope;font-weight:400;src:url('./fonts/manrope-400.ttf') format('truetype');font-display:swap}
@font-face{font-family:Manrope;font-weight:500;src:url('./fonts/manrope-500.ttf') format('truetype');font-display:swap}
@font-face{font-family:Manrope;font-weight:600;src:url('./fonts/manrope-600.ttf') format('truetype');font-display:swap}
@font-face{font-family:Manrope;font-weight:700 900;src:url('./fonts/manrope-700.ttf') format('truetype');font-display:swap}
@font-face{font-family:"Playfair Display";font-weight:500;src:url('./fonts/playfair-500.ttf') format('truetype');font-display:swap}
@font-face{font-family:"Playfair Display";font-weight:600 900;src:url('./fonts/playfair-600.ttf') format('truetype');font-display:swap}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:500 900;src:url('./fonts/playfair-italic-500.ttf') format('truetype');font-display:swap}
:root{
  --font:Manrope,system-ui,sans-serif;--font-display:"Playfair Display",Georgia,serif;
  --bg:#f6f3ed;--card:#fffdf9;--surface-2:#eeeae1;--text:#28251f;--muted:#686259;--muted-tint:#686259;
  --accent:#925d18;--accent-strong:#805014;--accent-bright:#b78028;--accent-text:#805014;--accent-soft:#f4e7ce;
  --border:#aaa292;--border-strong:#918773;--ring:rgb(179 125 39 / 22%);--gold-ink:#925d18;--gold-edge:#b98d45;
  --danger:#ae263d;--danger-soft:#fae5e8;--warn:#805014;--warn-bg:#fff4df;--warn-border:#b98d45;
  --g1:oklch(.55 .17 255);--g2:oklch(.52 .19 22);--g3:oklch(.56 .14 78);--g4:oklch(.55 .15 155);
  --g5:oklch(.54 .19 330);--g6:oklch(.52 .19 290);--g7:oklch(.58 .12 190);--g8:oklch(.53 .16 55);
  --surface-light:oklch(.99 0 0);--surface-dark:oklch(.07 .02 285);--tile:var(--g1);
  --tile-fill:linear-gradient(125deg,color-mix(in oklab,var(--tile) 90%,var(--surface-light)),var(--tile) 65%,color-mix(in oklab,var(--tile) 92%,var(--surface-dark)));
  --r-sm:8px;--r-md:12px;--r-lg:20px;--radius:8px;
  --shadow:0 1px 0 rgb(255 255 255 / 8%) inset,0 6px 16px -10px rgb(0 0 0 / 25%);
  --shadow-accent:0 5px 20px -10px #ce9e48;color-scheme:light;
}
body{font-family:var(--font);background:radial-gradient(90% 70% at 50% -10%,rgb(194 151 77 / 13%),transparent 65%),var(--bg);background-attachment:fixed;font-feature-settings:normal}
.screen{max-width:1280px;padding:32px 40px 64px;animation:none}
.title{font:italic 500 clamp(36px,4.6vw,56px)/1.15 var(--font-display);letter-spacing:-.005em;margin:0 0 16px}
.title .ic{color:var(--gold-ink);width:.7em;height:.7em}.subtitle{font-size:16px;margin-bottom:28px}.course-title{font-size:36px;margin:0}
.btn,.link-btn,.icon-btn,.ui-btn{min-height:48px;border-radius:999px;font-size:16px;font-weight:500;gap:8px;padding:11px 20px;box-shadow:var(--shadow)}
.btn,.icon-btn{border:1px solid var(--border);background:var(--card)}.icon-btn{padding:10px;min-width:46px}
.btn-primary,.action-a,.ui-btn.ok{background:linear-gradient(115deg,#f5d8a3,#edc06b 55%,#e4b666);border:1px solid var(--gold-edge);color:#302514;box-shadow:var(--shadow-accent)}
.btn-primary:hover,.action-a:hover,.ui-btn.ok:hover{background:linear-gradient(115deg,#f5d8a3,#edc06b 55%,#e4b666);filter:brightness(1.04);border-color:var(--gold-edge)}
.btn:hover,.icon-btn:hover{border-color:var(--muted)}.link-btn{background:var(--card);border:1px solid var(--border);color:var(--text)}.link-btn:hover{background:var(--surface-2)}
.link-btn.danger,.icon-btn.danger{color:var(--danger)}.ui-btn.ok.danger{background:var(--danger);color:#fff;border-color:transparent}
.input,.ui-in{border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:12px;font-size:16px;min-width:0}
.input:focus,.ui-in:focus{border-color:var(--gold-edge);box-shadow:0 0 0 3px var(--ring)}
:focus-visible{outline:3px solid var(--gold-ink);outline-offset:3px}.course-open{padding:20px 24px;border-radius:20px}.course-name{font-size:20px}.course-sub{margin-top:6px}
.course-head{margin:16px 0 24px;gap:16px}.course-head .course-title{min-width:0;overflow-wrap:anywhere}.pill{padding:6px 6px 6px 16px}.pill-name{font-size:21px}.pill-x{min-width:40px;min-height:40px}
.actions{gap:12px;margin:24px 0 16px}.action{min-height:56px;padding:14px 24px;border-radius:999px;box-shadow:var(--shadow);font-size:16px;font-weight:600;border:1px solid var(--border)}
.action-b,.action-c{background:var(--card);color:var(--text)}.action-a,.action-b,.action-c{box-shadow:var(--shadow)}.roles-bar{gap:12px 16px;margin-top:24px}.roles-toggle{font-size:14px;min-height:44px}.roles-bar .roles-toggle,.roles-bar>.link-btn{margin-left:0!important}.roles-bar input[type=number]{min-height:44px!important;padding:8px!important}.roles-toggle input{accent-color:var(--accent)}
.result{display:flex;flex-direction:column;margin-top:32px;scroll-margin-top:20px}.result-head{display:flex;flex-wrap:wrap;gap:24px;width:100%;margin:0 0 28px;padding-bottom:28px;border-bottom:1px solid var(--border)}
.result-title{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-basis:100%;font-weight:500}
.result-main-title{font:italic 500 clamp(40px,4.6vw,60px)/1.1 var(--font-display);letter-spacing:-.005em;margin:0;overflow-wrap:anywhere}
.result-main-title strong{font-weight:600;font-style:normal;color:var(--gold-ink)}
.round-indicator{display:inline-flex;flex-direction:row-reverse;align-items:center;gap:12px;padding:12px 24px;border:1px solid var(--border);border-radius:999px;background:var(--card);box-shadow:var(--shadow);color:var(--muted);font:400 18px var(--font);white-space:nowrap}
.round-number{font:500 32px var(--font-display);color:var(--gold-ink)}.result-tools{display:flex;flex-wrap:wrap;gap:8px}
.group-grid{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:36px 24px;margin-top:0;order:1}
.group-card{display:flex;flex-direction:column;gap:12px;min-width:0;animation:none}
.group-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:12px;margin-bottom:4px;border-bottom:1px solid color-mix(in oklab,var(--gold-edge) 65%,transparent)}
.group-no,.group-card.trio .group-no{font:italic 500 clamp(27px,2.6vw,36px)/1.2 var(--font-display);letter-spacing:0;text-align:left;color:var(--text);white-space:nowrap}
.group-number{font-style:normal;color:color-mix(in oklab,var(--tile) 60%,var(--surface-light))}
.tisch-tag{align-self:auto;padding:0;margin:0;border:0;border-radius:0;color:var(--text);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.member{--tile-fill:linear-gradient(125deg,color-mix(in oklab,var(--tile) 90%,var(--surface-light)),var(--tile) 65%,color-mix(in oklab,var(--tile) 92%,var(--surface-dark)));display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:128px;padding:24px 18px;border-radius:8px;background:var(--tile-fill)!important;border:1px solid color-mix(in oklab,var(--tile) 65%,var(--gold-edge));font-size:clamp(28px,2.5vw,36px);font-weight:600;line-height:1.3;text-shadow:0 1px 3px rgb(0 0 0 / 55%);box-shadow:0 12px 28px -16px color-mix(in oklab,var(--tile) 45%,var(--surface-dark)),inset 0 1px 0 rgb(255 255 255 / 35%)}
.member .mname{max-width:100%;overflow-wrap:anywhere}.member .mrole{font-size:20px;font-weight:700}.member.drag-target{outline-color:#fff}.member-drag-ghost{min-height:128px}
.drag-hint{order:2;margin:24px 0 0;font-size:13px;font-weight:400}.warn-line,.result>.fineprint{order:3}.trio-hint{font-size:14px;color:var(--gold-ink)}.repeat-note{color:var(--warn)}
.ui-card{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:20px;max-height:calc(100dvh - 36px);overflow:auto;font-family:var(--font)}
.ui-in{background:var(--surface-2)}.ui-btn.cancel{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--border)}.ui-btn.cancel:hover{background:var(--bg)}.ui-ov{background:rgb(6 7 12 / 70%)}
.ui-toast{background:var(--card);color:var(--text);box-shadow:inset 0 0 0 1px var(--border),var(--shadow-md)}.ui-toast.ok{background:#125d3b;color:#fff}.ui-toast.error{background:var(--danger);color:#fff}
@media(prefers-color-scheme:dark){
  :root{--bg:oklch(.17 .014 285);--card:oklch(.22 .016 285);--surface-2:oklch(.26 .017 285);--text:oklch(.93 .008 90);--muted:oklch(.72 .022 285);--muted-tint:oklch(.72 .022 285);--accent:oklch(.83 .115 80);--accent-strong:oklch(.82 .1 78);--accent-text:oklch(.82 .1 78);--accent-bright:#f5d8a3;--accent-soft:oklch(.3 .045 85);--border:oklch(.34 .022 285);--border-strong:oklch(.37 .022 285);--gold-ink:oklch(.82 .1 78);--gold-edge:oklch(.68 .09 78);--danger:#ff9aa7;--danger-soft:#3c202a;--warn:#efc477;--warn-bg:#34291b;--warn-border:#866a3f;color-scheme:dark}
  body{background:radial-gradient(115% 60% at 50% -10%,color-mix(in oklab,var(--accent) 11%,transparent),transparent 60%),radial-gradient(80% 55% at 90% 105%,color-mix(in oklab,var(--g6) 18%,transparent),transparent 65%),radial-gradient(70% 45% at 4% 98%,color-mix(in oklab,var(--g1) 14%,transparent),transparent 60%),linear-gradient(172deg,color-mix(in oklab,var(--bg) 88%,var(--surface-light)),var(--bg) 42%,var(--surface-dark));background-attachment:fixed}
  .action-a,.action-b,.action-c{box-shadow:var(--shadow)}.input:focus{border-color:var(--gold-edge)}.ui-btn.ok.danger,.ui-toast.error{background:#b92644;color:#fff}
}
/* Vollbild-Präsentation */
body.is-fullscreen{overflow-y:auto}
body.is-fullscreen .screen>*:not(.result){display:none!important}
body.is-fullscreen .screen{max-width:none!important;padding:24px 32px 40px!important;min-height:100vh}
body.is-fullscreen .result{margin-top:0!important}
body.is-fullscreen .drag-hint{display:none}
body.is-fullscreen .result-head{margin-bottom:20px;padding-bottom:20px}
body.is-fullscreen .group-grid{gap:20px 20px}
body.is-fullscreen .member{min-height:clamp(70px,11vh,115px);padding:clamp(12px,1.6vh,22px) 16px;font-size:clamp(22px,2.2vw,34px)}
body.is-fullscreen .member .mrole{font-size:clamp(15px,1.4vw,20px)}
@media(max-width:1023px){.group-grid{grid-template-columns:repeat(min(2,var(--cols,2)),minmax(0,1fr))}.group-no{font-size:36px}.screen{padding:28px 24px 56px}}
@media(max-width:639px){.screen{padding:24px 20px 48px}.result-title{flex-wrap:wrap;gap:16px}.result-main-title{font-size:44px}.round-indicator{font-size:14px;padding:8px 16px}.round-number{font-size:26px}.group-grid{grid-template-columns:minmax(0,1fr);gap:28px}.member{font-size:32px;min-height:112px}.result-tools{gap:8px}.result-tools .btn,.result-tools .link-btn{padding:10px 16px;font-size:14px}.course-title{font-size:30px}.course-head{flex-wrap:wrap}.course-head .title{flex-basis:calc(100% - 72px)}.roles-bar .roles-toggle{flex-wrap:wrap}.row .input{flex-basis:100%}.actions .action{width:100%}.link-btn{max-width:100%;white-space:normal}.ui-card{padding:20px}.ui-card>.row{flex-wrap:wrap}.ui-card .title{font-size:28px;padding-right:40px}.group-no{font-size:32px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}