@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#10110f;--panel:#191b17;--panel2:#22251e;--line:#3a3e34;--cream:#f3f3e9;--muted:#a0a496;--acid:#d4ff47;--pink:#f88bab;--mono:'DM Mono',monospace;--sans:'Space Grotesk',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--cream);font-family:var(--sans)}button,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.topbar{height:72px;padding:0 clamp(20px,4.5vw,72px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{font-size:20px;font-weight:700;letter-spacing:-1.3px}.brand-mark{color:var(--acid);font-size:25px;margin-right:10px}.brand-outline{color:var(--acid)}.top-right,.eyebrow,.kicker,.head-aside,.control-label,.output-head,.preview-title,.test-tags,.preview-disclaimer,.lab-note,.ticker,.card-top,.card-foot,.filter-buttons,.button,.toast,footer{font-family:var(--mono);font-size:11px;letter-spacing:.09em}.top-right{color:var(--muted)}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acid);box-shadow:0 0 10px var(--acid);margin-right:8px}.top-divider{margin:0 14px;color:var(--line)}.hero{overflow:hidden}.eyebrow{display:flex;justify-content:space-between;padding:24px clamp(20px,4.5vw,72px);color:var(--muted)}.hero-grid{min-height:530px;padding:35px clamp(20px,4.5vw,72px) 64px;display:grid;grid-template-columns:1fr .8fr;gap:35px;align-items:center}.hero h1{font-size:clamp(72px,10.5vw,174px);line-height:.78;letter-spacing:-.105em;margin:0;font-weight:700}.hero h1 em{font-style:normal;color:var(--acid)}.period{color:var(--pink)}.hero-copy{font-size:clamp(16px,1.6vw,22px);line-height:1.42;max-width:560px;margin:40px 0 28px;color:#d1d4c8}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.button{border:1px solid var(--line);border-radius:0;display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:17px 20px;min-width:185px;font-weight:500;transition:transform .2s,background .2s,color .2s}.button:hover{transform:translateY(-2px)}.button-acid{background:var(--acid);border-color:var(--acid);color:#111}.button-acid:hover{background:#e6ff88}.button-ghost{background:transparent;color:var(--cream)}.button-ghost:hover{background:var(--panel2)}.button span{font-size:16px;line-height:0}.hero-visual{border:1px solid var(--line);min-height:350px;background:repeating-linear-gradient(0deg,transparent,transparent 27px,rgba(212,255,71,.035) 28px),repeating-linear-gradient(90deg,transparent,transparent 27px,rgba(212,255,71,.035) 28px),var(--panel);display:flex;flex-direction:column;justify-content:space-between;padding:22px;transform:rotate(2deg);box-shadow:22px 22px 0 #25291d}.hero-visual-label,.hero-visual-foot{font:10px var(--mono);letter-spacing:.08em;color:var(--muted)}.hero-face{font-size:clamp(24px,3vw,50px);white-space:nowrap;text-align:center;color:var(--acid);overflow:hidden}.hero-visual-foot{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:17px}.ticker{height:48px;background:var(--acid);color:#151711;display:flex;justify-content:space-around;align-items:center;gap:35px;white-space:nowrap;overflow:hidden;font-weight:500}.section{padding:90px clamp(20px,4.5vw,72px)}.section-one{background:#141612}.section-head{display:flex;justify-content:space-between;gap:30px;margin-bottom:38px}.kicker{color:var(--acid);margin:0 0 20px}.section h2{font-size:clamp(48px,6vw,95px);line-height:.9;letter-spacing:-.075em;margin:0}.section h2 span{color:var(--acid)}.section-sub{font-size:17px;color:var(--muted);margin:20px 0 0;max-width:610px}.head-aside{border-left:1px solid var(--line);padding-left:20px;line-height:1.8;color:var(--muted);align-self:end;min-width:155px}.filter-row{display:flex;gap:12px;justify-content:space-between;margin-bottom:24px}.search-box{display:flex;align-items:center;gap:10px;border:1px solid var(--line);padding:0 15px;background:var(--panel);min-width:280px;flex:1;max-width:490px}.search-box span{font-size:22px;color:var(--acid)}.search-box input{background:none;border:0;color:var(--cream);outline:none;width:100%;height:46px}.search-box input::placeholder{color:#75796d}.filter-buttons{display:flex;gap:5px;align-items:stretch;flex-wrap:wrap}.filter-buttons button,.preview-switch button{background:transparent;border:1px solid var(--line);color:var(--muted);padding:0 13px;font-family:var(--mono);font-size:10px;letter-spacing:.06em}.filter-buttons button.active,.filter-buttons button:hover,.preview-switch button.selected{border-color:var(--acid);color:var(--acid)}.one-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.art-card{min-height:205px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;padding:17px;transition:border-color .2s,transform .2s}.art-card:hover{border-color:var(--acid);transform:translateY(-2px)}.card-top,.card-foot{display:flex;justify-content:space-between;align-items:center;color:var(--muted)}.card-top span:last-child{color:var(--pink)}.card-art{font-size:clamp(19px,2vw,31px);white-space:nowrap;overflow:auto;scrollbar-width:thin;display:flex;align-items:center;flex:1;min-height:85px;color:var(--cream)}.card-foot{border-top:1px solid var(--line);padding-top:13px;gap:10px}.card-copy{background:var(--acid);color:#111;border:0;padding:9px 13px;font-family:var(--mono);font-size:10px;font-weight:500}.card-copy:hover{background:#e6ff88}.empty{padding:35px;border:1px dashed var(--line);color:var(--muted)}.section-generator{background:var(--bg)}.generator-grid{display:grid;grid-template-columns:.88fr 1.12fr;border:1px solid var(--line)}.generator-controls{padding:30px;border-right:1px solid var(--line)}.control-group{margin-bottom:26px}.control-label{display:flex;justify-content:space-between;color:var(--muted);margin-bottom:12px}.control-label strong{font-weight:500;color:var(--acid)}.preset-row{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.preset{height:84px;border:1px solid var(--line);background:var(--panel);color:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font:10px var(--mono);letter-spacing:.08em}.preset .preset-emoji{font-size:25px}.preset.active,.preset:hover{border-color:var(--acid);color:var(--acid)}.upload{border:1px dashed #69715c;display:flex;align-items:center;gap:18px;padding:17px;margin:0 0 28px;cursor:pointer;color:var(--cream)}.upload:hover{border-color:var(--acid)}.upload input{display:none}.upload-icon{font-size:27px;color:var(--acid)}.upload strong,.upload small{display:block;font-family:var(--mono);letter-spacing:.05em}.upload strong{font-size:11px}.upload small{font-size:10px;color:var(--muted);margin-top:4px}.segmented{display:flex;gap:8px}.segmented button{background:var(--panel);border:1px solid var(--line);color:var(--muted);padding:12px;flex:1;text-align:left;font:12px var(--mono);letter-spacing:.05em}.segmented button small{display:block;margin-top:5px;font-size:9px}.segmented button.active{border-color:var(--acid);color:var(--acid)}input[type=range]{width:100%;accent-color:var(--acid)}.lab-note{display:flex;gap:12px;color:var(--muted);line-height:1.5;margin:20px 0 0}.lab-note span{color:var(--pink);font-size:20px}.generator-output{display:flex;flex-direction:column;min-width:0}.output-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted)}.output-head span:last-child{color:var(--acid)}.art-output{font-family:var(--mono);font-size:15px;line-height:1.55;white-space:pre;overflow:auto;min-height:390px;margin:0;padding:32px;color:var(--acid);text-align:center;background:radial-gradient(circle at center,#22291a 0,#171a15 63%)}.output-actions{display:flex;gap:8px;padding:18px;border-top:1px solid var(--line)}.output-actions .button{flex:1}.section-test{background:#1b1f17}.test-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}.test-instructions{border-top:1px solid var(--line)}.test-instructions ol{list-style:none;padding:0;margin:0;counter-reset:test}.test-instructions li{counter-increment:test;border-bottom:1px solid var(--line);padding:20px 0 20px 50px;position:relative;color:#c6cabd;line-height:1.45}.test-instructions li:before{content:counter(test,decimal-leading-zero);position:absolute;left:0;top:20px;color:var(--acid);font:12px var(--mono)}.test-instructions strong{color:var(--cream)}.test-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px}.test-tags span{border:1px solid var(--line);padding:9px;color:var(--muted)}.preview-panel{border:1px solid var(--line);background:#151713;padding:20px}.preview-title{display:flex;justify-content:space-between;align-items:center;color:var(--muted);gap:10px}.preview-switch{display:flex;gap:4px}.preview-switch button{padding:7px}.phone-frame{background:#fff;color:#111;margin:20px auto 0;padding:17px;max-width:360px;min-height:245px;transition:max-width .2s}.phone-frame.narrow{max-width:280px}.comment-header{display:flex;align-items:center;gap:10px;font:12px Arial,sans-serif}.comment-header span:nth-child(2){display:flex;flex-direction:column;gap:3px}.comment-header small{color:#777;font-size:10px}.avatar{width:31px;height:31px;border-radius:50%;background:#e6d7bf;display:grid;place-items:center;font-weight:bold}.heart{margin-left:auto;font-size:22px}.comment-content{font:14px/1.36 Arial,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;margin:12px 0 0 42px;min-height:90px}.comment-meta{font:10px Arial,sans-serif;color:#888;margin:10px 0 0 42px}.preview-disclaimer{color:var(--muted);line-height:1.4;margin:15px 0 0}footer{display:flex;justify-content:space-between;gap:20px;padding:35px clamp(20px,4.5vw,72px);color:var(--muted)}.footer-star{color:var(--acid);font-size:16px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,30px);background:var(--acid);color:#111;padding:15px 20px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:5}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1100px){.one-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-grid{grid-template-columns:1fr .9fr}.hero-face{font-size:27px}}@media(max-width:800px){.hero-grid{grid-template-columns:1fr}.hero-visual{min-height:210px;transform:none;box-shadow:none}.hero-face{font-size:35px}.one-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.generator-grid,.test-grid{grid-template-columns:1fr}.generator-controls{border-right:0;border-bottom:1px solid var(--line)}.section-head{flex-direction:column}.head-aside{align-self:start}}@media(max-width:560px){.topbar{height:60px}.top-right{font-size:9px}.hero-grid{padding-top:20px;min-height:unset}.hero h1{font-size:clamp(70px,19vw,110px)}.eyebrow span:last-child{display:none}.hero-copy{margin-top:30px}.button{min-width:0}.hero-actions .button{flex:1;font-size:10px;gap:7px;padding:15px 12px}.hero-visual{min-height:190px}.hero-face{font-size:27px}.section{padding-top:65px;padding-bottom:65px}.section h2{font-size:clamp(48px,13vw,72px)}.filter-row{flex-direction:column}.search-box{max-width:none;min-width:0}.filter-buttons{height:35px}.filter-buttons button{padding:0 9px}.one-grid{grid-template-columns:1fr}.art-card{min-height:170px}.card-art{font-size:26px}.generator-controls{padding:20px}.preset-row{grid-template-columns:repeat(2,1fr)}.art-output{font-size:12px;padding:18px;min-height:280px}.output-actions{flex-wrap:wrap}.output-actions .button{min-width:130px}.phone-frame{max-width:300px}footer{flex-direction:column}}

.fit-status{font:10px var(--mono);letter-spacing:.07em;color:var(--acid);border:1px solid #657b28;padding:9px;margin:17px 0 -4px}.fit-status.warning{color:var(--pink);border-color:#734652}
.result-count{font:11px var(--mono);color:var(--muted);letter-spacing:.08em;margin:0 0 15px}.result-count strong{color:var(--acid)}
.card-details{border-top:1px solid var(--line);padding-top:9px;margin-top:5px;font:10px/1.5 var(--mono);color:var(--muted)}.card-details summary{cursor:pointer;color:var(--acid);list-style:none;padding:4px 0}.card-details summary::-webkit-details-marker{display:none}.card-details summary:after{content:' +';float:right}.card-details[open] summary:after{content:' −'}.detail-body{padding:9px 0 2px}.detail-row{display:flex;justify-content:space-between;gap:8px;margin:5px 0}.detail-row strong{color:var(--cream);font-weight:500}.emoji-list{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0}.emoji-chip{border:1px solid var(--line);padding:5px 7px;color:var(--cream)}.detail-note{color:var(--muted);margin:10px 0 2px}
.section-guide{background:#20241b}.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.guide-grid article{border:1px solid var(--line);padding:25px;min-height:270px;background:#191c16}.guide-index{font:10px var(--mono);letter-spacing:.1em;color:var(--acid)}.guide-sample{font-size:40px;min-height:85px;display:flex;align-items:center;color:var(--acid);white-space:nowrap;overflow:hidden}.guide-grid h3{font-size:24px;letter-spacing:-.04em;margin:0 0 10px}.guide-grid p{font-size:14px;line-height:1.5;color:var(--muted);margin:0}.guide-grid a{color:var(--acid);text-decoration:underline}
.source-strip{display:flex;gap:12px;align-items:center;border:1px solid var(--line);padding:10px;margin:-15px 0 27px;background:var(--panel)}.source-strip canvas{width:58px;height:58px;border:1px solid var(--line);background:#000;image-rendering:pixelated}.source-strip strong,.source-strip small{display:block;font:10px var(--mono);letter-spacing:.05em}.source-strip strong{color:var(--acid)}.source-strip small{color:var(--muted);line-height:1.4;margin-top:5px}.mode-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mode-row button{background:var(--panel);border:1px solid var(--line);color:var(--muted);padding:12px 7px;text-align:left;font:10px var(--mono);letter-spacing:.04em}.mode-row button small{display:block;margin-top:5px;font-size:9px;letter-spacing:0}.mode-row button.active{border-color:var(--acid);color:var(--acid)}.mode-hint{font:10px/1.5 var(--mono);color:var(--muted);margin:10px 0 0}.upload.dragging{border-color:var(--acid);background:var(--panel2)}
@media(max-width:800px){.guide-grid{grid-template-columns:1fr}.guide-grid article{min-height:0}.guide-sample{min-height:70px}}
@media(max-width:560px){.filter-buttons{height:auto;min-height:35px}.filter-buttons button{min-height:35px}}
.show-more{margin:28px auto 0;display:flex;width:max-content}.show-more[hidden]{display:none}
.catalog-sources{margin:35px 0 0;padding-top:15px;border-top:1px solid var(--line);font:11px/1.5 var(--mono);color:var(--muted)}.catalog-sources a{color:var(--acid);text-decoration:underline}
.section-structures{background:#1a1d16}.structure-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.structure-card{border:1px solid var(--line);background:var(--panel);min-width:0}.structure-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 16px;border-bottom:1px solid var(--line);font:10px var(--mono);letter-spacing:.05em}.structure-head strong{font-weight:500;color:var(--cream)}.structure-head button{border:0;background:var(--acid);color:#111;padding:9px 11px;white-space:nowrap;font:10px var(--mono)}.structure-art{margin:0;padding:20px 10px;min-height:225px;display:flex;justify-content:center;align-items:center;text-align:center;white-space:pre;overflow:auto;color:var(--acid);font:19px/1.24 var(--mono);letter-spacing:0}.structure-note{border-top:1px solid var(--line);margin:0;padding:12px 16px;color:var(--muted);font:10px/1.4 var(--mono)}
.style-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.style-row button{background:var(--panel);border:1px solid var(--line);color:var(--muted);padding:11px 6px;text-align:left;font:9px var(--mono);letter-spacing:.03em}.style-row button small{display:block;margin-top:5px;font-size:8px;letter-spacing:0}.style-row button.active{border-color:var(--acid);color:var(--acid)}
@media(max-width:1000px){.structure-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.structure-grid{grid-template-columns:1fr}.structure-art{min-height:190px;font-size:17px}.style-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.card-slogan{font:12px/1.4 var(--sans);color:var(--cream);margin:0 0 12px;min-height:34px}.card-source{font:9px/1.4 var(--mono);color:var(--acid);text-decoration:underline;margin:0 0 12px;width:max-content;max-width:100%}
.structure-art{font:21px/1.14 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif;color:var(--cream);font-variant-emoji:emoji}
@media(max-width:560px){.structure-art{font-size:20px;min-height:200px}}