:root{
      --navy:#173b6d;
      --blue:#8fd3ff;
      --blue2:#e9f7ff;
      --pink:#ffd6e0;
      --green:#dff5cf;
      --yellow:#fff1b8;
      --cream:#fffaf2;
      --red:#ff667a;
      --purple:#efe8ff;
      --shadow:0 10px 28px rgba(39,74,111,.12);
    }
    *{box-sizing:border-box}
    body{
      margin:0;
      font-family:Arial, Helvetica, sans-serif;
      background:linear-gradient(180deg,#fdfefe,#f8fbff);
      color:var(--navy);
    }
    .wrap{max-width:1320px;margin:0 auto;padding:24px}
    .hero{
      background:#eaf7ff;
      border:3px dashed #6ec1ef;
      border-radius:28px;
      text-align:center;
      padding:18px 16px;
      margin-bottom:22px;
      box-shadow:var(--shadow);
    }
    .hero h1{margin:0;font-size:clamp(34px,5vw,62px);line-height:1}
    .hero p{margin:8px 0 0;font-size:19px}
    .layout{display:grid;grid-template-columns:1.45fr .75fr;gap:22px;align-items:start}
    .panel{
      background:#fff;
      border-radius:28px;
      box-shadow:var(--shadow);
      padding:20px;
      border:2px solid #dbeefa;
    }
    h2{margin:0 0 10px;font-size:32px}
    .hint{margin:0 0 18px;color:#486887;line-height:1.45}

    .schedule{display:flex;flex-direction:column;gap:8px}
    .row{
      display:grid;
      grid-template-columns:56px 190px 1fr 128px;
      gap:12px;
      align-items:center;
      padding:11px 12px;
      border-radius:22px;
      border:2px solid rgba(23,59,109,.08);
      min-height:96px;
    }
    .lesson-row{background:#edf8ff}
    .break-row{
      background:#fff1f1;
      min-height:82px;
      border-style:dashed;
      border-color:#b7a9e8;
      margin:0;
    }
    .num{
      width:44px;height:44px;border-radius:14px;background:#fff;
      display:grid;place-items:center;font-weight:700;font-size:24px;
      box-shadow:0 4px 12px rgba(0,0,0,.06)
    }
    .break-row .num{font-size:25px;background:#f8f5ff}
    .time{font-weight:700;min-width:0}
    .time-label{display:block;font-size:13px;color:#68819b;margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em}
    .fixed-time{
      display:none;align-items:center;justify-content:center;
      min-width:105px;padding:10px 8px;background:#fff;border-radius:12px;
      border:2px solid rgba(23,59,109,.1);font-size:17px;
    }
    .time-editor{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:7px;width:100%}
    .time-input{
      width:100%;min-width:0;padding:10px 7px;border:2px solid #cfe1ee;border-radius:10px;
      background:#fff;color:#173b6d;font:700 15px Arial,Helvetica,sans-serif;
    }
    .time-input:focus{outline:3px solid rgba(90,178,231,.22);border-color:#5ab2e7}
    .time-separator{font-weight:800;color:#68819b}

    .time-current{display:block;margin-top:6px;font-size:13px;color:#58738f;font-weight:700}
    .time-current strong{color:#173b6d;font-size:15px}
    .preview-mode .time-editor{display:none}
    .preview-mode .fixed-time{display:inline-flex}
    .type-title{font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#725ca6;margin-bottom:5px}
    .dropzone{
      min-height:68px;border:3px dashed #9baec0;border-radius:18px;
      display:flex;align-items:center;justify-content:center;
      padding:7px;background:rgba(255,255,255,.6);transition:.18s;
    }
    .break-row .dropzone{border-color:#b6a6df;background:rgba(255,255,255,.72)}
    .dropzone.dragover{transform:scale(1.012);border-color:#368ec4;background:#edf9ff}
    .empty{color:#7a8ea4;text-align:center;font-weight:700;font-size:15px}
    .activity-card{
      width:100%;display:flex;align-items:center;gap:12px;padding:9px 13px;
      border-radius:16px;background:#fff;border:2px solid #cfe5f4;
      font-weight:700;font-size:18px;box-shadow:0 4px 12px rgba(31,74,110,.08)
    }
    .break-row .activity-card{border-color:#d9cff3}
    .activity-card .ico{font-size:31px}
    .tile[data-id="break"] .ico, .activity-break .ico{color:#d62828}
    .actions{display:flex;flex-direction:column;gap:7px}
    button{
      border:0;border-radius:14px;padding:9px 10px;font-weight:700;cursor:pointer;
      font-size:14px;transition:.15s
    }
    button:hover{transform:translateY(-1px)}
    .remove{background:#ffe5ea;color:#b3243a}
    .break-row .remove{background:#f7eefe;color:#7d4ca8}

    .library{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
    .library-heading{
      grid-column:1/-1;margin:8px 0 2px;padding:10px 12px;border-radius:14px;
      background:#eef7ff;border:1px solid #cfe7f7;font-weight:800;font-size:18px;color:#245f8c;
    }
    .tile{
      position:relative;
      background:#fff;border:2px dashed #79b8dc;border-radius:20px;padding:14px 10px 12px;
      text-align:center;cursor:grab;user-select:none;min-height:132px;
      display:flex;flex-direction:column;justify-content:center;align-items:center;gap:7px;
    }
    .tile:active{cursor:grabbing}
    .tile .ico{font-size:49px;display:flex;align-items:center;justify-content:center}
    .tile .ico svg{width:48px;height:48px;display:block}
    .activity-card .ico svg{width:30px;height:30px;display:block}
    .tile .name{font-weight:700;font-size:17px;padding:0 20px}
    .selected{outline:4px solid #5ab2e7}
    .library-empty{
      grid-column:1/-1;padding:28px 12px;border:2px dashed #c8d6e4;border-radius:18px;
      text-align:center;color:#70879e;background:#f9fbfd;
    }
    .legend{
      margin-top:14px;padding:12px 14px;background:#f8fbff;border-radius:16px;
      font-size:13px;line-height:1.45;color:#58738f
    }
    .footer{
      margin-top:20px;background:#eefbe8;border:2px solid #b7e1a9;border-radius:22px;
      padding:14px 18px;text-align:center;font-weight:700
    }
    .clearall{margin-top:14px;width:100%;background:#f4f7fb;color:#4c6683}

    /* Prawa biblioteka pozostaje widoczna i przewija się niezależnie. */
    .library-panel{
      position:sticky;
      top:16px;
      max-height:calc(100vh - 32px);
      overflow-y:auto;
      overscroll-behavior:contain;
      scrollbar-gutter:stable;
    }
    .library-panel::-webkit-scrollbar{width:11px}
    .library-panel::-webkit-scrollbar-track{background:#eef6fb;border-radius:12px}
    .library-panel::-webkit-scrollbar-thumb{background:#a9cfe6;border-radius:12px;border:3px solid #eef6fb}
    .library-panel{scrollbar-width:thin;scrollbar-color:#a9cfe6 #eef6fb}


    .modebar{display:flex;gap:10px;justify-content:flex-end;margin-bottom:14px;flex-wrap:wrap}
    .modebtn{background:#e8f5ff;color:#176ca3;padding:10px 14px}
    .modebtn.active{background:#176ca3;color:#fff}
    .preview-mode .layout{grid-template-columns:1fr}
    .preview-mode .library-panel{display:none}
    .preview-mode .clearall{display:none}
    .preview-mode .actions{display:none}
    .preview-mode .row{grid-template-columns:56px 128px 1fr}
    .preview-mode .dropzone{pointer-events:none}
    .preview-note{display:none;margin:0 0 14px;padding:12px 14px;background:#eefbe8;border:2px solid #b7e1a9;border-radius:16px;font-weight:700}
    .preview-mode .preview-note{display:block}

    @media(max-width:940px){
      .layout{grid-template-columns:1fr}
      .library-panel{
        position:static;
        max-height:none;
        overflow:visible;
      }
    }
    @media(max-width:650px){
      .wrap{padding:10px}
      .panel{padding:13px}
      .row{grid-template-columns:44px 1fr;gap:8px}
      .time{grid-column:2}
      .time-editor{flex-wrap:wrap}
      .time-input{width:92px}
      .dropzone{grid-column:1/3}
      .actions{grid-column:1/3;flex-direction:row}
      .actions button{flex:1}
      .break-row{margin:0}
      .library{grid-template-columns:1fr 1fr}
      h2{font-size:26px}
    }

/* ===== Prosty i wyraźny tryb podglądu ===== */
.preview-mode .wrap{max-width:900px;padding:16px}
.preview-mode .hero{margin-bottom:12px;padding:14px 16px;border:0;border-radius:20px;box-shadow:none;background:#eaf7ff}
.preview-mode .hero h1{font-size:clamp(34px,5vw,50px)}
.preview-mode .hero p{font-size:17px}
.preview-mode .modebar{justify-content:center;margin-bottom:12px}
.preview-mode .panel{padding:14px;border-radius:20px;box-shadow:none;border:0;background:#fff}
.preview-mode .panel>h2,.preview-mode .hint{display:none}
.preview-mode .preview-note{display:none}
.preview-mode .schedule{gap:10px}
.preview-mode .row{
  display:grid;
  grid-template-columns:265px 1fr;
  gap:14px;
  align-items:center;
  min-height:78px;
  padding:10px 14px;
  border-radius:18px;
  border:2px solid #dbe7f0;
  background:#f8fbfd;
  margin:0;
}
/* W podglądzie ukrywamy kafelek z numerem po lewej, ale pokazujemy podpis Lekcja 1, Lekcja 2 itd. */
.preview-mode .preview-hidden{display:none !important}
.preview-mode .lesson-row .num{display:none}
.preview-mode .lesson-row .time-label{
  display:inline-flex;
  margin:0 10px 0 0;
  font-size:17px;
  line-height:1;
  font-weight:900;
  color:#2b5f89;
  text-transform:none;
  letter-spacing:.01em;
  white-space:nowrap;
}
.preview-mode .lesson-row .time{grid-column:1;display:flex;flex-direction:row;align-items:center;gap:0;white-space:nowrap}
.preview-mode .lesson-row>div:nth-child(3){grid-column:2}
.preview-mode .fixed-time{
  min-width:135px;
  padding:12px 10px;
  font-size:21px;
  font-weight:800;
  border:0;
  border-radius:14px;
  background:#eaf4fb;
  color:#173b6d;
  box-shadow:none;
}
.preview-mode .type-title{display:none}
.preview-mode .dropzone{
  min-height:58px;
  border:0;
  background:transparent;
  padding:0;
  justify-content:flex-start;
}
.preview-mode .activity-card{
  min-height:60px;
  padding:10px 16px;
  border-radius:16px;
  font-size:24px;
  font-weight:800;
  border:0;
  background:#fff;
  box-shadow:0 2px 8px rgba(39,74,111,.08);
}
.preview-mode .activity-card .ico{font-size:38px;min-width:46px}
.preview-mode .activity-card .ico svg{width:42px;height:42px}
.preview-mode .empty{
  width:100%;
  padding:12px 16px;
  border:2px dashed #d5e0e8;
  border-radius:14px;
  background:#fff;
  color:#a0adba;
  text-align:left;
  font-size:17px;
}
/* Przerwy jako prosty osobny wiersz z czerwonym dzwonkiem */
.preview-mode .break-row{
  grid-template-columns:58px 155px 1fr;
  min-height:66px;
  margin:0 24px;
  background:#fff5f5;
  border:2px solid #efc1c1;
}
.preview-mode .break-row .num{
  display:grid;
  width:48px;
  height:48px;
  border:0;
  background:transparent;
  box-shadow:none;
  font-size:0;
}
.preview-mode .break-row .num::after{
  content:'🔔';
  font-size:29px;
  filter:hue-rotate(325deg) saturate(4);
}
.preview-mode .break-row .time{grid-column:2}
.preview-mode .break-row .time-label{display:none}
.preview-mode .break-row>div:nth-child(3){grid-column:3}
.preview-mode .break-row .fixed-time{background:#ffe8e8;color:#9f1d1d}
.preview-mode .break-row .activity-card{background:#fff;border:0}
.preview-mode .actions,.preview-mode .clearall,.preview-mode .library-panel,.preview-mode .footer{display:none}
.preview-mode .layout{grid-template-columns:1fr}
.preview-mode .dropzone{pointer-events:none}

@media(max-width:650px){
  .preview-mode .wrap{padding:8px}
  .preview-mode .row{grid-template-columns:1fr;gap:8px;padding:10px}
  .preview-mode .lesson-row .time,.preview-mode .lesson-row>div:nth-child(3){grid-column:1}
  .preview-mode .lesson-row .time{flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px}
  .preview-mode .lesson-row .time-label{margin:0}
  .preview-mode .fixed-time{width:auto;font-size:19px}
  .preview-mode .activity-card{font-size:21px}
  .preview-mode .break-row{grid-template-columns:48px 1fr;margin:0 8px}
  .preview-mode .break-row .num{grid-column:1;grid-row:1/3}
  .preview-mode .break-row .time{grid-column:2}
  .preview-mode .break-row>div:nth-child(3){grid-column:2}
}


/* ===== Drukowanie i eksport ===== */
.exportbtn{background:#f1f7fb;color:#244e72;border:1px solid #d4e5f1}
.pdfbtn{background:#fff0f1;color:#a61f2d;border-color:#f0c6ca}
.exportbtn:disabled{opacity:.55;cursor:wait;transform:none}

@media print{
  @page{size:A4 portrait;margin:10mm}
  body{background:#fff!important;color:#173b6d!important}
  .wrap{max-width:none!important;padding:0!important;margin:0!important}
  .hero{margin:0 0 8mm!important;padding:5mm!important;border:0!important;box-shadow:none!important;background:#eef8ff!important;border-radius:5mm!important}
  .hero h1{font-size:28pt!important}
  .hero p{font-size:11pt!important}
  .modebar,.library-panel,.clearall,.footer,.actions,.hint,.preview-note,.time-editor{display:none!important}
  .layout{display:block!important}
  .panel{padding:0!important;border:0!important;box-shadow:none!important}
  .panel>h2{display:none!important}
  .schedule{gap:3mm!important}
  .row.preview-hidden{display:none!important}
  .row{break-inside:avoid;page-break-inside:avoid;box-shadow:none!important}
  .lesson-row{
    display:grid!important;
    grid-template-columns:58mm 1fr!important;
    gap:4mm!important;
    min-height:18mm!important;
    padding:3mm 4mm!important;
    margin:0!important;
    border:1px solid #cfdde8!important;
    border-radius:4mm!important;
    background:#f8fbfd!important;
  }
  .lesson-row .num{display:none!important}
  .lesson-row .time{display:flex!important;align-items:center!important;gap:3mm!important;white-space:nowrap!important}
  .lesson-row .time-label{display:inline-flex!important;margin:0!important;font-size:12pt!important;font-weight:800!important;color:#245f8c!important;text-transform:none!important;letter-spacing:0!important}
  .lesson-row>div:nth-child(3){display:block!important}
  .fixed-time{display:inline-flex!important;min-width:30mm!important;padding:3mm!important;font-size:12pt!important;border:0!important;background:#eaf4fb!important}
  .dropzone{min-height:12mm!important;border:0!important;background:transparent!important;padding:0!important;justify-content:flex-start!important}
  .activity-card{min-height:12mm!important;padding:2.5mm 4mm!important;border:0!important;box-shadow:none!important;font-size:14pt!important;background:#fff!important}
  .activity-card .ico{font-size:22pt!important;min-width:10mm!important}
  .activity-card .ico svg{width:9mm!important;height:9mm!important}
  .type-title{display:none!important}
  .break-row{
    display:grid!important;
    grid-template-columns:14mm 36mm 1fr!important;
    gap:3mm!important;
    min-height:15mm!important;
    margin:0 5mm!important;
    padding:2.5mm 4mm!important;
    border:1px solid #e8b4b4!important;
    border-radius:4mm!important;
    background:#fff5f5!important;
  }
  .break-row .num{display:grid!important;width:10mm!important;height:10mm!important;font-size:0!important;background:transparent!important;box-shadow:none!important}
  .break-row .num::after{content:'🔔';font-size:20pt!important}
  .break-row .time{display:block!important}
  .break-row .time-label{display:none!important}
  .break-row>div:nth-child(3){display:block!important}
  .break-row .fixed-time{background:#ffe8e8!important;color:#9f1d1d!important}
}

/* W podglądzie można usunąć całą zaplanowaną pozycję; biblioteka pozostaje niezmieniona. */
.preview-remove{display:none}
.preview-mode .row{position:relative;padding-right:106px}
.preview-mode .preview-remove{
  display:inline-flex;position:absolute;right:12px;top:50%;transform:translateY(-50%);
  align-items:center;justify-content:center;min-width:78px;
  padding:10px 11px;background:#ffe8ed;color:#a61e37;border:1px solid #f0bbca;
  border-radius:12px;font-weight:800;font-size:13px;cursor:pointer;z-index:2;
}
.preview-mode .preview-remove:hover{background:#ffdce5;transform:translateY(-50%)}
@media(max-width:650px){
  .preview-mode .row{padding-right:88px}
  .preview-mode .preview-remove{right:6px;min-width:70px;font-size:12px;padding:9px 6px}
}
@media print{.preview-remove,.preview-mode .preview-remove{display:none!important}.preview-mode .row{padding-right:3mm!important}}


/* ===== Ujednolicenie wierszy v24 ===== */
.row{width:100%}
.lesson-row{background:#edf8ff!important;border-color:#cfe5f4!important}
.break-row{background:#fff1f1!important;border-color:#e7b5b5!important;margin-left:0!important;margin-right:0!important}
.actions{align-self:stretch;justify-content:center}
.actions .remove{width:100%}
.preview-mode .lesson-row{background:#edf8ff!important}
.preview-mode .break-row{background:#fff1f1!important}
@media(max-width:650px){
  .row{grid-template-columns:44px 1fr}
  .time-editor{grid-template-columns:1fr auto 1fr;width:100%;max-width:320px}
}

/* ===== Szerszy układ i czytelniejsze nazwy v25 ===== */
.wrap{max-width:1580px;padding-left:28px;padding-right:28px}
.layout{grid-template-columns:minmax(0,1.9fr) minmax(330px,.7fr);gap:24px}
.row{grid-template-columns:56px 205px minmax(420px,1fr) 120px}
.dropzone{min-height:72px;padding:8px 10px}
.activity-card{font-size:22px;font-weight:800;line-height:1.2;padding:12px 16px}
.activity-card .ico{font-size:34px;min-width:38px}
.activity-card .ico svg{width:34px;height:34px}

/* Delikatnie mniejsze kafelki po prawej */
.library{gap:10px}
.tile{min-height:116px;padding:10px 8px;border-radius:17px;gap:5px}
.tile .ico{font-size:42px}
.tile .ico svg{width:42px;height:42px}
.tile .name{font-size:15px;line-height:1.15;padding:0 8px}
.library-heading{font-size:17px;padding:9px 11px}

@media(max-width:1180px){
  .wrap{max-width:1180px;padding-left:18px;padding-right:18px}
  .layout{grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr)}
  .row{grid-template-columns:52px 185px minmax(300px,1fr) 112px}
  .activity-card{font-size:20px}
}

@media(max-width:940px){
  .wrap{padding-left:14px;padding-right:14px}
  .layout{grid-template-columns:1fr}
  .row{grid-template-columns:56px 205px minmax(0,1fr) 120px}
}

@media(max-width:650px){
  .wrap{padding:10px}
  .row{grid-template-columns:44px 1fr}
  .activity-card{font-size:20px}
  .tile{min-height:108px}
  .tile .name{font-size:14px}
}

/* Wersja 26: kompaktowe zakładki w bibliotece po prawej. */
.library-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:12px 0 16px}
.library-tab{border:1px solid #cfe5f5;border-radius:12px;padding:11px 5px;background:#f0f8ff;color:#246588;font-size:13px;font-weight:800;cursor:pointer;white-space:normal;line-height:1.3;min-width:0}
.library-tab.active{background:#176ca3;border-color:#176ca3;color:#fff;box-shadow:0 3px 9px rgba(23,108,163,.18)}
.library-tab:focus-visible{outline:3px solid #65b4e4;outline-offset:2px}
@media(max-width:420px){.library-tab{font-size:12px;padding:10px 3px}}

/* Cztery zakładki. Ikony w nagłówkach zmniejszone o 30%. */
.library-tabs{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.library-tab{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;padding:9px 3px;font-size:11px;min-height:58px;overflow-wrap:anywhere}
.library-tab .tab-icon{display:block;font-size:14px;line-height:1;flex-shrink:0}
@media(max-width:620px){.library-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.library-tab{font-size:12px}}

/* Panel schematów czasu – bez zmian w układzie pozostałych sekcji */
.timing-box{background:#f1f8fd;border:1px solid #cde4f5;border-radius:16px;padding:16px;margin:14px 0 20px}
.timing-heading{font-size:17px;font-weight:800;color:#1b4d75;margin-bottom:12px}
.timing-controls{display:flex;gap:12px;align-items:end;flex-wrap:wrap}
.timing-controls label{display:flex;flex-direction:column;gap:5px;font-weight:700;color:#285271;font-size:12px;min-width:150px;flex:1}
.timing-controls input,.timing-controls select{width:100%;box-sizing:border-box;min-height:40px;border:1px solid #bcd7e9;border-radius:10px;background:white;color:#193f5f;font:inherit;padding:7px 10px}
.timing-controls label:first-child{flex:2;min-width:220px}
.timing-custom{display:flex;gap:12px;flex:2;min-width:220px}
.timing-custom[hidden]{display:none}
.timing-apply{border:0;background:#167bc1;color:white;padding:12px 18px;border-radius:11px;font-weight:800;cursor:pointer;min-height:40px}
.timing-apply:hover{background:#0d619a}
.timing-note{font-size:12px;color:#55778d;margin:10px 0 0;line-height:1.5}
.preview-mode .timing-box{display:none!important}
@media print{.timing-box{display:none!important}}

/* v33: przywrócone oryginalne ikony, trzy mniejsze kafelki w rzędzie. */
.library { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.library .tile { min-width:0; min-height:108px; padding:9px 3px; gap:5px; }
.library .tile .ico { font-size:42px; }
.library .tile .ico svg { width:42px; height:42px; }
.library .tile .name { font-size:13px; line-height:1.18; padding:0 2px; overflow-wrap:anywhere; hyphens:auto; }
@media(max-width:650px){.library{grid-template-columns:repeat(3,minmax(0,1fr));}}


/* v34: tylko lista wyboru schematu – bez dodatkowych ustawień */
.timing-box{padding:12px 16px;margin:14px 0 16px}
.timing-heading{display:block;margin:0 0 8px}
#timePreset{display:block;width:100%;min-height:42px;border:1px solid #bcd7e9;border-radius:10px;background:#fff;color:#193f5f;padding:8px 12px;font:inherit}

/* v35: nazwy przedmiotów i czynności w planie lekcji oraz przerw wielkimi literami. */
.schedule .activity-card > span:not(.ico) {
  text-transform: uppercase;
}

/* v36 – szersze pole godzin w podglądzie, zawsze jeden wiersz „od–do”. */
@media screen and (min-width:651px) {
  .preview-mode .lesson-row {
    grid-template-columns: 350px minmax(0, 1fr);
  }
  .preview-mode .lesson-row .time {
    min-width:0;
    flex-wrap:nowrap;
  }
}
.preview-mode .fixed-time {
  white-space: nowrap;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}
@media screen and (max-width:650px) {
  .preview-mode .lesson-row .time { flex-wrap:nowrap; }
  .preview-mode .lesson-row .fixed-time {font-size:clamp(15px,4vw,19px)}
}
@media print {
  .lesson-row {grid-template-columns:72mm minmax(0,1fr)!important}
  .lesson-row .time {flex-wrap:nowrap!important}
  .fixed-time {white-space:nowrap!important}
}

/* v37 – spójne kolumny podglądu oraz zwarty harmonogram. */
@media screen and (min-width:941px){
  .layout{grid-template-columns:minmax(0,1.9fr) minmax(330px,.7fr)}
  .row{grid-template-columns:42px minmax(165px,185px) minmax(0,1fr) 102px}
}
@media screen{
  .schedule{gap:5px}
  .schedule .row{min-height:54px;padding:5px 9px;gap:8px;border-radius:12px}
  .schedule .num{width:34px;height:34px;font-size:18px;border-radius:10px}
  .schedule .time-label{font-size:11px;margin-bottom:2px}
  .schedule .time-input{font-size:13px;padding:6px 4px;border-width:1px;border-radius:7px}
  .schedule .time-editor{gap:3px}
  .schedule .dropzone{min-height:41px;padding:3px;border-width:2px;border-radius:9px}
  .schedule .activity-card{min-height:40px;padding:4px 9px;font-size:16px;line-height:1.15;gap:8px;border-radius:9px}
  .schedule .activity-card .ico{font-size:27px;min-width:28px}
  .schedule .activity-card .ico svg{width:27px;height:27px}
  .schedule .empty{font-size:12px}
  .schedule .type-title{font-size:10px;margin-bottom:2px}
  .schedule .actions .remove{padding:7px 3px;font-size:12px}
  .preview-mode .wrap{max-width:1100px}
  .preview-mode .schedule{gap:5px}
  .preview-mode .schedule .row,
  .preview-mode .schedule .lesson-row,
  .preview-mode .schedule .break-row{
    display:grid;
    grid-template-columns: minmax(0,250px) minmax(0,1fr);
    gap:10px;min-height:51px;margin:0;
    padding:4px 95px 4px 10px;
    border-radius:11px;
    align-items:center;
  }
  .preview-mode .schedule .row>.num{display:none}
  .preview-mode .schedule .row>.time{grid-column:1;min-width:0;display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
  .preview-mode .schedule .row>.time .time-label{display:inline-block;width:75px;flex:0 0 75px;font-size:13px;line-height:1.15;margin:0;white-space:nowrap;text-transform:none}
  .preview-mode .schedule .break-row>.time .time-label{display:inline-block}
  .preview-mode .schedule .row>.time .fixed-time{display:inline-flex;width:130px;min-width:130px;flex:0 0 130px;padding:7px 5px;font-size:16px;justify-content:center;white-space:nowrap}
  .preview-mode .schedule .row>div:nth-child(3){grid-column:2;min-width:0}
  .preview-mode .schedule .row .dropzone{min-height:40px}
  .preview-mode .schedule .row .activity-card{min-height:40px;padding:4px 10px;font-size:17px;width:100%}
  .preview-mode .schedule .row .activity-card .ico{font-size:27px;min-width:32px}
  .preview-mode .schedule .row .activity-card .ico svg{width:28px;height:28px}
  .preview-mode .schedule .row .empty{padding:7px 9px;font-size:13px;border-radius:8px}
  .preview-mode .schedule .row .preview-remove{right:8px;min-width:76px;padding:7px 6px;font-size:12px}
}
@media screen and (max-width:650px){
  .preview-mode .schedule .row,
  .preview-mode .schedule .lesson-row,
  .preview-mode .schedule .break-row{grid-template-columns:minmax(0,1fr);padding:6px 8px 6px 8px;gap:4px}
  .preview-mode .schedule .row>.time,
  .preview-mode .schedule .row>div:nth-child(3){grid-column:1}
  .preview-mode .schedule .row>.time{padding-right:78px}
  .preview-mode .schedule .row>.time .time-label{width:68px;flex-basis:68px}
  .preview-mode .schedule .row>.time .fixed-time{width:120px;min-width:120px;flex-basis:120px;font-size:14px}
  .preview-mode .schedule .row .preview-remove{top:20px;transform:none;right:6px;padding:5px;min-width:64px}
}
@media print{
  @page{size:A4 portrait;margin:8mm}
  .hero{padding:2mm!important;margin:0 0 3mm!important;border-radius:2mm!important}
  .hero h1{font-size:20pt!important}
  .hero p{display:none!important}
  .schedule{gap:1.5mm!important}
  .schedule .row,.schedule .lesson-row,.schedule .break-row{
    display:grid!important;
    grid-template-columns:48mm minmax(0,1fr)!important;
    min-height:11mm!important;
    gap:2mm!important;
    padding:1mm 2mm!important;
    margin:0!important;
    border-radius:2mm!important;
    break-inside:avoid!important;
  }
  .schedule .row>.num{display:none!important}
  .schedule .row>.time{grid-column:1!important;display:flex!important;align-items:center!important;white-space:nowrap!important;gap:2mm!important}
  .schedule .row>.time .time-label{display:inline-block!important;width:16mm!important;flex:0 0 16mm!important;margin:0!important;font-size:9pt!important;white-space:nowrap!important;line-height:1!important}
  .schedule .row>.time .fixed-time{display:inline-flex!important;justify-content:center!important;width:29mm!important;min-width:29mm!important;padding:1mm!important;font-size:10pt!important;white-space:nowrap!important}
  .schedule .row>div:nth-child(3){grid-column:2!important;min-width:0!important}
  .schedule .row .type-title{display:none!important}
  .schedule .row .dropzone{min-height:9mm!important}
  .schedule .row .activity-card{min-height:9mm!important;padding:1mm 2mm!important;font-size:11pt!important;line-height:1.1!important}
  .schedule .row .activity-card .ico{font-size:16pt!important;min-width:8mm!important}
  .schedule .row .activity-card .ico svg{width:7mm!important;height:7mm!important}
  .schedule .row .empty{font-size:9pt!important;padding:1mm!important}
}

/* v38: ikona dzwonka tylko w podglądzie, identyczna z biblioteką czynności */
.preview-bell{display:none;align-items:center;justify-content:center;width:44px;height:34px}
.preview-bell svg{display:block;width:39px;height:32px}
.preview-mode .schedule .break-row .edit-break-label{display:none!important}
.preview-mode .schedule .break-row .preview-bell{display:inline-flex!important}
.preview-mode .schedule .break-row .time-label{display:flex!important;align-items:center;justify-content:center}
/* Zegar bieżący zsynchronizowany z czasem lokalnym komputera */
.live-clock{display:grid;grid-template-columns:1fr 1fr;gap:14px;background:#edf8ff;border:1px solid #cfe5f4;border-radius:14px;padding:12px 17px;margin:13px 0;color:#153755}
.clock-now,.clock-status{display:flex;flex-direction:column;gap:3px}
.clock-now span{font-size:11px;font-weight:800;letter-spacing:.05em}
.clock-now strong{font-size:30px;line-height:1.1;font-variant-numeric:tabular-nums}
.clock-status span{font-weight:700;font-size:13px}
.clock-status strong{font-size:29px;line-height:1.1;font-variant-numeric:tabular-nums;color:#136fc3}
.clock-status small{font-size:11px;color:#536b82}
.schedule .row.live-active{outline:2px solid #398acb;outline-offset:-2px}
@media(max-width:650px){.live-clock{gap:8px;padding:9px}.clock-now strong,.clock-status strong{font-size:22px}}
@media print{.live-clock{display:none!important}.preview-mode .schedule .break-row .preview-bell{display:inline-flex!important}.preview-mode .schedule .break-row .edit-break-label{display:none!important}.schedule .row.live-active{outline:none!important}}

/* v39 – delikatna zieleń zamiast czerwonych akcentów i wydruk zgodny z podglądem */
:root{--red:#86b995}
.break-row,.preview-mode .break-row,.preview-mode .schedule .break-row{
 background:#eff9f0!important;border-color:#c9e6d0!important;
}
.pdfbtn{background:#eaf6ed;color:#2b7144;border-color:#c6e5ce}
.preview-mode .preview-remove{background:#eaf6ed;color:#276d43;border-color:#bfdfca}
.preview-mode .preview-remove:hover{background:#dcf1e2}
@media print{
 @page{size:A4 portrait;margin:9mm}
 html,body{width:auto!important;background:white!important;print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important}
 .wrap,.preview-mode .wrap{max-width:none!important;width:100%!important;padding:0!important;margin:0!important}
 .hero,.preview-mode .hero{background:#eaf7ff!important;padding:2.5mm!important;margin:0 0 3mm!important;border:0!important;border-radius:3mm!important;box-shadow:none!important}
 .hero h1{font-size:20pt!important}
 .hero p,.modebar,.library-panel,.live-clock,.clearall,.footer,.actions,.hint,.preview-note,
 .time-editor,.timing-box,.preview-remove,.num{display:none!important}
 .layout,.preview-mode .layout{display:block!important}
 .panel,.preview-mode .panel{width:100%!important;padding:0!important;border:0!important;box-shadow:none!important}
 .panel>h2{display:none!important}
 .schedule,.preview-mode .schedule{display:flex!important;flex-direction:column!important;gap:1.6mm!important}
 .schedule .row,.schedule .lesson-row,.schedule .break-row,
 .preview-mode .schedule .row,.preview-mode .schedule .lesson-row,.preview-mode .schedule .break-row{
   display:grid!important;
   grid-template-columns:48mm minmax(0,1fr)!important;
   align-items:center!important;gap:2mm!important;
   width:100%!important;min-height:11mm!important;
   padding:1mm 2mm!important;margin:0!important;
   border:1px solid #cfe5f4!important;border-radius:2.5mm!important;
   box-shadow:none!important;break-inside:avoid!important;
 }
 .schedule .lesson-row,.preview-mode .schedule .lesson-row{background:#edf8ff!important;border-color:#cfe5f4!important}
 .schedule .break-row,.preview-mode .schedule .break-row{background:#eff9f0!important;border-color:#c9e6d0!important}
 .schedule .row>.time,.preview-mode .schedule .row>.time{
   grid-column:1!important;grid-row:1!important;min-width:0!important;
   display:flex!important;align-items:center!important;justify-content:flex-start!important;
   gap:1.5mm!important;flex-wrap:nowrap!important;padding:0!important;
 }
 .schedule .row>.time .time-label,.preview-mode .schedule .row>.time .time-label{
   display:flex!important;align-items:center!important;justify-content:flex-start!important;
   width:17mm!important;min-width:17mm!important;flex:0 0 17mm!important;
   margin:0!important;font-size:9pt!important;line-height:1!important;
   white-space:nowrap!important;color:#245f8c!important;
 }
 .schedule .break-row .edit-break-label{display:none!important}
 .schedule .break-row .preview-bell,.preview-mode .schedule .break-row .preview-bell{
   display:inline-flex!important;width:13mm!important;height:8mm!important;
 }
 .schedule .break-row .preview-bell svg{height:8mm!important;width:11mm!important}
 .schedule .row>.time .fixed-time,.preview-mode .schedule .row>.time .fixed-time{
   display:inline-flex!important;align-items:center!important;justify-content:center!important;
   flex:0 0 29mm!important;min-width:29mm!important;width:29mm!important;
   white-space:nowrap!important;font-size:10pt!important;padding:1mm!important;
   background:#e1f0fb!important;color:#173b6d!important;border:0!important;
 }
 .schedule .break-row .fixed-time{background:#deefe3!important;color:#276d43!important}
 .schedule .row>div:nth-child(3),.preview-mode .schedule .row>div:nth-child(3){
   display:block!important;grid-column:2!important;grid-row:1!important;min-width:0!important;
 }
 .schedule .row .type-title{display:none!important}
 .schedule .row .dropzone,.preview-mode .schedule .row .dropzone{
   background:transparent!important;border:0!important;min-height:9mm!important;
   padding:0!important;justify-content:flex-start!important;
 }
 .schedule .row .activity-card,.preview-mode .schedule .row .activity-card{
   width:100%!important;min-height:9mm!important;padding:1mm 2mm!important;
   gap:2mm!important;border:0!important;box-shadow:none!important;
   background:white!important;font-size:10.5pt!important;line-height:1.08!important;
   text-transform:uppercase!important;
 }
 .schedule .row .activity-card .ico{font-size:16pt!important;min-width:8mm!important}
 .schedule .row .activity-card .ico svg{width:7mm!important;height:7mm!important}
 .schedule .row .empty{font-size:9pt!important}
 .row.preview-hidden{display:none!important}
 .schedule .row.live-active{outline:none!important}
}

/* v41: zegar w belce oraz odliczanie w odpowiednim wierszu */
.hero{position:relative}
.header-clock{position:absolute;right:18px;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #bfdeec;border-radius:14px;padding:7px 15px;display:flex;flex-direction:column;gap:1px;text-align:center;color:#153755;box-shadow:0 3px 12px #154f7510}
.header-clock span{font-size:10px;font-weight:800;letter-spacing:.06em}
.header-clock strong{font-size:24px;line-height:1.1;font-variant-numeric:tabular-nums}
.hero{padding-right:195px}
.row{position:relative}
.row-countdown{display:none}
.row-countdown[hidden]{display:none!important}
.preview-mode .schedule .lesson-row .time-label{font-size:18px!important;font-weight:900!important;text-transform:uppercase!important}
.preview-mode .schedule .row{padding-right:202px!important}
.preview-mode .schedule .row .row-countdown:not([hidden]){display:flex;position:absolute;right:91px;top:50%;transform:translateY(-50%);align-items:center;justify-content:center;min-width:103px;max-width:103px;min-height:36px;background:#dff4e6;border:1px solid #a7d7b6;border-radius:9px;color:#235c3c;font-size:12px;font-weight:900;white-space:nowrap;font-variant-numeric:tabular-nums}
.preview-mode .schedule .row .preview-remove{right:8px!important}
@media(max-width:650px){.hero{padding-right:12px;padding-top:75px}.header-clock{right:12px;top:8px;transform:none}.preview-mode .schedule .row{padding-right:8px!important;padding-bottom:44px!important}.preview-mode .schedule .row .row-countdown:not([hidden]){top:auto;bottom:5px;right:85px;transform:none;min-height:28px}.preview-mode .schedule .row .preview-remove{top:auto;bottom:5px;transform:none}}
@media print{.header-clock,.row-countdown{display:none!important}.preview-mode .schedule .row{padding-right:2mm!important}}

/* v42: licznik w prawej części bieżącego wiersza, tuż przed przyciskiem Usuń */
.preview-mode .schedule .row{padding-right:218px!important}
.preview-mode .schedule .row .row-countdown:not([hidden]){
  position:absolute!important;top:50%!important;right:92px!important;
  bottom:auto!important;transform:translateY(-50%)!important;
  min-width:116px!important;max-width:116px!important;min-height:35px!important;
  padding:4px 6px!important;box-sizing:border-box!important;
  z-index:2!important;
}
.preview-mode .schedule .row .preview-remove{
  position:absolute!important;top:50%!important;bottom:auto!important;
  right:8px!important;transform:translateY(-50%)!important;z-index:2!important;
}
.library .tile[data-id="break"] .ico svg{display:block;width:42px;height:42px}
@media(max-width:650px){
 .preview-mode .schedule .row{padding-right:8px!important;padding-bottom:44px!important}
 .preview-mode .schedule .row .row-countdown:not([hidden]){
  top:auto!important;bottom:5px!important;right:92px!important;
  transform:none!important;min-height:28px!important;
 }
 .preview-mode .schedule .row .preview-remove{
  top:auto!important;bottom:5px!important;right:8px!important;transform:none!important;
 }
}
@media print{.row-countdown{display:none!important}.preview-mode .schedule .row{padding-right:2mm!important}}

/* v43: subtelny motyw szkolny wyłącznie za listą w podglądzie */
.preview-mode #schedule{
  background-color:#f7fbfd;
  background-image:url('szkolne-tlo.svg');
  background-size:650px 780px;
  background-repeat:repeat;
  background-position:center top;
  border:1px solid #e2edf3;
  border-radius:18px;
  padding:12px;
}
@media print{
  .preview-mode #schedule{background-image:none!important;background-color:transparent!important;border:none!important;padding:0!important}
}

/* v44 — wyraźna numeracja wszystkich ośmiu lekcji */
.schedule .lesson-row .time-label{font-weight:900!important;text-transform:uppercase!important;white-space:nowrap!important;letter-spacing:.025em}
.preview-mode .schedule .lesson-row .time-label{font-size:19px!important}
@media print{.schedule .lesson-row .time-label,.preview-mode .schedule .lesson-row .time-label{font-weight:900!important;font-size:10pt!important;white-space:nowrap!important;letter-spacing:0!important}}

/* v45: czytelna numeracja i widoczna pozycja odliczania w podglądzie */
@media screen and (min-width:651px){
 .preview-mode .schedule .row,.preview-mode .schedule .lesson-row,.preview-mode .schedule .break-row{
   grid-template-columns: minmax(0,270px) minmax(0,1fr)!important;
 }
 .preview-mode .schedule .row>.time{min-width:0!important;gap:6px!important}
 .preview-mode .schedule .row>.time .time-label{
   width:118px!important;flex:0 0 118px!important;min-width:118px!important;
   overflow:visible!important;white-space:nowrap!important;
   font-size:17px!important;letter-spacing:0!important;
 }
 .preview-mode .schedule .row>.time .fixed-time{
   width:125px!important;min-width:125px!important;flex:0 0 125px!important;
 }
}
.preview-mode .schedule .row .row-countdown{
 display:flex!important;position:absolute!important;right:92px!important;
 top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;
 box-sizing:border-box!important;width:116px!important;min-width:116px!important;max-width:116px!important;
 min-height:35px!important;align-items:center!important;justify-content:center!important;
 padding:4px 5px!important;border-radius:9px!important;
 background:#f1f6f2!important;border:1px solid #dae9df!important;
 color:#6c7e70!important;font-size:11px!important;font-weight:800!important;
 font-variant-numeric:tabular-nums!important;white-space:nowrap!important;z-index:2!important;
}
.preview-mode .schedule .row .row-countdown.countdown-active{
 background:#dff4e6!important;border-color:#a7d7b6!important;color:#235c3c!important;
}
@media screen and (max-width:650px){
 .preview-mode .schedule .row>.time .time-label{width:98px!important;flex:0 0 98px!important;min-width:98px!important;font-size:15px!important;letter-spacing:0!important}
 .preview-mode .schedule .row>.time .fixed-time{width:118px!important;min-width:118px!important;flex:0 0 118px!important}
 .preview-mode .schedule .row .row-countdown{top:auto!important;bottom:5px!important;right:92px!important;transform:none!important;min-height:28px!important}
}
@media print{.row-countdown,.preview-mode .schedule .row .row-countdown{display:none!important}}

/* v46: ikona usuwania i subtelny postęp czasu (od lewej do prawej). */
@media screen {
 .preview-mode .schedule .row .preview-remove{
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:42px!important;min-width:42px!important;height:38px!important;
  padding:0!important;background:#fff0f0!important;color:#ba4c51!important;
  border:1px solid #f3cdd0!important;border-radius:10px!important;
 }
 .preview-mode .schedule .row .preview-remove:hover{
  background:#ffe3e5!important;color:#9c303a!important;
 }
 .preview-mode .schedule .row .row-countdown,
 .preview-mode .schedule .row .row-countdown.countdown-active{
  --elapsed-progress:0%;
  color:#171717!important;border:1px solid #e0e0e0!important;
  background:linear-gradient(to right, #f9dfe1 0%, #f9dfe1 var(--elapsed-progress), #ffffff var(--elapsed-progress), #ffffff 100%)!important;
  right:58px!important;
  font-weight:800!important;
 }
 @media(max-width:650px){
  .preview-mode .schedule .row .row-countdown{right:58px!important}
 }
}
@media print{
 .preview-mode .schedule .row .preview-remove{display:none!important}
 .preview-mode .schedule .row .row-countdown{display:none!important}
}

/* v47: szkolne tło na całej stronie w podglądzie, nie tylko w obrębie harmonogramu */
@media screen {
  body.preview-mode {
    background-color:#f7fbfd!important;
    background-image:url('szkolne-tlo.svg')!important;
    background-repeat:repeat!important;
    background-position:center top!important;
    background-size:650px 780px!important;
    background-attachment:fixed!important;
  }
  body.preview-mode #schedule {
    background-image:none!important;
    background-color:transparent!important;
  }
  body.preview-mode .wrap {background:transparent!important;}
}
@media print{
  body,body.preview-mode{background:#fff!important;background-image:none!important}
}

/* v48 – wybór schematu w pasku przycisków, przed „Edycja” */
.modebar .timing-toolbar{display:flex;flex:1 1 365px;min-width:235px;max-width:545px;align-items:center;gap:10px;padding:0;margin:0;background:transparent;border:0;border-radius:0}
.modebar .timing-toolbar .timing-heading{flex:0 0 auto;margin:0;font-size:14px;white-space:nowrap}
.modebar .timing-toolbar #timePreset{flex:1 1 210px;min-width:165px;width:auto;max-width:100%;margin:0;min-height:42px;font-size:13px}
.preview-mode .modebar .timing-toolbar{display:none!important}
@media(max-width:780px){.modebar .timing-toolbar{flex:1 1 100%;max-width:none}.modebar .timing-toolbar .timing-heading{font-size:13px}}
@media print{.modebar .timing-toolbar{display:none!important}}

/* v49: cztery kafelki w rzędzie w panelu wyboru zajęć (tryb edycji). */
@media screen and (min-width:1351px){
 body:not(.preview-mode) .wrap{max-width:1840px}
 body:not(.preview-mode) .layout{grid-template-columns:minmax(740px,1.55fr) minmax(520px,1fr);gap:18px}
}
@media screen and (min-width:1051px) and (max-width:1350px){
 body:not(.preview-mode) .layout{grid-template-columns:1fr}
 body:not(.preview-mode) .library-panel{max-height:none}
}
@media screen{
 body:not(.preview-mode) .library{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
 body:not(.preview-mode) .library .tile{min-width:0;min-height:106px;padding:8px 3px;gap:4px}
 body:not(.preview-mode) .library .tile .ico{font-size:42px}
 body:not(.preview-mode) .library .tile .ico svg{width:42px;height:42px}
 body:not(.preview-mode) .library .tile .name{font-size:12px;line-height:1.15;padding:0 2px;overflow-wrap:anywhere}
}
@media screen and (max-width:420px){
 body:not(.preview-mode) .library{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* v50 – ta sama ikona kosza w edycji i podglądzie */
@media screen{
 body:not(.preview-mode) .schedule .actions{display:flex;align-items:center;justify-content:center;align-self:center}
 body:not(.preview-mode) .schedule .actions .remove{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px!important;min-width:42px;height:38px;padding:0!important;
  border:1px solid #f3cdd0!important;border-radius:10px!important;
  background:#fff0f0!important;color:#ba4c51!important;
 }
 body:not(.preview-mode) .schedule .actions .remove:hover{background:#ffe3e5!important;color:#9c303a!important}
 body:not(.preview-mode) .schedule .actions .remove svg{width:19px;height:19px;flex-shrink:0}
}

/* v51 – potwierdzenie zastosowanego schematu */
.scheme-status{display:block;margin-top:5px;font-size:11px;line-height:1.3;color:#286e4b;font-weight:700}