*{box-sizing:border-box;padding:0;margin:0}body{font-family:Arial,sans-serif;margin:20px}.controls{margin-bottom:20px;display:flex;flex-wrap:wrap;align-items:center;gap:10px}.controls button,.controls input,.controls select{padding:8px;font-size:14px}.dropdown-icons{display:flex;gap:8px;align-items:center}.dropdown-container{position:relative;display:inline-block}.icon-btn{padding:6px 12px;font-size:14px;background-color:#f5f5f5;border:1px solid #ddd;border-radius:4px;cursor:pointer;display:flex;align-items:center;gap:4px}.icon-btn:hover{background-color:#e8e8e8}.csv-btn{background-color:#28a745;color:#fff}.csv-btn:hover{background-color:#218838}.csv-btn .icon-label{color:#fff}.icon-badge{font-size:11px;background-color:#007bff;color:#fff;padding:2px 6px;border-radius:10px}.icon-label{font-size:12px;color:#666}.dropdown-menu{position:absolute;top:100%;right:0;margin-top:4px;background:#fff;border:1px solid #ddd;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:100;min-width:200px;max-height:300px;overflow-y:auto}.dropdown-menu-small{min-width:140px}.dropdown-header{padding:10px 12px;font-weight:700;font-size:13px;color:#555;background-color:#f9f9f9;border-bottom:1px solid #eee;border-radius:6px 6px 0 0}.dropdown-actions{display:flex;gap:8px;padding:8px 12px;border-bottom:1px solid #eee;background-color:#fafafa}.dropdown-action-btn{flex:1 1;padding:6px 12px;font-size:12px;border:1px solid #ddd;border-radius:4px;background-color:#fff;color:#333;cursor:pointer;transition:background-color .2s,border-color .2s}.dropdown-action-btn:hover{background-color:#f0f0f0;border-color:#ccc}.dropdown-item{display:flex;align-items:center;padding:8px 12px;cursor:pointer;font-size:13px;border-bottom:1px solid #f0f0f0}.dropdown-item:last-child{border-bottom:none}.dropdown-item:hover{background-color:#f5f5f5}.dropdown-item.disabled{color:#999;cursor:not-allowed}.dropdown-item.disabled:hover{background-color:transparent}.dropdown-item.disabled input{cursor:not-allowed}.dropdown-item .device-color,.dropdown-item input[type=checkbox],.dropdown-item input[type=radio]{margin-right:8px}.charts-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;gap:20px;margin:20px 0}.chart-container{padding:15px;border:1px solid #ccc;border-radius:5px;overflow:hidden;min-width:0}.chart-container>div{width:100%!important;max-width:100%}.chart-container canvas{max-width:100%}@media (max-width:1024px){.charts-grid{grid-template-columns:1fr}}@media (max-width:768px){.controls{flex-direction:column;align-items:flex-start}.controls label{margin-left:0}.dropdown-icons{margin-left:0;flex-wrap:wrap}.header{flex-direction:column;align-items:flex-start;gap:10px}.user-info{flex-wrap:wrap}}.date-controls{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;white-space:nowrap}.date-controls input[type=date]{width:auto;min-width:130px}@media (max-width:768px){.date-controls{flex-shrink:0}.date-controls input[type=date]{min-width:115px;padding:6px;font-size:13px}.date-controls .nav-btn{padding:6px 10px;margin:0 4px;font-size:13px}}table{border-collapse:collapse;width:100%;margin-top:30px}td,th{border:1px solid #ccc;padding:6px;text-align:center;font-size:13px}th{background-color:#eee}.device-header{font-weight:700;font-size:14px}.table-container{overflow-x:auto}.nav-btn{padding:8px 16px;font-size:14px;text-decoration:none;background-color:#007bff;margin:0 10px}.nav-btn:hover{background-color:#0056b3}.device-color{display:inline-block;width:12px;height:12px;margin-right:5px;border-radius:2px}.table-toggle{margin:20px 0;padding:10px;background-color:#f0f0f0;border-radius:5px}.table-toggle label{cursor:pointer;font-weight:700}.table-toggle input[type=checkbox]{margin-right:8px;transform:scale(1.2)}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#f5f5f5;margin:-20px;padding:20px}.login-box{background:#fff;padding:40px;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.1);width:100%;max-width:400px}.login-box h1{text-align:center;margin-bottom:30px;color:#333}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:700;color:#555}.form-group input{width:100%;padding:12px;border:1px solid #ddd;border-radius:4px;font-size:16px}.form-group input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px rgba(0,123,255,.25)}.login-btn{width:100%;padding:12px;background-color:#007bff;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer;transition:background-color .2s}.login-btn:hover{background-color:#0056b3}.login-btn:disabled{background-color:#ccc;cursor:not-allowed}.error-message{color:#dc3545;background-color:#f8d7da;border:1px solid #f5c6cb;padding:10px;border-radius:4px;margin-bottom:20px;text-align:center}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid #ddd}.header h1{margin:0}.user-info{display:flex;align-items:center;gap:15px}.user-info span{color:#666}.logout-btn{padding:8px 16px;background-color:#dc3545;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.logout-btn:hover{background-color:#c82333}.admin-link{padding:8px 16px;background-color:#28a745;color:#fff;border-radius:4px;text-decoration:none;font-size:14px}.admin-link:hover{background-color:#218838}.cameras-link{padding:8px 16px;background-color:#6f42c1;color:#fff;border-radius:4px;text-decoration:none;font-size:14px}.cameras-link:hover{background-color:#5a32a3}.loading-container{display:flex;justify-content:center;align-items:center;min-height:100vh}.loading-container p{font-size:18px;color:#666}.register-link{margin-top:20px;text-align:center;color:#666}.register-link a{color:#007bff;text-decoration:none}.register-link a:hover{text-decoration:underline}.success-message{color:#28a745;background-color:#d4edda;border:1px solid #c3e6cb;padding:10px;border-radius:4px;margin-bottom:20px;text-align:center}.admin-container{max-width:1200px;margin:0 auto}.admin-table{width:100%;border-collapse:collapse;margin-top:20px}.admin-table td,.admin-table th{padding:12px;text-align:left;border-bottom:1px solid #ddd}.admin-table th{background-color:#f5f5f5;font-weight:700}.admin-table tr:hover{background-color:#f9f9f9}.status-approved{color:#28a745;font-weight:700}.status-pending{color:#ffc107;font-weight:700}.edit-btn{padding:6px 12px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;margin-right:8px}.edit-btn:hover{background-color:#0056b3}.delete-btn{padding:6px 12px;background-color:#dc3545;color:#fff;border:none;border-radius:4px;cursor:pointer}.delete-btn:hover{background-color:#c82333}.back-link{color:#007bff;text-decoration:none}.back-link:hover{text-decoration:underline}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:1000}.modal{background:#fff;padding:30px;border-radius:8px;min-width:400px;max-width:600px;max-height:80vh;overflow-y:auto}.form-section,.modal h2{margin-bottom:20px}.form-section h3{margin-bottom:10px;font-size:16px;color:#555}.checkbox-group{display:flex;flex-wrap:wrap;gap:15px}.checkbox-group label{display:flex;align-items:center;gap:5px;cursor:pointer}.devices-list{max-height:200px}.devices-list,.locations-list{flex-direction:column;overflow-y:auto;background-color:#f9f9f9;padding:10px;border-radius:4px}.locations-list{max-height:300px}.location-item{display:flex;align-items:flex-start;gap:8px;padding:8px;border-bottom:1px solid #eee}.location-item:last-child{border-bottom:none}.location-item input[type=checkbox]{margin-top:3px}.location-info{display:flex;flex-direction:column;gap:2px}.location-name{font-weight:700;color:#333}.location-period{font-size:.85em;color:#666}.location-device{font-size:.85em;color:#28a745}.form-help{font-size:.85em;color:#666;margin-bottom:10px}.modal-actions{display:flex;gap:10px;margin-top:20px}.save-btn{background-color:#28a745}.save-btn:hover{background-color:#218838}.text-muted{color:#999;font-style:italic}.owner-email{color:#666;font-size:12px;margin-left:5px}.device-id-display{background-color:#f5f5f5;padding:10px;border-radius:4px;margin-bottom:20px;word-break:break-all}.device-id-display code{font-family:monospace;font-size:12px;color:#333}.form-input{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:14px;margin-top:5px}.form-input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px rgba(0,123,255,.25)}.form-select{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:14px;margin-top:5px;background-color:#fff}.form-select:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px rgba(0,123,255,.25)}.form-section label{display:block;font-weight:700;color:#555;margin-bottom:5px}.hint-text{font-size:12px;color:#666;margin-top:8px}.form-hint{display:block;font-size:11px;color:#888;margin-top:4px}.hint-text a{color:#007bff}.no-data{text-align:center;color:#666;padding:40px}.sensors-link{padding:8px 16px;background-color:#17a2b8;color:#fff;border-radius:4px;text-decoration:none;font-size:14px}.sensors-link:hover{background-color:#138496}.add-btn{padding:8px 16px;background-color:#28a745;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.add-btn:hover{background-color:#218838}.status-active{color:#28a745;font-weight:700}.refresh-btn{background-color:#17a2b8}.refresh-btn:hover{background-color:#138496}.location-btn{padding:6px 12px;background-color:#6f42c1;color:#fff;border:none;border-radius:4px;cursor:pointer;margin-right:8px}.location-btn:hover{background-color:#5a32a3}.location-modal{min-width:600px;max-width:800px}.locations-list{margin-bottom:20px}.locations-list h3{margin-bottom:10px;font-size:16px;color:#333}.locations-table{width:100%;border-collapse:collapse;margin-bottom:10px}.locations-table td,.locations-table th{padding:8px 12px;text-align:left;border-bottom:1px solid #ddd;font-size:14px}.locations-table th{background-color:#f5f5f5;font-weight:700}.delete-btn-sm,.edit-btn-sm{padding:4px 8px;font-size:12px;border:none;border-radius:3px;cursor:pointer;margin-right:4px}.edit-btn-sm{background-color:#007bff;color:#fff}.edit-btn-sm:hover{background-color:#0056b3}.delete-btn-sm{background-color:#dc3545;color:#fff}.delete-btn-sm:hover{background-color:#c82333}.location-form{background-color:#f9f9f9;padding:15px;border-radius:6px;margin-bottom:20px}.location-form h3{margin-bottom:15px;font-size:16px;color:#333}.form-row{display:flex;gap:15px;margin-bottom:10px}.form-row .form-section{flex:1 1;margin-bottom:0}.form-actions{display:flex;gap:10px;margin-top:15px}.camera-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:20px;gap:20px;margin-top:20px}.camera-card{background:#fff;border:1px solid #ddd;border-radius:8px;padding:20px;cursor:pointer;transition:box-shadow .2s,transform .2s;text-align:center;position:relative}.camera-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.15);transform:translateY(-2px)}.camera-icon{font-size:48px;margin-bottom:10px}.camera-info{display:flex;flex-direction:column;gap:5px}.camera-id{font-weight:700;color:#333;word-break:break-all}.camera-count{color:#666;font-size:14px}.period-count-link{color:#007bff;cursor:pointer;text-decoration:underline}.period-count-link:hover{color:#0056b3}.camera-location{color:#28a745;font-size:12px;margin-top:4px}.camera-buttons{display:flex;gap:8px;position:absolute;top:10px;right:10px}.camera-location-btn{width:32px;height:32px;background:hsla(0,0%,100%,.9);border:1px solid #28a745;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.camera-location-btn:hover{background:rgba(40,167,69,.2)}.daily-view-btn{width:32px;height:32px;background:hsla(0,0%,100%,.9);border:1px solid #007bff;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.daily-view-btn:hover{background:rgba(0,123,255,.2)}.camera-list{display:flex;flex-direction:column;gap:16px;margin-top:20px}.camera-row{display:flex;background:#fff;border:1px solid #ddd;border-radius:8px;overflow:hidden;min-height:120px}.camera-row-left{display:flex;align-items:center;gap:12px;padding:16px;min-width:200px;max-width:250px;cursor:pointer;transition:background-color .2s;border-right:1px solid #eee}.camera-row-left:hover{background-color:#f8f9fa}.camera-row-left .camera-icon{font-size:32px;margin-bottom:0}.camera-row-left .camera-info{flex:1 1;min-width:0}.camera-row-left .camera-buttons{position:static;flex-direction:column}.camera-row-right{flex:1 1;display:flex;align-items:center;padding:8px;overflow-x:auto;background-color:#fafafa}.camera-row-images{display:flex;gap:8px;align-items:center}.camera-row-image{flex-shrink:0;width:140px;cursor:pointer;transition:transform .2s;text-align:center}.camera-row-image:hover{transform:scale(1.05)}.camera-row-image img{width:140px;height:105px;object-fit:cover;border-radius:4px;border:1px solid #ddd;transition:transform .3s ease}.camera-row-image img.rotated-270,.camera-row-image img.rotated-90{transform-origin:center center}.camera-row-image.has-rotation{display:flex;align-items:center;justify-content:center;overflow:hidden}.camera-row-image img{cursor:pointer}.camera-row-image-date{font-size:11px;color:#666;margin-top:4px}.camera-row-image-date.clickable{cursor:pointer;text-decoration:underline;color:#007bff}.camera-row-image-date.clickable:hover{color:#0056b3}.loading-indicator{color:#666;font-size:14px;padding:20px}.no-images-text{color:#999;font-size:14px;padding:20px}.daily-controls{background-color:#f8f9fa;padding:15px;border-radius:8px;margin-bottom:20px}.daily-date-range{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.daily-date-range label{font-weight:700;color:#555}.daily-date-range input[type=date]{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.daily-help{margin-top:10px;margin-bottom:0;font-size:13px;color:#666}.daily-images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));grid-gap:10px;gap:10px}.daily-image-card{background:#fff;border:1px solid #ddd;border-radius:8px;overflow:hidden;cursor:pointer;transition:box-shadow .2s}.daily-image-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.15)}.daily-image-card img{width:100%;height:90px;object-fit:cover;display:block}.daily-image-info{padding:8px;background:#f9f9f9;text-align:center}.daily-image-date{font-size:14px;font-weight:700;color:#333}.daily-image-time{font-size:11px;color:#666}@media (max-width:768px){.daily-images-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.daily-image-card img{height:70px}.daily-date-range{gap:5px}.daily-date-range label{display:none}.daily-date-range input[type=date]{padding:4px 6px;font-size:12px;width:115px}.daily-date-range .nav-btn{padding:4px 8px;font-size:11px}.daily-date-range .filter-btn{padding:4px 10px;font-size:12px}}.images-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.images-header h2{margin:0;font-size:18px;word-break:break-all}.back-btn{padding:8px 16px;background-color:#6c757d;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.back-btn:hover{background-color:#5a6268}.filter-controls{display:flex;align-items:center;gap:10px;margin-bottom:15px;flex-wrap:wrap}.filter-controls label{font-weight:700;color:#555}.filter-controls select{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.filter-btn{padding:8px 16px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.filter-btn:hover{background-color:#0056b3}.date-nav-buttons{display:flex;gap:2px}.nav-btn{padding:6px 10px;background-color:#6c757d;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:12px}.nav-btn:hover{background-color:#545b62}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.section-header h2{margin:0}.refresh-btn{padding:8px 16px;background-color:#28a745;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.refresh-btn:hover{background-color:#218838}.images-count{color:#666;margin-bottom:0}.images-count-row{justify-content:space-between;flex-wrap:wrap;margin-bottom:15px}.images-count-row,.pagination{display:flex;align-items:center;gap:10px}.pagination-btn{padding:8px 16px;border:1px solid #007bff;background-color:#007bff;color:#fff;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s}.pagination-btn:hover:not(:disabled){background-color:#0056b3}.pagination-btn:disabled{background-color:#ccc;border-color:#ccc;cursor:not-allowed}.pagination-info{font-size:14px;color:#666;min-width:100px;text-align:center}.pagination-bottom{margin-top:20px;justify-content:center}.images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));grid-gap:15px;gap:15px}.image-card{background:#fff;border:1px solid #ddd;border-radius:8px;overflow:hidden;cursor:pointer;transition:box-shadow .2s}.image-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.15)}.image-card img{width:100%;height:180px;object-fit:cover;display:block}.image-info{padding:10px;background:#f9f9f9}.image-date{font-size:12px;color:#333;margin-bottom:3px}.image-size{font-size:11px;color:#888}.preview-modal{background:#fff;border-radius:8px;max-width:90vw;max-height:90vh;overflow:auto;position:relative}.preview-close{position:absolute;top:10px;right:10px;width:32px;height:32px;background:rgba(0,0,0,.5);color:#fff;border:none;border-radius:50%;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10}.preview-close:hover{background:rgba(0,0,0,.7)}.preview-image{max-width:100%;max-height:80vh;display:block;margin:0 auto;padding-top:15px}.preview-info{padding:15px;background:#f9f9f9}.preview-info p{margin:5px 0;font-size:14px}@media (max-width:768px){.camera-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.camera-card{padding:15px}.camera-icon{font-size:36px}.images-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}.image-card img{height:130px}.filter-controls{gap:5px}.filter-controls label{display:none}.filter-controls input[type=date]{padding:4px 6px;font-size:12px;width:115px}.filter-controls .nav-btn{padding:4px 8px;font-size:11px}.filter-controls .filter-btn,.filter-controls .refresh-btn{padding:4px 10px;font-size:12px}.images-header{align-items:flex-start}.camera-row,.images-header{flex-direction:column}.camera-row-left{min-width:auto;max-width:none;border-right:none;border-bottom:1px solid #eee}.camera-row-right{padding:12px}.camera-row-image{width:110px}.camera-row-image img{width:110px;height:82px}.images-count-row{flex-direction:column;align-items:flex-start}.pagination{width:100%;justify-content:center}.pagination-btn{padding:6px 12px;font-size:13px}}.settings-btn{width:32px;height:32px;background:hsla(0,0%,100%,.9);border:1px solid #ddd;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.settings-btn:hover{background:#f0f0f0}.settings-modal{background:#fff;border-radius:8px;padding:30px;min-width:350px;max-width:90vw;position:relative}.settings-modal h3{margin:0 0 10px;font-size:20px;color:#333}.settings-device-id{color:#666;font-size:14px;margin-bottom:20px;word-break:break-all}.settings-form{display:flex;flex-direction:column;gap:20px}.settings-form .form-group{display:flex;flex-direction:column;gap:8px}.settings-form .form-group label{font-weight:700;color:#555;font-size:14px}.settings-form .form-group select{padding:10px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;background:#fff}.settings-form .form-group select:focus{outline:none;border-color:#007bff}.settings-updated{color:#888;font-size:12px;margin:0}.modal-buttons{display:flex;gap:10px;justify-content:flex-end;margin-top:10px}.cancel-btn{padding:10px 20px;background-color:#6c757d;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.cancel-btn:hover{background-color:#5a6268}.cancel-btn:disabled{opacity:.6;cursor:not-allowed}.save-btn{padding:10px 20px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.save-btn:hover{background-color:#0069d9}.save-btn:disabled{opacity:.6;cursor:not-allowed}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.page-header h1{margin:0}.app-layout{display:flex;min-height:100vh}.sidebar{width:220px;background-color:#2c3e50;color:#fff;display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;z-index:1000}.sidebar-header{padding:20px 15px;border-bottom:1px solid hsla(0,0%,100%,.1)}.sidebar-header h2{margin:0;font-size:16px;font-weight:700;color:#ecf0f1}.sidebar-nav{flex:1 1;padding:15px 0;overflow-y:auto}.sidebar-nav ul{list-style:none;margin:0;padding:0}.sidebar-nav li{margin:0}.sidebar-link{display:flex;align-items:center;padding:12px 20px;color:#bdc3c7;text-decoration:none;transition:background-color .2s,color .2s;font-size:14px}.sidebar-link:hover{background-color:hsla(0,0%,100%,.1);color:#fff}.sidebar-link.active{background-color:#3498db;color:#fff}.sidebar-icon{margin-right:10px;font-size:18px}.sidebar-label{flex:1 1}.sidebar-footer{padding:15px;border-top:1px solid hsla(0,0%,100%,.1)}.sidebar-user{display:flex;align-items:center;padding:10px;background-color:hsla(0,0%,100%,.05);border-radius:6px;margin-bottom:10px}.user-icon{margin-right:10px;font-size:20px}.user-name{font-size:13px;color:#ecf0f1;word-break:break-all}.sidebar-logout{display:flex;align-items:center;width:100%;padding:10px 12px;background-color:rgba(231,76,60,.2);color:#e74c3c;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s}.sidebar-logout:hover{background-color:rgba(231,76,60,.4)}.logout-icon{margin-right:8px}.main-content{flex:1 1;margin-left:220px;padding:20px;background-color:#f5f5f5;min-height:100vh}.mobile-header{display:none}@media (max-width:768px){.mobile-header{display:flex;justify-content:space-between;align-items:center;position:fixed;top:0;left:0;right:0;height:56px;background-color:#2c3e50;color:#fff;padding:0 15px;z-index:1001}.mobile-title{font-size:16px;font-weight:700;margin:0}.hamburger-btn{display:flex;flex-direction:column;justify-content:space-between;width:28px;height:20px;background:transparent;border:none;cursor:pointer;padding:0}.hamburger-line{display:block;width:100%;height:3px;background-color:#fff;border-radius:2px;transition:all .3s ease}.hamburger-line.open:first-child{transform:translateY(8.5px) rotate(45deg)}.hamburger-line.open:nth-child(2){opacity:0}.hamburger-line.open:nth-child(3){transform:translateY(-8.5px) rotate(-45deg)}.sidebar-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);z-index:999}.sidebar{width:260px;transform:translateX(-100%);transition:transform .3s ease;z-index:1000}.sidebar.open{transform:translateX(0)}.sidebar-header h2{display:block}.sidebar-header:after{display:none}.sidebar-label{display:inline}.sidebar-link{justify-content:flex-start;padding:12px 20px}.sidebar-icon{margin-right:10px}.sidebar-user{flex-direction:row;padding:10px}.user-icon{margin-right:10px;margin-bottom:0}.user-name{display:inline}.sidebar-logout{justify-content:flex-start;padding:10px 12px}.sidebar-logout span:not(.logout-icon){display:inline}.logout-icon{margin-right:8px}.main-content{margin-left:0;padding:71px 15px 15px}.preview-modal{max-width:98vw;max-height:95vh;border-radius:4px}.preview-image{max-height:70vh;padding-top:20px}.preview-info{padding:12px}.preview-info p{font-size:13px}}.rotation-controls{display:flex;flex-direction:column;gap:15px}.rotation-buttons{display:flex;gap:8px;flex-wrap:wrap}.rotation-btn{padding:8px 16px;border:2px solid #ddd;background-color:#fff;border-radius:6px;cursor:pointer;font-size:14px;font-weight:700;transition:all .2s}.rotation-btn:hover{border-color:#007bff;background-color:#f0f7ff}.rotation-btn.active{border-color:#007bff;background-color:#007bff;color:#fff}.rotation-preview{display:flex;justify-content:center;align-items:center;background-color:#f5f5f5;border:1px solid #ddd;border-radius:8px;padding:20px;min-height:200px;overflow:hidden}.rotation-preview img{max-width:200px;max-height:200px;object-fit:contain;transition:transform .3s ease}