:root{color:#171717;font-synthesis:none;text-rendering:optimizelegibility;--page:#f7f3ea;--surface:#fffdf8;--text:#171717;--muted:#666257;--border:#d9d3c7;--border-strong:#aaa397;--selected-bg:#eaf2ff;--selected-border:#4d8ef7;--action-blue:#2f7df4;--action-blue-dark:#1d62c7;--action-yellow:#f4dd32;--action-yellow-dark:#e4c900;--required:#c8172c;--success:#287b4f;--radius-card:10px;--radius-control:8px;--shadow-card:0 10px 30px #322b1f14;background:#f7f3ea;font-family:Inter,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic UI,Meiryo,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--page);min-width:320px;min-height:100vh;margin:0}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}img{max-width:100%;display:block}button{color:inherit}:focus-visible{outline-offset:2px;outline:3px solid #1f6fe5}::selection{color:#111;background:#bfd6ff}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.app-shell{flex-direction:column;min-height:100vh;display:flex}.list-page{flex:1;width:min(100%,1536px);margin:0 auto;padding:42px 46px 72px}.product-header{max-width:820px;margin-bottom:34px}.product-title-row{align-items:baseline;gap:20px;display:flex}.product-title-row h1{letter-spacing:-.045em;margin:0;font-size:clamp(2rem,3vw,3.2rem);font-weight:850;line-height:1.08}.product-title-row span{color:var(--muted);font-size:.82rem}.product-subtitle{letter-spacing:.02em;margin:14px 0 12px;font-size:clamp(1rem,1.35vw,1.25rem);font-weight:700}.product-description{color:var(--muted);max-width:720px;margin:0;font-size:.92rem;line-height:1.8}.search-panel{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:26px 0 30px}.search-field{font-size:.79rem;font-weight:750;display:block}.search-field>span:first-child{margin-bottom:8px;display:block}.search-control{border:1px solid var(--border-strong);background:var(--surface);border-radius:var(--radius-control);align-items:center;gap:10px;min-height:48px;padding:0 14px;transition:border-color .16s,box-shadow .16s;display:flex}.search-control:focus-within{border-color:var(--selected-border);box-shadow:0 0 0 3px #4d8ef72b}.search-control svg{color:var(--muted);flex:none}.search-control input{width:100%;height:46px;color:var(--text);background:0 0;border:0;outline:0;font-size:.94rem}.search-control input::placeholder{color:#969084}.search-control input::-webkit-search-cancel-button{cursor:pointer}.tag-filters{grid-template-columns:repeat(4,minmax(0,1fr));gap:25px;margin-top:24px;display:grid}.tag-group{border:0;min-width:0;margin:0;padding:0}.tag-group legend{margin-bottom:10px;padding:0;font-size:.78rem;font-weight:800}.tag-group__options{flex-wrap:wrap;gap:7px;display:flex}.tag-chip{border:1px solid var(--border);color:#45423c;cursor:pointer;background:0 0;border-radius:6px;align-items:center;gap:5px;min-height:32px;padding:6px 10px;font-size:.73rem;line-height:1.15;transition:background .14s,border-color .14s,transform .14s;display:inline-flex}.tag-chip:hover{background:#ffffffb3;border-color:#afa89d}.tag-chip:active{transform:translateY(1px)}.tag-chip.is-selected{color:#175fc1;background:var(--selected-bg);border-color:var(--selected-border);font-weight:700}.tag-chip svg{stroke-width:2.4px;width:13px;height:13px}.result-bar{justify-content:space-between;align-items:center;gap:20px;padding:23px 0 17px;display:flex}.result-bar p{margin:0;font-size:.9rem}.result-bar strong{font-size:1.06rem}.clear-button{cursor:pointer;background:0 0;border:0;align-items:center;gap:7px;padding:8px 0;font-size:.78rem;font-weight:700;display:inline-flex}.clear-button:disabled{opacity:.35;cursor:default}.clear-button svg{width:16px}.template-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;display:grid}.template-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);flex-direction:column;min-width:0;text-decoration:none;transition:border-color .18s,transform .18s,box-shadow .18s;display:flex;overflow:hidden}.template-card:hover,.template-card:focus-visible{box-shadow:var(--shadow-card);border-color:#9f988d;transform:translateY(-3px)}.template-card__image{aspect-ratio:16/9;border-bottom:1px solid var(--border);background:#eee8dd;overflow:hidden}.template-card__image img{object-fit:cover;width:100%;height:100%;transition:transform .3s}.template-card:hover img{transform:scale(1.018)}.template-card__body{flex-direction:column;flex:1;padding:15px 15px 14px;display:flex}.template-card h2{letter-spacing:-.01em;margin:0;font-size:.96rem;line-height:1.45}.template-card p{color:var(--muted);margin:7px 0 15px;font-size:.76rem;line-height:1.65}.template-card__meta{justify-content:space-between;align-items:flex-end;gap:8px;margin-top:auto;display:flex}.template-card ul{flex-wrap:wrap;gap:5px;margin:0;padding:0;list-style:none;display:flex}.template-card li{color:#555149;background:#f0ede7;border-radius:4px;padding:4px 7px;font-size:.65rem}.card-arrow{flex:none;width:20px;transition:transform .18s}.template-card:hover .card-arrow{transform:translate(4px)}.empty-results{text-align:center;border:1px dashed var(--border-strong);border-radius:var(--radius-card);padding:84px 20px}.empty-results h2{margin:0 0 10px;font-size:1.2rem}.empty-results p{color:var(--muted);margin:0 0 22px}.button{border-radius:var(--radius-control);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:9px;min-height:44px;padding:10px 18px;font-size:.82rem;font-weight:800;line-height:1.2;text-decoration:none;transition:background .15s,border-color .15s,transform .15s;display:inline-flex}.button:active:not(:disabled){transform:translateY(1px)}.button:disabled{opacity:.45;cursor:not-allowed}.button--blue{background:var(--action-blue);color:#fff}.button--blue:hover:not(:disabled){background:var(--action-blue-dark)}.button--yellow{background:var(--action-yellow);color:#16130a;border-color:#e2ca1a}.button--yellow:hover{background:var(--action-yellow-dark)}.button--outline{color:var(--text);border-color:var(--border-strong);background:0 0}.button--outline:hover{background:#f2eee6}.button--full{width:100%}.button svg{width:17px;height:17px}.detail-topbar{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:5;background:#fffdf8e0;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;min-height:66px;padding:10px 22px;display:grid;position:relative}.detail-topbar>a{color:#4c4841;justify-self:start;align-items:center;gap:4px;font-size:.8rem;text-decoration:none;display:inline-flex}.detail-topbar>a:hover{color:var(--action-blue-dark)}.detail-topbar>div{text-align:center;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:7px;display:flex}.detail-topbar strong{font-size:1.05rem}.detail-topbar div>span{color:var(--muted);font-size:.72rem}.detail-topbar small{color:var(--muted);flex-basis:100%;font-size:.69rem}.topbar-save{color:var(--success);justify-self:end;font-size:.69rem}.detail-grid{flex:1;grid-template-columns:minmax(290px,28fr) minmax(410px,36fr) minmax(410px,36fr);align-items:start;width:100%;display:grid}.reference-column,.variables-column,.output-column{min-width:0;padding:22px 20px 42px}.variables-column,.output-column{border-left:1px solid var(--border)}.output-column{background:#fffdf861;max-height:calc(100vh - 66px);position:sticky;top:0;overflow:auto}.column-title{align-items:baseline;gap:12px;display:flex}.column-title h1,.column-title h2{letter-spacing:-.03em;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:1.38rem}.column-title span{color:var(--muted);font-size:.78rem;font-weight:650}.column-intro{color:var(--muted);margin:8px 0 20px;font-size:.75rem;line-height:1.6}.reference-image{aspect-ratio:16/9;object-fit:cover;border:1px solid var(--border);background:var(--surface);width:100%;height:auto}.reference-image--portrait{aspect-ratio:auto;object-fit:contain;object-position:top;background:#fff7ee}.reference-meta{margin:17px 0 0}.reference-meta div{border-bottom:1px solid var(--border);grid-template-columns:90px 1fr;gap:10px;padding:12px 0;display:grid}.reference-meta dt{color:var(--muted);font-size:.68rem;font-weight:700}.reference-meta dd{margin:0;font-size:.8rem;font-weight:650;line-height:1.55}.structure-points{margin:18px 0 0;padding:0;list-style:none}.structure-points li{color:#4e4a43;padding:5px 0 5px 21px;font-size:.75rem;line-height:1.55;position:relative}.structure-points li:before{content:"✓";border:1px solid #898278;border-radius:50%;place-items:center;width:14px;height:14px;font-size:8px;font-weight:900;display:grid;position:absolute;top:5px;left:0}.reference-disclaimer{border:1px solid var(--border);border-radius:var(--radius-control);color:var(--muted);text-align:center;background:#ffffff40;margin:22px 0 0;padding:14px;font-size:.68rem;line-height:1.7}.randomize-button{margin-bottom:16px}.variable-section,.palette-section,.freeform-section{border-top:1px solid var(--border);padding:18px 0}.randomize-button+.variable-section{border-top:0}.variable-section__heading{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:11px;display:flex}.variable-section__heading h3{margin:0;font-size:.88rem;line-height:1.45}.variable-section__heading p{color:var(--muted);margin:4px 0 0;font-size:.68rem;line-height:1.55}.requirement-badge{border:1px solid var(--border);color:var(--muted);background:#f2eee7;border-radius:4px;flex:none;padding:3px 6px;font-size:.61rem;font-weight:800}.requirement-badge.is-required{color:#fff;background:var(--required);border-color:var(--required)}.option-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;display:grid}.select-option{border:1px solid var(--border);border-radius:var(--radius-control);text-align:left;cursor:pointer;background:#ffffff47;align-items:center;gap:8px;min-height:46px;padding:8px 9px;font-size:.7rem;line-height:1.38;display:flex}.select-option:hover{background:#ffffffb3;border-color:#aaa397}.select-option.is-selected{border-color:var(--selected-border);background:var(--selected-bg);color:#154f9c;box-shadow:inset 0 0 0 1px var(--selected-border);font-weight:700}.radio-mark{background:var(--surface);border:1px solid #aaa397;border-radius:50%;flex:none;place-items:center;width:18px;height:18px;display:grid}.radio-mark svg{color:#fff;width:12px;height:12px}.select-option.is-selected .radio-mark{background:var(--action-blue);border-color:var(--action-blue)}.field-label{display:block;position:relative}.field-label>input,.field-label>textarea,.compact-field input,.freeform-section textarea{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--surface);width:100%;color:var(--text);outline:0;font-size:.75rem;line-height:1.55;transition:border-color .15s,box-shadow .15s}.field-label>input,.compact-field input{min-height:42px;padding:9px 68px 9px 11px}.field-label>textarea,.freeform-section textarea{resize:vertical;min-height:86px;padding:10px 66px 10px 11px}.field-label>input:focus,.field-label>textarea:focus,.compact-field input:focus,.freeform-section textarea:focus{border-color:var(--selected-border);box-shadow:0 0 0 3px #4d8ef729}.compact-field{color:var(--muted);margin-top:9px;font-size:.66rem;font-weight:700}.compact-field>span{font-size:.6rem;font-weight:500}.compact-field input{margin-top:5px;padding-right:11px}.character-count{color:#898278;font-size:.62rem;position:absolute;bottom:12px;right:10px}.freeform-section{position:relative}.freeform-section>.character-count{bottom:28px}.is-error,.character-count.is-error{color:var(--required)!important}.field-error{color:var(--required);margin-top:6px;font-size:.67rem;line-height:1.45;display:block}.swatch-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;display:grid}.swatch{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--surface);align-items:center;gap:8px;min-width:0;padding:7px;display:flex}.swatch__color{border:1px solid #0000001f;border-radius:5px;flex:none;width:36px;height:36px}.swatch span:last-child{min-width:0}.swatch small,.swatch strong{display:block}.swatch small{color:var(--muted);margin-bottom:3px;font-size:.58rem}.swatch strong{text-overflow:ellipsis;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.65rem;overflow:hidden}.palette-source{color:var(--muted);margin:9px 0;font-size:.66rem}.palette-presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:9px;display:grid}.palette-presets button{border:1px solid var(--border);text-align:left;cursor:pointer;background:0 0;border-radius:6px;grid-template-columns:36px 1fr auto;align-items:center;gap:7px;min-width:0;min-height:36px;padding:6px 8px;font-size:.64rem;display:grid}.palette-presets button:hover{background:#ffffffb3}.palette-presets button.is-selected{border-color:var(--selected-border);background:var(--selected-bg);color:#154f9c;font-weight:700}.palette-presets svg{width:13px}.mini-palette{border:1px solid #0000001f;border-radius:3px;grid-template-columns:repeat(4,1fr);width:36px;height:18px;display:grid;overflow:hidden}.mini-palette i{display:block}.prompt-editor{min-width:0}.output-heading{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.output-heading label{font-size:.87rem;font-weight:800}.output-heading span{color:var(--muted);font-size:.63rem}.prompt-editor>textarea{resize:vertical;border:2px solid var(--selected-border);border-radius:var(--radius-control);background:var(--surface);color:#292724;outline:0;width:100%;min-height:min(55vh,590px);padding:14px;font-size:.8rem;line-height:1.9}.prompt-editor>textarea:focus{box-shadow:0 0 0 3px #4d8ef730}.manual-state{border-left:3px solid var(--action-yellow-dark);background:#fff9cc;margin-top:10px;padding:11px}.manual-state p{color:#514713;margin:0 0 7px;font-size:.68rem;line-height:1.55}.manual-state button{color:#765f00;cursor:pointer;background:0 0;border:0;border-bottom:1px solid;padding:0;font-size:.66rem;font-weight:700}.output-actions{grid-template-columns:1fr 1fr;gap:9px;margin-top:12px;display:grid}.save-state{color:var(--success);align-items:center;gap:6px;margin-top:12px;font-size:.68rem;display:flex}.save-state svg{width:15px}.storage-warning{color:var(--required);font-size:.67rem;line-height:1.5}.copy-notice{min-height:20px;color:var(--action-blue-dark);margin:8px 0 0;font-size:.7rem;font-weight:700}.site-footer{border-top:1px solid var(--border);width:100%;color:var(--muted);background:#fffdf859;justify-content:space-between;align-items:center;gap:30px;padding:22px 46px;font-size:.69rem;display:flex}.privacy-note{align-items:flex-start;gap:9px;max-width:900px;display:flex}.privacy-note svg{flex:none;width:16px;margin-top:2px}.privacy-note p{margin:0;line-height:1.6}.site-footer>a{white-space:nowrap;text-underline-offset:3px}.mobile-output-jump{display:none}.legal-page{flex:1;width:min(100% - 40px,820px);margin:0 auto;padding:44px 0 70px}.back-link{color:var(--muted);align-items:center;gap:5px;margin-bottom:32px;font-size:.78rem;text-decoration:none;display:inline-flex}.legal-page h1{letter-spacing:-.04em;margin:0 0 36px;font-size:clamp(1.8rem,4vw,2.8rem)}.legal-page section{border-top:1px solid var(--border);padding:22px 0}.legal-page h2{margin:0 0 10px;font-size:1rem}.legal-page p{color:#4d4942;margin:0;font-size:.84rem;line-height:1.9}.not-found{text-align:center;place-content:center;justify-items:center;min-height:100vh;padding:30px;display:grid}.not-found>p:first-child{color:var(--action-blue);margin:0;font-size:4rem;font-weight:900;line-height:1}.not-found h1{margin:18px 0 8px;font-size:1.5rem}.not-found>p:not(:first-child){color:var(--muted);margin:0 0 26px}@media (width<=1199px){.list-page{padding-inline:30px}.tag-filters,.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-topbar{grid-template-columns:1fr auto}.detail-topbar>div{text-align:left;order:-1;justify-content:flex-start;justify-self:start}.detail-topbar>a{justify-self:end}.topbar-save{display:none}.detail-grid{grid-template-columns:minmax(280px,38fr) minmax(420px,62fr)}.output-column{border-left:0;border-top:1px solid var(--border);grid-column:1/-1;max-height:none;padding-inline:max(30px,12vw);position:static}.prompt-editor>textarea{min-height:420px}}@media (width<=767px){.list-page{padding:28px 18px 60px}.product-title-row{align-items:flex-end;gap:9px}.product-title-row h1{overflow-wrap:anywhere;font-size:2rem}.product-header{margin-bottom:26px}.product-subtitle{margin-top:12px}.search-panel{padding-block:22px}.tag-filters{grid-template-columns:1fr;gap:19px}.result-bar{align-items:flex-start}.template-grid{grid-template-columns:1fr;gap:14px}.template-card h2{font-size:1rem}.detail-topbar{justify-content:space-between;min-height:62px;padding:9px 14px;display:flex}.detail-topbar>div strong{font-size:.8rem}.detail-topbar>div span,.detail-topbar small{font-size:.59rem}.detail-topbar>a{font-size:0}.detail-topbar>a svg{width:24px;height:24px}.detail-grid{display:block}.reference-column,.variables-column,.output-column{border-left:0;border-top:1px solid var(--border);width:100%;padding:22px 16px 34px}.reference-column{border-top:0}.column-title h1,.column-title h2{font-size:1.2rem}.option-grid{grid-template-columns:1fr}.select-option{min-height:48px}.swatch-grid{grid-template-columns:1fr 1fr}.palette-presets,.output-actions{grid-template-columns:1fr}.prompt-editor>textarea{min-height:380px}.site-footer{flex-direction:column;align-items:flex-start;padding:20px 18px 86px}.mobile-output-jump{z-index:10;background:var(--action-blue);color:#fff;border-radius:999px;padding:11px 15px;font-size:.72rem;font-weight:800;text-decoration:none;display:block;position:fixed;bottom:14px;right:14px;box-shadow:0 6px 24px #2258aa4d}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}