/* ───────── Notenraum · Liquid-Glass-Design (überlagert style.css) ───────── */
:root{
 --tint:#0a84ff;--tint-strong:#0071e3;--tint-soft:rgba(10,132,255,.12);
 --label:#1d1d1f;--label-2:rgba(60,60,67,.62);--label-3:rgba(60,60,67,.38);
 --hairline:rgba(60,60,67,.12);
 --glass:rgba(255,255,255,.56);--glass-strong:rgba(255,255,255,.74);--glass-edge:rgba(255,255,255,.78);
 --glass-shadow:inset 0 1px 1px rgba(255,255,255,.95),inset 0 -1px 1px rgba(255,255,255,.3),0 1px 2px rgba(17,24,39,.04),0 12px 32px rgba(17,24,39,.07);
 --blur:blur(28px) saturate(185%);
 --ink:var(--label);--muted:var(--label-2);--border:var(--hairline);--green:var(--tint);
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,system-ui,sans-serif;
 color:var(--label);background:#eef1f7;-webkit-font-smoothing:antialiased;
}
html{background:#eef1f7}
body{background:transparent;color:var(--label)}
body::before{content:'';position:fixed;inset:-10%;z-index:-1;pointer-events:none;
 background:
  radial-gradient(42% 38% at 8% 6%,#c9dcff 0%,transparent 70%),
  radial-gradient(38% 34% at 92% 4%,#f3d4ff 0%,transparent 70%),
  radial-gradient(40% 40% at 78% 62%,#d2f1ff 0%,transparent 70%),
  radial-gradient(46% 40% at 12% 88%,#d8f6e6 0%,transparent 70%),
  radial-gradient(36% 30% at 50% 40%,#fff1e2 0%,transparent 70%),
  #eef1f7;}

/* Glasflächen */
.sidebar,.topbar,.subject-card,.stat,.empty,.semester-panel,.table-wrap,.archived-exams,.onboarding,.calendar-grid,
.new-card,.upload-box,.file-row,.offline-banner,.widget,.gallery-item,.today-panel,.login-card,.calendar-agenda .calendar-event,
.grade-slot,.segmented,.secondary,.icon-button,.search input,.tools select,dialog,.w-head-btn,.calendar-toolbar select{
 background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
 border:1px solid var(--glass-edge);box-shadow:var(--glass-shadow);
}

/* Typografie */
h1{font-size:clamp(28px,3.2vw,40px);font-weight:700;letter-spacing:-.9px;color:var(--label)}
h1>span{color:var(--tint)}
.page-heading p:last-child,.section-heading p,#section-subtitle{color:var(--label-2)}
.section-heading h2{font-weight:700;letter-spacing:-.4px;font-size:21px}
.section-heading h2 span{background:var(--tint-soft);color:var(--tint);border-radius:999px;padding:3px 9px;font-weight:600}
.eyebrow{color:var(--label-2);letter-spacing:.8px}
.calculation-note,.modal-desc{color:var(--label-2)}

/* Seitenleiste: schwebendes Glas */
.sidebar{inset:14px auto 14px 14px;width:232px;border-radius:30px;padding:26px 14px 16px;border-right:1px solid var(--glass-edge);height:auto}
.workspace{margin-left:260px}
.brand{color:var(--label);font-weight:700;letter-spacing:-.8px}
.brand-mark{background:linear-gradient(145deg,#5aa9ff,#0a6cff);color:#fff;border-radius:13px;box-shadow:inset 0 1px 1px rgba(255,255,255,.6),0 6px 14px rgba(10,108,255,.3)}
.brand-dot{color:var(--tint)}
.school-label{color:var(--label-3)}
.nav-item{border-radius:14px;color:var(--label-2);font-weight:500;transition:background .2s,color .2s}
.nav-item:hover{background:rgba(255,255,255,.45)}
.nav-item.active,.sidebar .nav-item.active{background:rgba(255,255,255,.85);color:var(--tint);font-weight:600;box-shadow:inset 0 1px 1px #fff,0 4px 14px rgba(17,24,39,.08)}
.profile{border-top:1px solid var(--hairline)}
.avatar{background:linear-gradient(145deg,#e9edf5,#d6dce8);color:var(--label-2)}
.status-dot{background:#34c759}

/* Kopfzeile */
.topbar{position:sticky;top:0;z-index:20;height:64px;border-width:0 0 1px;border-radius:0;box-shadow:none;background:rgba(246,248,252,.55)}
.breadcrumb{color:var(--label-3)}.breadcrumb strong{color:var(--label)}
.icon-button{border-radius:999px;color:var(--label)}

/* Knöpfe */
.primary{border-radius:999px;background:linear-gradient(180deg,#3d9bff,var(--tint-strong));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 20px rgba(0,113,227,.28);font-weight:600;letter-spacing:-.1px}
.primary:hover{background:linear-gradient(180deg,#4aa2ff,#0066cc)}
.secondary{border-radius:999px;color:var(--label);font-weight:500}
.secondary:hover{background:var(--glass-strong)}
.danger{border-radius:999px}
.text-button{color:var(--tint)}
.w-head-btn{color:var(--tint);border-radius:999px}
.w-head-btn.done{background:linear-gradient(180deg,#3d9bff,var(--tint-strong));color:#fff;border-color:transparent}

/* Segmented Control */
.segmented{border-radius:999px;padding:4px}
.segmented button{border-radius:999px;color:var(--label-2);font-weight:500}
.segmented button.active{background:#fff;color:var(--label);box-shadow:0 3px 10px rgba(17,24,39,.12),inset 0 1px 0 #fff}

/* Eingaben */
input,textarea,select{border-radius:12px;border:1px solid var(--hairline);background:rgba(255,255,255,.72);color:var(--label)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--tint);box-shadow:0 0 0 4px rgba(10,132,255,.18)}
.search input,.tools select{border-radius:999px}
input[type=checkbox]{accent-color:var(--tint)}
input[type=color]{border-radius:12px}

/* Karten */
.subject-card{border-radius:26px;padding:20px}
.subject-card:before{display:none}
.subject-card:hover{transform:translateY(-3px);box-shadow:var(--glass-shadow),0 18px 40px rgba(17,24,39,.1)}
.subject-symbol{border-radius:13px;box-shadow:inset 0 1px 1px rgba(255,255,255,.7)}
.subject-title h3{font-weight:650;font-size:17px;letter-spacing:-.3px}
.subject-title small,.card-bottom{color:var(--label-3)}
.card-bottom button{color:var(--tint);font-weight:600}
.pin{color:#ff9f0a}
.grade-metrics .overall{border-radius:16px}
.new-card{border-radius:26px;border-style:dashed;border-color:rgba(60,60,67,.18);background:rgba(255,255,255,.3)}
.new-card>span{background:var(--tint-soft);color:var(--tint)}
.stat{border-radius:24px}
.stat.featured{background:linear-gradient(160deg,rgba(10,132,255,.16),rgba(255,255,255,.55));border-color:rgba(255,255,255,.8)}
.stat-value{font-weight:700;letter-spacing:-1.5px}
.empty,.onboarding,.archived-exams{border-radius:24px}
.onboarding{background:linear-gradient(160deg,rgba(10,132,255,.1),rgba(255,255,255,.5))}
.semester-panel{border-radius:26px}
.semester-title>span,.abi-badge{background:var(--tint-soft);color:var(--tint);border-radius:999px}
.abi-row{background:rgba(10,132,255,.06)}
.grade-slot{border-radius:18px;border:1px dashed rgba(60,60,67,.2);background:rgba(255,255,255,.32);box-shadow:none}
.grade-slot.has-entry{border-style:solid;border-color:var(--glass-edge);background:rgba(255,255,255,.72);box-shadow:var(--glass-shadow)}
.grade-slot:hover{border-color:var(--tint);background:rgba(255,255,255,.8)}
.grade-slot.abi-result,.grade-slot.abi-result:hover{background:rgba(255,255,255,.5);border:1px solid var(--glass-edge)}
.grade-slot.abi-result.featured,.grade-slot.abi-result.featured:hover{background:linear-gradient(160deg,rgba(10,132,255,.18),rgba(255,255,255,.6))}
.abi-missing{background:rgba(255,255,255,.3)}
.form-error{color:#d70015}

/* Tabellen & Dokumente */
.table-wrap{border-radius:22px}
th{background:transparent;color:var(--label-3);border-bottom:1px solid var(--hairline)}
td{border-color:var(--hairline)}
.file-row,.upload-box{border-radius:16px}
.upload-box{border-style:dashed;border-color:rgba(60,60,67,.2)}

/* Kalender */
.calendar-grid{border-radius:26px;gap:4px;padding:6px;background:var(--glass)}
.calendar-weekday{background:transparent;color:var(--label-3);font-weight:600}
.calendar-day{background:rgba(255,255,255,.55);border-radius:14px}
.calendar-day.muted{background:rgba(255,255,255,.22);color:var(--label-3)}
.calendar-day.today{background:rgba(255,255,255,.85)}
.today .calendar-day-number{background:#ff3b30;color:#fff;font-weight:700}
.calendar-event{border-radius:9px;background:color-mix(in srgb,var(--event-color) 13%,rgba(255,255,255,.6))!important}
.calendar-agenda .calendar-event{border-radius:16px}
.calendar-more{color:var(--tint)}

/* Dialoge */
dialog{border-radius:30px;background:rgba(250,251,253,.8);-webkit-backdrop-filter:blur(40px) saturate(190%);backdrop-filter:blur(40px) saturate(190%);box-shadow:inset 0 1px 1px #fff,0 30px 80px rgba(17,24,39,.22)}
dialog::backdrop{background:rgba(20,24,33,.18);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.modal-title{font-weight:700;letter-spacing:-.6px}
.modal-top .icon-button{background:rgba(120,120,128,.14);border:0;box-shadow:none;color:var(--label-2)}
.form-actions{border-top-color:var(--hairline)}
.swatch span{border-color:rgba(255,255,255,.9)}
.icon-choices button{border-radius:14px;background:rgba(255,255,255,.55);border-color:var(--hairline)}
.icon-choices button[aria-pressed=true]{background:var(--tint-soft);border-color:var(--tint);box-shadow:0 0 0 1px var(--tint)}
.preview-result{background:var(--tint-soft);color:var(--tint-strong);border-radius:14px}

/* Hinweise & Toast */
.offline-banner{border-radius:20px;background:linear-gradient(160deg,rgba(255,204,0,.18),rgba(255,255,255,.6));color:#7a5a00}
#toast{border-radius:999px;background:rgba(28,28,30,.72);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:0 10px 30px rgba(0,0,0,.2);padding:12px 20px}
footer{border-top-color:var(--hairline);color:var(--label-3)}

/* Widgets */
.widget{border-radius:26px}
.w-countdown{background:linear-gradient(160deg,rgba(255,94,130,.92),rgba(214,51,108,.92))}
.w-abi{background:linear-gradient(160deg,rgba(64,156,255,.92),rgba(0,92,214,.94))}
.w-countdown,.w-abi{border-color:rgba(255,255,255,.35);box-shadow:inset 0 1px 1px rgba(255,255,255,.55),0 14px 34px rgba(17,24,39,.14)}
.w-term{--accent:#30b0c7}.w-favorites{--accent:#ff9f0a}.w-recent{--accent:var(--tint)}.w-distribution{--accent:#af52de}.w-backup{--accent:#8e8e93}
.w-chip{background:var(--tint-soft);color:var(--tint)}
.w-tiles button{background:color-mix(in srgb,var(--c) 14%,rgba(255,255,255,.55))}
.w-bar b{background:rgba(120,120,128,.14)}
.dist span{background:linear-gradient(180deg,#5ac8fa,var(--tint))}
.dist span.low{background:linear-gradient(180deg,#ffb340,#ff7a45)}
.gallery-item{border-radius:26px}

/* ── Größen ── */
@media(max-width:1200px){.sidebar{width:196px;padding:24px 10px 14px}.workspace{margin-left:222px}}
@media(max-width:800px){.sidebar{width:80px;padding:20px 8px}.workspace{margin-left:106px}}
@media(max-width:540px){
 /* Schwebende Tab-Leiste unten wie in iOS */
 .sidebar{position:fixed;inset:auto 12px calc(10px + env(safe-area-inset-bottom)) 12px;top:auto;width:auto;height:68px;padding:6px;border-radius:34px;z-index:40;border-bottom:1px solid var(--glass-edge);background:rgba(255,255,255,.62);box-shadow:inset 0 1px 1px #fff,0 14px 40px rgba(17,24,39,.18)}
 .sidebar nav{gap:2px}
 .sidebar .nav-item{height:56px;min-height:56px;border-radius:28px;padding:6px 1px;gap:3px}
 .sidebar .nav-item>.nav-label{font-size:10px;font-weight:600}
 .sidebar .nav-icon{width:24px;height:24px;flex-basis:24px}
 .sidebar .nav-item.active{box-shadow:inset 0 1px 1px #fff,0 4px 12px rgba(17,24,39,.1)}
 .workspace{margin:0}
 main{padding-bottom:110px}
 .topbar{height:52px;padding:0 18px;padding-top:env(safe-area-inset-top);height:calc(52px + env(safe-area-inset-top))}
 #toast{bottom:calc(92px + env(safe-area-inset-bottom))}
 .subject-card,.semester-panel,.widget{border-radius:24px}
 h1{font-size:30px}
}
@media(prefers-reduced-transparency:reduce){
 .sidebar,.topbar,.subject-card,.stat,.empty,.semester-panel,.table-wrap,.widget,dialog,.segmented,.secondary,.icon-button{background:rgba(255,255,255,.95);-webkit-backdrop-filter:none;backdrop-filter:none}
}
.section-heading h2 span:empty{display:none}
.pin.is-pinned{color:#ff9f0a}
@media(max-width:540px){.sidebar{background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(30px) saturate(200%);backdrop-filter:blur(30px) saturate(200%)}}
.widget-board.empty-board{margin:20px 0 0}
.widget-board.empty-board .widgets-head h2{color:var(--label-3);font-weight:500;font-size:13px}
.gallery-reset{display:flex;gap:8px;flex-wrap:wrap}
.empty-icon,.onboarding>span{color:var(--tint)}
