:root{--bg:#f7f5f2;--bg-muted:#ebe8e3;--surface:#fff;--text:#1a1a1a;--text-muted:#5c5c5c;--border:#d4d0c8;--accent:#c45c26;--accent-hover:#a64c1e;--danger:#8b2e2e;--focus-ring:0 0 0 3px #c45c2659;--space:8px;--font:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;color:var(--text);background:var(--bg);font-family:var(--font);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;line-height:1.45}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:radial-gradient(1200px 600px at 10% -10%, #c45c260f, transparent 60%), radial-gradient(900px 500px at 100% 0%, #1a1a1a0a, transparent 55%), var(--bg)}a{color:var(--accent)}a:hover{color:var(--accent-hover)}:focus-visible{box-shadow:var(--focus-ring);outline:none}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.app-shell{max-width:1120px;padding:calc(var(--space) * 3) calc(var(--space) * 2) calc(var(--space) * 6);margin:0 auto}.site-header{justify-content:space-between;align-items:center;gap:calc(var(--space) * 2);padding-bottom:calc(var(--space) * 2);border-bottom:1px solid var(--border);margin-bottom:calc(var(--space) * 3);display:flex}.brand{letter-spacing:-.02em;color:var(--text);font-size:20px;font-weight:700;text-decoration:none}.brand span{color:var(--accent)}.nav-links{gap:calc(var(--space) * 2);font-size:14px;display:flex}.nav-links a{color:var(--text-muted);text-decoration:none}.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--accent)}.hero{gap:calc(var(--space) * 3);padding:calc(var(--space) * 4) 0 calc(var(--space) * 5);align-content:center;min-height:min(70vh,640px);display:grid}.hero-brand{letter-spacing:-.03em;margin:0;font-size:clamp(32px,6vw,48px);font-weight:750}.hero-brand span{color:var(--accent)}.hero h2{max-width:28ch;margin:0;font-size:clamp(18px,3vw,24px);font-weight:600}.hero p{color:var(--text-muted);max-width:48ch;margin:0;font-size:16px}.cta-row{gap:calc(var(--space) * 1.5);margin-top:calc(var(--space) * 1);flex-wrap:wrap;display:flex}.btn{min-height:40px;padding:0 calc(var(--space) * 2);border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:4px;justify-content:center;align-items:center;text-decoration:none;transition:background .12s,border-color .12s,opacity .12s;display:inline-flex}.btn:active{opacity:.85}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn:disabled,.btn[aria-disabled=true]{opacity:.55;cursor:not-allowed}.section{padding:calc(var(--space) * 4) 0;border-top:1px solid var(--border)}.section h2{margin:0 0 calc(var(--space) * 1);font-size:20px}.section p{margin:0 0 calc(var(--space) * 2);color:var(--text-muted);max-width:60ch}.status-matrix{border-collapse:collapse;width:100%;font-size:14px}.status-matrix th,.status-matrix td{text-align:left;padding:calc(var(--space) * 1.25);border-bottom:1px solid var(--border);vertical-align:top}.status-matrix th{background:var(--bg-muted);font-weight:600}.badge{border-radius:4px;padding:2px 8px;font-size:12px;font-weight:600;display:inline-block}.badge-ok{color:#1f4d2a;background:#e4efe6}.badge-pending{background:var(--bg-muted);color:var(--text-muted)}.workspace{gap:calc(var(--space) * 3);display:grid}@media (width>=900px){.workspace{grid-template-columns:340px 1fr;align-items:start}}.panel{background:var(--surface);border:1px solid var(--border);padding:calc(var(--space) * 2);border-radius:4px}.panel h2{margin:0 0 calc(var(--space) * 1.5);font-size:16px}.field{margin-bottom:calc(var(--space) * 2);gap:6px;display:grid}.field label{font-size:13px;font-weight:600}.field .hint{color:var(--text-muted);font-size:12px}.field input[type=text],.field input[type=color],.field textarea,.field input[type=file]{border:1px solid var(--border);background:var(--bg);border-radius:4px;width:100%;padding:8px 10px}.field input[type=range]{width:100%}.template-grid{gap:calc(var(--space) * 1);grid-template-columns:1fr 1fr;display:grid}.template-btn{text-align:left;border:1px solid var(--border);background:var(--bg);padding:calc(var(--space) * 1);border-radius:4px;min-height:72px;transition:border-color .16s,background .16s}.template-btn[aria-pressed=true]{border-color:var(--accent);background:#f8ebe3}.template-btn strong{font-size:13px;display:block}.template-btn small{color:var(--text-muted);font-size:11px}.aspect-group{flex-wrap:wrap;gap:8px;display:flex}.aspect-group button{border:1px solid var(--border);background:var(--bg);border-radius:4px;flex:1;min-width:64px;min-height:40px}.aspect-group button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);font-weight:600}.alert{padding:calc(var(--space) * 1.5);border:1px solid var(--border);background:var(--bg-muted);margin-bottom:calc(var(--space) * 2);border-radius:4px;font-size:14px}.alert-error{color:var(--danger);background:#f8ecec;border-color:#e0b4b4}.alert-info{background:#f8efe8;border-color:#e2c4b0}.canvas-wrap{gap:calc(var(--space) * 2);display:grid}.canvas-frame{background:var(--bg-muted);border:1px solid var(--border);padding:calc(var(--space) * 2);border-radius:4px;justify-content:center;align-items:center;min-height:320px;animation:.18s canvas-in;display:flex}@keyframes canvas-in{0%{opacity:.65}to{opacity:1}}.canvas-frame canvas{background:var(--surface);max-width:100%;height:auto;box-shadow:0 1px #1a1a1a0f}.toolbar{flex-wrap:wrap;gap:8px;display:flex}.footer-note{margin-top:calc(var(--space) * 4);padding-top:calc(var(--space) * 2);border-top:1px solid var(--border);color:var(--text-muted);font-size:13px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.checkbox-row{align-items:flex-start;gap:8px;font-size:13px;display:flex}.checkbox-row input{margin-top:3px}.library-hero{padding:calc(var(--space) * 2) 0 calc(var(--space) * 3)}.library-hero-compact{padding-bottom:calc(var(--space) * 2)}.library-hero h1{margin:0 0 calc(var(--space) * 1);letter-spacing:-.02em;font-size:clamp(24px,4vw,32px)}.library-hero p{margin:0 0 calc(var(--space) * 1);color:var(--text-muted);max-width:70ch;font-size:14px}.library-toolbar{margin-bottom:calc(var(--space) * 2)}.library-toolbar .aspect-group{flex-wrap:wrap;gap:8px;display:flex}.library-toolbar .aspect-group button{min-width:unset;text-align:left;flex:0 auto;padding:8px 12px;font-size:12px}.gallery-masonry{column-count:1;column-gap:12px}@media (width>=560px){.gallery-masonry{column-count:2}}@media (width>=900px){.gallery-masonry{column-count:3}}@media (width>=1100px){.gallery-masonry{column-count:4}}.gallery-card{break-inside:avoid;background:var(--surface);border:1px solid var(--border);border-radius:4px;margin:0 0 12px;transition:border-color .14s;overflow:hidden}.gallery-card:hover,.gallery-card:focus-within{border-color:var(--accent)}.gallery-card-hit{text-align:left;cursor:pointer;width:100%;color:inherit;background:0 0;border:0;padding:0;display:block}.gallery-thumb{width:100%;height:auto;aspect-ratio:var(--preview-ratio,1 / 1);object-fit:cover;background:var(--bg-muted);display:block}.gallery-caption{gap:2px;padding:10px 12px 12px;display:grid}.gallery-caption strong{font-size:13px;font-weight:650;line-height:1.3}.gallery-caption span{color:var(--text-muted);font-size:11px}.gallery-status{font-weight:600;color:var(--accent)!important}.gallery-status-source{font-weight:600;color:var(--text-muted)!important}.gallery-status-benchmark{font-weight:600;color:#5a6b4f!important}.hero-one-liner{color:var(--text-muted);margin:0;font-size:14px}.tab-row{margin-bottom:calc(var(--space) * 2);flex-wrap:wrap;gap:8px;display:flex}.tab{border:1px solid var(--border);background:var(--surface);min-height:40px;color:var(--text-muted);border-radius:4px;padding:0 14px}.tab.active,.tab[aria-selected=true]{border-color:var(--accent);color:var(--accent);font-weight:650}.model-badge{color:var(--accent);background:#f8ebe3;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:700;display:inline-block}.model-badge.inline{width:fit-content}.quiet-badge{background:var(--bg-muted);color:var(--text-muted);border-radius:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.badge-row{flex-wrap:wrap;gap:8px;display:flex}.home-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0 16px;display:grid}@media (width>=800px){.home-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width>=1100px){.home-strip{grid-template-columns:repeat(6,minmax(0,1fr))}}.home-strip-card{color:var(--text);border:1px solid var(--border);background:var(--surface);border-radius:4px;gap:6px;text-decoration:none;display:grid;overflow:hidden}.home-strip-card img{object-fit:cover;background:var(--bg-muted);width:100%;height:110px;display:block}.home-strip-card span{color:var(--text-muted);padding:0 8px 8px;font-size:11px;line-height:1.3}.credits-page h1{margin:0 0 12px;font-size:28px}.credit-list{gap:16px;margin:0;padding:0;list-style:none;display:grid}.credit-list li{border:1px solid var(--border);background:var(--surface);border-radius:4px;padding:12px}.var-grid{gap:calc(var(--space) * 1.5);display:grid}@media (width>=800px){.var-grid{grid-template-columns:1fr 1fr}}.prompt-output{border:1px solid var(--border);background:var(--bg);resize:vertical;border-radius:4px;width:100%;padding:10px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;line-height:1.45}.recipe-meta{color:var(--text-muted);font-size:12px}.recipe-meta-block h3,.recipe-meta-block h4{margin:calc(var(--space) * 2) 0 calc(var(--space) * .5);font-size:13px}.recipe-meta-block ul{color:var(--text-muted);margin:0;padding-left:1.2em;font-size:13px}.recipe-meta-block p{margin:0;font-size:13px}code{background:var(--bg-muted);border-radius:3px;padding:1px 4px;font-size:.9em}.modal-root{z-index:40;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}@media (width>=800px){.modal-root{align-items:center;padding:24px}}.modal-backdrop{cursor:pointer;background:#1a1a1a73;border:0;position:absolute;inset:0}.modal-sheet{z-index:1;background:var(--surface);border:1px solid var(--border);border-radius:12px 12px 0 0;flex-direction:column;width:min(920px,100%);max-height:92vh;animation:.16s canvas-in;display:flex;position:relative;overflow:hidden;box-shadow:0 -8px 32px #1a1a1a1f}@media (width>=800px){.modal-sheet{border-radius:8px;max-height:88vh;box-shadow:0 12px 40px #1a1a1a29}}.modal-header{z-index:2;background:var(--surface);border-bottom:1px solid var(--border);flex:none;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.modal-header h2{margin:0;font-size:16px}.modal-preview-slot{background:var(--surface);flex:none;padding:12px 16px 0}.modal-body{-webkit-overflow-scrolling:touch;flex:auto;align-content:start;gap:12px;min-height:0;padding:16px;display:grid;overflow:auto}.modal-actions{border-top:1px solid var(--border);background:var(--surface);flex-wrap:wrap;flex:none;gap:8px;padding:12px 16px 16px;display:flex}.modal-figure{background:var(--bg-muted);border:1px solid var(--border);border-radius:4px;flex-shrink:0;width:100%;min-height:min-content;margin:0;overflow:hidden}.modal-figure img{object-fit:contain;object-position:center;background:#ebe8e3;flex-shrink:0;width:100%;height:auto;min-height:180px;max-height:min(42vh,420px);display:block}.modal-figure figcaption{padding:8px 12px 10px}
