*{box-sizing:border-box}body{margin:0;color:#193344;background:radial-gradient(ellipse at top left,#e4f6f2,transparent 55%),#f6f8fb;font:16px/1.6 system-ui}header,main,footer{width:min(1320px,92%);margin:auto}header{display:flex;justify-content:space-between;align-items:center;padding:24px 0}.brand{font-size:25px;font-weight:850;text-decoration:none;color:#173447}.brand span{color:#7654cc}a{color:#166f70}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:60px;align-items:center;padding:28px 0 48px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:750;color:#257b78}h1{font-size:clamp(36px,4.6vw,62px);line-height:1.1;letter-spacing:-2px;margin:18px 0}h1 em{font-style:normal;color:#197978}.hero p{max-width:610px;color:#526975}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.sample-cover{background:white;border:1px solid #dfe8ec;border-radius:20px;padding:24px;box-shadow:0 18px 50px #19334412;position:relative;overflow:hidden}.sample-cover:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#24a694,#8c64df)}.product-photo{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:12px}.sample-cover small{font-size:11px;color:#6a7c87}.sample-cover h2{font-size:26px;margin:16px 0}.feature-list{list-style:none;padding:0;margin:0}.feature-list li{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:15px}.feature-list li:before{content:"✓";border-radius:50%;background:#e3f5ef;color:#187663;width:25px;height:25px;text-align:center;font-weight:700}.panel{background:white;border:1px solid #dce6ec;border-radius:18px;padding:32px;margin:24px 0;box-shadow:0 5px 24px #19334404}h2{line-height:1.25;margin:0 0 12px}button,.primary{font:inherit;border-radius:10px;border:1px solid #cddde2;padding:12px 20px;background:white;color:#234a59;cursor:pointer;text-decoration:none;display:inline-block;transition:background .15s,box-shadow .15s}.primary{background:#197b76;color:white;border-color:#197b76;font-weight:700;box-shadow:0 4px 10px #197b761a}.primary:hover{background:#12675f}button:hover{background:#edf6f6}button.primary:hover{background:#12675f}button:disabled{opacity:.5;cursor:wait}fieldset{border:0;padding:0;margin:0;min-width:0}label{display:block;font-size:14px;font-weight:650}input{display:block;width:100%;font:inherit;padding:12px;border:1px solid #d5e1e6;border-radius:9px;margin:7px 0 14px;background:white;color:#22394a}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #a78ae5;outline-offset:3px}.intro{color:#526975;margin-top:0}.dropzone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:30px 20px;background:#f2faf8;border:2px dashed #8bc5bb;border-radius:14px;cursor:pointer;text-align:center}.dropzone:hover,.dropzone.dragging{background:#e5f5ef;border-color:#197b76}.dropzone:focus-within{outline:3px solid #a78ae5;outline-offset:3px}.dropzone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0}.dropzone strong{font-size:18px;overflow-wrap:anywhere;max-width:100%}.dropzone>span{color:#5c777e;font-weight:400}.dropzone .upload-icon{background:#dcefe9;color:#197b76;border-radius:12px;font-size:30px;line-height:48px;width:48px;margin-bottom:8px}.limits,.privacy-note,.export-note{font-size:13px;color:#647985}.limits{margin:12px 0 24px}.privacy-note{background:#f1f6fa;padding:14px;border-radius:10px;margin-bottom:0}#status:not(:empty){padding:14px 18px;border-left:4px solid #197b76;background:#eaf5f1;border-radius:8px}#summary{padding:18px;background:#f0ebfa;border-radius:12px;font-weight:600}#inventory{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}#inventory p{margin:0;padding:12px 16px;background:#eef6f7;border:1px solid #e0ebed;border-radius:10px;font-size:14px}.table-scroll{overflow:auto;margin:20px 0}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;border-bottom:1px solid #e1e9ee;padding:14px;vertical-align:top}th{background:#f2f5f9;color:#405b6c}td{min-width:120px;max-width:400px;overflow-wrap:anywhere}details{background:#f5f3fb;padding:16px;border-radius:10px;margin:20px 0}summary{cursor:pointer;font-weight:650}#generate{margin-top:8px}#pages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:24px 0}#pages img{width:100%;border:1px solid #dce5ea;box-shadow:0 4px 18px #19334412}footer{padding:30px 0;color:#647985;font-size:13px}[hidden]{display:none!important}@media(max-width:750px){.hero{grid-template-columns:1fr;gap:24px;padding-top:16px}h1{letter-spacing:-1px}.panel{padding:20px}.actions>*{flex:1;text-align:center}.sample-cover{padding:18px}#pages{grid-template-columns:1fr}.dropzone{padding:24px 14px}#generate{width:100%}header{padding:18px 0}.hero .actions{flex-direction:column}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.sample-cover ul{list-style:none;padding:0}.sample-cover li{margin:10px 0}.sample-cover li:before{content:"✓";background:#e3f5ef;color:#197b76;border-radius:50%;padding:3px 7px;margin-right:9px}.hint{font-size:13px;color:#59717f}.panel h2:not(:first-child){margin-top:28px}#quiz-json{width:100%;padding:14px;border:1px solid #dce6ec;border-radius:10px;font:14px/1.5 Consolas,monospace}textarea{width:100%;padding:12px;border:1px solid #dce6ec;border-radius:9px;font:inherit;resize:vertical}.grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:32px 0}.features article{background:white;border:1px solid #dce6ec;border-radius:14px;padding:24px}.features h2{font-size:22px}#preview{width:100%;height:750px;border:1px solid #dce6ec;border-radius:14px}pre{overflow:auto;white-space:pre-wrap}small{display:block}.sample-cover li:before{font-weight:bold}@media(max-width:750px){.grid,.features{grid-template-columns:1fr}#preview{height:700px}}