*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#app,#rotate{transition:opacity .4s}#rotate{opacity:0;pointer-events:none;justify-content:center;align-items:center;width:100%;height:100dvh;display:flex;position:absolute}#rotate>div{text-align:center;font-size:20px}:root{--bg-primary:#fff;--bg-surface:#f5f5f5;--accent:#263775;--text-primary:#000;--text-secondary:#666;--success:#4caf50}*{box-sizing:border-box;touch-action:pan-x pan-y;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app{flex-direction:column;height:100dvh;display:flex}.main{flex:1;justify-content:center;align-items:center;padding:16px;display:flex;overflow:hidden}.canvas-container{aspect-ratio:1000/1414;touch-action:none;background:#fff;border-radius:8px;width:100%;max-width:360px;position:relative;overflow:hidden}@media (width>=768px){.canvas-container{aspect-ratio:1000/1414;max-width:400px}}.frame-layer{object-fit:contain;z-index:10;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.photo-edit-layer{z-index:5;width:100%;height:100%;position:absolute;top:0;left:0}.photo-edit-layer .reactEasyCrop_CropArea,.photo-edit-layer .reactEasyCrop_CropAreaGrid:before,.photo-edit-layer .reactEasyCrop_CropAreaGrid:after{display:none!important}.placeholder{width:100%;height:100%}.error-text{color:var(--accent);text-align:center;margin-top:16px;padding:0 16px;font-size:14px}.footer{background:var(--bg-surface);border-top:1px solid #ffffff1a;padding:16px}.btn{cursor:pointer;border:none;border-radius:12px;width:100%;padding:14px 24px;font-size:16px;font-weight:600;transition:opacity .2s,transform .1s}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-secondary{color:var(--text-primary);background:#ffffff1a}.button-group{gap:12px;display:flex}.button-group .btn{flex:1}.modal-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal{background:var(--bg-surface);border-radius:24px 24px 0 0;width:100%;max-width:400px;padding:24px;animation:.3s slideUp}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal h3{text-align:center;margin-bottom:20px;font-size:20px}.modal-btn{width:100%;color:var(--text-primary);cursor:pointer;background:#ffffff14;border:none;border-radius:12px;margin-bottom:12px;padding:16px;font-size:16px;font-weight:500;transition:background .2s}.modal-btn:active{background:#ffffff26}.modal-btn.cancel{color:var(--text-secondary);background:0 0;margin-top:8px;margin-bottom:0}.notification{z-index:200;border-radius:24px;padding:12px 24px;font-size:14px;font-weight:500;animation:.3s fadeIn;position:fixed;bottom:100px;left:50%;transform:translate(-50%)}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%)translateY(20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.notification.success{background:var(--success);color:#fff}.notification.error{background:var(--accent);color:#fff}@media (width>=768px){.canvas-container{max-width:400px}}.video-modal{flex-direction:column;align-items:center;gap:16px;padding:20px;display:flex}.capture-btn{background:var(--accent);color:#fff;margin-top:16px}
