.wt-library { padding: 1rem; color: var(--tt-text); }
.wt-library h2 { font-size: var(--fs-lg); font-weight: 800; }
.wt-library h3 { font-size: var(--fs-base); font-weight: 700; }
.wt-library p { font-size: var(--fs-xs); white-space: pre-wrap; overflow-wrap: anywhere; }
.wt-button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; padding: .5rem .75rem; margin: .25rem; border: 1px solid var(--tt-border); border-radius: .65rem; background: var(--tt-surface-raised); color: var(--tt-text); font-size: var(--fs-xs); cursor: pointer; }
.wt-button:disabled { opacity: .45; cursor: wait; }
.wt-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,14rem),1fr)); gap: 1rem; margin-top: 1rem; }
.wt-card { border: 1px solid var(--tt-border); border-radius: .8rem; padding: .75rem; background: var(--tt-surface); min-width: 0; }
.wt-card a { display: block; color: inherit; }
.wt-card img { width: 100%; height: 12rem; object-fit: cover; object-position: top; border-radius: .6rem; }
.wt-editor { margin-top: 1rem; padding: 1rem; background: var(--tt-surface); border: 1px solid var(--tt-border); border-radius: .8rem; }
.wt-editor label { display: block; margin: .75rem 0; font-size: var(--fs-xs); }
.wt-editor input:not([type=checkbox]), .wt-editor textarea { display: block; width: 100%; background: var(--tt-bg-soft); color: var(--tt-text); padding: .65rem; border: 1px solid var(--tt-border); border-radius: .5rem; }
.wt-editor input[type=checkbox] { margin: .5rem; }
.wt-order { list-style: none; padding: 0; }
.wt-order li { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem; padding: .5rem 0; border-bottom: 1px solid var(--tt-border); }
.wt-order img { width: 3rem; height: 5rem; object-fit: cover; object-position: top; }
.wt-order span { flex: 1; min-width: 5rem; overflow-wrap: anywhere; font-size: var(--fs-xs); }
.wt-preview { width: min(95vw,48rem); max-height: 95dvh; overflow: auto; background: var(--tt-surface); color: var(--tt-text); padding: .5rem; }
.wt-preview::backdrop { background: rgb(0 0 0 / .8); }
html body.wt-reader-page { display: block; height: auto; min-height: 100dvh; overflow: auto; margin: 0; padding: 0; background: var(--tt-bg); color: var(--tt-text); }
.wt-toolbar { position: sticky; top: 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; padding: .3rem max(.5rem,env(safe-area-inset-right)) .3rem max(.5rem,env(safe-area-inset-left)); background: var(--tt-surface-opaque); border-bottom: 1px solid var(--tt-border); }
.wt-toolbar h1 { flex: 1; min-width: 8rem; font-size: var(--fs-sm); overflow-wrap: anywhere; }
.wt-toolbar input { width: 6rem; }
.wt-scroll { overflow-x: auto; }
.wt-strip { width: 100%; max-width: 720px; margin: 0 auto; }
.wt-strip img { display: block; width: 100%; height: auto; margin: 0; padding: 0; filter: none !important; }
#wt-reader > p { padding: .75rem; white-space: pre-wrap; font-size: var(--fs-xs); }
.wt-immersive .wt-toolbar h1, .wt-immersive .wt-toolbar input { display: none; }
