
:root{
  --green:#1aa05b;--green-dark:#0f7f45;--soft:#eef8f2;--bg:#f7faf8;--card:#fff;
  --ink:#15231b;--text:#29382f;--muted:#66756d;--line:#dbe7df;--danger:#b3261e;
  --success:#137333;--warning:#8a5a00;--shadow:0 18px 55px rgba(20,40,28,.08);--radius:24px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Poppins,Arial,sans-serif;background:radial-gradient(circle at 10% 0,rgba(26,160,91,.12),transparent 32rem),linear-gradient(180deg,#fff,var(--bg));color:var(--text);line-height:1.55}
a{color:var(--green-dark)}
.page{min-height:100vh;display:flex;flex-direction:column}
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.header-inner{width:min(1320px,calc(100% - 32px));margin:0 auto;padding:12px 0;display:flex;justify-content:space-between;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}.brand-logo{height:56px;width:auto;object-fit:contain}.brand-title h1{margin:0;color:var(--ink);font-size:21px;letter-spacing:-.03em;line-height:1.1}.brand-title p{margin:3px 0 0;color:var(--muted);font-size:13px}
.header-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.user-pill{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 13px;font-size:13px;font-weight:800;white-space:nowrap}
.container{width:min(1320px,calc(100% - 32px));margin:28px auto 42px;flex:1}
.card{background:rgba(255,255,255,.94);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);overflow:hidden}.card-body{padding:30px}
.grid{display:grid;gap:22px}.grid.two{grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);align-items:start}
h2{margin:0 0 12px;color:var(--ink);font-size:31px;line-height:1.12;letter-spacing:-.035em}h3{margin:22px 0 10px;color:var(--green-dark);font-size:18px}p{margin:0 0 12px}.lead{white-space:pre-line;font-size:16px}.note{font-size:12.5px;color:var(--muted);margin-top:10px}.clean-list{margin:0;padding-left:22px}.clean-list li{margin:8px 0}.support-box,.instruction-box{margin-top:18px;background:var(--soft);border:1px solid #c9ead6;border-radius:18px;padding:16px 18px}
.field{margin-bottom:14px}label{display:block;margin-bottom:7px;font-size:13px;font-weight:850;color:var(--ink)}.required-star{color:var(--danger)}
input[type=text],input[type=password],input[type=email],input[type=datetime-local],input[type=number],select,textarea{width:100%;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:15px;padding:13px 14px;font-size:15px;font-family:inherit;outline:none}textarea{resize:vertical;min-height:92px}input:focus,select:focus,textarea:focus,.rich-editor:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(26,160,91,.12)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-row.three{grid-template-columns:1fr 1fr 1fr}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
button,.button-link{display:inline-flex;align-items:center;justify-content:center;border:0;appearance:none;border-radius:14px;padding:12px 16px;font-size:14px;font-weight:850;cursor:pointer;text-decoration:none;transition:.15s ease;font-family:inherit}button:hover,.button-link:hover{transform:translateY(-1px)}.primary{background:var(--green);color:#fff}.secondary{background:#fff;color:var(--green-dark);border:1px solid var(--line)}.danger{background:#fff;color:var(--danger);border:1px solid #e8bdb8}.ghost{background:#f7fbf8;color:var(--text);border:1px solid var(--line)}
.notice{margin-top:14px;padding:12px 14px;border-radius:15px;font-size:14px}.success{background:#e6f4ea;color:var(--success);border:1px solid #b8dfc3}.warning{background:#fff7dd;color:var(--warning);border:1px solid #f0deaa}.error{background:#fceeee;color:var(--danger);border:1px solid #f3c4bf}.hidden{display:none!important}
.assessment-top{background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 30px;margin-bottom:18px}.assessment-top h2{margin-bottom:6px}.assessment-top p{color:var(--muted)}
.timer-strip{position:sticky;top:82px;z-index:30;margin-bottom:18px;border:1px solid var(--line);background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:var(--shadow);border-radius:18px;padding:12px 16px;display:flex;justify-content:space-between;gap:14px;align-items:center}.timer-clock{font-size:22px;line-height:1;font-weight:950;color:var(--green-dark);font-variant-numeric:tabular-nums}.timer-clock.warning{color:var(--warning)}.timer-clock.danger{color:var(--danger)}
.progress-wrap{margin-top:18px}.progress-text{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:13px;font-weight:850;margin-bottom:8px}.progress-bar{height:10px;border-radius:999px;overflow:hidden;background:#dcefe5}.progress-fill{height:100%;width:0;background:var(--green);transition:.2s ease}
.question-map{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.question-dot{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--text);font-weight:900;cursor:pointer}.question-dot.current{border-color:var(--green);background:var(--soft);color:var(--green-dark)}.question-dot.answered{background:var(--green);border-color:var(--green);color:#fff}.question-dot.flagged{box-shadow:inset 0 -4px 0 var(--warning)}
.question-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:30px}.question-title{color:var(--green-dark);font-size:14px;font-weight:850;margin-bottom:14px}.prompt{font-size:18px;margin-bottom:22px;color:var(--ink)}
.rich-content img,.rich-editor img{max-width:100%;height:auto;border-radius:16px;border:1px solid var(--line);margin:12px 0;display:block}.passage-panel{border:1px solid var(--line);border-radius:20px;background:#fbfdfb;margin-bottom:20px;overflow:hidden}.passage-panel summary{cursor:pointer;padding:16px 18px;font-weight:900;color:var(--green-dark);background:var(--soft)}.passage-body{padding:18px;max-height:430px;overflow:auto}
.option{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line);border-radius:20px;padding:18px;margin:14px 0;background:#fff;cursor:pointer;transition:.15s ease;font-size:17px;line-height:1.6;font-weight:normal}.option:hover{border-color:var(--green);background:#fbfffd}.option input{margin-top:7px;transform:scale(1.25);accent-color:var(--green)}.option-letter{font-weight:650;color:var(--green-dark);margin-right:8px;font-size:18px}.option-content{font-weight:normal}
.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-top:18px}.summary-box{border:1px solid var(--line);border-radius:18px;background:#fbfdfb;padding:15px}.summary-box span{display:block;color:var(--muted);font-size:13px}.summary-box strong{display:block;margin-top:4px;font-size:21px;color:var(--green-dark);word-break:break-word}
.review-card{border:1px solid var(--line);border-radius:18px;background:#fff;margin-top:16px;padding:18px}.review-card.correct{border-color:#b8dfc3;background:#fbfffd}.review-card.incorrect{border-color:#f0c4c0;background:#fffafa}.answer-pill{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-weight:850;font-size:13px;margin:4px 6px 4px 0}.answer-pill.correct{background:#e6f4ea;color:var(--success)}.answer-pill.incorrect{background:#fceeee;color:var(--danger)}.answer-pill.level{background:#eef8f2;color:var(--green-dark)}.explanation-box{margin-top:12px;border:1px solid #c9ead6;background:var(--soft);border-radius:16px;padding:14px}.review-option{border:1px solid var(--line);border-radius:14px;padding:12px;margin:8px 0;background:#fff}.review-option.selected{border-color:var(--green);background:var(--soft)}.review-option.correct-answer{border-color:#b8dfc3}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:18px;background:#fff}table{width:100%;border-collapse:collapse;min-width:960px;font-size:14px}th,td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:#f7fbf8;color:var(--muted);font-weight:900}tr:last-child td{border-bottom:0}.status-pill{display:inline-flex;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:900;border:1px solid var(--line)}.status-published{background:#e6f4ea;color:var(--success)}.status-draft{background:#fff7dd;color:var(--warning)}
.admin-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:22px;align-items:start}.admin-main{min-width:0}.admin-section{margin-top:22px}.set-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}.question-nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 18px}.question-nav select{max-width:320px}.question-editor{border:1px solid var(--line);border-radius:22px;background:#fff;padding:22px}.editor-section{border:1px solid var(--line);border-radius:20px;padding:16px;margin:16px 0;background:#fbfdfb}.editor-section-title{font-weight:900;color:var(--green-dark);margin-bottom:12px}
.option-card{border:1px solid var(--line);border-radius:18px;padding:16px;margin:14px 0;background:#fff}.option-card-header{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.option-card-header strong{color:var(--green-dark)}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:8px;border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;background:#fbfdfb}.toolbar button{padding:7px 10px;border-radius:10px;background:#fff;border:1px solid var(--line);color:var(--text)}
.rich-editor{min-height:110px;border:1px solid var(--line);border-radius:0 0 14px 14px;padding:13px 14px;background:#fff;outline:none;overflow:auto}.rich-editor.large{min-height:220px}.rich-editor:empty:before{content:attr(data-placeholder);color:#9aa8a0}.toggle-row{display:flex;align-items:center;gap:10px;margin:8px 0 14px}.toggle-row input{width:auto}
.footer{border-top:1px solid var(--line);background:#fff;padding:20px 16px}.footer-inner{width:min(1320px,calc(100% - 32px));margin:0 auto;display:flex;justify-content:center;align-items:center;gap:12px;color:var(--muted);font-size:14px}.footer-inner img{height:44px;width:auto;object-fit:contain}
@media(max-width:980px){.grid.two,.admin-layout{grid-template-columns:1fr}}@media(max-width:700px){.header-inner{flex-direction:column;align-items:flex-start}.header-actions{justify-content:flex-start}.brand-logo{height:52px}.brand-title h1{font-size:19px}.card-body,.question-card,.assessment-top{padding:22px}.form-row,.form-row.three{grid-template-columns:1fr}.timer-strip{top:120px;align-items:flex-start;flex-direction:column}h2{font-size:26px}}


/* ===== UI polish update ===== */
:root{
  --bg:linear-gradient(180deg,#f4fbf6 0%,#eef7f1 34%,#f7faf8 100%);
  --shadow:0 14px 34px rgba(16,24,20,.08),0 4px 10px rgba(16,24,20,.04);
  --shadow-soft:0 8px 20px rgba(16,24,20,.06);
  --radius-lg:28px;
}
body{background:var(--bg)}
.header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.78);backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(28,60,39,.06)}
.container{width:min(1360px,calc(100% - 40px));margin:32px auto 44px}
.card,.assessment-top,.question-card,.timer-strip{border-color:rgba(28,60,39,.10);box-shadow:var(--shadow)}
.card,.assessment-top,.question-card{border-radius:24px}
.card-body,.assessment-top,.question-card{padding:28px}
button,.button-link{padding:12px 18px;border-radius:16px;gap:8px;box-shadow:var(--shadow-soft)}
button.secondary,.button-link.secondary,.ghost{background:#fff}
button.primary,.button-link.primary,.primary{background:linear-gradient(180deg,#22b863 0%, #1aa05b 100%);box-shadow:0 10px 24px rgba(26,160,91,.22)}
button.secondary:hover,.button-link.secondary:hover,.ghost:hover{border-color:#bdd8c8;background:#fbfefd}
button:active,.button-link:active{transform:translateY(0)}
.btn-row{gap:10px}
.field{margin-bottom:16px}
input[type=text],input[type=password],input[type=email],input[type=datetime-local],input[type=number],select,textarea{border-radius:16px;padding:14px 15px;box-shadow:inset 0 1px 2px rgba(0,0,0,.02)}
.support-box,.instruction-box{border-radius:20px;background:linear-gradient(180deg,#f4fcf7 0%,#eff9f2 100%)}
.admin-hero{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap}
.hero-badges{display:flex;gap:10px;flex-wrap:wrap}
.hero-badge{display:inline-flex;padding:10px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:850;color:var(--green-dark);box-shadow:var(--shadow-soft)}
.set-toolbar{background:rgba(255,255,255,.82);border:1px solid rgba(28,60,39,.08);border-radius:22px;padding:14px 16px;position:sticky;top:98px;z-index:25;box-shadow:var(--shadow-soft);backdrop-filter:blur(12px);margin-bottom:18px}
.library-card .card-body{padding:20px 22px}
.library-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
.library-note{color:var(--muted);font-size:14px;margin:6px 0 0}
.library-scroll{max-height:360px;overflow:auto;scrollbar-width:thin}
.library-collapsed .library-scroll{display:none}
.library-collapsed #setMessage{margin-top:12px}
.table-wrap{border-radius:20px;border-color:rgba(28,60,39,.10)}
#setLibraryTable{min-width:1120px}
#setLibraryTable tbody tr{transition:background .15s ease}
#setLibraryTable tbody tr:hover{background:#f8fcfa}
#setLibraryTable tbody tr.selected-row{background:linear-gradient(180deg,#f1fbf5 0%, #edf8f1 100%)}
.set-cell-title strong{font-size:15px;color:var(--ink)}
.set-cell-meta,.table-subtle{color:var(--muted);font-size:12px;margin-top:4px}
.action-row{gap:8px}
.action-row button{padding:9px 12px;border-radius:12px;font-size:12px;box-shadow:none}
.admin-layout{grid-template-columns:360px minmax(0,1fr);gap:24px;align-items:start}
.sticky-panel{position:sticky;top:170px}
.admin-main .card{overflow:visible}
#currentSetBanner{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;background:linear-gradient(180deg,#f4fcf7 0%,#eef9f2 100%);border-radius:20px;padding:18px 20px}
.question-nav{position:sticky;top:170px;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);padding:12px;border:1px solid rgba(28,60,39,.09);border-radius:20px;box-shadow:var(--shadow-soft)}
.question-nav select{min-width:220px;border-radius:14px}
.question-editor{border-radius:24px;box-shadow:none;background:linear-gradient(180deg,#ffffff 0%,#fcfffd 100%)}
.editor-section{border-radius:20px;background:linear-gradient(180deg,#fcfefc 0%,#f7fbf8 100%)}
.option-card{border-radius:20px;box-shadow:0 2px 8px rgba(16,24,20,.03)}
.toolbar{gap:6px;padding:10px;border-radius:14px 14px 0 0}
.toolbar button{padding:8px 10px;font-size:12px;box-shadow:none}
.rich-editor,.rich-editor.large{border-radius:0 0 14px 14px;background:#fff}
.question-dot{box-shadow:var(--shadow-soft)}
.option{border-radius:22px;box-shadow:0 3px 8px rgba(16,24,20,.03)}
.footer{background:transparent}
@media (max-width:1100px){
  .sticky-panel,.question-nav,.set-toolbar{position:static}
  .library-scroll{max-height:300px}
}
@media (max-width:700px){
  .container{width:min(100% - 24px,1360px);margin:22px auto 30px}
  .card-body,.assessment-top,.question-card{padding:20px}
  .set-toolbar{padding:12px}
  .hero-badge{padding:8px 12px}
  button,.button-link{width:auto;max-width:100%}
}


/* ===== Image sizing + shared passage + mobile answer view update ===== */
.rich-content img,.rich-editor img{
  max-width:100%;
  height:auto;
  border-radius:16px;
  border:1px solid var(--line);
  margin:12px 0;
  display:block;
}
.rich-editor img{
  cursor:pointer;
}
.rich-editor img:hover{
  outline:3px solid rgba(26,160,91,.18);
}
.assessment-question-layout{
  display:grid;
  grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);
  gap:20px;
  align-items:start;
}
.passage-column,.qa-column{
  min-width:0;
}
.assessment-question-layout .passage-panel{
  margin-bottom:0;
  position:sticky;
  top:150px;
}
.assessment-question-layout .passage-body{
  max-height:62vh;
}
.qa-column .option{
  margin:10px 0;
  padding:15px 16px;
}
.compact-nav-row{
  margin-top:12px;
}
.editor-section .note{
  margin-top:8px;
}
.toolbar button{
  white-space:nowrap;
}
@media(max-width:900px){
  .assessment-question-layout{
    grid-template-columns:1fr;
    gap:14px;
  }
  .assessment-question-layout .passage-panel{
    position:static;
  }
  .assessment-question-layout .passage-body{
    max-height:260px;
  }
  .question-card{
    padding:18px;
  }
  .prompt{
    font-size:16px;
    margin-bottom:12px;
  }
  .option{
    font-size:15.5px;
    line-height:1.45;
    padding:13px 14px;
    margin:9px 0;
    border-radius:16px;
  }
  .option input{
    margin-top:5px;
    transform:scale(1.12);
  }
  .question-map{
    gap:6px;
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:6px;
  }
  .question-dot{
    flex:0 0 auto;
    width:34px;
    height:34px;
  }
  .timer-strip{
    gap:8px;
    padding:10px 12px;
  }
  .timer-clock{
    font-size:19px;
  }
}
@media(max-width:640px){
  .container{
    width:min(100% - 18px,1360px);
    margin:14px auto 24px;
  }
  .header-inner{
    width:min(100% - 18px,1320px);
  }
  .brand-title h1{
    font-size:17px;
  }
  .brand-title p{
    display:none;
  }
  .brand-logo{
    height:42px;
  }
  .assessment-top{
    padding:16px;
    margin-bottom:12px;
  }
  .assessment-top h2{
    font-size:22px;
  }
  .timer-strip{
    position:static;
    flex-direction:row;
    align-items:center;
  }
  .question-card{
    padding:14px;
    border-radius:18px;
  }
  .passage-panel summary{
    padding:12px 14px;
  }
  .passage-body{
    padding:14px;
  }
  .qa-column .option{
    padding:12px;
    font-size:15px;
  }
  .option-letter{
    font-size:16px;
  }
  .btn-row{
    gap:8px;
  }
  button,.button-link{
    padding:10px 12px;
    font-size:13px;
  }
  .admin-layout{
    grid-template-columns:1fr;
  }
  .sticky-panel,.question-nav,.set-toolbar{
    position:static;
  }
  .library-scroll{
    max-height:280px;
  }
}


/* ===== Server-backed assessment layout update ===== */
.taking-assessment .header,
.taking-assessment .footer{display:none;}
.taking-assessment .container{width:min(100% - 18px,1500px);margin:0 auto 16px;}
.assessment-live-view{padding-top:0;}
.assessment-only-timer{position:sticky;top:0;z-index:80;margin:0 0 10px;border-radius:0 0 18px 18px;justify-content:center;padding:10px 16px;background:rgba(255,255,255,.96);}
.assessment-only-timer .timer-clock{font-size:28px;letter-spacing:.02em;}
.assessment-bottom-nav{position:sticky;bottom:0;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:18px;padding:10px;margin-top:10px;justify-content:center;}
.rc-two-column{display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);gap:14px;height:calc(100vh - 116px);align-items:stretch;}
.rc-two-column .passage-column,.rc-two-column .qa-column{min-width:0;overflow:auto;border:1px solid var(--line);border-radius:18px;background:#fff;}
.rc-two-column .passage-column{padding:0;}
.rc-two-column .qa-column{padding:18px;}
.rc-two-column .passage-panel{border:0;border-radius:0;margin:0;height:100%;}
.rc-two-column .passage-title{position:sticky;top:0;background:var(--soft);padding:14px 16px;font-weight:900;color:var(--green-dark);border-bottom:1px solid var(--line);z-index:2;}
.rc-two-column .passage-body{max-height:none;height:auto;padding:18px;font-size:16px;line-height:1.7;}
.taking-assessment .question-card{padding:0;box-shadow:none;border:0;background:transparent;}
.taking-assessment .prompt{font-size:17px;margin-bottom:14px;}
.taking-assessment .option{font-size:15.5px;line-height:1.42;padding:12px 13px;margin:9px 0;border-radius:16px;}
.taking-assessment .option input{transform:scale(1.1);margin-top:4px;}
.compact-nav-row{margin-top:10px;}
@media(max-width:900px){
  .rc-two-column{grid-template-columns:1fr;height:auto;}
  .rc-two-column .passage-column{max-height:42vh;}
  .rc-two-column .qa-column{max-height:none;}
  .assessment-only-timer .timer-clock{font-size:23px;}
}
@media(max-width:640px){
  .taking-assessment .container{width:min(100% - 12px,1500px);}
  .rc-two-column .passage-body{padding:14px;font-size:15px;line-height:1.6;}
  .rc-two-column .qa-column{padding:12px;}
  .assessment-bottom-nav button{padding:9px 10px;font-size:12px;}
}


/* ===== Smooth version: RC back to half-and-half with scroll ===== */
.assessment-question-layout.rc-two-column,
.assessment-question-layout{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:18px;
  align-items:start;
}
.assessment-question-layout .passage-panel,
.rc-two-column .passage-panel,
.rc-passage{
  position:static !important;
  margin-bottom:0;
}
.assessment-question-layout .passage-body,
.rc-two-column .passage-body,
.rc-passage .passage-body{
  max-height:62vh !important;
  overflow:auto;
}
.qa-column{
  max-height:62vh;
  overflow:auto;
  padding-right:4px;
}
.question-card{
  overflow:visible;
}
.rich-editor img.img-left,.rich-content img.img-left{
  margin-left:0;
  margin-right:auto;
}
.rich-editor img.img-center,.rich-content img.img-center{
  margin-left:auto;
  margin-right:auto;
}
.rich-editor img.img-right,.rich-content img.img-right{
  margin-left:auto;
  margin-right:0;
}
#setMessage .notice{margin-bottom:10px;}
#saveStatus{font-weight:850;color:var(--green-dark);}
@media(max-width:900px){
  .assessment-question-layout.rc-two-column,
  .assessment-question-layout{
    grid-template-columns:1fr !important;
  }
  .qa-column{
    max-height:none;
    overflow:visible;
  }
  .assessment-question-layout .passage-body,
  .rc-two-column .passage-body,
  .rc-passage .passage-body{
    max-height:280px !important;
  }
}


/* ===== Text weight correction =====
   Earlier versions made too much assessment text appear heavy.
   These rules keep headings/labels readable while keeping question, passage and option text closer to normal document weight.
*/
.rich-content,
.prompt,
.option-content,
.passage-body,
.review-card,
.review-option,
.question-card,
.qa-column,
.passage-column{
  font-weight:400;
}
.rich-content b,
.rich-content strong,
.prompt b,
.prompt strong,
.option-content b,
.option-content strong,
.passage-body b,
.passage-body strong,
.explanation-box b,
.explanation-box strong{
  font-weight:700;
}
.option{
  font-weight:400 !important;
}
.option-letter,
.question-title,
.editor-section-title,
label,
th,
button,
.status-pill,
.set-cell-title strong{
  font-weight:700;
}
.assessment-top h2,
.card-body h2,
.brand-title h1{
  font-weight:800;
}
body{
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button:disabled{
  opacity:.65;
  cursor:not-allowed;
  transform:none;
}


/* ===== Assessment screen space + header fix =====
   Keeps TEPS header/logo visible, removes wasted bottom space and uses half-half RC columns.
*/
.taking-assessment .header{
  display:block !important;
}
.taking-assessment .footer{
  display:none !important;
}
.taking-assessment .container{
  width:min(100% - 20px,1600px) !important;
  margin:10px auto 10px !important;
  flex:1;
}
.assessment-live-view{
  min-height:calc(100vh - 104px);
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:0 !important;
}
.assessment-only-timer{
  position:sticky;
  top:72px;
  z-index:80;
  margin:0 !important;
  border-radius:16px;
  justify-content:center;
  gap:12px;
  padding:8px 14px !important;
  background:rgba(255,255,255,.96);
  box-shadow:0 8px 22px rgba(16,24,20,.06);
}
.timer-label{
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.assessment-only-timer .timer-clock{
  font-size:22px !important;
  letter-spacing:.01em;
}
.taking-assessment .question-card{
  flex:1;
  min-height:0;
  padding:0 !important;
  box-shadow:none !important;
  border:0 !important;
  background:transparent !important;
  overflow:hidden;
}
.rc-two-column,
.assessment-question-layout.rc-two-column,
.assessment-question-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:14px;
  height:calc(100vh - 202px) !important;
  min-height:520px;
  align-items:stretch;
}
.rc-two-column .passage-column,
.rc-two-column .qa-column{
  min-width:0;
  min-height:0;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
}
.rc-two-column .passage-column{
  padding:0;
}
.rc-two-column .qa-column{
  padding:18px;
  display:flex;
  flex-direction:column;
}
.rc-two-column .passage-panel,
.rc-passage{
  border:0 !important;
  border-radius:0 !important;
  margin:0 !important;
  height:100%;
  position:static !important;
}
.rc-two-column .passage-title{
  position:sticky;
  top:0;
  background:var(--soft);
  padding:12px 16px;
  font-weight:700;
  color:var(--green-dark);
  border-bottom:1px solid var(--line);
  z-index:2;
}
.rc-two-column .passage-body{
  max-height:none !important;
  height:auto;
  padding:18px;
  font-size:15.5px;
  line-height:1.62;
  font-weight:400;
}
.taking-assessment .prompt{
  font-size:16.5px !important;
  line-height:1.48;
  margin-bottom:12px !important;
}
.taking-assessment .option{
  font-size:15.25px !important;
  line-height:1.36 !important;
  padding:10px 12px !important;
  margin:8px 0 !important;
  border-radius:15px !important;
}
.taking-assessment .option input{
  transform:scale(1.05);
  margin-top:3px;
}
.compact-nav-row{
  margin-top:8px !important;
}
.assessment-bottom-nav{
  position:sticky;
  bottom:8px;
  z-index:85;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);
  border:1px solid var(--line);
  border-radius:18px;
  padding:8px !important;
  margin-top:0 !important;
  justify-content:center;
  box-shadow:0 8px 24px rgba(16,24,20,.08);
}
.assessment-bottom-nav button{
  padding:9px 15px;
}

/* If there is no passage, give the question card the full usable height. */
.taking-assessment .question-card > .qa-column:not(.rc-two-column .qa-column){
  height:calc(100vh - 202px);
  overflow:auto;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
}

/* Keep bold visible but less harsh inside passage text. */
.passage-body b,
.passage-body strong{
  font-weight:650 !important;
}

@media(max-width:900px){
  .assessment-live-view{
    min-height:auto;
  }
  .assessment-only-timer{
    top:66px;
  }
  .rc-two-column,
  .assessment-question-layout.rc-two-column,
  .assessment-question-layout{
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:0;
  }
  .rc-two-column .passage-column{
    max-height:38vh;
  }
  .rc-two-column .qa-column{
    max-height:none;
    overflow:visible;
  }
  .taking-assessment .question-card{
    overflow:visible;
  }
  .taking-assessment .question-card > .qa-column:not(.rc-two-column .qa-column){
    height:auto;
    overflow:visible;
  }
  .assessment-bottom-nav{
    bottom:6px;
  }
}
@media(max-width:640px){
  .taking-assessment .container{
    width:min(100% - 14px,1600px) !important;
    margin:8px auto !important;
  }
  .assessment-only-timer{
    top:58px;
    padding:7px 10px !important;
  }
  .assessment-only-timer .timer-clock{
    font-size:19px !important;
  }
  .timer-label{
    font-size:12px;
  }
  .rc-two-column .passage-column{
    max-height:34vh;
  }
  .rc-two-column .qa-column{
    padding:14px;
  }
  .taking-assessment .prompt{
    font-size:15.5px !important;
  }
  .taking-assessment .option{
    font-size:14.75px !important;
    padding:10px !important;
  }
}


/* ===== Full question-space + independent scroll fix =====
   This makes the passage and the question/options panels both use the full available height.
   It also gives non-RC questions the same full-height scroll behaviour.
*/
.assessment-live-view{
  height:calc(100vh - 92px);
  min-height:0 !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto auto;
  gap:8px;
}
.taking-assessment .question-card{
  height:100%;
  min-height:0 !important;
  overflow:hidden !important;
}
.rc-two-column,
.assessment-question-layout.rc-two-column,
.assessment-question-layout{
  height:100% !important;
  min-height:0 !important;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:14px;
  align-items:stretch;
}
.rc-two-column .passage-column,
.rc-two-column .qa-column{
  height:100% !important;
  max-height:none !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden;
  scrollbar-gutter:stable;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
}
.rc-two-column .qa-column{
  padding:18px;
  display:block !important;
}
.rc-two-column .passage-panel,
.rc-passage{
  height:auto !important;
  min-height:100%;
}
.rc-two-column .passage-body{
  max-height:none !important;
  height:auto !important;
  overflow:visible !important;
}
.single-question-scroll{
  height:100%;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
}
.single-question-scroll .qa-column{
  max-height:none !important;
  overflow:visible !important;
  padding-right:0;
}
.answer-progress-mini{
  display:inline-flex;
  align-self:center;
  justify-self:center;
  background:rgba(255,255,255,.96);
  color:var(--muted);
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 12px;
  font-size:12.5px;
  font-weight:700;
  box-shadow:0 6px 18px rgba(16,24,20,.05);
}
.assessment-bottom-nav{
  margin-top:0 !important;
}
@media(max-width:900px){
  .assessment-live-view{
    height:auto;
    min-height:calc(100vh - 82px) !important;
    display:flex !important;
  }
  .rc-two-column,
  .assessment-question-layout.rc-two-column,
  .assessment-question-layout{
    height:auto !important;
    grid-template-columns:1fr !important;
  }
  .rc-two-column .passage-column{
    max-height:38vh !important;
    overflow-y:auto !important;
  }
  .rc-two-column .qa-column{
    max-height:none !important;
    overflow:visible !important;
  }
  .single-question-scroll{
    height:auto;
    overflow:visible;
  }
}


/* ===== Review-before-submit + submitted summary update ===== */
.pre-submit-status{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}
.marked-review-mini{
  display:inline-flex;
  align-self:center;
  justify-self:center;
  background:rgba(255,247,221,.96);
  color:var(--warning);
  border:1px solid #f0deaa;
  border-radius:999px;
  padding:6px 12px;
  font-size:12.5px;
  font-weight:700;
  box-shadow:0 6px 18px rgba(16,24,20,.05);
}
#markReviewBtn.review-active{
  background:#fff7dd;
  color:var(--warning);
  border-color:#f0deaa;
}
.answer-pill.review{
  background:#fff7dd;
  color:var(--warning);
  border-color:#f0deaa;
}
.submitted-summary-card .rich-content{
  font-weight:400;
}
.submitted-answer-block{
  margin-top:12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:12px 14px;
}
.correct-answer-block{
  border-color:#b8dfc3;
  background:#fbfffd;
}
.submitted-summary-card h3{
  margin-top:0;
}
/* No active option-like controls appear after submission. */
#submittedView input[type="radio"],
#submittedView .option{
  display:none !important;
}


/* ===== Final submission display + image shape controls ===== */
.submitted-only-view .assessment-top.submitted-hero{
  margin-bottom:14px;
}
.submitted-only-view .assessment-top.submitted-hero h2{
  margin:0 0 6px;
  color:var(--green-dark);
}
.submitted-only-view .summary-grid,
.submitted-only-view .assessment-bottom-nav,
.submitted-only-view .pre-submit-status,
.submitted-only-view .timer-strip{
  display:none !important;
}
.submitted-summary-card{
  background:#fff;
}
.submitted-selected-line{
  margin:8px 0 12px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fcfa;
}
.read-only-option{
  pointer-events:none;
}
.review-option.read-only-option .note{
  display:none !important;
}
.review-option.read-only-option.selected{
  border-color:var(--green);
  background:#f4fbf6;
}
.explanation-box{
  margin-top:14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fbfffd;
  padding:14px;
}
.img-square{
  border-radius:0 !important;
}
.img-rounded{
  border-radius:16px !important;
}
.img-circle{
  border-radius:999px !important;
  aspect-ratio:1/1;
  object-fit:cover;
}
.rich-editor img.img-circle,
.rich-content img.img-circle{
  aspect-ratio:1/1;
  object-fit:cover;
}


/* ===== Final submitted-state fix ===== */
#assessmentView.hidden,
body.submitted-assessment #assessmentView,
body.submitted-assessment .assessment-live-view,
body.submitted-assessment .assessment-bottom-nav,
body.submitted-assessment .assessment-only-timer,
body.submitted-assessment .question-card,
body.submitted-assessment .pre-submit-status{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
body.submitted-assessment .container{
  margin-top:18px !important;
}
.submitted-only-view{
  margin-top:0 !important;
}
.submitted-hero{
  margin-top:0 !important;
}


/* ===== Complete submitted-state hard fix ===== */
body.submitted-assessment #assessmentView,
body.submitted-assessment .assessment-live-view,
body.submitted-assessment .assessment-only-timer,
body.submitted-assessment .timer-strip,
body.submitted-assessment .question-card,
body.submitted-assessment .assessment-bottom-nav,
body.submitted-assessment .pre-submit-status,
body.submitted-assessment .answer-progress-mini,
body.submitted-assessment .marked-review-mini{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
body.submitted-assessment .container{
  margin-top:18px !important;
}
.submitted-only-view{
  margin-top:0 !important;
}
.submitted-hero{
  margin-top:0 !important;
}
.review-option.read-only-option{
  pointer-events:none;
}
.review-option.read-only-option .note{
  display:none !important;
}
.review-option.read-only-option.selected{
  border-color:var(--green);
  background:#f4fbf6;
}
.review-option.read-only-option.correct-answer{
  border-color:#b8dfc3;
  background:#fbfffd;
}
.submitted-selected-line{
  margin:8px 0 12px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fcfa;
}
.explanation-box{
  margin-top:14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fbfffd;
  padding:14px;
}


/* ===== Last correction: show question statement in submitted response ===== */
.submitted-question-statement{
  margin:10px 0 12px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#f8fcfa;
}
.submitted-question-statement > strong{
  display:block;
  margin-bottom:6px;
  color:var(--green-dark);
}
.submitted-question-statement .rich-content{
  font-weight:400;
}
.assessment-bottom-nav button:disabled{
  opacity:.65;
  cursor:not-allowed;
}


/* ===== Final requested UI/security update ===== */
.login-card input#loginId::placeholder,
.login-card input#password::placeholder,
#adminId::placeholder,
#adminPassword::placeholder{
  color:transparent;
}
#dataMode{display:none!important;}

.compact-admin-hero{
  padding:18px 22px !important;
  margin-bottom:14px !important;
}
.compact-admin-hero h2{
  margin:0 !important;
  font-size:28px;
}
.admin-section{
  height:calc(100vh - 190px);
  min-height:560px;
  overflow:hidden;
}
.admin-section .sticky-panel,
.admin-section .admin-main{
  height:100%;
  min-height:0;
  overflow:auto;
  scrollbar-gutter:stable;
}
.admin-section .sticky-panel{
  position:static !important;
}
.admin-section .admin-main > .card{
  min-height:100%;
}
@media(max-width:980px){
  .admin-section{
    height:auto;
    overflow:visible;
  }
  .admin-section .sticky-panel,
  .admin-section .admin-main{
    height:auto;
    overflow:visible;
  }
}

.taking-assessment{
  user-select:none;
  -webkit-user-select:none;
}
.taking-assessment input,
.taking-assessment textarea,
.taking-assessment button{
  user-select:auto;
  -webkit-user-select:auto;
}
.small-logout{
  padding:9px 12px;
  border-radius:999px;
  box-shadow:none;
}
.taking-assessment .header-actions .button-link.secondary{
  display:none;
}
.taking-assessment .header-actions{
  gap:8px;
}

.assessment-live-view{
  grid-template-rows:auto auto minmax(0,1fr) auto auto !important;
}
.question-navigator{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.82);
  border:1px solid var(--line);
  border-radius:18px;
  padding:8px;
  box-shadow:0 6px 18px rgba(16,24,20,.05);
}
.qnav-dot{
  width:31px;
  height:31px;
  border-radius:11px;
  padding:0;
  font-size:12px;
  font-weight:850;
  box-shadow:none;
  border:1px solid var(--line);
  background:#fff;
  color:var(--muted);
}
.qnav-dot.answered{
  background:#e6f4ea;
  color:var(--success);
  border-color:#b8dfc3;
}
.qnav-dot.unanswered{
  background:#fff;
  color:var(--muted);
}
.qnav-dot.marked{
  background:#fff7dd;
  color:var(--warning);
  border-color:#f0deaa;
}
.qnav-dot.current{
  outline:3px solid rgba(26,160,91,.18);
  border-color:var(--green);
  color:var(--green-dark);
}
.qnav-dot.marked.answered{
  background:linear-gradient(135deg,#e6f4ea 0 54%,#fff7dd 55% 100%);
}

.timer-warning-15{
  border-color:#f0deaa !important;
  background:#fffaf0 !important;
}
.timer-danger-1{
  border-color:#f3c4bf !important;
  background:#fff5f4 !important;
}
.timer-warning-15 .timer-label,
.timer-warning-15 .timer-clock{
  color:var(--warning) !important;
}
.timer-danger-1 .timer-label,
.timer-danger-1 .timer-clock{
  color:var(--danger) !important;
}

.assessment-bottom-nav{
  gap:10px;
}
.assessment-bottom-nav .hidden{
  display:none!important;
}
.scroll-more-hint{
  position:sticky;
  bottom:4px;
  margin:8px auto 0;
  width:max-content;
  max-width:100%;
  background:rgba(26,160,91,.96);
  color:#fff;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:800;
  box-shadow:0 8px 20px rgba(26,160,91,.22);
  pointer-events:none;
}

.submitted-banner-card{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  margin-top:10px;
  overflow:hidden;
  box-shadow:0 4px 14px rgba(16,24,20,.04);
}
.submitted-banner-card summary{
  cursor:pointer;
  list-style:none;
  display:grid;
  grid-template-columns:120px 120px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:13px 15px;
}
.submitted-banner-card summary::-webkit-details-marker{display:none;}
.submitted-qno{
  color:var(--green-dark);
  font-weight:850;
}
.submitted-result{
  display:inline-flex;
  width:max-content;
  border-radius:999px;
  padding:4px 9px;
  font-size:12px;
  font-weight:850;
  border:1px solid var(--line);
}
.submitted-result.correct{
  background:#e6f4ea;
  color:var(--success);
  border-color:#b8dfc3;
}
.submitted-result.incorrect{
  background:#fceeee;
  color:var(--danger);
  border-color:#f3c4bf;
}
.submitted-result.level{
  background:var(--soft);
  color:var(--green-dark);
  border-color:#c9ead6;
}
.submitted-selected{
  color:var(--muted);
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.see-more-text{
  color:var(--green-dark);
  font-size:13px;
  font-weight:850;
}
.submitted-banner-card[open] .see-more-text::after{
  content:"";
}
.submitted-banner-card[open] .see-more-text{
  color:var(--muted);
}
.submitted-banner-card[open] .see-more-text{
  font-size:0;
}
.submitted-banner-card[open] .see-more-text::before{
  content:"See less";
  font-size:13px;
}
.submitted-detail{
  border-top:1px solid var(--line);
  padding:14px 16px 16px;
}
@media(max-width:760px){
  .question-navigator{
    justify-content:flex-start;
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:10px;
  }
  .qnav-dot{
    flex:0 0 auto;
  }
  .submitted-banner-card summary{
    grid-template-columns:1fr auto;
  }
  .submitted-selected{
    grid-column:1 / -1;
  }
}


/* ===== Admin library restored + final submission polish ===== */
.admin-library-card{
  margin-bottom:18px;
}
.admin-library-card .library-head h2{
  margin:0 0 4px;
}
.library-actions{
  justify-content:flex-end;
  margin-top:0;
}
.restored-set-toolbar{
  position:static !important;
  margin:10px 0 12px !important;
}
.restored-set-toolbar input{
  max-width:560px;
}
.library-scroll{
  max-height:310px !important;
  overflow:auto !important;
}
@media(max-width:900px){
  .library-actions{
    justify-content:flex-start;
  }
  .library-actions button{
    padding:9px 11px;
    font-size:12px;
  }
}

.celebratory-submitted-hero{
  text-align:left;
  background:
    radial-gradient(circle at 8% 12%, rgba(26,160,91,.18), transparent 9rem),
    linear-gradient(180deg,#f5fff8 0%,#ffffff 100%);
  border-color:#b8dfc3;
}
.celebratory-submitted-hero h2{
  color:var(--green-dark);
}
.celebration-icon{
  width:42px;
  height:42px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--green);
  color:#fff;
  font-weight:950;
  font-size:22px;
  margin-bottom:10px;
  box-shadow:0 12px 24px rgba(26,160,91,.22);
}
.submitted-result.unanswered,
.answer-pill.unanswered{
  background:#fff7dd;
  color:var(--warning);
  border-color:#f0deaa;
}
.submitted-banner-card.unanswered{
  border-color:#f0deaa;
}


/* ===== Final admin/student polish from latest review ===== */
#adminLogoutBtn{display:inline-flex;}
.header-actions #adminLogoutBtn.hidden{display:none!important;}
.admin-section{
  margin-top:14px !important;
  height:calc(100vh - 245px) !important;
}
.admin-section .admin-main > .card > .card-body{
  padding-top:14px !important;
}
#currentSetBanner{
  margin-bottom:8px !important;
  padding:12px 16px !important;
  min-height:auto !important;
}
.admin-question-nav,
.admin-section .question-nav{
  position:sticky !important;
  top:0 !important;
  z-index:70 !important;
  justify-content:center !important;
  margin:0 0 12px !important;
  padding:12px !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 10px 26px rgba(16,24,20,.10) !important;
}
.admin-question-nav select{
  flex:0 1 420px;
  min-width:260px;
}
.restored-set-toolbar{
  justify-content:flex-end !important;
}
.restored-set-toolbar input#setSearch{
  margin-left:auto !important;
  max-width:520px !important;
}
#saveStatus{
  white-space:nowrap;
}
.library-actions button,
.action-row button{
  white-space:nowrap;
}
.action-row{
  flex-wrap:wrap;
}
/* Make the assessment scroll hint feel like a side instruction, not a button. */
.scroll-more-hint{
  position:sticky !important;
  bottom:10px !important;
  margin:8px 0 0 auto !important;
  width:max-content !important;
  background:rgba(255,255,255,.92) !important;
  color:var(--green-dark) !important;
  border:1px solid #b8dfc3 !important;
  border-radius:12px !important;
  padding:5px 9px !important;
  font-size:12px !important;
  font-weight:700 !important;
  box-shadow:0 6px 18px rgba(16,24,20,.08) !important;
  pointer-events:none !important;
  animation:scrollHintJump 1.4s ease-in-out infinite;
}
@keyframes scrollHintJump{
  0%,100%{transform:translateY(0);opacity:.72;}
  50%{transform:translateY(5px);opacity:1;}
}
#submitBtn.primary{
  background:#1aa05b !important;
  color:#fff !important;
}
body.is-submitting #questionCard,
body.is-submitting #questionNavigator,
body.is-submitting .pre-submit-status{
  opacity:.45;
  pointer-events:none;
  filter:grayscale(.1);
}
body.is-submitting #submitBtn{
  opacity:.85;
}
body.submitted-assessment{
  user-select:none;
  -webkit-user-select:none;
}
body.submitted-assessment #reviewArea,
body.submitted-assessment #submittedView{
  user-select:none;
  -webkit-user-select:none;
}
.submitted-banner-card summary{
  grid-template-columns:120px minmax(180px,max-content) auto !important;
}
.submitted-banner-card .submitted-selected{
  display:none !important;
}
.submitted-result{
  white-space:nowrap;
}
@media(max-width:900px){
  .admin-section{height:auto !important;}
  .admin-question-nav,.admin-section .question-nav{position:static !important;}
  .admin-question-nav select{min-width:0;flex:1 1 100%;}
  .restored-set-toolbar{justify-content:flex-start !important;}
  .restored-set-toolbar input#setSearch{margin-left:0 !important;max-width:100% !important;}
}

/* ===== 09 May follow-up polish: admin toolbar, readable export and submit placement ===== */
.library-head-with-search{
  align-items:center !important;
  gap:16px !important;
}
.library-title-block{
  flex:1 1 320px;
  min-width:260px;
}
.library-head-with-search .library-actions{
  flex:2 1 760px;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:nowrap !important;
  gap:10px !important;
  margin-top:0 !important;
}
.library-search-input{
  flex:0 1 320px;
  min-width:220px;
  max-width:340px;
  height:46px;
  padding:10px 14px !important;
}
.restored-set-toolbar{
  display:none !important;
}
#setMessage{
  margin:8px 0 12px !important;
}
#setMessage .notice{
  margin-top:0 !important;
}
.admin-question-nav,
.admin-section .question-nav.admin-question-nav{
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:thin;
  padding:12px !important;
}
.admin-question-nav button{
  flex:0 0 auto !important;
  white-space:nowrap !important;
  padding:10px 14px !important;
  border-radius:14px !important;
}
.admin-question-nav select{
  flex:1 1 300px !important;
  min-width:220px !important;
  max-width:none !important;
}
.question-save-status{
  flex:0 0 auto;
  white-space:nowrap;
  border-radius:999px;
  padding:7px 11px;
  font-size:12.5px;
  font-weight:800;
  border:1px solid var(--line);
  background:#fff;
  color:var(--muted);
}
.question-save-status:empty{
  display:none;
}
.question-save-status.success{
  background:#e6f4ea;
  color:var(--success);
  border-color:#b8dfc3;
}
.question-save-status.warning{
  background:#fff7dd;
  color:var(--warning);
  border-color:#f0deaa;
}
.question-save-status.error{
  background:#fceeee;
  color:var(--danger);
  border-color:#f3c4bf;
}
.assessment-bottom-nav{
  justify-content:flex-start !important;
  align-items:center !important;
}
#submitBtn{
  margin-left:auto !important;
  min-width:112px;
}
.scroll-more-hint{
  position:sticky !important;
  bottom:10px !important;
  margin:8px 0 0 auto !important;
  width:max-content !important;
  max-width:100% !important;
  background:#1aa05b !important;
  color:#fff !important;
  border:1px solid #1aa05b !important;
  border-radius:999px !important;
  padding:9px 14px !important;
  font-size:13px !important;
  font-weight:850 !important;
  box-shadow:0 10px 24px rgba(26,160,91,.28) !important;
  pointer-events:none !important;
  animation:scrollHintJump 1.2s ease-in-out infinite;
}
body.submitted-assessment .header-actions .button-link.secondary{
  display:none !important;
}
@media(max-width:1200px){
  .library-head-with-search .library-actions{
    flex-wrap:wrap !important;
    justify-content:flex-start !important;
  }
  .library-search-input{
    flex:1 1 260px;
    max-width:100%;
  }
}
@media(max-width:760px){
  #submitBtn{
    margin-left:0 !important;
    width:100%;
  }
  .assessment-bottom-nav{
    justify-content:center !important;
  }
}

/* ===== TEPS ASSESSMENT Revised Version final requested layout fixes ===== */
/* Assessment navigation: keep Back, Next and Mark for review centred; keep Submit at the far right. */
.assessment-bottom-nav{
  display:grid !important;
  grid-template-columns:1fr auto 1fr !important;
  align-items:center !important;
  justify-content:stretch !important;
  gap:10px !important;
}
.assessment-nav-main{
  grid-column:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.assessment-nav-main button{
  white-space:nowrap;
}
#submitBtn{
  grid-column:3;
  justify-self:end;
  margin-left:0 !important;
  min-width:112px;
}

/* Set Library: remove unused helper text space and tighten the header. */
.library-note,
.library-title-block .library-note{
  display:none !important;
}
.library-head-with-search{
  margin-bottom:8px !important;
  align-items:center !important;
}
.library-title-block h2{
  margin:0 !important;
}

/* Admin question controls: one compact line with inline save feedback and no horizontal scroll on normal desktop screens. */
.admin-question-nav,
.admin-section .question-nav.admin-question-nav{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:visible !important;
  scrollbar-width:none !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  padding:9px 10px !important;
}
.admin-question-nav::-webkit-scrollbar{
  display:none;
}
.admin-question-nav button{
  flex:0 0 auto !important;
  white-space:nowrap !important;
  padding:8px 10px !important;
  border-radius:12px !important;
  font-size:12.5px !important;
  box-shadow:none !important;
}
.admin-question-nav select{
  flex:1 1 220px !important;
  min-width:180px !important;
  max-width:360px !important;
  height:40px !important;
  padding:8px 12px !important;
  font-size:13px !important;
}
.question-save-status{
  flex:0 0 auto !important;
  white-space:nowrap !important;
  max-width:150px;
  overflow:hidden;
  text-overflow:ellipsis;
  padding:6px 9px !important;
  font-size:12px !important;
}
#currentSetBanner{
  margin-bottom:6px !important;
}

@media(max-width:900px){
  .assessment-bottom-nav{
    grid-template-columns:1fr !important;
  }
  .assessment-nav-main{
    grid-column:1;
  }
  #submitBtn{
    grid-column:1;
    justify-self:center;
    width:auto !important;
  }
  .admin-question-nav,
  .admin-section .question-nav.admin-question-nav{
    flex-wrap:wrap !important;
  }
  .admin-question-nav select{
    flex:1 1 100% !important;
    max-width:none !important;
  }
}


/* ===== Focused changes: summary toggle, faster first screen and scroll hint for all questions ===== */
.login-page .container,
.instruction-page .container{
  margin:12px auto !important;
  display:flex;
  align-items:center;
}
.login-page .grid.two{width:100%;gap:16px;}
.login-page .card-body,
.instruction-page .card-body{padding:20px 22px !important;}
.login-page h2,
.instruction-page h2{font-size:25px !important;margin-bottom:8px !important;}
.login-page h3,
.instruction-page h3{margin:10px 0 6px !important;}
.login-page .lead{font-size:14.5px !important;margin-bottom:8px !important;}
.login-page .instruction-box,
.login-page .support-box,
.instruction-page .instruction-box{margin-top:10px !important;padding:12px 14px !important;}
.login-page .clean-list li{margin:5px 0 !important;}
.login-page .field{margin-bottom:9px !important;}
.login-page input[type=text],
.login-page input[type=password],
.login-page input[type=email]{padding:10px 12px !important;}
.login-page .btn-row,
.instruction-page .btn-row{margin-top:10px !important;}
.login-page .footer,
.instruction-page .footer,
body.submitted-assessment.no-question-summary .footer{padding:10px 16px !important;background:#fff !important;}
.login-page .footer-inner img,
.instruction-page .footer-inner img,
body.submitted-assessment.no-question-summary .footer-inner img{height:34px !important;}
.instruction-page #beginView{width:100%;}
.instruction-page .summary-grid{margin-top:10px !important;gap:10px !important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr)) !important;}
.instruction-page .summary-box{padding:10px 12px !important;}
.instruction-page .summary-box strong{font-size:18px !important;}
.instruction-page .instruction-box{max-height:32vh;overflow:auto;}
body.submitted-assessment.no-question-summary .container{margin:16px auto !important;}
body.submitted-assessment.no-question-summary .submitted-hero{margin-bottom:0 !important;}
.single-question-scroll{position:relative;}
.single-question-scroll .scroll-more-hint,
.rc-two-column .qa-column .scroll-more-hint{display:block;}
@media(max-height:760px) and (min-width:900px){
  .login-page .header-inner,.instruction-page .header-inner{padding:8px 0 !important;}
  .login-page .brand-logo,.instruction-page .brand-logo{height:42px !important;}
  .login-page .brand-title h1,.instruction-page .brand-title h1{font-size:18px !important;}
  .login-page .brand-title p,.instruction-page .brand-title p{display:none;}
  .login-page .container,.instruction-page .container{margin:8px auto !important;}
  .login-page .card-body,.instruction-page .card-body{padding:16px 18px !important;}
  .login-page .support-box{font-size:13px;}
}


/* ===== Final footer + rich-text colour patch ===== */
/* Keep the footer as the same long horizontal bar used across the site. */
.footer{
  width:100% !important;
  border-top:1px solid var(--line) !important;
  background:rgba(255,255,255,.96) !important;
  padding:12px 16px !important;
  border-radius:0 !important;
  box-shadow:0 -2px 14px rgba(16,24,20,.035) !important;
}
.footer-inner{
  width:min(1320px,calc(100% - 32px)) !important;
  margin:0 auto !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:12px !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
  min-height:34px !important;
}
.footer-inner img{height:38px !important;width:auto !important;object-fit:contain !important;}
.footer-inner span{font-size:14px;color:var(--muted);}

/* Login and instruction pages: use space cleanly without stretching cards or creating empty white blocks. */
.login-page .page,
.instruction-page .page,
body.submitted-assessment .page{min-height:100vh;display:flex;flex-direction:column;}
.login-page .container,
.instruction-page .container,
body.submitted-assessment .container{
  flex:1 1 auto !important;
  width:min(1320px,calc(100% - 32px)) !important;
  margin:16px auto !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  overflow:visible !important;
}
.login-page .grid.two{
  width:100% !important;
  gap:18px !important;
  align-items:start !important;
}
.login-page .card,
.instruction-page .card{
  align-self:start !important;
}
.login-page .card-body{padding:22px 24px !important;}
.instruction-page .card-body{padding:22px 24px !important;}
.login-page h2,.instruction-page h2{font-size:26px !important;margin-bottom:8px !important;}
.login-page h3,.instruction-page h3{margin:12px 0 7px !important;}
.login-page .lead{font-size:15px !important;margin-bottom:8px !important;}
.login-page .instruction-box,.login-page .support-box,.instruction-page .instruction-box{margin-top:12px !important;padding:13px 15px !important;}
.login-page .clean-list li{margin:5px 0 !important;}
.login-page .field{margin-bottom:10px !important;}
.login-page input[type=text],.login-page input[type=password],.login-page input[type=email]{padding:11px 12px !important;}
.login-page .btn-row,.instruction-page .btn-row{margin-top:12px !important;}
.instruction-page #beginView{width:100% !important;}
.instruction-page .summary-grid{margin-top:12px !important;gap:12px !important;grid-template-columns:repeat(auto-fit,minmax(165px,1fr)) !important;}
.instruction-page .summary-box{padding:12px 14px !important;}
.instruction-page .summary-box strong{font-size:19px !important;}
.instruction-page .instruction-box{max-height:none !important;overflow:visible !important;}

/* Submitted page: avoid hidden internal scroll areas; use normal page flow and keep footer visible. */
body.submitted-assessment .footer{display:block !important;}
body.submitted-assessment .submitted-only-view,
body.submitted-assessment #reviewArea,
body.submitted-assessment .submitted-detail,
body.submitted-assessment .submitted-hero{
  max-height:none !important;
  overflow:visible !important;
}
body.submitted-assessment.no-question-summary .container{margin:18px auto !important;}
body.submitted-assessment.no-question-summary .submitted-hero{margin-bottom:10px !important;}
body.submitted-assessment.no-question-summary .notice.success{margin-bottom:0 !important;}

/* Rich text toolbar colour dropdown. */
.toolbar-colour-select{
  width:auto !important;
  min-width:118px !important;
  max-width:140px !important;
  padding:7px 9px !important;
  border-radius:10px !important;
  font-size:12px !important;
  font-weight:700 !important;
  border:1px solid var(--line) !important;
  background:#fff !important;
  color:var(--text) !important;
  box-shadow:none !important;
}
.rich-content span[style*="color"],
.rich-content font[style*="color"],
.rich-editor span[style*="color"],
.rich-editor font[style*="color"]{font-weight:inherit;}

@media(max-width:980px){
  .login-page .grid.two{grid-template-columns:1fr !important;}
  .login-page .container,.instruction-page .container,body.submitted-assessment .container{width:min(100% - 24px,1320px) !important;margin:14px auto !important;}
}
@media(max-height:760px) and (min-width:900px){
  .login-page .header-inner,.instruction-page .header-inner{padding:7px 0 !important;}
  .login-page .brand-logo,.instruction-page .brand-logo{height:40px !important;}
  .login-page .brand-title h1,.instruction-page .brand-title h1{font-size:18px !important;}
  .login-page .brand-title p,.instruction-page .brand-title p{display:none;}
  .login-page .container,.instruction-page .container{margin:10px auto !important;}
  .login-page .card-body,.instruction-page .card-body{padding:18px 20px !important;}
  .footer{padding:9px 16px !important;}
  .footer-inner img{height:32px !important;}
}


/* ===== Text colour controls update ===== */
.text-colour-select,
.toolbar-colour-select{
  min-width:128px;
  border-radius:12px;
  padding:8px 10px;
  font-weight:850;
  background:#fff;
}
.set-colour-actions button{
  width:100%;
  justify-content:center;
}
.rich-editor, .rich-content, .prompt, .option-content, .passage-body{
  color:#000;
}


/* ===== Unified TEPS platform additions ===== */
.grid.four{grid-template-columns:repeat(4,minmax(0,1fr));}
.platform-hub{margin-bottom:22px;}
.platform-card-button{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:24px;color:var(--text);min-height:150px;text-decoration:none;}
.platform-card-button span{font-size:22px;font-weight:950;color:var(--green-dark);letter-spacing:-.03em;}
.platform-card-button small{font-size:13px;color:var(--muted);font-weight:750;line-height:1.4;}
.platform-card-button:hover{border-color:var(--green);background:var(--soft);transform:translateY(-2px);}
.tool-shell{display:grid;grid-template-columns:360px minmax(0,1fr);gap:22px;align-items:start;}
.tool-sidebar{position:sticky;top:92px;}
.tool-library-list{display:grid;gap:10px;max-height:560px;overflow:auto;padding-right:3px;}
.tool-library-item{border:1px solid var(--line);background:#fff;border-radius:18px;padding:14px;cursor:pointer;}
.tool-library-item.active,.tool-library-item:hover{border-color:var(--green);background:var(--soft);}
.tool-library-title{font-weight:950;color:var(--ink);line-height:1.2;}
.tool-library-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;}
.tool-workspace-grid{display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px;align-items:start;}
.tool-item-list{display:grid;gap:10px;max-height:620px;overflow:auto;}
.tool-item-button{display:block;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:16px;padding:12px;color:var(--text);}
.tool-item-button.active{background:var(--soft);border-color:var(--green);}
.tool-q-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;}
.tool-q-tab{padding:9px 12px;border-radius:12px;background:#fff;border:1px solid var(--line);color:var(--text);font-weight:900;}
.tool-q-tab.active{background:var(--green);color:#fff;border-color:var(--green);}
.logic-preview{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;background:#fbfdfb;border:1px solid var(--line);border-radius:16px;padding:12px;white-space:pre-wrap;max-height:220px;overflow:auto;}
.question-navigator .question-dot.skipped,.question-dot.skipped{background:#f5eadf;color:#8a5a00;border-color:#e4c7a3;}
.question-dot.unanswered{background:#fff7dd;color:#8a5a00;border-color:#f0deaa;}
.tool-submit-summary{max-width:760px;margin:0 auto;}
@media(max-width:1100px){.grid.four{grid-template-columns:repeat(2,minmax(0,1fr));}.tool-shell,.tool-workspace-grid{grid-template-columns:1fr}.tool-sidebar{position:static}}
@media(max-width:700px){.grid.four{grid-template-columns:1fr}.platform-card-button{min-height:auto}.tool-q-tabs{overflow:auto;flex-wrap:nowrap}.tool-q-tab{white-space:nowrap}.question-map{overflow:auto;flex-wrap:nowrap;padding-bottom:4px}.question-dot{min-width:38px}}
.obs-between{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.obs-pill{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:900;background:#fff;color:var(--muted)}.toggle-row{display:flex;gap:10px;align-items:center;margin:8px 0 14px}.toggle-row input{width:auto}

/* ===== Observation creator UX update: horizontal set library + rich authoring ===== */
.obs-library-card{margin-bottom:22px;}
.obs-library-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap;}
.obs-set-row{display:grid;grid-template-columns:repeat(4,minmax(240px,1fr));gap:14px;margin-top:18px;}
.obs-set-card{appearance:none;text-align:left;border:1px solid var(--line);background:#fff;border-radius:22px;padding:18px;cursor:pointer;box-shadow:0 10px 26px rgba(20,40,28,.04);color:var(--text);display:flex;flex-direction:column;gap:10px;min-height:178px;}
.obs-set-card:hover,.obs-set-card.active{border-color:var(--green);background:var(--soft);transform:translateY(-1px);}
.obs-set-card-top{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.obs-set-card-title{font-weight:950;color:var(--ink);font-size:19px;line-height:1.18;letter-spacing:-.025em;}
.obs-set-card-code{display:inline-flex;align-self:flex-start;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;color:var(--muted);font-weight:900;font-size:13px;letter-spacing:.02em;}
.obs-set-card-foot{margin-top:auto;color:var(--muted);font-size:12px;font-weight:800;}
.obs-question-workspace{grid-template-columns:320px minmax(0,1fr);align-items:start;}
.obs-item-sidebar{position:sticky;top:92px;}
.obs-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.7fr);gap:16px;align-items:start;margin-top:16px;}
.obs-question-editor .rich-editor{min-height:130px;}
.obs-question-editor .rich-editor.large{min-height:180px;}
.obs-toolbar{border-radius:14px 14px 0 0;margin-top:4px;}
.obs-toolbar select{width:auto;min-width:118px;padding:7px 10px;border-radius:10px;font-size:13px;}
.obs-rich-editor{border-radius:0 0 14px 14px;}
.obs-option-card .rich-editor{min-height:76px;}
.obs-option-card .form-row{grid-template-columns:90px minmax(0,1fr);}
.obs-option-card .option-card-header{margin-bottom:8px;}
.obs-question-editor details.support-box{margin-top:16px;}
.obs-question-editor summary{cursor:pointer;color:var(--green-dark);}
.rich-content ul,.rich-content ol{margin:8px 0;padding-left:22px;}.rich-content p{margin:0 0 8px;}
@media(max-width:1180px){.obs-set-row{grid-template-columns:repeat(2,minmax(220px,1fr));}.obs-editor-grid{grid-template-columns:1fr;}}
@media(max-width:700px){.obs-set-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;}.obs-set-card{min-width:82%;scroll-snap-align:start}.obs-library-head{display:block}.obs-library-head .btn-row{margin-top:14px}.obs-question-workspace{grid-template-columns:1fr}.obs-item-sidebar{position:static}.obs-option-card .form-row{grid-template-columns:1fr}.obs-toolbar{overflow-x:auto;white-space:nowrap;}.obs-toolbar button,.obs-toolbar select{flex:0 0 auto;}.card-body{padding:22px}}

/* ===== Observation creator UX refinement: lateral library + creator-first workspace ===== */
.obs-library-card .card-body{padding:26px 30px;}
.obs-library-actions{align-items:center;}
.obs-set-row{
  display:flex !important;
  gap:16px;
  overflow-x:auto;
  padding:6px 4px 14px;
  margin-top:18px;
  scroll-snap-type:x proximity;
}
.obs-set-row::-webkit-scrollbar{height:8px}.obs-set-row::-webkit-scrollbar-thumb{background:#c9ead6;border-radius:999px}.obs-set-row::-webkit-scrollbar-track{background:#f5fbf7;border-radius:999px}
.obs-set-card{
  flex:0 0 305px;
  min-width:305px;
  max-width:305px;
  scroll-snap-align:start;
}
.obs-creator-grid{
  display:grid;
  grid-template-columns:minmax(290px,25%) minmax(0,75%);
  gap:22px;
  align-items:start;
}
.obs-left-stack{display:grid;gap:18px;align-self:start;position:sticky;top:92px;}
.obs-main-stack{min-width:0;}
.obs-set-details-card .card-body,.obs-items-card .card-body{padding:24px;}
.obs-set-details-card h2,.obs-items-card h2{font-size:24px;}
.obs-compact-item-list{max-height:420px;overflow:auto;padding-right:4px;}
.obs-item-editor-card .card-body{padding:28px;}
.obs-item-editor-card .compact-actions{margin-top:0;}
.obs-question-editor .field > label,.obs-option-card label{font-weight:900;color:var(--ink);}
.obs-toolbar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:8px;
  border:1px solid var(--line);
  border-bottom:0;
  background:#fbfdfb;
}
.obs-toolbar button,.obs-toolbar select{
  min-height:34px;
  padding:7px 10px;
  border-radius:10px;
  font-size:13px;
}
.obs-toolbar button{background:#fff;color:var(--text);border:1px solid var(--line);}
.obs-toolbar button:hover{border-color:var(--green);background:var(--soft);}
.obs-rich-editor:focus{background:#fff;}
.obs-rich-editor[contenteditable="true"]{line-height:1.65;}
.obs-option-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;margin:12px 0;}
.obs-option-card .option-card-header{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.obs-question-editor details.support-box[open]{background:#fbfdfb;}
@media(max-width:1120px){
  .obs-creator-grid{grid-template-columns:1fr;}
  .obs-left-stack{position:static;grid-template-columns:1fr 1fr;}
}
@media(max-width:760px){
  .obs-library-card .card-body{padding:22px;}
  .obs-set-card{flex-basis:82%;min-width:82%;max-width:82%;}
  .obs-creator-grid{grid-template-columns:1fr;}
  .obs-left-stack{grid-template-columns:1fr;}
  .obs-library-actions{width:100%;}
  .obs-library-actions button,.obs-library-actions .button-link{flex:1 1 145px;}
  .obs-item-editor-card .compact-actions{width:100%;}
  .obs-item-editor-card .compact-actions button{flex:1 1 120px;}
  .obs-toolbar{overflow-x:auto;flex-wrap:nowrap;}
  .obs-toolbar button,.obs-toolbar select{flex:0 0 auto;}
}

/* ===== Observation creator parity pass: Assessment-style set library + mature editor ===== */
.obs-library-table-wrap{margin-top:16px;max-height:360px;overflow:auto;}
.obs-set-library-table{min-width:1080px;}
.obs-set-library-table tr.selected-row td{background:var(--soft);}
.link-button{background:transparent !important;border:0 !important;color:var(--green-dark) !important;padding:0 !important;display:inline !important;font-size:inherit !important;text-align:left !important;box-shadow:none !important;}
.link-button:hover{text-decoration:underline;transform:none !important;}
.library-filter-input{max-width:150px;min-width:132px;}
.table-actions{margin-top:0;gap:8px;flex-wrap:nowrap;}
.table-actions button{padding:8px 10px;font-size:12px;border-radius:10px;white-space:nowrap;}
.obs-creator-grid{display:grid;grid-template-columns:minmax(280px,25%) minmax(0,75%);gap:22px;align-items:start;margin-top:22px;}
.obs-left-stack{display:grid;gap:18px;align-self:start;position:sticky;top:92px;}
.obs-main-stack{min-width:0;}
.obs-set-details-card .card-body,.obs-items-card .card-body{padding:24px;}
.obs-set-details-card h2,.obs-items-card h2{font-size:24px;}
.obs-compact-item-list{max-height:420px;overflow:auto;padding-right:4px;}
.tool-item-button.complete{border-color:#b8dfc3;background:#fbfffd;}
.tool-item-button.incomplete{border-color:#f0deaa;background:#fffdf6;}
.tool-q-tab.complete{box-shadow:inset 0 -4px 0 #b8dfc3;}
.tool-q-tab.incomplete{box-shadow:inset 0 -4px 0 #f0deaa;}
.obs-item-editor-card .card-body{padding:28px;}
.obs-item-editor-card .compact-actions{margin-top:0;}
.obs-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.7fr);gap:18px;align-items:start;margin-top:16px;}
.obs-preview-card{position:sticky;top:92px;box-shadow:none;}
.obs-preview-card .question-card{box-shadow:none;padding:20px;border-radius:20px;}
.obs-preview-question .option{font-size:15px;padding:13px 14px;border-radius:16px;}
.obs-question-editor .field > label,.obs-option-card label{font-weight:900;color:var(--ink);}
.obs-question-editor .rich-editor{min-height:130px;}
.obs-question-editor .rich-editor.large{min-height:180px;}
.obs-toolbar{display:flex;gap:8px;flex-wrap:wrap;padding:8px;border:1px solid var(--line);border-bottom:0;background:#fbfdfb;border-radius:14px 14px 0 0;margin-top:4px;}
.obs-toolbar button,.obs-toolbar select{min-height:34px;padding:7px 10px;border-radius:10px;font-size:13px;}
.obs-toolbar button{background:#fff;color:var(--text);border:1px solid var(--line);}
.obs-toolbar button:hover{border-color:var(--green);background:var(--soft);}
.obs-toolbar select{width:auto;min-width:118px;}
.obs-rich-editor{border-radius:0 0 14px 14px;line-height:1.65;}
.obs-rich-editor:focus{background:#fff;}
.obs-option-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;margin:12px 0;}
.obs-option-card .option-card-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;}
.obs-option-card .form-row{grid-template-columns:90px minmax(0,1fr);}
.obs-logic-box summary{cursor:pointer;color:var(--green-dark);}
.obs-logic-box textarea{min-height:150px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;}
.obs-coverage-wrap{max-height:260px;overflow:auto;margin-top:12px;}
.obs-coverage-wrap table{min-width:620px;}
.rich-content ul,.rich-content ol,.rich-editor ul,.rich-editor ol{margin:8px 0;padding-left:22px;}
.rich-content p,.rich-editor p{margin:0 0 8px;}
.obs-pill{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:900;background:#fff;color:var(--muted);}
.obs-between{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;}
.toggle-row{display:flex;gap:10px;align-items:center;margin:8px 0 14px;}
.toggle-row input{width:auto;}
@media(max-width:1120px){.obs-creator-grid{grid-template-columns:1fr}.obs-left-stack{position:static;grid-template-columns:1fr 1fr}.obs-editor-grid{grid-template-columns:1fr}.obs-preview-card{position:static}.table-actions{flex-wrap:wrap}}
@media(max-width:760px){.obs-left-stack{grid-template-columns:1fr}.obs-library-table-wrap{overflow:auto}.library-actions button,.library-actions .button-link{flex:1 1 145px}.library-search-input,.library-filter-input{max-width:none;width:100%}.obs-item-editor-card .compact-actions{width:100%}.obs-item-editor-card .compact-actions button{flex:1 1 120px}.obs-option-card .form-row{grid-template-columns:1fr}.obs-toolbar{overflow-x:auto;flex-wrap:nowrap}.obs-toolbar button,.obs-toolbar select{flex:0 0 auto}.obs-set-library-table{min-width:980px}}

/* ===== Classroom Observation Builder Step UI v3 ===== */
.obs-builder-marker{display:inline-flex;margin:0 0 12px;padding:7px 12px;border-radius:999px;background:#e6f4ea;color:var(--success);font-size:12px;font-weight:900;border:1px solid #b8dfc3}
.obs-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:0 0 18px}.obs-summary-grid .summary-box.warning{border-color:#f0deaa;background:#fff7dd}.status-inactive{background:#f7f7f7;color:#66756d}.small-support{margin-top:0;padding:11px 13px}.obs-library-tools{align-items:end;margin:16px 0}.action-row button,.action-row .button-link{padding:8px 10px;font-size:12px}.builder-topbar{position:sticky;top:82px;z-index:35;margin-bottom:14px}.builder-topbar-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:8px}.builder-stepper{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:18px}.step-chip{background:#fff;color:var(--green-dark);border:1px solid var(--line);border-radius:16px;padding:12px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:68px}.step-chip.active{background:var(--soft);border-color:var(--green);box-shadow:var(--shadow)}.step-chip.complete small{color:var(--success)}.step-chip.warn small{color:var(--warning)}.step-chip span{font-weight:950}.step-chip small{font-size:11px;font-weight:850}.obs-builder-shell{display:grid;grid-template-columns:300px minmax(0,1fr) 280px;gap:18px;align-items:start}.obs-builder-left,.obs-builder-help{position:sticky;top:178px}.obs-builder-main{min-width:0}.obs-between{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}.obs-item-list{display:grid;gap:10px;max-height:calc(100vh - 310px);overflow:auto;padding-right:4px}.obs-item-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;border:1px solid var(--line);background:#fff;color:var(--text);text-align:left;border-radius:16px;padding:13px;width:100%}.obs-item-card.active{border-color:var(--green);background:var(--soft)}.question-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.question-tab{background:#fff;color:var(--green-dark);border:1px solid var(--line);border-radius:999px;padding:8px 12px}.question-tab.active{background:var(--green);color:#fff;border-color:var(--green)}.question-editor{border:1px solid var(--line);background:#fbfdfb;border-radius:22px;padding:20px}.option-editor-list{display:grid;gap:12px;margin-bottom:14px}.option-key-field{max-width:110px}.logic-textarea{min-height:180px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace}.coverage-table select{min-width:140px}.row-warn td{background:#fffaf0}.obs-collapse-btn{margin-bottom:14px}.issue-list li{margin-bottom:10px}.pending-list button{margin-left:8px}.rich-toolbar{border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;background:#fbfdfb;padding:8px;display:flex;gap:7px;flex-wrap:wrap}.rich-toolbar button,.toolbar-file{background:#fff;color:var(--text);border:1px solid var(--line);padding:7px 10px;border-radius:10px;font-size:12px;font-weight:850;cursor:pointer}.obs-rich{border-radius:0 0 14px 14px;min-height:110px}.obs-rich:empty:before{content:attr(data-placeholder);color:#99a6a0}.obs-rich img,.rich-content img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:12px;margin:10px 0;display:block}.preview-modal{position:fixed;inset:0;z-index:500;background:rgba(9,24,16,.62);padding:24px;overflow:auto}.preview-shell{width:min(1100px,calc(100% - 20px));margin:0 auto;background:#fff;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.25);padding:24px}.preview-shell.mobile-preview{width:420px}.preview-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:18px}.observer-q{margin-bottom:18px;box-shadow:none}.admin-dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:18px}.admin-module-grid{display:grid;grid-template-columns:1fr;gap:18px}.admin-module-card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);padding:24px}.admin-module-card.evaluation{border-color:#c9ead6}.admin-module-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.admin-module-stats{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.admin-utility-block{margin-bottom:20px}.id-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:0 0 18px}.password-mask{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;letter-spacing:.1em}.id-filter-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:10px;margin-bottom:12px}.edit-row td{background:#fbfdfb}.new-unsaved{display:inline-flex;border:1px solid #f0deaa;background:#fff7dd;color:var(--warning);border-radius:999px;padding:3px 8px;font-size:11px;font-weight:900;margin-left:6px}@media(max-width:1100px){.obs-builder-shell{grid-template-columns:1fr}.obs-builder-left,.obs-builder-help,.builder-topbar{position:static}.builder-stepper{grid-template-columns:repeat(2,minmax(0,1fr))}.builder-topbar-inner{flex-direction:column}.id-filter-row{grid-template-columns:1fr 1fr}}@media(max-width:700px){.builder-stepper{grid-template-columns:1fr}.preview-shell.mobile-preview,.preview-shell{width:100%;padding:16px}.preview-modal{padding:8px}.id-filter-row{grid-template-columns:1fr}}

/* ===== Observation Item Builder v4 ===== */
.admin-four-module-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch;margin-top:18px}.admin-four-module-row .admin-module-card{display:flex;flex-direction:column;min-height:260px}.admin-four-module-row .admin-module-stats{flex:1}.full-width-action{width:100%}
.obs-builder-marker{font-size:12px;font-weight:900;color:var(--green-dark);letter-spacing:.02em;margin:0 0 8px}.obs-set-info-strip{margin-bottom:14px}.obs-set-info-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 26px!important}.obs-set-info-main h2{font-size:26px;margin:0 0 8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.obs-set-meta-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:13px;font-weight:750}.tiny-action{padding:7px 11px;border-radius:10px;font-size:12px}.preview-top-btn{min-width:250px;box-shadow:0 14px 30px rgba(26,160,91,.18)}.obs-unsaved-strip{margin-top:-4px;margin-bottom:12px}.obs-item-workspace{display:grid;grid-template-columns:310px minmax(0,1fr);gap:18px;align-items:start}.obs-item-nav-panel{position:sticky;top:88px;max-height:calc(100vh - 120px);overflow:hidden}.obs-item-nav-panel .card-body{padding:22px}.obs-item-nav-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.obs-item-nav-head h2{font-size:22px;margin:0}.compact-btn{padding:9px 12px;border-radius:12px;font-size:12px}.compact-field{margin-bottom:10px}.compact-field input{padding:10px 12px;border-radius:12px;font-size:13px}.compact-toggle{font-size:12px;color:var(--muted);margin:8px 0 12px}.obs-item-list-v4{display:grid;gap:10px;max-height:calc(100vh - 285px);overflow:auto;padding-right:4px}.obs-item-card-v4{display:block;width:100%;text-align:left;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:16px;padding:14px 14px;box-shadow:0 7px 18px rgba(16,24,20,.04);transition:.15s ease}.obs-item-card-v4:hover{border-color:var(--green);background:#fbfffd;transform:translateY(-1px)}.obs-item-card-v4.active{border-color:var(--green);background:linear-gradient(180deg,#f1fbf5,#fff);box-shadow:inset 0 0 0 1px rgba(26,160,91,.15),0 10px 20px rgba(16,24,20,.06)}.obs-item-card-v4 strong{display:block;font-size:13px;line-height:1.35;color:var(--ink);margin-bottom:5px}.obs-item-card-v4 small{display:block;color:var(--muted);font-weight:800;margin-bottom:8px}.obs-item-editor-main{min-width:0}.obs-question-builder-card>.card-body{padding:22px 26px}.obs-editor-topline{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:14px}.obs-item-number span{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:999px;background:var(--green);color:#fff;font-weight:950}.obs-editor-topline h2{font-size:21px;margin:0 0 2px}.obs-editor-nav-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.obs-editor-nav-actions button{padding:9px 12px;font-size:12px;border-radius:11px}.obs-item-title-row{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:16px;align-items:start;margin-bottom:12px}.label-hint{font-size:12px;color:var(--muted);font-weight:750}.item-structure-field select{height:46px}.obs-question-blocks-v4{display:grid;gap:12px}.obs-linked-question-block{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;border:1px solid var(--line);border-radius:18px;padding:14px;background:#fff}.obs-linked-question-block.followup{background:#fbfdfb}.obs-q-label{display:inline-flex;align-items:center;justify-content:center;height:34px;border-radius:12px;background:var(--soft);color:var(--green-dark);font-weight:950;position:sticky;top:96px}.obs-q-main-row{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:16px}.obs-question-text-field .rich-editor{min-height:84px}.obs-response-type-field select{height:44px}.obs-dependency-row{display:grid;grid-template-columns:minmax(220px,.5fr) minmax(0,1fr);gap:12px;align-items:start;margin-bottom:10px}.dependency-field{margin-bottom:0}.error-text{color:var(--danger)!important}.obs-options-title{font-size:13px;font-weight:950;color:var(--ink);margin:8px 0}.obs-option-grid-v4{display:grid;grid-template-columns:1fr;gap:9px}.obs-option-grid-v4.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.obs-option-row-v4{display:grid;grid-template-columns:42px minmax(0,1fr) 150px 34px;gap:8px;align-items:start}.obs-option-row-v4 .optionKeyV4{height:36px;text-align:center;border-radius:10px;font-weight:900;padding:7px}.obs-option-text-wrap .toolbar{padding:4px;border-radius:10px 10px 0 0}.obs-option-text-wrap .toolbar button,.obs-option-text-wrap .toolbar .toolbar-file{padding:4px 7px;font-size:11px}.obs-option-text-wrap .rich-editor{min-height:36px;border-radius:0 0 10px 10px;padding:8px 10px;font-size:13px}.option-level-select{height:36px;border-radius:10px;font-size:12px;padding:6px 8px}.icon-only{width:32px;height:32px;padding:0;border-radius:9px}.add-option-btn{margin-top:10px;padding:8px 12px;font-size:12px}.obs-mapping-panel-v4{margin-top:16px;border:1px solid #c9ead6;background:linear-gradient(180deg,#fbfffd,#f7fbf8);border-radius:18px;padding:16px}.obs-mapping-panel-v4 h3{margin:0 0 4px}.obs-mapping-grid-v4{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px;align-items:start}.logic-textarea{min-height:155px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.5}.obs-path-table-wrap label{display:block;margin-bottom:7px}.compact-coverage{min-width:620px}.compact-coverage th,.compact-coverage td{padding:9px 10px;font-size:12px}.mapping-status-line{font-weight:900;font-size:13px;margin-top:10px}.mapping-status-line.good{color:var(--success)}.mapping-status-line.warn{color:var(--warning)}.obs-editor-footer-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:14px;margin-top:14px}.set-details-modal{max-width:980px}.set-details-modal .card{box-shadow:none}.set-details-modal .card-body{padding:18px 0}.set-details-modal .assessment-top{box-shadow:none}@media(max-width:1180px){.admin-four-module-row{grid-template-columns:repeat(2,minmax(0,1fr))}.obs-item-workspace{grid-template-columns:280px minmax(0,1fr)}.obs-q-main-row{grid-template-columns:1fr}.obs-option-grid-v4.two-col{grid-template-columns:1fr}.obs-mapping-grid-v4{grid-template-columns:1fr}.preview-top-btn{min-width:180px}}@media(max-width:860px){.admin-four-module-row,.obs-item-workspace,.obs-item-title-row,.obs-editor-topline,.obs-set-info-inner,.obs-linked-question-block,.obs-dependency-row{grid-template-columns:1fr;display:grid}.obs-item-nav-panel{position:relative;top:auto;max-height:none}.obs-item-list-v4{max-height:360px}.obs-q-label{position:relative;top:auto}.obs-option-row-v4{grid-template-columns:40px minmax(0,1fr) 34px}.obs-option-row-v4 .option-level-select{grid-column:2/3}.obs-set-info-actions{width:100%}.preview-top-btn{width:100%}.obs-editor-footer-actions{flex-direction:column;align-items:stretch}.obs-editor-footer-actions .btn-row{width:100%}.obs-editor-footer-actions button{width:100%}}


/* ===== TEPS v5 polish: admin dashboard and observation item builder ===== */
.admin-dashboard-grid{display:none!important}
.admin-dashboard-home{margin-top:18px}
.admin-four-module-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch;margin-top:0!important}
.admin-four-module-row .admin-module-card{min-height:unset!important;padding:26px!important;display:flex!important;flex-direction:column;border-radius:28px}
.admin-four-module-row .admin-module-head{display:block!important}
.admin-four-module-row .admin-module-head h2{font-size:30px;line-height:1.05;margin-bottom:12px}
.admin-four-module-row .admin-module-head .status-pill{float:right;margin-left:10px}
.admin-four-module-row .admin-module-stats{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 22px!important;flex:1!important;align-content:flex-start}
.admin-four-module-row .admin-module-stats .status-pill{background:#fff;border-color:#d9e8df;color:#213a2d;padding:7px 11px;font-size:12px}
.admin-four-module-row .full-width-action{margin-top:auto;height:48px;border-radius:16px;font-size:15px}
.admin-dashboard-home>.card{margin-top:18px}
@media(max-width:1280px){.admin-four-module-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.admin-four-module-row{grid-template-columns:1fr}.admin-four-module-row .admin-module-head h2{font-size:26px}}

/* Observation library: cleaner and faster */
.obs-builder-marker{display:none!important}
.obs-library-hero-v5{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 26px!important;margin-bottom:18px!important}
.obs-library-mini-stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.obs-library-mini-stats span{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:900;color:var(--green-dark)}
.obs-library-tools-v5{display:grid;grid-template-columns:minmax(420px,2fr) minmax(220px,.7fr);gap:16px;align-items:end;margin:18px 0 20px}
.obs-library-tools-v5 input,.obs-library-tools-v5 select{height:52px;border-radius:16px;font-size:16px}
.obs-library-search-field label,.obs-library-filter-field label{font-size:14px}
@media(max-width:760px){.obs-library-hero-v5,.obs-library-tools-v5{display:grid;grid-template-columns:1fr}.obs-library-mini-stats{justify-content:flex-start}}

/* Observation builder: compact reference-style workspace */
.obs-set-info-strip{margin-bottom:14px!important}
.obs-set-info-inner{padding:18px 24px!important}
.obs-set-info-main h2{font-size:24px!important;margin-bottom:6px!important}
.obs-item-workspace{grid-template-columns:300px minmax(0,1fr)!important;gap:16px!important}
.obs-item-nav-panel{top:82px!important;max-height:calc(100vh - 105px)!important}
.obs-item-nav-panel .card-body{padding:20px!important}
.obs-item-nav-head h2{font-size:24px!important}
.obs-item-card-v4{padding:13px!important;border-radius:15px!important}
.obs-item-card-v4 strong{font-size:13px!important;line-height:1.3!important}
.obs-question-builder-card>.card-body{padding:20px 24px!important}
.obs-editor-topline{padding-bottom:12px!important;margin-bottom:12px!important}
.obs-editor-topline h2{font-size:18px!important}
.obs-editor-nav-actions button:disabled{opacity:.42;cursor:not-allowed;transform:none!important;background:#f8faf8;color:#8b9991}
.obs-item-title-row{grid-template-columns:minmax(0,1fr) 220px!important;gap:14px!important}
.obs-linked-question-block{padding:13px!important;border-radius:16px!important;grid-template-columns:44px minmax(0,1fr)!important}
.obs-q-label{height:32px;border-radius:10px;top:88px}
.obs-q-main-row{grid-template-columns:minmax(0,1fr) 210px!important;gap:14px!important}
.obs-question-text-field .rich-editor{min-height:72px!important;font-size:14px}
.rich-toolbar{gap:6px!important;padding:7px!important}
.rich-toolbar button,.rich-toolbar .toolbar-file{padding:6px 9px!important;font-size:12px!important;border-radius:9px!important}
.obs-option-grid-v4,.obs-option-list-v5{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
.obs-option-grid-v4.two-col{grid-template-columns:1fr!important}
.obs-option-row-v4{display:grid!important;grid-template-columns:48px minmax(0,1fr) 170px 34px!important;gap:10px!important;align-items:start;border:1px solid #e2eee7;border-radius:14px;padding:10px;background:#fff}
.obs-option-row-v4.no-level{grid-template-columns:48px minmax(0,1fr) 34px!important}
.obs-option-row-v4 .optionKeyV4{height:40px!important;border-radius:12px!important;font-size:16px!important}
.obs-option-text-wrap .rich-editor{min-height:58px!important;font-size:14px!important;line-height:1.45!important;padding:10px 12px!important;background:#fff!important}
.obs-option-text-wrap .toolbar{padding:5px!important;gap:5px!important;background:#fbfdfb!important}
.obs-option-text-wrap .toolbar button,.obs-option-text-wrap .toolbar .toolbar-file{padding:5px 8px!important;font-size:11px!important}
.option-level-select{height:40px!important;border-radius:12px!important;font-size:13px!important}
.icon-only{width:34px!important;height:34px!important;font-size:14px!important}
.obs-mapping-panel-v4{padding:14px!important;margin-top:14px!important;border-radius:16px!important}
.obs-mapping-grid-v4{grid-template-columns:310px minmax(0,1fr)!important;gap:14px!important}
.logic-textarea{min-height:145px!important;font-size:12.5px!important}
.compact-coverage th,.compact-coverage td{padding:8px 9px!important;font-size:12px!important}
@media(max-width:1180px){.obs-item-workspace{grid-template-columns:280px minmax(0,1fr)!important}.obs-q-main-row,.obs-mapping-grid-v4{grid-template-columns:1fr!important}.obs-option-row-v4,.obs-option-row-v4.no-level{grid-template-columns:44px minmax(0,1fr) 34px!important}.obs-option-row-v4 .option-level-select{grid-column:2/3}.obs-item-title-row{grid-template-columns:1fr!important}}
@media(max-width:860px){.obs-item-workspace{grid-template-columns:1fr!important}.obs-set-info-inner{display:grid!important;grid-template-columns:1fr!important}.obs-linked-question-block{grid-template-columns:1fr!important}.obs-q-label{position:relative;top:auto;width:42px}.preview-top-btn{width:100%;min-width:0!important}}

/* ===== Final admin + observation polish v6 ===== */
.admin-dashboard-home .assessment-top{margin-bottom:18px!important}
.admin-dashboard-grid{display:none!important}
.admin-four-module-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important;align-items:stretch!important;margin-top:18px!important}
.admin-four-module-row .admin-module-card{min-height:320px!important;padding:26px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;border-radius:28px!important}
.admin-four-module-row .admin-module-head h2{font-size:29px!important;line-height:1.05!important;white-space:nowrap!important;letter-spacing:-.045em!important;margin-bottom:12px!important}
.admin-four-module-row .admin-module-head p{min-height:58px!important;max-width:270px!important}
.admin-four-module-row .admin-module-stats{display:flex!important;gap:8px!important;flex-wrap:wrap!important;margin:14px 0 18px!important;align-content:flex-start!important}
.admin-four-module-row .admin-module-stats .status-pill{padding:7px 11px!important;border-radius:999px!important;font-size:12px!important;min-width:unset!important;height:auto!important}
.admin-four-module-row .full-width-action{width:100%!important;margin-top:auto!important}

.obs-item-workspace{grid-template-columns:300px minmax(0,1fr)!important;gap:18px!important;align-items:start!important}
.obs-item-nav-panel{position:sticky!important;top:96px!important;max-height:calc(100vh - 124px)!important;overflow:hidden!important}
.obs-item-nav-panel .card-body{padding:22px!important}.obs-item-nav-head h2{font-size:24px!important;white-space:nowrap!important}.obs-item-nav-head{align-items:center!important}
.compact-field input{height:48px!important;font-size:15px!important;border-radius:14px!important;padding:12px 14px!important}
.obs-question-builder-card>.card-body{padding:22px 26px!important}.obs-builder-marker{display:none!important}
.obs-set-info-strip{margin-bottom:14px!important}.obs-set-info-inner{padding:20px 26px!important}.obs-set-info-main h2{font-size:25px!important}.auto-save-status{font-size:12px;font-weight:850;color:var(--green-dark);background:#eef8f2;border:1px solid #c9ead6;border-radius:999px;padding:4px 9px}
.obs-editor-topline{grid-template-columns:auto 1fr auto!important}.obs-editor-nav-actions button:disabled,.observer-bottom-nav button:disabled{opacity:.45!important;cursor:not-allowed!important;transform:none!important}.obs-item-title-row{grid-template-columns:minmax(0,1fr) 280px!important}.item-structure-field select,.obs-response-type-field select{min-width:0!important;width:100%!important;height:52px!important;font-size:16px!important;line-height:1.2!important;padding:12px 42px 12px 14px!important;text-overflow:ellipsis!important}.obs-q-main-row{grid-template-columns:minmax(0,1fr) 260px!important;gap:18px!important}.obs-response-type-field{min-width:0!important}.obs-response-type-field label{white-space:nowrap!important}.compact-toggle{display:flex!important;align-items:center!important;gap:10px!important;font-size:14px!important;line-height:1.25!important}.compact-toggle input{width:18px!important;height:18px!important;flex:0 0 auto!important}.obs-dependency-row{grid-template-columns:360px minmax(0,1fr)!important;align-items:start!important;gap:20px!important}.dependency-field input{height:44px!important;font-size:15px!important}.obs-option-grid-v4,.obs-option-list-v5{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}.obs-option-row-v4,.obs-option-row-v4.no-level{display:grid!important;grid-template-columns:54px minmax(0,1fr) 190px 38px!important;gap:12px!important;align-items:start!important;border:1px solid #dfece5!important;border-radius:16px!important;padding:12px!important;background:#fff!important}.obs-option-row-v4 .optionKeyV4{height:44px!important;font-size:17px!important;border-radius:14px!important;text-align:center!important;font-weight:950!important}.obs-option-text-wrap .rich-editor{min-height:64px!important;font-size:15px!important;line-height:1.45!important;padding:10px 12px!important}.option-level-select{height:44px!important;border-radius:14px!important;font-size:14px!important}.icon-only{width:36px!important;height:36px!important}.rich-toolbar.classic-rich-toolbar{gap:8px!important;padding:8px!important;align-items:center!important;background:#fbfdfb!important}.rich-toolbar.classic-rich-toolbar button,.rich-toolbar.classic-rich-toolbar .toolbar-file,.rich-toolbar.classic-rich-toolbar .toolbar-select{height:38px!important;min-width:38px!important;padding:7px 10px!important;border-radius:11px!important;font-size:13px!important;font-weight:850!important;background:#fff!important;color:var(--text)!important;border:1px solid var(--line)!important}.toolbar-select{max-width:150px!important;width:auto!important}.rich-toolbar.classic-rich-toolbar button:hover{border-color:var(--green)!important;background:var(--soft)!important}.teps-rich-image{cursor:pointer!important}.teps-rich-image:hover{outline:3px solid rgba(26,160,91,.22)!important}.obs-mapping-grid-v4{grid-template-columns:minmax(280px,360px) minmax(0,1fr)!important;gap:18px!important}.logic-textarea{min-height:190px!important;font-size:14px!important}.compact-coverage th,.compact-coverage td{font-size:14px!important;padding:12px!important}.compact-coverage select{height:44px!important;font-size:15px!important}.obs-editor-footer-actions{padding-top:18px!important}.observer-clean-flow{padding-bottom:86px}.observation-start-card{max-width:960px;margin:0 auto}.observer-main-nav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.observer-one-card{max-width:1050px;margin:0 auto}.observer-question-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}.observer-options .option{font-size:17px}.observer-bottom-nav{position:fixed;left:0;right:0;bottom:0;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-top:1px solid var(--line);z-index:80;padding:14px max(16px,calc((100vw - 1320px)/2));display:flex;justify-content:flex-end;gap:12px}.observer-bottom-nav button{min-width:120px}
@media(max-width:1280px){.admin-four-module-row .admin-module-head h2{font-size:25px!important}.obs-q-main-row{grid-template-columns:1fr!important}.obs-dependency-row{grid-template-columns:1fr!important}.obs-mapping-grid-v4{grid-template-columns:1fr!important}.obs-option-row-v4,.obs-option-row-v4.no-level{grid-template-columns:50px minmax(0,1fr) 38px!important}.obs-option-row-v4 .option-level-select{grid-column:2/3}}
@media(max-width:1000px){.admin-four-module-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}.obs-item-workspace{grid-template-columns:1fr!important}.obs-item-nav-panel{position:relative!important;top:auto!important;max-height:none!important}.obs-item-list-v4{max-height:420px!important}.obs-item-title-row,.obs-editor-topline,.obs-set-info-inner{grid-template-columns:1fr!important;display:grid!important}.obs-editor-nav-actions{justify-content:flex-start!important}.preview-top-btn{width:100%!important;min-width:0!important}}
@media(max-width:700px){.admin-four-module-row{grid-template-columns:1fr!important}.admin-four-module-row .admin-module-head h2{white-space:normal!important}.observer-bottom-nav{justify-content:space-between!important}.observer-bottom-nav button{min-width:0;flex:1}.obs-option-row-v4,.obs-option-row-v4.no-level{grid-template-columns:46px minmax(0,1fr)!important}.icon-only{grid-column:2/3}.obs-option-row-v4 .option-level-select{grid-column:2/3}.rich-toolbar.classic-rich-toolbar .toolbar-select{width:100%!important;max-width:none!important}}

/* ===== V7 UI/UX polish: admin dashboard, observation builder, observer flow ===== */
.admin-four-module-row .admin-module-card{min-height:275px!important;padding:24px!important;overflow:hidden!important}
.admin-four-module-row .admin-module-head h2{font-size:clamp(22px,1.55vw,25px)!important;line-height:1.08!important;white-space:nowrap!important;letter-spacing:-.04em!important;max-width:100%!important;overflow:visible!important}
.admin-four-module-row .admin-module-head p{font-size:14px!important;line-height:1.45!important;min-height:50px!important;max-width:100%!important}
.admin-four-module-row .admin-module-stats{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;align-items:start!important;align-content:start!important;flex:1!important;margin:14px 0 20px!important}
.admin-four-module-row .admin-module-stats .status-pill{justify-content:center!important;text-align:center!important;white-space:nowrap!important;min-height:34px!important;padding:7px 10px!important}
.admin-four-module-row #idModuleStats{grid-template-columns:1fr 1fr!important}
.admin-four-module-row #idModuleStats .stat-row{display:contents!important}
.admin-four-module-row .full-width-action{height:48px!important;border-radius:16px!important;font-size:15px!important;margin-top:auto!important}
@media(max-width:1280px){.admin-four-module-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}.admin-four-module-row .admin-module-head h2{font-size:25px!important}}
@media(max-width:760px){.admin-four-module-row{grid-template-columns:1fr!important}.admin-four-module-row .admin-module-head h2{white-space:normal!important}}

.obs-library-tools-v5{display:grid!important;grid-template-columns:minmax(520px,1.35fr) minmax(220px,.65fr)!important;gap:18px!important;align-items:end!important;margin:22px 0!important}
.obs-library-search-field input{width:100%!important;min-height:54px!important;font-size:16px!important;padding:14px 18px!important;border-radius:18px!important}
.obs-library-search-field input::placeholder{font-size:14px!important;color:#6d7b72!important;opacity:1!important}
.obs-library-filter-field select{min-height:54px!important;border-radius:18px!important;font-size:15px!important}

.obs-item-workspace{grid-template-columns:300px minmax(0,1fr)!important;gap:18px!important;align-items:start!important}
.obs-question-builder-card>.card-body{padding:22px 28px!important}
.obs-editor-topline{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;gap:14px!important;align-items:center!important}
.obs-editor-topline h2{font-size:20px!important;line-height:1.1!important}
.obs-item-title-row{grid-template-columns:minmax(0,1fr) 300px!important;gap:18px!important;align-items:start!important}
.item-structure-field select{height:52px!important;width:100%!important;font-size:15px!important;padding-right:42px!important;line-height:1.2!important;text-overflow:ellipsis!important}
.obs-linked-question-block{grid-template-columns:48px minmax(0,1fr)!important;padding:16px!important;border-radius:18px!important}
.obs-q-main-row{grid-template-columns:minmax(0,1fr) 300px!important;gap:18px!important;align-items:start!important}
.obs-response-type-field select{height:52px!important;width:100%!important;min-width:250px!important;font-size:15px!important;padding:12px 42px 12px 14px!important;text-overflow:ellipsis!important;line-height:1.2!important}
.obs-response-type-field .compact-toggle{margin-top:12px!important;font-size:14px!important}
.obs-dependency-row{display:grid!important;grid-template-columns:minmax(230px,330px) minmax(420px,1fr)!important;gap:18px!important;align-items:start!important;margin-bottom:16px!important;padding:10px 12px!important;border:1px solid #e4efe8!important;border-radius:14px!important;background:#fbfffd!important}
.dependency-toggle{margin:0!important;font-size:15px!important;line-height:1.35!important;color:var(--ink)!important;font-weight:850!important;display:flex!important;align-items:center!important;gap:10px!important}
.dependency-toggle input{width:18px!important;height:18px!important;flex:0 0 auto!important}
.dependency-field{margin:0!important}.dependency-field label{font-size:13px!important;margin-bottom:6px!important}.dependency-field input{height:48px!important;font-size:15px!important;width:100%!important;min-width:0!important;border-radius:14px!important}.dependency-field .note{margin-top:6px!important;font-size:12px!important}

.rich-toolbar.classic-rich-toolbar{gap:6px!important;padding:7px!important;background:#fbfdfb!important;align-items:center!important}
.rich-toolbar.classic-rich-toolbar button,.rich-toolbar.classic-rich-toolbar .toolbar-select{height:34px!important;min-height:34px!important;padding:5px 9px!important;border-radius:10px!important;font-size:12px!important;font-weight:850!important;background:#fff!important;color:var(--text)!important;border:1px solid var(--line)!important;box-shadow:none!important}
.rich-toolbar.classic-rich-toolbar .colour-toolbar-select{min-width:125px!important;width:auto!important}.rich-toolbar.classic-rich-toolbar .image-size-select{min-width:112px!important;width:auto!important}
.rich-toolbar.classic-rich-toolbar button:hover,.rich-toolbar.classic-rich-toolbar .toolbar-select:hover{border-color:var(--green)!important;background:var(--soft)!important}
.obs-rich{min-height:82px!important;font-size:15px!important;line-height:1.5!important}
.obs-question-text-field .obs-rich{min-height:96px!important}.obs-option-text-wrap .rich-toolbar.classic-rich-toolbar{padding:5px!important;gap:5px!important}.obs-option-text-wrap .rich-toolbar.classic-rich-toolbar button,.obs-option-text-wrap .rich-toolbar.classic-rich-toolbar .toolbar-select{height:30px!important;min-height:30px!important;font-size:11px!important;padding:4px 7px!important}.obs-option-text-wrap .obs-rich{min-height:54px!important;font-size:14px!important;line-height:1.45!important}

.obs-option-grid-v4,.obs-option-list-v5{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}.obs-option-row-v4,.obs-option-row-v4.no-level{display:grid!important;grid-template-columns:54px minmax(0,1fr) 210px 38px!important;gap:12px!important;align-items:start!important;border:1px solid #dfece5!important;border-radius:16px!important;padding:12px!important;background:#fff!important}.obs-option-row-v4.no-level{grid-template-columns:54px minmax(0,1fr) 38px!important}.option-level-select{height:46px!important;border-radius:14px!important;font-size:15px!important;min-width:190px!important;width:100%!important;padding:11px 40px 11px 14px!important}.obs-option-row-v4 .optionKeyV4{height:46px!important;font-size:17px!important;font-weight:950!important;text-align:center!important;border-radius:14px!important}.icon-only{width:38px!important;height:38px!important}

.obs-mapping-panel-v4{padding:18px 20px!important;border-radius:20px!important}.obs-mapping-grid-v4{grid-template-columns:minmax(320px,380px) minmax(0,1fr)!important;gap:20px!important}.logic-textarea{min-height:220px!important;font-size:14px!important;line-height:1.55!important}.compact-coverage{min-width:760px!important;table-layout:fixed!important}.compact-coverage th:nth-child(1),.compact-coverage td:nth-child(1){width:52px!important}.compact-coverage th:nth-child(3),.compact-coverage td:nth-child(3){width:260px!important}.compact-coverage select{width:100%!important;min-width:210px!important;height:48px!important;font-size:15px!important;border-radius:14px!important;padding:10px 40px 10px 14px!important}.compact-coverage td{font-size:14px!important;line-height:1.35!important;vertical-align:middle!important}

.observer-clean-flow{max-width:1080px!important;margin:0 auto!important;padding-bottom:94px!important}.observation-start-card{max-width:900px!important;margin:28px auto!important}.observer-main-nav{justify-content:center!important;margin:0 0 18px!important}.observer-one-card{max-width:960px!important;margin:0 auto!important;padding:34px!important}.observer-one-card .question-title{font-size:16px!important;text-transform:none!important;letter-spacing:0!important;color:var(--green-dark)!important}.observer-question-layout{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:22px!important}.observer-question-main .prompt{font-size:20px!important;line-height:1.55!important}.observer-question-main .prompt img{max-width:50%!important;margin:18px auto!important}.observer-options .option{font-size:17px!important;border-radius:18px!important;padding:17px 18px!important}.observer-bottom-nav{position:fixed!important;left:0!important;right:0!important;bottom:0!important;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(16px)!important;border-top:1px solid var(--line)!important;z-index:100!important;padding:14px max(20px,calc((100vw - 1320px)/2))!important;display:flex!important;justify-content:flex-end!important;gap:12px!important}.observer-bottom-nav button{min-width:124px!important}
@media(max-width:1260px){.obs-q-main-row,.obs-dependency-row,.obs-mapping-grid-v4{grid-template-columns:1fr!important}.obs-response-type-field select{min-width:0!important}.obs-option-row-v4,.obs-option-row-v4.no-level{grid-template-columns:52px minmax(0,1fr) 38px!important}.obs-option-row-v4 .option-level-select{grid-column:2/3}.obs-item-title-row{grid-template-columns:1fr!important}}
@media(max-width:900px){.obs-library-tools-v5,.obs-item-workspace,.obs-set-info-inner,.obs-editor-topline{grid-template-columns:1fr!important;display:grid!important}.obs-item-nav-panel{position:relative!important;top:auto!important;max-height:none!important}.obs-item-list-v4{max-height:420px!important}.preview-top-btn{width:100%!important}.observer-question-main .prompt img{max-width:100%!important}.observer-bottom-nav{justify-content:space-between!important}.observer-bottom-nav button{min-width:0!important;flex:1!important}}
@media(max-width:700px){.obs-option-row-v4,.obs-option-row-v4.no-level{grid-template-columns:46px minmax(0,1fr)!important}.obs-option-row-v4 .option-level-select,.icon-only{grid-column:2/3!important}.rich-toolbar.classic-rich-toolbar .toolbar-select{max-width:none!important;width:100%!important}.observer-one-card{padding:22px!important}}


/* ===== V8 observation/admin fit + observer completion updates ===== */
.admin-four-module-row .admin-module-head h2{font-size:clamp(20px,1.35vw,23px)!important;line-height:1.08!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;letter-spacing:-.035em!important;min-height:56px!important;display:flex!important;align-items:flex-start!important}
.admin-four-module-row .admin-module-card{min-width:0!important;overflow:hidden!important}
.admin-four-module-row .admin-module-stats{grid-template-columns:1fr 1fr!important}
.admin-four-module-row .admin-module-stats .status-pill{font-size:11.5px!important;padding:7px 9px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
#idModuleStats{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
.obs-library-search-field{grid-column:1 / span 2!important;min-width:420px!important}
.obs-library-search-field input{width:100%!important;min-height:52px!important;font-size:15px!important;padding:14px 16px!important}
.obs-item-title-row{grid-template-columns:minmax(0,1.5fr) minmax(260px,360px)!important;gap:28px!important;align-items:start!important}
.obs-item-title-row #itemTitle{width:100%!important;min-width:0!important;height:54px!important;font-size:16px!important;padding:14px 16px!important}
.obs-editor-topline .note{font-size:14px!important}.obs-editor-topline h2{font-size:28px!important}.obs-editor-topline{gap:18px!important}
.obs-dependency-row{display:grid!important;grid-template-columns:minmax(240px,340px) minmax(360px,1fr)!important;gap:18px!important;align-items:start!important;padding:8px 0 16px!important}
.dependency-toggle{margin:0!important;display:flex!important;align-items:flex-start!important;gap:12px!important;line-height:1.25!important}.dependency-toggle span{font-size:16px!important;font-weight:850!important}.dependency-toggle input{width:18px!important;height:18px!important;flex:0 0 18px!important;margin-top:3px!important}.dependency-field input{width:100%!important;min-width:320px!important;height:48px!important;font-size:15px!important;padding:12px 14px!important}.dependency-field .note{margin-top:6px!important}
.obs-response-type-field select,.item-structure-field select{height:54px!important;font-size:16px!important;line-height:1.25!important;padding-right:44px!important;white-space:normal!important;text-overflow:clip!important}.obs-response-type-field{min-width:260px!important}.item-structure-field{min-width:260px!important}.obs-q-main-row{grid-template-columns:minmax(0,1fr) minmax(260px,340px)!important}
.obs-mapping-panel-v4{overflow:hidden!important}.obs-mapping-grid-v4{grid-template-columns:minmax(280px,420px) minmax(0,1fr)!important;align-items:start!important}.obs-path-table-wrap{min-width:0!important;overflow:hidden!important}.mapping-table-scroll{max-width:100%!important;overflow-x:auto!important;border-radius:18px!important}.mapping-fit-table{width:100%!important;min-width:620px!important;table-layout:fixed!important}.mapping-fit-table .path-num-col{width:54px!important}.mapping-fit-table .path-level-col{width:230px!important}.mapping-fit-table th,.mapping-fit-table td{padding:12px 14px!important;vertical-align:middle!important}.mapping-fit-table th:nth-child(2),.mapping-fit-table td:nth-child(2){white-space:normal!important;word-break:break-word!important}.mapping-fit-table select{width:100%!important;min-width:170px!important;height:48px!important;font-size:15px!important;padding:10px 42px 10px 14px!important}.sticky-map-col{position:sticky!important;right:0!important;background:#fff!important;z-index:2!important;box-shadow:-8px 0 14px rgba(255,255,255,.9)!important}.mapping-fit-table thead .sticky-map-col{background:#f7fbf8!important;z-index:3!important}.compact-coverage td:nth-child(3){overflow:visible!important}
.observer-progress-line{max-width:960px;margin:0 auto 16px;display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--line);background:#fff;border-radius:16px;padding:12px 16px;color:var(--green-dark);font-weight:850}.observer-progress-line span{color:var(--muted);font-weight:800}.observation-start-card .form-row.three{grid-template-columns:repeat(3,minmax(0,1fr))}.observation-start-card input[type=date]{width:100%;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:15px;padding:13px 14px;font-size:15px;font-family:inherit;outline:none}.observer-bottom-nav .primary:disabled{opacity:.45!important;cursor:not-allowed!important}.preview-flow{padding-bottom:90px}.preview-start-card{box-shadow:none;border:0}.observer-question-main .prompt{overflow-wrap:anywhere}.observer-question-main .prompt img,.observer-options img{max-width:100%!important;height:auto!important}.observer-options .option{min-height:58px}.question-dot{flex:0 0 auto}
@media(max-width:1280px){.obs-mapping-grid-v4{grid-template-columns:1fr!important}.mapping-fit-table{min-width:600px!important}.obs-dependency-row{grid-template-columns:1fr!important}.dependency-field input{min-width:0!important}.obs-item-title-row{grid-template-columns:1fr!important}.obs-q-main-row{grid-template-columns:1fr!important}.obs-response-type-field,.item-structure-field{min-width:0!important}.admin-four-module-row .admin-module-head h2{font-size:24px!important;min-height:auto!important}}
@media(max-width:760px){.obs-library-search-field{grid-column:auto!important;min-width:0!important}.observer-progress-line{flex-direction:column;align-items:flex-start}.observation-start-card .form-row.three{grid-template-columns:1fr}.mapping-fit-table{min-width:560px!important}.sticky-map-col{position:static!important;box-shadow:none!important}.admin-four-module-row .admin-module-head h2{font-size:24px!important;white-space:normal!important}.observer-bottom-nav{gap:8px!important}.observer-bottom-nav button{padding:12px 10px!important}}


/* ===== V10 library + sync polish ===== */
.obs-library-tools-v5{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:18px!important;align-items:end!important;margin:18px 0 20px!important}
.obs-library-search-field,.obs-library-filter-field{min-width:0!important;width:100%!important}
.obs-library-tools-v5 input,.obs-library-tools-v5 select{width:100%!important;min-width:0!important;height:54px!important;font-size:15px!important;line-height:1.2!important;padding:13px 16px!important;text-overflow:ellipsis!important}
.obs-library-tools-v5 input::placeholder{font-size:14px!important;white-space:normal!important}
.obs-library-hero-v5 .obs-library-mini-stats{align-items:center!important}
@media(max-width:760px){.obs-library-tools-v5{grid-template-columns:1fr!important}.obs-library-tools-v5 input,.obs-library-tools-v5 select{height:50px!important}}

/* ===== V11 final library filter row fix =====
   Force Observation Set Library search and filter to sit in one desktop row.
   This overrides older V8 rule where search field spanned two columns. */
.obs-library-tools-v5{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:18px!important;
  align-items:end!important;
  margin:18px 0 20px!important;
  width:100%!important;
}
.obs-library-tools-v5 .field,
.obs-library-search-field,
.obs-library-filter-field{
  grid-column:auto!important;
  min-width:0!important;
  width:100%!important;
  margin-bottom:0!important;
}
.obs-library-tools-v5 label{margin-bottom:8px!important;}
.obs-library-tools-v5 input,
.obs-library-tools-v5 select{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:54px!important;
  font-size:15px!important;
  line-height:1.2!important;
  padding:13px 16px!important;
  text-overflow:ellipsis!important;
}
.obs-library-tools-v5 input::placeholder{font-size:14px!important;opacity:.82!important;}
@media(max-width:760px){
  .obs-library-tools-v5{grid-template-columns:1fr!important;}
}


/* ===== V12 observer form and question flow polish ===== */
body[data-tool="observation"]{font-size:15px;line-height:1.55;}
body[data-tool="observation"] .container{width:min(1320px,calc(100% - 32px));}
body[data-tool="observation"] .question-card{font-size:15px;}
body[data-tool="observation"] h2{font-size:28px;}
body[data-tool="observation"] h3{font-size:17px;}
body[data-tool="observation"] .prompt{font-size:18px;line-height:1.55;}
body[data-tool="observation"] .option{font-size:16px;line-height:1.45;}
.observation-start-card h3{margin-top:22px;}
.observation-start-card .form-row.three{grid-template-columns:repeat(3,minmax(0,1fr));}
.observation-start-card input[type="date"]{width:100%;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:15px;padding:13px 14px;font-size:15px;font-family:inherit;outline:none;}
.observer-main-nav{max-height:104px;overflow:auto;align-content:flex-start;padding:6px 4px 10px;scrollbar-width:thin;border:1px solid var(--line);border-radius:16px;background:#fbfdfb;}
.observer-main-nav .question-dot{min-width:38px;min-height:38px;}
.observer-main-nav .question-dot:disabled{opacity:.45;cursor:not-allowed;}
.observer-clean-flow{font-family:Inter,Poppins,Arial,sans-serif;}
.observer-progress-line{font-size:14px;}
.observer-one-card{padding:28px!important;}
.observer-question-main .prompt{font-size:18px!important;line-height:1.55!important;}
.observer-options .option{font-size:16px!important;padding:15px 16px!important;}
.observer-bottom-nav button:disabled{opacity:.48!important;cursor:not-allowed!important;}
.submitted-observation-card{max-width:900px;margin:28px auto;}
@media(max-width:760px){
  body[data-tool="observation"] .container{width:min(100% - 20px,1320px);margin-top:16px;}
  body[data-tool="observation"] .header-inner{width:min(100% - 20px,1320px);}
  .observation-start-card .form-row.three{grid-template-columns:1fr!important;}
  .observer-main-nav{max-height:86px;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;}
  .observer-one-card{padding:20px!important;}
  .observer-question-main .prompt{font-size:17px!important;}
  .observer-options .option{font-size:16px!important;min-height:62px;padding:16px!important;}
  .observer-progress-line{position:sticky;top:88px;z-index:30;background:#fff;}
}

/* ===== V13 observer assessment parity ===== */
body[data-view="observer"][data-tool="observation"]{
  font-size:15px!important;
  line-height:1.5!important;
}
body[data-view="observer"][data-tool="observation"] .observer-clean-flow{
  font-family:Inter,Poppins,Arial,sans-serif!important;
}
body[data-view="observer"][data-tool="observation"] .observer-one-card{
  padding:24px!important;
}
body[data-view="observer"][data-tool="observation"] .observer-question-main .prompt{
  font-size:16.5px!important;
  line-height:1.5!important;
  margin-bottom:14px!important;
}
body[data-view="observer"][data-tool="observation"] .observer-options .option{
  font-size:15.25px!important;
  line-height:1.42!important;
  padding:12px 13px!important;
  margin:9px 0!important;
  border-radius:16px!important;
}
body[data-view="observer"][data-tool="observation"] .observer-options .option input{
  transform:scale(1.1)!important;
  margin-top:4px!important;
}
body[data-view="observer"][data-tool="observation"] .observer-main-nav{
  max-height:118px!important;
  overflow:auto!important;
  justify-content:flex-start!important;
  align-content:flex-start!important;
}
body[data-view="observer"][data-tool="observation"] .observer-main-nav .question-dot{
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  font-size:13px!important;
}
.preview-flow .observer-main-nav{
  max-height:118px!important;
  overflow:auto!important;
  justify-content:flex-start!important;
  align-content:flex-start!important;
}
@media(max-width:760px){
  body[data-view="observer"][data-tool="observation"] .observer-one-card{padding:18px!important;}
  body[data-view="observer"][data-tool="observation"] .observer-main-nav,
  .preview-flow .observer-main-nav{
    max-height:78px!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }
  body[data-view="observer"][data-tool="observation"] .observer-question-main .prompt{font-size:15.5px!important;}
  body[data-view="observer"][data-tool="observation"] .observer-options .option{
    font-size:14.75px!important;
    min-height:58px!important;
    padding:13px!important;
  }
}

/* ===== V14 login activity highlights and gallery ===== */
.activity-highlight-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:14px 0 0;
}
.activity-highlight-card{
  border:1px solid var(--line);
  background:#fbfdfb;
  border-radius:16px;
  padding:12px;
  min-height:108px;
  cursor:pointer;
  transition:.18s ease;
}
.activity-highlight-card:hover,
.activity-highlight-card:focus,
.activity-highlight-card.active{
  border-color:#9eddb8;
  background:linear-gradient(180deg,#f6fff9 0%,#fff 100%);
  box-shadow:0 12px 28px rgba(16,24,20,.08);
  transform:translateY(-1px);
  outline:none;
}
.activity-highlight-card span{
  display:inline-flex;
  border:1px solid #c9ead6;
  background:#eef8f2;
  color:var(--green-dark);
  border-radius:999px;
  padding:4px 9px;
  font-size:11.5px;
  font-weight:950;
  margin-bottom:8px;
}
.activity-highlight-card strong{
  display:block;
  color:var(--ink);
  font-size:14px;
  line-height:1.2;
}
.work-gallery-prompt{
  margin-top:12px;
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  border:1px solid var(--line);
  background:#fff;
  border-radius:16px;
  padding:12px 14px;
}
.work-gallery-prompt h3{
  margin:0;
}
.work-gallery-prompt p{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  margin:0;
}
.gallery-open{
  overflow:hidden;
}
.gallery-modal{
  position:fixed;
  inset:0;
  z-index:200;
  background:rgba(21,35,27,.55);
  backdrop-filter:blur(8px);
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.gallery-shell{
  width:min(1120px,100%);
  max-height:min(760px,calc(100vh - 48px));
  overflow:hidden;
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  box-shadow:0 24px 70px rgba(16,24,20,.28);
  display:flex;
  flex-direction:column;
}
.gallery-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:20px 22px;
  border-bottom:1px solid var(--line);
}
.gallery-head h2{
  font-size:24px;
  margin:0 0 4px;
}
.gallery-strip{
  display:flex;
  gap:16px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  padding:18px 22px 16px;
  scrollbar-width:thin;
}
.gallery-strip figure{
  flex:0 0 min(78vw,520px);
  margin:0;
  scroll-snap-align:start;
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:#fbfdfb;
}
.gallery-strip img{
  display:block;
  width:100%;
  height:390px;
  object-fit:cover;
  background:#eef8f2;
}
.gallery-strip figcaption{
  padding:12px 14px;
  color:var(--green-dark);
  font-size:14px;
  font-weight:850;
}
.gallery-cta{
  border-top:1px solid var(--line);
  padding:14px 22px 18px;
  display:flex;
  justify-content:flex-end;
}

/* Compact, one-screen login layout */
.login-page .header-inner{
  padding:6px 0!important;
}
.login-page .brand-logo{
  height:46px!important;
}
.login-page .brand-title h1{
  font-size:20px!important;
}
.login-page .brand-title p{
  font-size:12.5px!important;
}
.login-page .container{
  margin:14px auto 14px!important;
}
.login-page .grid.two{
  gap:18px!important;
  align-items:start!important;
}
.login-page .card-body{
  padding:22px!important;
}
.login-page h2{
  font-size:28px!important;
  margin-bottom:8px!important;
}
.login-page .lead{
  font-size:15px!important;
  line-height:1.45!important;
  margin-bottom:8px!important;
}
.login-page .instruction-box,
.login-page .support-box{
  margin-top:12px!important;
  border-radius:16px!important;
  padding:13px 16px!important;
}
.login-page .activity-info-box h3{
  margin-top:0!important;
}
.login-page .clean-list li{
  margin:5px 0!important;
  font-size:14px!important;
  line-height:1.35!important;
}
.login-page .field{
  margin-bottom:9px!important;
}
.login-page label{
  margin-bottom:5px!important;
  font-size:12.5px!important;
}
.login-page input[type=text],
.login-page input[type=password],
.login-page input[type=email],
.login-page select{
  min-height:44px!important;
  padding:10px 14px!important;
  border-radius:15px!important;
  font-size:14.5px!important;
}
.login-page .form-row{
  gap:12px!important;
  margin-bottom:0!important;
}
.login-page .btn-row{
  margin-top:8px!important;
}
.login-page .footer{
  padding:10px 16px!important;
}
.login-page .footer-inner img{
  height:28px!important;
}
@media(max-width:980px){
  .activity-highlight-grid{grid-template-columns:1fr;}
  .activity-highlight-card{min-height:auto;}
  .work-gallery-prompt{align-items:flex-start;flex-direction:column;}
  .work-gallery-prompt button{width:100%;}
}
@media(max-width:700px){
  .gallery-modal{padding:12px;}
  .gallery-shell{max-height:calc(100vh - 24px);border-radius:18px;}
  .gallery-head{padding:16px;flex-direction:column;}
  .gallery-head button{width:100%;}
  .gallery-strip{padding:14px 16px 18px;}
  .gallery-strip figure{flex-basis:82vw;}
  .gallery-strip img{height:330px;}
  .gallery-cta{padding:12px 16px 16px;}
  .gallery-cta .button-link{width:100%;}
}

/* ===== V16 attached login layout, lighter first load, compact observer start ===== */
.login-page{
  background:linear-gradient(180deg,#f7fbf8 0%,#eef6f1 100%)!important;
}
.login-page .header{
  background:rgba(255,255,255,.96)!important;
  border-top:2px solid #1e2a22!important;
  border-bottom:1px solid #dbe9df!important;
}
.login-page .header-inner{
  width:min(1780px,calc(100% - 120px))!important;
  padding:8px 0!important;
}
.login-page .brand{
  gap:22px!important;
}
.login-page .brand-logo{
  height:52px!important;
}
.login-page .brand-title h1{
  font-size:28px!important;
  letter-spacing:0!important;
}
.login-page .brand-title p{
  display:block!important;
  font-size:15px!important;
}
.login-page .header-actions .button-link{
  min-width:98px!important;
  min-height:52px!important;
  border-radius:18px!important;
  font-size:16px!important;
  box-shadow:0 10px 28px rgba(21,35,27,.08)!important;
}
.login-page .container{
  width:min(1780px,calc(100% - 120px))!important;
  margin:20px auto 18px!important;
  align-items:stretch!important;
}
.login-page .grid.two{
  grid-template-columns:minmax(680px,1.12fr) minmax(520px,.74fr)!important;
  gap:26px!important;
}
.login-page .card{
  border-radius:28px!important;
  box-shadow:0 22px 52px rgba(21,35,27,.10)!important;
  border:1px solid #dcebe1!important;
}
.login-page .card-body{
  padding:28px!important;
}
.login-page h2{
  font-size:35px!important;
  line-height:1.06!important;
  margin:0 0 10px!important;
}
.login-page .lead{
  font-size:20px!important;
  line-height:1.38!important;
  margin:0 0 18px!important;
  color:#33433a!important;
}
.login-page .activity-highlight-grid{
  gap:14px!important;
  margin:0 0 16px!important;
}
.login-page .activity-highlight-card{
  min-height:122px!important;
  padding:18px!important;
  border-radius:20px!important;
  background:#fff!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
}
.login-page .activity-highlight-card.active,
.login-page .activity-highlight-card:hover,
.login-page .activity-highlight-card:focus{
  border-color:#8fd8ae!important;
  background:linear-gradient(180deg,#f7fff9 0%,#fff 100%)!important;
  box-shadow:0 14px 28px rgba(26,160,91,.12)!important;
}
.login-page .activity-highlight-card span{
  align-self:flex-start!important;
  font-size:14px!important;
  padding:5px 12px!important;
  margin-bottom:12px!important;
}
.login-page .activity-highlight-card strong{
  font-size:18px!important;
  line-height:1.08!important;
}
.login-page .activity-info-box{
  min-height:184px!important;
  margin-top:0!important;
  border-radius:20px!important;
  padding:22px 24px!important;
  background:linear-gradient(180deg,#f6fff9 0%,#eef9f3 100%)!important;
  border-color:#bdecca!important;
}
.login-page .activity-info-box h3{
  font-size:25px!important;
  margin:0 0 12px!important;
  color:#0b7d3c!important;
}
.login-page .clean-list{
  padding-left:22px!important;
}
.login-page .clean-list li{
  font-size:19px!important;
  line-height:1.35!important;
  margin:7px 0!important;
}
.login-support-action{
  margin-top:14px;
  min-height:122px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  align-items:center;
  gap:18px;
  border:1px solid #bdecca;
  background:linear-gradient(180deg,#f8fffb 0%,#eef9f3 100%);
  border-radius:22px;
  padding:16px 22px;
}
.support-copy{
  color:#2f4037;
  font-size:15px;
  line-height:1.45;
}
.support-copy strong:first-child{
  display:block;
  color:#18251d;
  font-size:17px;
  margin-bottom:3px;
}
.support-copy a{
  color:#0b7d3c;
  font-weight:800;
}
.teps-action-card{
  position:relative;
  height:82px;
  overflow:hidden;
  border:0;
  border-radius:12px;
  padding:0;
  cursor:pointer;
  text-align:left;
  color:#fff;
  background:#16321f;
  box-shadow:0 14px 28px rgba(21,35,27,.18);
}
.teps-action-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(14,31,20,.82),rgba(14,31,20,.25));
}
.teps-action-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.teps-action-card span,
.teps-action-card small,
.teps-action-card b{
  position:relative;
  z-index:1;
}
.teps-action-card span{
  display:block;
  padding:13px 14px 0;
  font-size:16px;
  font-weight:950;
}
.teps-action-card small{
  display:block;
  max-width:190px;
  padding:1px 14px 0;
  font-size:10.5px;
  line-height:1.2;
  opacity:.9;
}
.teps-action-card b{
  position:absolute;
  right:10px;
  bottom:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:26px;
  padding:0 12px;
  border-radius:9px;
  background:#fff;
  color:#0b7d3c;
  font-size:12px;
  font-weight:950;
}
.login-page .field{
  margin-bottom:12px!important;
}
.login-page label{
  font-size:16px!important;
  line-height:1.2!important;
  margin-bottom:8px!important;
}
.login-page input[type=text],
.login-page input[type=password],
.login-page input[type=email],
.login-page select{
  min-height:58px!important;
  border-radius:18px!important;
  font-size:18px!important;
  padding:13px 18px!important;
}
.login-page .btn-row{
  margin-top:12px!important;
}
.login-page button.primary{
  min-height:54px!important;
  border-radius:18px!important;
  padding:0 24px!important;
  font-size:18px!important;
}
.login-page .footer{
  padding:16px!important;
  background:#fff!important;
}
.login-page .footer-inner img{
  height:30px!important;
}
.work-gallery-prompt{
  display:none!important;
}

.observation-start-card{
  max-width:1160px!important;
  margin:12px auto!important;
}
.observation-start-card .card-body{
  padding:20px 24px!important;
}
.observation-start-card h2{
  font-size:26px!important;
  line-height:1.1!important;
  margin:0 0 8px!important;
}
.observation-start-card h3{
  font-size:18px!important;
  margin:12px 0 8px!important;
}
.observation-start-card .summary-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  margin:8px 0 10px!important;
}
.observation-start-card .summary-box{
  padding:10px 12px!important;
}
.observation-start-card .summary-box strong{
  font-size:18px!important;
}
.observation-start-card .instruction-box{
  margin-top:8px!important;
  padding:11px 14px!important;
  max-height:104px!important;
  overflow:auto!important;
}
.observation-start-card .form-row.three{
  gap:12px!important;
  margin-bottom:0!important;
}
.observation-start-card .field{
  margin-bottom:8px!important;
}
.observation-start-card label{
  font-size:13px!important;
  margin-bottom:5px!important;
}
.observation-start-card input[type=text],
.observation-start-card input[type=date]{
  min-height:42px!important;
  height:42px!important;
  padding:8px 12px!important;
  border-radius:14px!important;
  font-size:14px!important;
}
.observation-start-card .btn-row{
  margin-top:4px!important;
  justify-content:flex-end!important;
}
.observation-start-card button.primary{
  min-height:44px!important;
  border-radius:14px!important;
}

@media(max-width:1200px){
  .login-page .header-inner,
  .login-page .container{
    width:min(100% - 32px,1180px)!important;
  }
  .login-page .grid.two{
    grid-template-columns:1fr!important;
  }
  .login-support-action{
    grid-template-columns:1fr!important;
  }
  .teps-action-card{
    width:100%;
  }
}
@media(max-height:820px) and (min-width:1201px){
  .login-page .container{margin:14px auto 12px!important;}
  .login-page .card-body{padding:24px!important;}
  .login-page h2{font-size:31px!important;}
  .login-page .lead{font-size:17px!important;margin-bottom:14px!important;}
  .login-page .activity-highlight-card{min-height:106px!important;padding:15px!important;}
  .login-page .activity-highlight-card strong{font-size:16px!important;}
  .login-page .activity-info-box{min-height:160px!important;padding:18px 22px!important;}
  .login-page .clean-list li{font-size:16px!important;margin:5px 0!important;}
  .login-support-action{min-height:108px!important;padding:14px 18px!important;}
  .login-page input[type=text],
  .login-page input[type=password],
  .login-page input[type=email],
  .login-page select{min-height:50px!important;font-size:16px!important;}
}
@media(max-width:700px){
  .login-page .header-inner,
  .login-page .container{
    width:min(100% - 24px,100%)!important;
  }
  .login-page h2{font-size:28px!important;}
  .login-page .lead{font-size:16px!important;}
  .login-page .activity-highlight-grid{grid-template-columns:1fr!important;}
  .login-page .activity-highlight-card{min-height:auto!important;}
  .login-support-action{padding:14px!important;}
}

/* ===== V17 landing copy and one-screen fit ===== */
.login-page .container{
  margin:18px auto 14px!important;
}
.login-page .card-body{
  padding:26px!important;
}
.login-page h2{
  font-size:33px!important;
}
.login-page .lead{
  font-size:18px!important;
  line-height:1.34!important;
  margin-bottom:16px!important;
}
.login-page .activity-highlight-card{
  min-height:112px!important;
  padding:15px 16px!important;
}
.login-page .activity-highlight-card span{
  margin-bottom:8px!important;
}
.login-page .activity-highlight-card strong{
  font-size:15.5px!important;
  line-height:1.12!important;
}
.login-page .activity-highlight-card small{
  display:block;
  margin-top:5px;
  color:#6d7b72;
  font-size:12.5px;
  line-height:1.25;
}
.login-page .activity-info-box{
  min-height:134px!important;
  padding:17px 21px!important;
}
.login-page .activity-info-box h3{
  font-size:24px!important;
  margin-bottom:6px!important;
}
#activityInfoSummary{
  margin:0 0 6px;
  color:#34443a;
  font-size:15.5px;
  line-height:1.35;
}
.login-page .activity-info-box .clean-list{
  margin:0;
}
.login-page .activity-info-box .clean-list li{
  font-size:15px!important;
  line-height:1.25!important;
  margin:3px 0!important;
}
.login-steps{
  margin-top:12px;
  display:grid;
  grid-template-columns:auto repeat(3,minmax(0,1fr));
  align-items:center;
  gap:10px;
  border:1px solid #d9e9df;
  background:#fff;
  border-radius:18px;
  padding:10px 12px;
}
.login-steps > strong{
  color:#0b7d3c;
  font-size:16px;
  padding-right:2px;
}
.login-steps span{
  min-height:38px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #e0ede5;
  background:#f7fbf8;
  border-radius:14px;
  padding:7px 10px;
  color:#29382f;
  font-size:13px;
  font-weight:800;
  line-height:1.2;
}
.login-steps b{
  flex:0 0 auto;
  width:24px;
  height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#17af5f;
  color:#fff;
  font-size:12px;
}
.login-support-action{
  margin-top:12px!important;
  min-height:104px!important;
  grid-template-columns:minmax(0,1fr) 280px!important;
  padding:14px 18px!important;
}
.support-copy{
  font-size:13.5px!important;
}
.support-copy strong:first-child{
  font-size:16px!important;
}
.teps-action-card{
  height:76px!important;
}
.teps-action-card span{
  padding:14px 14px 0!important;
  font-size:17px!important;
}
.teps-action-card small{
  display:none!important;
}
.teps-action-card b{
  bottom:9px!important;
}

@media(max-height:820px) and (min-width:1201px){
  .login-page .header-inner{padding:6px 0!important;}
  .login-page .brand-logo{height:46px!important;}
  .login-page .brand-title h1{font-size:24px!important;}
  .login-page .brand-title p{font-size:13px!important;}
  .login-page .container{margin:12px auto 10px!important;}
  .login-page .card-body{padding:22px!important;}
  .login-page h2{font-size:29px!important;}
  .login-page .lead{font-size:16px!important;margin-bottom:12px!important;}
  .login-page .activity-highlight-grid{gap:10px!important;margin-bottom:12px!important;}
  .login-page .activity-highlight-card{min-height:96px!important;padding:12px!important;}
  .login-page .activity-highlight-card span{font-size:12px!important;margin-bottom:6px!important;}
  .login-page .activity-highlight-card strong{font-size:14px!important;}
  .login-page .activity-highlight-card small{font-size:11.5px!important;}
  .login-page .activity-info-box{min-height:118px!important;padding:14px 18px!important;}
  .login-page .activity-info-box h3{font-size:21px!important;}
  #activityInfoSummary{font-size:14px!important;}
  .login-page .activity-info-box .clean-list li{font-size:13.5px!important;}
  .login-steps{margin-top:9px!important;padding:8px 10px!important;}
  .login-steps span{min-height:32px!important;font-size:12px!important;padding:5px 8px!important;}
  .login-support-action{min-height:90px!important;margin-top:10px!important;padding:11px 16px!important;}
  .teps-action-card{height:66px!important;}
  .login-page label{font-size:14px!important;margin-bottom:5px!important;}
  .login-page .field{margin-bottom:8px!important;}
  .login-page input[type=text],
  .login-page input[type=password],
  .login-page input[type=email],
  .login-page select{min-height:45px!important;font-size:15px!important;border-radius:15px!important;}
  .login-page button.primary{min-height:46px!important;font-size:16px!important;}
  .login-page .footer{padding:8px!important;}
}
@media(max-width:700px){
  .login-steps{
    grid-template-columns:1fr;
  }
  .login-support-action{
    grid-template-columns:1fr!important;
  }
}

/* ===== V18 cleaner modern login and compact observer details ===== */
.login-page .container{
  width:min(1740px,calc(100% - 112px))!important;
  margin:18px auto 12px!important;
}
.login-page .grid.two{
  grid-template-columns:minmax(660px,1.1fr) minmax(500px,.74fr)!important;
  gap:24px!important;
}
.login-page .card{
  border-radius:26px!important;
  box-shadow:0 18px 45px rgba(21,35,27,.08)!important;
}
.login-page .card-body{
  padding:26px!important;
}
.login-page h2{
  font-size:32px!important;
  line-height:1.08!important;
  margin-bottom:10px!important;
}
.login-page .lead{
  max-width:980px;
  font-size:17px!important;
  line-height:1.42!important;
  margin-bottom:18px!important;
}
.login-page .activity-highlight-grid{
  gap:14px!important;
  margin-bottom:16px!important;
}
.login-page .activity-highlight-card{
  min-height:104px!important;
  padding:17px!important;
  border-radius:18px!important;
  border-color:#dfece4!important;
  background:#fff!important;
  box-shadow:none!important;
}
.login-page .activity-highlight-card.active,
.login-page .activity-highlight-card:hover,
.login-page .activity-highlight-card:focus{
  border-color:#60c98c!important;
  background:#fbfffc!important;
  box-shadow:0 12px 28px rgba(26,160,91,.10)!important;
  transform:none!important;
}
.login-page .activity-highlight-card span{
  display:block!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
  padding:0!important;
  margin:0 0 8px!important;
  color:#0b7d3c!important;
  font-size:14px!important;
  line-height:1.1!important;
}
.login-page .activity-highlight-card strong{
  font-size:16px!important;
  line-height:1.2!important;
}
.login-page .activity-highlight-card small{
  display:none!important;
}
.login-page .activity-info-box{
  min-height:132px!important;
  border-radius:20px!important;
  padding:18px 22px!important;
  margin:0!important;
}
.login-page .activity-info-box h3{
  font-size:23px!important;
  margin:0 0 6px!important;
}
#activityInfoSummary{
  font-size:15px!important;
  line-height:1.36!important;
  margin-bottom:6px!important;
}
.login-page .activity-info-box .clean-list li{
  font-size:14.5px!important;
  line-height:1.28!important;
}
.login-steps{
  margin-top:12px!important;
  gap:9px!important;
  padding:9px 10px!important;
  border-radius:16px!important;
}
.login-steps > strong{
  font-size:15px!important;
}
.login-steps span{
  min-height:34px!important;
  border-radius:13px!important;
  font-size:12.5px!important;
  padding:6px 9px!important;
}
.login-steps b{
  width:22px!important;
  height:22px!important;
}
.login-support-action{
  grid-template-columns:240px minmax(0,1fr)!important;
  gap:18px!important;
  min-height:92px!important;
  margin-top:12px!important;
  padding:14px 18px!important;
  border-radius:20px!important;
}
.teps-action-card{
  height:64px!important;
  border:1px solid #bdecca!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#f8fffb,#eaf8f0)!important;
  color:#0b7d3c!important;
  box-shadow:none!important;
  padding:0 16px!important;
}
.teps-action-card::after,
.teps-action-card img{
  display:none!important;
}
.teps-action-card span{
  padding:0!important;
  font-size:18px!important;
  line-height:1.05!important;
  color:#0b7d3c!important;
}
.teps-action-card b{
  right:12px!important;
  bottom:10px!important;
  background:#17af5f!important;
  color:#fff!important;
}
.support-copy{
  font-size:13px!important;
  line-height:1.38!important;
}
.support-copy strong:first-child{
  font-size:15px!important;
}
.login-page label{
  font-size:14px!important;
  margin-bottom:5px!important;
}
.login-page .field{
  margin-bottom:9px!important;
}
.login-page input[type=text],
.login-page input[type=password],
.login-page input[type=email],
.login-page select{
  min-height:46px!important;
  border-radius:14px!important;
  padding:9px 14px!important;
  font-size:15px!important;
}
.login-page button.primary{
  min-height:46px!important;
  border-radius:14px!important;
  font-size:16px!important;
  padding:0 20px!important;
}
.login-page .btn-row{
  margin-top:8px!important;
}

.observation-start-card{
  max-width:1260px!important;
  margin:12px auto!important;
}
.observation-start-layout{
  display:grid;
  grid-template-columns:minmax(260px,.34fr) minmax(0,.66fr);
  gap:22px;
  align-items:start;
}
.observation-start-info{
  min-width:0;
}
.observation-start-info h2{
  font-size:24px!important;
  line-height:1.12!important;
  margin-bottom:10px!important;
}
.observation-start-info .summary-grid{
  grid-template-columns:1fr!important;
  gap:10px!important;
}
.observation-start-info .summary-box{
  padding:10px 12px!important;
}
.observation-start-info .instruction-box{
  max-height:280px!important;
  overflow:auto!important;
  padding:12px 14px!important;
}
.observation-start-info .instruction-box h3{
  margin-top:0!important;
}
.observation-start-form h3{
  margin-top:0!important;
}
.observation-start-form .form-row.three{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:12px!important;
}
.observation-start-form .field{
  margin-bottom:9px!important;
}
.observation-start-form label{
  font-size:13px!important;
}
.observation-start-form input[type=text],
.observation-start-form input[type=date]{
  height:42px!important;
  min-height:42px!important;
  border-radius:13px!important;
  font-size:14px!important;
}

@media(max-height:820px) and (min-width:1201px){
  .login-page .card-body{padding:22px!important;}
  .login-page h2{font-size:28px!important;}
  .login-page .lead{font-size:15.5px!important;margin-bottom:12px!important;}
  .login-page .activity-highlight-card{min-height:88px!important;padding:13px!important;}
  .login-page .activity-highlight-card strong{font-size:14px!important;}
  .login-page .activity-info-box{min-height:112px!important;padding:14px 18px!important;}
  .login-steps{margin-top:9px!important;}
  .login-support-action{min-height:78px!important;margin-top:9px!important;}
}
@media(max-width:1200px){
  .login-page .container{width:min(100% - 32px,1180px)!important;}
  .login-page .grid.two{grid-template-columns:1fr!important;}
  .login-support-action{grid-template-columns:1fr!important;}
  .observation-start-layout{grid-template-columns:1fr;}
  .observation-start-info .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  .login-page .container{width:min(100% - 24px,100%)!important;}
  .login-steps{grid-template-columns:1fr!important;}
  .observation-start-form .form-row.three{grid-template-columns:1fr!important;}
}

/* ===== V19 reduced borders, clearer hierarchy, item-based observer nav ===== */
.login-page .container{
  margin:16px auto 10px!important;
}
.login-page .card{
  border:1px solid #e6eee9!important;
  border-radius:24px!important;
  box-shadow:0 16px 42px rgba(21,35,27,.07)!important;
}
.login-page .card-body{
  padding:24px!important;
}
.login-page h2{
  font-size:30px!important;
  line-height:1.1!important;
  margin-bottom:9px!important;
}
.login-page .lead{
  font-size:16px!important;
  line-height:1.42!important;
  color:#405148!important;
  margin-bottom:18px!important;
}
.login-page .activity-highlight-grid{
  gap:12px!important;
  margin-bottom:16px!important;
}
.login-page .activity-highlight-card{
  min-height:86px!important;
  padding:15px 16px!important;
  border:1px solid #e3ece7!important;
  border-radius:16px!important;
  background:#fff!important;
}
.login-page .activity-highlight-card.active,
.login-page .activity-highlight-card:hover,
.login-page .activity-highlight-card:focus{
  border-color:#19a85b!important;
  background:#fbfffc!important;
  box-shadow:0 10px 24px rgba(26,160,91,.08)!important;
}
.login-page .activity-highlight-card span{
  color:#0b7d3c!important;
  font-size:13px!important;
  font-weight:900!important;
  margin:0 0 8px!important;
}
.login-page .activity-highlight-card strong{
  font-size:14.5px!important;
  line-height:1.25!important;
  font-weight:850!important;
}
.login-page .activity-info-box{
  min-height:auto!important;
  padding:16px 18px!important;
  margin:0!important;
  border:0!important;
  border-left:4px solid #19a85b!important;
  border-radius:14px!important;
  background:#f6fbf8!important;
  box-shadow:none!important;
}
.login-page .activity-info-box h3{
  font-size:20px!important;
  margin:0 0 5px!important;
}
#activityInfoSummary{
  font-size:14.5px!important;
  line-height:1.35!important;
  margin:0 0 6px!important;
}
.login-page .activity-info-box .clean-list{
  padding-left:18px!important;
}
.login-page .activity-info-box .clean-list li{
  font-size:13.5px!important;
  line-height:1.28!important;
  margin:2px 0!important;
}
.login-steps{
  margin-top:14px!important;
  display:grid!important;
  grid-template-columns:90px repeat(3,minmax(0,1fr))!important;
  gap:12px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.login-steps > strong{
  align-self:center!important;
  font-size:16px!important;
  color:#0b7d3c!important;
}
.login-steps span{
  min-height:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
  color:#35463c!important;
  font-size:13px!important;
  line-height:1.3!important;
  font-weight:750!important;
}
.login-steps b{
  width:22px!important;
  height:22px!important;
  font-size:12px!important;
}
.login-support-action{
  margin-top:16px!important;
  min-height:auto!important;
  padding:14px 0 0!important;
  border:0!important;
  border-top:1px solid #e3ece7!important;
  border-radius:0!important;
  background:transparent!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:20px!important;
}
.support-copy{
  display:grid!important;
  gap:3px!important;
  font-size:13px!important;
  line-height:1.35!important;
}
.support-copy strong:first-child{
  font-size:15px!important;
  margin:0!important;
}
.teps-action-card{
  position:static!important;
  height:40px!important;
  min-height:40px!important;
  border:1px solid #19a85b!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#0b7d3c!important;
  box-shadow:none!important;
  padding:0 18px!important;
  white-space:nowrap!important;
  font-size:14px!important;
  font-weight:900!important;
  text-align:center!important;
}
.teps-action-card::after,
.teps-action-card img,
.teps-action-card span,
.teps-action-card b{
  display:none!important;
}
.login-page label{
  font-size:13px!important;
  margin-bottom:5px!important;
}
.login-page .field{
  margin-bottom:8px!important;
}
.login-page input[type=text],
.login-page input[type=password],
.login-page input[type=email],
.login-page select{
  min-height:42px!important;
  height:42px!important;
  border-radius:12px!important;
  padding:8px 12px!important;
  font-size:14.5px!important;
}
.login-page button.primary{
  min-height:42px!important;
  height:42px!important;
  border-radius:12px!important;
  font-size:15px!important;
}
.observation-start-card{
  max-width:1240px!important;
}
.observation-start-form .observation-subject-field{
  max-width:360px!important;
}
.observation-start-form .btn-row{
  justify-content:flex-end!important;
}
.question-dot{
  min-width:44px!important;
  padding:0 8px!important;
}
@media(max-height:820px) and (min-width:1201px){
  .login-page .card-body{padding:20px!important;}
  .login-page h2{font-size:27px!important;}
  .login-page .lead{font-size:14.5px!important;margin-bottom:12px!important;}
  .login-page .activity-highlight-card{min-height:78px!important;padding:12px!important;}
  .login-page .activity-info-box{padding:12px 16px!important;}
  .login-steps{margin-top:10px!important;}
  .login-support-action{margin-top:12px!important;padding-top:12px!important;}
}
@media(max-width:900px){
  .login-steps{grid-template-columns:1fr!important;}
  .login-support-action{grid-template-columns:1fr!important;}
  .teps-action-card{justify-self:start!important;}
}

/* ===== V20 less crowded copy, faster CTA, observation form fit ===== */
.login-page .card-body{
  padding:28px 28px 24px!important;
}
.login-page h2{
  font-size:28px!important;
  line-height:1.14!important;
  margin-bottom:12px!important;
}
.login-page .lead{
  max-width:900px!important;
  font-size:15.5px!important;
  line-height:1.55!important;
  margin-bottom:20px!important;
}
.login-page .activity-highlight-grid{
  margin-bottom:20px!important;
  gap:14px!important;
}
.login-page .activity-highlight-card{
  min-height:74px!important;
  padding:14px 16px!important;
}
.login-page .activity-highlight-card span{
  margin-bottom:7px!important;
}
.login-page .activity-highlight-card strong{
  font-weight:500!important;
  font-size:14.5px!important;
  line-height:1.35!important;
}
.login-page .activity-info-box{
  margin-top:2px!important;
  padding:18px 20px!important;
}
.login-page .activity-info-box h3{
  margin-bottom:10px!important;
}
#activityInfoSummary{
  line-height:1.65!important;
  margin-bottom:12px!important;
}
.login-page .activity-info-box .clean-list li{
  line-height:1.6!important;
  margin:5px 0!important;
}
.login-steps{
  margin-top:18px!important;
  margin-bottom:2px!important;
}
.login-support-action{
  margin-top:18px!important;
}
.teps-action-card{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-decoration:none!important;
}
.observation-start-form .form-row.four,
.observation-start-form .observation-class-details{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
}
.observation-start-form .observation-subject-field{
  max-width:none!important;
}
@media(max-height:820px) and (min-width:1201px){
  .login-page .card-body{padding:22px!important;}
  .login-page h2{font-size:25px!important;margin-bottom:8px!important;}
  .login-page .lead{font-size:14px!important;line-height:1.45!important;margin-bottom:14px!important;}
  .login-page .activity-highlight-grid{margin-bottom:14px!important;}
  .login-page .activity-highlight-card{min-height:68px!important;padding:11px 13px!important;}
  .login-page .activity-info-box{padding:13px 16px!important;}
  #activityInfoSummary{line-height:1.45!important;margin-bottom:8px!important;}
  .login-page .activity-info-box .clean-list li{line-height:1.35!important;margin:2px 0!important;}
  .login-steps{margin-top:10px!important;}
  .login-support-action{margin-top:12px!important;}
}
@media(max-width:1100px){
  .observation-start-form .form-row.four,
  .observation-start-form .observation-class-details{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:760px){
  .observation-start-form .form-row.four,
  .observation-start-form .observation-class-details{
    grid-template-columns:1fr!important;
  }
}

/* ===== V21: login gallery restored on click + better use of vertical space ===== */
.login-page .grid.two{
  align-items:stretch!important;
  grid-template-columns:minmax(620px,1.35fr) minmax(420px,.9fr)!important;
  gap:28px!important;
}
.login-page .grid.two > .card:first-child .card-body{
  min-height:calc(100vh - 205px)!important;
  display:grid!important;
  grid-template-rows:auto auto minmax(155px,1fr) auto auto!important;
  gap:18px!important;
  align-content:stretch!important;
}
.login-page .grid.two > .card:nth-child(2) .card-body{
  min-height:calc(100vh - 205px)!important;
}
.login-page .activity-highlight-grid{
  gap:20px!important;
  margin:4px 0 0!important;
}
.login-page .activity-highlight-card{
  min-height:90px!important;
  padding:18px 18px!important;
  border-color:#dbe7df!important;
  background:#fff!important;
}
.login-page .activity-highlight-card.active,
.login-page .activity-highlight-card:hover,
.login-page .activity-highlight-card:focus{
  border-color:#19a85b!important;
  background:#fbfffc!important;
}
.login-page .activity-highlight-card strong{
  font-weight:500!important;
  font-size:15px!important;
  line-height:1.45!important;
}
.login-page .activity-info-box{
  margin:0!important;
  min-height:155px!important;
  padding:22px 24px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  border:0!important;
  border-left:4px solid #19a85b!important;
  background:#f6fbf8!important;
}
#activityInfoSummary{
  font-size:15px!important;
  line-height:1.75!important;
  max-width:760px!important;
}
.login-page .activity-info-box .clean-list li{
  font-size:14px!important;
  line-height:1.65!important;
}
.login-steps{
  margin:0!important;
  padding-top:2px!important;
  gap:18px!important;
}
.login-support-action{
  margin-top:0!important;
  padding-top:18px!important;
  align-items:center!important;
}
.teps-action-card{
  appearance:none!important;
  cursor:pointer!important;
  min-width:180px!important;
}
.gallery-modal.hidden{display:none!important;}
.gallery-shell{
  width:min(1040px,100%)!important;
}
.gallery-strip figure{
  flex-basis:min(72vw,460px)!important;
}
.gallery-strip img{
  height:360px!important;
}
.gallery-cta{
  align-items:center!important;
  justify-content:space-between!important;
}
.gallery-cta::before{
  content:'Explore the full TEPS Courses experience';
  color:#66756d;
  font-weight:750;
}
@media(max-height:820px) and (min-width:1201px){
  .login-page .grid.two > .card:first-child .card-body,
  .login-page .grid.two > .card:nth-child(2) .card-body{
    min-height:calc(100vh - 170px)!important;
    padding:22px 24px!important;
  }
  .login-page .activity-highlight-grid{gap:16px!important;}
  .login-page .activity-highlight-card{min-height:82px!important;padding:15px!important;}
  .login-page .activity-info-box{min-height:142px!important;padding:18px 22px!important;}
  .login-steps{gap:14px!important;}
  .login-support-action{padding-top:14px!important;}
}
@media(max-width:1100px){
  .login-page .grid.two{grid-template-columns:1fr!important;}
  .login-page .grid.two > .card:first-child .card-body,
  .login-page .grid.two > .card:nth-child(2) .card-body{min-height:auto!important;}
}
@media(max-width:760px){
  .login-page .activity-highlight-grid{grid-template-columns:1fr!important;}
  .gallery-strip figure{flex-basis:86vw!important;}
  .gallery-strip img{height:320px!important;}
  .gallery-cta{display:grid!important;gap:10px!important;justify-content:stretch!important;}
}


/* ===== V22: bottom TEPS in-action carousel, image lightbox, admin photo sequencing ===== */
.login-page .grid.two > .card:first-child .card-body{
  grid-template-rows:auto auto minmax(135px,.8fr) auto minmax(145px,1fr)!important;
  gap:16px!important;
}
.login-page .activity-highlight-card strong{
  font-weight:500!important;
}
.login-bottom-gallery{
  display:grid!important;
  grid-template-columns:minmax(220px,.75fr) minmax(360px,1.25fr)!important;
  gap:18px!important;
  align-items:stretch!important;
  margin-top:0!important;
  padding-top:14px!important;
  border-top:1px solid var(--line)!important;
}
.login-bottom-gallery .support-copy{
  border:0!important;
  background:transparent!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:3px!important;
  min-width:0!important;
}
.login-bottom-gallery .support-copy strong:first-child{
  color:var(--ink)!important;
  font-size:15px!important;
}
.teps-action-stage{
  min-width:0!important;
  border:1px solid #dbe7df!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#ffffff,#f7fbf8)!important;
  padding:10px 12px 12px!important;
  overflow:hidden!important;
}
.teps-action-stage-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
  margin-bottom:9px!important;
}
.teps-action-stage-head strong{
  color:var(--green-dark)!important;
  font-size:16px!important;
}
.gallery-open-link{
  padding:7px 10px!important;
  border-radius:999px!important;
  color:var(--green-dark)!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  font-size:12px!important;
  font-weight:850!important;
}
.action-carousel{
  height:106px!important;
  display:grid!important;
  grid-template-columns:.8fr 1.36fr .8fr!important;
  gap:10px!important;
  align-items:center!important;
  overflow:hidden!important;
}
.carousel-photo{
  position:relative!important;
  display:block!important;
  padding:0!important;
  border:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:#eaf3ef!important;
  box-shadow:0 10px 25px rgba(20,40,28,.10)!important;
  min-width:0!important;
  height:100%!important;
  transform:none!important;
}
.carousel-photo:hover{
  transform:translateY(-1px)!important;
}
.carousel-photo img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
.carousel-photo span{
  position:absolute!important;
  left:0!important;right:0!important;bottom:0!important;
  display:block!important;
  padding:18px 8px 7px!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1.2!important;
  text-align:left!important;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.72))!important;
}
.carousel-photo.is-side{
  height:78px!important;
  opacity:.68!important;
  box-shadow:0 5px 14px rgba(20,40,28,.08)!important;
}
.carousel-photo.is-side span{
  font-size:9.5px!important;
  padding:14px 6px 5px!important;
}
.carousel-photo.is-center{
  border:2px solid rgba(26,160,91,.55)!important;
}
.gallery-modal{
  position:fixed!important;
  inset:0!important;
  z-index:1000!important;
  padding:28px!important;
  background:rgba(8,20,13,.55)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:auto!important;
}
.gallery-shell{
  width:min(1080px,calc(100vw - 48px))!important;
  max-height:calc(100vh - 48px)!important;
  overflow:auto!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:24px!important;
  padding:22px!important;
  box-shadow:0 24px 80px rgba(0,0,0,.25)!important;
}
.gallery-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:flex-start!important;
  gap:18px!important;
  margin-bottom:16px!important;
}
.gallery-head h2{
  margin-bottom:4px!important;
  font-size:28px!important;
}
.gallery-viewer{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr) 48px!important;
  gap:12px!important;
  align-items:center!important;
  margin-bottom:14px!important;
}
.gallery-viewer figure{
  margin:0!important;
  border-radius:20px!important;
  overflow:hidden!important;
  background:#0e1511!important;
  position:relative!important;
}
.gallery-viewer img{
  width:100%!important;
  height:min(58vh,560px)!important;
  object-fit:contain!important;
  background:#111!important;
  display:block!important;
}
.gallery-viewer figcaption{
  padding:12px 16px!important;
  color:#fff!important;
  font-weight:800!important;
  background:#15231b!important;
}
.gallery-arrow{
  width:48px!important;
  height:48px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  color:var(--green-dark)!important;
  font-size:28px!important;
  padding:0!important;
  box-shadow:0 8px 24px rgba(0,0,0,.12)!important;
}
.gallery-strip{
  display:flex!important;
  gap:10px!important;
  overflow-x:auto!important;
  padding:6px 2px 12px!important;
  margin:0!important;
  scroll-snap-type:x mandatory!important;
}
.gallery-thumb{
  flex:0 0 170px!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#fff!important;
  padding:0!important;
  display:block!important;
  scroll-snap-align:start!important;
}
.gallery-thumb.active{
  border-color:var(--green)!important;
  box-shadow:0 0 0 3px rgba(26,160,91,.14)!important;
}
.gallery-thumb img{
  width:100%!important;
  height:92px!important;
  object-fit:cover!important;
  display:block!important;
}
.gallery-thumb span{
  display:block!important;
  padding:7px 8px!important;
  font-size:11px!important;
  font-weight:800!important;
  color:var(--text)!important;
  line-height:1.25!important;
  text-align:left!important;
}
.gallery-admin-panel{
  margin-top:14px!important;
  padding:14px!important;
  border:1px dashed #b9d9c7!important;
  border-radius:18px!important;
  background:#f8fcfa!important;
}
.gallery-admin-head{
  display:grid!important;
  gap:2px!important;
  margin-bottom:10px!important;
}
.gallery-upload-row{
  display:grid!important;
  grid-template-columns:minmax(180px,.9fr) minmax(220px,1.4fr) auto!important;
  gap:10px!important;
  align-items:end!important;
  margin-bottom:12px!important;
}
.gallery-upload-row input[type=file],
.gallery-upload-row input[type=text]{
  height:42px!important;
  border-radius:12px!important;
  padding:8px 10px!important;
}
.gallery-admin-list{
  display:grid!important;
  gap:8px!important;
}
.gallery-admin-item{
  display:grid!important;
  grid-template-columns:70px minmax(180px,1fr) auto auto auto!important;
  gap:8px!important;
  align-items:center!important;
}
.gallery-admin-item img{
  width:70px!important;
  height:48px!important;
  object-fit:cover!important;
  border-radius:10px!important;
}
.gallery-admin-item input{
  height:38px!important;
  border-radius:10px!important;
}
.gallery-cta{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  padding-top:10px!important;
  border-top:1px solid var(--line)!important;
}
.gallery-cta::before{
  content:''!important;
}
@media(max-height:820px) and (min-width:1201px){
  .action-carousel{height:96px!important;}
  .carousel-photo.is-side{height:70px!important;}
  .login-bottom-gallery{gap:14px!important;}
}
@media(max-width:1100px){
  .login-bottom-gallery{
    grid-template-columns:1fr!important;
  }
  .action-carousel{
    height:140px!important;
  }
}
@media(max-width:760px){
  .gallery-modal{padding:12px!important;}
  .gallery-shell{width:calc(100vw - 20px)!important;padding:16px!important;}
  .gallery-viewer{grid-template-columns:1fr!important;}
  .gallery-arrow{display:none!important;}
  .gallery-viewer img{height:min(52vh,420px)!important;}
  .gallery-upload-row,
  .gallery-admin-item{
    grid-template-columns:1fr!important;
  }
}

/* V23: login gallery moved outside welcome card + compact support line */
.login-page .container{
  margin-top:22px!important;
  margin-bottom:22px!important;
}
.login-page .grid.two{
  align-items:start!important;
  gap:24px!important;
}
.login-page .card-body{
  padding:28px 30px!important;
}
.login-page h2{
  font-size:28px!important;
  line-height:1.08!important;
  letter-spacing:-.04em!important;
}
.login-page .activity-highlight-grid{
  margin-top:16px!important;
  gap:14px!important;
}
.login-page .activity-highlight-card{
  border-color:#dfe8e3!important;
  background:#fff!important;
  min-height:88px!important;
  padding:16px 18px!important;
  box-shadow:none!important;
}
.login-page .activity-highlight-card.active{
  border-color:var(--green)!important;
  background:#fbfffd!important;
}
.login-page .activity-highlight-card span{
  display:block!important;
  margin-bottom:8px!important;
  color:var(--green-dark)!important;
  font-size:13px!important;
  font-weight:900!important;
}
.login-page .activity-highlight-card strong{
  display:block!important;
  color:var(--ink)!important;
  font-size:15px!important;
  font-weight:650!important;
  line-height:1.35!important;
}
.login-page .activity-info-box{
  margin-top:16px!important;
  padding:18px 20px!important;
  min-height:150px!important;
  border-left:4px solid var(--green)!important;
  border-top:0!important;
  border-right:0!important;
  border-bottom:0!important;
  background:linear-gradient(180deg,#f6fbf8,#fbfdfb)!important;
}
.login-page .activity-info-box h3{
  font-size:22px!important;
  margin:0 0 8px!important;
}
.login-page .activity-info-box p,
.login-page .activity-info-box li{
  font-size:15px!important;
  line-height:1.68!important;
}
.login-page .login-steps{
  margin-top:16px!important;
  padding:12px 0 0!important;
  border-top:1px solid #e7efe9!important;
  gap:18px!important;
}
.login-lower-action-band{
  margin-top:16px!important;
  display:grid!important;
  grid-template-columns:minmax(360px,.72fr) minmax(520px,1fr)!important;
  gap:18px!important;
  align-items:stretch!important;
}
.support-one-line{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex-wrap:wrap!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid #dfe8e3!important;
  border-radius:20px!important;
  padding:16px 20px!important;
  box-shadow:0 14px 38px rgba(20,40,28,.06)!important;
  font-size:14px!important;
  color:var(--text)!important;
  min-height:116px!important;
}
.support-one-line strong:first-child{
  font-size:17px!important;
  color:var(--ink)!important;
}
.support-one-line span{
  white-space:normal!important;
}
.teps-action-stage-outside{
  margin:0!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid #dfe8e3!important;
  border-radius:20px!important;
  padding:14px 18px 16px!important;
  box-shadow:0 14px 38px rgba(20,40,28,.06)!important;
  overflow:hidden!important;
}
.teps-action-stage-outside .teps-action-stage-head{
  margin-bottom:8px!important;
}
.teps-action-stage-outside .teps-action-stage-head strong{
  font-size:17px!important;
  color:var(--ink)!important;
}
.teps-action-stage-outside .gallery-open-link{
  padding:8px 14px!important;
  border-radius:999px!important;
  font-size:13px!important;
}
.teps-action-stage-outside .action-carousel{
  height:122px!important;
  display:grid!important;
  grid-template-columns:.78fr 1.4fr .78fr!important;
  gap:12px!important;
  align-items:center!important;
}
.teps-action-stage-outside .carousel-photo{
  border-radius:18px!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #dbe7df!important;
  background:#0f1712!important;
  width:100%!important;
  position:relative!important;
  box-shadow:0 12px 26px rgba(20,40,28,.11)!important;
}
.teps-action-stage-outside .carousel-photo img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
.teps-action-stage-outside .carousel-photo span{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:850!important;
  line-height:1.25!important;
  padding:24px 10px 9px!important;
  text-align:left!important;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.72))!important;
}
.teps-action-stage-outside .carousel-photo.is-side{
  height:88px!important;
  opacity:.78!important;
  transform:scale(.98)!important;
}
.teps-action-stage-outside .carousel-photo.is-center{
  height:118px!important;
  border-color:rgba(26,160,91,.6)!important;
}
@media(max-width:1100px){
  .login-lower-action-band{grid-template-columns:1fr!important;}
  .support-one-line{min-height:auto!important;}
}
@media(max-width:760px){
  .login-page .activity-highlight-grid{grid-template-columns:1fr!important;}
  .login-page .activity-highlight-card{min-height:auto!important;}
  .login-lower-action-band{gap:12px!important;}
  .teps-action-stage-outside .action-carousel{
    height:110px!important;
    grid-template-columns:.7fr 1.25fr .7fr!important;
  }
  .teps-action-stage-outside .carousel-photo.is-side{height:78px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:106px!important;}
}

/* ===== V24: fix login bottom layout - only pictures auto-scroll ===== */
.login-page .container{
  display:block!important;
  width:min(1740px,calc(100% - 112px))!important;
  margin:18px auto 18px!important;
}
.login-page .grid.two{
  display:grid!important;
  grid-template-columns:minmax(660px,1.1fr) minmax(500px,.74fr)!important;
  gap:24px!important;
  align-items:start!important;
  width:100%!important;
}
.login-lower-action-band{
  display:block!important;
  width:100%!important;
  margin:16px 0 0!important;
}
.support-one-line{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  flex-wrap:wrap!important;
  min-height:0!important;
  padding:10px 14px!important;
  margin:0 0 12px!important;
  border:0!important;
  border-top:1px solid #e1ebe5!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:13px!important;
  line-height:1.35!important;
}
.support-one-line strong:first-child{
  font-size:14px!important;
  color:var(--ink)!important;
}
.support-one-line span{
  white-space:nowrap!important;
}
.teps-action-stage-outside{
  width:100%!important;
  margin:0!important;
  padding:14px 18px 16px!important;
  border:1px solid #dfe8e3!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 14px 38px rgba(20,40,28,.06)!important;
  overflow:hidden!important;
}
.teps-action-stage-outside .teps-action-stage-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  margin:0 0 10px!important;
}
.teps-action-stage-outside .action-carousel{
  height:148px!important;
  display:grid!important;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.55fr) minmax(0,.85fr)!important;
  gap:16px!important;
  align-items:center!important;
  overflow:hidden!important;
}
.teps-action-stage-outside .carousel-photo{
  position:relative!important;
  display:block!important;
  width:100%!important;
  padding:0!important;
  border:1px solid #dbe7df!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:#0f1712!important;
  box-shadow:0 12px 26px rgba(20,40,28,.11)!important;
  transform:none!important;
  cursor:pointer!important;
}
.teps-action-stage-outside .carousel-photo.is-side{height:104px!important;opacity:.78!important;}
.teps-action-stage-outside .carousel-photo.is-center{height:144px!important;border-color:rgba(26,160,91,.6)!important;}
.teps-action-stage-outside .carousel-photo img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.teps-action-stage-outside .carousel-photo span{
  position:absolute!important;
  left:0!important;right:0!important;bottom:0!important;
  display:block!important;
  padding:24px 12px 10px!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:850!important;
  line-height:1.25!important;
  text-align:left!important;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.72))!important;
}
@media(max-height:820px) and (min-width:1201px){
  .teps-action-stage-outside .action-carousel{height:128px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:88px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:124px!important;}
  .support-one-line{margin-bottom:10px!important;padding:8px 12px!important;}
}
@media(max-width:1100px){
  .login-page .container{width:min(100% - 32px,1180px)!important;}
  .login-page .grid.two{grid-template-columns:1fr!important;}
  .support-one-line span{white-space:normal!important;}
}
@media(max-width:760px){
  .login-page .container{width:min(100% - 24px,100%)!important;}
  .teps-action-stage-outside .action-carousel{height:122px!important;grid-template-columns:.7fr 1.35fr .7fr!important;gap:10px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:82px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:118px!important;}
}

/* ===== V25: one-screen laptop homepage with left gallery and right sign-in ===== */
@media (min-width:1101px){
  .login-page{overflow:hidden!important;}
  .login-page .page{height:100vh!important;min-height:0!important;}
  .login-page .header{flex:0 0 auto!important;}
  .login-page .header-inner{width:min(1480px,calc(100% - 48px))!important;padding:6px 0!important;}
  .login-page .brand-logo{height:44px!important;}
  .login-page .brand-title h1{font-size:23px!important;}
  .login-page .brand-title p{font-size:12px!important;margin-top:1px!important;}
  .login-page .header-actions .button-link{min-width:82px!important;min-height:40px!important;border-radius:14px!important;font-size:14px!important;}
  .login-page .container.login-home-shell{flex:1 1 auto!important;width:min(1480px,calc(100% - 48px))!important;margin:12px auto!important;min-height:0!important;display:block!important;}
  .login-home-grid{display:grid!important;grid-template-columns:minmax(0,1.18fr) minmax(440px,.82fr)!important;gap:18px!important;height:100%!important;min-height:0!important;align-items:stretch!important;}
  .login-left-stack{display:grid!important;grid-template-rows:minmax(0,1fr) auto 190px!important;gap:9px!important;min-height:0!important;}
  .welcome-card,.sign-in-card{height:100%!important;min-height:0!important;}
  .welcome-card .card-body{height:100%!important;display:flex!important;flex-direction:column!important;padding:20px 22px!important;}
  .sign-in-card .card-body{height:100%!important;padding:20px 22px!important;overflow:auto!important;scrollbar-width:thin!important;}
  .login-page h2{font-size:27px!important;margin-bottom:6px!important;}
  .login-page .lead{font-size:14px!important;line-height:1.35!important;margin-bottom:11px!important;}
  .login-page .activity-highlight-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important;margin:0 0 10px!important;}
  .login-page .activity-highlight-card{appearance:none!important;min-height:52px!important;padding:10px 9px!important;border-radius:14px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;box-shadow:none!important;}
  .login-page .activity-highlight-card span{font-size:13px!important;line-height:1.2!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;}
  .login-page .activity-highlight-card strong{display:none!important;}
  .login-page .activity-info-box{margin:0!important;min-height:0!important;padding:12px 16px!important;border-radius:16px!important;}
  .login-page .activity-info-box h3{font-size:18px!important;margin:0 0 4px!important;}
  #activityInfoSummary{font-size:13.5px!important;line-height:1.4!important;margin-bottom:3px!important;}
  .login-page .activity-info-box .clean-list li{font-size:13px!important;line-height:1.35!important;margin:2px 0!important;}
  .login-page .login-steps{margin-top:auto!important;padding:10px 0 0!important;grid-template-columns:auto repeat(3,minmax(0,1fr))!important;gap:8px!important;}
  .login-steps > strong{font-size:14px!important;}
  .login-steps span{min-height:34px!important;padding:5px 7px!important;border-radius:11px!important;font-size:11.5px!important;}
  .login-steps b{width:21px!important;height:21px!important;font-size:11px!important;}
  .login-left-stack .support-one-line{margin:0!important;padding:5px 8px!important;min-height:24px!important;border:0!important;background:transparent!important;font-size:11.5px!important;gap:9px!important;white-space:nowrap!important;box-shadow:none!important;}
  .login-left-stack .support-one-line strong:first-child{font-size:12px!important;}
  .teps-action-stage-outside{height:190px!important;padding:10px 14px 12px!important;border-radius:18px!important;}
  .teps-action-stage-outside .teps-action-stage-head{margin-bottom:6px!important;}
  .teps-action-stage-outside .teps-action-stage-head strong{font-size:15px!important;}
  .teps-action-stage-outside .action-carousel{height:146px!important;gap:12px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:98px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:142px!important;}
  .teps-action-stage-outside .carousel-photo span{display:none!important;}
  .sign-in-note{margin:0 0 8px!important;}
  .sign-in-card .field{margin-bottom:8px!important;}
  .sign-in-card label{font-size:12px!important;margin-bottom:4px!important;}
  .sign-in-card input[type=text],.sign-in-card input[type=password],.sign-in-card input[type=email],.sign-in-card select{min-height:39px!important;height:39px!important;padding:7px 10px!important;border-radius:12px!important;font-size:13px!important;}
  .sign-in-card .form-row{gap:9px!important;}
  .sign-in-card .btn-row{margin-top:8px!important;}
  .sign-in-card button.primary{min-height:42px!important;height:42px!important;font-size:14px!important;border-radius:13px!important;width:100%!important;}
  .login-page .footer{display:none!important;}
}
@media (min-width:1101px) and (max-height:760px){
  .login-left-stack{grid-template-rows:minmax(0,1fr) auto 154px!important;gap:6px!important;}
  .teps-action-stage-outside{height:154px!important;padding:8px 12px!important;}
  .teps-action-stage-outside .action-carousel{height:115px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:76px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:112px!important;}
  .login-page h2{font-size:23px!important;}
  .login-page .lead{font-size:12.5px!important;margin-bottom:7px!important;}
  .login-page .activity-highlight-card{min-height:43px!important;padding:7px!important;}
  .login-page .activity-info-box{padding:9px 13px!important;}
  .login-page .activity-info-box h3{font-size:16px!important;}
  #activityInfoSummary,.login-page .activity-info-box .clean-list li{font-size:12px!important;}
  .login-page .login-steps{padding-top:6px!important;}
  .login-steps span{min-height:29px!important;font-size:10.5px!important;}
  .sign-in-card .card-body,.welcome-card .card-body{padding:15px 18px!important;}
  .sign-in-card .field{margin-bottom:5px!important;}
  .sign-in-card input[type=text],.sign-in-card input[type=password],.sign-in-card input[type=email],.sign-in-card select{height:34px!important;min-height:34px!important;}
}
@media(max-width:1100px){
  .login-home-grid{display:grid!important;grid-template-columns:1fr!important;gap:16px!important;}
  .login-left-stack{display:grid!important;gap:10px!important;}
  .sign-in-card{grid-row:2!important;}
  .login-left-stack .support-one-line{order:2!important;}
  .teps-action-stage-outside{order:3!important;}
}
.gallery-admin-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:0;flex:1;}
.gallery-admin-item{align-items:center!important;}
.gallery-thumb span,.action-carousel .carousel-photo span{display:none!important;}
.gallery-viewer figure figcaption{display:block;padding:10px 4px 0;text-align:center;font-size:15px;line-height:1.4;color:var(--text);}
@media(max-width:700px){.gallery-admin-fields{grid-template-columns:1fr;}}
.gallery-upload-row{grid-template-columns:minmax(160px,.8fr) minmax(180px,1fr) minmax(180px,1fr) auto!important;}
.gallery-upload-row input[type=url]{height:42px!important;border-radius:12px!important;padding:8px 10px!important;}
@media(max-width:900px){.gallery-upload-row{grid-template-columns:1fr!important;}}


/* ===== V26: gallery management in Admin + compact homepage footer ===== */
@media (min-width:1101px){
  .login-page{overflow:auto!important;}
  .login-page .page{min-height:100vh!important;height:auto!important;}
  .login-page .container.login-home-shell{flex:1 0 auto!important;height:auto!important;margin:12px auto 10px!important;}
  .login-home-grid{height:auto!important;align-items:start!important;}
  .login-left-stack{grid-template-rows:auto auto 170px!important;align-content:start!important;}
  .welcome-card,.sign-in-card{height:auto!important;min-height:0!important;}
  .welcome-card .card-body,.sign-in-card .card-body{height:auto!important;overflow:visible!important;}
  .login-page .footer{display:block!important;flex:0 0 auto!important;padding:8px 16px!important;}
  .login-page .footer-inner img{height:30px!important;}
  .teps-action-stage-outside{height:170px!important;}
  .teps-action-stage-outside .action-carousel{height:128px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:84px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:124px!important;}
}
.admin-gallery-upload{margin:14px 0 18px!important;}
#adminGalleryManager .gallery-admin-list{margin-top:12px;}

/* ===== V27: readable laptop homepage scale and balanced spacing ===== */
@media (min-width:1101px){
  .login-page .header-inner{
    width:min(1540px,calc(100% - 56px))!important;
    padding:8px 0!important;
  }
  .login-page .brand-logo{height:48px!important;}
  .login-page .brand-title h1{font-size:25px!important;}
  .login-page .brand-title p{font-size:13px!important;margin-top:2px!important;}

  .login-page .container.login-home-shell{
    width:min(1540px,calc(100% - 56px))!important;
    margin:14px auto 12px!important;
  }
  .login-home-grid{
    grid-template-columns:minmax(0,1.2fr) minmax(470px,.8fr)!important;
    gap:20px!important;
  }
  .login-left-stack{
    grid-template-rows:auto auto 196px!important;
    gap:11px!important;
  }

  .welcome-card .card-body,.sign-in-card .card-body{
    padding:23px 24px!important;
  }
  .login-page h2{
    font-size:30px!important;
    line-height:1.12!important;
    margin-bottom:8px!important;
  }
  .login-page .lead{
    font-size:15.5px!important;
    line-height:1.42!important;
    margin-bottom:13px!important;
  }

  .login-page .activity-highlight-grid{
    gap:10px!important;
    margin-bottom:11px!important;
  }
  .login-page .activity-highlight-card{
    min-height:58px!important;
    padding:12px 10px!important;
    border-radius:15px!important;
  }
  .login-page .activity-highlight-card span{
    font-size:14px!important;
    line-height:1.25!important;
  }

  .login-page .activity-info-box{
    padding:14px 18px!important;
    border-radius:17px!important;
  }
  .login-page .activity-info-box h3{
    font-size:20px!important;
    margin-bottom:5px!important;
  }
  #activityInfoSummary{
    font-size:14.5px!important;
    line-height:1.45!important;
    margin-bottom:4px!important;
  }
  .login-page .activity-info-box .clean-list{
    padding-left:20px!important;
  }
  .login-page .activity-info-box .clean-list li{
    font-size:14px!important;
    line-height:1.4!important;
    margin:3px 0!important;
  }

  .login-page .login-steps{
    padding-top:12px!important;
    gap:10px!important;
  }
  .login-steps > strong{font-size:15px!important;}
  .login-steps span{
    min-height:38px!important;
    padding:7px 8px!important;
    font-size:12.5px!important;
    line-height:1.25!important;
  }
  .login-steps b{
    width:23px!important;
    height:23px!important;
    font-size:12px!important;
  }

  .login-left-stack .support-one-line{
    padding:7px 8px!important;
    min-height:30px!important;
    font-size:12.5px!important;
    gap:10px!important;
  }
  .login-left-stack .support-one-line strong:first-child{
    font-size:13px!important;
  }

  .teps-action-stage-outside{
    height:196px!important;
    padding:12px 15px 14px!important;
    border-radius:19px!important;
  }
  .teps-action-stage-outside .teps-action-stage-head{
    margin-bottom:8px!important;
  }
  .teps-action-stage-outside .teps-action-stage-head strong{
    font-size:17px!important;
  }
  .teps-action-stage-outside .action-carousel{
    height:150px!important;
    gap:14px!important;
  }
  .teps-action-stage-outside .carousel-photo.is-side{height:102px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:146px!important;}

  .sign-in-note{
    font-size:13.5px!important;
    line-height:1.4!important;
    margin-bottom:10px!important;
  }
  .sign-in-card .field{margin-bottom:10px!important;}
  .sign-in-card label{
    font-size:13px!important;
    margin-bottom:5px!important;
  }
  .sign-in-card input[type=text],
  .sign-in-card input[type=password],
  .sign-in-card input[type=email],
  .sign-in-card select{
    min-height:44px!important;
    height:44px!important;
    padding:9px 12px!important;
    border-radius:13px!important;
    font-size:14px!important;
  }
  .sign-in-card .form-row{gap:10px!important;}
  .sign-in-card .btn-row{margin-top:10px!important;}
  .sign-in-card button.primary{
    min-height:46px!important;
    height:46px!important;
    font-size:15px!important;
  }

  .login-page .footer{
    padding:7px 16px!important;
    margin-top:auto!important;
  }
  .login-page .footer-inner{font-size:13px!important;}
  .login-page .footer-inner img{height:32px!important;}
}

@media (min-width:1101px) and (max-height:820px){
  .login-page .container.login-home-shell{margin-top:10px!important;}
  .welcome-card .card-body,.sign-in-card .card-body{padding:19px 21px!important;}
  .login-page h2{font-size:27px!important;}
  .login-page .lead{font-size:14.5px!important;margin-bottom:10px!important;}
  .login-page .activity-highlight-card{min-height:52px!important;padding:9px!important;}
  .login-page .activity-info-box{padding:11px 15px!important;}
  .login-page .activity-info-box h3{font-size:18px!important;}
  #activityInfoSummary,.login-page .activity-info-box .clean-list li{font-size:13px!important;}
  .login-page .login-steps{padding-top:8px!important;}
  .login-steps span{min-height:33px!important;font-size:11.5px!important;}
  .login-left-stack{grid-template-rows:auto auto 172px!important;gap:8px!important;}
  .teps-action-stage-outside{height:172px!important;padding:10px 13px 12px!important;}
  .teps-action-stage-outside .action-carousel{height:130px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:88px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:126px!important;}
  .sign-in-card .field{margin-bottom:7px!important;}
  .sign-in-card input[type=text],.sign-in-card input[type=password],.sign-in-card input[type=email],.sign-in-card select{height:39px!important;min-height:39px!important;}
}

/* ===== V28: larger homepage copy, form text and gallery breathing room ===== */
@media (min-width:1101px){
  .login-page h2{
    font-size:34px!important;
    line-height:1.12!important;
    margin-bottom:10px!important;
  }
  .login-page .lead{
    font-size:18px!important;
    line-height:1.48!important;
    margin-bottom:16px!important;
  }

  .login-page .activity-highlight-grid{
    gap:12px!important;
    margin-bottom:13px!important;
  }
  .login-page .activity-highlight-card{
    min-height:64px!important;
    padding:14px 12px!important;
  }
  .login-page .activity-highlight-card span{
    font-size:16px!important;
    line-height:1.3!important;
  }

  .login-page .activity-info-box{
    padding:17px 20px!important;
  }
  .login-page .activity-info-box h3{
    font-size:23px!important;
    line-height:1.25!important;
    margin-bottom:7px!important;
  }
  #activityInfoSummary{
    font-size:16.5px!important;
    line-height:1.5!important;
    margin-bottom:6px!important;
  }
  .login-page .activity-info-box .clean-list li{
    font-size:16px!important;
    line-height:1.45!important;
    margin:4px 0!important;
  }

  .login-page .login-steps{
    padding-top:14px!important;
    gap:12px!important;
  }
  .login-steps > strong{
    font-size:17px!important;
  }
  .login-steps span{
    min-height:43px!important;
    padding:8px 10px!important;
    font-size:14px!important;
    line-height:1.3!important;
  }
  .login-steps b{
    width:26px!important;
    height:26px!important;
    font-size:13px!important;
  }

  .login-left-stack .support-one-line{
    min-height:38px!important;
    padding:9px 10px!important;
    gap:12px!important;
    font-size:14px!important;
    line-height:1.4!important;
  }
  .login-left-stack .support-one-line strong:first-child{
    font-size:15px!important;
  }

  .sign-in-note{
    font-size:15.5px!important;
    line-height:1.45!important;
    margin-bottom:13px!important;
  }
  .sign-in-card .field{
    margin-bottom:12px!important;
  }
  .sign-in-card label{
    font-size:15px!important;
    line-height:1.25!important;
    margin-bottom:6px!important;
  }
  .sign-in-card input[type=text],
  .sign-in-card input[type=password],
  .sign-in-card input[type=email],
  .sign-in-card select{
    min-height:49px!important;
    height:49px!important;
    padding:10px 13px!important;
    font-size:16px!important;
  }
  .sign-in-card .form-row{
    gap:12px!important;
  }
  .sign-in-card .btn-row{
    margin-top:12px!important;
  }
  .sign-in-card button.primary{
    min-height:50px!important;
    height:50px!important;
    font-size:17px!important;
  }

  .login-left-stack{
    grid-template-rows:auto auto 214px!important;
    gap:12px!important;
  }
  .teps-action-stage-outside{
    height:214px!important;
    padding:14px 16px 22px!important;
  }
  .teps-action-stage-outside .teps-action-stage-head{
    margin-bottom:10px!important;
  }
  .teps-action-stage-outside .teps-action-stage-head strong{
    font-size:20px!important;
  }
  .teps-action-stage-outside .action-carousel{
    height:154px!important;
  }
  .teps-action-stage-outside .carousel-photo.is-side{
    height:104px!important;
  }
  .teps-action-stage-outside .carousel-photo.is-center{
    height:148px!important;
  }
}

@media (min-width:1101px) and (max-height:820px){
  .login-page h2{font-size:30px!important;}
  .login-page .lead{font-size:16px!important;line-height:1.42!important;}
  .login-page .activity-highlight-card{min-height:58px!important;padding:11px!important;}
  .login-page .activity-highlight-card span{font-size:15px!important;}
  .login-page .activity-info-box h3{font-size:21px!important;}
  #activityInfoSummary{font-size:15px!important;}
  .login-page .activity-info-box .clean-list li{font-size:14.5px!important;}
  .login-steps > strong{font-size:16px!important;}
  .login-steps span{font-size:13px!important;min-height:38px!important;}
  .login-left-stack .support-one-line{font-size:13px!important;min-height:34px!important;}
  .sign-in-note{font-size:14.5px!important;}
  .sign-in-card label{font-size:14px!important;}
  .sign-in-card input[type=text],.sign-in-card input[type=password],.sign-in-card input[type=email],.sign-in-card select{height:44px!important;min-height:44px!important;font-size:15px!important;}
  .sign-in-card button.primary{height:47px!important;min-height:47px!important;font-size:16px!important;}
  .login-left-stack{grid-template-rows:auto auto 190px!important;}
  .teps-action-stage-outside{height:190px!important;padding-bottom:18px!important;}
  .teps-action-stage-outside .action-carousel{height:137px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:92px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:132px!important;}
}

/* ===== V29: connected activity tabs, true sliding gallery and full-screen footer fit ===== */
@media (min-width:1101px){
  .login-page{
    min-height:100svh!important;
  }
  .login-page .page{
    min-height:100svh!important;
  }
  .login-page .container.login-home-shell{
    margin:10px auto 8px!important;
  }

  /* Tabs now form the heading edge of the explanation panel. */
  .login-page .activity-highlight-grid{
    margin:0!important;
    gap:8px!important;
    position:relative!important;
    z-index:2!important;
    align-items:end!important;
  }
  .login-page .activity-highlight-card{
    min-height:56px!important;
    border-radius:16px 16px 0 0!important;
    border-bottom-color:#c9ead6!important;
    background:#f8fbf9!important;
    box-shadow:none!important;
    padding:12px 14px!important;
    transform:none!important;
  }
  .login-page .activity-highlight-card.active{
    background:linear-gradient(180deg,#f4fcf7 0%,#eff9f2 100%)!important;
    border-color:#1aa05b!important;
    border-bottom-color:transparent!important;
    color:var(--green-dark)!important;
    margin-bottom:-1px!important;
  }
  .login-page .activity-highlight-card span{
    font-size:17px!important;
    font-weight:900!important;
  }
  .login-page .activity-info-box{
    margin:0!important;
    border-radius:0 0 18px 18px!important;
    border-top:1px solid #1aa05b!important;
    padding:17px 20px 15px!important;
    min-height:132px!important;
  }
  #activityInfoSummary{
    margin-top:0!important;
    font-size:17px!important;
    font-weight:500!important;
  }

  /* Recover vertical room so the full footer remains visible. */
  .login-left-stack{
    grid-template-rows:auto auto 190px!important;
    gap:10px!important;
  }
  .teps-action-stage-outside{
    height:190px!important;
    padding:12px 16px 20px!important;
    overflow:hidden!important;
  }
  .teps-action-stage-outside .action-carousel{
    height:136px!important;
    padding-bottom:8px!important;
    transition:transform .32s ease, opacity .32s ease!important;
    will-change:transform,opacity!important;
  }
  .teps-action-stage-outside .carousel-photo.is-side{height:92px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:130px!important;}

  .action-carousel.slide-to-left{
    transform:translateX(-18%)!important;
    opacity:.45!important;
  }
  .action-carousel.enter-from-right{
    transform:translateX(18%)!important;
    opacity:.45!important;
    transition:none!important;
  }

  .login-page .footer{
    flex:0 0 auto!important;
    min-height:54px!important;
    padding:8px 16px!important;
    overflow:visible!important;
  }
  .login-page .footer-inner{
    min-height:38px!important;
  }
  .login-page .footer-inner img{
    height:38px!important;
    max-height:38px!important;
  }
}

@media (min-width:1101px) and (max-height:820px){
  .login-page .activity-highlight-card{min-height:50px!important;padding:9px 12px!important;}
  .login-page .activity-highlight-card span{font-size:15.5px!important;}
  .login-page .activity-info-box{min-height:112px!important;padding:12px 16px!important;}
  #activityInfoSummary{font-size:15px!important;}
  .login-left-stack{grid-template-rows:auto auto 170px!important;}
  .teps-action-stage-outside{height:170px!important;padding-bottom:16px!important;}
  .teps-action-stage-outside .action-carousel{height:118px!important;}
  .teps-action-stage-outside .carousel-photo.is-side{height:80px!important;}
  .teps-action-stage-outside .carousel-photo.is-center{height:114px!important;}
  .login-page .footer{min-height:48px!important;padding:5px 16px!important;}
  .login-page .footer-inner img{height:32px!important;}
}

/* ===== V30: individual image position transitions + extra gallery breathing room ===== */
@media (min-width:1101px){
  .login-left-stack{
    grid-template-rows:auto auto 198px!important;
  }
  .teps-action-stage-outside{
    height:198px!important;
    padding:12px 16px 27px!important;
  }
  .teps-action-stage-outside .action-carousel{
    position:relative!important;
    display:block!important;
    height:137px!important;
    padding:0!important;
    overflow:hidden!important;
    transform:none!important;
    opacity:1!important;
  }
  .teps-action-stage-outside .carousel-photo{
    position:absolute!important;
    top:50%!important;
    margin:0!important;
    transition:left .68s cubic-bezier(.22,.8,.25,1),
               width .68s cubic-bezier(.22,.8,.25,1),
               height .68s cubic-bezier(.22,.8,.25,1),
               transform .68s cubic-bezier(.22,.8,.25,1),
               opacity .5s ease,
               border-color .5s ease!important;
    will-change:left,width,height,transform,opacity!important;
  }
  .teps-action-stage-outside .carousel-photo.slot-left{
    left:0!important;
    width:25.5%!important;
    height:92px!important;
    transform:translateY(-50%)!important;
    opacity:.8!important;
    border-color:#dbe7df!important;
  }
  .teps-action-stage-outside .carousel-photo.slot-center{
    left:27.5%!important;
    width:45%!important;
    height:130px!important;
    transform:translateY(-50%)!important;
    opacity:1!important;
    border-color:rgba(26,160,91,.7)!important;
  }
  .teps-action-stage-outside .carousel-photo.slot-right{
    left:74.5%!important;
    width:25.5%!important;
    height:92px!important;
    transform:translateY(-50%)!important;
    opacity:.8!important;
    border-color:#dbe7df!important;
  }
  .teps-action-stage-outside .carousel-photo.slot-incoming{
    left:102%!important;
    width:25.5%!important;
    height:92px!important;
    transform:translateY(-50%)!important;
    opacity:.15!important;
  }
  .teps-action-stage-outside .carousel-photo.slot-exit-left{
    left:-28%!important;
    width:25.5%!important;
    height:92px!important;
    transform:translateY(-50%)!important;
    opacity:0!important;
  }
  .action-carousel.slide-to-left,
  .action-carousel.enter-from-right{
    transform:none!important;
    opacity:1!important;
  }
}

@media (min-width:1101px) and (max-height:820px){
  .login-left-stack{grid-template-rows:auto auto 178px!important;}
  .teps-action-stage-outside{height:178px!important;padding:10px 14px 23px!important;}
  .teps-action-stage-outside .action-carousel{height:119px!important;}
  .teps-action-stage-outside .carousel-photo.slot-left,
  .teps-action-stage-outside .carousel-photo.slot-right,
  .teps-action-stage-outside .carousel-photo.slot-incoming,
  .teps-action-stage-outside .carousel-photo.slot-exit-left{height:80px!important;}
  .teps-action-stage-outside .carousel-photo.slot-center{height:114px!important;}
}

/* ===== V31: clearer steps, closer support, see-more gallery and one-screen modal ===== */
.login-page .login-steps{
  align-items:start!important;
  padding-top:12px!important;
  gap:12px!important;
}
.login-page .login-steps > strong{
  align-self:start!important;
  padding-top:5px!important;
  font-size:18px!important;
  line-height:1.25!important;
}
.login-page .login-steps span{
  align-items:flex-start!important;
  justify-content:flex-start!important;
  min-height:44px!important;
  padding:7px 9px!important;
  font-size:14px!important;
  line-height:1.35!important;
  text-align:left!important;
}
.login-page .login-steps b{
  flex:0 0 auto!important;
  margin-top:0!important;
}
.login-left-stack{
  gap:8px!important;
}
.login-left-stack .support-one-line{
  margin-top:-2px!important;
  margin-bottom:4px!important;
}
.teps-action-stage-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
}
.teps-action-see-more{
  padding:7px 12px!important;
  border-radius:999px!important;
  border:1px solid #cfe3d6!important;
  background:#fff!important;
  color:var(--green-dark)!important;
  box-shadow:none!important;
  font-size:13px!important;
  font-weight:850!important;
}
.teps-action-see-more:hover{
  background:#f2faf5!important;
  transform:none!important;
}
body.gallery-open{
  overflow:hidden!important;
}
.gallery-modal{
  overflow:hidden!important;
  padding:14px!important;
}
.gallery-shell{
  width:min(1040px,calc(100vw - 28px))!important;
  height:min(760px,calc(100svh - 28px))!important;
  max-height:calc(100svh - 28px)!important;
  overflow:hidden!important;
  padding:16px 18px!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto auto!important;
  gap:10px!important;
}
.gallery-head{
  margin:0!important;
  align-items:center!important;
  min-height:46px!important;
  padding-bottom:9px!important;
  border-bottom:1px solid var(--line)!important;
}
.gallery-head h2{
  font-size:25px!important;
  line-height:1.1!important;
  margin:0!important;
}
.gallery-head .note{
  display:none!important;
}
.gallery-head .danger{
  padding:9px 14px!important;
  border-radius:13px!important;
  box-shadow:none!important;
}
.gallery-viewer{
  min-height:0!important;
  height:100%!important;
  margin:0!important;
  grid-template-columns:44px minmax(0,1fr) 44px!important;
  gap:10px!important;
}
.gallery-viewer figure{
  height:100%!important;
  min-height:0!important;
  display:grid!important;
  grid-template-rows:minmax(0,1fr) auto!important;
}
.gallery-viewer img{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  object-fit:contain!important;
}
.gallery-viewer figcaption{
  padding:8px 12px!important;
  font-size:14px!important;
  line-height:1.25!important;
}
.gallery-arrow{
  width:44px!important;
  height:44px!important;
}
.gallery-strip{
  height:58px!important;
  min-height:58px!important;
  padding:3px 2px!important;
  margin:0!important;
  gap:8px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
}
.gallery-thumb{
  flex:0 0 94px!important;
  height:52px!important;
  border-radius:10px!important;
}
.gallery-thumb img{
  height:50px!important;
}
.gallery-cta{
  min-height:44px!important;
  padding-top:6px!important;
}
.gallery-cta .button-link{
  min-height:42px!important;
  padding:9px 14px!important;
  font-size:14px!important;
}

@media(max-width:1100px){
  .login-page .container.login-home-shell{
    margin:14px auto 18px!important;
  }
  .login-page .login-home-grid{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  .login-left-stack{
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
  }
  .welcome-card{order:1!important;}
  .support-one-line{order:2!important;}
  .teps-action-stage-outside{order:3!important;}
  .sign-in-card{order:4!important;}
  .login-page .grid.two{grid-template-columns:1fr!important;}
  .login-page .activity-highlight-grid{
    grid-template-columns:1fr!important;
    gap:6px!important;
  }
  .login-page .activity-highlight-card{
    border-radius:13px!important;
    border-bottom:1px solid var(--line)!important;
    min-height:48px!important;
  }
  .login-page .activity-highlight-card.active{
    border-color:var(--green)!important;
  }
  .login-page .activity-info-box{
    border-radius:14px!important;
    margin-top:8px!important;
  }
  .login-page .login-steps{
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
  .login-page .login-steps > strong{
    padding-top:0!important;
  }
  .login-left-stack .support-one-line{
    white-space:normal!important;
    flex-wrap:wrap!important;
    gap:5px 9px!important;
  }
  .teps-action-stage-outside{
    width:100%!important;
    height:210px!important;
  }
  .action-carousel{
    height:150px!important;
  }
}

@media(max-width:700px){
  .header-inner{
    width:calc(100% - 20px)!important;
    padding:8px 0!important;
    flex-direction:row!important;
    align-items:center!important;
  }
  .brand-logo{height:42px!important;}
  .brand-title h1{font-size:18px!important;}
  .brand-title p{font-size:11px!important;}
  .header-actions .button-link{padding:8px 11px!important;font-size:12px!important;}
  .login-page .container{width:calc(100% - 20px)!important;}
  .login-page .card-body{padding:20px!important;}
  .login-page h2{font-size:26px!important;}
  .login-page .lead{font-size:15.5px!important;}
  .login-page .form-row{grid-template-columns:1fr!important;gap:0!important;}
  .teps-action-stage-outside{
    height:186px!important;
    padding:13px 12px 18px!important;
  }
  .teps-action-stage-outside .action-carousel{height:126px!important;}
  .carousel-photo.slot-left,.carousel-photo.slot-right{width:25%!important;}
  .carousel-photo.slot-center{width:48%!important;}
  .gallery-modal{padding:8px!important;}
  .gallery-shell{
    width:calc(100vw - 16px)!important;
    height:calc(100svh - 16px)!important;
    max-height:calc(100svh - 16px)!important;
    padding:12px!important;
    border-radius:18px!important;
    grid-template-rows:auto minmax(0,1fr) 52px auto!important;
  }
  .gallery-head h2{font-size:21px!important;}
  .gallery-head .danger{padding:7px 10px!important;font-size:12px!important;}
  .gallery-viewer{grid-template-columns:minmax(0,1fr)!important;}
  .gallery-arrow{display:none!important;}
  .gallery-viewer figcaption{font-size:12.5px!important;padding:7px 9px!important;}
  .gallery-strip{height:52px!important;min-height:52px!important;}
  .gallery-thumb{flex-basis:78px!important;height:46px!important;}
  .gallery-thumb img{height:44px!important;}
  .gallery-cta{justify-content:stretch!important;}
  .gallery-cta .button-link{width:100%!important;}
}

/* ===== V33: homepage card UI aligned with Admin login ===== */
@media (min-width:1101px){
  .login-page .container.login-home-shell{
    width:min(1320px,calc(100% - 32px))!important;
    margin:28px auto 30px!important;
  }
  .login-page .login-home-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr)!important;
    gap:22px!important;
    align-items:start!important;
  }
  .login-page .login-left-stack{
    gap:14px!important;
  }
  .login-page .card,
  .login-page .teps-action-stage{
    border:1px solid var(--line)!important;
    border-radius:var(--radius)!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:var(--shadow)!important;
  }
  .login-page .welcome-card .card-body,
  .login-page .sign-in-card .card-body{
    padding:30px!important;
  }
  .login-page .welcome-card h2,
  .login-page .sign-in-card h2{
    margin:0 0 12px!important;
    font-size:31px!important;
    line-height:1.12!important;
    letter-spacing:-.035em!important;
  }
  .login-page .welcome-card .lead{
    margin:0 0 16px!important;
    font-size:16px!important;
    line-height:1.55!important;
  }
  .login-page .activity-highlight-grid{
    gap:10px!important;
    margin:0!important;
  }
  .login-page .activity-highlight-card{
    min-height:58px!important;
    padding:12px 14px!important;
    border-radius:15px 15px 0 0!important;
  }
  .login-page .activity-highlight-card span{
    font-size:15px!important;
    line-height:1.25!important;
  }
  .login-page .activity-info-box{
    margin-top:0!important;
    min-height:122px!important;
    padding:16px 18px!important;
    border-radius:0 0 18px 18px!important;
  }
  #activityInfoSummary{
    margin-bottom:7px!important;
    font-size:15px!important;
    line-height:1.5!important;
  }
  .login-page .activity-info-box .clean-list li{
    margin:5px 0!important;
    font-size:14.5px!important;
    line-height:1.45!important;
  }
  .login-page .login-steps{
    margin-top:16px!important;
    padding-top:14px!important;
    gap:14px!important;
  }
  .login-page .login-steps > strong,
  .login-page .login-steps span{
    font-size:14px!important;
    line-height:1.35!important;
  }
  .login-page .login-steps b{
    width:27px!important;
    height:27px!important;
    min-width:27px!important;
  }
  .login-page .support-one-line{
    margin:0 6px!important;
    padding:0!important;
    gap:10px!important;
    font-size:13.5px!important;
    line-height:1.45!important;
  }
  .login-page .teps-action-stage-outside{
    height:205px!important;
    padding:16px 18px 22px!important;
  }
  .login-page .teps-action-stage-head{
    margin-bottom:10px!important;
  }
  .login-page .teps-action-stage-head > strong{
    font-size:18px!important;
  }
  .login-page .action-carousel{
    height:145px!important;
  }
  .login-page .sign-in-card{
    align-self:start!important;
  }
  .login-page .sign-in-note{
    margin:0 0 14px!important;
    font-size:12.5px!important;
    line-height:1.45!important;
  }
  .login-page .sign-in-card .field{
    margin-bottom:14px!important;
  }
  .login-page .sign-in-card label{
    margin-bottom:7px!important;
    font-size:13px!important;
  }
  .login-page .sign-in-card input,
  .login-page .sign-in-card select{
    min-height:48px!important;
    padding:13px 14px!important;
    border-radius:15px!important;
    font-size:15px!important;
  }
  .login-page .sign-in-card .form-row{
    gap:12px!important;
  }
  .login-page .sign-in-card .btn-row{
    margin-top:18px!important;
  }
  .login-page .sign-in-card .btn-row .primary{
    min-height:48px!important;
    font-size:14px!important;
  }
}

@media (max-width:1100px){
  .login-page .card,
  .login-page .teps-action-stage{
    border:1px solid var(--line)!important;
    border-radius:24px!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:var(--shadow)!important;
  }
  .login-page .welcome-card .card-body,
  .login-page .sign-in-card .card-body{
    padding:26px!important;
  }
}

@media (max-width:700px){
  .login-page .welcome-card .card-body,
  .login-page .sign-in-card .card-body{
    padding:20px!important;
  }
  .login-page .welcome-card h2,
  .login-page .sign-in-card h2{
    margin-bottom:10px!important;
  }
}

/* ===== V38: V33 admin-style cards with true viewport fit ===== */
@media (min-width:1101px){
  /* Keep the V33 visual system. Fit the page by controlling the outer layout, not by squeezing cards. */
  .login-page,
  .login-page .page{
    height:100vh!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  .login-page .header,
  .login-page .footer{
    flex:0 0 auto!important;
  }
  .login-page .header-inner{
    padding:10px 0!important;
  }
  .login-page .brand-logo{
    height:52px!important;
  }
  .login-page .container.login-home-shell{
    flex:1 1 auto!important;
    min-height:0!important;
    width:min(1320px,calc(100% - 32px))!important;
    margin:14px auto 10px!important;
  }
  .login-page .login-home-grid{
    height:100%!important;
    min-height:0!important;
    grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr)!important;
    gap:22px!important;
    align-items:start!important;
  }
  .login-page .login-left-stack{
    height:100%!important;
    min-height:0!important;
    display:grid!important;
    grid-template-rows:auto auto minmax(174px,1fr)!important;
    gap:14px!important;
  }
  .login-page .welcome-card,
  .login-page .sign-in-card{
    border:1px solid var(--line)!important;
    border-radius:var(--radius)!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:var(--shadow)!important;
  }
  .login-page .welcome-card .card-body,
  .login-page .sign-in-card .card-body{
    padding:30px!important;
  }
  /* Only the two requested compact areas are tightened. */
  .login-page .activity-highlight-card{
    min-height:52px!important;
    padding:8px 14px!important;
  }
  .login-page .activity-info-box .clean-list li{
    margin:2px 0!important;
    line-height:1.38!important;
  }
  .login-page .support-one-line{
    display:flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
    gap:9px!important;
    margin:0 6px!important;
    padding:0!important;
    font-size:12.5px!important;
    line-height:1.3!important;
  }
  .login-page .teps-action-stage-outside{
    height:100%!important;
    min-height:174px!important;
    padding:16px 18px 18px!important;
    display:flex!important;
    flex-direction:column!important;
  }
  .login-page .teps-action-stage-head{
    flex:0 0 auto!important;
    margin-bottom:10px!important;
  }
  .login-page .action-carousel{
    flex:1 1 auto!important;
    min-height:118px!important;
    height:auto!important;
  }
  .login-page .footer{
    min-height:46px!important;
    padding:4px 16px!important;
  }
  .login-page .footer-inner{
    min-height:38px!important;
    gap:10px!important;
  }
  .login-page .footer-inner img{
    height:32px!important;
    max-height:32px!important;
  }
}

/* Very short laptop screens: preserve the same card style and trim only non-content height. */
@media (min-width:1101px) and (max-height:850px){
  .login-page .header-inner{padding:7px 0!important;}
  .login-page .brand-logo{height:48px!important;}
  .login-page .container.login-home-shell{margin:10px auto 8px!important;}
  .login-page .login-left-stack{gap:11px!important;grid-template-rows:auto auto minmax(150px,1fr)!important;}
  .login-page .teps-action-stage-outside{min-height:150px!important;padding:13px 18px 16px!important;}
  .login-page .teps-action-stage-head{margin-bottom:7px!important;}
  .login-page .footer{min-height:40px!important;padding:2px 16px!important;}
  .login-page .footer-inner{min-height:34px!important;}
  .login-page .footer-inner img{height:28px!important;max-height:28px!important;}
}

/* ===== V39: Admin-style spacing, one-step smaller for full one-screen fit ===== */
@media (min-width:1101px){
  /* Preserve the same admin-like outer rhythm. */
  .login-page .container.login-home-shell{
    width:min(1320px,calc(100% - 40px))!important;
    margin:12px auto 8px!important;
  }
  .login-page .login-home-grid{
    gap:22px!important;
  }
  .login-page .login-left-stack{
    gap:12px!important;
    grid-template-rows:auto auto minmax(154px,1fr)!important;
  }

  /* One small step down in type and internal spacing only. */
  .login-page .welcome-card .card-body,
  .login-page .sign-in-card .card-body{
    padding:26px 28px!important;
  }
  .login-page .welcome-card h2,
  .login-page .sign-in-card h2{
    font-size:29px!important;
    line-height:1.1!important;
    margin-bottom:10px!important;
  }
  .login-page .welcome-card .lead{
    font-size:15px!important;
    line-height:1.45!important;
    margin-bottom:13px!important;
  }
  .login-page .activity-highlight-grid{
    margin-top:0!important;
  }
  .login-page .activity-highlight-card{
    min-height:48px!important;
    padding:7px 13px!important;
  }
  .login-page .activity-highlight-card span{
    font-size:14px!important;
  }
  .login-page .activity-info-box{
    min-height:112px!important;
    padding:14px 17px!important;
  }
  #activityInfoSummary{
    font-size:14.5px!important;
    line-height:1.42!important;
    margin-bottom:5px!important;
  }
  .login-page .activity-info-box .clean-list li{
    margin:1px 0!important;
    font-size:14px!important;
    line-height:1.34!important;
  }
  .login-page .login-steps{
    margin-top:12px!important;
    padding-top:11px!important;
    gap:12px!important;
  }
  .login-page .login-steps > strong,
  .login-page .login-steps span{
    font-size:13.5px!important;
    line-height:1.28!important;
  }
  .login-page .login-steps b{
    width:25px!important;
    height:25px!important;
    min-width:25px!important;
  }
  .login-page .support-one-line{
    margin:0 5px!important;
    font-size:12.5px!important;
    line-height:1.25!important;
  }

  .login-page .sign-in-card .field{
    margin-bottom:11px!important;
  }
  .login-page .sign-in-card label{
    margin-bottom:5px!important;
    font-size:12.5px!important;
  }
  .login-page .sign-in-card input,
  .login-page .sign-in-card select{
    min-height:44px!important;
    padding:11px 13px!important;
    font-size:14.5px!important;
  }
  .login-page .sign-in-card .form-row{
    gap:10px!important;
  }
  .login-page .sign-in-card .btn-row{
    margin-top:13px!important;
  }
  .login-page .sign-in-card .btn-row .primary{
    min-height:44px!important;
    font-size:14px!important;
  }

  .login-page .teps-action-stage-outside{
    min-height:154px!important;
    padding:13px 18px 15px!important;
  }
  .login-page .teps-action-stage-head{
    margin-bottom:7px!important;
  }
  .login-page .teps-action-stage-head > strong{
    font-size:17px!important;
  }
  .login-page .action-carousel{
    min-height:106px!important;
  }

  .login-page .header-inner{
    padding:7px 0!important;
  }
  .login-page .brand-logo{
    height:48px!important;
  }
  .login-page .footer{
    min-height:38px!important;
    padding:1px 16px!important;
  }
  .login-page .footer-inner{
    min-height:34px!important;
  }
  .login-page .footer-inner img{
    height:27px!important;
    max-height:27px!important;
  }
}


/* ===== V40: consistent Need Help line typography ===== */
@media (min-width:981px){
  .login-page .login-left-stack .support-one-line{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    margin:0 5px!important;
    padding:0!important;
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:500!important;
    color:var(--text)!important;
    white-space:nowrap!important;
  }
  .login-page .login-left-stack .support-one-line > strong:first-child{
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:750!important;
    color:var(--ink)!important;
  }
  .login-page .login-left-stack .support-one-line span,
  .login-page .login-left-stack .support-one-line a{
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:500!important;
  }
}
@media (max-width:980px){
  .login-page .support-one-line,
  .login-page .support-one-line span,
  .login-page .support-one-line a,
  .login-page .support-one-line > strong:first-child{
    font-size:13px!important;
    line-height:1.4!important;
  }
}
/* Role-aware sign-in additions */
.compact-admin-entry{min-width:92px;padding:12px 22px!important;border-radius:16px!important;font-weight:800!important}
.portal-switch{display:grid;grid-template-columns:1fr 1.65fr;gap:7px;padding:5px;margin:2px 0 18px;background:#eef6f1;border:1px solid #d4e5dc;border-radius:14px}
.portal-switch button{appearance:none;border:0;background:transparent;color:#416052;padding:11px 10px;border-radius:10px;font:inherit;font-weight:750;cursor:pointer;line-height:1.2}
.portal-switch button.active{background:#fff;color:#0a7d43;box-shadow:0 2px 12px rgba(20,70,46,.1)}
.demo-access{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin-top:14px;padding:12px 14px;border-radius:12px;background:#f5faf7;color:#466055;font-size:13px;border:1px solid #dbeae2}
.demo-access strong{color:#153126}.demo-access span{flex:1;min-width:220px}.text-button{border:0;background:transparent;color:#087c43;font:inherit;font-weight:800;text-decoration:underline;cursor:pointer;padding:2px}
.admin-login-page{min-height:100vh;background:linear-gradient(145deg,#f2f8f4,#fff 58%,#edf8f1);display:flex;flex-direction:column}
.admin-login-main{width:min(100% - 32px,520px);margin:auto;padding:40px 0 72px}
.admin-login-card{background:#fff;border:1px solid #d9e8df;border-radius:24px;box-shadow:0 22px 60px rgba(19,67,43,.12);padding:32px}
.admin-login-card .admin-mark{width:46px;height:46px;border-radius:14px;background:#e8f7ee;color:#0a8146;display:grid;place-items:center;font-weight:900;margin-bottom:18px}
.admin-login-card h2{font-size:30px;margin:0 0 8px}.admin-login-card .lead{font-size:16px;margin-bottom:24px}
.admin-role-note{margin-top:16px;padding:12px 14px;border-radius:12px;background:#f7faf8;color:#50665b;font-size:13px}
@media(max-width:650px){.portal-switch{grid-template-columns:1fr}.admin-login-card{padding:24px}.demo-access span{min-width:100%}}

/* ===== Registration, commerce and B2B entitlement flows ===== */
input[type=date]{width:100%;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:16px;padding:14px 15px;font-size:15px;font-family:inherit;outline:none}
input[type=date]:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(26,160,91,.12)}
.registration-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid #bde1ca;background:linear-gradient(135deg,#effaf3,#fff);border-radius:18px;padding:14px 16px;margin:14px 0 20px}.registration-cta strong,.registration-cta span{display:block}.registration-cta span{font-size:12px;color:var(--muted);margin-top:2px}.registration-cta .button-link{white-space:nowrap;padding:10px 14px}
.registration-shell{display:grid;grid-template-columns:minmax(310px,.72fr) minmax(580px,1.28fr);gap:28px;align-items:start;max-width:1280px}.registration-story{position:sticky;top:112px;padding:36px 16px 20px 6px}.commerce-kicker,.eyebrow-label{display:inline-block;color:var(--green-dark);font-weight:950;font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px}.registration-story h1{font-size:48px;line-height:1.02;letter-spacing:-.055em;margin:0 0 18px;color:var(--ink)}.registration-story>p{font-size:17px;color:var(--muted);max-width:540px}.access-explainer{display:grid;gap:14px;margin:30px 0}.access-explainer>div{display:grid;grid-template-columns:42px 1fr;gap:13px;align-items:start}.access-explainer strong,.access-explainer small{display:block}.access-explainer small{color:var(--muted);margin-top:3px}.access-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;font-weight:950}.access-icon.free{background:#e6f4ea;color:var(--success)}.access-icon.paid{background:#fff2d5;color:#8a5a00}.access-icon.org{background:#e9f1ff;color:#1a5fad}.commerce-trust{border-top:1px solid var(--line);padding-top:20px;display:flex;gap:8px;flex-wrap:wrap}.commerce-trust strong{width:100%;color:var(--ink)}.commerce-trust span{font-size:12px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 9px}.registration-workspace{min-height:680px}.registration-workspace>.card-body{padding:32px}.commerce-stepper{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:30px}.commerce-stepper span{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:900;color:#8a9990;border-bottom:3px solid #dfe9e2;padding:0 0 12px}.commerce-stepper span b{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border-radius:999px;background:#edf2ef}.commerce-stepper span.active{color:var(--green-dark);border-color:var(--green)}.commerce-stepper span.active b{background:var(--green);color:#fff}.consent-row{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:15px;padding:13px;background:#fbfdfb;font-weight:700}.consent-row input{margin-top:4px;accent-color:var(--green)}.commerce-main-action{width:100%;margin-top:18px;padding:15px 18px;font-size:16px}.secure-note{text-align:center;color:var(--muted);font-size:12px;margin:10px 0 0}.catalogue-welcome{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.catalogue-filter-row{display:flex;gap:7px;overflow:auto;margin:20px 0 16px;padding-bottom:3px}.catalogue-filter{box-shadow:none;background:#fff;color:var(--green-dark);border:1px solid var(--line);border-radius:999px;padding:8px 12px;white-space:nowrap}.catalogue-filter.active{background:var(--green);border-color:var(--green);color:#fff}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.product-card{border:1px solid var(--line);border-radius:20px;padding:18px;background:#fff;display:flex;flex-direction:column;min-height:260px}.product-card.featured{border-color:#98d7b0;box-shadow:inset 0 4px 0 var(--green)}.product-card-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.product-type{color:var(--green-dark);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:950}.price-pill{display:inline-flex;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:950}.price-pill.free{background:#e6f4ea;color:var(--success)}.price-pill.paid{background:#fff2d5;color:#8a5a00}.product-card h3{font-size:18px;color:var(--ink);margin:14px 0 8px}.product-card p{font-size:13px;color:var(--muted)}.product-card>small{color:var(--green-dark);font-weight:850;margin-top:auto;padding:12px 0}.product-card button{width:100%;box-shadow:none}.organisation-access-note{display:grid;grid-template-columns:auto 1fr;gap:10px;border:1px solid #c9d8ef;background:#f3f7fd;color:#31547d;border-radius:16px;padding:13px 15px;margin-top:16px;font-size:12px}.checkout-product{display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center;border:1px solid #bde1ca;background:var(--soft);border-radius:18px;padding:16px;margin:16px 0 24px}.checkout-product h3{margin:0 0 4px;color:var(--ink)}.checkout-product p{margin:0;color:var(--muted);font-size:12px}.checkout-product>strong{font-size:22px;color:var(--green-dark)}.checkout-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:22px}.checkout-layout h3,.order-summary h3{margin-top:0}.payment-method{display:flex;gap:11px;align-items:center;border:1px solid var(--line);border-radius:15px;padding:12px;margin-bottom:9px;cursor:pointer}.payment-method.selected{border-color:var(--green);background:var(--soft)}.payment-method input{accent-color:var(--green)}.payment-method strong,.payment-method small{display:block}.payment-method small{color:var(--muted)}.coupon-field{margin-top:18px}.inline-control{display:grid;grid-template-columns:1fr auto;gap:8px}.inline-control button{box-shadow:none}.order-summary{border:1px solid var(--line);border-radius:18px;padding:18px;background:#fbfdfb}.order-summary>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.order-summary .order-total{font-size:18px;border-bottom:0;padding-top:16px}.order-summary small{display:block;color:var(--muted);margin-top:8px}.purchase-success{text-align:center;padding:42px 10px}.success-mark{display:flex;align-items:center;justify-content:center;width:70px;height:70px;border-radius:999px;background:#e6f4ea;color:var(--success);font-size:34px;font-weight:950;margin:0 auto 18px}.receipt-card{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;text-align:left;border:1px solid var(--line);background:#fbfdfb;border-radius:18px;padding:16px;margin:22px auto;max-width:620px}.receipt-card span,.receipt-card strong{display:block}.receipt-card span{color:var(--muted);font-size:11px}.receipt-card strong{color:var(--ink);font-size:13px}.success-actions{justify-content:center}
.b2b-onboarding-card{border-color:#abd9bc;background:linear-gradient(145deg,#fff,#f3fbf6)}.b2b-card-head,.b2b-preview-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap}.b2b-card-head h2{font-size:27px;margin-bottom:7px}.b2b-setup-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.b2b-setup-grid .field{margin-bottom:0}.b2b-preview-empty{display:flex;flex-direction:column;align-items:center;text-align:center;border:1px dashed #aacbb6;background:rgba(255,255,255,.7);border-radius:18px;padding:24px;margin-top:18px}.b2b-preview-empty span{color:var(--muted);font-size:13px;max-width:650px;margin-top:5px}.b2b-preview{margin-top:18px}.b2b-preview h3{margin:0;color:var(--ink)}.b2b-preview .table-wrap{margin-top:13px}.b2b-preview-table{min-width:1120px}.b2b-preview-table .row-error td{background:#fff9f0}.account-library-scroll table{min-width:1450px}.table-subtle{display:block}.edit-row td input+input{margin-top:6px}
@media(max-width:1000px){.registration-shell{grid-template-columns:1fr}.registration-story{position:static;padding:12px 8px}.registration-story h1{font-size:40px}.b2b-setup-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.registration-workspace>.card-body{padding:21px}.registration-story h1{font-size:36px}.product-grid,.checkout-layout,.receipt-card,.b2b-setup-grid{grid-template-columns:1fr}.catalogue-welcome,.registration-cta{align-items:stretch;flex-direction:column}.registration-cta .button-link{width:100%}.checkout-product{grid-template-columns:1fr}.commerce-stepper span{font-size:10px;gap:4px}.organisation-access-note{grid-template-columns:1fr}.b2b-card-head h2{font-size:23px}}
.account-login-options{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:4px 0 2px;font-size:12px;color:var(--muted)}.account-login-options label{display:flex;align-items:center;gap:8px;margin:0;color:var(--muted);font-weight:750}.account-login-options input{accent-color:var(--green)}.identity-login-button{width:100%;font-size:16px}.catalogue-account-badges{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.credit-balance-pill{display:inline-flex;gap:5px;align-items:center;border:1px solid #c9d8ef;background:#f3f7fd;color:#31547d;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:850}.credit-balance-pill b{font-size:14px}.price-pill.paid{max-width:180px;text-align:center;line-height:1.25}
@media(max-width:700px){.account-login-options{align-items:flex-start;flex-direction:column}.catalogue-account-badges{justify-content:flex-start}}


/* ===== TEPS Assessment public explore flow ===== */
.explore-page{background:#f7faf8;color:var(--ink)}
.explore-header{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.explore-header .header-inner{width:min(1440px,calc(100% - 36px));gap:24px}
.explore-header .brand{min-width:220px}
.explore-tabs{display:flex;align-items:center;justify-content:center;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none}
.explore-tab{border:0;background:transparent;color:var(--muted);padding:10px 13px;border-radius:999px;box-shadow:none;font-size:13px;font-weight:800;white-space:nowrap}
.explore-tab:hover,.explore-tab.active{background:var(--soft);color:var(--green-dark);transform:none}
.explore-main{min-height:calc(100vh - 150px)}
.explore-panel{display:none}.explore-panel.active{display:block}
.explore-hero-wrap{width:min(1380px,calc(100% - 44px));margin:38px auto 26px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(330px,.7fr);gap:24px;align-items:stretch}
.explore-hero-copy{border:1px solid #d8e8de;border-radius:30px;padding:clamp(34px,5vw,72px);background:radial-gradient(circle at 0 0,#e9f9ef 0,transparent 42%),linear-gradient(145deg,#fff 0%,#f7fcf9 100%);box-shadow:0 18px 55px rgba(15,127,69,.08)}
.explore-kicker,.section-heading>span{display:inline-flex;color:var(--green-dark);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.explore-hero-copy h2{font-size:clamp(42px,5.4vw,76px);line-height:1.02;letter-spacing:-.055em;max-width:900px;margin:18px 0 20px}
.explore-hero-copy>p{font-size:18px;line-height:1.65;max-width:760px;color:var(--muted);margin:0}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.hero-actions button{padding:14px 18px}
.hero-proof{display:flex;gap:8px;flex-wrap:wrap;margin-top:32px}.hero-proof span{border:1px solid var(--line);background:#fff;padding:8px 11px;border-radius:999px;font-size:12px;font-weight:750;color:#506158}
.assessment-spotlight{border-radius:30px;padding:28px;background:linear-gradient(160deg,#0f7f45 0%,#1aa05b 100%);color:#fff;box-shadow:0 20px 55px rgba(15,127,69,.22);display:flex;flex-direction:column;align-items:flex-start}
.spotlight-date{display:flex;align-items:center;gap:10px;margin-bottom:26px}.spotlight-date strong{font-size:58px;line-height:.85}.spotlight-date span{font-size:13px;font-weight:900;line-height:1.1;opacity:.78}
.assessment-spotlight .status-pill{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);color:#fff}.assessment-spotlight h3{
  font-size:30px;
  line-height:1.1;
  margin:18px 0 9px;
  color:#fff;
}.assessment-spotlight p{margin:0;color:rgba(255,255,255,.78)}
.spotlight-price{margin-top:auto;padding:28px 0 16px}.spotlight-price strong,.spotlight-price span{display:block}.spotlight-price strong{font-size:30px}.spotlight-price span{font-size:13px;opacity:.78;margin-top:3px}
.assessment-spotlight button{width:100%;background:#fff;color:var(--green-dark);border-color:#fff}.assessment-spotlight small{margin-top:12px;opacity:.72;line-height:1.4}
.explore-section{width:min(1320px,calc(100% - 44px));margin:48px auto 60px}.explore-section.compact{margin-top:24px}.section-heading{max-width:820px;margin-bottom:24px}.section-heading h2,.section-heading h3{font-size:clamp(30px,3.6vw,50px);letter-spacing:-.04em;line-height:1.08;margin:9px 0}.section-heading p{color:var(--muted);font-size:16px;line-height:1.6}.split-heading{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.split-heading>div:first-child{max-width:820px}.date-chip{min-width:140px;border:1px solid var(--line);border-radius:22px;padding:18px;background:#fff;text-align:center}.date-chip strong,.date-chip small{display:block}.date-chip strong{font-size:26px;color:var(--green-dark)}
.explore-card-grid{display:grid;gap:16px}.explore-card-grid.four{grid-template-columns:repeat(4,1fr)}.explore-card-grid.three{grid-template-columns:repeat(3,1fr)}
.explore-card,.credit-action-card,.feature-card{border:1px solid var(--line);background:#fff;border-radius:24px;padding:24px;box-shadow:0 8px 28px rgba(18,54,35,.05)}.explore-card h3,.explore-card h4,.credit-action-card h3,.feature-card h3{margin:14px 0 8px;font-size:20px}.explore-card p,.credit-action-card p,.feature-card p{color:var(--muted);line-height:1.55;margin:0}.mini-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--soft);color:var(--green-dark);font-weight:900;font-size:12px}
.assessment-detail-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}.feature-card.large{padding:30px}.feature-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}.feature-list>div{border:1px solid var(--line);background:#f9fcfa;border-radius:16px;padding:16px}.feature-list b,.feature-list span{display:block}.feature-list b{color:var(--green-dark);margin-bottom:4px}.feature-list span{color:var(--muted);font-size:13px}.credit-badge,.earn-pill,.content-type{display:inline-flex;padding:6px 9px;border-radius:999px;background:var(--soft);color:var(--green-dark);font-size:11px;font-weight:900}.price-row{display:flex;align-items:end;justify-content:space-between;gap:10px;margin:22px 0}.price-row strong{font-size:30px}.price-row span{font-size:13px;color:var(--muted)}.full{width:100%}
.credit-summary-public{display:flex;justify-content:space-between;align-items:center;gap:18px;border:1px solid #b9dbc5;background:linear-gradient(135deg,#effaf3,#fff);border-radius:24px;padding:22px 24px;margin-bottom:18px}.credit-summary-public span,.credit-summary-public strong{display:block}.credit-summary-public span{font-size:12px;color:var(--muted);font-weight:750}.credit-summary-public strong{font-size:28px;margin-top:2px;color:var(--green-dark)}
.credit-pack-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}.credit-pack-row article{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;border:1px solid var(--line);border-radius:20px;padding:20px;background:#fff}.credit-pack-row article.recommended{border-color:#9fd0b0;background:#f4fbf7}.credit-pack-row span,.credit-pack-row h3{display:block;margin:0}.credit-pack-row span{font-size:11px;color:var(--muted)}.credit-pack-row h3{font-size:18px}.credit-pack-row>article>strong{font-size:22px;color:var(--green-dark)}
.media-card{min-height:220px;display:flex;flex-direction:column}.media-card .meta-line{margin-top:auto;padding-top:20px;color:var(--green-dark);font-size:12px;font-weight:850}
.journey-public{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.journey-public>div{border:1px solid var(--line);border-radius:20px;background:#fff;padding:20px}.journey-public b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff}.journey-public h3{margin:18px 0 8px}.journey-public p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.centre-cta{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:28px}
@media(max-width:1050px){.explore-tabs{order:3;flex-basis:100%;justify-content:flex-start;padding-bottom:4px}.explore-header .header-inner{flex-wrap:wrap;padding-bottom:10px}.explore-hero-wrap{grid-template-columns:1fr}.explore-card-grid.four{grid-template-columns:repeat(2,1fr)}.journey-public{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.explore-header .brand-title p{display:none}.explore-header .brand{min-width:0}.explore-hero-wrap,.explore-section{width:min(100% - 22px,1320px)}.explore-hero-wrap{margin-top:16px}.explore-hero-copy{padding:30px 22px}.explore-hero-copy h2{font-size:42px}.assessment-spotlight{padding:24px}.explore-card-grid.four,.explore-card-grid.three,.assessment-detail-grid,.credit-pack-row,.journey-public{grid-template-columns:1fr}.feature-list{grid-template-columns:1fr}.split-heading{align-items:flex-start;flex-direction:column}.credit-pack-row article{grid-template-columns:1fr auto}.credit-pack-row button{grid-column:1/-1}.credit-summary-public{align-items:flex-start;flex-direction:column}}
/* TEPS Assessment teacher account */
.teacher-app{background:#f5faf7;color:#173d2a}.app-shell-v2{min-height:100vh;display:grid;grid-template-columns:260px 1fr}.teacher-sidebar{background:#168f51;color:#fff;padding:20px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;max-height:100vh;z-index:40;box-sizing:border-box}.teacher-brand{display:block;color:#fff;text-decoration:none;flex-shrink:0}.teps-sidebar-brand{padding:0 0 16px}.teps-sidebar-brand img{width:100%;height:auto;max-height:60px;object-fit:contain;background:#fff;border-radius:12px;padding:8px 12px;display:block;box-sizing:border-box}.teacher-brand strong{font-size:18px}.teacher-sidebar nav{display:flex;flex-direction:column;gap:clamp(5px,0.9vh,8px);flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:2px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}.teacher-sidebar nav::-webkit-scrollbar{width:4px}.teacher-sidebar nav::-webkit-scrollbar-track{background:transparent}.teacher-sidebar nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25);border-radius:4px}.teacher-sidebar nav::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.45)}.teacher-sidebar nav button,.sidebar-foot button,.sidebar-foot a{border:0;background:transparent;color:#fff;text-align:left;justify-content:flex-start;padding:clamp(9px,1.2vh,12px) 14px;border-radius:10px;font:inherit;font-size:14.5px;font-weight:500;line-height:1.4;text-decoration:none;cursor:pointer;transition:background .15s ease,color .15s ease;display:flex;align-items:center;width:100%;box-sizing:border-box}.teacher-sidebar nav button:hover,.sidebar-foot button:hover,.sidebar-foot a:hover{background:rgba(255,255,255,.16);color:#fff}.teacher-sidebar nav button.active{background:rgba(255,255,255,.24);font-weight:700;color:#fff;box-shadow:0 1px 4px rgba(0,0,0,.08)}.sidebar-foot{flex-shrink:0;margin-top:auto;border-top:1px solid rgba(255,255,255,.22);padding-top:14px;display:flex;flex-direction:column;gap:6px}@media(max-height:760px){.teacher-sidebar{padding:14px 12px}.teps-sidebar-brand{padding-bottom:10px}.teps-sidebar-brand img{max-height:50px;padding:6px 10px}.teacher-sidebar nav{gap:4px}.teacher-sidebar nav button,.sidebar-foot button,.sidebar-foot a{padding:8px 12px;font-size:13.5px}.sidebar-foot{padding-top:10px;gap:4px}}@media(max-height:600px){.teacher-sidebar{padding:10px 10px}.teps-sidebar-brand{padding-bottom:6px}.teps-sidebar-brand img{max-height:42px;padding:4px 8px}.teacher-sidebar nav{gap:3px}.teacher-sidebar nav button,.sidebar-foot button,.sidebar-foot a{padding:6px 10px;font-size:13px}.sidebar-foot{padding-top:8px;gap:3px}}.teacher-main{min-width:0}.teacher-topbar{height:72px;background:#fff;border-bottom:1px solid #dcebe2;display:flex;align-items:center;padding:0 28px;gap:16px;position:sticky;top:0;z-index:30}.teacher-topbar>div:nth-child(2){display:grid}.teacher-topbar small,.top-balance span{font-size:12px;color:#5f7669}.top-balance{margin-left:auto;display:flex;align-items:center;gap:8px;background:#eff8f2;border:1px solid #d6eadc;border-radius:999px;padding:8px 12px}.top-balance strong{color:#0f7f45}.mobile-nav-toggle{display:none;border:0;background:#eff8f2;border-radius:8px;padding:8px 10px}.teacher-content{padding:30px;max-width:1240px;width:100%;margin:auto}.loading-card,.empty-state,.error-state{background:#fff;border:1px solid #dcebe2;border-radius:16px;padding:28px}.page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}.page-heading span,.section-title span,.next-action-card>span,.card-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#0f7f45;font-weight:700}.page-heading h1{margin:5px 0 4px;font-size:30px;color:#173d2a}.page-heading p{margin:0;color:#61766b}.journey-track{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:20px 0 24px}.journey-step{background:#fff;border:1px solid #dcebe2;padding:12px 8px;border-radius:12px;text-align:center;color:#74877c;font-size:12px}.journey-step span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;margin:0 auto 6px;background:#edf3ef}.journey-step.current{border-color:#1aa05b;background:#effaf4;color:#0f7f45}.journey-step.current span,.journey-step.done span{background:#1aa05b;color:#fff}.journey-step.done{color:#0f7f45}.dashboard-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px;margin-bottom:18px}.next-action-card,.mini-stat,.featured-account-card,.account-section,.prep-card,.resource-grid article,.help-grid article,.result-card,.result-status-card,.safe-note{background:#fff;border:1px solid #dcebe2;border-radius:16px;box-shadow:0 5px 18px rgba(26,90,55,.05)}.next-action-card{padding:24px}.next-action-card h2{margin:8px 0}.next-action-card p{color:#61766b;max-width:680px}.mini-stat{padding:20px;display:flex;flex-direction:column;gap:8px}.mini-stat>span{color:#61766b}.mini-stat>strong{font-size:30px;color:#0f7f45}.mini-stat progress{width:100%;accent-color:#1aa05b}.featured-account-card{padding:24px;margin:18px 0}.featured-account-card h2{margin:6px 0 4px}.featured-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.featured-row p{color:#61766b}.status-chip{white-space:nowrap;background:#eff8f2;color:#0f7f45;border:1px solid #cfe8d7;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:700}.assessment-facts{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}.assessment-facts span,.detail-grid>div{background:#f7fbf8;border:1px solid #e2eee6;border-radius:11px;padding:12px 14px;display:grid;gap:3px;min-width:160px}.assessment-facts small,.detail-grid span{color:#65796d}.primary-next{display:flex;gap:10px}.account-section{padding:22px;margin:18px 0}.section-title{display:flex;justify-content:space-between}.resource-grid,.prep-grid,.help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.resource-grid article,.prep-card,.help-grid article{padding:20px}.resource-grid h3,.prep-card h3{margin:9px 0}.content-type{display:inline-flex;background:#eef7f1;color:#0f7f45;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:700}.prep-card.complete{border-color:#9fd0af}.complete-label{color:#0f7f45}.earn-pill{display:inline-flex;margin-left:6px;background:#fff4d8;color:#745300;border-radius:999px;padding:5px 8px;font-size:11px}.safe-note{padding:18px;margin-top:18px}.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.credit-summary{display:grid;grid-template-columns:repeat(2,minmax(180px,260px));gap:12px}.credit-summary>div{background:#168f51;color:#fff;border-radius:16px;padding:20px;display:grid;gap:5px}.credit-summary strong{font-size:34px}.tabbed-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.credit-rule-list,.credit-pack-list{display:grid;gap:10px}.credit-rule-list article,.credit-pack-list article{border:1px solid #e0ece4;border-radius:12px;padding:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}.credit-rule-list article>div{display:flex;align-items:center;gap:10px}.credit-rule-list article>div>strong{background:#1aa05b;color:#fff;width:34px;height:34px;display:grid;place-items:center;border-radius:50%}.responsive-table{overflow:auto}.responsive-table table{width:100%;border-collapse:collapse}.responsive-table th,.responsive-table td{padding:11px;border-bottom:1px solid #e3eee7;text-align:left}.responsive-table th{font-size:12px;color:#61766b}.profile-form{background:#fff;border:1px solid #dcebe2;border-radius:16px;padding:24px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.profile-form .form-actions{grid-column:1/-1}.progress-badge{background:#eff8f2;border:1px solid #d0e7d8;color:#0f7f45;padding:8px 12px;border-radius:999px}.result-card{padding:26px;max-width:680px}.result-card>div{display:inline-grid;margin-right:30px}.result-card>div strong{font-size:28px;color:#0f7f45}.result-status-card{padding:24px;display:grid;grid-template-columns:160px 1fr;gap:10px;max-width:720px}
@media(max-width:900px){.app-shell-v2{display:block}.teacher-sidebar{position:fixed;top:0;bottom:0;left:-290px;width:280px;height:100vh;max-height:100vh;overflow-y:auto;overflow-x:hidden;transition:left .25s ease;z-index:50;padding:20px 16px}.teacher-sidebar.open{left:0}.mobile-nav-toggle{display:block}.teacher-content{padding:20px}.journey-track{grid-template-columns:repeat(3,1fr)}.dashboard-grid,.resource-grid,.prep-grid,.help-grid,.tabbed-two,.detail-grid{grid-template-columns:1fr 1fr}.profile-form{grid-template-columns:1fr}}
@media(max-width:620px){.teacher-content{padding:16px}.teacher-topbar{padding:0 14px}.page-heading{display:block}.page-heading h1{font-size:25px}.journey-track{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.resource-grid,.prep-grid,.help-grid,.tabbed-two,.detail-grid,.credit-summary{grid-template-columns:1fr}.featured-row{display:block}.status-chip{display:inline-flex;margin-top:8px}.assessment-facts{display:grid;grid-template-columns:1fr}.assessment-facts span{min-width:0}.profile-form{padding:17px}.result-status-card{grid-template-columns:1fr}.responsive-table table{min-width:620px}}

/* ===== TEPS Platform v2 additions ===== */
.teps-generic-logo{height:66px;max-width:245px}.teps-main-brand{min-width:230px}
.assessment-spotlight h3{color:#fff!important}.coin-badge,.earn-label{display:inline-flex;border-radius:999px;padding:6px 9px;background:#e8f7ee;color:var(--green-dark);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.journey-four .explore-card{min-height:190px}.course-library-section.inner{margin-top:34px}.course-filters{display:grid;grid-template-columns:minmax(240px,1.4fr) minmax(180px,.7fr) minmax(210px,.9fr);gap:12px;margin-bottom:18px}.course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.course-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;display:flex;flex-direction:column;min-height:285px;box-shadow:0 8px 26px rgba(18,54,35,.05)}.course-card h3{font-size:18px;margin:14px 0 7px;color:var(--ink);line-height:1.25}.course-card p{color:var(--muted);font-size:13px}.course-card-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.course-card-top small{color:var(--muted)}.course-price{margin-top:auto;padding:18px 0 12px;display:flex;justify-content:space-between;gap:10px;align-items:end}.course-price strong{color:var(--green-dark)}.course-price span{font-size:13px;color:var(--muted)}.full{width:100%}
.coin-earn-public{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin:22px 0}.coin-earn-public article{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px}.coin-earn-public h3{color:var(--ink);font-size:17px;margin:13px 0 8px}.coin-earn-public strong{color:var(--green-dark);font-size:13px}.coin-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:28px 0}.coin-flow article{border-radius:18px;padding:19px;background:#fff;border:1px solid var(--line)}.coin-flow b{font-size:17px;color:var(--ink)}.coin-flow p{font-size:13px;color:var(--muted);margin-top:8px}.free-resource-public{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.resource-preview-card,.resource-completion-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px}.resource-preview-card h3,.resource-completion-card h3{color:var(--ink);margin:13px 0 7px}.resource-preview-card p,.resource-completion-card p{color:var(--muted)}
.modal-overlay{position:fixed;inset:0;background:rgba(8,24,15,.48);display:grid;place-items:center;padding:18px;z-index:100}.modal-card{width:min(620px,100%);background:#fff;border-radius:24px;padding:30px;box-shadow:0 30px 80px rgba(0,0,0,.24);position:relative}.compact-modal{max-width:520px}.modal-close{position:absolute;right:13px;top:13px;background:#f1f6f3;color:var(--ink);border-radius:50%;width:36px;height:36px;padding:0;font-size:23px}
.registration-container{max-width:1260px}.consent-row{display:flex!important;gap:9px;align-items:flex-start;margin:10px 0 16px;font-size:13px}.consent-row input{margin-top:4px}.purchase-focus{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:var(--shadow)}.purchase-focus>h2{margin-top:10px}.purchase-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}.purchase-options article{border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:8px;background:#fbfdfb}.purchase-options article>span{font-size:12px;color:var(--muted);font-weight:800}.purchase-options article>strong{font-size:27px;color:var(--ink)}.purchase-options article>small{color:var(--muted);min-height:38px}.purchase-options button:disabled{opacity:.48;cursor:not-allowed;transform:none}
.teps-one-card{background:linear-gradient(145deg,#fff,#f2fbf6);border:1px solid #bfe2cc;border-radius:20px;padding:23px;margin:18px 0;box-shadow:0 6px 18px rgba(26,90,55,.05)}.teps-one-card.complete{background:#effaf4}.teps-one-head{display:flex;justify-content:space-between;gap:10px;color:var(--green-dark);font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.05em}.teps-one-card h3{color:var(--ink);font-size:21px;margin:14px 0}.teps-one-options{display:grid;gap:8px;margin:15px 0}.teps-one-option{justify-content:flex-start;text-align:left;background:#fff;color:var(--text);border:1px solid var(--line);font-weight:700}.teps-one-option:hover{border-color:var(--green);background:#f4fbf7}.resource-completion-card details{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.resource-completion-card summary{cursor:pointer;color:var(--green-dark);font-weight:850}.resource-completion-card textarea{min-height:68px;margin:8px 0}.resource-body{margin:12px 0;padding:12px;background:#f7fbf8;border-radius:12px;white-space:pre-wrap;font-size:13px}.leaderboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.leader-list{display:grid;margin-top:14px}.leader-list>div{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.rank-num{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:#f6c33e;color:#3a3218;font-weight:900}.leader-list>div:nth-child(2) .rank-num{background:#c7d0d6}.leader-list>div:nth-child(3) .rank-num{background:#d49a60}.leader-list em{font-style:normal;color:var(--green-dark);font-weight:900}.faq-list{display:grid;gap:10px;max-width:900px}.faq-list details{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px}.faq-list summary{cursor:pointer;color:var(--ink);font-weight:850}.faq-list p{margin:11px 0 0;color:var(--muted)}.profile-wide{grid-column:1/-1}.profile-form input[type=date]{width:100%;border:1px solid var(--line);background:#fff;border-radius:15px;padding:13px 14px;font-size:15px;font-family:inherit}.profile-form input[type=checkbox]{accent-color:var(--green)}
@media(max-width:1050px){.course-grid{grid-template-columns:repeat(2,1fr)}.coin-earn-public{grid-template-columns:repeat(3,1fr)}.coin-flow{grid-template-columns:repeat(2,1fr)}.free-resource-public{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.teps-generic-logo{height:54px}.course-filters,.course-grid,.coin-earn-public,.coin-flow,.free-resource-public,.purchase-options,.leaderboard-grid{grid-template-columns:1fr}.course-card{min-height:0}.teps-one-head{display:grid}.profile-wide{grid-column:auto}}
.account-actions{margin-top:0;gap:7px}.account-actions button{padding:8px 10px;font-size:12px}

/* ===== TEPS Platform V3: official brand lock-up + staged verification ===== */
.teps-generic-logo{height:74px;max-width:285px}
.teps-main-brand{min-width:250px}
.assessment-spotlight h3{color:#fff!important}
.mobile-verification-gate{border:1px solid #b7dec4;background:#f4fbf6;border-radius:18px;padding:18px;margin:16px 0;display:grid;gap:12px}
.mobile-verification-gate h3{margin:0;color:var(--ink)}
.mobile-verification-gate p{margin:0;color:var(--muted);line-height:1.5}
.mobile-verification-gate .field{margin:0}
.mobile-verification-gate .btn-row{margin:0;align-items:center}
.verification-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800;background:#eff8f2;color:var(--green-dark);border:1px solid #cfe8d7}
@media(max-width:760px){.teps-generic-logo{height:60px;max-width:230px}.teps-main-brand{min-width:0}}

/* TEPS V3.3 journey refinement */
.hero-secondary-path{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:20px;color:var(--muted)}
.hero-secondary-path button,.hero-secondary-path a{border:0;background:transparent;color:var(--green-dark);font:inherit;font-weight:800;text-decoration:none;padding:0;cursor:pointer}
.intention-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.intention-grid button{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;text-align:left;color:var(--ink);font-weight:800}.intention-grid button:hover,.intention-grid button.selected{border-color:var(--green);background:var(--soft);color:var(--green-dark)}
.intention-section p{margin:4px 0 0}.required-pill{display:inline-flex;margin-left:6px;background:#eef3ff;color:#3557a6;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:800}
.activity-feed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.activity-feed article{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:start;border:1px solid var(--line);border-radius:14px;padding:14px;background:#fff}.feed-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--soft);font-size:20px}.activity-feed p{margin:3px 0;color:var(--muted)}.activity-feed small{color:var(--muted)}
.reorder-row{display:grid;grid-template-columns:60px 1fr;gap:10px;align-items:center;margin:8px 0}.reorder-row input{padding:9px;border:1px solid var(--line);border-radius:10px}.device-check-list{display:grid;gap:8px;margin:16px 0}.device-check-list>div{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:11px;background:#fbfffd}.device-check-list strong{color:var(--green-dark)}
.purchase-modal{max-width:760px}.purchase-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}.purchase-options article{border:1px solid var(--line);border-radius:16px;padding:18px;background:#fff;display:grid;gap:8px}.purchase-options strong{font-size:24px;color:var(--green-dark)}
.optional-profile{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fbfdfb}.optional-profile summary{font-weight:850;cursor:pointer;color:var(--green-dark)}.optional-profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.optional-label{font-size:11px;color:var(--muted);font-weight:700}.otp-resend-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0}.text-button{border:0;background:transparent;color:var(--green-dark);font-weight:850;cursor:pointer}.text-button:disabled{opacity:.45;cursor:not-allowed}.simple-signup .registration-workspace{min-height:auto}.narrow-auth{max-width:680px;padding-top:56px;padding-bottom:56px}.policy-page{max-width:900px;padding-top:36px;padding-bottom:60px}.policy-page h1{font-size:40px;margin:8px 0 20px}.policy-page h2{margin-top:28px}.footer-links{margin-left:auto;display:flex;gap:14px}.footer-links a{color:inherit}.account-login-options{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.account-login-options>a{color:var(--green-dark);font-weight:800}
fieldset{border:1px solid var(--line);border-radius:14px;padding:14px;margin:14px 0}fieldset legend{font-weight:850;color:var(--ink);padding:0 6px}fieldset label{display:block;padding:7px 0}
@media(max-width:900px){.intention-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.activity-feed{grid-template-columns:1fr}.purchase-options{grid-template-columns:1fr}.optional-profile-grid{grid-template-columns:1fr}}
@media(max-width:560px){.intention-grid{grid-template-columns:1fr}.hero-secondary-path{align-items:flex-start;flex-direction:column}.footer-links{width:100%;margin-left:0}.account-login-options{align-items:flex-start;flex-direction:column}}

/* ===== Dashboard Overview & Registration Modern Layout ===== */
.welcome-banner{background:linear-gradient(135deg,rgba(26,160,91,.09),rgba(26,160,91,.02));border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px;margin-bottom:22px}
.welcome-kicker{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--green-dark);display:block;margin-bottom:4px}
.teacher-id-tag{margin:6px 0 0;font-size:14px;color:var(--muted)}
.teacher-id-tag strong{color:var(--ink);font-size:17px;letter-spacing:.02em}
.dashboard-top-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;margin-bottom:24px}
.dashboard-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;display:flex;flex-direction:column;box-shadow:0 2px 8px rgba(0,0,0,0.03)}
.card-head-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.card-head-row h3{margin:0;font-size:20px;color:var(--ink);font-weight:800}
.completion-badge{font-size:13px;font-weight:700;color:var(--green-dark);background:var(--soft);padding:4px 10px;border-radius:999px;border:1px solid #c9ead6}
.completion-badge.complete{background:#e8f7ee;color:#14703e;border-color:#b4e5c7}
.status-badge{font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;letter-spacing:.02em}
.status-badge.active{background:#e8f7ee;color:#14703e;border:1px solid #b4e5c7}
.status-badge.pending{background:#fff8e6;color:#a06a00;border:1px solid #f6deb2}
.progress-bar-wrap{margin:8px 0 14px}
.progress-bar-wrap progress{width:100%;height:10px;border-radius:999px;accent-color:var(--green)}
.card-subtext{font-size:14px;color:var(--muted);line-height:1.5;margin-bottom:18px;flex:1}
.registration-bullet-list{list-style:none;padding:0;margin:10px 0 16px;display:flex;flex-direction:column;gap:8px}
.registration-bullet-list li{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;border-bottom:1px dashed var(--line);padding-bottom:6px}
.registration-bullet-list li:last-child{border-bottom:none;padding-bottom:0}
.registration-bullet-list .bullet-label{color:var(--muted);font-weight:600}
.registration-bullet-list .bullet-val{color:var(--ink);font-weight:700;text-align:right}
.registration-bullet-list .status-confirmed{color:#14703e}
.registration-summary-box{background:#f8fcfa;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:16px}
.registration-modal-content{max-width:540px;margin:0 auto}
.registration-modal-content h2{margin:4px 0 10px;font-size:24px}
.modal-subtext{font-size:14px;color:var(--muted);margin-bottom:18px;line-height:1.5}
.field-hint{font-size:12px;color:var(--muted);margin-top:4px;display:block}
.assessment-info-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.info-pill{background:var(--soft);border:1px solid #c9ead6;border-radius:10px;padding:10px 12px;font-size:13px;color:var(--ink)}
.info-pill strong{color:var(--green-dark);display:block;font-size:12px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}

/* ===== Assessment Registration Wizard ===== */
.reg-page{min-height:100vh;background:var(--bg);display:flex;flex-direction:column}
.reg-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding:14px 0}
.reg-header-inner{width:min(1160px,calc(100% - 40px));margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.reg-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.reg-brand img{height:44px;width:auto}
.reg-back{font-size:14px;font-weight:850;color:var(--muted);text-decoration:none;display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px 14px;cursor:pointer;transition:.15s ease}
.reg-back:hover{border-color:var(--green);color:var(--green-dark)}

.reg-body{flex:1;width:min(1160px,calc(100% - 40px));margin:32px auto 48px;display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start}
.reg-body.no-sidebar{grid-template-columns:1fr;max-width:680px;margin-left:auto;margin-right:auto}

.wizard-progress{display:flex;gap:0;margin-bottom:28px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.wizard-step-dot{flex:1;padding:13px 8px;text-align:center;font-size:12px;font-weight:900;color:var(--muted);border-right:1px solid var(--line);transition:.2s ease}
.wizard-step-dot:last-child{border-right:0}
.wizard-step-dot.done{background:#e8f7ed;color:var(--green-dark)}
.wizard-step-dot.active{background:var(--green);color:#fff}
.wizard-step-dot .dot-num{display:block;font-size:17px;font-weight:950;margin-bottom:2px}
.wizard-step-dot .dot-lbl{display:block;font-size:11px;font-weight:700;letter-spacing:.02em}

.reg-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px}
.reg-card h2{margin:0 0 6px;font-size:26px;color:var(--ink)}
.reg-card .reg-subtitle{color:var(--muted);font-size:14px;margin-bottom:24px}
.reg-card .reg-kicker{display:block;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:var(--green-dark);margin-bottom:6px}

/* Persona cards (Step 1) */
.persona-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
.persona-card{border:2px solid var(--line);border-radius:20px;padding:26px 22px;cursor:pointer;transition:.15s ease;background:#fff;text-align:center;position:relative}
.persona-card:hover:not(.disabled){border-color:var(--green);background:var(--soft);transform:translateY(-2px)}
.persona-card.selected{border-color:var(--green);background:var(--soft)}
.persona-card.disabled{opacity:.5;cursor:default}
.persona-card .persona-icon{font-size:36px;display:block;margin-bottom:10px}
.persona-card h3{margin:0 0 6px;font-size:18px;color:var(--ink)}
.persona-card p{margin:0;font-size:13px;color:var(--muted)}
.persona-card .coming-soon{position:absolute;top:10px;right:10px;background:#fff7dd;color:var(--warning);border:1px solid #f0deaa;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:850}

/* Grade band cards (Step 2) */
.grade-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:8px}
.grade-card{border:2px solid var(--line);border-radius:18px;padding:20px 18px;cursor:pointer;transition:.15s ease;background:#fff}
.grade-card:hover{border-color:var(--green);background:var(--soft)}
.grade-card.selected{border-color:var(--green);background:var(--soft)}
.grade-card h3{margin:0 0 4px;font-size:16px;color:var(--ink)}
.grade-card p{margin:0;font-size:13px;color:var(--muted)}

/* Subject list (Step 3) */
.subject-list{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.subject-btn{border:2px solid var(--line);border-radius:16px;padding:15px 18px;cursor:pointer;background:#fff;text-align:left;font-size:15px;font-weight:700;color:var(--ink);transition:.15s ease}
.subject-btn:hover{border-color:var(--green);background:var(--soft)}
.subject-btn.selected{border-color:var(--green);background:var(--soft)}
.recognition-display{margin-top:20px;background:linear-gradient(135deg,#e8f7ed,#f4fbf6);border:1px solid #b8dfc3;border-radius:16px;padding:16px 18px}
.recognition-display .rec-label{font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:var(--green-dark);margin-bottom:4px}
.recognition-display .rec-name{font-size:17px;font-weight:900;color:var(--ink)}
.recognition-display .rec-note{font-size:12px;color:var(--muted);margin-top:4px}

/* Special Recognitions (Step 4) */
.sr-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.sr-card{border:2px solid var(--line);border-radius:16px;padding:14px 16px;cursor:pointer;display:flex;align-items:center;gap:12px;background:#fff;transition:.15s ease;position:relative}
.sr-card:hover{border-color:var(--green);background:#fbfffd}
.sr-card.selected{border-color:var(--green);background:var(--soft)}
.sr-card .sr-check{width:20px;height:20px;border:2px solid var(--line);border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:.15s ease}
.sr-card.selected .sr-check{background:var(--green);border-color:var(--green);color:#fff}
.sr-card .sr-check::after{content:'✓';font-size:12px;font-weight:900;display:none}
.sr-card.selected .sr-check::after{display:block}
.sr-card .sr-text{font-size:14px;font-weight:750;color:var(--ink);line-height:1.3}
.sr-count-note{margin-top:14px;font-size:13px;color:var(--muted);padding:10px 14px;background:#f7faf8;border-radius:12px;border:1px solid var(--line)}

/* Slot cards (Step 5) */
.slot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}
.slot-card{border:2px solid var(--line);border-radius:18px;padding:22px 16px;cursor:pointer;text-align:center;background:#fff;transition:.15s ease}
.slot-card:hover{border-color:var(--green);background:var(--soft)}
.slot-card.selected{border-color:var(--green);background:var(--soft)}
.slot-card .slot-time{font-size:22px;font-weight:950;color:var(--ink);display:block;margin-bottom:4px}
.slot-card .slot-tz{font-size:12px;color:var(--muted);display:block}

/* Live summary sidebar */
.reg-sidebar{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;position:sticky;top:90px}
.reg-sidebar h3{font-size:14px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:var(--green-dark);margin:0 0 16px}
.reg-sidebar-title{font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:2px}
.reg-sidebar-val{font-size:15px;font-weight:750;color:var(--ink);margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.reg-sidebar-val:last-of-type{border-bottom:0;margin-bottom:0;padding-bottom:0}
.reg-sidebar-val em{color:var(--muted);font-style:normal;font-size:13px}
.reg-price-block{margin-top:16px;padding-top:16px;border-top:2px solid var(--line)}
.reg-price-row{display:flex;justify-content:space-between;font-size:14px;color:var(--muted);margin-bottom:6px}
.reg-price-total{display:flex;justify-content:space-between;font-size:18px;font-weight:950;color:var(--ink);margin-top:8px}

/* Review step */
.review-grid{display:grid;gap:14px;margin-top:8px}
.review-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.review-row:last-child{border-bottom:0}
.review-row .rv-label{color:var(--muted);font-weight:700;flex-shrink:0;min-width:160px}
.review-row .rv-val{font-weight:750;color:var(--ink);text-align:right}
.review-price-box{background:linear-gradient(135deg,#e8f7ed,#f4fbf6);border:1px solid #b8dfc3;border-radius:18px;padding:20px 22px;margin-top:18px}
.review-price-row{display:flex;justify-content:space-between;font-size:14px;color:var(--muted);margin-bottom:8px}
.review-price-total{display:flex;justify-content:space-between;font-size:22px;font-weight:950;color:var(--ink);margin-top:10px;padding-top:10px;border-top:1px solid #b8dfc3}

/* Payment step */
.payment-box{border:1px solid var(--line);border-radius:20px;padding:24px;margin-top:16px;background:#fff}
.payment-amount{font-size:40px;font-weight:950;color:var(--ink);margin:10px 0}
.payment-amount span{font-size:22px;font-weight:700;color:var(--muted)}
.mock-payment-note{background:#fff7dd;border:1px solid #f0deaa;border-radius:14px;padding:12px 16px;font-size:13px;color:var(--warning);margin-bottom:20px}

/* Confirmed step */
.confirmed-box{text-align:center;padding:20px 0}
.confirmed-icon{font-size:56px;display:block;margin-bottom:16px}
.confirmed-box h2{font-size:28px;color:var(--green-dark)}
.confirmed-box p{color:var(--muted);font-size:15px}
.confirmed-details{text-align:left;margin-top:24px;border:1px solid var(--line);border-radius:18px;overflow:hidden}
.confirmed-row{display:flex;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line);font-size:14px}
.confirmed-row:last-child{border-bottom:0}
.confirmed-row span{color:var(--muted)}
.confirmed-row strong{color:var(--ink);text-align:right}

/* Wizard nav buttons */
.wizard-nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
.wizard-nav.justify-end{justify-content:flex-end}
.wizard-nav.justify-center{justify-content:center}

@media(max-width:880px){
  .reg-body{grid-template-columns:1fr}
  .reg-sidebar{position:static}
  .persona-grid,.grade-grid{grid-template-columns:1fr 1fr}
  .slot-grid{grid-template-columns:1fr}
  .sr-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .persona-grid,.grade-grid{grid-template-columns:1fr}
  .slot-grid{grid-template-columns:1fr}
  .reg-card{padding:22px 18px}
}

/* ===== School Nomination ===== */
.sl-count-wrap{display:flex;align-items:center;gap:14px;margin:8px 0 18px}
.sl-count-btn{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:22px;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s ease;color:var(--green-dark)}
.sl-count-btn:hover{background:var(--soft);border-color:var(--green)}
.sl-count-input{width:100px;text-align:center;font-size:26px;font-weight:950;border:2px solid var(--line);border-radius:14px;padding:10px;color:var(--ink)}
.sl-price-preview{background:linear-gradient(135deg,#e8f7ed,#f4fbf6);border:1px solid #b8dfc3;border-radius:18px;padding:18px 20px;margin-top:16px}
.sl-price-rule{font-size:13px;font-weight:850;color:var(--green-dark);margin-bottom:10px;text-transform:uppercase;letter-spacing:.04em}
.sl-price-line{display:flex;justify-content:space-between;font-size:14px;color:var(--muted);margin-bottom:6px}
.sl-price-total{display:flex;justify-content:space-between;font-size:20px;font-weight:950;color:var(--ink);padding-top:10px;margin-top:6px;border-top:1px solid #b8dfc3}
.sl-school-input{width:100%;border:2px solid var(--line);border-radius:16px;padding:14px 16px;font-size:16px;font-family:inherit;outline:none;transition:.15s ease}
.sl-school-input:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(26,160,91,.12)}
.nomination-link-box{background:var(--soft);border:1px solid #b8dfc3;border-radius:16px;padding:16px 18px;margin:16px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.nomination-link-text{font-size:14px;font-weight:850;color:var(--ink);word-break:break-all;flex:1}
.nomination-copy-btn{flex-shrink:0;background:var(--green);color:#fff;border:0;border-radius:12px;padding:8px 14px;font-size:13px;font-weight:850;cursor:pointer;transition:.15s ease}
.nomination-copy-btn:active{transform:translateY(1px)}
.nomination-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.nomination-stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 12px;text-align:center}
.nomination-stat span{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;font-weight:700}
.nomination-stat strong{display:block;font-size:22px;font-weight:950;color:var(--ink)}
.nomination-stat.remaining strong{color:var(--green-dark)}
.nomination-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 24px;margin-top:18px}
.nomination-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.nomination-card-head h3{margin:0;font-size:17px;color:var(--ink)}
.nomination-card-head .school-tag{font-size:13px;color:var(--muted);background:#f4fbf6;border:1px solid #c9ead6;border-radius:999px;padding:4px 10px;font-weight:850}
.nomination-resend-btn{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 14px;font-size:13px;font-weight:850;cursor:pointer;color:var(--green-dark);transition:.15s ease}
.nomination-resend-btn:hover{border-color:var(--green)}
@media(max-width:560px){
  .nomination-stats-grid{grid-template-columns:1fr 1fr}
  .sl-count-wrap{flex-wrap:wrap}
}

/* ===== Nomination Join Page ===== */
.join-page{min-height:100vh;background:var(--bg);display:flex;flex-direction:column}
.join-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding:14px 0}
.join-header-inner{width:min(720px,calc(100% - 40px));margin:0 auto}
.join-body{width:min(720px,calc(100% - 40px));margin:36px auto 60px;flex:1}
.join-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:36px 32px}
.join-card h2{margin:0 0 8px;font-size:26px;color:var(--ink)}
.join-card .join-sub{color:var(--muted);font-size:14px;margin-bottom:24px;line-height:1.55}
.join-kicker{display:block;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.07em;color:var(--green-dark);margin-bottom:6px}
.join-school-badge{display:inline-flex;align-items:center;gap:10px;background:var(--soft);border:1px solid #b8dfc3;border-radius:16px;padding:14px 18px;margin:8px 0 20px;font-size:17px;font-weight:850;color:var(--ink)}
.join-school-badge .join-school-icon{font-size:24px}
.join-auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.join-auth-card{border:2px solid var(--line);border-radius:20px;padding:22px 18px;cursor:pointer;text-align:center;background:#fff;transition:.15s ease}
.join-auth-card:hover{border-color:var(--green);background:var(--soft);transform:translateY(-2px)}
.join-auth-card .auth-icon{font-size:32px;display:block;margin-bottom:8px}
.join-auth-card h3{margin:0 0 4px;font-size:16px;color:var(--ink)}
.join-auth-card p{margin:0;font-size:13px;color:var(--muted)}
.join-progress{display:flex;gap:0;margin-bottom:24px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.join-step-dot{flex:1;padding:10px 6px;text-align:center;font-size:11px;font-weight:900;color:var(--muted);border-right:1px solid var(--line);transition:.2s ease}
.join-step-dot:last-child{border-right:0}
.join-step-dot.done{background:#e8f7ed;color:var(--green-dark)}
.join-step-dot.active{background:var(--green);color:#fff}
.join-step-dot .j-num{display:block;font-size:15px;font-weight:950;margin-bottom:1px}
.join-step-dot .j-lbl{font-size:10px}
.join-school-note{background:linear-gradient(135deg,#e8f7ed,#f4fbf6);border:1px solid #b8dfc3;border-radius:14px;padding:14px 16px;margin-bottom:18px;font-size:13px;color:var(--green-dark);font-weight:750}
.join-school-note strong{color:var(--ink)}
.join-extra-note{background:#fff7dd;border:1px solid #f0deaa;border-radius:14px;padding:12px 16px;font-size:13px;color:var(--warning);margin:14px 0}
.join-state-icon{font-size:52px;display:block;margin-bottom:16px;text-align:center}
.join-state-title{font-size:24px;font-weight:950;color:var(--ink);text-align:center;margin-bottom:8px}
.join-state-sub{color:var(--muted);text-align:center;font-size:15px;margin-bottom:24px}
@media(max-width:560px){
  .join-card{padding:22px 16px}
  .join-auth-grid{grid-template-columns:1fr}
}

/* ===== Responsive polish: all devices ================================================== */

/* 1 · iOS Safari: prevent auto-zoom on input focus (requires ≥16px font-size) */
@media(max-width:600px){
  input[type=text],input[type=password],input[type=email],
  input[type=number],input[type=tel],input[type=date],
  input[type=datetime-local],select,textarea,
  .sl-school-input{font-size:16px!important}
}

/* 2 · Sidebar overlay — darkens the page when the nav drawer is open on mobile */
.sidebar-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.46);
  z-index:36;opacity:0;transition:opacity .2s;
}
.sidebar-overlay.active{display:block;opacity:1}
@media(min-width:901px){.sidebar-overlay{display:none!important}}

/* 3 · Teacher topbar: prevent name + balance overflowing on small phones */
@media(max-width:540px){
  .teacher-topbar{gap:8px;padding:0 12px}
  .teacher-topbar>div:nth-child(2){flex:1;min-width:0;overflow:hidden}
  #topName{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;font-size:14px}
  .teacher-topbar small{display:none}
  .top-balance{padding:6px 9px;flex-shrink:0}
  .top-balance span{display:none}
  .top-balance strong{font-size:15px}
}

/* 4 · Welcome banner: compact on phones */
@media(max-width:620px){
  .welcome-banner{padding:16px 18px}
  .welcome-title{font-size:22px!important;line-height:1.2}
  .teacher-id-tag{font-size:12px}
}

/* 5 · Dashboard top-grid: force single column on very small phones */
@media(max-width:400px){
  .dashboard-top-grid{grid-template-columns:1fr!important}
}

/* 6 · Journey track: 2 cols on very small phones */
@media(max-width:420px){
  .journey-track{grid-template-columns:repeat(2,1fr)!important}
  .journey-step{font-size:11px;padding:10px 6px}
}

/* 7 · Nomination card: compact + prevent URL overflow */
.nomination-link-text{word-break:break-all;line-height:1.4}
@media(max-width:540px){
  .nomination-card{padding:16px}
  .nomination-card-head{gap:8px}
  .nomination-card-head h3{font-size:15px}
  .nomination-link-box{padding:12px 14px;gap:8px}
  .nomination-copy-btn{font-size:12px;padding:7px 10px}
}

/* 8 · Wizard progress bar: hide labels on small phones (7-step bar would overflow) */
@media(max-width:480px){
  .wizard-step-dot .dot-lbl{display:none}
  .wizard-step-dot{padding:10px 4px}
  .wizard-step-dot .dot-num{font-size:14px}
  .wizard-progress{overflow-x:auto}
  .join-step-dot .j-lbl{display:none}
  .join-step-dot{padding:10px 4px}
  .join-progress{overflow-x:auto}
}

/* 9 · Registration wizard cards: reduce padding on phones */
@media(max-width:480px){
  .reg-card{padding:20px 14px}
  .reg-header-inner{gap:8px}
  .reg-back{padding:7px 10px;font-size:13px}
  .review-price-box{padding:16px 14px}
}

/* 10 · Touch targets: min 44 × 44px for key interactive elements */
@media(max-width:600px){
  .wizard-nav button,.wizard-nav .button-link{min-height:44px}
  .join-auth-card{padding:18px 14px;min-height:80px}
  .persona-card{padding:20px 14px}
  .grade-card{padding:16px 14px}
  .subject-btn{min-height:48px;padding:14px 16px}
  .slot-card{padding:18px 12px}
  .sr-card{min-height:44px;padding:12px 14px}
  .teacher-sidebar nav button,
  .sidebar-foot button,
  .sidebar-foot a{min-height:44px;display:flex;align-items:center;justify-content:flex-start;text-align:left}
}

/* 11 · Join page: compact screens */
@media(max-width:420px){
  .join-card{padding:20px 14px}
  .join-body{margin:20px auto 40px}
  .join-state-icon{font-size:40px}
  .join-state-title{font-size:20px}
  .join-state-sub{font-size:14px}
}


