:root{--bg:#faf7f2;--fg:#1e1b16;--mut:#7a7368;--rule:#e4ddd2;--accent:#8a5a2b;--karte:#fff}
[data-theme=dunkel]{--bg:#15130f;--fg:#e8e2d8;--mut:#9a9184;--rule:#2b2721;--accent:#d9a066;--karte:#1e1b16}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:Georgia,"Times New Roman",serif}
a{color:var(--accent)}
button,select,input{font:inherit;color:inherit;background:var(--karte);border:1px solid var(--rule);border-radius:6px;padding:.35rem .6rem}
button{cursor:pointer}
.kopf{display:flex;align-items:center;gap:.75rem;padding:.5rem .9rem;border-bottom:1px solid var(--rule);font-family:system-ui,sans-serif;font-size:.85rem;color:var(--mut)}
.kopf .titel{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--fg)}
.wrap{max-width:900px;margin:0 auto;padding:1.5rem 1rem;font-family:system-ui,sans-serif}
.karte{background:var(--karte);border:1px solid var(--rule);border-radius:10px;padding:1rem;margin:.75rem 0}
.mut{color:var(--mut)}
table{border-collapse:collapse;width:100%;font-size:.9rem}
td,th{text-align:left;padding:.35rem .5rem;border-bottom:1px solid var(--rule);vertical-align:top}
.balken{height:6px;background:var(--rule);border-radius:3px;overflow:hidden}
.balken>div{height:100%;background:var(--accent)}
/* Reader */
#lese{position:fixed;inset:2.6rem 0 0 0;display:flex;flex-direction:column}
#seite,#mess{flex:1;overflow:hidden;padding:1.2rem clamp(1rem,5vw,3rem);max-width:760px;width:100%;margin:0 auto;line-height:1.55;font-size:var(--schrift,19px)}
#mess{position:absolute;visibility:hidden;left:0;right:0;top:0;height:auto;flex:none}
#seite p,#mess p{margin:0 0 .9em}
#fuss{display:flex;justify-content:space-between;padding:.4rem .9rem;font-family:system-ui,sans-serif;font-size:.75rem;color:var(--mut)}
#menue{position:fixed;top:2.6rem;right:0;width:min(320px,100%);background:var(--karte);border-left:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:1rem;display:none;font-family:system-ui,sans-serif;font-size:.9rem;z-index:5}
#menue.offen{display:block}
#menue label{display:block;margin:.6rem 0 .25rem}
#menue select,#menue input{width:100%}
.reihe{display:flex;gap:.5rem;align-items:center}
mark.markierung{background:color-mix(in srgb, var(--accent) 28%, transparent);color:inherit;border-radius:2px;cursor:pointer}
.schwebe-knopf{position:fixed;z-index:20;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.markierungen-liste{max-height:9rem;overflow:auto;border:1px solid var(--rule);border-radius:6px}
.markierungen-liste>div{padding:.35rem .5rem;border-bottom:1px solid var(--rule);cursor:pointer;font-size:.85rem}
.markierungen-liste>div:last-child{border-bottom:none}
