:root{--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg-canvas: #F9F9FB;--bg-surface: #FFFFFF;--text-primary: #111827;--text-secondary: #374151;--text-muted: #6B7280;--text-on-primary: #FFFFFF;--border-color: #E5E7EB;--border-color-interactive: #D1D5DB;--primary: #111827;--primary-hover: #374151;--secondary: #E5E7EB;--secondary-hover: #D1D5DB;--ring-color: rgba(17, 24, 39, .5);--destructive: #be123c;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--transition: all .2s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-family);background-color:var(--bg-canvas);color:var(--text-secondary);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(var(--border-color) 1px,transparent 1px);background-size:24px 24px}button,input{font-family:inherit;font-size:inherit;user-select:none;-webkit-user-select:none}.app-container{display:flex;flex-direction:column;height:100%;padding:1.5rem;gap:1.5rem;overflow:hidden}.app-header{display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.app-header h1{font-size:1.5rem;font-weight:600;color:var(--text-primary)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:2rem;flex-grow:1;min-height:0}.image-column,.controls-column{display:flex;flex-direction:column;min-height:0}.controls-column{gap:1rem}.upload-placeholder{display:flex;align-items:center;justify-content:center;text-align:center;height:100%;animation:fadeIn .5s ease-out}.upload-placeholder-content{max-width:500px}.upload-placeholder h1{font-size:2.5rem;font-weight:700;color:var(--text-primary);letter-spacing:-.02em}.upload-placeholder p{font-size:1.125rem;color:var(--text-muted);margin:.75rem 0 2rem}.upload-box{padding:2rem;border:1px dashed var(--border-color-interactive);border-radius:var(--radius-lg);background-color:var(--bg-surface)}.upload-text{font-size:.9rem;color:var(--text-muted);margin-top:1rem}.surface-card{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:column;transition:var(--transition);min-height:0}.card-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border-color);flex-shrink:0}.card-title{font-size:1.125rem;font-weight:600;color:var(--text-primary)}.card-content{padding:1rem;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-grow:1}.card-content img{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--radius-md)}.image-card{flex-grow:1}.actions-footer{padding-top:1rem;flex-shrink:0}.actions-container{display:flex;gap:.75rem;justify-content:flex-end;align-items:center;width:100%}.status-container{font-size:.875rem;min-height:24px;margin-bottom:.5rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;border-radius:var(--radius-md);border:1px solid var(--border-color-interactive);font-size:.95rem;font-weight:500;cursor:pointer;transition:var(--transition);white-space:nowrap;background-color:var(--bg-surface);color:var(--text-primary)}.btn:hover:not(:disabled){border-color:#9ca3af;background-color:var(--bg-canvas)}.btn:focus-visible{outline:2px solid var(--ring-color);outline-offset:2px}.btn:disabled{opacity:.6;cursor:not-allowed}.btn--primary{background-color:var(--primary);color:var(--text-on-primary);border-color:var(--primary)}.btn--primary:hover:not(:disabled){background-color:var(--primary-hover);border-color:var(--primary-hover)}.btn--secondary{background-color:var(--secondary);border-color:var(--secondary);color:var(--text-secondary)}.btn--secondary:hover:not(:disabled){background-color:var(--secondary-hover);border-color:var(--secondary-hover)}.btn--icon{padding:.5rem}.selection-panel{flex:1 1 auto;background-color:var(--bg-surface);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-md);display:flex;flex-direction:column;animation:fadeIn .5s ease-out forwards;overflow:hidden}.panel-body{display:flex;flex-direction:column;gap:1.75rem;padding:1.5rem;overflow-y:auto;flex-grow:1}.panel-footer{padding:1rem 1.5rem;border-top:1px solid var(--border-color);background-color:#f9f9fb80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);flex-shrink:0}.generate-btn{width:100%}.control-group{display:flex;flex-direction:column;gap:.75rem}.control-group-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.control-label{font-weight:500;color:var(--text-primary);font-size:.9rem}.control-label-group{display:flex;justify-content:space-between;align-items:center}.continent-tabs{display:flex;border-bottom:1px solid var(--border-color)}.continent-tab-btn{background:transparent;border:none;color:var(--text-muted);padding:.75rem 0;margin-right:1.5rem;cursor:pointer;font-size:.95rem;font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;transition:var(--transition);white-space:nowrap}.continent-tab-btn:hover{color:var(--text-primary)}.continent-tab-btn.active{color:var(--text-primary);border-bottom-color:var(--text-primary)}.flag-grid-container{overflow-y:auto;max-height:200px;padding-right:.5rem}.flag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:.75rem}.flag-btn{border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;padding:0;transition:var(--transition);aspect-ratio:4 / 3;overflow:hidden;background-color:var(--bg-canvas)}.flag-btn img{width:100%;height:100%;object-fit:cover;transition:transform .2s ease}.flag-btn:hover:not(.selected){border-color:var(--border-color-interactive);transform:translateY(-2px)}.flag-btn:hover img{transform:scale(1.1)}.flag-btn.selected{border-color:var(--primary)}.panel-body::-webkit-scrollbar,.flag-grid-container::-webkit-scrollbar{width:6px}.panel-body::-webkit-scrollbar-track,.flag-grid-container::-webkit-scrollbar-track{background:transparent}.panel-body::-webkit-scrollbar-thumb,.flag-grid-container::-webkit-scrollbar-thumb{background:var(--border-color-interactive);border-radius:var(--radius-full)}.panel-body::-webkit-scrollbar-thumb:hover,.flag-grid-container::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.style-selector{display:flex;flex-direction:column;gap:.75rem}.style-card{display:flex;align-items:center;gap:1rem;padding:1rem;border:1px solid var(--border-color);border-radius:var(--radius-md);text-align:left;cursor:pointer;transition:var(--transition);background-color:var(--bg-surface)}.style-card:hover{border-color:var(--border-color-interactive);background-color:var(--bg-canvas)}.style-card.selected{border-color:var(--primary);background-color:#11182708;box-shadow:0 0 0 1px var(--primary)}.style-card-icon{flex-shrink:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:var(--bg-canvas);border-radius:var(--radius-sm);color:var(--text-primary)}.style-card.selected .style-card-icon{background-color:var(--primary);color:var(--text-on-primary)}.style-card-title{font-weight:500;color:var(--text-primary);font-size:.95rem}.style-card-description{font-size:.85rem;color:var(--text-muted)}.segmented-control{display:flex;border:1px solid var(--border-color-interactive);border-radius:var(--radius-md);padding:4px;background-color:var(--bg-canvas)}.segmented-control button{flex:1;padding:.375rem .5rem;border:none;background-color:transparent;color:var(--text-secondary);font-size:.9rem;font-weight:500;cursor:pointer;border-radius:var(--radius-sm);transition:var(--transition)}.segmented-control button:hover:not(.selected){background-color:#0000000d}.segmented-control button.selected{background-color:var(--primary);color:var(--text-on-primary);box-shadow:var(--shadow-sm)}.selected-nation-display{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-full);font-size:.9rem;font-weight:500;color:var(--text-primary);box-shadow:var(--shadow-sm)}.selected-nation-flag{width:20px;aspect-ratio:4 / 3;object-fit:cover;border-radius:3px}.image-card.is-generating{box-shadow:0 0 0 2px var(--bg-surface),0 0 0 4px var(--primary);animation:pulse-glow 2s infinite alternate}@keyframes pulse-glow{0%{box-shadow:0 0 0 2px var(--bg-surface),0 0 0 4px var(--primary)}to{box-shadow:0 0 0 2px var(--bg-surface),0 0 0 4px #11182780}}.generating-state{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem}.generating-image-bg{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;opacity:.1;filter:blur(8px) saturate(.8)}.loader{border:4px solid var(--border-color);border-left-color:var(--primary);border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.progress-log ul{list-style:none;text-align:center;color:var(--text-primary);font-weight:500}.progress-log li:last-child{color:var(--text-muted)}.generated-image-fade-in{animation:fadeIn .8s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.image-container-btn{background:none;border:none;padding:0;cursor:zoom-in;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:var(--radius-md)}.image-container-btn:focus-visible{outline:2px solid var(--ring-color);outline-offset:2px}.gender-selector{position:absolute;top:1.5rem;right:1.5rem;background-color:#ffffffd9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--radius-full);padding:.375rem .5rem .375rem .75rem;display:inline-flex;align-items:center;gap:.75rem;box-shadow:var(--shadow-md);border:1px solid rgba(0,0,0,.05);font-size:.875rem;font-weight:500;color:var(--text-secondary);animation:fadeIn .4s ease-out;z-index:10}.spinner-small{width:16px;height:16px;border:2px solid var(--border-color);border-left-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.gender-label{color:var(--text-primary)}.gender-buttons{display:flex;background-color:var(--bg-canvas);border:1px solid var(--border-color);border-radius:var(--radius-full);padding:2px}.gender-buttons button{background:transparent;border:none;border-radius:var(--radius-full);padding:.25rem .75rem;font-size:.85rem;font-weight:500;cursor:pointer;color:var(--text-muted);transition:var(--transition)}.gender-buttons button:hover:not(.selected){background-color:var(--secondary);color:var(--text-primary)}.gender-buttons button.selected{background-color:var(--primary);color:var(--text-on-primary);box-shadow:var(--shadow-sm)}.history-tray{display:flex;gap:.75rem;margin-right:auto}.history-item{width:48px;height:48px;border-radius:var(--radius-md);border:2px solid var(--border-color-interactive);padding:0;cursor:pointer;overflow:hidden;transition:var(--transition);background-color:var(--bg-canvas);flex-shrink:0;animation:popIn .3s ease-out forwards}.history-item:hover,.history-item:focus-visible{border-color:var(--primary);transform:translateY(-2px)}.history-item img{width:100%;height:100%;object-fit:cover}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.error-message{color:var(--destructive);background-color:#be123c0d;border-radius:var(--radius-md);padding:.5rem 1rem;font-size:.875rem;font-weight:500}.image-viewer-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#f9f9fbd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;animation:fadeInOverlay .3s ease-out forwards}.image-viewer-content{position:relative;max-width:90vw;max-height:90vh;animation:zoomInContent .3s ease-out forwards;display:flex;box-shadow:var(--shadow-lg);border-radius:var(--radius-lg)}.image-viewer-content img{display:block;max-width:100%;max-height:90vh;object-fit:contain;border-radius:var(--radius-lg)}.image-viewer-close-btn{position:absolute;top:-16px;right:-16px;width:36px;height:36px;background-color:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-color);border-radius:50%;font-size:2rem;line-height:34px;cursor:pointer;box-shadow:var(--shadow-md);transition:var(--transition);display:flex;align-items:center;justify-content:center;padding:0;z-index:10}.image-viewer-close-btn:hover{background-color:var(--primary);color:var(--text-on-primary);transform:scale(1.1) rotate(90deg)}@keyframes fadeInOverlay{0%{opacity:0}to{opacity:1}}@keyframes zoomInContent{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:1100px){.app-container{height:auto;min-height:100vh;overflow:auto}.workspace{grid-template-columns:1fr;grid-template-rows:auto auto}.image-column{min-height:50vh}.selection-panel{max-height:none}}@media(max-width:768px){.app-container{padding:1rem;gap:1rem}.app-header h1{font-size:1.25rem}.workspace{gap:1rem}.control-group-row{grid-template-columns:1fr}.actions-footer{display:flex;flex-direction:column-reverse;gap:1rem}.actions-container{width:100%;flex-wrap:wrap;justify-content:center}.actions-container .btn{flex-grow:1;justify-content:center}.history-tray{width:100%;justify-content:center;margin-right:0;margin-bottom:.75rem}}