@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700;800&display=swap');
:root { color-scheme: light; --ink:#17191b; --muted:#647079; --line:#dce1e2; --paper:#f5f6f4; --yellow:#ffeba8; --orange:#ffcb70; --coral:#ff777b; --red:#d92d32; --pink:#f0799f; --teal:#04b99c; --purple:#6657df; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--paper); color:var(--ink); font-family:Roboto,"Segoe UI",Arial,sans-serif; }
.admin-topbar { position:sticky;top:0;z-index:10;background:#fff;border-bottom:3px solid transparent;border-image:linear-gradient(90deg,var(--yellow),var(--orange),var(--coral),var(--pink),var(--purple)) 1; }
.brand-lockup { display:flex;align-items:center;gap:.8rem;color:var(--ink);text-decoration:none; }
.brand-lockup strong,.brand-lockup small { display:block;line-height:1.2; }
.brand-lockup strong { font-size:1.05rem;font-weight:800;letter-spacing:-.03em; }
.brand-lockup small { margin-top:.24rem;color:var(--muted);font-size:.59rem;font-weight:700;letter-spacing:.13em; }
.brand-mark-image { display:block;width:2.65rem;height:2.65rem;flex:0 0 auto;filter:drop-shadow(3px 3px 0 #ff777b); }
.blog-nav { font-size:.78rem;font-weight:700; }
.blog-nav a { color:var(--ink);text-decoration:none;white-space:nowrap; }
.blog-nav a:hover { color:#075fa6; }
@media(max-width:991.98px) { .blog-nav { flex-basis:100%;padding:.8rem 0 .3rem;align-items:stretch!important; } .blog-nav a:not(.btn) { padding:.35rem 0; } }
.eyebrow { color:#a62a32;font-size:.7rem;font-weight:800;letter-spacing:.13em; }
.admin-heading { padding:1rem 0 .75rem; }
.local-notice { border:1px solid #efcf7a;background:#fff5d6;color:#3d372b;line-height:1.55; }
.local-notice>i { color:#a66b00; }
.editor-card,.drafts-card { border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 14px 36px #2026280b; }
.editor-tabs { gap:.4rem;border-bottom:1px solid var(--line);padding-bottom:.8rem; }
.editor-tabs .nav-link { border-radius:999px;color:#414b51;font-weight:650; }
.editor-tabs .nav-link.active { background:var(--ink);color:#fff; }
.content-form .form-label { margin-bottom:.38rem;font-size:.87rem;font-weight:650; }
.content-form .form-control,.content-form .form-select { border-color:#cbd2d4;border-radius:10px;padding:.68rem .78rem;color:var(--ink); }
.content-form .form-control:focus,.content-form .form-select:focus { border-color:#6657df;box-shadow:0 0 0 .22rem #6657df25; }
.btn-accent { border:1px solid var(--ink);border-radius:10px;background:var(--coral);color:var(--ink);font-weight:750; }
.btn-accent:hover,.btn-accent:focus-visible { border-color:var(--ink);background:var(--yellow);color:var(--ink); }
.draft-count { display:grid;place-items:center;width:2.35rem;height:2.35rem;border-radius:50%;background:var(--yellow);font-weight:800; }
.draft-list { display:grid;gap:.8rem; }
.empty-drafts { padding:2.5rem 1rem;text-align:center;color:var(--muted); }
.empty-drafts i { margin-bottom:.8rem;color:#899296;font-size:1.6rem; }
.draft-item { border:1px solid var(--line);border-left:4px solid var(--purple);border-radius:12px;padding:1rem;background:#fff; }
.draft-item[data-type="course"] { border-left-color:var(--teal); }
.draft-item h3 { margin:.4rem 0;font-size:1.02rem;font-weight:750;overflow-wrap:anywhere; }
.draft-item p { margin:0;color:#58636a;font-size:.9rem;white-space:pre-wrap;overflow-wrap:anywhere; }
.draft-meta { display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;color:var(--muted);font-size:.72rem; }
.draft-tag { border-radius:999px;padding:.24rem .55rem;background:#f1efff;color:#493da7;font-weight:700; }
.draft-item[data-type="course"] .draft-tag { background:#e8f8f4;color:#087664; }
.draft-actions { margin-top:.8rem;display:flex;justify-content:flex-end; }
.draft-actions button { border:0;background:transparent;color:#a52e32;font-size:.82rem;font-weight:650; }
.blog-intro { position:relative;overflow:hidden;border:1px solid #f1d58a;border-radius:22px;background:linear-gradient(115deg,#fff1bd,#fff9e8 58%,#fce6eb); }
.blog-intro::after { position:absolute;right:-3rem;top:-4rem;width:15rem;height:15rem;border:2rem solid #ff777b35;border-radius:50%;content:""; }
.blog-intro>* { position:relative;z-index:1;max-width:50rem; }
.blog-entry[hidden] { display:none!important; }
.blog-card { overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 14px 34px #20262809; }
.blog-art { min-height:10rem;display:flex;align-items:center;justify-content:space-between;padding:1.4rem;color:var(--ink); }
.blog-art i { font-size:2.3rem; }
.blog-art span { align-self:flex-end;font-size:.68rem;font-weight:850;letter-spacing:.14em; }
.art-yellow { background:var(--yellow); }.art-orange { background:var(--orange); }.art-coral { background:var(--coral); }.art-pink { background:var(--pink); }
.blog-card details { margin-top:1.1rem;border-top:1px solid var(--line);padding-top:.8rem; }
.article-toggle { color:#9f2932;cursor:pointer;font-size:.88rem;font-weight:750;list-style:none; }
.article-toggle::-webkit-details-marker { display:none; }
.article-body { padding-top:.75rem;color:#505b60;font-size:.9rem;line-height:1.7; }
.article-body ol { padding-left:1.2rem; }
.blog-cta { border-radius:18px;background:var(--yellow); }
.blog-cta .eyebrow { color:#8e262b; }
@media(max-width:575.98px) { main.container { padding-top:1rem!important; } .admin-heading .btn { width:100%; } .editor-card,.drafts-card { border-radius:14px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important; } }