@font-face{font-family:Akkurat Mono;src:url(/AkkuratMono.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Akkurat Mono,monospace;background:#f5f5f7;color:#1d1d1f;line-height:1.5;text-transform:uppercase}button,input{font-family:inherit;text-transform:uppercase}input::placeholder{text-transform:uppercase}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f0f0f2}::-webkit-scrollbar-thumb{background:#c7c7cc;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#aeaeb2}::selection{background:#007aff33;color:#1d1d1f}.password-gate{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#e0e0e5,#d0d0d5);position:relative;overflow:hidden;padding:1rem;box-sizing:border-box}.password-card{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5);border-radius:24px;padding:3rem;width:100%;max-width:400px;margin:0 1rem;position:relative;z-index:10;box-shadow:0 25px 50px -12px #0000001a,0 0 0 1px #fffc inset}.password-card.shake{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-10px)}40%,80%{transform:translate(10px)}}.logo-section{text-align:center;margin-bottom:2.5rem}.logo-section img{width:100px;height:auto;margin-bottom:1.5rem}.logo-section h1{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,sans-serif;font-size:1.5rem;font-weight:600;color:#1d1d1f;margin:0 0 .5rem;letter-spacing:-.02em}.logo-section p{color:#86868b;font-size:.9rem;margin:0}.input-group{margin-bottom:1.5rem;position:relative}.input-group input{width:100%;padding:1rem 1.25rem;background:#fff;border:1px solid #d1d1d6;border-radius:12px;color:#1d1d1f;font-size:1rem;transition:all .2s ease;box-sizing:border-box}.input-group input:focus{outline:none;border-color:#007aff;box-shadow:0 0 0 3px #007aff1a}.input-group input::placeholder{color:#aeaeb2}.error-text{position:absolute;bottom:-1.5rem;left:0;color:#ff3b30;font-size:.8rem}.password-card button[type=submit]{width:100%;padding:1rem;background:#1d1d1f;border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s ease}.password-card button[type=submit]:hover{background:#3a3a3c;transform:translateY(-1px)}.password-card button[type=submit] span,.btn-arrow{position:relative;z-index:1}.password-card button[type=submit]:active{transform:translateY(0)}.btn-arrow{transition:transform .2s ease}.password-card button[type=submit]:hover .btn-arrow{transform:translate(4px)}.background-shapes{display:none}.crop-modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.crop-modal{background:#fff;border-radius:8px;padding:2rem;max-width:600px;width:90%;box-shadow:0 20px 60px #0000004d}.crop-modal h2{margin:0 0 1rem;font-size:1.1rem;font-weight:600;color:#1d1d1f;text-align:center;text-transform:uppercase;letter-spacing:.05em}.crop-canvas-container{display:flex;justify-content:center;margin-bottom:1rem}.crop-canvas-container canvas{border-radius:8px;box-shadow:0 4px 12px #0000001a}.crop-controls{margin-bottom:1.5rem}.scale-control{display:flex;align-items:center;gap:.75rem}.scale-control span{font-size:.85rem;color:#636366;min-width:40px}.scale-control input[type=range]{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:#d1d1d6;border-radius:3px;outline:none;cursor:pointer}.scale-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#fff;border:1px solid #d1d1d6;border-radius:50%;cursor:pointer;box-shadow:0 1px 4px #0000001f}.scale-value{font-weight:500;color:#1d1d1f!important;min-width:50px;text-align:right}.crop-hint{text-align:center;font-size:.8rem;color:#86868b;margin:.75rem 0 0}.crop-actions{display:flex;gap:.75rem}.crop-btn{flex:1;padding:.75rem 1rem;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.03em}.crop-btn.cancel{background:#fff;border:1px solid #d1d1d6;color:#636366}.crop-btn.cancel:hover{background:#f5f5f7;border-color:#86868b}.crop-btn.confirm{background:#1d1d1f;border:1px solid #1d1d1f;color:#fff}.crop-btn.confirm:hover{background:#3a3a3c}.control-panel{width:280px;min-width:280px;background:linear-gradient(180deg,#f5f5f7,#e8e8ec);border-right:1px solid #d1d1d6;display:flex;flex-direction:column;height:100vh;overflow-y:auto}.hidden-section{display:none!important}.panel-header{padding:1rem;border-bottom:1px solid #d1d1d6;display:flex;align-items:center;justify-content:center}.logo-image{width:60px;height:auto;object-fit:contain}.panel-section{padding:1rem 1.25rem;border-bottom:1px solid #d1d1d6}.panel-section h3{margin:0 0 .75rem;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#86868b}.section-header{cursor:default}.collapse-arrow{display:none}.upload-btn{width:100%;padding:.75rem 1rem;background:#fff;border:1px dashed #c7c7cc;border-radius:8px;color:#636366;font-size:.8rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s ease}.upload-btn:hover{border-color:#86868b;color:#3a3a3c;background:#fafafa}.upload-icon{font-size:1rem}.preview-thumbnail{margin-top:.75rem;border-radius:8px;overflow:hidden;border:1px solid #d1d1d6;box-shadow:0 2px 8px #0000000f}.preview-thumbnail img{width:100%;height:auto;display:block}.circular-preview{margin-top:.625rem;display:flex;justify-content:center}.circular-preview img{width:80px;height:80px;border-radius:50%;border:1px solid #d1d1d6;box-shadow:0 2px 6px #00000014;object-fit:cover}.toggle-row{display:flex;align-items:center;gap:.625rem;padding:.5rem 0;cursor:pointer}.toggle-row:first-of-type{margin-top:.75rem}.toggle-row input[type=checkbox]{width:14px;height:14px;cursor:pointer;flex-shrink:0;-webkit-appearance:none;appearance:none;background:#fff;border:1px solid #c7c7cc;border-radius:3px;transition:all .15s ease}.toggle-row input[type=checkbox]:checked{background:#1d1d1f;border-color:#1d1d1f}.toggle-row input[type=checkbox]:hover{border-color:#86868b}.toggle-label{font-size:.8rem;color:#3a3a3c;line-height:1.2}.preset-buttons{display:flex;flex-direction:column;gap:.5rem}.preset-btn{width:100%;padding:.75rem 1rem;background:#fff;border:1px solid #d1d1d6;border-radius:8px;color:#3a3a3c;font-size:.85rem;cursor:pointer;display:flex;align-items:center;gap:.75rem;transition:all .2s ease}.preset-btn:hover{border-color:#b0b0b5;background:#fafafa}.preset-btn.active{background:#1d1d1f;border:1px solid #1d1d1f;color:#fff;font-weight:500}.preset-icon{font-size:1rem;width:20px;text-align:center;color:#86868b}.quality-buttons{display:flex;gap:.5rem}.quality-btn{flex:1;padding:.625rem .5rem;background:#fff;border:1px solid #d1d1d6;border-radius:8px;color:#3a3a3c;font-size:.75rem;cursor:pointer;transition:all .2s ease}.quality-btn:hover{border-color:#b0b0b5;background:#fafafa}.quality-btn.active{background:#1d1d1f;border:1px solid #1d1d1f;color:#fff;font-weight:500}.export-btn{width:calc(100% - 2.5rem);margin:1rem 1.25rem;padding:.75rem;background:#1d1d1f;border:none;border-radius:8px;color:#fff;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s ease;letter-spacing:.04em}.export-btn:hover{background:#3a3a3c;transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.export-btn:active{transform:translateY(0);background:#1d1d1f}.export-icon{font-size:1rem}.gif-btn{margin-top:0;background:#fff;color:#1d1d1f;border:1px solid #d1d1d6}.gif-btn:hover{background:#fafafa;border-color:#86868b;box-shadow:0 2px 8px #00000014}.gif-btn:disabled{opacity:.6;cursor:not-allowed}.gif-btn.active{background:#1d1d1f;color:#fff;border-color:#1d1d1f}.gif-btn.active:hover{background:#3a3a3c}.panel-footer{margin-top:auto;padding:1rem 1.5rem;border-top:1px solid #d1d1d6}.logout-btn{width:100%;padding:.625rem;background:transparent;border:1px solid #d1d1d6;border-radius:8px;color:#86868b;font-size:.8rem;cursor:pointer;transition:all .2s ease}.logout-btn:hover{border-color:#ff3b30;color:#ff3b30}.slider-group{margin-bottom:.75rem}.slider-group:last-child{margin-bottom:0}.slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.375rem}.slider-header span{font-size:.75rem;color:#636366}.slider-value{color:#1d1d1f!important;font-weight:500;font-variant-numeric:tabular-nums;font-size:.75rem!important}.slider-group input[type=range]{width:100%;height:4px;-webkit-appearance:none;appearance:none;background:#d1d1d6;border-radius:2px;outline:none;cursor:pointer}.slider-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#fff;border:1px solid #d1d1d6;border-radius:50%;cursor:pointer;transition:transform .1s ease,box-shadow .1s ease;box-shadow:0 1px 3px #0000001a,0 1px 6px #0000000f}.slider-group input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 2px 6px #0000001f,0 3px 10px #00000014}.slider-group input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#fff;border:1px solid #d1d1d6;border-radius:50%;cursor:pointer;box-shadow:0 1px 3px #0000001a,0 1px 6px #0000000f}.reset-btn{width:100%;margin-top:.75rem;padding:.5rem;background:transparent;border:1px solid #d1d1d6;border-radius:6px;color:#86868b;font-size:.7rem;cursor:pointer;transition:all .2s ease}.reset-btn:hover{border-color:#86868b;color:#3a3a3c;background:#fafafa}@media(max-width:768px){.control-panel{width:100%;min-width:100%;height:auto;border-right:none;border-top:none;display:contents}.panel-header{padding:.75rem}.logo-image{width:50px}.panel-section{padding:.875rem 1rem;background:linear-gradient(180deg,#f5f5f7,#e8e8ec)}.panel-section h3{font-size:.6rem;margin-bottom:.5rem}.upload-btn{padding:.625rem .875rem;font-size:.75rem}.preset-btn{padding:.625rem .875rem;font-size:.8rem}.export-btn{margin:.5rem 1rem;padding:.75rem}.export-btn.gif-btn{margin-top:.375rem}.slider-group{margin-bottom:.625rem}.circular-preview img{width:60px;height:60px}.section-logo{order:1;background:linear-gradient(180deg,#f5f5f7,#e8e8ec);border-bottom:1px solid #d1d1d6}.section-uploads{order:2}.section-camera{order:3}.section-lighting{order:5}.section-export{order:6}.section-export-buttons{order:7;background:linear-gradient(180deg,#f5f5f7,#e8e8ec);padding:.5rem 1rem 1.5rem}.section-export-buttons .export-btn{width:100%;margin:.375rem 0}.section-header{cursor:pointer;display:flex;align-items:center;gap:.5rem;-webkit-tap-highlight-color:transparent}.collapse-arrow{display:inline-block;font-size:.5rem;transition:transform .2s ease;color:#86868b}.panel-section.collapsed .collapse-arrow{transform:rotate(-90deg)}.panel-section.collapsed .section-content{display:none}.panel-section h3{margin-bottom:.5rem}.panel-section.collapsed h3{margin-bottom:0}}.app{display:flex;min-height:100vh;background:#f5f5f7}.main-viewer{flex:1;position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#e0e0e5,#d0d0d5)}.viewer-container{width:100%;height:100vh}.view-mode-toggle{position:absolute;top:1.5rem;left:50%;transform:translate(-50%);display:grid;grid-template-columns:1fr 1fr;padding:.25rem;background:#ffffffe6;border:1px solid rgba(0,0,0,.08);border-radius:100px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #00000014;z-index:10}.mode-slider{position:absolute;top:.25rem;bottom:.25rem;left:.25rem;width:calc(50% - .25rem);background:#1d1d1f;border-radius:100px;transition:left .3s cubic-bezier(.4,0,.2,1);z-index:0}.mode-slider.right{left:50%}.mode-slider.left{left:.25rem}.mode-btn{position:relative;padding:.5rem 1.25rem;background:transparent;border:none;border-radius:100px;font-size:.75rem;font-weight:500;color:#86868b;cursor:pointer;transition:color .3s ease;letter-spacing:.05em;z-index:1;text-align:center}.mode-btn:hover{color:#1d1d1f}.mode-btn.active,.mode-btn.active:hover{color:#fff}.viewer-hint{position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.75rem;padding:.625rem 1.25rem;background:#ffffffe6;border:1px solid rgba(0,0,0,.08);border-radius:100px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #00000014}.viewer-hint span{font-size:.8rem;color:#86868b}.export-overlay{position:absolute;inset:0;background:#f5f5f7f2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.export-overlay p{color:#636366;font-size:.9rem}.export-spinner{width:40px;height:40px;border:3px solid #d1d1d6;border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite;background:linear-gradient(135deg,#ff6b9d,#c44cff,#4cc9ff);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:3px}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.app{display:flex;flex-direction:column;overflow-anchor:none}.main-viewer{height:50vh;min-height:300px;flex:none;order:4;overflow-anchor:none}.viewer-container{height:100%}.view-mode-toggle{top:1rem;padding:.2rem}.mode-slider{top:.2rem;bottom:.2rem;width:calc(50% - .2rem);transition:none}.mode-slider.left{left:.2rem}.mode-btn{padding:.4rem .75rem;font-size:.65rem;white-space:nowrap}.viewer-hint{bottom:1rem;padding:.4rem .75rem;white-space:nowrap}.viewer-hint span{font-size:.6rem}}