:root{--ink:#203452;--muted:#64748b;--paper:#fff;--accent:#4f7cff;--soft:#edf4ff;--line:#d7e2f0;--cover1:#dcecff;--cover2:#fff0c9}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font:16px/1.55 ui-rounded,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(160deg,#eef7ff,#fff8e8);min-height:100vh}button,.back{border:0;border-radius:13px;padding:10px 15px;background:var(--accent);color:white;font:inherit;font-weight:800;cursor:pointer;text-decoration:none}button:disabled{opacity:.6}.hidden{display:none!important}
.topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:12px max(16px,calc((100vw - 1280px)/2));background:rgba(255,255,255,.9);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.topbar b{display:block;font-size:21px}.topbar small{display:block;color:var(--muted)}.back{background:#e9f0fb;color:var(--ink)}
main{display:grid;grid-template-columns:300px minmax(0,900px);gap:20px;max-width:1240px;margin:20px auto;padding:0 16px}.directory,.blog-stage{background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:0 12px 35px rgba(42,72,110,.1)}.directory{align-self:start;position:sticky;top:95px;padding:16px}.directory-head{display:flex;align-items:center;justify-content:space-between}.directory h2{margin:0}.directory-head button{padding:6px 11px}.directory>p{color:var(--muted);font-size:13px}
.blog-list{display:grid;gap:8px}.blog-person{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;width:100%;padding:9px;text-align:left;background:#f7faff;color:var(--ink);border:1px solid var(--line)}.blog-person.active{border:2px solid var(--accent);background:var(--soft)}.blog-person img{width:44px;height:44px;border-radius:50%;object-fit:cover}.blog-person small{display:block;color:var(--muted)}
.blog-stage{overflow:hidden}.blog-cover{position:relative;display:grid;grid-template-columns:105px 1fr;gap:18px;align-items:center;min-height:210px;padding:34px;background:linear-gradient(135deg,var(--cover1),var(--cover2));overflow:hidden}.blog-cover img{width:105px;height:105px;border:5px solid white;border-radius:50%;object-fit:cover;box-shadow:0 8px 24px rgba(0,0,0,.15)}.blog-cover h1{margin:0;font-size:clamp(27px,5vw,46px)}.blog-cover p{margin:4px 0}.floating-decor{position:absolute;right:4%;top:14%;font-size:35px;opacity:.5;animation:float 3s ease-in-out infinite alternate}.editor{display:grid;gap:10px;padding:18px;background:#fbfdff;border-bottom:1px solid var(--line)}details{border:1px solid var(--line);border-radius:15px;background:white;overflow:hidden}summary{padding:12px 15px;font-weight:900;cursor:pointer}form{display:grid;gap:10px;padding:0 15px 15px}label{display:grid;gap:5px;font-weight:750}input,textarea{width:100%;padding:11px;border:1px solid #bdcce0;border-radius:11px;font:inherit}.safe-note{padding:9px 11px;border-radius:10px;background:#fff8db;color:#725300;font-size:13px;font-weight:700}.posts{display:grid;gap:15px;padding:18px}.post{padding:18px;border:1px solid var(--line);border-radius:17px;background:white;box-shadow:0 6px 18px rgba(30,60,100,.06)}.post h2{margin:0 0 5px}.post time{color:var(--muted);font-size:13px}.post p{white-space:pre-wrap}.post img{display:block;width:100%;max-height:560px;margin-top:12px;border-radius:14px;object-fit:contain;background:#f2f4f7}.post .delete{background:#d94957;font-size:13px}
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px;background:rgba(18,33,58,.7);backdrop-filter:blur(7px)}.theme-dialog{width:min(760px,96vw);max-height:90vh;overflow:auto;padding:20px;border-radius:24px;background:white}.theme-dialog>header{display:flex;justify-content:space-between;align-items:start}.theme-dialog h2,.theme-dialog p{margin:0}.theme-dialog header button{font-size:25px;padding:3px 12px}.coin-line{margin:14px 0;padding:10px;border-radius:12px;background:#fff6ce;font-size:19px}.theme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.theme-card{display:grid;gap:6px;padding:15px;border:2px solid var(--line);border-radius:17px;background:white;color:var(--ink);text-align:left}.theme-card.selected{border-color:var(--accent);box-shadow:0 0 0 4px var(--soft)}.theme-preview{height:70px;border-radius:12px}.preview-basic{background:linear-gradient(135deg,#dcecff,#fff0c9)}.preview-sky{background:linear-gradient(135deg,#83d8ff,#e9f8ff)}.preview-forest{background:linear-gradient(135deg,#8ed081,#e9ffd9)}.preview-space{background:linear-gradient(135deg,#251f62,#aa67df)}.preview-candy{background:linear-gradient(135deg,#ff9ac6,#fff18c)}
.theme-sky{--accent:#168ac2;--soft:#e4f7ff;--cover1:#75d3ff;--cover2:#e8fbff;background:linear-gradient(#dff6ff,#fff)}.theme-forest{--accent:#3f8b4a;--soft:#eaffdf;--cover1:#88cf80;--cover2:#ecffd6;background:linear-gradient(#e8f8df,#fff9e9)}.theme-space{--accent:#754bc7;--soft:#efe7ff;--cover1:#29215f;--cover2:#a462db;background:linear-gradient(#17133e,#40265c);background-attachment:fixed}.theme-space .directory,.theme-space .blog-stage{--paper:#fff;color:#241d4d}.theme-space .blog-cover{color:white}.theme-candy{--accent:#ec4f91;--soft:#fff0f7;--cover1:#ff95c4;--cover2:#fff092;background:linear-gradient(#fff0f7,#fffad8)}
@keyframes float{to{transform:translateY(15px) rotate(5deg)}}@media(max-width:760px){.topbar{grid-template-columns:auto 1fr}.topbar>button{grid-column:1/-1}.topbar small{display:none}main{grid-template-columns:1fr;margin-top:10px}.directory{position:static}.blog-list{grid-template-columns:repeat(2,minmax(0,1fr))}.blog-cover{grid-template-columns:75px 1fr;padding:22px 16px;min-height:170px}.blog-cover img{width:75px;height:75px}.floating-decor{font-size:23px}.theme-grid{grid-template-columns:1fr}}
.media-help{padding:10px 12px;border-radius:11px;background:#edf7ff;color:#315474;font-size:13px}.media-frame{position:relative;width:100%;aspect-ratio:16/9;margin:13px 0;border-radius:15px;overflow:hidden;background:#111}.media-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.zing-card{display:flex;justify-content:space-between;align-items:center;margin:13px 0;padding:14px 16px;border-radius:14px;background:linear-gradient(90deg,#7547df,#d53b9c);color:#fff;font-weight:900;text-decoration:none;box-shadow:0 8px 20px #733db42c}.zing-card:hover{transform:translateY(-1px)}