:root{color-scheme:light;--paper:#fff;--ink:#231f26;--muted:#77717c;--accent:#f2a181;--accent-hover:#f6ae90;--check:#b8d86f;--plum:#80588e;--line:#eee9ed;--soft:#fff5ef;--tg-safe-top:0px;--tg-safe-bottom:0px}
*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:16px;line-height:1.45;-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default}button,a,input{touch-action:manipulation}[hidden]{display:none!important}
.app{max-width:560px;min-height:100svh;margin:0 auto;padding:calc(22px + max(env(safe-area-inset-top),var(--tg-safe-top))) 24px calc(10px + max(env(safe-area-inset-bottom),var(--tg-safe-bottom)));display:flex;flex-direction:column}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:35px}.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:750;letter-spacing:-.025em}.mark{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:13px;background:linear-gradient(140deg,#ffac78,#ff6f83 58%,#80588e);color:#fff;font-size:24px;font-weight:800;box-shadow:0 4px 12px #c9627420}.demo-badge{font-size:12px;line-height:1;padding:8px 11px;border-radius:20px;color:#827889;background:#f6f2f7}
.intro{margin-bottom:26px}.intro h1{margin:0;font-size:clamp(31px,8.5vw,42px);font-weight:750;line-height:1.12;letter-spacing:-.045em;outline:none;overflow-wrap:break-word}.intro p{color:var(--muted);font-size:16px;line-height:1.5;margin:13px 0 0}.flow{flex:1}.format-options,.task-options{padding:0;margin:0;border:0;min-width:0}
.flow-panel:not([hidden]){animation:panel-in .38s cubic-bezier(.2,.75,.25,1) both}.format-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:4px;min-height:169px;padding:16px 12px 16px 21px;background:var(--paper);border:1.5px solid var(--line);border-radius:23px;box-shadow:0 5px 20px #3d203706;cursor:pointer;transition:border-color .18s,background .18s,box-shadow .18s}.format-card input,.task-card input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.format-card.selected{background:var(--soft);border-color:transparent;outline:2px solid var(--plum);outline-offset:5px;box-shadow:0 7px 22px #80588e16}.format-card:focus-within,.task-card:focus-within{outline:2px solid #80588e;outline-offset:5px}.format-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}.format-title{font-size:23px;line-height:1.15;font-weight:720;letter-spacing:-.025em}.format-description{font-size:14px;line-height:1.45;color:var(--muted);margin-top:8px}.format-art{display:block;width:150px;height:150px;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 7px 7px #6134540b);animation:art-breathe 3.8s ease-in-out infinite;transform-origin:center}
.selection{display:grid;place-items:center;margin-top:13px;width:23px;height:23px;border:1.5px solid #bab0bb;border-radius:50%;background:#fff;flex-shrink:0}.selection svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;opacity:0}.selected .selection{background:var(--check);border-color:var(--check)}.selected .selection svg{opacity:1}
.format-label{display:inline-flex;align-items:center;align-self:flex-start;padding:7px 12px;border-radius:99px;background:#f4edf7;color:#70467f;font-size:14px;font-weight:600}.task-options{display:grid;gap:12px;margin-top:18px}.task-card{position:relative;display:flex;gap:13px;align-items:center;padding:19px 17px;border:1.5px solid var(--line);border-radius:19px;cursor:pointer;background:#fff;transition:background .18s,border-color .18s}.task-card.selected{border-color:transparent;outline:2px solid var(--plum);outline-offset:5px;background:var(--soft)}.task-card:nth-of-type(2){animation:card-in .38s .06s cubic-bezier(.2,.75,.25,1) both}.task-card:nth-of-type(3){animation:card-in .38s .12s cubic-bezier(.2,.75,.25,1) both}.task-card:nth-of-type(4){animation:card-in .38s .18s cubic-bezier(.2,.75,.25,1) both}.task-card:nth-of-type(5){animation:card-in .38s .24s cubic-bezier(.2,.75,.25,1) both}.task-copy{flex:1;min-width:0}.task-title{display:block;font-size:17px;font-weight:650;line-height:1.25}.task-description{display:block;font-size:14px;color:var(--muted);margin-top:5px;line-height:1.4}.task-card .selection{margin:0}.task-number{font-size:14px;color:#896393;font-weight:650;width:23px;flex-shrink:0}
.step-footer{padding-top:30px}.step-meta{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:14px;color:var(--muted);font-size:14px}.progress{display:flex;gap:5px;width:100px}.progress span{height:4px;border-radius:4px;background:#eee8ef;flex:1}.progress .filled{background:var(--plum)}.actions{display:flex;gap:10px}.next,.back{min-height:56px;padding:14px 20px;border-radius:16px;border:0;font-size:16px;font-weight:700}.next{display:flex;align-items:center;justify-content:center;gap:13px;flex:1;background:var(--accent);color:#32190f;transition:background .15s,transform .15s,opacity .15s}.next:disabled{background:#f5eeeb;color:#9a8178}.next svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.back{background:#f5f1f6;color:#694574;padding:14px 18px}.next:focus-visible,.back:focus-visible{outline:3px solid #80588e;outline-offset:4px}.next:active:not(:disabled),.back:active{background:var(--accent);color:#fff;transform:translateY(1px)}.signature{font-size:12px;line-height:1.5;text-align:center;margin:18px 0 4px;color:#8e8392}
.idea-card{border-radius:24px;border:1px solid #f2ded4;padding:23px;background:linear-gradient(135deg,#fff7f1 0%,#fff 60%,#f7f1fa 100%)}.idea-top{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:90px}.idea-top img{object-fit:contain;width:96px;height:96px}.idea-card h2{font-size:27px;letter-spacing:-.025em;line-height:1.18;margin:17px 0 13px}.idea-card p{font-size:16px;line-height:1.65;color:#655d69;margin:0}.chips{display:flex;flex-wrap:wrap;gap:7px;padding:0;list-style:none;margin:22px 0 0}.chips li{font-size:14px;padding:7px 11px;background:#fff;border:1px solid #eadfe8;border-radius:99px;color:#6b477a}.result-note{font-size:15px;color:var(--muted);line-height:1.55;margin:19px 3px 0}.toast{position:fixed;z-index:5;bottom:calc(20px + env(safe-area-inset-bottom));left:50%;max-width:min(90vw,440px);transform:translate(-50%,12px);padding:13px 17px;border-radius:16px;background:#392641;color:#fff;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes panel-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes card-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes art-breathe{0%,100%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.04) rotate(-1deg)}}@media(hover:hover){.format-card:hover,.task-card:hover{border-color:#c99caf}.next:hover:not(:disabled){background:var(--accent-hover);color:#fff}.back:hover{background:#eee5f1}}
@media(min-width:700px){body{background:#f6f3f8}.app{margin:28px auto;min-height:800px;border:1px solid #eee7ef;border-radius:30px;background:#fff;padding:28px 32px 18px;box-shadow:0 16px 60px #3d23430a}.top{margin-bottom:37px}.format-card{grid-template-columns:minmax(0,1fr) 170px}.format-art{width:170px;height:160px}.intro h1{font-size:42px}}
@media(max-width:370px){.app{padding-left:18px;padding-right:18px}.top{margin-bottom:28px}.brand{font-size:17px}.format-card{grid-template-columns:minmax(0,1fr) 112px;padding:15px 10px 15px 16px;min-height:158px}.format-art{width:112px;height:132px}.format-title{font-size:21px}.format-description{font-size:14px}.step-footer{padding-top:24px}.intro{margin-bottom:22px}.next,.back{padding-left:14px;padding-right:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
