form label,.bar label{display:block;font-size:.9rem;color:#b8c1d1}.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:10px}#add-page{align-items:end;margin:16px 0}#add-page label{flex:1 1 200px}.bar{margin:10px 0}.count{font-size:.9rem;color:#8fa0bd}.count.over{color:#ffd27f;font-weight:600}.tablewrap{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}#pages{width:100%;min-width:520px;border-collapse:collapse;font-size:.9rem}#pages td,#pages th{border-bottom:1px solid #1f2b40;padding:6px;text-align:left;vertical-align:top;overflow-wrap:anywhere}#pages th{white-space:nowrap}#pages td:last-child{white-space:nowrap}td button{margin:2px}section.card{margin-top:24px}
/* 0.1.2 small-screen fix: flex/grid children default to min-width:auto (their min-content), so the
   native file input (~300px intrinsic) in the Data card and long <select> options pushed the page
   wider than the viewport. Allow shrinking and cap controls to their container. */
section,.card,form,.field,#workspace,.tablewrap{min-width:0;max-width:100%}
.row>*,.grid3>*,.bar>*,.tabs>*{min-width:0;max-width:100%}
input,select,textarea,button,.file{max-width:100%}
.file input[type=file]{width:100%;min-width:0;max-width:100%}
select{text-overflow:ellipsis}
footer,p,li,h1,h2,h3,label{overflow-wrap:anywhere}
@media(max-width:560px){.row{flex-direction:column;align-items:stretch}.bar label,#add-page label{flex:1 1 auto}}
.check{display:flex;gap:8px;align-items:flex-start;margin:8px 0}.check input{width:auto;margin-top:4px}ul.plain{list-style:none;padding:0}#log{font-size:.9rem;padding-left:1.4em}#log li{margin:4px 0;overflow-wrap:anywhere}#log time{color:#8fa0bd}button:disabled{opacity:.45;cursor:not-allowed}
#preview{width:100%;height:520px;border:1px solid #33415c;border-radius:8px;background:#fff}#sec-list li{margin:8px 0}#sec-list p{white-space:pre-wrap}