/* MyEduLinks UIP 0.5.2 — full-width workspace, three panels prioritized */
.ml-uip{--uip-primary:#185adb;--uip-primary-dark:#1046b5;--uip-ink:#17243b;--uip-muted:#64748b;--uip-line:#dce5f1;--uip-soft:#f4f7fc;--uip-card:#fff;--uip-green:#16845b;--uip-purple:#7851c8;color:var(--uip-ink);font-family:inherit;margin:clamp(.5rem,2vw,1.5rem) auto;max-width:1680px;font-size:15px;line-height:1.55}
.ml-uip *{box-sizing:border-box}.ml-uip button,.ml-uip input,.ml-uip select,.ml-uip textarea{font:inherit}.ml-uip button,.ml-uip input,.ml-uip select,.ml-uip textarea{max-width:100%}
.ml-uip__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding:clamp(1rem,2vw,1.5rem);border:1px solid #d8e4f6;border-radius:20px;background:radial-gradient(circle at 100% 0,#e4edff 0,transparent 38%),linear-gradient(135deg,#fff,#f3f7ff);box-shadow:0 8px 28px rgba(24,58,120,.06)}
.ml-uip__eyebrow,.ml-uip__tag{font-size:.72rem;font-weight:800;letter-spacing:.09em;color:var(--uip-primary);margin:0 0 .4rem;text-transform:uppercase}.ml-uip__header h2{font-size:clamp(1.45rem,2.3vw,2.15rem);letter-spacing:-.035em;line-height:1.18;margin:0 0 .45rem;color:var(--uip-ink)}.ml-uip__intro{margin:0;color:#53647e;max-width:70ch}.ml-uip__status{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;border:1px solid #f1d7a1;background:#fff9e9;border-radius:999px;padding:.45rem .75rem;font-size:.75rem;font-weight:700;color:#805a13}.ml-uip__status span{width:8px;height:8px;background:#d99a22;border-radius:50%;box-shadow:0 0 0 3px #ffedc4}
.ml-uip__panels{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,1fr) minmax(0,.9fr);gap:clamp(.7rem,1.2vw,1.1rem);align-items:stretch}.ml-uip__panel{min-width:0;border:1px solid var(--uip-line);border-radius:18px;background:var(--uip-card);overflow:hidden;box-shadow:0 7px 24px rgba(22,42,78,.055);transition:box-shadow .18s ease,transform .18s ease}.ml-uip__panel:hover{box-shadow:0 10px 30px rgba(22,42,78,.08)}.ml-uip__panel-head{display:flex;align-items:flex-start;gap:.75rem;min-height:76px;padding:1rem 1.05rem;border-bottom:1px solid var(--uip-line);background:linear-gradient(110deg,#f8faff,#fff)}.ml-uip__panel--input .ml-uip__panel-head{background:linear-gradient(110deg,#f0fbf6,#fff)}.ml-uip__panel--result .ml-uip__panel-head{background:linear-gradient(110deg,#f7f2ff,#fff)}.ml-uip__panel-number{display:inline-grid;place-items:center;flex:0 0 38px;height:38px;border-radius:12px;background:#e6efff;color:var(--uip-primary);font-weight:850;font-size:.82rem}.ml-uip__panel--input .ml-uip__panel-number{background:#dff7eb;color:#14754e}.ml-uip__panel--result .ml-uip__panel-number{background:#eee4ff;color:var(--uip-purple)}.ml-uip__panel-head h3{font-size:clamp(.94rem,1.1vw,1.08rem);line-height:1.35;margin:.3rem 0 0;color:var(--uip-ink);letter-spacing:-.01em}.ml-uip__panel-body{padding:clamp(.85rem,1.3vw,1.2rem)}.ml-uip__panel-body h4{font-size:1.03rem;line-height:1.4;margin:.8rem 0 .45rem;color:var(--uip-ink)}.ml-uip__panel-body p{line-height:1.65}.ml-uip__field-label{display:block;font-weight:750;font-size:.85rem;margin:.2rem 0 .4rem;color:#293a55}.ml-uip__select,.ml-uip__search{display:block;width:100%;min-height:44px;border:1px solid #d3deec;border-radius:11px;background:#fff;color:var(--uip-ink);padding:.65rem .8rem;margin-bottom:.85rem}.ml-uip__select:focus,.ml-uip__search:focus,.ml-uip__textarea:focus{outline:3px solid rgba(24,90,219,.16);border-color:var(--uip-primary)}.ml-uip__search-wrap{position:relative}.ml-uip__search-wrap span{position:absolute;right:.8rem;top:.25rem;font-size:1.5rem;color:#6c7d95;pointer-events:none}.ml-uip__search{padding-right:2.6rem}.ml-uip__resource-card{display:flex;align-items:center;gap:.7rem;padding:.8rem;border:1px solid #dce7f7;border-radius:13px;background:linear-gradient(115deg,#f1f6ff,#fff);margin:.15rem 0 1rem}.ml-uip__resource-icon{display:grid;place-items:center;flex:0 0 42px;height:42px;border-radius:11px;background:#dce9ff;color:var(--uip-primary);font-size:1.1rem}.ml-uip__resource-card strong{font-size:.88rem;line-height:1.35;display:block}.ml-uip__resource-card p{font-size:.76rem;color:var(--uip-muted);margin:.2rem 0 0;line-height:1.4}.ml-uip__resource-badge{margin-left:auto;align-self:flex-start;background:#fff0ce;color:#835b12;border-radius:6px;padding:.22rem .4rem;font-size:.62rem;font-weight:850;letter-spacing:.05em}.ml-uip__callout{padding:.9rem 1rem;border:1px solid #e2eaf5;border-radius:12px;background:var(--uip-soft);margin:1rem 0}.ml-uip__callout strong{display:block;margin-bottom:.35rem}.ml-uip__callout ul{padding-left:1.2rem;margin:.3rem 0}.ml-uip__callout li{margin:.35rem 0}.ml-uip__notice{font-size:.76rem;color:var(--uip-muted);margin:.85rem 0 0}.ml-uip__textarea{display:block;width:100%;min-height:220px;padding:.9rem;border:1px solid #cbd8e8;border-radius:12px;background:#fff;color:var(--uip-ink);line-height:1.6;resize:vertical;transition:border-color .15s,box-shadow .15s}.ml-uip__input-meta{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;font-size:.74rem;color:var(--uip-muted);margin:.55rem 0 1rem}.ml-uip__actions{display:flex;gap:.6rem;flex-wrap:wrap}.ml-uip__button{appearance:none;border:1px solid transparent;border-radius:11px;padding:.72rem 1rem;font-size:.88rem;font-weight:750;cursor:pointer;transition:transform .15s ease,background .15s ease,box-shadow .15s ease}.ml-uip__button:active{transform:translateY(1px)}.ml-uip__button:focus-visible{outline:3px solid rgba(24,90,219,.3);outline-offset:3px}.ml-uip__button--primary{background:var(--uip-primary);color:#fff;box-shadow:0 4px 10px rgba(24,90,219,.16)}.ml-uip__button--primary:hover{background:var(--uip-primary-dark);box-shadow:0 6px 15px rgba(24,90,219,.22)}.ml-uip__button--secondary{background:#fff;border-color:#d4deeb;color:#2e405c}.ml-uip__button--secondary:hover{background:#f5f8fc}.ml-uip__result-state{padding:1.2rem .9rem;border:1px dashed #d6dfed;border-radius:14px;text-align:center;background:linear-gradient(145deg,#f8fbff,#fff)}.ml-uip__result-icon{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#e0f7eb;color:#16845b;font-size:1.3rem;font-weight:850;margin-bottom:.65rem}.ml-uip__result-state h4{margin:.2rem 0 .5rem}.ml-uip__result-state p{font-size:.88rem;color:var(--uip-muted);margin:.3rem 0}.ml-uip__result-content{margin-top:.85rem}.ml-uip__answer-preview{white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid var(--uip-line);background:#f8faff;border-radius:12px;padding:.9rem;max-height:300px;overflow:auto}.ml-uip__footer{display:flex;justify-content:space-between;gap:.75rem;flex-wrap:wrap;padding:.9rem .25rem;font-size:.72rem;color:var(--uip-muted)}.ml-uip [hidden]{display:none!important}
@media(max-width:1100px){.ml-uip__panels{grid-template-columns:repeat(2,minmax(0,1fr))}.ml-uip__panel--result{grid-column:1/-1}.ml-uip__panel--result .ml-uip__panel-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:start}}
@media(max-width:700px){.ml-uip{font-size:14px;margin:.5rem auto}.ml-uip__header{display:block;padding:1rem;border-radius:15px}.ml-uip__status{margin-top:.85rem}.ml-uip__panels{grid-template-columns:minmax(0,1fr);gap:.8rem}.ml-uip__panel--result{grid-column:auto}.ml-uip__panel--result .ml-uip__panel-body{display:block}.ml-uip__panel-head{min-height:0;padding:.9rem}.ml-uip__panel-body{padding:.9rem}.ml-uip__textarea{min-height:170px}.ml-uip__actions{display:grid;grid-template-columns:1fr 1fr}.ml-uip__button{min-height:44px}.ml-uip__footer{display:block}.ml-uip__footer span{display:block;margin:.25rem 0}}
@media(prefers-reduced-motion:reduce){.ml-uip *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* 0.5.1 responsive aspect-ratio viewer */
.ml-uip__resource-list{display:grid;gap:.55rem;margin:.6rem 0 1rem}.ml-uip .ml-uip__resource-card{width:100%;text-align:left;cursor:pointer;color:var(--uip-ink);margin:0;min-width:0}.ml-uip .ml-uip__resource-card:hover,.ml-uip .ml-uip__resource-card:focus-visible{border-color:var(--uip-primary);box-shadow:0 0 0 3px rgba(24,90,219,.1);outline:none}.ml-uip__resource-copy{display:block;min-width:0;flex:1}.ml-uip__resource-copy small{display:block;color:var(--uip-muted);font-size:.74rem;line-height:1.4;margin-top:.22rem;overflow-wrap:anywhere}.ml-uip__empty-library{padding:1rem;border:1px dashed var(--uip-line);border-radius:12px;background:#f8faff}.ml-uip__empty-library p{font-size:.84rem;color:var(--uip-muted);margin:.35rem 0 0}.ml-uip__viewer{border:1px solid var(--uip-line);border-radius:13px;padding:.8rem;margin:.8rem 0;background:#fff}.ml-uip__viewer h4{margin:.15rem 0 .5rem}.ml-uip__viewer-frame{position:relative;width:100%;aspect-ratio:16/9;min-height:0;overflow:auto;border-radius:9px;background:#f1f5f9}.ml-uip__viewer-frame[data-orientation="portrait"]{aspect-ratio:1/1.414;overflow:auto}.ml-uip__viewer-frame[data-orientation="landscape"]{aspect-ratio:1.414/1;overflow:auto}.ml-uip__viewer-frame[data-orientation="vertical"]{aspect-ratio:9/16;max-width:min(100%,420px);margin-inline:auto;overflow:hidden}.ml-uip__viewer-frame iframe{position:absolute;inset:0;display:block;width:100%;height:100%;min-height:0;border:0;background:#fff}.ml-uip__viewer-frame video{display:block;width:100%;height:100%;object-fit:contain;background:#111}.ml-uip__viewer-frame .ml-uip__viewer-link{display:block;padding:1rem;overflow-wrap:anywhere}.ml-uip__viewer p{font-size:.85rem;color:var(--uip-muted);white-space:pre-wrap;overflow-wrap:anywhere}.ml-uip__resource-badge{flex-shrink:0}
@media(max-width:700px){.ml-uip__viewer-frame[data-orientation="portrait"]{aspect-ratio:1/1.414}.ml-uip__viewer-frame[data-orientation="landscape"]{aspect-ratio:1.414/1}.ml-uip__viewer-frame[data-orientation="vertical"]{max-width:min(100%,360px)}.ml-uip .ml-uip__resource-card{gap:.5rem;padding:.65rem}.ml-uip__resource-icon{flex-basis:34px;height:34px}}


/* v0.5.2: use the available viewport width and prioritise the three panels. */
.ml-uip{
  width:100%;
  max-width:none !important;
  margin:0 auto;
  padding:clamp(.35rem,1vw,.9rem);
}
/* The title/intro/status banner is intentionally removed so all three panels
   are visible immediately, as requested. */
.ml-uip__header{display:none !important;}
.ml-uip__panels{
  width:100%;
  grid-template-columns:minmax(0,1.28fr) minmax(0,1fr) minmax(0,.92fr);
  gap:clamp(.55rem,1vw,1rem);
}
.ml-uip__panel{min-width:0;}
.ml-uip__panel-body{padding:clamp(.75rem,1.1vw,1.15rem);}
@media (min-width: 1600px){
  .ml-uip{padding:1rem 1.25rem;}
  .ml-uip__panels{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,.95fr);gap:1.15rem;}
}
@media (max-width: 1024px){
  .ml-uip__panels{grid-template-columns:minmax(0,1fr);}
}


/* v0.5.3: Result / Reply spans the full row above the two working panels. */
.ml-uip__panels{
  display:grid;
  width:100%;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  grid-template-areas:
    "result result"
    "instructions input";
  align-items:stretch;
  gap:clamp(.65rem,1.15vw,1.1rem);
}
.ml-uip__panel--result{grid-area:result;}
.ml-uip__panel--instructions{grid-area:instructions;}
.ml-uip__panel--input{grid-area:input;}
.ml-uip__panel--result .ml-uip__panel-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:start;
  gap:1rem;
}
.ml-uip__panel--result .ml-uip__result-state,
.ml-uip__panel--result .ml-uip__result-content{min-width:0;}
@media (max-width: 760px){
  .ml-uip__panels{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:"result" "instructions" "input";
  }
  .ml-uip__panel--result .ml-uip__panel-body{grid-template-columns:minmax(0,1fr);}
}


/* v0.5.4 refinements based on staging screenshot:
   - remove decorative 01/02/03 panel numbers
   - use the available viewport more efficiently below the site header
   - let Result / Reply content fill its full panel width
*/
.ml-uip__panel-number{display:none !important;}
.ml-uip{
  width:100% !important;
  max-width:none !important;
  margin:0 auto !important;
  padding:clamp(.25rem,.6vw,.65rem) !important;
}
.ml-uip__panels{
  gap:clamp(.5rem,.8vw,.85rem) !important;
}
.ml-uip__panel--result .ml-uip__panel-body{
  display:block !important;
  width:100% !important;
}
.ml-uip__panel--result .ml-uip__result-state,
.ml-uip__panel--result .ml-uip__result-content{
  width:100% !important;
  max-width:none !important;
}
.ml-uip__panel--result .ml-uip__result-state{
  min-height:100%;
}
.ml-uip__panel--result .ml-uip__result-state p,
.ml-uip__panel--result .ml-uip__result-content p{
  max-width:none !important;
}


/* v0.5.5: three-zone desktop layout.
   Top: Choose learning material (left) + Result / Reply (right).
   Bottom: learning viewer (left) + response form (right), aligned side-by-side.
   The lower workspace scrolls independently so its two columns remain paired.
*/
.ml-uip__panels{
  display:grid !important;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) !important;
  grid-template-areas:
    "instructions result"
    "instructions input" !important;
  align-items:stretch !important;
  gap:clamp(.65rem,1vw,1rem) !important;
}
.ml-uip__panel--instructions{grid-area:instructions !important; min-width:0;}
.ml-uip__panel--result{grid-area:result !important; min-width:0;}
.ml-uip__panel--input{grid-area:input !important; min-width:0;}
.ml-uip__panel--result .ml-uip__panel-body{
  display:block !important;
  width:100% !important;
  padding:clamp(.7rem,1vw,1rem) !important;
}
.ml-uip__panel--result .ml-uip__result-state,
.ml-uip__panel--result .ml-uip__result-content{
  width:100% !important;
  max-width:none !important;
}
.ml-uip__panel--instructions{
  align-self:start;
}
.ml-uip__panel--input{
  align-self:start;
}
@media (min-width: 761px){
  .ml-uip__panel--instructions .ml-uip__panel-body{
    max-height:calc(100vh - 150px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .ml-uip__panel--input .ml-uip__panel-body{
    max-height:calc(100vh - 150px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
}
@media (max-width: 760px){
  .ml-uip__panels{
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-areas:"instructions" "result" "input" !important;
  }
  .ml-uip__panel--instructions .ml-uip__panel-body,
  .ml-uip__panel--input .ml-uip__panel-body{
    max-height:none;
    overflow:visible;
  }
}
/* v0.8.5: material-specific response interfaces */
.ml-uip__question{border:1px solid var(--uip-line);border-radius:12px;padding:.85rem;margin:0 0 .8rem;min-width:0}.ml-uip__question legend{font-weight:750;padding:0 .25rem}.ml-uip__answer-option{display:flex;gap:.5rem;align-items:flex-start;padding:.5rem;border:1px solid #e2eaf5;border-radius:9px;margin:.4rem 0;background:#fff}.ml-uip__answer-option input{margin-top:.35rem;flex:0 0 auto}.ml-uip__response-table{width:100%;border-collapse:collapse;margin:.6rem 0}.ml-uip__response-table th,.ml-uip__response-table td{border:1px solid #bdcadd;padding:.45rem;text-align:left}.ml-uip__response-table input{width:100%;min-width:0;border:1px solid #d3deec;border-radius:6px;padding:.5rem}

/* v0.8.6: compact panel titles, taller response area, and clear desktop layout */
.ml-uip__panel-head{min-height:0!important;align-items:center!important;padding:.55rem .8rem!important;gap:.55rem!important}
.ml-uip__panel-head h3{margin:0!important;font-size:clamp(.92rem,1vw,1.02rem)!important;line-height:1.25!important}
.ml-uip__panel-number{display:none!important}
.ml-uip__panels{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)!important;grid-template-areas:"instructions result" "instructions input"!important;align-items:start!important;gap:.8rem!important}
.ml-uip__panel--instructions{grid-area:instructions!important}
.ml-uip__panel--result{grid-area:result!important}
.ml-uip__panel--input{grid-area:input!important}
.ml-uip__panel--input .ml-uip__panel-body{min-height: min(70vh,850px)!important}
.ml-uip__panel--input [data-ml-uip-dynamic-input]{min-height:clamp(360px,55vh,720px)}
.ml-uip__panel--input .ml-uip__textarea{min-height:clamp(340px,52vh,680px)!important}
.ml-uip__question{background:#fff}
@media(max-width:760px){.ml-uip__panels{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"instructions" "result" "input"!important}.ml-uip__panel--input .ml-uip__panel-body{min-height:0!important}.ml-uip__panel--input [data-ml-uip-dynamic-input]{min-height:0!important}.ml-uip__panel--input .ml-uip__textarea{min-height:240px!important}.ml-uip__panel-head{padding:.65rem .8rem!important}}

/* v0.8.9 targeted UX update: quiz prompts on left, response controls on right. */
.ml-uip__question-prompt{margin:.2rem 0 .8rem;padding:.85rem;border:1px solid var(--uip-line,#dce4ef);border-radius:12px;background:#f7faff;}
.ml-uip__question-prompt h4{margin:.1rem 0 .5rem;line-height:1.5;}
.ml-uip__question-prompt .ml-uip__notice{margin:.35rem 0 0;}
.ml-uip__question-answer{margin:.2rem 0 .8rem;padding:.85rem;border:1px solid var(--uip-line,#dce4ef);border-radius:12px;min-width:0;}
.ml-uip__question-answer legend{font-weight:750;padding:0 .25rem;}
.ml-uip__quiz-feedback[hidden]{display:none!important;}
.ml-uip__panel--input .ml-uip__actions{display:flex;}

.ml-uip__result-state p{white-space:pre-line;}

/* v0.8.12: clickable quiz question navigation in the left panel */
.ml-uip__question-nav{display:flex;flex-wrap:wrap;gap:.4rem;margin:.2rem 0 .75rem;padding:.65rem;background:#fff;border:1px solid var(--uip-line,#dce4ef);border-radius:10px;position:sticky;top:0;z-index:2}
.ml-uip .ml-uip__question-nav-button{border:1px solid var(--uip-line,#dce4ef);border-radius:8px;background:#f7faff;color:var(--uip-ink,#17233c);font-weight:700;padding:.45rem .7rem;cursor:pointer;min-width:2.7rem}
.ml-uip .ml-uip__question-nav-button:hover,.ml-uip .ml-uip__question-nav-button:focus-visible,.ml-uip .ml-uip__question-nav-button.is-active{background:var(--uip-primary,#185adb);border-color:var(--uip-primary,#185adb);color:#fff;outline:none}
.ml-uip .ml-uip__question-prompt{cursor:pointer;scroll-margin:1rem}
.ml-uip .ml-uip__question-prompt:focus-visible{outline:3px solid rgba(24,90,219,.35);outline-offset:2px}

/* v0.8.13: full question text is the clickable left-panel navigation item */
.ml-uip__question-nav{display:grid;grid-template-columns:1fr;max-height:32rem;overflow:auto}
.ml-uip .ml-uip__question-nav-button{text-align:left;white-space:normal;min-width:0;width:100%;line-height:1.45}

/* v0.8.15: one clickable question list on the left, scrollable in place;
   keep the instructions panel as tall as the stacked right-hand panels. */
.ml-uip__panels{align-items:stretch!important;grid-template-areas:"instructions result" "instructions input"!important;}
.ml-uip__panel--instructions{grid-row:1 / span 2!important;align-self:stretch!important;min-height:100%!important;}
.ml-uip__panel--instructions>.ml-uip__panel-body{height:calc(100% - 1px);min-height:0;display:flex;flex-direction:column;}
.ml-uip__viewer{min-height:0;display:flex;flex-direction:column;}
.ml-uip__viewer-frame{aspect-ratio:auto!important;min-height:0!important;height:auto!important;overflow:visible!important;background:transparent!important;}
.ml-uip__question-nav{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:.45rem;max-height:min(65vh,720px)!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;padding:.55rem!important;position:relative!important;}
.ml-uip .ml-uip__question-nav-button{display:block!important;width:100%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere;line-height:1.45;flex:none;}
.ml-uip__viewer-description:empty{display:none!important;}
@media(max-width:760px){.ml-uip__panels{grid-template-areas:"instructions" "result" "input"!important;align-items:stretch!important}.ml-uip__panel--instructions{grid-row:auto!important}.ml-uip__question-nav{max-height:50vh!important}.ml-uip__panel--instructions>.ml-uip__panel-body{height:auto;}}
.ml-uip__course-module{margin:14px 0 8px;padding:8px 10px;border-radius:8px;background:#eef4ff;color:#173b73;font-size:1rem}.ml-uip__course-lesson{padding:8px 10px;margin:6px 0;border:1px solid #dce5f5;border-radius:8px;background:#fff}.ml-uip__course-lesson-description{margin:6px 0 0;font-size:.92em;color:#596579}.ml-uip__viewer-link.is-unavailable{opacity:.65;cursor:default}