:root{--bg-main: #f8f6f3;--bg-card: #ffffff;--text-primary: #3d3d3d;--text-secondary: #7c7c7c;--text-placeholder: #b0b0b0;--border-soft: #eaeaea;--border-interactive: #d0d0d0;--accent-purple-primary: #a076d6;--accent-purple-light: #e9dff5;--accent-green-primary: #7fbc8c;--accent-green-light: #dff0e2;--accent-blue-primary: #73a2d9;--accent-blue-light: #dbe7f5;--accent-error: #ff6b6b;--accent-error-light: #ffecec;--shadow-card: 0px 12px 35px rgba(0, 0, 0, .06);--shadow-card-hover: 0px 16px 45px rgba(0, 0, 0, .08);--shadow-button: 0px 4px 12px rgba(0, 0, 0, .05);--shadow-button-hover: 0px 6px 15px rgba(0, 0, 0, .07);--shadow-input-focus: 0 0 0 3px rgba(160, 118, 214, .15);--radius-card: 28px;--radius-button-pill: 9999px;--radius-button-large: 16px;--radius-button-medium: 12px;--radius-input: 12px;--radius-tag: 8px;--font-family-main: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-size-base: 16px;--font-size-sm: .875rem;--font-size-xs: .75rem;--transition-main: all .25s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}html{font-size:var(--font-size-base)}body{font-family:var(--font-family-main);background-color:var(--bg-main);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;padding:1.5rem}.app-container{display:flex;flex-direction:column;min-height:calc(100vh - 3rem);max-width:1600px;margin:0 auto}.main-content-wrapper{flex-grow:1;display:flex;flex-direction:column;gap:2rem;width:100%}@media (min-width: 1024px){.main-content-wrapper{flex-direction:row;gap:2.5rem}}.panel-left,.panel-right{background-color:transparent;border-radius:0;box-shadow:none;padding:0;display:flex;flex-direction:column;overflow:visible}@media (min-width: 1024px){.panel-left{flex:0 0 480px;max-width:40%}.panel-right{flex:1 1 auto}}.main-title{font-size:2.25rem;font-weight:700;text-align:center;color:var(--text-primary);margin-bottom:2rem;letter-spacing:-.02em}.result-panel-title{font-size:2rem;font-weight:700;text-align:center;color:var(--text-primary);margin-bottom:2rem;letter-spacing:-.02em}.input-card-title,.full-story-title,.storyboard-title{font-size:1.2rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;padding-bottom:0;border-bottom:none}.user-id-display{position:fixed;top:1rem;right:1rem;background-color:#fffc;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--text-secondary);font-size:var(--font-size-xs);padding:.4rem .9rem;border-radius:var(--radius-button-pill);box-shadow:0 2px 8px #00000014;z-index:1000;border:1px solid rgba(0,0,0,.03)}.error-message-box{background-color:var(--accent-error-light);border:1px solid var(--accent-error);color:var(--accent-error);padding:1rem 1.25rem;border-radius:var(--radius-input);margin-bottom:1.5rem;font-size:var(--font-size-sm);font-weight:500;box-shadow:var(--shadow-card)}.input-sections-scrollable{flex-grow:1;overflow-y:auto;padding:.5rem;margin:-.5rem;display:flex;flex-direction:column;gap:1.75rem}.input-card,.storyboard-card,.full-story-box{background-color:var(--bg-card);padding:1.75rem;border-radius:var(--radius-card);box-shadow:var(--shadow-card);border:none;transition:var(--transition-main)}.input-card:hover,.storyboard-card:hover,.full-story-box:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}.text-input,.stepper-input{width:100%;padding:.8rem 1rem;border:1px solid var(--border-soft);border-radius:var(--radius-input);transition:var(--transition-main);font-size:.95rem;color:var(--text-primary);background-color:var(--bg-card)}.text-input::placeholder{color:var(--text-placeholder)}.text-input:focus,.stepper-input:focus{outline:none;border-color:var(--accent-purple-primary);box-shadow:var(--shadow-input-focus);background-color:var(--bg-card)}.text-input-multiline{resize:vertical;min-height:80px}.input-stepper-group{display:flex;align-items:center;gap:.75rem}.stepper-button{padding:.6rem;border-radius:var(--radius-button-pill);background-color:var(--bg-card);border:1px solid var(--border-interactive);transition:var(--transition-main);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-button)}.stepper-button:hover:not(:disabled){border-color:var(--accent-purple-primary);color:var(--accent-purple-primary);box-shadow:var(--shadow-button-hover);transform:translateY(-1px)}.stepper-button:active:not(:disabled){transform:scale(.95) translateY(0)}.stepper-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.stepper-input{width:70px;text-align:center;font-weight:500}.button-ml-auto{margin-left:auto}.button{display:inline-flex;align-items:center;justify-content:center;padding:.6rem 1.2rem;border-radius:var(--radius-button-medium);transition:var(--transition-main);color:var(--text-primary);background-color:var(--bg-card);border:1px solid var(--border-interactive);cursor:pointer;font-size:var(--font-size-sm);font-weight:500;box-shadow:var(--shadow-button)}.button-enabled:hover{border-color:var(--accent-purple-primary);color:var(--accent-purple-primary);box-shadow:var(--shadow-button-hover);transform:translateY(-1px)}.button-enabled:active{transform:scale(.97) translateY(0);box-shadow:var(--shadow-button)}.button-disabled{color:var(--text-placeholder);background-color:var(--bg-main);border-color:var(--border-soft);cursor:not-allowed;box-shadow:none}.button-loading .icon-spin{display:inline-block}.button-loading>*:not(.icon-spin){opacity:0}.icon-margin-right{margin-right:.5em}.icon-spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.input-card-buttons{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1rem}.main-ops-buttons-group{display:flex;flex-direction:column;gap:1rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border-soft)}@media (min-width: 480px){.main-ops-buttons-group{flex-direction:row}.main-ops-buttons-group>.main-ops-button{flex:1}}.main-ops-button{padding:.8rem 1.5rem;border-radius:var(--radius-button-large);font-weight:600;font-size:.95rem;border:none;display:inline-flex;align-items:center;justify-content:center;transition:var(--transition-main);cursor:pointer;box-shadow:var(--shadow-button)}.main-ops-button:hover:not(.button-disabled){box-shadow:var(--shadow-button-hover);transform:translateY(-2px)}.main-ops-button:active:not(.button-disabled){transform:scale(.98) translateY(0);box-shadow:var(--shadow-button)}.primary-button{background-color:var(--accent-purple-primary);color:var(--bg-card)}.primary-button:hover:not(.button-disabled){background-color:#8f63c4}.secondary-button{background-color:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-interactive)}.secondary-button:hover:not(.button-disabled){border-color:var(--text-primary)}.generate-story-button-wrapper{width:100%;margin-bottom:2rem;padding:.5rem}.generate-story-button{width:100%;padding:.9rem 1.75rem;border-radius:var(--radius-button-large);font-weight:600;font-size:1rem;background-color:var(--accent-green-primary);color:var(--bg-card);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition-main);box-shadow:var(--shadow-button)}.generate-story-button:hover:not(.button-disabled){background-color:#70a97c;box-shadow:var(--shadow-button-hover);transform:translateY(-2px)}.generate-story-button:active:not(.button-disabled){transform:scale(.98) translateY(0);box-shadow:var(--shadow-button)}.generate-story-button.button-disabled{background-color:var(--border-soft);color:var(--text-placeholder);box-shadow:none;cursor:not-allowed}.results-scrollable-area{flex-grow:1;overflow-y:auto;padding:.5rem;margin:-.5rem;display:flex;flex-direction:column;gap:1.75rem}.full-story-text{color:var(--text-secondary);line-height:1.7;white-space:pre-wrap;font-size:.95rem}.storyboard-shots-list{display:flex;flex-direction:column;gap:1.75rem}.storyboard-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.shot-number{font-size:1.1rem;font-weight:600;color:var(--accent-green-primary)}.shot-type{font-size:var(--font-size-xs);font-weight:500;color:var(--accent-green-primary);background-color:var(--accent-green-light);padding:.3rem .75rem;border-radius:var(--radius-tag);text-transform:uppercase}.visual-placeholder{width:100%;background-color:var(--bg-main);border-radius:var(--radius-input);aspect-ratio:16 / 9;display:flex;align-items:center;justify-content:center;color:var(--text-placeholder);font-size:var(--font-size-sm);border:1px dashed var(--border-soft)}.shot-details{color:var(--text-secondary);font-size:.9rem}.shot-detail-label{font-weight:600;color:var(--text-primary)}.shot-details p{margin-bottom:.3rem}.storyboard-card-actions{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border-soft)}.generate-mj-prompt-button{width:100%;background-color:var(--accent-blue-primary);color:var(--bg-card);padding:.7rem 1.2rem;font-size:var(--font-size-sm);font-weight:500;border-radius:var(--radius-button-medium);border:none;box-shadow:var(--shadow-button);transition:var(--transition-main)}.generate-mj-prompt-button:hover:not(.button-disabled){background-color:#6190c8;box-shadow:var(--shadow-button-hover);transform:translateY(-1px)}.generate-mj-prompt-button.button-disabled{background-color:var(--accent-blue-light);color:var(--accent-blue-primary);opacity:.7}.mj-prompt-display{margin-top:1rem;background-color:var(--bg-main);padding:1rem;border-radius:var(--radius-input);font-size:.85rem;font-family:SF Mono,Menlo,Consolas,monospace;position:relative;border:1px solid var(--border-soft)}.mj-prompt-text{white-space:pre-wrap;word-break:break-all;color:var(--text-secondary);padding-right:2.8rem}.copy-button{position:absolute;top:.75rem;right:.75rem;padding:.5rem;border-radius:var(--radius-button-medium);background-color:transparent;border:none;cursor:pointer;transition:var(--transition-main);color:var(--text-placeholder);display:flex;align-items:center;justify-content:center}.copy-button:hover{background-color:var(--border-soft);color:var(--accent-blue-primary)}.input-sections-scrollable,.results-scrollable-area{scrollbar-width:thin;scrollbar-color:var(--border-interactive) transparent}.input-sections-scrollable::-webkit-scrollbar,.results-scrollable-area::-webkit-scrollbar{width:8px;height:8px}.input-sections-scrollable::-webkit-scrollbar-track,.results-scrollable-area::-webkit-scrollbar-track{background:transparent}.input-sections-scrollable::-webkit-scrollbar-thumb,.results-scrollable-area::-webkit-scrollbar-thumb{background:var(--border-soft);border-radius:var(--radius-button-pill);border:2px solid transparent;background-clip:content-box}.input-sections-scrollable::-webkit-scrollbar-thumb:hover,.results-scrollable-area::-webkit-scrollbar-thumb:hover{background:var(--border-interactive)}.icon-spin{width:1.1em;height:1.1em}