/* ============================================================
   Authentic Gravity · Diagnostic-Tool — Stylesheet
   Ink / Paper / Gold — an die Hauptseite angelehnt.
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#14151a; --paper:#faf9f6; --paper-dark:#f2efe7; --card:#ffffff;
  --accent:#b8863b; --accent-dark:#8c6a2e; --muted:#6b6a63;
  --border:rgba(20,21,26,.10); --border-strong:rgba(20,21,26,.22);
  --good:#3f7d54; --track:#8c6a2e; --warn:#b8863b; --bad:#b1493b;
  --serif:'Playfair Display',Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --max:1080px;
}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);font-size:15px;line-height:1.6;font-weight:400}

a{color:var(--accent-dark)}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;line-height:1.2}

/* ---- top bar ---- */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:.9rem 4vw;background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}
.topbar .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.topbar .brand img{height:30px;width:auto}
.topbar .brand b{font-family:var(--serif);font-size:1.05rem;font-weight:600}
.topbar .brand span{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.topbar nav{display:flex;align-items:center;gap:1.2rem;font-size:.82rem}
.topbar nav a{color:var(--muted);text-decoration:none}
.topbar nav a:hover,.topbar nav a.active{color:var(--ink)}

.wrap{max-width:var(--max);margin:0 auto;padding:2rem 4vw 4rem}

/* ---- generic ---- */
.btn{font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:.6rem 1.15rem;border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;transition:all .15s;text-decoration:none;display:inline-block;border-radius:6px}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.danger{border-color:var(--bad);color:var(--bad);background:transparent}
.btn.danger:hover{background:var(--bad);color:var(--paper)}
.btn.sm{font-size:.68rem;padding:.4rem .75rem}

label{font-size:.72rem;letter-spacing:.03em;color:var(--muted);font-weight:600;display:block;margin-bottom:.3rem}
input,select,textarea{font-family:var(--sans);font-size:.9rem;color:var(--ink);background:var(--card);border:1px solid var(--border-strong);padding:.5rem .65rem;width:100%;border-radius:6px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-dark)}
textarea{resize:vertical;min-height:64px}
.field{margin-bottom:.9rem}
.grid{display:grid;gap:12px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:760px){.g2,.g3,.g4{grid-template-columns:1fr}}

.card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:1.2rem 1.35rem;margin-bottom:1rem}
.card h2{font-size:1.3rem;margin-bottom:.2rem}
.card .hint{font-size:.8rem;color:var(--muted);margin-bottom:1rem}
.section-label{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-dark);font-weight:700;display:block;margin:1.6rem 0 .8rem}
.note{font-size:.78rem;color:var(--muted);line-height:1.55}
.flash{padding:.6rem .9rem;border-radius:6px;font-size:.82rem;margin-bottom:1rem}
.flash.ok{background:#eef3ee;color:var(--good);border:1px solid rgba(63,125,84,.3)}
.flash.err{background:#f7ecea;color:var(--bad);border:1px solid rgba(177,73,59,.3)}
.pill{display:inline-block;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;padding:.2rem .55rem;border-radius:999px;font-weight:700}
.pill.ok{background:rgba(63,125,84,.12);color:var(--good)}
.pill.warn{background:rgba(184,134,59,.14);color:var(--track)}
.pill.bad{background:rgba(177,73,59,.12);color:var(--bad)}

/* ---- engagement list ---- */
.eng-list{list-style:none}
.eng-list li{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1rem;background:var(--card);border:1px solid var(--border);border-radius:8px;margin-bottom:.5rem}
.eng-list li a{text-decoration:none;color:var(--ink);font-weight:600}
.eng-list .meta{font-size:.76rem;color:var(--muted)}

/* ---- stepper ---- */
.stepper{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1.5rem}
.stepper button{font-family:var(--sans);font-size:.72rem;font-weight:600;padding:.45rem .7rem;border:1px solid var(--border-strong);background:var(--card);color:var(--muted);border-radius:999px;cursor:pointer;white-space:nowrap}
.stepper button.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.stepper button.done{border-color:var(--good);color:var(--good)}
.step{display:none}
.step.active{display:block}
.step-actions{display:flex;justify-content:space-between;gap:1rem;margin-top:1.5rem}

/* ---- tables ---- */
table.data{width:100%;border-collapse:collapse;font-size:.85rem}
table.data th,table.data td{text-align:left;padding:.5rem .55rem;border-bottom:1px solid var(--border);vertical-align:top}
table.data th{font-size:.68rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
table.data td input,table.data td select{padding:.35rem .4rem;font-size:.8rem}
.tbl-scroll{overflow-x:auto}

/* ---- KPI strip / gauges ---- */
.kpis{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:1rem}
.kpi{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:1rem 1.1rem;flex:1;min-width:140px}
.kpi .v{font-family:var(--serif);font-size:1.55rem;font-weight:600;line-height:1}
.kpi .v.good{color:var(--good)}.kpi .v.warn{color:var(--warn)}.kpi .v.bad{color:var(--bad)}
.kpi .l{font-size:.64rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-top:.35rem}
.kpi .sub{font-size:.72rem;color:var(--muted);margin-top:.15rem}

.gauge-row{display:flex;gap:1rem;flex-wrap:wrap;margin:.5rem 0 1rem}
.gauge{width:110px;height:110px;position:relative;flex-shrink:0}
.gauge svg{transform:rotate(-90deg)}
.gauge .gn{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.gauge .gn .gv{font-family:var(--serif);font-size:1.5rem;font-weight:600;line-height:1}
.gauge .gn .gl{font-size:.56rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:.1rem}

.chart{width:100%;max-width:680px;height:auto;overflow:visible;display:block}
.chart-wrap{overflow-x:auto;margin:.4rem 0 1rem}

/* ---- print (summary.php) ---- */
@media print{
  .no-print{display:none!important}
  body{background:#fff;font-size:11pt}
  .wrap{max-width:none;padding:0}
  .card{border:none;padding:0;margin:0 0 .6rem}
}
