*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#eef2f7;color:#172033}button,input{font:inherit}.app-shell{min-height:100vh;padding:24px}.container{max-width:1300px;margin:0 auto;display:grid;grid-template-columns:360px 1fr;gap:24px}.panel{background:#fff;border-radius:24px;box-shadow:0 14px 40px #141e3214}.controls{padding:24px}.controls h1{margin:0 0 10px;font-size:28px}.subtext{margin:0 0 24px;color:#5f6b7a;line-height:1.5}.control-group{margin-top:22px}.control-group label{display:block;font-weight:700;margin-bottom:10px}.helper{margin-top:8px;color:#5f6b7a;font-size:14px}.primary-btn,.row-buttons button,.segmented button{border:none;border-radius:14px;padding:12px 16px;cursor:pointer;transition:.2s ease}.primary-btn{background:#1f6fff;color:#fff}.primary-btn:hover{opacity:.92}.primary-btn:disabled,.export-disabled{opacity:.5;cursor:not-allowed}.segmented{display:grid;grid-template-columns:1fr 1fr;gap:10px}.segmented button{background:#edf2f8;color:#172033}.segmented button.active{background:#172033;color:#fff}.row-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.row-buttons button{background:#edf2f8;color:#172033}input[type=range]{width:100%}.preview-panel{padding:24px}.empty-state{min-height:600px;display:flex;align-items:center;justify-content:center}.empty-box{width:100%;border:2px dashed #ccd5e2;background:#f8fafc;border-radius:24px;padding:50px 24px;text-align:center}.empty-title{font-size:24px;font-weight:700;margin:0 0 8px}.empty-text{margin:0;color:#5f6b7a}.preview-wrap{position:relative;width:100%;min-height:600px;border-radius:24px;overflow:hidden;background:#111827;display:flex;align-items:center;justify-content:center}.full-image{max-width:100%;max-height:600px;object-fit:contain;display:block;transform-origin:center center}.crop-overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}.crop-overlay.landscape{width:min(80%,800px);aspect-ratio:16 / 9}.crop-overlay.portrait{width:min(32%,320px);aspect-ratio:9 / 16}.crop-border{width:100%;height:100%;border:4px solid #ffffff;box-shadow:0 0 0 9999px #00000073;border-radius:10px;transition:border-color .2s ease,box-shadow .2s ease}.crop-border.valid{border-color:#22c55e;box-shadow:0 0 0 9999px #00000073}.crop-border.invalid{border-color:#fff;box-shadow:0 0 0 9999px #00000073}.warning-box{margin-top:16px;padding:14px 16px;border-radius:16px;background:#fff7ed;border:1px solid #fdba74;color:#9a3412;font-size:14px;line-height:1.45}.warning-box.hidden{display:none}.info-bar{margin-top:16px;display:flex;flex-wrap:wrap;gap:14px;padding:14px 16px;background:#f8fafc;border-radius:16px;color:#4e5b6b}.status-good{color:#15803d;font-weight:700}.status-bad{color:#b45309;font-weight:700}@media (max-width: 960px){.container{grid-template-columns:1fr}}