:root{--bg: #f4f5f6;--surface: #ffffff;--surface-muted: #f0f1f3;--text: #1f2933;--muted: #59636f;--soft: #737d89;--border: #cfd5dd;--border-strong: #aeb7c2;--primary: #245a9a;--primary-strong: #1d4778;--primary-soft: #edf3fa;--danger: #9f2a21;--danger-soft: #fff3f1;--success: #176044;--success-soft: #eef7f2;--warning: #815300;--warning-soft: #fff8e8;--shadow: none;--radius: 4px;--font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;color:var(--text);background:var(--bg);font-family:var(--font);font-size:16px;line-height:1.5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--bg)}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,p{margin:0}h1,h2,h3{color:var(--text);line-height:1.12;letter-spacing:0}h1{max-width:780px;font-size:2.65rem;font-weight:700;overflow-wrap:break-word}h2{font-size:1.2rem;font-weight:650}h3{font-size:.98rem;font-weight:650}p{overflow-wrap:anywhere}textarea{resize:vertical}#root{min-height:100svh}.app-shell{min-height:100svh;color:var(--text)}.site-header{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:0 32px;border-bottom:1px solid var(--border);background:#fff}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--text);font-weight:700;text-decoration:none}.brand:hover{text-decoration:none}.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--border-strong);border-radius:4px;color:var(--primary);background:#fff}.header-nav{display:flex;align-items:center;gap:20px;font-size:.94rem;font-weight:650}.header-nav a{color:var(--muted)}.hero-section{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:34px 0 18px}.hero-copy{display:grid;gap:18px;min-width:0}.eyebrow{width:fit-content;padding:0;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:.82rem;font-weight:650;text-transform:uppercase}.hero-intro{max-width:760px;color:var(--muted);font-size:1.12rem}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px}.hero-proof{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:.96rem}.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border-radius:4px;border:1px solid transparent;padding:0 15px;font-weight:650;text-decoration:none;transition:background .12s ease,border-color .12s ease,color .12s ease}.primary-button{background:var(--primary);color:#fff;box-shadow:none}.primary-button:hover{background:var(--primary-strong);text-decoration:none}.primary-button:disabled{color:#fff;background:#9aa4b1;box-shadow:none}.secondary-button{background:var(--surface);color:var(--text);border-color:var(--border-strong)}.secondary-button:hover{border-color:var(--primary);color:var(--primary);text-decoration:none}.tool-shell{display:grid;grid-template-columns:minmax(0,1fr) 376px;gap:24px;width:min(1180px,calc(100% - 48px));margin:0 auto;align-items:start}.tool-main,.tool-sidebar{display:grid;gap:18px;min-width:0}.tool-sidebar{position:sticky;top:84px}.upload-panel,.settings-panel,.progress-panel,.result-panel,.layout-preview-panel,.privacy-note,.empty-list,.image-list-section,.use-case-section,.related-section,.faq-section{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.dropzone{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;min-height:148px;padding:22px;border:1px dashed var(--border-strong);border-radius:var(--radius);background:#fff}.dropzone.is-dragging{border-color:var(--primary);background:#f7fafd}.dropzone h2{margin-bottom:4px}.dropzone>div,.result-status>div,.privacy-note>div{min-width:0}.dropzone p,.section-heading p,.card-heading p,.disabled-reason,.static-setting,.privacy-note p,.faq-list p,.site-footer p,.use-case-section li,.related-section a{color:var(--muted)}.dropzone-icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border:1px solid var(--border);border-radius:4px;color:var(--primary);background:#fff}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.rejection-list{display:grid;gap:10px;margin-top:12px}.notice{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border-radius:4px;font-size:.92rem}.notice strong,.notice span{display:block}.notice-error{color:var(--danger);background:var(--danger-soft);border:1px solid #ffd1cc}.empty-list{display:grid;justify-items:center;gap:8px;padding:36px 20px;text-align:center}.empty-list svg{color:var(--soft)}.image-list-section{padding:20px}.section-heading{display:flex;justify-content:space-between;gap:16px;margin-bottom:14px}.image-list{display:grid;gap:12px}.image-card{display:grid;grid-template-columns:38px 128px minmax(0,1fr);gap:14px;align-items:start;padding:12px;border:1px solid var(--border);border-radius:var(--radius);background:#fff}.image-card.is-sorting{position:relative;z-index:5;box-shadow:none;outline:2px solid var(--primary)}.drag-handle{align-self:center;color:var(--soft);cursor:grab;touch-action:none}.image-card.is-sorting .drag-handle{cursor:grabbing}.thumb-frame{display:flex;align-items:center;justify-content:center;width:128px;aspect-ratio:4 / 3;overflow:hidden;border:1px solid var(--border);border-radius:4px;background:#f4f6f9}.thumb-frame img{max-width:100%;max-height:100%;object-fit:contain}.card-main{display:grid;gap:12px;min-width:0}.card-heading{display:flex;justify-content:space-between;gap:12px;min-width:0}.card-heading h3{overflow-wrap:anywhere}.status-pill{display:inline-flex;align-items:center;flex:0 0 auto;height:26px;padding:0 9px;border:1px solid currentColor;border-radius:4px;font-size:.78rem;font-weight:650}.status-ready{color:var(--success);background:var(--success-soft)}.status-error{color:var(--danger);background:var(--danger-soft)}.field-error{color:var(--danger);font-size:.9rem}.caption-field,.inline-input,.text-input-row,.select-row,.feedback-textarea{display:grid;gap:6px}.caption-field span,.inline-input span,.text-input-row span,.select-row span,.feedback-textarea span{color:var(--text);font-size:.86rem;font-weight:650}.caption-field textarea,.feedback-textarea textarea,.inline-input input,.text-input-row input,.select-row select{width:100%;border:1px solid var(--border-strong);border-radius:4px;background:#fff;color:var(--text)}.caption-field textarea,.feedback-textarea textarea{min-height:64px;padding:9px 10px;line-height:1.35}.caption-field small{color:var(--soft);text-align:right}.card-actions{display:flex;flex-wrap:wrap;gap:8px}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border-radius:4px;border:1px solid var(--border);color:var(--text);background:#fff}.icon-button:hover{border-color:var(--primary);color:var(--primary)}.icon-button:disabled{color:#aeb6c2;border-color:var(--border)}.danger-button:hover{color:var(--danger);border-color:#f2b8b5;background:var(--danger-soft)}.settings-panel{display:grid;gap:18px;padding:20px}.panel-title{display:flex;align-items:center;gap:8px}.panel-title svg{color:var(--muted)}.setting-group{display:grid;gap:10px;min-width:0;margin:0;padding:0;border:0}.setting-group legend{margin-bottom:8px;color:var(--text);font-size:.92rem;font-weight:650}.segmented-control{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.segmented-control button{min-height:38px;border:1px solid var(--border-strong);border-radius:4px;background:#fff;color:var(--text);font-size:.88rem;font-weight:650}.segmented-control button.is-selected,.secondary-button.is-selected{color:var(--primary-strong);border-color:var(--primary);background:#f5f9fd}.inline-input{grid-template-columns:1fr 112px;align-items:center}.inline-input input,.text-input-row input,.select-row select{height:38px;padding:0 10px}.select-row{grid-template-columns:minmax(0,1fr) 150px;align-items:center}.radio-row,.checkbox-row{display:flex;gap:10px;align-items:flex-start;padding:10px;border:1px solid var(--border);border-radius:4px;background:#fff;cursor:pointer}.radio-row input,.checkbox-row input{margin-top:3px;accent-color:var(--primary);cursor:pointer}.radio-row span{display:grid;gap:2px;color:var(--muted);font-size:.9rem}.radio-row strong{color:var(--text)}.radio-row:has(input:checked){border-color:var(--primary);background:#f8fbff}.static-setting{display:flex;gap:8px;align-items:flex-start;padding:10px;border:1px solid var(--border);border-radius:4px;background:var(--surface-muted);font-size:.9rem}.build-button{width:100%}.disabled-reason{font-size:.9rem}.progress-panel,.result-panel,.layout-preview-panel,.privacy-note{padding:18px}.progress-copy{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px;font-size:.9rem}.progress-copy span{color:var(--muted)}.progress-track{height:8px;overflow:hidden;border-radius:999px;background:var(--surface-muted)}.progress-track span{display:block;height:100%;border-radius:inherit;background:var(--primary);transition:width .16s ease}.build-error{padding:12px;border:1px solid #ffd1cc;border-radius:4px;color:var(--danger);background:var(--danger-soft)}.result-panel{display:grid;gap:16px}.result-status{display:flex;gap:10px;align-items:flex-start}.result-status.success svg{color:var(--success)}.result-status.warning svg{color:var(--warning)}.result-status p{color:var(--muted);font-size:.93rem}.report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}.report-grid div{padding:10px;border:1px solid var(--border);border-radius:4px;background:#fff}.report-grid dt{color:var(--muted);font-size:.78rem;font-weight:650}.report-grid dd{margin:3px 0 0;color:var(--text);font-weight:650}.warning-box{display:grid;gap:6px;padding:12px;border:1px solid #f2d89b;border-radius:4px;color:var(--warning);background:var(--warning-soft);font-size:.92rem}.download-button{width:100%}.pdf-preview{width:100%;height:420px;border:1px solid var(--border);border-radius:4px;background:var(--surface-muted)}.layout-preview-panel{display:grid;gap:14px}.preview-page{position:relative;width:min(100%,260px);aspect-ratio:595.28 / 841.89;margin:0 auto;padding:18px 16px 28px;border:1px solid var(--border-strong);background:#fff}.preview-note{color:var(--muted);font-size:.86rem}.preview-items{display:grid;gap:10px;height:100%;min-height:0}.preview-page-adaptive .preview-items{grid-template-rows:1fr 1fr}.preview-item{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:6px;min-height:0}.preview-filename{overflow:hidden;color:var(--text);font-size:.72rem;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.preview-image-area{display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;border:1px solid var(--border);background:#f8f9fb}.preview-image-area img{max-width:100%;max-height:100%;object-fit:contain}.preview-caption{display:-webkit-box;overflow:hidden;color:#111827;font-weight:650;line-height:1.28;-webkit-box-orient:vertical;-webkit-line-clamp:3}.preview-page-number{position:absolute;color:#374151;font-weight:500;line-height:1}.preview-page-number.bottom-right{right:16px;bottom:10px}.preview-page-number.bottom-center{right:0;bottom:10px;left:0;text-align:center}.preview-page-number.bottom-left{bottom:10px;left:16px}.preview-page-number.top-right{top:10px;right:16px}.feedback-box{display:grid;gap:10px;padding-top:12px;border-top:1px solid var(--border)}.feedback-actions{display:flex;gap:8px}.feedback-mail-button{width:fit-content}.feedback-note{color:var(--muted);font-size:.86rem}.privacy-note{display:flex;gap:12px;align-items:flex-start}.privacy-note svg{flex:0 0 auto;color:var(--primary)}.privacy-note h2{margin-bottom:5px;font-size:1rem}.use-case-section,.related-section,.faq-section{width:min(1180px,calc(100% - 48px));margin:24px auto 0;padding:24px}.use-case-section ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:16px 0 0;padding-left:20px}.related-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.related-links a{display:inline-flex;align-items:center;min-height:36px;padding:0 11px;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--text);font-weight:650}.faq-list{display:grid;gap:10px;margin-top:16px}.faq-list details{border:1px solid var(--border);border-radius:4px;background:#fff}.faq-list summary{cursor:pointer;padding:14px 16px;color:var(--text);font-weight:650}.faq-list p{padding:0 16px 16px}.site-footer{display:grid;gap:16px;width:min(1180px,calc(100% - 48px));margin:24px auto 0;padding:24px 0 42px;border-top:1px solid var(--border)}.site-footer nav{display:flex;flex-wrap:wrap;gap:12px}.site-footer a{color:var(--muted);font-weight:600}.disclaimer{max-width:920px;color:var(--text);font-weight:600}@media(max-width:920px){h1{font-size:2.55rem}.site-header{padding:0 18px}.header-nav{gap:12px}.hero-section,.tool-shell,.use-case-section,.related-section,.faq-section,.site-footer{width:min(calc(100% - 28px),720px)}.hero-section{padding-top:32px}.tool-shell{grid-template-columns:1fr}.tool-sidebar{position:static}.dropzone{grid-template-columns:1fr;justify-items:start}.dropzone .secondary-button{width:100%}.image-card{grid-template-columns:34px minmax(86px,108px) minmax(0,1fr);gap:10px}.thumb-frame{width:100%}.use-case-section ul{grid-template-columns:1fr}}@media(max-width:640px){h1{font-size:2rem}.site-header{align-items:flex-start;flex-direction:column;gap:8px;padding:12px 14px}.header-nav{width:100%;justify-content:space-between}.hero-actions,.hero-actions .primary-button{width:100%}.hero-proof{align-items:flex-start}.image-list-section,.settings-panel,.progress-panel,.result-panel,.layout-preview-panel,.privacy-note,.use-case-section,.related-section,.faq-section{padding:16px}.image-card{grid-template-columns:36px minmax(0,1fr)}.thumb-frame{grid-column:1 / -1;width:100%;max-height:210px}.card-main{grid-column:1 / -1}.card-heading{flex-direction:column}.segmented-control,.report-grid,.select-row{grid-template-columns:1fr}.privacy-note{flex-direction:column}.pdf-preview{height:340px}}