:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f4f4f0;background:#0c0c0c}*{box-sizing:border-box}body{margin:0;background:#0c0c0c}header,main,footer{max-width:920px;margin:auto;padding:20px}.brand{font-weight:900;letter-spacing:.08em}.tag{color:#999;margin-top:4px}.hero{padding:46px 0 28px;border-bottom:1px solid #292929}.hero h1{font-size:clamp(42px,8vw,76px);line-height:.95;margin:0;letter-spacing:-.055em}.hero h1 span{color:#8f8f88}.hero p{max-width:650px;color:#b6b6af;font-size:18px;line-height:1.5}.group{padding:28px 0;border-bottom:1px solid #292929}.group h2,.subject label{font-size:12px;letter-spacing:.16em;color:#8f8f88}.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.chip{border:1px solid #3a3a38;background:#151515;color:#e9e9e4;border-radius:999px;padding:11px 15px;font:inherit;cursor:pointer}.chip.active{background:#f0f0e9;color:#111;border-color:#f0f0e9}.subject{padding:28px 0}.subject textarea{width:100%;min-height:110px;margin-top:12px;padding:16px;border:1px solid #3a3a38;border-radius:14px;background:#151515;color:#fff;font:inherit;resize:vertical}.output{border:1px solid #333;border-radius:18px;overflow:hidden;background:#121212}.output-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #2b2b2b;font-size:12px;letter-spacing:.12em;color:#999}.output-head button,.actions button{background:#efefe8;color:#111;border:0;border-radius:10px;padding:10px 13px;font-weight:800}.prompt-head{border-top:1px solid #2b2b2b}#slashLine,#promptText{display:block;padding:18px;line-height:1.55;white-space:pre-wrap}#slashLine{color:#d7ff73}.actions{display:flex;gap:10px;flex-wrap:wrap;padding:18px 0}.actions .ghost{background:#1c1c1c;color:#eee;border:1px solid #363636}.about{margin-top:22px;padding:24px;border-left:3px solid #d7ff73;background:#111}.about h2{margin-top:0}footer{color:#777;font-size:13px;padding-bottom:40px}@media(max-width:600px){header,main,footer{padding-left:16px;padding-right:16px}.hero{padding-top:32px}.output-head{gap:8px}.output-head button{padding:8px 9px}}
.group-title{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}.group-title h2{margin:0}.group-title span{font-size:13px;color:#b6b6af}.chip-wrap{position:relative}.tip{display:none;position:absolute;z-index:20;left:0;bottom:calc(100% + 12px);width:min(330px,80vw);padding:14px 15px;border:1px solid #4c6680;border-radius:12px;background:#142230;color:#f4f4f0;box-shadow:0 14px 35px #000b;line-height:1.35}.tip:after{content:"";position:absolute;left:24px;top:100%;border:8px solid transparent;border-top-color:#4c6680}.tip strong{display:block;font-size:13px;letter-spacing:.06em;color:#d7ff73;margin-bottom:6px}.tip p{font-size:14px;margin:0 0 8px}.tip small{display:block;color:#c9d1d8;font-size:12px;margin-top:5px}.chip-wrap:hover .tip,.chip-wrap.show-tip .tip{display:block}.chip:after{content:" ?";font-size:10px;color:#777}.chip.active:after{color:#555}@media(max-width:700px){.group-title{display:block}.group-title span{display:block;margin-top:6px}.tip{position:fixed;left:16px;right:16px;bottom:18px;width:auto}.tip:after{display:none}.chip-wrap:focus-within .tip{display:block}}

/* v0.3.0 — guided start, recipes and learning */
.start{margin:8px 0 34px;padding:24px;border:1px solid var(--line);border-radius:20px;background:#101010}.start-head h2{font-size:clamp(25px,3vw,38px);margin:5px 0}.start-head p{color:var(--muted);margin:0 0 18px}.eyebrow{font-size:11px;letter-spacing:.18em;color:#b7d84b;font-weight:800}.recipe-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.recipe{min-height:110px;text-align:left;padding:15px;border:1px solid #303030;border-radius:15px;background:#151515;color:#f4f4f2;display:flex;flex-direction:column;gap:5px;cursor:pointer}.recipe:hover,.recipe:focus-visible{border-color:#b7d84b;transform:translateY(-1px)}.recipe span{font-size:22px}.recipe strong{font-size:14px}.recipe small{color:#9a9a96;line-height:1.35}.advisor{margin-top:14px;padding:16px;border-left:3px solid #b7d84b;background:#141414;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.advisor p{color:#aaa;margin:4px 0 0}.advisor button{background:#f4f4ef;color:#111;border:0;border-radius:10px;padding:12px 15px;font-weight:800}.advisor small{grid-column:1/-1;color:#b7d84b}.why-box{margin:24px 0;padding:18px 20px;border:1px solid #2e2e2e;border-radius:16px;background:#111}.why-box h3{margin:0 0 10px;font-size:18px}.why-box p{margin:7px 0;color:#b8b8b4;line-height:1.45}.why-box b{color:#b7d84b;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.chip-wrap{touch-action:manipulation}@media(max-width:820px){.recipe-grid{grid-template-columns:repeat(2,1fr)}.advisor{grid-template-columns:1fr}.advisor button{width:100%}}@media(max-width:480px){.recipe-grid{grid-template-columns:1fr}.recipe{min-height:auto}.start{padding:16px}}

/* v0.4.0 — AI usage guidance */
.ai-guide{margin:22px 0 28px;padding:22px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.035)}
.ai-guide h2{margin:4px 0 8px;font-size:clamp(1.25rem,2vw,1.7rem)}
.ai-guide .lead{font-size:1.02rem;line-height:1.55;margin:0 0 18px;color:#f1f1f1}.ai-guide .lead strong{color:#fff}
.ai-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0 18px}.ai-step{padding:14px;border-radius:14px;background:#171717;border:1px solid rgba(255,255,255,.08);line-height:1.4}.ai-step b{display:block;font-size:.78rem;letter-spacing:.08em;color:#aaa;margin-bottom:5px}
.ai-where{padding:15px;border-radius:14px;background:#0f0f0f;border:1px solid rgba(255,255,255,.08)}.ai-where h3{margin:0 0 9px;font-size:1rem}.ai-where p{margin:6px 0;line-height:1.45}.ai-note{display:block;margin-top:12px;color:#999;line-height:1.45}
@media(max-width:760px){.ai-steps{grid-template-columns:1fr 1fr}}@media(max-width:460px){.ai-steps{grid-template-columns:1fr}}
.mode-info{margin:14px 0 20px;padding:16px;border:1px solid #2a2a2a;border-radius:14px;background:#111}.mode-info h3{margin:0 0 6px}.mode-info p{margin:0;color:#aaa}.recipe.mode-active{outline:2px solid #f2c94c;background:#181818}.recipe .mode-slash{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#f2c94c;font-size:12px}
/* v0.6.0 — dynamic builders */
.mode-active{outline:2px solid #4da3ff!important}.mode-info strong{color:#d7ff73}.start .recipe-grid:first-of-type{grid-template-columns:repeat(3,1fr)}
@media(max-width:700px){.start .recipe-grid:first-of-type{grid-template-columns:repeat(2,1fr)}}

/* v0.6.1 — category landing + update UX */
#modeInfo{scroll-margin-top:18px}

/* v0.7.0 — multilingual */
header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.lang-btn{border:1px solid #353535;background:#151515;color:#f4f4f0;border-radius:999px;padding:9px 12px;font-weight:800;cursor:pointer}.lang-btn:hover{border-color:#d7ff73}.language-modal[hidden]{display:none}.language-modal{position:fixed;z-index:9999;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(10px);display:grid;place-items:center;padding:18px}.language-card{position:relative;width:min(720px,100%);max-height:92vh;overflow:auto;background:#101010;border:1px solid #393939;border-radius:22px;padding:28px;box-shadow:0 30px 90px #000}.language-brand{font-weight:900;letter-spacing:.1em;color:#d7ff73}.language-card h2{font-size:clamp(25px,4vw,38px);line-height:1.08;margin:14px 0 8px}.language-card>p{color:#a8a8a2;margin:0 0 8px}.language-card>small{display:block;color:#777;margin:8px 0 18px}.language-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.lang-choice{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px;border-radius:14px;border:1px solid #333;background:#171717;color:#fff;text-align:left;cursor:pointer}.lang-choice:hover,.lang-choice.active{border-color:#d7ff73;background:#1d2117}.lang-choice b{font-size:17px}.lang-choice span{font-size:12px;color:#999}.language-close{position:absolute;right:16px;top:14px;border:0;background:transparent;color:#aaa;font-size:28px;cursor:pointer}.first-open .language-close{display:none}.language-privacy{margin-top:18px!important;font-size:12px}.language-modal.first-open .language-card{border-color:#46512a}@media(max-width:560px){.language-grid{grid-template-columns:1fr}.language-card{padding:22px}.language-card h2{font-size:26px}}
