body {  max-width: 100%;  height: 100% }
h1 { margin: 40px auto 30px; font-weight: 700; font-size: 22px; color: #fff; text-align: center; }
.container.outer { display:block; width: 100%;max-width: 700px;margin: 0 auto; padding: 0 15px }
.container.inner { display:block; width: 100%;max-width: 700px;margin: 0 auto 30px; background: #fff; border-radius: 5px; height: auto; min-height: 700px; padding: 12px 10px }
.htu { background: #fff3cd; color: #333; padding: 15px; border-radius: 5px; margin-top: 30px; margin-bottom: 30px; line-height: 150% }
button { margin: 5px; padding: 10px 10px; }
.btn-small { padding: 2px 6px; margin: 5px 2px; }
.btn-small:hover { padding: 2px 6px; margin: 5px 2px; background: #4caf50}
.block { border: 1px solid #ccc; padding: 10px; margin-bottom: 10px; border-radius: 6px; background:#fafafa; }
.block-controls { text-align:right; margin-bottom:15px; }
textarea { width:100%; box-sizing:border-box; }
.block-title-input { font-weight: 700; }
img.preview { max-width:100%; margin-top:6px; border-radius:4px; }
#cssBox { width:100%; height:80px; }
label{ color: #fff }

.center {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 10px;
}
.center br { display: none; }
.center button {
    width: 190px;
    margin: 0;
}
.center button.btn-wide {
    width: 240px;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .center { flex-direction: column; align-items: center; }
    .center button { width: 100%; max-width: 320px; }
    .center button.btn-wide { width: 100%; max-width: 320px; white-space: normal; }
}

button#addTitle:hover, button#addText:hover, button#addImage:hover, button#previewPdf:hover, button#generate:hover, button#saveConfig:hover, button#loadConfig:hover { background: #4caf50 }
button.delete{ background:#fe1818 }

body.scroll-locked { overflow: hidden; }

.pdf-preview-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.75);
}
.pdf-preview-modal {
    position: relative;
    width: 92vw;
    height: 92vh;
    max-width: 900px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    border-radius: 6px;
    overflow: hidden;
}
.pdf-preview-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 8px;
    background-color: #222;
}
.pdf-preview-toolbar button {
    background: none;
    border: none;
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    padding: 4px 10px;
    width: auto;
    margin: 0;
}
.pdf-preview-toolbar button:hover,
.pdf-preview-toolbar button:focus-visible {
    background: none;
    color: #ccc;
}
.pdf-preview-iframe {
    flex: 1;
    width: 100%;
    border: none;
}

#pdfFilename {
    background: #1e40af;
    color: #fff;
    border: none;
}

#pdfFilename::placeholder {
    color: #fff;
    opacity: 1;
}

#pdfFilename::-moz-placeholder {
    color: #fff;
    opacity: 1;
}

.btn-danger { background: #c0392b; }
.btn-danger:hover { background: #922b21; }
.page-number-toggle { color: #fff; display: inline-flex; align-items: center; gap: 6px; }

@media (hover: none) and (pointer: coarse) {
    #previewPdf { display: none; }
}