@import"https://fonts.googleapis.com/css2?family=IM+Fell+English:ital@0;1&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{--color-bg: #F5F2EB;--color-bg-alt: #EBE7DE;--color-ink: #1A1A1A;--color-ink-light: #5A5A5A;--color-ink-faint: #9A9A9A;--font-display: "IM Fell English", serif;--font-body: "IBM Plex Mono", monospace;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--sidebar-width: min-content;--bottom-bar-height: 100px}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:var(--font-body);font-size:14px;line-height:1.5;color:var(--color-ink);background-color:var(--color-bg)}.sketchy{border:1.5px solid var(--color-ink);box-shadow:1px 1px 0 var(--color-ink),-.5px .5px 0 var(--color-ink),.5px -.5px 0 var(--color-ink)}.sketchy-light{border:1px solid var(--color-ink-light);box-shadow:.5px .5px 0 var(--color-ink-light),-.3px .3px 0 var(--color-ink-light)}.app{display:grid;grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"header header" "sidebar main" "bottom bottom";height:100vh;gap:0}.header{grid-area:header;padding:var(--space-sm) var(--space-lg);border-bottom:1.5px solid var(--color-ink);display:flex;align-items:center;gap:var(--space-md);background:var(--color-bg)}.logo{font-family:var(--font-display);font-size:24px;letter-spacing:2px;text-transform:uppercase;font-weight:400}.tagline{font-size:12px;color:var(--color-ink-light);font-style:italic}.sidebar{grid-area:sidebar;border-right:1.5px solid var(--color-ink);overflow-y:auto;padding:var(--space-md);background:var(--color-bg-alt)}.sidebar-title{font-family:var(--font-display);font-size:14px;text-transform:uppercase;letter-spacing:1px;margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--color-ink-light)}.jak-grid{display:grid;grid-template-columns:repeat(2,100px);gap:var(--space-sm)}.jak-card{width:100px;height:100px;padding:var(--space-xs);cursor:pointer;transition:transform .1s ease;background:var(--color-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;overflow:hidden}.jak-card:hover{transform:translate(-1px,-1px);box-shadow:2px 2px 0 var(--color-ink),1px 1px 0 var(--color-ink)}.jak-card.selected{background:var(--color-ink);color:var(--color-bg)}.jak-card-image{width:100%;height:70px;object-fit:contain;filter:grayscale(100%)}.jak-card.selected .jak-card-image{filter:grayscale(100%) invert(1)}.jak-card-name{font-size:9px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.jak-placeholder{width:60%;aspect-ratio:1;border:1px dashed var(--color-ink-light);display:flex;align-items:center;justify-content:center;font-size:20px}.jak-card.selected .jak-placeholder{border-color:var(--color-bg)}.main{grid-area:main;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-xl);overflow:auto}.image-container{max-width:512px;width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:var(--color-bg-alt)}.image-container.empty{border:2px dashed var(--color-ink-light)}.image-placeholder{text-align:center;color:var(--color-ink-light);padding:var(--space-xl)}.image-placeholder-icon{font-size:48px;margin-bottom:var(--space-md);opacity:.5}.generated-image{max-width:100%;max-height:100%;object-fit:contain}.image-actions{margin-top:var(--space-md);display:flex;gap:var(--space-sm)}.bottom-bar{grid-area:bottom;border-top:1.5px solid var(--color-ink);padding:var(--space-md) var(--space-lg);display:flex;align-items:center;gap:var(--space-lg);background:var(--color-bg)}.selected-jaks{display:flex;gap:var(--space-sm);align-items:center;min-width:200px}.selected-jak{width:48px;height:48px;padding:var(--space-xs);cursor:pointer;background:var(--color-bg);display:flex;align-items:center;justify-content:center}.selected-jak:hover{background:var(--color-ink);color:var(--color-bg)}.selected-jak:hover .selected-jak-image{filter:grayscale(100%) invert(1)}.selected-jak-image{width:100%;height:100%;object-fit:contain;filter:grayscale(100%)}.selected-jak-placeholder{font-size:14px}.empty-selection{font-size:12px;color:var(--color-ink-faint);font-style:italic}.prompt-container{flex:1;display:flex;align-items:flex-start;gap:var(--space-sm)}.prompt-input{flex:1;padding:var(--space-sm) var(--space-md);font-family:var(--font-body);font-size:14px;background:var(--color-bg);border:1.5px solid var(--color-ink);color:var(--color-ink);outline:none;resize:none;min-height:38px;max-height:144px;line-height:1.5;overflow-y:auto}.prompt-input::placeholder{color:var(--color-ink-faint)}.prompt-input:focus{box-shadow:2px 2px 0 var(--color-ink)}.btn{padding:var(--space-sm) var(--space-lg);font-family:var(--font-body);font-size:12px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:transform .1s ease;border:1.5px solid var(--color-ink)}.btn-primary{background:var(--color-ink);color:var(--color-bg)}.btn-primary:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:2px 2px 0 var(--color-ink)}.btn-secondary{background:var(--color-bg);color:var(--color-ink)}.btn-secondary:hover:not(:disabled){background:var(--color-ink);color:var(--color-bg)}.btn:disabled{opacity:.4;cursor:not-allowed}.loading{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);color:var(--color-ink-light)}.spinner{width:32px;height:32px;border:2px solid var(--color-ink-faint);border-top-color:var(--color-ink);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error{color:var(--color-ink);background:var(--color-bg-alt);padding:var(--space-md);border:1.5px solid var(--color-ink);margin-top:var(--space-md);font-size:12px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-bg-alt)}::-webkit-scrollbar-thumb{background:var(--color-ink-light);border:1px solid var(--color-bg-alt)}::-webkit-scrollbar-thumb:hover{background:var(--color-ink)}.password-gate{position:fixed;inset:0;background:var(--color-bg);display:flex;align-items:center;justify-content:center;z-index:1000}.password-box{background:var(--color-bg);padding:var(--space-xl);display:flex;flex-direction:column;align-items:center;gap:var(--space-md);min-width:300px}.password-title{font-family:var(--font-display);font-size:32px;letter-spacing:2px;text-transform:uppercase}.password-subtitle{font-size:12px;color:var(--color-ink-light)}.password-field{width:100%;padding:var(--space-sm) var(--space-md);font-family:var(--font-body);font-size:14px;background:var(--color-bg);border:1.5px solid var(--color-ink);color:var(--color-ink);outline:none;text-align:center}.password-field:focus{box-shadow:2px 2px 0 var(--color-ink)}.password-error{font-size:12px;color:var(--color-ink);min-height:18px}