:root { --pico-font-size: 95%; }

.topnav { border-bottom: 1px solid var(--pico-muted-border-color); padding: 0.4rem 1rem; }
.topnav ul { margin: 0; }
.muted { color: var(--pico-muted-color); }

.flash { padding: 0.6rem 1rem; margin: 0.5rem 0; }
.flash-error { border-left: 4px solid #c0392b; }
.flash-success { border-left: 4px solid #27ae60; }

/* Dashboard */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; }
.stat-card { padding: 1rem; }
.stat-card h3 { font-size: 1.8rem; margin: 0; }
.stat-card .label { color: var(--pico-muted-color); font-size: 0.85rem; }

/* Editor layout */
.editor-shell { display: grid; grid-template-columns: 16rem 1fr 22rem; gap: 0.75rem; height: calc(100vh - 6rem); }
.editor-pane { border: 1px solid var(--pico-muted-border-color); border-radius: 6px; padding: 0.6rem; overflow-y: auto; }
.editor-pane h4 { margin-top: 0; }

.tree { list-style: none; padding-left: 0; margin: 0; font-size: 0.9rem; }
.tree ul { list-style: none; padding-left: 1rem; }
.tree li { padding: 0.15rem 0.3rem; cursor: pointer; border-radius: 3px; }
.tree li:hover { background: var(--pico-secondary-background); }
.tree li.active { background: var(--pico-primary); color: var(--pico-primary-inverse); }

.entry-row { padding: 0.4rem 0.5rem; margin-bottom: 0.4rem; border: 1px solid var(--pico-muted-border-color); border-radius: 4px; }
.entry-row.draft { border-left: 4px solid #e67e22; }
.entry-row.published { border-left: 4px solid #27ae60; }
.entry-row .meta { font-size: 0.8rem; color: var(--pico-muted-color); }
.entry-row textarea { font-family: "Noto Serif TC", "Songti SC", serif; min-height: 6rem; }

.btn-row { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.btn-row button, .btn-row a { font-size: 0.8rem; padding: 0.25rem 0.6rem; margin: 0; }

.preview-result { padding: 0.5rem; margin: 0.4rem 0; border: 1px solid var(--pico-muted-border-color); border-radius: 4px; font-size: 0.85rem; }
.preview-result .score { float: right; color: var(--pico-muted-color); }

table { font-size: 0.9rem; }
.tag-pill { display: inline-block; padding: 0.1rem 0.5rem; margin: 0.1rem; background: var(--pico-secondary-background); border-radius: 999px; font-size: 0.75rem; }

dialog article { max-width: 36rem; }