:root{--sidebar-width: 350px;--bottom-panel-height: 55vh;--bg-color: #f0f2f5;--panel-bg: #ffffff;--border-color: #ddd;--primary-blue: #003399}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:var(--bg-color);color:#333}.app-container{display:flex;height:100vh;width:100vw;overflow:hidden}.input-panel{width:var(--sidebar-width);background-color:var(--panel-bg);border-right:1px solid var(--border-color);display:flex;flex-direction:column;height:100%;box-shadow:2px 0 5px #0000000d;z-index:10}.input-header{padding:0 0 15px;border-bottom:1px solid var(--border-color);margin-bottom:5px}.input-header h1{margin:0;font-size:1.5rem;color:var(--primary-blue)}.input-form{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:15px}.button-group{display:flex;gap:10px;margin-top:10px}.action-button{width:100%;padding:15px;color:#fff;border:none;border-radius:8px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px}.button-group .action-button{flex:1;width:auto}.download-button{background-color:var(--primary-blue)}.download-button:hover{background-color:#002673}.share-button{background-color:#28a745}.share-button:hover{background-color:#218838}.action-button:active{transform:translateY(1px)}.action-button:disabled{background-color:#ccc;cursor:not-allowed}.form-group{display:flex;flex-direction:column;gap:5px}.form-group label{font-size:.85rem;font-weight:600;color:#666}.form-group input,.form-group select{padding:10px;border:1px solid var(--border-color);border-radius:4px;font-size:1rem;width:100%}.input-with-clear{display:flex;align-items:center;gap:8px}.clear-btn{background:#eee;border:none;border-radius:4px;width:32px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;color:#666;line-height:1;transition:background .2s;flex-shrink:0}.clear-btn:hover{background:#ddd;color:#333}.autocomplete-container{position:relative}.autocomplete-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid var(--border-color);border-top:none;border-radius:0 0 4px 4px;max-height:200px;overflow-y:auto;z-index:100;box-shadow:0 4px 6px #0000001a}.autocomplete-item{padding:10px;cursor:pointer;font-size:.9rem;border-bottom:1px solid #f0f0f0}.autocomplete-item:last-child{border-bottom:none}.autocomplete-item:hover{background-color:#f5faff}.autocomplete-item .airport-code{font-weight:700;color:var(--primary-blue);margin-right:8px}.autocomplete-item .airport-name{color:#666;font-size:.8rem}.boarding-pass-stack{position:relative;width:650px;height:320px;display:flex;align-items:center;justify-content:center}.export-container{background-color:#fff;padding:150px;display:flex;align-items:center;justify-content:center;min-width:950px;min-height:620px}.boarding-pass-container{position:absolute;width:650px;height:320px;filter:drop-shadow(1px 0 0 #aaa) drop-shadow(-1px 0 0 #aaa) drop-shadow(0 1px 0 #aaa) drop-shadow(0 -1px 0 #aaa) drop-shadow(-2px 4px 12px rgba(0,0,0,.15))}.boarding-pass{width:100%;height:100%;background-color:#fff;border-radius:12px 0 0 12px;overflow:hidden;display:flex;flex-direction:column;color:#333;-webkit-mask-image:radial-gradient(circle at 100% 15px,transparent 10px,white 10.5px);-webkit-mask-size:100% 30px;mask-image:radial-gradient(circle at 100% 15px,transparent 10px,white 10.5px);mask-size:100% 30px}.pass-header{height:50px;background-color:var(--primary-blue);color:#fff;display:flex;align-items:center;padding:0 25px;font-weight:700;font-size:1.2rem;text-transform:uppercase;letter-spacing:1px}.pass-body{flex:1;padding:20px 25px;display:flex;flex-direction:column;position:relative}.pass-barcode{position:absolute;top:0;right:40px;width:140px;height:72px;object-fit:contain}.passenger-info{font-size:1rem;color:#444;text-transform:uppercase;margin-bottom:20px;font-weight:500}.flight-route{display:flex;align-items:center;gap:30px;margin-bottom:20px}.airport-info{display:flex;flex-direction:column}.iata-code{font-size:4rem;font-weight:900;line-height:1;color:#000}.airport-name{font-size:.9rem;color:#444;margin-top:5px;font-weight:500}.airport-location{font-size:.8rem;color:#444;margin-top:2px}.route-arrow{font-size:2.5rem;color:#ccc}.flight-details{display:flex;gap:40px;margin-top:auto}.detail-item{display:flex;flex-direction:column}.detail-label{font-size:.7rem;color:#999;text-transform:uppercase;margin-bottom:2px}.detail-value{font-size:1.1rem;font-weight:700}@media(max-width:600px){.boarding-pass-stack{transform:scale(.6)}}.render-area{flex:1;background-color:var(--bg-color);display:flex;align-items:center;justify-content:center;position:relative;overflow:auto;padding:40px}.render-placeholder{border:2px dashed #ccc;border-radius:12px;width:80%;height:60%;display:flex;align-items:center;justify-content:center;color:#999;text-align:center;padding:20px}@media(max-width:768px){.app-container{flex-direction:column}.input-panel{width:100%;height:var(--bottom-panel-height);border-right:none;border-top:1px solid var(--border-color);order:2}.render-area{height:calc(100vh - var(--bottom-panel-height));order:1}}dialog{border:none;border-radius:12px;box-shadow:0 10px 25px #0003;padding:30px;max-width:500px;width:90%}dialog::backdrop{background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}#dlg-credits{font-size:1.1rem;color:#333;margin-bottom:10px;text-align:center}#dlg-credits a{color:var(--primary-blue);text-decoration:none;font-weight:700}#dlg-cta{margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid var(--border-color);display:flex;justify-content:center}#dlg-cta a{background-color:#28a745;color:#fff;text-decoration:none;font-weight:700;padding:10px 20px;border-radius:6px;transition:background-color .2s;display:inline-block}#dlg-cta a:hover{background-color:#218838}#dlg-help p{line-height:1.6;color:#444;margin-bottom:15px}#dlg-close{position:absolute;top:15px;right:15px;background:none;border:none;font-size:24px;cursor:pointer;color:#999}#dlg-close:hover{color:#333}.help-button{background-color:#6c757d}.help-button:hover{background-color:#5a6268}.scroll-spacer{height:150px;flex-shrink:0}.scanner-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000e6;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}.scanner-container{position:relative;width:90%;max-width:600px;aspect-ratio:4/3;background:#000;border-radius:12px;overflow:hidden;box-shadow:0 0 30px #00000080}.scanner-video{width:100%;height:100%;object-fit:cover}.scanner-error{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:2rem;text-align:center;background:#1e1e1e;color:#ff4757;font-weight:600}.scanner-laser{position:absolute;top:50%;left:10%;right:10%;height:2px;background:#ff000080;box-shadow:0 0 10px red;animation:scan 2s infinite ease-in-out}@keyframes scan{0%,to{top:20%}50%{top:80%}}.scanner-controls{margin-top:2rem;display:flex;gap:1rem;width:90%;max-width:600px}.scanner-close-btn{padding:.8rem 2rem;background:#ff4757;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer}.scanner-camera-select{flex:1;padding:.8rem;border-radius:8px;background:#2f3542;color:#fff;border:1px solid #57606f}.scan-button{width:100%;margin-bottom:1.5rem;background:#2ed573;color:#fff;font-weight:700;font-size:1.1rem;padding:1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.scan-button:hover{background:#26af5f}.scan-button svg{width:20px;height:20px}
