:root {
  --egepon-latte: #f7f1e8;
  --egepon-matcha: #9ca362;
  --egepon-butter: #fed57d;
  --egepon-cherry: #c62a29;
  --egepon-clover: #5ba881;
  --egepon-rainy: #b3dfeb;
  --egepon-wisteria: #e6e3f7;
  --egepon-ink: #3c342b;
}

.egepon-platform-page .entry-title,
.egepon-platform-page .wp-block-post-title { display: none !important; }
.egepon-platform-page .site-main,
.egepon-platform-page .entry-content,
.egepon-platform-page .wp-site-blocks { max-width: none !important; padding: 0 !important; margin: 0 !important; }
body.egepon-platform-page { width: 100%; min-width: 100%; max-width: none; margin: 0; padding: 0; overflow-x: hidden; }
html:has(body.egepon-platform-page) { width: 100%; min-width: 100%; max-width: none; margin: 0; padding: 0; }
.egepon-standalone-main { width: 100%; min-width: 100%; margin: 0; padding: 0; }

.egepon-app {
  width: 100%;
  min-height: 100vh;
  margin: 0;
  color: var(--egepon-ink);
  font: 15px/1.5 Inter, system-ui, sans-serif;
  background-color: #fff;
  background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 31px, rgba(120,130,150,.1) 31px, rgba(120,130,150,.1) 32px);
  box-sizing: border-box;
}
.egepon-app *, .egepon-app *::before, .egepon-app *::after { box-sizing: border-box; }
.egepon-app button, .egepon-app input, .egepon-app select, .egepon-app textarea { font: inherit; }
.egepon-app button { color: inherit; }
.egepon-app h1, .egepon-app h2, .egepon-app h3, .egepon-app p { margin-top: 0; }
.egepon-app h1 { margin-bottom: 0; font-size: clamp(28px, 4vw, 42px); font-weight: 800; letter-spacing: -.04em; }
.egepon-app h2 { margin-bottom: 12px; font-size: 22px; font-weight: 800; }
.egepon-app h3 { margin-bottom: 8px; font: 700 19px/1.25 "PT Serif", Georgia, serif; }
.egepon-hand { margin: 2px 0 0; color: var(--egepon-matcha); font: 700 25px/1.15 Caveat, cursive; }
.egepon-loading, .egepon-error, .egepon-empty { padding: 42px; text-align: center; color: rgba(60,52,43,.62); }
.egepon-error { color: var(--egepon-cherry); }
.egepon-note { margin: -7px 0 18px; color: rgba(60,52,43,.6); font: italic 14px "PT Serif", serif; }

.egepon-auth { display: grid; min-height: 100vh; place-items: center; padding: 28px; background: repeating-linear-gradient(to bottom, transparent 0 27px, rgba(156,163,98,.12) 27px 28px), repeating-linear-gradient(to right, transparent 0 27px, rgba(156,163,98,.08) 27px 28px), var(--egepon-latte); }
.egepon-auth-card { position: relative; width: min(470px, 100%); padding: 42px 38px 34px; border-radius: 18px; background: #fff; box-shadow: 0 26px 44px -18px rgba(60,52,43,.5); transform: rotate(-.4deg); }
.egepon-auth-card::after { content: ""; position: absolute; z-index: 0; inset: 10px; border: 1px dashed rgba(156,163,98,.58); border-radius: 11px; pointer-events: none; }
.egepon-auth-card > * { position: relative; z-index: 1; }
.egepon-auth-card > h1 { color: var(--egepon-matcha); text-align: center; font-size: 52px; }
.egepon-auth-card > .egepon-hand { margin-bottom: 25px; text-align: center; }
.egepon-auth-card > h1 + form { margin-top: 30px; }
.egepon-trinket.corner-one, .egepon-trinket.corner-two { position: absolute; top: 12px; width: 34px; }
.egepon-trinket.corner-one { left: 14px; transform: rotate(-9deg); }
.egepon-trinket.corner-two { right: 14px; transform: rotate(10deg); }

.egepon-app label { display: block; margin: 0 0 15px; color: rgba(60,52,43,.82); font-weight: 700; }
.egepon-app label small { display: block; color: rgba(60,52,43,.5); font-weight: 400; }
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.egepon-app select,
.egepon-app textarea { display: block; width: 100%; margin-top: 5px; padding: 10px 12px; border: 2px solid rgba(60,52,43,.12); border-radius: 9px; outline: 0; background: rgba(247,241,232,.55); color: var(--egepon-ink); }
.egepon-app textarea { resize: vertical; }
.egepon-app input:focus, .egepon-app select:focus, .egepon-app textarea:focus { border-color: var(--egepon-matcha) !important; }
.egepon-password-wrap { position: relative; display: block; }
.egepon-password-wrap input { padding-right: 48px !important; }
.egepon-password-toggle { position: absolute; top: 50%; right: 8px; display: grid; width: 35px; height: 35px; margin-top: 2px; padding: 0; place-items: center; border: 0; border-radius: 50%; background: transparent; color: rgba(60,52,43,.52) !important; cursor: pointer; transform: translateY(-50%); }
.egepon-password-toggle:hover,
.egepon-password-toggle:focus-visible { background: rgba(156,163,98,.13); color: var(--egepon-ink) !important; outline: none; }
.egepon-password-toggle.is-visible { color: var(--egepon-matcha) !important; }
.egepon-password-toggle svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.egepon-password-toggle .egepon-eye-slash { display: none; }
.egepon-password-toggle.is-visible .egepon-eye-slash { display: block; }
.egepon-fields-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.egepon-form-actions, .egepon-head-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; }
.egepon-form-actions > .egepon-trinket { width: 45px; }
.egepon-stamp { --stamp: var(--egepon-matcha); border: 1px dashed rgba(255,255,255,.82); outline: 2px solid var(--stamp); outline-offset: -3px; border-radius: 4px; padding: 10px 17px; background: var(--stamp); color: #fff !important; cursor: pointer; font: 700 20px/1 Caveat, cursive !important; filter: drop-shadow(2px 4px 4px rgba(60,52,43,.25)); transform: rotate(-1deg); transition: transform .15s; }
.egepon-stamp:hover { transform: rotate(0deg) translateY(-2px); }
.egepon-stamp.cherry { --stamp: var(--egepon-cherry); }
.egepon-stamp.butter { --stamp: var(--egepon-butter); color: var(--egepon-ink) !important; }
.egepon-stamp.rainy { --stamp: var(--egepon-rainy); color: var(--egepon-ink) !important; }
.egepon-stamp.plain { --stamp: #e7dcc4; color: var(--egepon-ink) !important; }
.egepon-link, .egepon-back { padding: 8px 0; border: 0; background: transparent; color: rgba(60,52,43,.68); text-decoration: underline; cursor: pointer; }
.egepon-auth-card > .egepon-link { display: block; margin: 13px auto 0; }
.egepon-auth-actions { position: relative; justify-content: center; min-height: 48px; }
.egepon-auth-actions > .egepon-auth-trinket { position: absolute; top: 50%; left: calc(50% - 82px); display: grid; place-items: center; transform: translateY(-50%); }
.egepon-auth-actions .egepon-auth-trinket .egepon-trinket { width: 40px; }
.egepon-picker { margin: 18px 0; padding: 16px; border: 2px dashed rgba(60,52,43,.18); border-radius: 12px; }
.egepon-picker legend { padding: 0 8px; font: 700 22px Caveat, cursive; }
.egepon-trinket-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px; }
.egepon-trinket-grid label { position: relative; display: grid; aspect-ratio: 1; place-items: center; margin: 0; border-radius: 9px; background: rgba(255,255,255,.65); cursor: pointer; }
.egepon-trinket-grid input { position: absolute; opacity: 0; }
.egepon-trinket-grid label:has(input:checked) { outline: 2px solid #5a5148; background: #fff; box-shadow: 0 3px 10px rgba(60,52,43,.18); }
.egepon-trinket-grid .egepon-trinket { width: 44px; max-width: 100%; }

.egepon-shell { min-height: 100vh; padding: 88px 28px 70px 220px; }
.egepon-ambient { position: fixed; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
.egepon-ambient .egepon-trinket { position: absolute; width: 62px; opacity: .68; filter: drop-shadow(1px 3px 4px rgba(60,52,43,.3)); }
.egepon-ambient .egepon-trinket:nth-child(1) { top: 92px; right: 18px; transform: rotate(10deg); }
.egepon-ambient .egepon-trinket:nth-child(2) { right: 35px; bottom: 85px; transform: rotate(-8deg); }
.egepon-ambient .egepon-trinket:nth-child(3) { left: 18px; bottom: 40px; transform: rotate(7deg); }
.egepon-redline { position: fixed; z-index: 5; top: 0; bottom: 0; left: 38px; width: 2px; background: rgba(198,42,41,.55); }
.egepon-shell aside { position: fixed; z-index: 20; top: 0; bottom: 0; left: 0; width: 190px; padding: 30px 18px 30px 54px; background: rgba(255,255,255,.88); backdrop-filter: blur(7px); }
.egepon-brand { display: block; margin-bottom: 45px; color: var(--egepon-matcha) !important; text-decoration: none !important; font-size: 25px; font-weight: 800; letter-spacing: -.04em; }
.egepon-shell nav { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.egepon-shell nav a { position: relative; color: rgba(60,52,43,.64) !important; text-decoration: none !important; font-size: 14px; font-weight: 700; }
.egepon-shell nav a.active { color: var(--egepon-ink) !important; }
.egepon-shell nav a.active::after { content: ""; position: absolute; inset: -8px -13px; border: 2px solid var(--egepon-cherry); border-radius: 48% 53% 47% 55%; transform: rotate(-3deg); }
.egepon-top { position: fixed; z-index: 18; top: 0; right: 0; left: 190px; display: flex; height: 66px; align-items: center; justify-content: flex-end; gap: 18px; padding: 0 30px; background: rgba(255,255,255,.88); backdrop-filter: blur(7px); }
.egepon-user-mini { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.egepon-user-mini .egepon-trinket { width: 31px; height: 31px; object-fit: contain; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.35)); }
.egepon-bell, .egepon-menu { position: relative; border: 0; background: transparent; cursor: pointer; font-size: 24px; }
.egepon-bell span { display: block; font-size: 19px; }
.egepon-bell i { position: absolute; top: 2px; right: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--egepon-cherry); }
.egepon-menu { display: none; margin-right: auto; }
#egepon-view { position: relative; z-index: 1; width: min(1320px, 100%); margin: 0 auto; }
.egepon-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; margin-bottom: 22px; }
.egepon-week-tools { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; }
.egepon-week-tools button { min-width: 38px; padding: 7px 10px; border: 1px solid rgba(60,52,43,.15); border-radius: 8px; background: #fff; cursor: pointer; }
.egepon-week-tools span { margin-left: auto; color: rgba(60,52,43,.55); font-size: 12px; }

.egepon-planner { overflow: hidden; padding: 18px; border-radius: 16px; background: #fffdf7; box-shadow: 0 22px 40px -20px rgba(60,52,43,.45), inset 0 0 0 1px rgba(60,52,43,.05); }
.egepon-days, .egepon-week-grid { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 7px; }
.egepon-days > div { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 0 10px; font: 700 22px Caveat, cursive; }
.egepon-days span { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; color: rgba(60,52,43,.6); font: 700 12px Inter, sans-serif; }
.egepon-days .today span { background: var(--egepon-matcha); color: #fff; }
.egepon-day-column { min-height: 500px; padding: 7px; border-top: 2px dashed rgba(156,163,98,.3); border-right: 1px dashed rgba(156,163,98,.2); }
.egepon-day-column:last-child { border-right: 0; }
.egepon-mobile-day { display: none; }
.egepon-event { --paper: #feebb6; position: relative; display: block; width: 100%; margin: 13px 0; padding: 21px 9px 10px; border: 0; border-radius: 3px; background: var(--paper); box-shadow: 2px 5px 8px rgba(60,52,43,.18); text-align: left; cursor: pointer; transform: rotate(-.8deg); }
.egepon-event:nth-child(even) { transform: rotate(.8deg); }
.egepon-event b, .egepon-event small { display: block; }
.egepon-event b { font: 700 13px/1.25 "PT Serif", serif; }
.egepon-event small { margin-top: 4px; color: rgba(60,52,43,.65); font-size: 11px; }
.egepon-tape { position: absolute; top: -8px; left: 50%; width: 54px; height: 19px; background: rgba(255,255,255,.55); box-shadow: 0 1px 2px rgba(0,0,0,.1); transform: translateX(-50%) rotate(-2deg); }
.egepon-event.deadline { --paper: #f8d9d5; border-left: 4px solid var(--egepon-cherry); }

.egepon-overlay { position: fixed; z-index: 99999; inset: 0; display: grid; overflow-y: auto; place-items: center; padding: 25px; background: rgba(40,26,12,.43); }
.egepon-modal { position: relative; width: min(520px, 100%); max-height: calc(100vh - 50px); overflow-y: auto; padding: 34px; border-radius: 16px; outline: 2px dashed rgba(255,255,255,.55); outline-offset: -10px; background-color: #cdb994; background-image: radial-gradient(circle at 12% 18%, rgba(255,255,255,.18) 0, transparent 45%), radial-gradient(circle at 85% 75%, rgba(90,60,30,.2) 0, transparent 50%); box-shadow: 0 30px 50px -18px rgba(40,26,12,.6); }
.egepon-modal.wide { width: min(860px, 100%); }
.egepon-modal-x { position: absolute; z-index: 2; top: 12px; right: 14px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(255,255,255,.55); cursor: pointer; font-size: 22px; }
.egepon-event-info { display: grid; grid-template-columns: 95px 1fr; gap: 20px; }
.egepon-event-info .egepon-trinket, .egepon-photo { width: 90px; height: 90px; border-radius: 50%; object-fit: cover; }
.egepon-text-button { display: inline-block; margin-top: 10px; padding: 9px 13px; border-radius: 8px; background: var(--egepon-matcha); color: #fff !important; text-decoration: none !important; font-weight: 700; }
.egepon-notifications article { margin-bottom: 8px; padding: 12px; border-radius: 9px; background: rgba(255,255,255,.55); }
.egepon-notifications article.unread { border-left: 4px solid var(--egepon-cherry); background: #fff; }
.egepon-notifications p { margin: 4px 0; }
.egepon-notifications small { color: rgba(60,52,43,.55); }
.egepon-toasts { position: fixed; z-index: 100000; right: 22px; bottom: 22px; display: flex; flex-direction: column; gap: 8px; }
.egepon-toast { max-width: 380px; padding: 12px 16px; border-radius: 8px; background: var(--egepon-clover); color: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.24); }
.egepon-toast.error { background: var(--egepon-cherry); }

.egepon-student-grid, .egepon-template-grid, .egepon-teacher-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
.egepon-student-card, .egepon-template-card { position: relative; padding: 25px 20px 20px; border: 0; border-radius: 10px; background: #fff; box-shadow: 2px 7px 14px rgba(60,52,43,.2); text-align: left; cursor: pointer; transform: rotate(var(--tilt, 0)); transition: transform .2s; }
.egepon-student-card:hover, .egepon-template-card:hover { transform: translateY(-4px) rotate(0); }
.egepon-student-card > .egepon-trinket { position: absolute; top: -15px; left: -10px; width: 58px; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.4)); }
.egepon-student-card > small { display: block; padding-left: 38px; color: rgba(60,52,43,.45); text-transform: uppercase; }
.egepon-student-card h3 { padding-left: 38px; font-size: 23px; }
.egepon-student-card > p { color: rgba(60,52,43,.58); }
.egepon-stat-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.egepon-stat-row span { padding: 9px; border-radius: 8px; background: var(--egepon-latte); color: rgba(60,52,43,.58); font-size: 10px; text-transform: uppercase; }
.egepon-stat-row i { display: block; color: var(--egepon-matcha); font: 700 22px "PT Serif", serif; font-style: normal; }
.egepon-section { margin-top: 35px; padding: 22px; border-radius: 13px; background: rgba(255,253,247,.88); box-shadow: 0 16px 30px -23px rgba(60,52,43,.6); }
.egepon-section > h2 > span { display: inline-grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; background: var(--egepon-butter); font-size: 13px; }
.egepon-chip-list { display: flex; flex-wrap: wrap; gap: 10px; }
.egepon-chip-list button { padding: 9px 13px; border: 0; border-radius: 20px; background: var(--chip); cursor: pointer; font-weight: 700; }
.egepon-check-list { display: grid; gap: 5px; max-height: 210px; overflow-y: auto; }
.egepon-check-list label { margin: 0; padding: 7px 9px; border-radius: 7px; background: rgba(255,255,255,.4); }
.egepon-check-list small { display: inline; }
.egepon-copy-result { display: flex; gap: 7px; margin-top: 14px; }
.egepon-copy-result button { border: 0; border-radius: 8px; background: var(--egepon-matcha); color: #fff; cursor: pointer; }
.egepon-directory { margin-top: 24px; padding-top: 18px; border-top: 2px dashed rgba(60,52,43,.16); }
.egepon-directory > div { display: grid; max-height: 260px; overflow-y: auto; gap: 7px; margin-top: 10px; }
.egepon-directory [data-directory-id] { display: flex; align-items: center; gap: 10px; padding: 9px; border: 0; border-radius: 8px; background: rgba(255,255,255,.55); text-align: left; cursor: pointer; }
.egepon-directory [data-directory-id]:disabled { opacity: .52; cursor: default; }
.egepon-directory .egepon-trinket { width: 40px; height: 40px; object-fit: contain; }
.egepon-directory b, .egepon-directory small { display: block; }
.egepon-person-head { display: flex; align-items: center; gap: 15px; }
.egepon-person-head .egepon-trinket { width: 65px; }
.egepon-list article { display: flex; flex-direction: column; margin-top: 8px; padding: 11px; border-radius: 8px; background: rgba(255,255,255,.55); }
.egepon-list article span { color: rgba(60,52,43,.62); font-size: 12px; }

.egepon-template-card { min-height: 150px; background: #fffdf7; }
.egepon-template-card > span { display: inline-block; padding: 3px 8px; border-radius: 10px; background: var(--egepon-wisteria); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.egepon-template-card h3 { margin-top: 13px; }
.egepon-template-card p, .egepon-template-card small { display: block; color: rgba(60,52,43,.58); }
.egepon-builder { padding: 25px; border-radius: 14px; background: rgba(255,253,247,.9); box-shadow: 0 18px 35px -25px rgba(60,52,43,.7); }
.egepon-block { margin: 22px 0; padding: 18px; border: 2px dashed rgba(60,52,43,.16); border-radius: 12px; background: #fff; }
.egepon-block header { display: flex; align-items: center; gap: 10px; margin-bottom: 15px; }
.egepon-block header > span { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: var(--egepon-butter); font-weight: 800; }
.egepon-block header > button { margin-left: auto; border: 0; background: transparent; color: var(--egepon-cherry); cursor: pointer; font-size: 12px; }
.egepon-criteria { padding: 13px; border-radius: 9px; background: var(--egepon-latte); }
.egepon-criterion { display: grid; grid-template-columns: 1fr 100px 32px; gap: 7px; }
.egepon-criterion input { margin-top: 7px !important; }
.egepon-criterion button { margin-top: 7px; border: 0; border-radius: 8px; background: #fff; cursor: pointer; }
.egepon-add-block { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; padding-top: 8px; }

.egepon-table-wrap { overflow-x: auto; border-radius: 12px; background: #fff; box-shadow: 0 12px 30px -22px rgba(60,52,43,.7); }
.egepon-table { width: 100%; border-collapse: collapse; }
.egepon-table th, .egepon-table td { padding: 13px 15px; border-bottom: 1px dashed rgba(60,52,43,.16); text-align: left; vertical-align: middle; }
.egepon-table th { color: rgba(60,52,43,.5); font-size: 11px; text-transform: uppercase; }
.egepon-table td small { display: block; color: rgba(60,52,43,.55); }
.egepon-table .late, .egepon-homework-list .late { color: var(--egepon-cherry); }
.egepon-status { display: inline-block; padding: 4px 8px; border-radius: 12px; background: var(--egepon-rainy); font-size: 11px; font-weight: 800; }
.egepon-status.submitted { background: #f8d9d5; color: var(--egepon-cherry); }
.egepon-status.reviewed { background: #dceee5; color: #34765a; }
.egepon-status.rework { background: var(--egepon-butter); }
.egepon-dots { border: 0; background: transparent; cursor: pointer; font-weight: 800; }

.egepon-review-item, .egepon-answer-item { display: grid; grid-template-columns: 35px 1fr; gap: 12px; margin: 13px 0; padding: 16px; border-radius: 10px; background: rgba(255,255,255,.7); }
.egepon-review-item > span, .egepon-answer-item > span { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 50%; background: var(--egepon-butter); font-weight: 800; }
.egepon-review-item.info, .egepon-answer-item.info { background: var(--egepon-wisteria); font-family: "PT Serif", serif; }
.egepon-prompt { margin-bottom: 13px; font: 700 16px/1.55 "PT Serif", serif; }
.egepon-answer { padding: 10px; border-radius: 8px; background: #fff; white-space: normal; }
.egepon-score-grid { display: grid; gap: 7px; margin: 12px 0; }
.egepon-score-grid label { display: flex; align-items: center; justify-content: space-between; margin: 0; }
.egepon-score-grid input { display: inline-block !important; width: 75px !important; }
.egepon-teacher-comment, .egepon-feedback, .egepon-result { margin: 12px 0; padding: 13px; border-left: 4px solid var(--egepon-cherry); border-radius: 7px; background: rgba(255,255,255,.65); }
.egepon-result { border-color: var(--egepon-clover); font-size: 22px; }
.egepon-homework-list { display: grid; gap: 9px; }
.egepon-homework-list > button { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 14px 17px; border: 2px dashed rgba(60,52,43,.14); border-radius: 9px; background: #fff; text-align: left; cursor: pointer; }
.egepon-homework-list b, .egepon-homework-list span, .egepon-homework-list small { display: block; }
.egepon-homework-list span { color: rgba(60,52,43,.58); font-size: 12px; }
.homework-overdue { border: 2px solid var(--egepon-butter); background: rgba(254,213,125,.15); }

.egepon-teacher-grid article { padding: 22px; border-radius: 12px; background: #fffdf7; box-shadow: 2px 7px 14px rgba(60,52,43,.15); text-align: center; }
.egepon-teacher-grid .egepon-trinket, .egepon-teacher-photo { width: 95px; height: 95px; margin: 0 auto 12px; border-radius: 50%; object-fit: cover; }
.egepon-course-list > section { margin-bottom: 25px; }
.egepon-course-list > section > div { display: flex; flex-wrap: wrap; gap: 12px; }
.egepon-course-list button { min-width: 180px; padding: 20px 14px; border: 0; background: var(--paper); box-shadow: 2px 5px 10px rgba(60,52,43,.18); text-align: left; cursor: pointer; transform: rotate(-.7deg); }
.egepon-course-list button.archived { opacity: .55; }
.egepon-course-list button b, .egepon-course-list button span { display: block; }
.egepon-course-list button span { margin-top: 5px; font-size: 11px; }
.egepon-profile-card { width: min(720px,100%); padding: 25px; border-radius: 15px; background: #fffdf7; box-shadow: 0 18px 35px -25px rgba(60,52,43,.7); }
.egepon-current-avatar { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.egepon-current-avatar .egepon-trinket, .egepon-current-avatar img { width: 75px; height: 75px; border-radius: 50%; object-fit: cover; }
.egepon-photo-form { margin: 28px 0; padding-top: 20px; border-top: 2px dashed rgba(60,52,43,.15); }
.egepon-photo-form .egepon-stamp { margin-top: 12px; }
.egepon-admin-stats { display: grid; grid-template-columns: repeat(2, minmax(0,240px)); gap: 15px; }
.egepon-admin-stats article { padding: 20px; border-radius: 12px; background: var(--egepon-latte); }
.egepon-admin-stats b, .egepon-admin-stats span { display: block; }
.egepon-admin-stats b { color: var(--egepon-matcha); font: 700 40px "PT Serif", serif; }

@media (max-width: 1050px) {
  .egepon-shell { padding-left: 180px; }
  .egepon-shell aside { width: 160px; padding-left: 45px; }
  .egepon-top { left: 160px; }
  .egepon-student-grid, .egepon-template-grid, .egepon-teacher-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .egepon-days, .egepon-week-grid { min-width: 930px; }
  .egepon-planner { overflow-x: auto; }
}

@media (max-width: 760px) {
  .egepon-shell { padding: 78px 14px 45px; }
  .egepon-redline { left: 12px; }
  .egepon-shell aside { left: -280px; width: 260px; padding: 28px 28px 28px 45px; box-shadow: 8px 0 28px rgba(60,52,43,.18); transition: left .2s; }
  .egepon-shell aside.open { left: 0; }
  .egepon-top { left: 0; height: 60px; padding: 0 14px; }
  .egepon-menu { display: block; }
  .egepon-user-mini span { display: none; }
  .egepon-page-head { align-items: flex-start; flex-direction: column; }
  .egepon-head-actions { justify-content: flex-start; }
  .egepon-fields-two { grid-template-columns: 1fr; gap: 0; }
  .egepon-student-grid, .egepon-template-grid, .egepon-teacher-grid { grid-template-columns: 1fr; }
  .egepon-days { display: none; }
  .egepon-week-grid { display: block; min-width: 0; }
  .egepon-day-column { min-height: 80px; margin-bottom: 12px; border: 0; border-radius: 10px; background: rgba(255,255,255,.55); }
  .egepon-mobile-day { display: block; margin-bottom: 6px; color: var(--egepon-matcha); font: 700 20px Caveat,cursive; }
  .egepon-event { padding: 18px 13px 11px; }
  .egepon-week-tools span { display: none; }
  .egepon-modal { padding: 32px 20px 24px; }
  .egepon-trinket-grid { grid-template-columns: repeat(4,1fr); }
  .egepon-auth { padding: 12px; }
  .egepon-auth-card { padding: 38px 22px 28px; }
  .egepon-table { min-width: 720px; }
  .egepon-event-info { grid-template-columns: 1fr; }
  .egepon-event-info .egepon-trinket, .egepon-photo { width: 70px; height: 70px; }
  .egepon-criterion { grid-template-columns: 1fr 82px 32px; }
  .egepon-review-item, .egepon-answer-item { grid-template-columns: 28px 1fr; padding: 12px; }
}

/* ===== 0.2.0 · visual parity with the original craft-paper mockups ===== */
body.egepon-platform-page,
body.egepon-platform-page #page,
body.egepon-platform-page .site,
body.egepon-platform-page .site-content,
body.egepon-platform-page main,
body.egepon-platform-page .egepon-standalone-main,
body.egepon-platform-page .egepon-app {
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.egepon-doodle { display: block; width: 20px; height: 20px; flex: 0 0 auto; }

/* postage-stamp buttons from the Figma/React source */
.egepon-stamp {
  --stamp: var(--egepon-matcha);
  --d: 6px;
  display: inline-block;
  padding: 5px;
  border: 0;
  outline: 0;
  border-radius: 0;
  background: #f4efe2;
  color: #fff !important;
  cursor: pointer;
  filter: drop-shadow(2px 4px 4px rgba(60,52,43,.28));
  transform: rotate(-1deg);
  transition: transform .15s ease, filter .15s ease;
  -webkit-mask:
    radial-gradient(var(--d) at var(--d) 50%, #0000 98%, #000) 0 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at calc(100% - var(--d)) 50%, #0000 98%, #000) 100% 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at 50% var(--d), #0000 98%, #000) 0 0 / calc(2 * var(--d)) 100% repeat-x,
    radial-gradient(var(--d) at 50% calc(100% - var(--d)), #0000 98%, #000) 0 100% / calc(2 * var(--d)) 100% repeat-x,
    linear-gradient(#000 0 0) padding-box;
  mask:
    radial-gradient(var(--d) at var(--d) 50%, #0000 98%, #000) 0 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at calc(100% - var(--d)) 50%, #0000 98%, #000) 100% 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at 50% var(--d), #0000 98%, #000) 0 0 / calc(2 * var(--d)) 100% repeat-x,
    radial-gradient(var(--d) at 50% calc(100% - var(--d)), #0000 98%, #000) 0 100% / calc(2 * var(--d)) 100% repeat-x,
    linear-gradient(#000 0 0) padding-box;
}
.egepon-stamp:hover { transform: rotate(0deg) translateY(-2px); filter: drop-shadow(2px 5px 5px rgba(60,52,43,.32)); }
.egepon-stamp:active { transform: rotate(0deg) translateY(0); }
.egepon-stamp-inner {
  --d: 5px;
  display: flex;
  min-height: 39px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 15px;
  background: var(--stamp);
  color: inherit;
  font: 700 20px/1 Caveat, cursive !important;
  letter-spacing: .02em;
  -webkit-mask:
    radial-gradient(var(--d) at var(--d) 50%, #0000 98%, #000) 0 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at calc(100% - var(--d)) 50%, #0000 98%, #000) 100% 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at 50% var(--d), #0000 98%, #000) 0 0 / calc(2 * var(--d)) 100% repeat-x,
    radial-gradient(var(--d) at 50% calc(100% - var(--d)), #0000 98%, #000) 0 100% / calc(2 * var(--d)) 100% repeat-x,
    linear-gradient(#000 0 0) padding-box;
  mask:
    radial-gradient(var(--d) at var(--d) 50%, #0000 98%, #000) 0 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at calc(100% - var(--d)) 50%, #0000 98%, #000) 100% 0 / 100% calc(2 * var(--d)) repeat-y,
    radial-gradient(var(--d) at 50% var(--d), #0000 98%, #000) 0 0 / calc(2 * var(--d)) 100% repeat-x,
    radial-gradient(var(--d) at 50% calc(100% - var(--d)), #0000 98%, #000) 0 100% / calc(2 * var(--d)) 100% repeat-x,
    linear-gradient(#000 0 0) padding-box;
}
.egepon-stamp-doodle { width: 19px; height: 19px; }
.egepon-stamp.cherry { --stamp: var(--egepon-cherry); color: #fbfaf5 !important; }
.egepon-stamp.butter { --stamp: var(--egepon-butter); color: var(--egepon-ink) !important; }
.egepon-stamp.rainy { --stamp: var(--egepon-rainy); color: var(--egepon-ink) !important; }
.egepon-stamp.plain { --stamp: #e7dcc4; color: var(--egepon-ink) !important; }

/* modal shell copied from the design archive: paper, accent stripe and physical fasteners */
.egepon-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background: rgba(40,26,12,.42);
  backdrop-filter: blur(1.5px);
}
.egepon-modal {
  --modal-accent: var(--egepon-matcha);
  position: relative;
  width: min(520px, 100%);
  max-height: none;
  margin: 26px 0;
  overflow: visible;
  padding: 38px 28px 26px;
  border-radius: 14px;
  outline: 0;
  background-color: #f3ead6;
  background-image: repeating-linear-gradient(48deg, rgba(120,90,55,.045) 0 3px, transparent 3px 7px);
  box-shadow: 0 30px 50px -18px rgba(40,26,12,.55);
  transform: rotate(-.55deg);
}
.egepon-modal.wide { width: min(860px, calc(100vw - 56px)); }
.egepon-modal-accent { position: absolute; inset: 0 0 auto; height: 6px; border-radius: 14px 14px 0 0; background: var(--modal-accent); }
.egepon-paperclip { position: absolute; z-index: 4; top: -16px; left: 31px; width: 32px; height: 72px; transform: rotate(-6deg); filter: drop-shadow(1px 2px 1px rgba(60,52,43,.14)); pointer-events: none; }
.egepon-modal-washi {
  position: absolute;
  z-index: 4;
  top: -8px;
  left: 30px;
  width: 80px;
  height: 21px;
  background: rgba(179,223,235,.9);
  box-shadow: 0 1px 3px rgba(0,0,0,.14);
  transform: rotate(-3deg);
  pointer-events: none;
}
.egepon-modal-washi::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 7px, transparent 7px 14px); }
.egepon-modal-washi::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.25), rgba(0,0,0,.06)); }
.egepon-modal-bead { position: absolute; z-index: 4; top: -18px; left: 27px; display: block; width: 43px; height: 43px; transform: rotate(-8deg); pointer-events: none; }
.egepon-modal-bead .egepon-trinket { width: 43px; height: 43px; object-fit: contain; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.4)); }
.egepon-modal-x {
  position: absolute;
  z-index: 6;
  top: 13px;
  right: 16px;
  display: grid;
  width: 30px;
  height: 30px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: rgba(60,52,43,.45) !important;
  cursor: pointer;
  font: 400 19px/1 Inter, sans-serif !important;
  transition: background .15s, color .15s;
}
.egepon-modal-x:hover { background: rgba(0,0,0,.05); color: var(--egepon-ink) !important; }
.egepon-modal > h2,
.egepon-modal .egepon-page-head h2 { margin-bottom: 2px; padding-right: 38px; font: 800 24px/1.15 Inter, sans-serif; color: var(--egepon-ink); letter-spacing: -.02em; }
.egepon-modal > p:first-of-type { font-family: "PT Serif", Georgia, serif; }
.egepon-modal form { margin-top: 16px; }
.egepon-modal label { color: rgba(60,52,43,.78); font-size: 13px; }
.egepon-modal input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.egepon-modal select,
.egepon-modal textarea { background: rgba(255,255,255,.8); }
.egepon-modal .egepon-form-actions { margin-top: 22px; padding-top: 15px; border-top: 1px dashed rgba(60,52,43,.16); }
.egepon-modal-copy { margin: 12px 0 0; color: rgba(60,52,43,.8); font: 15px/1.6 "PT Serif", Georgia, serif; }
.egepon-ghost { padding: 8px 14px; border: 0; border-radius: 999px; background: transparent; color: rgba(60,52,43,.62) !important; cursor: pointer; font-weight: 700; }
.egepon-ghost:hover { background: rgba(0,0,0,.05); color: var(--egepon-ink) !important; }
.egepon-confirm { width: min(470px,100%); }

/* little physical trinkets near headings, like in the original dashboards */
#egepon-view > .egepon-page-head > div:first-child { position: relative; padding-left: 39px; }
#egepon-view > .egepon-page-head > div:first-child::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 30px;
  height: 30px;
  background: url("trinkets/23.png") center / contain no-repeat;
  filter: drop-shadow(1px 3px 3px rgba(60,52,43,.35));
  transform: rotate(-7deg);
}

/* login ambience from FallDecor in the original archive */
.egepon-auth { position: relative; overflow: hidden; }
.egepon-auth-decor { position: absolute; inset: 0; pointer-events: none; }
.egepon-auth-decor .egepon-trinket { position: absolute; width: 58px; opacity: .76; filter: drop-shadow(1px 3px 4px rgba(60,52,43,.3)); }
.egepon-auth-decor .egepon-trinket:nth-child(1) { top: 12%; left: -9px; transform: rotate(-12deg); }
.egepon-auth-decor .egepon-trinket:nth-child(2) { top: 24%; right: 24px; width: 52px; transform: rotate(12deg); }
.egepon-auth-decor .egepon-trinket:nth-child(3) { bottom: 10%; left: 35px; width: 50px; transform: rotate(-6deg); }
.egepon-auth-card { z-index: 2; }

@media (min-width: 1051px) {
  .egepon-planner { position: relative; overflow: visible; }
  .egepon-planner::before,
  .egepon-planner::after { content: ""; position: absolute; z-index: 4; background-position: center; background-repeat: no-repeat; background-size: contain; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.4)); pointer-events: none; }
  .egepon-planner::before { top: -20px; right: -18px; width: 48px; height: 48px; background-image: url("trinkets/19.png"); transform: rotate(12deg); }
  .egepon-planner::after { bottom: 34px; left: -16px; width: 36px; height: 36px; background-image: url("trinkets/14.png"); transform: rotate(-10deg); }
}

@media (max-width: 760px) {
  .egepon-overlay { align-items: flex-start; padding: 18px 12px; }
  .egepon-modal, .egepon-modal.wide { width: 100%; margin: 22px 0; padding: 36px 19px 22px; transform: rotate(-.25deg); }
  .egepon-paperclip { left: 24px; }
  .egepon-modal-washi { left: 22px; }
  .egepon-modal-bead { left: 20px; }
  #egepon-view > .egepon-page-head > div:first-child { padding-left: 34px; }
  #egepon-view > .egepon-page-head > div:first-child::before { width: 27px; height: 27px; }
  .egepon-auth-decor .egepon-trinket { opacity: .42; }
}

/* ===== 0.3.0 · modal system copied from the original design archive ===== */
.egepon-modal-body { position: relative; z-index: 1; }
.egepon-modal-subtitle {
  margin: 2px 38px 0 0;
  color: rgba(60,52,43,.64);
  font: italic 14px/1.35 "PT Serif", Georgia, serif;
}
.egepon-modal > h2 { position: relative; z-index: 1; margin: 0; }
.egepon-modal-body > .egepon-modal-copy:first-child { margin-top: 17px; }
.egepon-modal .egepon-modal-footer { justify-content: flex-end; }
.egepon-modal .egepon-form-actions .egepon-ghost { margin-right: auto; }
.egepon-modal .egepon-form-actions > .egepon-ghost + .egepon-stamp:last-child { margin-left: 0; }
.egepon-modal label {
  color: rgba(60,52,43,.55);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.egepon-modal label input,
.egepon-modal label select,
.egepon-modal label textarea,
.egepon-modal label button,
.egepon-modal label small,
.egepon-modal label .egepon-date-field { text-transform: none; letter-spacing: normal; }
.egepon-modal label small { margin-top: 4px; font-size: 11px; }
.egepon-success-copy { display: flex; align-items: center; gap: 14px; margin-top: 18px; }
.egepon-success-copy .egepon-trinket { width: 42px; height: 42px; object-fit: contain; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.35)); }
.egepon-success-copy p { margin: 0; color: rgba(60,52,43,.8); font: 15px/1.6 "PT Serif", Georgia, serif; }

/* Invite card: this is the paperclip card from TeacherDashboard.tsx, not a generic browser dialog. */
.egepon-invite-modal { width: min(500px, 100%); border-radius: 2px; transform: rotate(-.8deg); }
.egepon-invite-modal .egepon-modal-accent { opacity: 0; }
.egepon-invite-result { margin-top: 16px; }
.egepon-invite-result > input { padding: 11px 12px !important; background: #fff !important; font-size: 15px; }
.egepon-invite-copy-row { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
.egepon-invite-copy-row > .egepon-trinket { width: 39px; height: 39px; object-fit: contain; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.35)); transform: rotate(8deg); }
.egepon-invite-hint { margin: 13px 0 0; color: var(--egepon-matcha); text-align: center; font: 700 22px/1.1 Caveat, cursive; }

/* custom calendar/date modal — same paper/card language as the archive */
.egepon-date-field { margin-top: 5px; }
.egepon-date-field > input[type="hidden"] { display: none !important; }
.egepon-date-trigger {
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border: 2px solid rgba(60,52,43,.12);
  border-radius: 9px;
  background: rgba(255,255,255,.8);
  color: var(--egepon-ink) !important;
  cursor: pointer;
  text-align: left;
}
.egepon-date-trigger:hover { border-color: rgba(156,163,98,.55); }
.egepon-date-trigger > span:first-child { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 50%; background: rgba(179,223,235,.34); color: #5b8f9f; }
.egepon-date-trigger .egepon-doodle { width: 19px; height: 19px; }
.egepon-date-trigger > span:last-child { display: flex; min-width: 0; flex-direction: column; }
.egepon-date-trigger small { color: rgba(60,52,43,.45) !important; font: 700 10px/1.1 Inter, sans-serif !important; text-transform: uppercase !important; letter-spacing: .04em !important; }
.egepon-date-trigger b { overflow: hidden; color: var(--egepon-ink); font: 600 13px/1.3 Inter, sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.egepon-date-modal { width: min(460px, 100%); }
.egepon-calendar { margin-top: 18px; }
.egepon-calendar-nav { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; gap: 8px; }
.egepon-calendar-nav b { text-align: center; font: 800 17px/1.2 Inter, sans-serif; text-transform: capitalize; }
.egepon-calendar-nav button { width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255,255,255,.62); color: var(--egepon-ink) !important; cursor: pointer; font-size: 20px; }
.egepon-calendar-nav button:hover { background: #fff; }
.egepon-calendar-weekdays,
.egepon-calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.egepon-calendar-weekdays { margin: 14px 0 6px; }
.egepon-calendar-weekdays span { color: rgba(60,52,43,.45); text-align: center; font: 800 10px/1 Inter, sans-serif; text-transform: uppercase; }
.egepon-calendar-grid button { position: relative; display: grid; aspect-ratio: 1; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--egepon-ink) !important; cursor: pointer; font: 700 13px/1 Inter, sans-serif; }
.egepon-calendar-grid button:hover { background: rgba(255,255,255,.72); }
.egepon-calendar-grid button.muted { color: rgba(60,52,43,.28) !important; }
.egepon-calendar-grid button.today::after { content: ""; position: absolute; bottom: 4px; width: 4px; height: 4px; border-radius: 50%; background: var(--egepon-cherry); }
.egepon-calendar-grid button.selected { background: var(--egepon-matcha); color: #fff !important; box-shadow: 0 4px 10px -3px rgba(60,52,43,.4); transform: rotate(-3deg); }
.egepon-calendar-grid button.selected::after { background: #fff; }
.egepon-time-choice { margin: 16px auto 0 !important; max-width: 190px; text-align: center; }
.egepon-time-choice input { text-align: center; }

/* Add lesson modal: structure and decorative selectors follow AddLesson.tsx from the archive. */
.egepon-lesson-modal { width: min(690px, calc(100vw - 44px)); padding-top: 39px; }
.egepon-lesson-layout { display: grid; grid-template-columns: minmax(0,1fr) 190px; gap: 18px; align-items: start; }
.egepon-lesson-fields > label { margin-bottom: 13px; }
.egepon-segmented { display: inline-flex; margin-bottom: 14px; padding: 4px; border-radius: 999px; background: rgba(255,255,255,.7); box-shadow: inset 0 0 0 1px rgba(60,52,43,.1); }
.egepon-segmented button { padding: 7px 14px; border: 0; border-radius: 999px; background: transparent; color: rgba(60,52,43,.6) !important; cursor: pointer; font-size: 13px; font-weight: 800; }
.egepon-segmented button.active { background: var(--egepon-matcha); color: #fff !important; }
.egepon-fields-three { display: grid; grid-template-columns: 1.15fr .8fr .8fr; gap: 9px; }
.egepon-fields-three label { min-width: 0; }
.egepon-paper-picker > input,
.egepon-bead-picker > input { display: none !important; }
.egepon-paper-picker > span,
.egepon-bead-picker > span { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 6px; }
.egepon-paper-picker button { width: 36px; height: 36px; padding: 0; border: 1px solid rgba(60,52,43,.15); border-radius: 8px; background: var(--swatch); cursor: pointer; transition: transform .12s; }
.egepon-paper-picker button:hover { transform: translateY(-2px); }
.egepon-paper-picker button.active { outline: 2.5px solid var(--egepon-ink); outline-offset: 1px; }
.egepon-bead-picker button { display: grid; width: 40px; height: 40px; padding: 3px; place-items: center; border: 0; border-radius: 9px; background: rgba(255,255,255,.38); cursor: pointer; }
.egepon-bead-picker button.active { background: #fff; box-shadow: 0 3px 8px -2px rgba(60,52,43,.4); }
.egepon-bead-picker .egepon-trinket { width: 30px; height: 30px; object-fit: contain; filter: drop-shadow(1px 2px 2px rgba(60,52,43,.35)); }
.egepon-lesson-preview > p { margin: 0 0 7px; color: rgba(60,52,43,.45); font: 800 11px/1 Inter, sans-serif; letter-spacing: .035em; text-transform: uppercase; }
.egepon-preview-board { padding: 16px 12px 15px; border-radius: 9px; background: #fffdf7; box-shadow: inset 0 0 0 1px rgba(60,52,43,.06); }
.egepon-preview-paper { --preview-paper: #FEEBB6; position: relative; display: flex; width: 154px; min-height: 80px; margin: 2px auto 0; gap: 7px; padding: 18px 12px 10px 38px; border-radius: 6px; background: var(--preview-paper); box-shadow: 2px 4px 7px rgba(60,52,43,.26); transform: rotate(-1.5deg); }
.egepon-preview-tape { position: absolute; top: -8px; left: 50%; width: 56px; height: 17px; background: rgba(254,213,125,.85); box-shadow: 0 1px 2px rgba(0,0,0,.12); transform: translateX(-50%) rotate(-3deg); }
.egepon-preview-tape::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,.25) 0 7px, transparent 7px 14px); }
.egepon-preview-bead { position: absolute; top: 22px; left: 10px; }
.egepon-preview-bead .egepon-trinket { width: 24px; height: 24px; object-fit: contain; filter: drop-shadow(1px 2px 2px rgba(60,52,43,.38)); transform: rotate(-8deg); }
.egepon-preview-paper div { min-width: 0; }
.egepon-preview-paper b { display: block; overflow-wrap: anywhere; font: 700 12px/1.2 "PT Serif", Georgia, serif; }
.egepon-preview-paper small { display: block; margin-top: 2px; color: rgba(60,52,43,.55); font: 700 9px/1.25 Inter, sans-serif; }
.egepon-preview-paper em { display: block; margin-top: 2px; color: rgba(60,52,43,.7); font: italic 10px/1.25 "PT Serif", Georgia, serif; }
.egepon-preview-note { display: block; margin-top: 13px; color: var(--egepon-matcha); text-align: center; font: 700 20px/1.05 Caveat, cursive; }
.egepon-lesson-more { margin: 12px 0 2px; padding-top: 10px; border-top: 1px dashed rgba(60,52,43,.14); }
.egepon-lesson-more summary { color: rgba(60,52,43,.62); cursor: pointer; font: 800 12px/1.4 Inter, sans-serif; text-transform: uppercase; letter-spacing: .035em; }
.egepon-lesson-more[open] summary { margin-bottom: 12px; }
.egepon-lesson-more .egepon-check { display: flex; align-items: center; gap: 7px; text-transform: none; }
.egepon-lesson-more .egepon-check input { width: auto; margin: 0; }

/* Physical bead on lesson paper in the planner. */
.egepon-event { position: relative; padding-left: 36px !important; }
.egepon-event-bead { position: absolute; top: 17px; left: 8px; z-index: 3; }
.egepon-event-bead .egepon-trinket { width: 23px; height: 23px; object-fit: contain; filter: drop-shadow(1px 2px 2px rgba(60,52,43,.38)); transform: rotate(-8deg); }
.egepon-event.deadline { padding-left: 12px !important; }
.egepon-review-student { display: flex; align-items: center; gap: 10px; margin: 15px 0; }
.egepon-review-student .egepon-trinket { width: 42px; height: 42px; object-fit: contain; filter: drop-shadow(1px 3px 3px rgba(60,52,43,.35)); }
.egepon-review-student b,
.egepon-review-student small { display: block; }
.egepon-review-student small { color: rgba(60,52,43,.52); }

.egepon-teacher-modal { width: min(600px, 100%); }
.egepon-teacher-trinkets { margin-top: 4px; }
.egepon-teacher-trinkets .egepon-trinket-grid { grid-template-columns: repeat(8, 1fr); }

@media (max-width: 760px) {
  .egepon-lesson-modal { width: 100%; }
  .egepon-lesson-layout { grid-template-columns: 1fr; }
  .egepon-lesson-preview { order: -1; }
  .egepon-preview-board { display: flex; align-items: center; gap: 12px; }
  .egepon-preview-note { margin: 0; flex: 1; }
  .egepon-fields-three { grid-template-columns: 1fr 1fr; }
  .egepon-fields-three > label:first-child { grid-column: 1 / -1; }
  .egepon-teacher-trinkets .egepon-trinket-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ===== 0.3.1 · polished fields, Russian time zones, safe preview ===== */
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.egepon-app select,
.egepon-app textarea {
  width: 100% !important;
  min-height: 44px !important;
  margin-top: 6px !important;
  padding: 10px 13px !important;
  border: 2px solid rgba(60,52,43,.12) !important;
  border-radius: 10px !important;
  outline: none !important;
  background-color: rgba(255,253,247,.9) !important;
  color: var(--egepon-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 2px 7px rgba(60,52,43,.04) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease !important;
}
.egepon-app textarea { min-height: 82px !important; resize: vertical; }
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
.egepon-app select:hover,
.egepon-app textarea:hover { border-color: rgba(156,163,98,.42) !important; }
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.egepon-app select:focus,
.egepon-app textarea:focus {
  border-color: var(--egepon-matcha) !important;
  background-color: #fff !important;
  box-shadow: 0 0 0 3px rgba(156,163,98,.12), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.egepon-app input[readonly] { background-color: rgba(239,237,218,.62) !important; color: rgba(60,52,43,.68) !important; }
.egepon-app select {
  -webkit-appearance: none !important;
  appearance: none !important;
  padding-right: 40px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23645b52' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 18px 18px !important;
}
.egepon-app input[type="file"] {
  width: 100%;
  padding: 8px;
  border: 2px dashed rgba(60,52,43,.16);
  border-radius: 10px;
  background: rgba(255,253,247,.72);
  color: rgba(60,52,43,.7);
}
.egepon-app input[type="file"]::file-selector-button {
  margin-right: 10px;
  padding: 8px 12px;
  border: 0;
  border-radius: 8px;
  background: var(--egepon-rainy);
  color: var(--egepon-ink);
  cursor: pointer;
  font-weight: 800;
}
.egepon-app input[type="checkbox"] {
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  flex: 0 0 19px;
  -webkit-appearance: none;
  appearance: none;
  border: 2px solid rgba(60,52,43,.25);
  border-radius: 5px;
  background: #fffdf7;
  cursor: pointer;
  vertical-align: middle;
}
.egepon-app input[type="checkbox"]:checked {
  border-color: var(--egepon-matcha);
  background-color: var(--egepon-matcha);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4L19 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}
.egepon-modal form > label,
.egepon-modal .egepon-fields-two > label,
.egepon-modal .egepon-fields-three > label,
.egepon-modal .egepon-lesson-fields > label:not(.egepon-check),
.egepon-profile-card form > label {
  display: flex !important;
  min-width: 0;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0;
}
.egepon-modal fieldset,
.egepon-profile-card fieldset {
  border-color: rgba(60,52,43,.14) !important;
  background: rgba(255,255,255,.18);
}
.egepon-modal small[data-timezone-note],
.egepon-profile-card small[data-timezone-note],
.egepon-target-timezone {
  margin-top: 6px !important;
  color: rgba(60,52,43,.52) !important;
  font: 600 11px/1.35 Inter, system-ui, sans-serif !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* custom, non-system time fields */
.egepon-time-field { width: 100%; margin-top: 5px; }
.egepon-time-field > input[type="hidden"] { display: none !important; }
.egepon-time-trigger {
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border: 2px solid rgba(60,52,43,.12);
  border-radius: 9px;
  background: rgba(255,255,255,.82);
  color: var(--egepon-ink) !important;
  cursor: pointer;
  text-align: left;
  box-shadow: 0 2px 7px rgba(60,52,43,.04);
}
.egepon-time-trigger:hover { border-color: rgba(156,163,98,.55); }
.egepon-time-trigger > span:first-child { display: grid; width: 31px; height: 31px; flex: 0 0 31px; place-items: center; border-radius: 50%; background: rgba(254,213,125,.34); color: #8b6d31; }
.egepon-time-trigger .egepon-doodle { width: 18px; height: 18px; }
.egepon-time-trigger > span:last-child { display: flex; min-width: 0; flex-direction: column; }
.egepon-time-trigger small { color: rgba(60,52,43,.45) !important; font: 700 10px/1.1 Inter, sans-serif !important; text-transform: uppercase !important; letter-spacing: .04em !important; }
.egepon-time-trigger b { color: var(--egepon-ink); font: 700 14px/1.3 Inter, sans-serif; }
.egepon-time-modal { width: min(520px, 100%); }
.egepon-time-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 17px; }
.egepon-time-picker > div > p { margin: 0 0 8px; color: rgba(60,52,43,.48); font: 800 11px/1 Inter, sans-serif; text-transform: uppercase; letter-spacing: .04em; }
.egepon-time-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.egepon-time-grid.minutes { grid-template-columns: repeat(3, 1fr); }
.egepon-time-grid button {
  min-height: 35px;
  border: 0;
  border-radius: 9px;
  background: rgba(255,255,255,.62);
  color: var(--egepon-ink) !important;
  cursor: pointer;
  font-weight: 800;
}
.egepon-time-grid button:hover { background: #fff; }
.egepon-time-grid button.active { background: var(--egepon-matcha); color: #fff !important; box-shadow: 0 4px 10px -4px rgba(60,52,43,.45); transform: rotate(-2deg); }
.egepon-time-result { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 2px; padding: 11px; border-top: 1px dashed rgba(60,52,43,.14); color: var(--egepon-matcha); }
.egepon-time-result .egepon-doodle { width: 21px; height: 21px; }
.egepon-time-result b { font: 800 25px/1 Inter, sans-serif; }
.egepon-time-choice { max-width: 220px !important; }

/* lesson modal: stable layout and preview that never escapes its frame */
.egepon-lesson-modal { width: min(820px, calc(100vw - 48px)); }
.egepon-lesson-layout { grid-template-columns: minmax(0, 1fr) 220px; gap: 24px; }
.egepon-lesson-fields > label { width: 100%; }
.egepon-fields-three { align-items: start; }
.egepon-preview-board { min-width: 0; overflow: hidden; padding: 19px 16px 21px; }
.egepon-preview-paper { width: calc(100% - 12px); max-width: 154px; margin-inline: auto; }
.egepon-preview-note { padding-inline: 4px; }

.egepon-static-field {
  margin: 0 0 15px;
  padding: 12px 14px;
  border: 2px dashed rgba(156,163,98,.28);
  border-radius: 10px;
  background: rgba(233,235,211,.35);
}
.egepon-static-field > span,
.egepon-static-field > b,
.egepon-static-field > small { display: block; }
.egepon-static-field > span { color: rgba(60,52,43,.5); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.egepon-static-field > b { margin-top: 3px; font: 700 17px/1.25 "PT Serif", Georgia, serif; }
.egepon-static-field > small { margin-top: 4px; color: rgba(60,52,43,.5); font-size: 11px; }

/* logout lives in the left menu and uses WordPress' nonce-protected logout URL */
.egepon-shell nav .egepon-nav-logout {
  position: relative;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(198,42,41,.7) !important;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
}
.egepon-shell nav .egepon-nav-logout:hover { color: var(--egepon-cherry) !important; }
.egepon-shell nav .egepon-nav-logout::before { content: "↪"; margin-right: 7px; font-family: Georgia, serif; }

@media (max-width: 760px) {
  .egepon-time-picker { grid-template-columns: 1fr; }
  .egepon-time-result { grid-column: 1; }
  .egepon-lesson-modal { width: 100%; }
}

/* Keep browser-native chrome out of the scrapbook forms. */
.egepon-app input[type="number"] { -moz-appearance: textfield; }
.egepon-app input[type="number"]::-webkit-outer-spin-button,
.egepon-app input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.egepon-app input:-webkit-autofill,
.egepon-app input:-webkit-autofill:hover,
.egepon-app input:-webkit-autofill:focus,
.egepon-app textarea:-webkit-autofill,
.egepon-app select:-webkit-autofill {
  -webkit-text-fill-color: var(--egepon-ink, #37322b) !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(255,253,247,.96) inset !important;
  transition: background-color 9999s ease-out 0s;
}
.egepon-app input::placeholder,
.egepon-app textarea::placeholder { color: rgba(75,70,62,.50); opacity: 1; }
.egepon-app input:disabled,
.egepon-app select:disabled,
.egepon-app textarea:disabled { opacity: .68; cursor: not-allowed; }


/* ===== 0.3.2 · logout hotfix + stronger field reset ===== */
.egepon-shell nav .egepon-nav-logout:disabled { opacity: .55; cursor: wait; }
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.egepon-app textarea,
.egepon-app select {
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* ======================================================================
   0.4.0 · notebook calendar + handcrafted controls
   ====================================================================== */

/* Keep the ruled notebook sheet continuous underneath the menu as in the
   original design archive.  The side menu must feel drawn on the same page,
   not like a separate opaque panel. */
.egepon-app {
  --egepon-rule: rgba(120,130,150,.105);
  --egepon-margin-red: rgba(198,42,41,.55);
  background-color: #fff !important;
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 31px,
    var(--egepon-rule) 31px,
    var(--egepon-rule) 32px
  ) !important;
  background-attachment: local;
}
.egepon-shell,
.egepon-shell main,
#egepon-view { background: transparent !important; }
.egepon-shell aside {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}
.egepon-top {
  background: rgba(255,255,255,.68) !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
  border-bottom-color: rgba(60,52,43,.045) !important;
}
/* red notebook margin separating navigation and the writing area */
.egepon-redline {
  left: 196px !important;
  width: 2px !important;
  background: var(--egepon-margin-red) !important;
  box-shadow: 1px 0 0 rgba(198,42,41,.06);
}

/* Hand-drawn active navigation ring, close to ScribbleCircle from Shell.tsx. */
.egepon-shell nav a,
.egepon-shell nav button { position: relative; isolation: isolate; }
.egepon-shell nav a.active::after {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: -8px -14px -7px -13px !important;
  width: auto !important;
  height: auto !important;
  border: 2.3px solid #C62A29 !important;
  border-radius: 47% 53% 49% 51% / 56% 43% 57% 44% !important;
  background: transparent !important;
  transform: rotate(-2.1deg) !important;
  opacity: .96 !important;
  pointer-events: none;
}
.egepon-shell nav a.active::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -6px -12px -8px -15px;
  border: 1.7px solid rgba(198,42,41,.48);
  border-left-color: transparent;
  border-bottom-color: transparent;
  border-radius: 52% 48% 55% 45% / 48% 58% 42% 52%;
  transform: rotate(2.4deg);
  pointer-events: none;
}

/* ---------------- Handcrafted form controls ---------------- */
/* WordPress/theme/browser rules are deliberately beaten with specificity +
   !important here: these controls belong to the scrapbook UI, not the host
   theme. */
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
.egepon-app textarea,
.egepon-app select {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 5px 0 0 !important;
  padding: 10px 13px !important;
  border: 2px solid rgba(60,52,43,.115) !important;
  border-radius: 10px !important;
  outline: none !important;
  background: rgba(255,253,247,.91) !important;
  background-image: none !important;
  color: var(--egepon-ink, #37322b) !important;
  font: 600 14px/1.35 Inter, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  box-shadow: 0 2px 7px rgba(58,45,28,.035), inset 0 1px 0 rgba(255,255,255,.72) !important;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}
.egepon-app textarea {
  min-height: 88px !important;
  resize: vertical !important;
  line-height: 1.5 !important;
}
.egepon-app select {
  padding-right: 38px !important;
  cursor: pointer !important;
  background-color: rgba(255,253,247,.91) !important;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(60,52,43,.55) 50%),
    linear-gradient(135deg, rgba(60,52,43,.55) 50%, transparent 50%) !important;
  background-position: calc(100% - 18px) 19px, calc(100% - 12px) 19px !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: no-repeat !important;
}
.egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
.egepon-app textarea:focus,
.egepon-app select:focus {
  border-color: rgba(156,163,98,.88) !important;
  background-color: #fffdf8 !important;
  box-shadow: 0 0 0 3px rgba(156,163,98,.12), 0 4px 10px rgba(58,45,28,.05) !important;
}
.egepon-app input[readonly] {
  background: rgba(255,250,236,.77) !important;
  border-style: dashed !important;
  color: rgba(55,50,43,.82) !important;
}
.egepon-app input[type="file"] {
  width: 100% !important;
  padding: 9px !important;
  border: 2px dashed rgba(156,163,98,.32) !important;
  border-radius: 11px !important;
  background: rgba(255,253,247,.72) !important;
  color: rgba(55,50,43,.72) !important;
  font: 600 13px/1.35 Inter, system-ui, sans-serif !important;
}
.egepon-app input[type="file"]::file-selector-button {
  margin-right: 10px;
  padding: 8px 12px;
  border: 0;
  border-radius: 8px;
  background: #E9EBD3;
  color: #52553a;
  font-weight: 800;
  cursor: pointer;
}
.egepon-modal label,
.egepon-profile-card label,
.egepon-builder > label {
  color: rgba(60,52,43,.58) !important;
  font: 800 11px/1.25 Inter, system-ui, sans-serif !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
}
.egepon-modal label small,
.egepon-profile-card label small,
.egepon-builder label small {
  display: block;
  margin-top: 5px;
  color: rgba(60,52,43,.5) !important;
  font: 600 11px/1.35 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.egepon-modal fieldset,
.egepon-profile-card fieldset {
  min-width: 0 !important;
  padding: 14px !important;
  border: 1px dashed rgba(60,52,43,.18) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.18) !important;
}
.egepon-modal fieldset > legend,
.egepon-profile-card fieldset > legend {
  padding: 0 9px !important;
  color: var(--egepon-ink) !important;
  font: 700 21px/1.1 Caveat, "Segoe Print", cursive !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.egepon-required,
.egepon-optional {
  display: inline-block;
  margin-left: 5px;
  vertical-align: 1px;
  font: 800 9px/1 Inter, system-ui, sans-serif !important;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.egepon-required { color: rgba(198,42,41,.68); }
.egepon-optional { color: rgba(60,52,43,.35); }

/* Password field should look like one crafted field instead of a browser box. */
.egepon-password-wrap {
  overflow: hidden;
  margin-top: 5px;
  border: 2px solid rgba(60,52,43,.115) !important;
  border-radius: 10px !important;
  background: rgba(255,253,247,.91) !important;
  box-shadow: 0 2px 7px rgba(58,45,28,.035) !important;
}
.egepon-password-wrap:focus-within { border-color: rgba(156,163,98,.88) !important; box-shadow: 0 0 0 3px rgba(156,163,98,.12) !important; }
.egepon-password-wrap input { margin: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.egepon-password-toggle { border: 0 !important; background: transparent !important; }

/* ---------------- Searchable Russian city picker ---------------- */
.egepon-city-picker {
  position: relative;
  z-index: 8;
  width: 100%;
  margin-top: 4px;
  text-transform: none;
  letter-spacing: 0;
}
.egepon-city-control { position: relative; }
.egepon-city-picker .egepon-city-control > input[data-city-input] {
  margin-top: 0 !important;
  padding-left: 42px !important;
  padding-right: 40px !important;
}
.egepon-city-pin {
  position: absolute;
  z-index: 2;
  left: 12px;
  top: 50%;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  color: #74a9b8;
  pointer-events: none;
}
.egepon-city-pin .egepon-doodle { width: 20px; height: 20px; }
.egepon-city-toggle {
  position: absolute !important;
  z-index: 3;
  right: 5px !important;
  top: 50% !important;
  width: 33px !important;
  height: 33px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: rgba(60,52,43,.52) !important;
  font: 900 20px/1 Inter, sans-serif !important;
  transform: translateY(-50%) !important;
  cursor: pointer;
}
.egepon-city-toggle:hover { background: rgba(156,163,98,.11) !important; }
.egepon-city-zone {
  display: block;
  margin: 6px 2px 0 !important;
  color: rgba(60,52,43,.48) !important;
  font: 650 11px/1.35 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.egepon-city-menu {
  position: absolute;
  z-index: 120;
  top: calc(100% - 18px);
  left: 0;
  right: 0;
  overflow: auto;
  max-height: 285px;
  padding: 7px;
  border: 1px solid rgba(60,52,43,.12);
  border-radius: 12px;
  background-color: #f7f0df;
  background-image: repeating-linear-gradient(48deg, rgba(120,90,55,.035) 0 3px, transparent 3px 7px);
  box-shadow: 0 18px 34px -16px rgba(40,26,12,.55);
  transform: rotate(-.15deg);
}
.egepon-city-menu[hidden] { display: none !important; }
.egepon-city-menu button {
  display: grid !important;
  width: 100% !important;
  min-height: 0 !important;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px !important;
  border: 0 !important;
  border-bottom: 1px dashed rgba(60,52,43,.09) !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--egepon-ink) !important;
  text-align: left !important;
  cursor: pointer;
}
.egepon-city-menu button:last-child { border-bottom: 0 !important; }
.egepon-city-menu button:hover,
.egepon-city-menu button:focus { background: rgba(233,235,211,.72) !important; outline: none !important; }
.egepon-city-menu button span { font: 800 13px/1.2 Inter, system-ui, sans-serif; }
.egepon-city-menu button small { color: rgba(60,52,43,.45) !important; font: 650 10px/1.2 Inter, system-ui, sans-serif !important; }
.egepon-city-menu p { margin: 5px; padding: 10px; color: rgba(60,52,43,.55); font-size: 12px; }

/* ---------------- Modal typography and proportions ---------------- */
.egepon-modal {
  max-height: calc(100vh - 36px) !important;
  overflow: visible !important;
}
.egepon-modal-card {
  border-radius: 14px !important;
  background-color: #f3ead6 !important;
  background-image: repeating-linear-gradient(48deg, rgba(120,90,55,.045) 0 3px, transparent 3px 7px) !important;
  box-shadow: 0 30px 50px -18px rgba(40,26,12,.55) !important;
}
.egepon-modal-head { padding-right: 38px !important; }
.egepon-modal-head h2 {
  margin: 0 !important;
  color: var(--egepon-ink) !important;
  font: 850 27px/1.08 Inter, system-ui, sans-serif !important;
  letter-spacing: -.025em !important;
}
.egepon-modal-head p {
  margin: 4px 0 0 !important;
  color: rgba(60,52,43,.62) !important;
  font: italic 15px/1.35 "PT Serif", Georgia, serif !important;
}
.egepon-modal-body { margin-top: 18px !important; }
.egepon-modal-copy { margin: 0 0 14px; color: rgba(60,52,43,.67); font: 500 14px/1.55 "PT Serif", Georgia, serif; }
.egepon-modal-close {
  width: 31px !important;
  height: 31px !important;
  border-radius: 50% !important;
  color: rgba(60,52,43,.43) !important;
}
.egepon-modal-close:hover { background: rgba(60,52,43,.06) !important; color: rgba(60,52,43,.72) !important; }
.egepon-modal-footer,
.egepon-form-actions {
  border-top-color: rgba(60,52,43,.13) !important;
}
.egepon-teacher-modal { width: min(760px, calc(100vw - 40px)) !important; }
.egepon-group-modal { width: min(640px, calc(100vw - 40px)) !important; }
.egepon-invite-modal { width: min(560px, calc(100vw - 40px)) !important; }
.egepon-choice-modal { width: min(590px, calc(100vw - 40px)) !important; }
.egepon-personal-modal { width: min(620px, calc(100vw - 40px)) !important; }

.egepon-teacher-form { display: grid; gap: 15px; }
.egepon-teacher-form .egepon-fields-two { gap: 14px; }
.egepon-teacher-trinkets { margin-top: 2px !important; }
.egepon-teacher-trinkets .egepon-trinket-grid { grid-template-columns: repeat(8, minmax(48px,1fr)); gap: 8px; }
.egepon-teacher-trinkets .egepon-trinket-grid label { min-height: 62px; }

.egepon-soft-fieldset { margin: 7px 0 0 !important; }
.egepon-radio-cards { display: flex; flex-wrap: wrap; gap: 8px; }
.egepon-radio-card { position: relative; cursor: pointer; }
.egepon-radio-card input { position: absolute !important; opacity: 0 !important; pointer-events: none; }
.egepon-radio-card > span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 12px;
  border: 2px solid rgba(60,52,43,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.58);
  color: rgba(60,52,43,.7);
  font: 750 12px/1 Inter, system-ui, sans-serif;
  text-transform: none;
  letter-spacing: 0;
}
.egepon-radio-card input:checked + span {
  border-color: rgba(156,163,98,.65);
  background: #E9EBD3;
  color: #55583b;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.65);
}
.egepon-student-check-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; max-height: 260px; overflow: auto; }
.egepon-student-check { position: relative; display: grid !important; grid-template-columns: 22px 38px 1fr; align-items: center !important; gap: 8px !important; min-height: 58px; padding: 8px 10px; border: 2px solid rgba(60,52,43,.08); border-radius: 11px; background: rgba(255,255,255,.48); cursor: pointer; text-transform: none !important; letter-spacing: 0 !important; }
.egepon-student-check:has(input:checked) { border-color: rgba(156,163,98,.58); background: rgba(233,235,211,.62); }
.egepon-student-check input { width: 17px !important; height: 17px !important; accent-color: #9ca362; }
.egepon-student-check-trinket .egepon-trinket { width: 34px; height: 34px; }
.egepon-student-check b { display: block; color: var(--egepon-ink); font-size: 12px; text-transform: none; letter-spacing: 0; }
.egepon-student-check small { margin: 2px 0 0 !important; font-size: 10px !important; }

.egepon-event-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.egepon-event-choice > button {
  display: grid !important;
  min-height: 158px !important;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 19px 16px !important;
  border: 2px dashed rgba(60,52,43,.14) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.42) !important;
  color: var(--egepon-ink) !important;
  text-align: center;
  cursor: pointer;
  transform: rotate(-.35deg);
  transition: transform .14s ease, background .14s ease, border-color .14s ease;
}
.egepon-event-choice > button:nth-child(2) { transform: rotate(.4deg); }
.egepon-event-choice > button:hover { transform: rotate(0) translateY(-2px); border-color: rgba(156,163,98,.6) !important; background: rgba(255,255,255,.72) !important; }
.egepon-event-choice .egepon-trinket { width: 42px; height: 42px; }
.egepon-event-choice b { font: 850 17px/1.2 Inter, system-ui, sans-serif; }
.egepon-event-choice small { color: rgba(60,52,43,.52); font: 600 11px/1.35 Inter, system-ui, sans-serif; }

.egepon-invite-result > label { display: block; }
.egepon-invite-copy-row { display: flex; align-items: center; gap: 18px; margin-top: 16px; }
.egepon-invite-copy-row .egepon-trinket { width: 34px; height: 34px; transform: rotate(7deg); }
.egepon-invite-hint { margin: 18px 0 2px; color: var(--egepon-matcha); font: 700 22px/1 Caveat, cursive; text-align: center; }

/* exact-minute input inside the custom clock */
.egepon-exact-time { grid-column: 1 / -1; }
.egepon-exact-time > input { max-width: 160px !important; }
.egepon-exact-time > small { max-width: 300px; }

/* ---------------- Google-Calendar-like weekly planner ---------------- */
.egepon-calendar-planner {
  position: relative;
  overflow: hidden !important;
  padding: 0 !important;
  border: 1px solid rgba(60,52,43,.075) !important;
  border-radius: 18px !important;
  background: rgba(255,252,244,.76) !important;
  box-shadow: 0 14px 30px -24px rgba(50,35,18,.42) !important;
}
.egepon-calendar-head {
  display: grid;
  min-width: 980px;
  min-height: 58px;
  align-items: stretch;
  border-bottom: 1px dashed rgba(156,163,98,.3);
  background: rgba(255,252,244,.88);
}
.egepon-calendar-head > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 9px 4px;
  border-right: 1px solid rgba(60,52,43,.055);
  color: rgba(60,52,43,.76);
}
.egepon-calendar-head > div:first-child { border-right-color: rgba(60,52,43,.085); }
.egepon-calendar-head > div:last-child { border-right: 0; }
.egepon-calendar-head b { font: 750 21px/1 Caveat, cursive; }
.egepon-calendar-head span { display: grid; min-width: 26px; height: 26px; place-items: center; border-radius: 50%; color: rgba(60,52,43,.55); font: 750 11px/1 Inter, sans-serif; }
.egepon-calendar-head .today span { background: var(--egepon-matcha); color: #fff; }
.egepon-calendar-scroll {
  overflow: auto;
  max-height: calc(100vh - 295px);
  min-height: 520px;
  scrollbar-gutter: stable;
}
.egepon-calendar-body {
  display: grid;
  position: relative;
  min-width: 980px;
  height: var(--planner-height);
  align-items: start;
}
.egepon-time-axis {
  position: relative;
  height: var(--planner-height);
  border-right: 1px solid rgba(60,52,43,.09);
  background: rgba(255,252,244,.5);
}
.egepon-time-axis > span {
  position: absolute;
  right: 10px;
  z-index: 4;
  color: rgba(118,124,70,.78);
  font: 750 11px/1 Caveat, cursive;
  transform: translateY(-5px);
  white-space: nowrap;
}
.egepon-calendar-day {
  position: relative;
  height: var(--planner-height);
  overflow: hidden;
  border-right: 1px solid rgba(60,52,43,.055);
  background-color: rgba(255,253,248,.42);
  background-image:
    repeating-linear-gradient(to bottom,
      transparent 0,
      transparent calc(var(--slot-height) - 1px),
      rgba(120,130,150,.06) calc(var(--slot-height) - 1px),
      rgba(120,130,150,.06) var(--slot-height)),
    repeating-linear-gradient(to bottom,
      transparent 0,
      transparent calc(var(--slot-height) * 4 - 1px),
      rgba(156,163,98,.18) calc(var(--slot-height) * 4 - 1px),
      rgba(156,163,98,.18) calc(var(--slot-height) * 4));
}
.egepon-calendar-day:last-child { border-right: 0; }
.egepon-calendar-day.is-editable { cursor: crosshair; }
.egepon-calendar-day.is-editable:hover { background-color: rgba(233,235,211,.08); }

.egepon-calendar-event {
  position: absolute !important;
  z-index: 4;
  left: 5px !important;
  right: 5px !important;
  width: auto !important;
  min-height: 28px !important;
  overflow: hidden;
  padding: 8px 7px 7px 31px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: var(--paper, #FFEEB6) !important;
  color: var(--egepon-ink) !important;
  box-shadow: 0 5px 9px -5px rgba(70,50,25,.34) !important;
  text-align: left !important;
  cursor: pointer;
  transform: rotate(-.35deg);
}
.egepon-calendar-event:nth-of-type(even) { transform: rotate(.28deg); }
.egepon-calendar-event:hover { z-index: 8; filter: saturate(1.03); box-shadow: 0 8px 13px -6px rgba(70,50,25,.42) !important; }
.egepon-calendar-event.personal { border-left: 4px solid rgba(135,116,176,.36) !important; }
.egepon-calendar-event .egepon-tape {
  position: absolute;
  top: -1px;
  left: 44%;
  width: 46px;
  height: 9px;
  background: rgba(254,213,125,.68);
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.26) 0 6px, transparent 6px 12px);
  transform: translateX(-50%) rotate(-2deg);
}
.egepon-calendar-event .egepon-event-bead { position: absolute; left: 6px; top: 9px; }
.egepon-calendar-event .egepon-event-bead .egepon-trinket { width: 20px; height: 20px; }
.egepon-calendar-event b { display: block; overflow: hidden; color: #42392f; font: 800 10.5px/1.2 Inter, sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.egepon-calendar-event small { display: block; overflow: hidden; margin-top: 2px; color: rgba(60,52,43,.55); font: 600 9px/1.25 "PT Serif", Georgia, serif; text-overflow: ellipsis; white-space: nowrap; }
.egepon-calendar-deadline {
  position: absolute !important;
  z-index: 5;
  left: 7px !important;
  right: 7px !important;
  width: auto !important;
  min-height: 28px !important;
  padding: 5px 7px !important;
  border: 1px dashed rgba(198,42,41,.36) !important;
  border-radius: 6px !important;
  background: rgba(255,245,242,.91) !important;
  color: #a23b39 !important;
  text-align: left;
  cursor: pointer;
}
.egepon-calendar-deadline b { display: block; font: 800 9px/1.1 Inter,sans-serif; }
.egepon-calendar-deadline small { display: block; overflow: hidden; margin-top: 2px; font: 600 8px/1.15 Inter,sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.egepon-calendar-selection {
  position: absolute;
  z-index: 3;
  left: 4px;
  right: 4px;
  min-height: 16px;
  padding: 5px 7px;
  border: 2px dashed rgba(125,133,64,.72);
  border-radius: 7px;
  background: rgba(233,235,211,.78);
  color: #656b3b;
  box-shadow: 0 5px 12px -8px rgba(50,40,20,.5);
  pointer-events: none;
}
.egepon-calendar-selection b { display: block; font: 800 10px/1.1 Inter,sans-serif; }
.egepon-calendar-selection span { display: block; margin-top: 2px; font: 600 8px/1.15 Inter,sans-serif; opacity: .72; }
.egepon-week-tools { align-items: center; }
.egepon-week-tools > span { margin-left: auto; color: rgba(60,52,43,.48); font-size: 11px; }
.egepon-week-tools > button {
  min-height: 39px !important;
  padding: 8px 13px !important;
  border: 1px solid rgba(60,52,43,.11) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.68) !important;
  color: rgba(60,52,43,.75) !important;
  font-weight: 750 !important;
}
.egepon-week-tools > button:hover { border-color: rgba(156,163,98,.5) !important; background: #fff !important; }

/* The tiny login trinket should sit to the left of the red stamp, not under it. */
.egepon-auth-actions > .egepon-auth-trinket { left: calc(50% - 118px) !important; transform: translate(-50%,-50%) rotate(-9deg) !important; }

/* Let custom paper menus escape form rows without being clipped. */
.egepon-modal-card,
.egepon-modal-body,
.egepon-teacher-form,
.egepon-fields-two { overflow: visible !important; }

@media (max-width: 1050px) {
  .egepon-redline { left: 166px !important; }
  .egepon-calendar-head,
  .egepon-calendar-body { min-width: 920px; }
}
@media (max-width: 760px) {
  .egepon-redline { left: 18px !important; }
  .egepon-calendar-scroll { min-height: 500px; max-height: calc(100vh - 250px); }
  .egepon-calendar-head,
  .egepon-calendar-body { min-width: 900px; }
  .egepon-student-check-list { grid-template-columns: 1fr; }
  .egepon-event-choice { grid-template-columns: 1fr; }
  .egepon-event-choice > button { min-height: 116px !important; }
  .egepon-teacher-trinkets .egepon-trinket-grid { grid-template-columns: repeat(4,minmax(48px,1fr)); }
  .egepon-modal-head h2 { font-size: 24px !important; }
}

/* Tall dialogs remain scrollable; the paper itself never gets cut off. */
.egepon-overlay { overflow-y: auto !important; }
.egepon-modal {
  max-height: calc(100vh - 48px) !important;
  overflow-x: visible !important;
  overflow-y: auto !important;
}
@media (max-height: 760px) {
  .egepon-overlay { align-items: flex-start !important; }
  .egepon-modal { margin: 8px 0 26px !important; max-height: none !important; overflow: visible !important; }
}

/* Custom paper dropdowns replace the last browser-native SELECT controls. */
.egepon-paper-select { position: relative; z-index: 12; margin-top: 5px; text-transform: none; letter-spacing: 0; }
.egepon-paper-select-trigger {
  display: flex !important;
  width: 100% !important;
  min-height: 44px !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px !important;
  border: 2px solid rgba(60,52,43,.115) !important;
  border-radius: 10px !important;
  background: rgba(255,253,247,.91) !important;
  color: var(--egepon-ink) !important;
  box-shadow: 0 2px 7px rgba(58,45,28,.035) !important;
  text-align: left;
  cursor: pointer;
}
.egepon-paper-select-trigger:hover,
.egepon-paper-select-trigger:focus { border-color: rgba(156,163,98,.72) !important; outline: none; }
.egepon-paper-select-trigger > span { overflow: hidden; font: 650 13px/1.2 Inter,system-ui,sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.egepon-paper-select-trigger > i { color: rgba(60,52,43,.5); font: normal 900 18px/1 Inter,sans-serif; }
.egepon-paper-select-menu {
  position: absolute;
  z-index: 130;
  top: calc(100% + 5px);
  left: 0;
  right: 0;
  overflow: auto;
  max-height: 250px;
  padding: 7px;
  border: 1px solid rgba(60,52,43,.12);
  border-radius: 12px;
  background-color: #f7f0df;
  background-image: repeating-linear-gradient(48deg, rgba(120,90,55,.035) 0 3px, transparent 3px 7px);
  box-shadow: 0 18px 34px -16px rgba(40,26,12,.55);
}
.egepon-paper-select-menu[hidden] { display: none !important; }
.egepon-paper-select-menu button {
  display: grid !important;
  width: 100% !important;
  min-height: 50px !important;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 9px;
  padding: 7px 9px !important;
  border: 0 !important;
  border-bottom: 1px dashed rgba(60,52,43,.1) !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--egepon-ink) !important;
  text-align: left;
  cursor: pointer;
}
.egepon-paper-select-menu button:last-child { border-bottom: 0 !important; }
.egepon-paper-select-menu button:hover { background: rgba(233,235,211,.72) !important; }
.egepon-paper-select-menu .egepon-trinket { width: 31px; height: 31px; }
.egepon-paper-select-menu b { display: block; font: 800 12px/1.2 Inter,sans-serif; }
.egepon-paper-select-menu small { display: block; margin-top: 2px !important; color: rgba(60,52,43,.44) !important; font: 650 9px/1.2 Inter,sans-serif !important; }
.egepon-paper-select-menu p { margin: 2px; padding: 10px; color: rgba(60,52,43,.55); font: 600 12px/1.35 Inter,sans-serif; }
.egepon-target-dot { display: block; width: 25px; height: 25px; margin: auto; border: 2px solid rgba(60,52,43,.1); border-radius: 50%; background: var(--dot,#FEEBB6); box-shadow: inset 0 0 0 3px rgba(255,255,255,.38); }
.egepon-mini-segmented { display: inline-flex !important; margin-top: 7px; padding: 4px; border-radius: 999px; background: rgba(255,255,255,.55); box-shadow: inset 0 0 0 1px rgba(60,52,43,.08); }
.egepon-mini-segmented button { min-height: 34px !important; padding: 7px 13px !important; border: 0 !important; border-radius: 999px !important; background: transparent !important; color: rgba(60,52,43,.58) !important; font: 800 11px/1 Inter,sans-serif !important; cursor: pointer; }
.egepon-mini-segmented button.active { background: var(--egepon-matcha) !important; color: #fff !important; box-shadow: 0 3px 8px rgba(60,52,43,.16); }
.egepon-app input[type="search"]::-webkit-search-decoration,
.egepon-app input[type="search"]::-webkit-search-cancel-button,
.egepon-app input[type="search"]::-webkit-search-results-button,
.egepon-app input[type="search"]::-webkit-search-results-decoration { -webkit-appearance: none; }

/* ======================================================================
   0.4.1 · interface cleanup
   ====================================================================== */

/* The top strip is part of the same notebook page. No glass/blur layer. */
.egepon-top {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Original ModalShell lets the physical fastener sit outside the paper.
   Scroll the overlay, never the paper itself, so tape/clips/buttons are not cut. */
.egepon-overlay {
  overflow: auto !important;
  align-items: flex-start !important;
  padding: 46px 28px 38px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.egepon-modal,
.egepon-modal.wide {
  flex: 0 0 auto;
  max-height: none !important;
  margin: auto 0 !important;
  overflow: visible !important;
  padding-top: 40px !important;
}
.egepon-modal-body {
  overflow: visible !important;
}
.egepon-modal-washi,
.egepon-paperclip,
.egepon-modal-bead {
  clip-path: none !important;
  overflow: visible !important;
}
.egepon-modal > h2 {
  font-size: 28px !important;
  line-height: 1.08 !important;
}
.egepon-modal-subtitle {
  margin-top: 4px !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
}

/* The planner card must not crop the scrapbook decorations hanging over it. */
.egepon-calendar-planner {
  overflow: visible !important;
}
.egepon-calendar-head {
  overflow: hidden;
  border-radius: 17px 17px 0 0;
}
.egepon-calendar-scroll {
  overflow: auto !important;
  border-radius: 0 0 17px 17px;
}
.egepon-planner::before,
.egepon-planner::after {
  z-index: 12 !important;
}

/* Larger readable time rail. Keep 08:00 and 23:00 inside the viewport. */
.egepon-time-axis > span {
  right: 12px !important;
  color: rgba(92,99,49,.86) !important;
  font: 800 15px/1 Caveat, "Segoe Print", cursive !important;
  transform: translateY(-7px) !important;
}
.egepon-time-axis > span.first { transform: translateY(7px) !important; }
.egepon-time-axis > span.last { transform: translateY(-18px) !important; }

/* Strong final reset: the host WordPress theme must never paint black browser
   borders over scrapbook fields. We draw the border with an inset shadow. */
body .egepon-app .egepon-modal input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
body .egepon-app .egepon-modal textarea,
body .egepon-app .egepon-profile-card input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
body .egepon-app .egepon-profile-card textarea,
body .egepon-app .egepon-builder input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
body .egepon-app .egepon-builder textarea,
body .egepon-app input.egepon-exact-time-input {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 0 !important;
  border-radius: 10px !important;
  outline: 0 !important;
  background: rgba(255,253,247,.94) !important;
  color: var(--egepon-ink) !important;
  box-shadow:
    inset 0 0 0 1.5px rgba(60,52,43,.13),
    inset 0 1px 0 rgba(255,255,255,.9),
    0 2px 7px rgba(58,45,28,.045) !important;
}
body .egepon-app .egepon-modal input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
body .egepon-app .egepon-modal textarea:focus,
body .egepon-app .egepon-profile-card input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
body .egepon-app .egepon-profile-card textarea:focus,
body .egepon-app .egepon-builder input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
body .egepon-app .egepon-builder textarea:focus {
  box-shadow:
    inset 0 0 0 2px rgba(156,163,98,.78),
    0 0 0 3px rgba(156,163,98,.10),
    0 3px 8px rgba(58,45,28,.05) !important;
}

/* Handcrafted checkbox used in repeat, homework recipients, groups, etc. */
body .egepon-app input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  position: relative;
  display: inline-grid !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  margin: 0 8px 0 0 !important;
  padding: 0 !important;
  place-items: center;
  vertical-align: -4px;
  border: 0 !important;
  border-radius: 6px !important;
  outline: 0 !important;
  background: rgba(255,253,247,.95) !important;
  box-shadow: inset 0 0 0 1.7px rgba(60,52,43,.20), 0 2px 5px rgba(58,45,28,.05) !important;
  cursor: pointer;
}
body .egepon-app input[type="checkbox"]::after {
  content: "✓";
  color: #fff;
  font: 900 14px/1 Inter, sans-serif;
  opacity: 0;
  transform: rotate(-7deg) scale(.7);
  transition: .12s ease;
}
body .egepon-app input[type="checkbox"]:checked {
  background: var(--egepon-matcha) !important;
  box-shadow: inset 0 0 0 1.7px rgba(82,88,47,.18), 0 3px 7px rgba(58,45,28,.10) !important;
}
body .egepon-app input[type="checkbox"]:checked::after {
  opacity: 1;
  transform: rotate(-7deg) scale(1);
}
/* Trinket radios stay intentionally invisible; their card is the control. */
.egepon-trinket-grid input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none;
}

/* Exact-minute field in the custom clock looks like the rest of the paper UI. */
.egepon-exact-time > input {
  min-height: 46px !important;
  max-width: 180px !important;
  padding: 10px 13px !important;
  font-size: 16px !important;
  font-weight: 750 !important;
}

/* Save state is useful, but it is not a subtitle under the section name. */
.egepon-save-status {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 11px;
  border: 1px dashed rgba(156,163,98,.34);
  border-radius: 999px;
  background: rgba(233,235,211,.48);
  color: rgba(60,52,43,.55);
  font-size: 11px;
  font-weight: 750;
}

@media (max-width: 760px) {
  .egepon-overlay { padding: 38px 12px 24px !important; }
  .egepon-modal, .egepon-modal.wide { margin: auto 0 !important; overflow: visible !important; }
}

/* Final all-screens field treatment: login, modal, profile and builders share
   the same soft paper control instead of native black browser rectangles. */
body.egepon-platform-page .egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
body.egepon-platform-page .egepon-app textarea {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 0 !important;
  border-radius: 10px !important;
  outline: 0 !important;
  background: rgba(255,253,247,.94) !important;
  color: var(--egepon-ink) !important;
  box-shadow: inset 0 0 0 1.5px rgba(60,52,43,.13), inset 0 1px 0 rgba(255,255,255,.9), 0 2px 7px rgba(58,45,28,.045) !important;
}
body.egepon-platform-page .egepon-app input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
body.egepon-platform-page .egepon-app textarea:focus {
  box-shadow: inset 0 0 0 2px rgba(156,163,98,.80), 0 0 0 3px rgba(156,163,98,.10), 0 3px 8px rgba(58,45,28,.05) !important;
}

/* ======================================================================
   0.5.0 · student dashboard + final craft UI pass
   ====================================================================== */

/* Natural scrolling stays available, but the browser rails are invisible. */
html:has(body.egepon-platform-page),
body.egepon-platform-page,
.egepon-app,
.egepon-overlay,
.egepon-calendar-scroll,
.egepon-paper-select-menu,
.egepon-city-menu,
.egepon-student-check-list {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
html:has(body.egepon-platform-page)::-webkit-scrollbar,
body.egepon-platform-page::-webkit-scrollbar,
.egepon-app::-webkit-scrollbar,
.egepon-overlay::-webkit-scrollbar,
.egepon-calendar-scroll::-webkit-scrollbar,
.egepon-paper-select-menu::-webkit-scrollbar,
.egepon-city-menu::-webkit-scrollbar,
.egepon-student-check-list::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }

/* Modals are appended to <body>, outside .egepon-app. Style their fields here too,
   otherwise a WordPress/browser native black border leaks through. */
body.egepon-platform-page .egepon-overlay input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
body.egepon-platform-page .egepon-overlay textarea,
body.egepon-platform-page .egepon-overlay select {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 5px 0 0 !important;
  padding: 10px 13px !important;
  border: 0 !important;
  border-radius: 10px !important;
  outline: 0 !important;
  background: rgba(255,253,247,.96) !important;
  background-image: none !important;
  color: var(--egepon-ink) !important;
  font: 600 14px/1.35 Inter, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  box-shadow: inset 0 0 0 1.5px rgba(60,52,43,.13), inset 0 1px 0 rgba(255,255,255,.9), 0 2px 7px rgba(58,45,28,.045) !important;
}
body.egepon-platform-page .egepon-overlay textarea { min-height: 86px !important; resize: vertical !important; }
body.egepon-platform-page .egepon-overlay input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
body.egepon-platform-page .egepon-overlay textarea:focus,
body.egepon-platform-page .egepon-overlay select:focus {
  box-shadow: inset 0 0 0 2px rgba(156,163,98,.76), 0 0 0 3px rgba(156,163,98,.1), 0 3px 8px rgba(58,45,28,.05) !important;
}
body.egepon-platform-page .egepon-overlay label {
  color: rgba(60,52,43,.58) !important;
  font: 800 11px/1.25 Inter, system-ui, sans-serif !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
}
body.egepon-platform-page .egepon-overlay label small { text-transform: none !important; letter-spacing: 0 !important; }

/* Login and invite-registration fields have exactly one frame and exactly one fill.
   The password wrapper no longer adds a second mismatched box. */
.egepon-auth-card input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]) {
  min-height: 52px !important;
  margin-top: 6px !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: rgba(221,238,250,.78) !important;
  box-shadow: inset 0 0 0 2px rgba(80,108,125,.13), 0 3px 8px rgba(58,45,28,.045) !important;
}
.egepon-auth-card input:-webkit-autofill,
.egepon-auth-card input:-webkit-autofill:hover,
.egepon-auth-card input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--egepon-ink) !important;
  -webkit-box-shadow: 0 0 0 1000px #e8f3fb inset, inset 0 0 0 2px rgba(80,108,125,.13) !important;
}
.egepon-auth-card .egepon-password-wrap {
  overflow: visible !important;
  margin-top: 6px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.egepon-auth-card .egepon-password-wrap input {
  margin: 0 !important;
  padding-right: 50px !important;
  background: rgba(221,238,250,.78) !important;
  box-shadow: inset 0 0 0 2px rgba(80,108,125,.13), 0 3px 8px rgba(58,45,28,.045) !important;
}
.egepon-auth-card .egepon-password-wrap:focus-within { box-shadow: none !important; }
.egepon-auth-card .egepon-password-wrap:focus-within input { box-shadow: inset 0 0 0 2px rgba(156,163,98,.76), 0 0 0 3px rgba(156,163,98,.1) !important; }

/* Page titles use one rhythm everywhere, and their baseline lines up with the
   brand in the left notebook margin. */
.egepon-shell { padding-top: 82px !important; }
.egepon-shell aside { padding-top: 82px !important; }
.egepon-brand {
  margin: 0 0 42px !important;
  font-size: 34px !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
}
.egepon-page-head { min-height: 38px; align-items: center !important; margin-bottom: 24px !important; }
.egepon-page-head h1 {
  margin: 0 !important;
  font-size: 34px !important;
  line-height: 1 !important;
  letter-spacing: -.04em !important;
}

/* Bigger craft fasteners in modal windows. */
.egepon-paperclip { width: 38px !important; height: 84px !important; top: -22px !important; left: 31px !important; }
.egepon-modal-washi { width: 92px !important; height: 24px !important; top: -11px !important; }
.egepon-modal-bead { width: 52px !important; height: 52px !important; top: -23px !important; }
.egepon-modal-bead .egepon-trinket { width: 52px !important; height: 52px !important; }
.egepon-bead-picker button { width: 47px !important; height: 47px !important; }
.egepon-bead-picker .egepon-trinket { width: 37px !important; height: 37px !important; }
.egepon-success-copy .egepon-trinket { width: 50px !important; height: 50px !important; }

/* Lesson preview: centred sticker, tape colour follows paper, no floating note. */
.egepon-lesson-preview > p { margin: 0 0 9px !important; text-align: center; }
.egepon-preview-board {
  display: grid !important;
  min-height: 180px !important;
  place-items: center !important;
  overflow: visible !important;
  padding: 26px 18px !important;
}
.egepon-preview-paper { margin: 0 auto !important; transform-origin: center !important; }
.egepon-preview-tape { background: var(--preview-tape, rgba(179,223,235,.92)) !important; }
.egepon-preview-bead .egepon-trinket { width: 29px !important; height: 29px !important; }

/* The final time is editable directly; there is no redundant "Точное время" block. */
.egepon-time-result-editable { min-height: 64px; }
body.egepon-platform-page .egepon-overlay input.egepon-time-manual {
  width: 112px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  text-align: center !important;
  color: var(--egepon-matcha) !important;
  font: 800 24px/1 Inter, sans-serif !important;
  background: rgba(255,255,255,.72) !important;
}
.egepon-exact-time { display: none !important; }

/* Notifications: quiet, compact paper list. */
.egepon-notifications-modal { width: min(560px, calc(100vw - 36px)) !important; }
.egepon-notifications article { padding: 11px 13px !important; }
.egepon-notifications article b { display: block; font: 800 14px/1.3 Inter, sans-serif !important; }
.egepon-notifications article p { margin: 3px 0 !important; font: 500 13px/1.4 Inter, sans-serif !important; }
.egepon-notifications article small { font: 600 10px/1.3 Inter, sans-serif !important; }

/* Purple stamp is used for overdue student work. */
.egepon-stamp.wisteria { --stamp: #b7addd; color: #342f44 !important; }

/* ---------------- Student home: no planner, no yellow accents ---------------- */
.egepon-role-student #egepon-view { width: min(1280px, 100%) !important; }
.egepon-student-page-head { padding-bottom: 15px; border-bottom: 1px dashed rgba(60,52,43,.14); }
.egepon-student-heading { display: flex; align-items: center; gap: 14px; }
.egepon-student-avatar {
  position: relative; display: grid; width: 62px; height: 62px; flex: 0 0 62px; place-items: center;
  border-radius: 50%; background: #fff; box-shadow: 0 6px 14px -6px rgba(60,52,43,.42), inset 0 0 0 2px rgba(179,223,235,.75);
}
.egepon-student-avatar > .egepon-trinket { width: 50px; height: 50px; object-fit: contain; }
.egepon-student-avatar > span { position: absolute; right: -3px; bottom: -3px; display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; background: #B3DFEB; font-weight: 800; }
.egepon-student-kicker { margin: 0 0 3px !important; color: rgba(60,52,43,.66); font-size: 12px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.egepon-student-kicker span { color: rgba(60,52,43,.38); }
.egepon-student-today { margin: 0 !important; color: rgba(60,52,43,.54); font-size: 12px; font-weight: 650; }
.egepon-student-dashboard { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 24px; align-items: start; }
.egepon-student-side, .egepon-student-main { display: grid; gap: 22px; }
.egepon-student-calendar-card,
.egepon-student-stats,
.egepon-student-current,
.egepon-student-overdue {
  border-radius: 15px; background: rgba(255,253,247,.88); box-shadow: 0 17px 30px -20px rgba(60,52,43,.46);
}
.egepon-student-calendar-card, .egepon-student-stats { padding: 16px; }
.egepon-student-calendar-title { display: grid; grid-template-columns: 30px 1fr 30px; align-items: center; gap: 6px; margin-bottom: 10px; }
.egepon-student-calendar-title h2 { margin: 0 !important; text-align: center; font-size: 15px !important; }
.egepon-student-calendar-title button { display: grid; width: 28px; height: 28px; place-items: center; border: 0; border-radius: 50%; background: transparent; color: rgba(60,52,43,.54); cursor: pointer; }
.egepon-student-calendar-title button:hover { background: rgba(179,223,235,.24); color: var(--egepon-ink); }
.egepon-student-weekdays, .egepon-student-calendar-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 3px; }
.egepon-student-weekdays span { padding: 3px 0 5px; text-align: center; color: rgba(60,52,43,.4); font-size: 10px; font-weight: 800; }
.egepon-student-cal-day { position: relative; display: grid; min-height: 37px; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: rgba(60,52,43,.78); cursor: pointer; font-size: 12px; }
.egepon-student-cal-day:hover { background: rgba(230,227,247,.52); }
.egepon-student-cal-day.today { background: #B3DFEB; color: #312c27; font-weight: 850; }
.egepon-student-cal-day > i { position: absolute; bottom: 4px; display: flex; gap: 3px; }
.egepon-student-cal-day b, .egepon-student-calendar-legend i { display: block; width: 6px; height: 6px; border-radius: 50%; }
.egepon-student-cal-day .lesson-dot, .egepon-student-calendar-legend .lesson-dot { background: #8fd1e1; }
.egepon-student-cal-day .deadline-dot, .egepon-student-calendar-legend .deadline-dot { background: #C62A29; }
.egepon-student-calendar-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed rgba(60,52,43,.13); }
.egepon-student-calendar-legend span { display: flex; align-items: center; gap: 5px; color: rgba(60,52,43,.58); font-size: 10px; }
.egepon-student-stats h2 { margin-bottom: 12px !important; font-size: 16px !important; }
.egepon-student-stats article { border-radius: 11px; }
.egepon-student-stats .score { padding: 13px; background: rgba(179,223,235,.28); }
.egepon-student-stats article > small, .egepon-student-stats .homework small { display: block; color: rgba(60,52,43,.5); font-size: 10px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.egepon-student-stats .score strong { display: block; margin-top: 3px; color: #6fb9cd; font: 700 44px/1 "PT Serif", Georgia, serif; }
.egepon-student-stats .homework { display: grid; grid-template-columns: 86px 1fr; gap: 11px; align-items: center; margin-top: 11px; padding: 12px; background: rgba(230,227,247,.58); }
.egepon-student-stats .homework p { display: flex; align-items: center; gap: 6px; margin: 5px 0 0; font-size: 11px; }
.egepon-student-stats .homework p i { width: 9px; height: 9px; border-radius: 3px; }
.egepon-student-stats .homework p i.done { background: #8fd1e1; }
.egepon-student-stats .homework p i.waiting { background: #C62A29; }
.egepon-student-donut { --done:0deg; position: relative; display: grid; width: 76px; height: 76px; place-items: center; border-radius: 50%; background: conic-gradient(#8fd1e1 0 var(--done), #dcd7ee var(--done) 360deg); }
.egepon-student-donut::after { content:""; position:absolute; inset:9px; border-radius:50%; background:#fffdf7; }
.egepon-student-donut span { position: relative; z-index:1; font: 700 16px/1 "PT Serif", Georgia, serif; }
.egepon-student-overdue { padding: 17px; border: 2px solid rgba(183,173,221,.85); background: rgba(230,227,247,.36); }
.egepon-student-block-title { display:flex; align-items:center; gap:9px; margin-bottom:12px; }
.egepon-student-block-title > span { display:grid; width:25px; height:25px; place-items:center; border-radius:50%; background:#b7addd; color:#342f44; font-weight:850; }
.egepon-student-block-title h2, .egepon-student-current > h2 { margin:0 !important; font-size:18px !important; }
.egepon-student-current { padding: 17px; background: rgba(255,253,247,.76); }
.egepon-student-current > h2 { margin-bottom: 12px !important; }
.egepon-student-overdue > div:last-child, .egepon-student-current > div { display:grid; gap:9px; }
.egepon-student-task { display:flex; align-items:center; justify-content:space-between; gap:13px; min-height:68px; padding:11px 13px; border-radius:11px; background:rgba(255,255,255,.78); }
.egepon-student-task.overdue { background: rgba(249,247,255,.92); }
.egepon-student-task-main { display:flex; min-width:0; align-items:flex-start; gap:10px; }
.egepon-student-task-dot { width:9px; height:9px; flex:0 0 9px; margin-top:6px; border-radius:50%; background:#8fd1e1; }
.egepon-student-task.overdue .egepon-student-task-dot { background:#8f7fc8; }
.egepon-student-task h3 { margin:0 !important; font:700 15px/1.25 "PT Serif", Georgia, serif !important; }
.egepon-student-task p { margin:3px 0 0 !important; color:rgba(60,52,43,.48); font-size:10px; }
.egepon-student-task .egepon-stamp { flex:0 0 auto; padding:8px 12px; font-size:17px !important; }

/* Daily student agenda modal. */
.egepon-day-modal { width:min(600px, calc(100vw - 36px)) !important; }
.egepon-day-agenda { display:grid; gap:18px; margin-top:10px; }
.egepon-day-agenda section + section { padding-top:15px; border-top:1px dashed rgba(60,52,43,.14); }
.egepon-day-agenda h3 { margin:0 0 9px !important; font:800 14px/1.2 Inter,sans-serif !important; }
.egepon-day-lesson, .egepon-day-homework { display:flex; align-items:center; gap:12px; margin-bottom:8px; padding:11px 12px; border-radius:10px; background:rgba(255,255,255,.60); }
.egepon-day-time { display:grid; min-width:82px; padding:7px 8px; border-radius:9px; place-items:center; background:rgba(179,223,235,.34); color:#427f91; font-weight:850; font-size:11px; }
.egepon-day-lesson > div, .egepon-day-homework > div { min-width:0; flex:1; }
.egepon-day-lesson b, .egepon-day-homework b { display:block; font:700 13px/1.3 "PT Serif",Georgia,serif; }
.egepon-day-lesson small, .egepon-day-homework small, .egepon-day-lesson em { display:block; margin-top:2px; color:rgba(60,52,43,.5); font-size:10px; font-style:normal; }
.egepon-day-lesson a { display:inline-block; margin-top:5px; color:#447f91 !important; font-size:11px; font-weight:800; text-decoration:none !important; }
.egepon-day-homework > button { padding:7px 9px; border:0; border-radius:8px; background:rgba(230,227,247,.8); color:#554a78; cursor:pointer; font-size:10px; font-weight:800; }

@media (max-width: 980px) {
  .egepon-student-dashboard { grid-template-columns: 1fr; }
  .egepon-student-side { grid-template-columns: minmax(260px, .8fr) minmax(260px, 1fr); align-items:start; }
}
@media (max-width: 760px) {
  .egepon-shell { padding-top: 78px !important; }
  .egepon-shell aside { padding-top: 28px !important; }
  .egepon-brand { font-size: 29px !important; }
  .egepon-page-head h1 { font-size: 29px !important; }
  .egepon-student-side { grid-template-columns: 1fr; }
  .egepon-student-page-head { align-items:flex-start !important; }
  .egepon-student-today { display:none; }
  .egepon-student-task { align-items:flex-start; flex-direction:column; }
}


/* 0.5.0 · final native-control + scrollbar cleanup */
/* Keep all scrolling functional, but no native scrollbar rail should become a
   visual part of the notebook composition. */
body.egepon-platform-page * {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
body.egepon-platform-page *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Hand-drawn checkboxes for body-level modals (the modal portal lives outside
   .egepon-app, therefore the app-scoped checkbox rules do not reach it). */
body.egepon-platform-page .egepon-overlay input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  position: relative !important;
  display: inline-grid !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  margin: 0 8px 0 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 5px !important;
  outline: 0 !important;
  vertical-align: middle !important;
  background: rgba(255,253,247,.95) !important;
  box-shadow: inset 0 0 0 1.5px rgba(60,52,43,.18), 0 2px 5px rgba(58,45,28,.08) !important;
  cursor: pointer !important;
}
body.egepon-platform-page .egepon-overlay input[type="checkbox"]::after {
  content: "";
  width: 9px;
  height: 5px;
  margin-top: -2px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  opacity: 0;
  transform: rotate(-45deg) scale(.7);
  transition: opacity .12s ease, transform .12s ease;
}
body.egepon-platform-page .egepon-overlay input[type="checkbox"]:checked {
  background: var(--egepon-matcha) !important;
  box-shadow: inset 0 0 0 1.5px rgba(91,99,48,.22), 0 2px 5px rgba(58,45,28,.1) !important;
}
body.egepon-platform-page .egepon-overlay input[type="checkbox"]:checked::after {
  opacity: 1;
  transform: rotate(-45deg) scale(1);
}
body.egepon-platform-page .egepon-overlay .egepon-check {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  color: rgba(60,52,43,.62) !important;
  font: 800 11px/1.25 Inter, system-ui, sans-serif !important;
  letter-spacing: .035em !important;
}

/* The same single-frame blue field is used on both sign-in and invitation
   registration screens.  No wrapper is allowed to create a second halo. */
.egepon-auth-card form > label,
.egepon-auth-card .egepon-fields-two > label { margin-bottom: 17px !important; }
.egepon-auth-card input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
.egepon-auth-card .egepon-password-wrap input {
  border: 0 !important;
  outline: 0 !important;
  background-color: #e6f1fb !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 2px rgba(105,137,156,.20), 0 3px 8px rgba(58,45,28,.045) !important;
}
.egepon-auth-card .egepon-password-wrap {
  padding: 0 !important;
  outline: 0 !important;
}
