:root{font-family:Inter,system-ui,'Segoe UI',Arial,sans-serif;color:#15294b;background:#f7fbff}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #f49b19;outline-offset:2px}.top{height:83px;background:#ffdc35;display:flex;align-items:center;gap:24px;padding:8px max(18px,calc((100vw - 1260px)/2));box-shadow:0 2px 10px #15325712}.brand{display:flex;align-items:center;gap:9px;min-width:240px}.brand img,.footerbrand img{width:58px;height:58px;object-fit:contain}.brand strong{display:block;color:#004da5;font-size:25px;letter-spacing:-1px}.brand small,.footerbrand small{display:block;font-size:12px}.motto{border-left:2px solid #15345b;padding-left:22px;font-weight:950;font-style:italic;font-size:17px;line-height:1.05}.mascot{font-size:38px;margin-left:auto}.tools{display:flex;gap:9px;align-items:center}.tools button{border:0;background:#fff;border-radius:50%;height:37px;width:37px;font-size:22px;color:#063c82;box-shadow:0 2px 5px #0001}.tools .login{width:auto;border-radius:30px;padding:0 15px;background:#0955ad;color:white;font-size:13px}.nav{background:#fff;display:flex;justify-content:center;gap:38px;padding:12px;box-shadow:0 2px 7px #0001;position:sticky;top:0;z-index:3}.nav button{background:none;border:0;padding:9px 22px;border-radius:24px;font-weight:750;color:#1d2e4b}.nav button.active{background:#0753a7;color:white}main{max-width:1260px;margin:auto;min-height:75vh}.hero{width:100%;display:block;border-radius:20px 20px 0 0;margin-top:13px;object-fit:cover}.content{padding:14px 15px 20px}.tiles{display:grid;gap:12px;margin-bottom:17px}.tiles.four{grid-template-columns:repeat(4,1fr)}.tiles.five{grid-template-columns:repeat(5,1fr)}.tiles.eight{grid-template-columns:repeat(8,1fr)}.tiles.three{grid-template-columns:repeat(3,1fr)}.tile{min-height:110px;border:1px solid #ffffffab;border-radius:17px;padding:15px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;position:relative;box-shadow:0 3px 8px #12436b12;transition:transform .15s,box-shadow .15s;color:#132d4f}.tile:hover{transform:translateY(-3px);box-shadow:0 6px 15px #12436b24}.tile .emoji{font-size:34px}.tile b{font-size:15px;line-height:1.2}.tile small{font-size:11px;line-height:1.35}.tile .arrow{position:absolute;right:10px;bottom:10px;background:#fff;border-radius:50%;width:24px;height:24px;display:grid;place-items:center;color:#0064bb}.blue{background:linear-gradient(120deg,#d6f4ff,#aee6ff)}.pink{background:linear-gradient(120deg,#ffe3ee,#ffb9d4)}.yellow{background:linear-gradient(120deg,#fff4c4,#ffe08c)}.green{background:linear-gradient(120deg,#d8fff0,#a8efd5)}.purple{background:linear-gradient(120deg,#e8e3ff,#d2c9ff)}.peach{background:linear-gradient(120deg,#ffeadb,#ffd0a4)}.section{border-radius:16px;background:#fff;border:1px solid #d6e8f4;padding:12px;margin-bottom:14px}.section h2{background:#0052a3;color:white;border-radius:18px 18px 18px 4px;display:table;padding:7px 17px;margin:-4px 0 13px;font-size:17px}.columns{display:grid;grid-template-columns:1fr 1fr;gap:15px}.columns.threecol{grid-template-columns:1fr 1fr 1fr}.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.stat{border-radius:11px;text-align:center;padding:14px 6px}.stat strong{display:block;font-size:28px;color:#084b9c}.stat small{font-size:12px}.notice{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid #edf1f8;font-size:13px}.notice:last-child{border-bottom:0}.notice span{font-size:24px}.notice b{display:block}.notice small{color:#69768c}.banner-bottom{background:linear-gradient(110deg,#ffd33e,#ff9dbb 50%,#62d4e9);padding:25px;border-radius:18px;display:flex;align-items:center;justify-content:space-around;gap:15px;margin:15px 0}.banner-bottom strong{font-size:27px;font-style:italic;color:#08438b}.banner-bottom span{font-size:48px}footer{background:#a6e8eb;display:flex;justify-content:space-around;align-items:center;gap:15px;padding:12px 20px;font-size:12px}.footerbrand{display:flex;align-items:center;gap:8px}.footerbrand img{width:38px;height:38px}.footerbrand b{display:block}.social{font-size:20px}dialog{border:0;border-radius:18px;box-shadow:0 25px 90px #061b4e55;max-width:min(540px,92vw);width:100%;padding:25px}dialog::backdrop{background:#03162b88}.close{float:right;border:0;background:#e9f1ff;padding:9px;border-radius:50%}#modalContent{line-height:1.6}#modalContent a{color:#0753a7}#modalContent input{padding:12px;width:100%;border:1px solid #a4b6c8;border-radius:9px}.empty{color:#60748b;background:#f0f6fb;border-radius:10px;padding:15px}.quicklinks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.quicklinks button{border:0;border-radius:9px;padding:13px;background:#eaf5ff;color:#064b9b;font-weight:700}@media(max-width:800px){.top{height:70px;padding:6px 12px;gap:8px}.brand{min-width:0}.brand img{width:43px;height:43px}.brand strong{font-size:19px}.brand small{font-size:9px}.motto{font-size:11px;padding-left:8px}.mascot{display:none}.tools{margin-left:auto;gap:4px}.tools button{height:31px;width:31px;font-size:17px}.tools button:nth-child(2),.tools button:nth-child(3){display:none}.tools .login{padding:0 9px}.tools .login span{display:none}.nav{gap:3px;justify-content:space-around;padding:7px 3px}.nav button{padding:9px 8px;font-size:12px}.hero{border-radius:10px 10px 0 0;margin-top:7px}.content{padding:9px}.tiles.four,.tiles.five,.tiles.eight,.tiles.three{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tile{min-height:100px;padding:12px}.tile b{font-size:13px}.tile .emoji{font-size:26px}.columns,.columns.threecol{grid-template-columns:1fr}.statgrid{grid-template-columns:repeat(2,1fr)}footer{flex-wrap:wrap;font-size:10px}.banner-bottom strong{font-size:20px}.banner-bottom span{font-size:32px}}@media(min-width:801px) and (max-width:1100px){.tiles.eight{grid-template-columns:repeat(4,1fr)}.tiles.five{grid-template-columns:repeat(3,1fr)}}

.integration-status{background:#fff1c8;color:#684300;text-align:center;padding:10px;font-size:12px}.tools #studioBtn{border-radius:18px;width:auto;padding:0 12px;font-size:12px;background:#074e9b;color:white}.studio-form{display:grid;gap:14px}.studio-field{display:grid;gap:5px;font-weight:700}.studio-field input,.studio-field textarea{width:100%;padding:11px;border:1px solid #b6c7da;border-radius:8px;font:inherit}.studio-field textarea{min-height:100px}.primary-action{background:#0753a7;color:#fff;border:0;padding:12px 18px;border-radius:10px;font-weight:700}.studio-list{display:grid;gap:8px;margin-bottom:14px}.studio-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px;background:#eef7ff;border-radius:9px}.studio-row button{padding:8px 14px;border:0;border-radius:8px;background:#d5e7ff;color:#084a8c}@media(max-width:600px){.tools #studioBtn{font-size:10px;padding:0 6px}}

.module-table-wrap{overflow:auto;max-height:58vh;border:1px solid #d7e5f3;border-radius:10px}.module-table{border-collapse:collapse;width:100%;font-size:13px}.module-table th,.module-table td{padding:10px;text-align:left;border-bottom:1px solid #e2edf5}.module-table th{position:sticky;top:0;background:#e7f4ff}.module-footnote,.stat-note{font-size:12px;color:#52677c}.student-select{width:100%;margin:8px 0;padding:12px;border:1px solid #a4b6c8;border-radius:9px}.student-details{padding:10px;background:#f0f7ff;border-radius:10px}#modal:has(.module-table){max-width:min(900px,96vw)}

/* Admin Studio phase 5 */
#modal:has(.studio-panel){max-width:min(760px,96vw)}.studio-navigation{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 18px}.studio-navigation button{border:1px solid #b5d3f0;border-radius:12px;background:#e9f4ff;padding:10px 14px;color:#074b9c;font-weight:700}.studio-panel .studio-row{margin-bottom:8px}.studio-public-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.studio-public-links a{display:block;background:#e8f3ff;border-radius:12px;padding:14px;color:#0753a7;text-decoration:none;font-weight:700}@media(max-width:600px){.studio-navigation button{flex:1;font-size:12px}}

/* Portal roles: public pages stay intact; authorized management lives in its own workspace. */
.role-dashboard{display:grid;gap:12px;max-width:850px}.role-dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.role-dashboard-grid button{border:1px solid #cddcf4;background:#f1f6ff;color:#153c73;border-radius:14px;padding:20px 12px;font-weight:700;cursor:pointer;text-align:left}.role-dashboard-grid button:hover,.role-dashboard-grid button:focus-visible{background:#dcecff;outline:2px solid #2464b3}#dashboardBtn{background:#153e79;color:white;border:0;border-radius:12px;padding:9px 12px;cursor:pointer}@media(max-width:700px){.role-dashboard-grid{grid-template-columns:1fr 1fr}#dashboardBtn{font-size:12px;padding:7px}}

/* SKKI Admin Studio customization: variables are applied only from published RLS-protected settings. */
:root{--skki-primary:#0753a7;--skki-header:#ffdc35;--skki-surface:#f7fbff;--skki-radius:17px}
body{background:var(--skki-surface)}.top{background:var(--skki-header)}.nav button.active,.section h2,.primary-action{background:var(--skki-primary)}.tile{border-radius:var(--skki-radius)}.studio-page-intro{white-space:pre-wrap}.studio-navigation{position:sticky;top:0;background:white;padding:8px 0;z-index:1}
@media(max-width:700px){#modal:has(.studio-panel){max-width:98vw;padding:14px}.studio-navigation{display:grid;grid-template-columns:1fr 1fr}.studio-navigation button{font-size:11px;padding:10px 5px}.tools #studioBtn{display:none}}
