:root{--brand:#0299AD;--brand-dark:#016d7b;--brand-soft:#e6f7fa;--ink:#16343a;--muted:#5d767b;--line:#d8e7ea;--bg:#f3f9fa;--danger:#a93030;--success:#17653c}
[hidden]{display:none!important}
body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(180deg,#f3f9fa 0%,#eef7f8 100%);color:var(--ink)}
a{color:var(--brand-dark);text-decoration:none}a:hover{text-decoration:underline}
.app{display:grid;grid-template-columns:280px 1fr;min-height:100vh}
.sidebar{background:linear-gradient(180deg,var(--brand-dark) 0%,#024f59 100%);color:#effbfc;padding:24px}
.sidebar a{color:#effbfc}
.mobile-topbar{display:none}.mobile-topbar-logo{display:none}.mobile-menu-toggle{display:none;align-items:center;gap:8px;border:1px solid rgba(2,153,173,.16);border-radius:10px;padding:8px 12px;background:#fff;color:var(--ink);font:inherit;box-shadow:0 8px 24px rgba(2,61,69,.08)}.mobile-backdrop{display:none}
.brand{display:flex;align-items:center;justify-content:center;background:#fff;border-radius:16px;padding:14px;margin-bottom:18px;box-shadow:0 14px 34px rgba(2,153,173,.18)}
.brand img{display:block;max-width:100%;height:auto;max-height:64px}
.nav a{display:block;padding:10px 12px;border-radius:10px;margin-bottom:6px;background:rgba(255,255,255,.05)}
.nav a.active,.nav a:hover{background:rgba(255,255,255,.16);text-decoration:none}
.main{padding:28px;display:flex;flex-direction:column}.main-content{flex:1 0 auto}
.card{background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(2,61,69,.08);padding:22px;margin-bottom:20px;border:1px solid rgba(2,153,173,.08)}
.page-footer{margin-top:24px;text-align:center;color:var(--muted);font-size:14px}.page-footer a{font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.flash{padding:12px 14px;border-radius:10px;margin-bottom:16px}.flash.success{background:#e9f8ef;color:var(--success)}.flash.error{background:#fdecec;color:#9f2d2d}
.warning-banner{margin-bottom:16px;padding:14px 16px;border-radius:12px;border:1px solid #f0c36d;background:#fff6df;color:#7a4b00}.warning-banner a{font-weight:600;margin-left:8px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.stat{background:var(--brand-soft);border-radius:14px;padding:18px}.stat strong{display:block;font-size:28px;color:var(--brand-dark)}
.table-wrap{overflow:auto;max-height:65vh}
.table{width:100%;border-collapse:collapse}
.table-wrap-wide .table{min-width:760px}
.table th,.table td{padding:12px 10px;border-bottom:1px solid #e5ecea;vertical-align:top;text-align:left}
.table th{position:sticky;top:0;background:#f7fcfd}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));column-gap:16px;row-gap:22px}
.field{display:flex;flex-direction:column;gap:8px}
.policy-field-full{grid-column:1/-1}
.field input,.field select,.field textarea{border:1px solid #c8dfe4;border-radius:10px;padding:10px 12px;font:inherit}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(2,153,173,.14)}
.field select[size]{min-height:220px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.button{border:0;border-radius:10px;padding:10px 14px;font:inherit;cursor:pointer;background:var(--brand);color:#fff}
.button.secondary{background:#dff3f6;color:var(--brand-dark)}
.button.danger{background:var(--danger)}
.button.small{padding:4px 8px;border-radius:8px;font-size:12px;line-height:1.2}
.button.is-active{background:var(--brand-dark);color:#fff}
.muted{color:var(--muted);font-size:14px}
.tag{display:inline-block;padding:4px 8px;border-radius:999px;background:var(--brand-soft);font-size:12px;color:var(--brand-dark)}
.tag.tag-connected{background:#e9f8ef;color:var(--success)}.tag.tag-retrying{background:#fff4dd;color:#7a5f17}.tag.tag-disconnected{background:#fdecec;color:#9f2d2d}
.tabs{display:grid;gap:18px;margin-bottom:20px}.tab-list{display:flex;flex-wrap:wrap;gap:10px;padding:10px;border:1px solid rgba(2,153,173,.12);border-radius:14px;background:#f7fcfd}.tab-button{border:1px solid transparent;border-radius:10px;padding:10px 14px;background:transparent;color:var(--muted);font:inherit;font-weight:600;cursor:pointer}.tab-button.is-active{background:var(--brand);color:#fff;box-shadow:0 10px 24px rgba(2,153,173,.2)}.tab-panel[hidden]{display:none!important}
.editor-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.editor-surface{min-height:280px;padding:14px;border:1px solid #c8dfe4;border-radius:12px;background:#fff;overflow:auto}.editor-surface:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(2,153,173,.14)}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top,#dff4f7 0%,#f7fbfc 55%,#eef7f8 100%)}
.login-card{background:#fff;border-radius:18px;box-shadow:0 16px 50px rgba(2,61,69,.12);width:min(460px,100%);padding:30px}
.login-logo{display:flex;justify-content:center;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:16px}
.login-logo img{max-width:100%;height:auto;max-height:82px}
.org-switch{margin:16px 0 20px;padding:8px 10px;border:1px solid rgba(255,255,255,.16);border-radius:10px;background:rgba(255,255,255,.06)}.org-switch form{display:flex;flex-direction:column;gap:6px}.org-switch label,.org-switch .small{color:#d8f2f6;font-weight:600}.org-switch select{appearance:auto;-webkit-appearance:menulist;-moz-appearance:menulist;border:1px solid rgba(255,255,255,.28);border-radius:8px;padding:6px 10px;background:#fff;color:var(--ink);font:inherit;line-height:1.2}.org-switch select:focus{outline:none;border-color:#9fe7f0;box-shadow:0 0 0 3px rgba(159,231,240,.18)}.org-switch option{color:#16343a}
.notice{padding:10px 12px;border-left:4px solid var(--brand);background:var(--brand-soft);border-radius:10px}
.checkbox-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}.checkbox-list-inline{display:flex;flex-wrap:wrap;gap:8px}.checkbox-item{display:flex;gap:8px;align-items:flex-start;padding:10px;border:1px solid #dfe9e6;border-radius:10px}.checkbox-item-compact{padding:8px 10px;min-width:0;flex:0 1 auto;background:#fff}.checkbox-item-compact span{line-height:1.25}.checkbox-item-select-all{margin-bottom:10px;background:var(--brand-soft)}
.school-connection-status{font-size:13px;font-weight:600}.school-connection-status.is-connected{color:var(--success)}.school-connection-status.is-not-connected{color:#9f2d2d}
.report-list{display:grid;gap:10px}.report-item{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid #dfe9e6;border-radius:12px}.report-item strong{display:block}.report-item .status-ok,.report-item .status-pushed{color:var(--success)}.report-item .status-failed{color:#9f2d2d}.report-item .status-skipped{color:#7a5f17}
.policy-form-note{padding:12px 14px;border:1px dashed #c8dfe4;border-radius:12px;background:#f8fcfd;margin-top:16px}
.policy-steps{display:grid;gap:18px;margin-top:16px}.policy-step{padding:18px;border:1px solid #dfe9e6;border-radius:14px;background:#fcfeff}.policy-step-heading{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px}.policy-step-heading h3{margin:0 0 4px;font-size:18px}.policy-step-number{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:999px;background:var(--brand);color:#fff;font-weight:700;flex:0 0 32px}.policy-review{display:grid;gap:8px;padding:14px;border:1px solid #dfe9e6;border-radius:12px;background:#f8fcfd}
.policy-step.is-complete{display:none}.policy-step-summary{display:none;margin-top:10px;padding:10px 12px;border-radius:10px;background:#eef8fa;color:var(--ink)}
.is-loading::before{content:"";display:inline-block;width:12px;height:12px;margin-right:8px;border:2px solid rgba(2,153,173,.25);border-top-color:var(--brand);border-radius:50%;animation:portal-spin .7s linear infinite;vertical-align:-2px}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.small{font-size:13px}.status-ok{color:var(--success)}.status-failed{color:#9f2d2d}.status-pushed{color:var(--success)}.status-skipped,.status-not_connected{color:#7a5f17}
@keyframes portal-spin{to{transform:rotate(360deg)}}
@media(max-width:920px){.app{grid-template-columns:1fr;position:relative;max-width:100vw;overflow-x:hidden}.sidebar{position:fixed;top:0;left:0;bottom:0;width:min(82vw,320px);z-index:30;transform:translateX(-100%);transition:transform .22s ease;padding-bottom:10px;overflow:auto}.app.is-menu-open .sidebar{transform:translateX(0)}.mobile-backdrop{position:fixed;inset:0;background:rgba(9,28,31,.45);z-index:20}.app.is-menu-open .mobile-backdrop{display:block}.main{padding:18px;max-width:100vw;overflow-x:hidden}.mobile-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.mobile-topbar-logo{display:flex;align-items:center;background:#fff;border:1px solid rgba(2,153,173,.12);border-radius:12px;padding:8px 12px;box-shadow:0 8px 24px rgba(2,61,69,.08)}.mobile-topbar-logo img{display:block;height:28px;width:auto;max-width:160px}.mobile-menu-toggle{display:inline-flex}.topbar{flex-direction:column;align-items:flex-start}.table-wrap{width:100%;max-width:100%;overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.table-wrap-wide .table{min-width:880px}}
