:root{color-scheme:only light;--font-family: Futura, "Century Gothic", "Futura Std", "Trebuchet MS", sans-serif;--background: #f6efe5;--surface: #fdf8f2;--surface-strong: #e4d3c1;--on-surface: #2f241a;--on-surface-secondary: #6c5846;--primary: #7a6b5c;--primary-hover: #8a7a6b;--accent: #7b5a3d;--accent-hover: #8a6647;--border: #d3c1ae;--glow: rgba(122, 107, 92, .3);--shadow-color: 12, 10%, 16%;--shadow-strength: .1}*{box-sizing:border-box}body{font-family:var(--font-family);background-color:var(--background);color:var(--on-surface);margin:0;padding:2.5rem 1.5rem 3.5rem;min-height:100vh;position:relative;overflow-x:hidden;display:flex;justify-content:center;align-items:flex-start}.background-grid{position:fixed;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(transparent 0 94%,#00000008 94%,#00000008),linear-gradient(90deg,transparent 0 94%,rgba(0,0,0,.03) 94% 100%);background-size:80px 80px;opacity:.2;pointer-events:none;z-index:0}#app{width:min(1200px,100%);text-align:center;position:relative;z-index:1}header{margin-bottom:1.25rem;display:flex;flex-direction:column;align-items:center;gap:.4rem}.eyebrow{text-transform:uppercase;font-size:.75rem;letter-spacing:.35em;color:var(--accent);font-weight:600}h1{font-family:var(--font-family);font-size:4rem;font-weight:400;margin:0;color:var(--on-surface)}.subtitle{font-size:.95rem;color:var(--on-surface-secondary);margin:0;max-width:620px;line-height:1.5}.site-nav{display:flex;align-items:center;justify-content:center;gap:1.25rem;margin-bottom:.5rem;font-size:.9rem;font-weight:500}.site-nav a{color:var(--accent);text-decoration:none}.site-nav a:hover{text-decoration:underline;color:var(--accent-hover)}.site-nav-current{color:var(--on-surface-secondary)}main.gallery-page{width:100%}main#app-container{display:grid;grid-template-columns:1fr;gap:2rem;width:100%;text-align:left}@media(min-width:1000px){main#app-container{grid-template-columns:360px 1fr;gap:3rem;align-items:start}main#app-container .artwork-display{width:100%;max-width:none}}@media(max-width:480px){body{padding:2rem 1rem 2.5rem}header{margin-bottom:1rem}h1{font-size:clamp(1.75rem,6vw,2.25rem)}.subtitle{font-size:.9rem;line-height:1.5}#instruction-container{padding:1.25rem}#generate-btn,#download-btn{min-height:44px}}.controls{display:flex;flex-direction:column;gap:1.75rem}.button-group{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:.75rem}#generate-btn,#download-btn{border-radius:10px;padding:.85rem 1.5rem;font-size:.95rem;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--font-family)}#generate-btn{background-color:var(--primary);color:var(--surface);border:1px solid var(--accent);box-shadow:0 4px 12px hsla(var(--shadow-color),var(--shadow-strength)),0 0 0 1px #7b5a3d1a}#generate-btn:hover:not(:disabled){background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:0 6px 16px hsla(var(--shadow-color),calc(var(--shadow-strength) * 1.5)),var(--glow)}#generate-btn:active:not(:disabled){transform:translateY(0)}#generate-btn:disabled{background-color:var(--surface-strong);color:var(--on-surface);border:1px solid var(--border);cursor:not-allowed;opacity:.7;box-shadow:0 4px 12px hsla(var(--shadow-color),var(--shadow-strength))}#download-btn{border:1px solid var(--border);background-color:var(--surface-strong);color:var(--on-surface);box-shadow:0 4px 12px hsla(var(--shadow-color),var(--shadow-strength))}#download-btn:hover{background-color:var(--surface);color:var(--on-surface);transform:translateY(-2px);box-shadow:0 4px 12px hsla(var(--shadow-color),var(--shadow-strength))}#download-btn.hidden{display:none}#download-btn svg{stroke:currentColor}#instruction-container{background-color:var(--surface);border:1px solid var(--border);border-radius:10px;padding:1.75rem;min-height:120px;display:flex;flex-direction:column;justify-content:center;text-align:left;box-shadow:0 4px 16px hsla(var(--shadow-color),var(--shadow-strength));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:rise .8s ease forwards}#instruction-container .placeholder{color:var(--on-surface-secondary);text-align:left;font-style:italic}#instruction-container h2{font-family:var(--font-family);font-size:1.05rem;font-weight:600;margin:0 0 .5rem;color:var(--accent)}#instruction-container p{margin:0;line-height:1.7}.artwork-display{display:flex;align-items:center;justify-content:center;width:100%;min-width:0}#canvas-container{flex:0 0 auto;width:min(640px,90vw);max-width:100%;height:auto;aspect-ratio:1 / 1;margin-left:auto;margin-right:auto;border:1px solid var(--border);border-radius:10px;overflow:hidden;display:flex;justify-content:center;align-items:center;background:linear-gradient(140deg,#fff,#f4efe6);box-shadow:0 6px 20px hsla(var(--shadow-color),var(--shadow-strength));transition:box-shadow .3s ease,transform .3s ease;position:relative}#canvas-container:hover{box-shadow:0 8px 24px hsla(var(--shadow-color),calc(var(--shadow-strength) * 1.5));transform:translateY(-4px)}canvas{display:block}.spinner{width:56px;height:56px;border:5px solid var(--glow);border-left-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}.loading-overlay{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;padding:2rem;text-align:center}.loading-text{font-size:.95rem;color:var(--on-surface-secondary);line-height:1.5;max-width:300px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}footer{margin-top:3.5rem;padding-top:1.5rem;border-top:1px solid var(--border);color:var(--on-surface-secondary);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase}footer a{color:var(--accent);text-decoration:none}footer a:hover{text-decoration:underline}.gallery-section{margin-top:4rem;padding-top:2.5rem;border-top:1px solid var(--border);width:100%}.gallery-title{font-family:var(--font-family);font-size:1.35rem;font-weight:600;color:var(--on-surface);margin:0 0 .35rem}.gallery-subtitle{font-size:.95rem;color:var(--on-surface-secondary);margin:0 0 1.75rem}.gallery-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.25rem;justify-items:center}@media(max-width:768px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}.gallery-item{width:100%;aspect-ratio:1 / 1;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:linear-gradient(140deg,#fff,#f4efe6);box-shadow:0 4px 16px hsla(var(--shadow-color),var(--shadow-strength));transition:box-shadow .25s ease,transform .25s ease;cursor:pointer}.gallery-item:hover{box-shadow:0 6px 20px hsla(var(--shadow-color),calc(var(--shadow-strength) * 1.5));transform:translateY(-3px)}.gallery-item img{width:100%;height:100%;object-fit:cover;display:block}.gallery-lightbox{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:1.5rem;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}.gallery-lightbox.is-open{opacity:1;visibility:visible}.gallery-lightbox-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.gallery-lightbox-content{position:relative;width:600px;height:600px;max-width:calc(100vw - 2rem);max-height:calc(100vh - 2rem);border:1px solid var(--border);border-radius:10px;overflow:hidden;background:linear-gradient(140deg,#fff,#f4efe6);box-shadow:0 6px 20px hsla(var(--shadow-color),var(--shadow-strength))}.gallery-lightbox-content img{width:600px;height:600px;max-width:100%;max-height:100%;object-fit:contain;display:block}.gallery-lightbox-prev,.gallery-lightbox-next{position:absolute;top:50%;transform:translateY(-50%);width:2.5rem;height:2.5rem;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--on-surface);font-size:1.5rem;line-height:1;cursor:pointer;font-family:var(--font-family);transition:background .2s ease,transform .2s ease;z-index:2}.gallery-lightbox-prev{left:.5rem}.gallery-lightbox-next{right:.5rem}.gallery-lightbox-prev:hover,.gallery-lightbox-next:hover{background:var(--surface-strong);transform:translateY(-50%) scale(1.05)}.gallery-lightbox-close{position:absolute;top:.75rem;right:.75rem;width:2.5rem;height:2.5rem;border:1px solid var(--border);border-radius:50%;background:var(--surface);color:var(--on-surface);font-size:1.5rem;line-height:1;cursor:pointer;font-family:var(--font-family);transition:background .2s ease,transform .2s ease;z-index:2}.gallery-lightbox-close:hover{background:var(--surface-strong);transform:scale(1.05)}