@font-face{font-family:Inter;src:url(Inter-Variable.ttf);font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(Inter-Italic-Variable.ttf);font-weight:100 900;font-style:italic;font-display:swap}
:root{--om-blue:#0D3373;--om-green:#B9C300;--om-text-accent:#90A0C2;--om-cardio:#E30613;
--om-natal:#DC007D;--om-immun:#EB5A05;--om-fertil:#3AAA35;--om-vital:#30B7C0;--om-vision:#0096DC;
--grey-100:#F4F5F7;--grey-200:#E6E8EC;--grey-400:#B8BDC7;--grey-600:#6B7280}
*{box-sizing:border-box}
body{margin:0;font:300 16px/1.5 Inter,"Helvetica Neue",Arial,sans-serif;color:#000;background:#fff;-webkit-font-smoothing:antialiased}

/* Bildschirm (16:9, alle Maße in cqw) */
.screen{position:relative;width:100%;aspect-ratio:16/9;container-type:size;background:var(--om-blue);overflow:hidden;color:#fff}
.screen .in{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:space-between;padding:5.5cqw 6cqw}
.screen .top{display:flex;align-items:flex-start;justify-content:space-between}
.screen .top img.wm{width:19cqw}
.screen .mid{display:flex;flex-direction:column}
.screen .mid>*+*{margin-top:1.8cqw}
.screen .txt{font-size:3.2cqw;font-weight:300;color:var(--om-green)}
.screen .nm{font-weight:700;font-style:italic;line-height:1.08}
.screen .firma{font-size:3.2cqw;font-weight:700}
.screen .logo{display:inline-flex;align-items:center;justify-content:center;min-width:14cqw;height:8cqw;padding:0 1.6cqw;background:#fff}
.screen .logo img{max-width:20cqw;max-height:6cqw;object-fit:contain}
.screen .mid .logo{align-self:flex-start;margin-top:3.2cqw}
.screen .bar{height:.5cqw;width:100%}
.screen .claim{font-size:2.6cqw;font-weight:700;line-height:1.15;margin-top:1.6cqw}
.screen.idle .txt{font-size:6cqw;font-weight:700;color:#fff}

/* Admin */
.app{display:flex;min-height:100vh}
nav{width:240px;flex:none;background:var(--om-blue);color:#fff;display:flex;flex-direction:column;padding:28px 0}
nav img{width:150px;margin:0 24px 8px}
nav .sub{font-size:13px;color:var(--om-text-accent);padding:0 24px 28px}
nav button{text-align:left;font:700 15px Inter,sans-serif;color:#fff;background:transparent;border:0;border-left:4px solid transparent;padding:14px 24px;cursor:pointer}
nav button:hover{background:rgba(255,255,255,.08)}
nav button.on{border-left-color:var(--om-green);background:rgba(255,255,255,.08)}
nav .foot{margin-top:auto;padding:24px;display:flex;flex-direction:column;gap:10px;font-size:13px}
nav .foot i{height:4px;background:var(--om-green);display:block}
main{flex:1;min-width:0;padding:40px 44px 64px;display:flex;flex-direction:column;gap:28px}
h1{margin:0;font-size:36px;line-height:1.1;color:var(--om-blue)}
.lead{color:var(--grey-600);max-width:52ch;margin-top:8px;font-size:15px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:32px;align-items:start}
.col{display:flex;flex-direction:column;gap:24px;min-width:0}
.card{border:1px solid var(--grey-200);border-top:4px solid var(--accent,var(--om-vital));padding:28px;display:flex;flex-direction:column;gap:20px;background:#fff}
.card h2{margin:0;font-size:20px;color:var(--om-blue)}
label.f{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:var(--om-blue)}
input[type=text],input[type=password],input[type=date],input[type=time],select,textarea{font:300 16px Inter,sans-serif;padding:11px 12px;border:1px solid var(--grey-400);background:#fff;width:100%;border-radius:0}
input:focus,select:focus{outline:2px solid var(--om-vision);outline-offset:0}
.row3{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:10px}
.hint{font-size:13px;color:var(--grey-600);font-weight:300}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.row>label{flex:1 1 180px}
.btn{font:700 15px Inter,sans-serif;padding:10px 22px;border-radius:999px;border:2px solid var(--om-blue);background:var(--om-blue);color:#fff;cursor:pointer}
.btn.sec{background:#fff;color:var(--om-blue)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--om-blue)}
.btn:hover{background:#fff;color:var(--om-blue)}
.btn.sec:hover,.btn.ghost:hover{background:var(--om-blue);color:#fff}
.btn.sm{padding:6px 16px;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--grey-200);font-size:14px}
.chip button{border:0;background:none;cursor:pointer;color:var(--grey-600);font-size:16px;padding:0}
.chip button:hover{color:var(--om-cardio)}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:132px;border:1px dashed var(--grey-400);background:var(--grey-100);cursor:pointer;text-align:center}
.drop:hover{border-color:var(--om-blue)}
.drop b{color:var(--om-blue)}
.libs{display:flex;flex-wrap:wrap;gap:10px}
.lib{width:104px;height:56px;background:#fff;border:1px solid var(--grey-200);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center}
.lib.on,.lib:hover{border-color:var(--om-blue)}
.lib img{max-width:100%;max-height:100%;object-fit:contain}
.eyebrow{display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:var(--om-blue);letter-spacing:.04em}
.eyebrow span+span{font-weight:300;color:var(--grey-600)}
.visit{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 20px;padding:16px 4px;border-bottom:1px solid var(--grey-200);align-items:flex-start}
.visit .t{font-weight:700;color:var(--om-blue);margin-right:12px}
.visit .s{font-size:13px;font-weight:700;margin-left:12px}
.list{max-width:960px}
.swatches{display:flex;flex-wrap:wrap;gap:10px}
.sw{width:96px;height:64px;border:2px solid transparent;display:flex;align-items:flex-end;color:#fff;font:700 11px Inter;padding:6px 8px;cursor:pointer}
.sw.on{border-color:var(--om-blue)}
.status{font-size:13px;color:var(--om-fertil);min-height:18px}
@media(max-width:800px){.app{flex-direction:column}nav{width:auto;padding:16px 0}nav .foot{display:none}main{padding:24px 16px}}