@scope (.omni-generatory-puzzle){*{margin:0;padding:0;box-sizing:border-box}:scope{box-sizing:border-box;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:#f5f5f5;min-height:100vh;padding:20px}.container{width:100%}h1{color:#333;text-align:center;margin-bottom:30px;font-size:2.5rem}.main-content{display:flex;flex-direction:column;gap:20px}.options-panel{background:#fff;padding:25px;border-radius:15px;box-shadow:0 10px 30px rgb(0 0 0 / .2)}.option-group{margin-bottom:20px}.option-group label{display:block;margin-bottom:8px;font-weight:600;color:#333;font-size:1rem}.option-group input[type="text"],.option-group select{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color 0.3s}.option-group input[type="text"]:focus,.option-group select:focus{outline:none;border-color:#667eea}.option-group input[type="file"]{width:100%;padding:10px;border:2px dashed #e0e0e0;border-radius:8px;cursor:pointer;font-size:.95rem}.option-group input[type="range"]{width:100%;height:6px;border-radius:3px;background:#e0e0e0;outline:none;cursor:pointer}.option-group input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#4f883d;cursor:pointer}.option-group input[type="range"]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#4f883d;cursor:pointer;border:none}.image-preview-small{margin-top:10px;max-width:200px;max-height:200px;border-radius:8px;overflow:hidden;display:none}.image-preview-small img{width:100%;height:auto;display:block}.puzzle-type-toggle{display:flex;gap:0;border-radius:8px;overflow:hidden;border:2px solid #4f883d}.toggle-btn{flex:1;padding:10px 12px;border:none;background:#fff;color:#4f883d;font-size:.92rem;font-weight:600;cursor:pointer;transition:background 0.2s,color 0.2s;font-family:inherit;line-height:1.3}.toggle-btn:first-child{border-right:1px solid #4f883d}.toggle-btn.active{background:#4f883d;color:#fff}.toggle-btn:not(.active):hover{background:#eef5ea}.download-btn{width:100%;background-color:#4f883d;color:#fff;border:none;padding:15px 30px;font-size:1.1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:all 0.3s;box-shadow:0 4px 15px rgb(79 136 61 / .3)}.download-btn:hover{background-color:#3d6b2f;transform:translateY(-2px);box-shadow:0 6px 20px rgb(79 136 61 / .4)}.download-btn:active{transform:translateY(0)}.preview-panel{background:#fff;padding:25px;border-radius:15px;box-shadow:0 10px 30px rgb(0 0 0 / .2)}.preview-panel h2{color:#333;margin-bottom:20px;font-size:1.5rem}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.preview-toolbar p{margin:0 0 2px;color:#697386;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.preview-toolbar h2{margin:0}.preview-toolbar .download-btn{width:auto;padding:10px 14px;border-radius:5px;white-space:nowrap}.preview-content{background:#f9f9f9;padding:30px;border-radius:10px;min-height:400px}.preview-title{font-size:1.8rem;font-weight:700;color:#333;text-align:center;margin-bottom:30px}.preview-puzzle-container{display:flex;justify-content:center;align-items:center}#previewCanvas{max-width:100%;border:2px solid #ddd;border-radius:8px;background:#fff}@media (min-width:880px){.main-content{flex-direction:row;gap:30px}.options-panel{flex:0 0 300px;height:fit-content}.preview-panel{flex:1}}@media (max-width:879px){h1{font-size:1.8rem}.preview-title{font-size:1.4rem}}@media (max-width:480px){:scope{padding:10px}h1{font-size:1.5rem;margin-bottom:20px}.options-panel,.preview-panel{padding:15px}}}