* { box-sizing: border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:#f5f6f8; color:#1a1a1a; }
.view { min-height:100vh; }
.hidden { display:none !important; }
.card { background:#fff; border-radius:12px; padding:32px; box-shadow:0 2px 12px rgba(0,0,0,.08); max-width:380px; margin:8vh auto; }
.auth-card h1 { margin:0 0 4px; font-size:26px; }
.sub { color:#888; margin:0 0 20px; font-size:13px; }
.tabs { display:flex; gap:8px; margin-bottom:16px; }
.tab { flex:1; padding:8px; border:1px solid #ddd; background:#fafafa; border-radius:8px; cursor:pointer; }
.tab.active { background:#1a73e8; color:#fff; border-color:#1a73e8; }
#auth-form { display:flex; flex-direction:column; gap:10px; }
input[type=email],input[type=password],input[type=text],textarea { padding:10px 12px; border:1px solid #ddd; border-radius:8px; font-size:14px; width:100%; }
button { padding:10px 14px; border:none; border-radius:8px; cursor:pointer; font-size:14px; background:#e8e8e8; }
button.primary { background:#1a73e8; color:#fff; }
button.danger { background:#e8453c; color:#fff; }
.msg { font-size:13px; min-height:18px; }
.msg.err { color:#e8453c; } .msg.ok { color:#1a9e4b; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:14px 24px; background:#fff; border-bottom:1px solid #eee; }
.topbar h2 { margin:0; font-size:18px; }
.user { display:flex; align-items:center; gap:12px; font-size:14px; }
.layout { display:flex; height:calc(100vh - 120px); }
.sidebar { width:260px; border-right:1px solid #eee; padding:16px; background:#fff; overflow:auto; }
.sidebar ul { list-style:none; padding:0; margin:12px 0 0; }
.sidebar li { padding:10px 12px; border-radius:8px; cursor:pointer; margin-bottom:6px; background:#f5f6f8; }
.sidebar li.active { background:#e3effd; border:1px solid #1a73e8; }
.sidebar li .t { font-size:14px; font-weight:500; }
.sidebar li .m { font-size:11px; color:#999; }
.editor { flex:1; padding:20px; display:flex; flex-direction:column; gap:12px; overflow:auto; }
.empty { margin:auto; color:#999; }
.editor-head { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.editor-head input[type=text] { flex:1; min-width:200px; }
textarea { flex:1; min-height:300px; font-family:monospace; font-size:13px; resize:vertical; }
.pub-link { font-size:13px; color:#555; }
.pub-link a { color:#1a73e8; word-break:break-all; }
.api-doc { margin:0 24px 24px; background:#fff; border-radius:12px; padding:16px 20px; }
.api-doc pre { background:#1e1e1e; color:#d4d4d4; padding:14px; border-radius:8px; overflow:auto; font-size:12px; }

.secondary { background:#e8e8e8; color:#333; font-size:13px; padding:6px 12px; margin-top:8px; }
