:root{--primary-color: #0056b3;--border-color: #ddd;--background-color: #f0f2f5}html{scroll-behavior:smooth}body{font-family:Arial,sans-serif;margin:0;padding:20px;background-color:var(--background-color);color:#333}.container{max-width:210mm;margin:auto;background:#fff;box-shadow:0 4px 8px #0000001a}#report-form{padding:15mm}.controls{padding:20px 15mm;text-align:center;border-bottom:2px solid #eee}button[type=submit]{background-color:#28a745;color:#fff;padding:12px 20px;border:none;border-radius:5px;cursor:pointer;font-size:16px;font-weight:700}button[type=submit]:hover{opacity:.9}.report-top-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:15px;border-bottom:2px solid #333;margin-bottom:30px}.logo-container img{max-width:200px;height:auto;opacity:.7}.report-header h1{text-align:center;font-size:28px;margin-bottom:30px}.header-table{width:100%;border-collapse:collapse;margin-bottom:30px;font-size:16px}.header-table td{border:1px solid #ccc;padding:12px}.header-table td:first-child{font-weight:700;width:30%;background-color:#f9f9f9}.header-table input{width:calc(100% - 10px);border:none;padding:5px;font-size:16px;background-color:transparent}#table-of-contents{margin-top:30px;padding:20px;border:1px solid #eee;border-radius:8px}#table-of-contents h2{color:var(--primary-color);border-bottom:1px solid #eee;padding-bottom:10px;margin-top:0}#table-of-contents ol{list-style:decimal;padding-left:30px}#table-of-contents li{font-size:16px;margin-bottom:12px}#table-of-contents a{text-decoration:none;color:#333}#table-of-contents a:hover{color:var(--primary-color)}.report-item{border:1px solid var(--border-color);border-radius:8px;margin-top:25px;padding:20px}.report-item h2{margin-top:0;padding-bottom:10px;border-bottom:1px solid #eee}.image-comparison{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:15px}.image-container{text-align:center}.image-container h3{margin-top:0;font-size:16px;color:#555}.image-preview{width:100%;height:250px;background-color:#fafafa;border:2px dashed #ccc;border-radius:5px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;overflow:hidden;transition:border-color .3s}.image-preview.drag-over{border-color:var(--primary-color);background-color:#e9f5ff}.image-preview:focus{border-color:var(--primary-color);outline:2px solid var(--primary-color);box-shadow:0 0 5px #0056b380}.image-preview img{max-width:100%;max-height:100%;object-fit:cover}.image-preview span{color:#aaa;font-style:italic;padding:10px;cursor:pointer}textarea{width:calc(100% - 22px);padding:10px;border:1px solid #ccc;border-radius:4px;resize:vertical;min-height:60px}#dynamic-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px}.add-photo-btn{background-color:var(--primary-color);color:#fff;padding:10px 15px;margin-top:20px;cursor:pointer;border:none;border-radius:5px}#backToTopBtn{display:none;position:fixed;bottom:100px;right:30px;z-index:99;border:none;outline:none;background-color:var(--primary-color);color:#fff;cursor:pointer;padding:0;border-radius:50%;width:50px;height:50px;font-size:24px;box-shadow:0 4px 8px #0003}.controls{position:fixed;bottom:0;left:0;width:100%;background-color:#fff;padding:15px 0;text-align:center;box-shadow:0 -2px 5px #0000001a;z-index:1000}body{padding-bottom:100px}#table-of-contents ul{list-style:none;padding-left:10px}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}
