:root{--blue:#007aff;--green:#34c759;--red:#ff3b30;--orange:#ff9500;--yellow:#fc0;--teal:#5ac8fa;--indigo:#5856d6;--pink:#ff2d55;--purple:#af52de;--mint:#00c7be;--bg:#fff;--bg-secondary:#f2f2f7;--bg-tertiary:#e5e5ea;--text-primary:#1d1d1f;--text-secondary:#6e6e73;--text-tertiary:#aeaeb2;--separator:#3c3c431f;--card-bg:#fff;--card-shadow:0 1px 3px #0000000f,0 4px 12px #0000000a;--card-shadow-hover:0 4px 16px #0000001a,0 8px 32px #0000000f;--glass-bg:#ffffffb8;--glass-blur:20px;--glass-border:#fff6;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--space-4xl:96px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:28px;--radius-pill:100px;--font:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;--fs-hero:56px;--fs-h1:40px;--fs-h2:28px;--fs-h3:22px;--fs-body:17px;--fs-callout:16px;--fs-subhead:15px;--fs-footnote:13px;--fs-caption:11px;--ease:cubic-bezier(.25,.1,.25,1);--duration:.3s}*{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font);font-size:var(--fs-body);color:var(--text-primary);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh;overflow-x:hidden}h1{font-size:var(--fs-h1);letter-spacing:-.02em;font-weight:700;line-height:1.15}h2{font-size:var(--fs-h2);letter-spacing:-.015em;font-weight:600;line-height:1.2}h3{font-size:var(--fs-h3);letter-spacing:-.01em;font-weight:600;line-height:1.3}.hero-text{font-size:var(--fs-hero);letter-spacing:-.03em;font-weight:800;line-height:1.05}.subhead{font-size:var(--fs-subhead);color:var(--text-secondary);line-height:1.5}.footnote{font-size:var(--fs-footnote);color:var(--text-tertiary)}.caption{font-size:var(--fs-caption);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.06em;font-weight:600}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-pill);font-family:var(--font);font-size:var(--fs-callout);cursor:pointer;transition:all var(--duration)var(--ease);white-space:nowrap;border:none;padding:12px 24px;font-weight:600;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{color:#fff;background:#1d1d1f}.btn-primary:hover{background:#333}.btn-secondary{color:#1d1d1f;background:#f2f2f7}.btn-secondary:hover{background:#e5e5ea}.btn-ghost{color:#1d1d1f;border:1.5px solid var(--separator);background:0 0}.btn-ghost:hover{background:var(--bg-secondary)}.btn-outline{color:#1d1d1f;background:0 0;border:1.5px solid #1d1d1f}.btn-outline:hover{color:#fff;background:#1d1d1f}.btn-lg{font-size:var(--fs-body);border-radius:var(--radius-pill);padding:16px 32px}.btn-sm{font-size:var(--fs-footnote);padding:8px 16px}.btn-icon{border-radius:50%;width:40px;height:40px;padding:0}.card{background:var(--card-bg);border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--card-shadow);border:1px solid var(--separator);transition:box-shadow var(--duration)var(--ease),transform var(--duration)var(--ease)}.card:hover{box-shadow:var(--card-shadow-hover);transform:translateY(-2px)}.card-flat{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:var(--space-lg);border:1px solid #0000}.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-lg)}.input{border:1.5px solid var(--separator);border-radius:var(--radius-md);width:100%;font-family:var(--font);font-size:var(--fs-callout);background:var(--bg);color:var(--text-primary);transition:border-color var(--duration)var(--ease),box-shadow var(--duration)var(--ease);outline:none;padding:12px 16px}.input:focus{border-color:#1d1d1f;box-shadow:0 0 0 3px #1d1d1f14}.input::placeholder{color:var(--text-tertiary)}.textarea{resize:vertical;min-height:100px;line-height:1.5}.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%236E6E73' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;padding-right:36px}.badge{border-radius:var(--radius-pill);font-size:var(--fs-caption);align-items:center;gap:4px;padding:4px 10px;font-weight:600;display:inline-flex}.badge-success{color:#1d1d1f;background:#e8e8ed}.badge-neutral{color:#6e6e73;background:#f2f2f7}.badge-gray{background:var(--bg-tertiary);color:var(--text-secondary)}.container{max-width:1200px;padding:0 var(--space-lg);margin:0 auto}.container-sm{max-width:800px;padding:0 var(--space-lg);margin:0 auto}.container-xs{max-width:600px;padding:0 var(--space-lg);margin:0 auto}.flex{display:flex}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-xs{gap:var(--space-xs)}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.gap-xl{gap:var(--space-xl)}.grid{display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media (max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}.text-center{text-align:center}.w-full{width:100%}.stage-nav{gap:var(--space-xs);padding:var(--space-md)0;border-bottom:1px solid var(--separator);scrollbar-width:none;display:flex;overflow-x:auto}.stage-nav::-webkit-scrollbar{display:none}.stage-pill{align-items:center;gap:var(--space-sm);border-radius:var(--radius-pill);font-size:var(--fs-footnote);white-space:nowrap;cursor:pointer;transition:all var(--duration)var(--ease);color:var(--text-secondary);background:0 0;border:1.5px solid #0000;padding:8px 16px;font-weight:600;display:flex}.stage-pill:hover{background:var(--bg-secondary)}.stage-pill.active{color:#fff;background:#1d1d1f;border-color:#1d1d1f}.stage-pill.completed{color:#1d1d1f;background:#e8e8ed;border-color:#d1d1d6}.stage-pill .stage-num{background:var(--bg-tertiary);width:22px;height:22px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.stage-pill.active .stage-num{color:#fff;background:#ffffff40}.stage-pill.completed .stage-num{color:#fff;background:#1d1d1f}.chat-container{flex-direction:column;height:calc(100vh - 200px);max-height:700px;display:flex}.chat-messages{padding:var(--space-lg)0;gap:var(--space-md);flex-direction:column;flex:1;display:flex;overflow-y:auto}.chat-bubble{border-radius:var(--radius-lg);max-width:80%;font-size:var(--fs-callout);animation:bubbleIn .3s var(--ease);padding:12px 16px;line-height:1.5}@keyframes bubbleIn{0%{opacity:0;transform:translateY(8px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.chat-bubble.agent{background:var(--bg-secondary);color:var(--text-primary);border-bottom-left-radius:4px;align-self:flex-start}.chat-bubble.user{color:#fff;background:#1d1d1f;border-bottom-right-radius:4px;align-self:flex-end}.chat-input-bar{gap:var(--space-sm);padding:var(--space-md)0;border-top:1px solid var(--separator);display:flex}.chat-input-bar input{flex:1}.chat-typing{align-self:flex-start;gap:4px;padding:12px 16px;display:flex}.chat-typing span{background:var(--text-tertiary);border-radius:50%;width:8px;height:8px;animation:1.2s infinite typing}.chat-typing span:nth-child(2){animation-delay:.2s}.chat-typing span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-6px)}}.name-card{border:2px solid var(--separator);border-radius:var(--radius-xl);padding:var(--space-xl);transition:all var(--duration)var(--ease);cursor:pointer}.name-card:hover{border-color:#1d1d1f;box-shadow:0 0 0 3px #1d1d1f0f}.name-card.selected{background:#1d1d1f05;border-color:#1d1d1f}.name-card .name-title{font-size:var(--fs-h2);margin-bottom:var(--space-sm);font-weight:700}.handle-grid{gap:var(--space-sm);grid-template-columns:repeat(3,1fr);display:grid}.handle-item{align-items:center;gap:var(--space-sm);border-radius:var(--radius-sm);background:var(--bg-secondary);font-size:var(--fs-footnote);padding:6px 10px;display:flex}.template-card{border:3px solid var(--separator);border-radius:var(--radius-2xl);transition:all var(--duration)var(--ease);cursor:pointer;overflow:hidden}.template-card:hover{box-shadow:var(--card-shadow-hover);border-color:#1d1d1f;transform:translateY(-4px)}.template-card.selected{border-color:#1d1d1f;box-shadow:0 0 0 4px #1d1d1f14}.template-preview{aspect-ratio:9/16;background:var(--bg-tertiary);justify-content:center;align-items:center;display:flex}.template-info{padding:var(--space-md)}.tabs{border-bottom:1px solid var(--separator);scrollbar-width:none;gap:0;display:flex;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}.tab{font-size:var(--fs-subhead);color:var(--text-secondary);cursor:pointer;white-space:nowrap;transition:all var(--duration)var(--ease);background:0 0;border:none;border-bottom:2px solid #0000;padding:12px 20px;font-weight:500}.tab:hover{color:var(--text-primary)}.tab.active{color:#1d1d1f;border-bottom-color:#1d1d1f;font-weight:600}.form-group{gap:var(--space-sm);flex-direction:column;display:flex}.form-label{font-size:var(--fs-subhead);color:var(--text-primary);font-weight:600}.form-hint{font-size:var(--fs-footnote);color:var(--text-tertiary)}.form-row{gap:var(--space-md);grid-template-columns:repeat(2,1fr);display:grid}@media (max-width:640px){.form-row{grid-template-columns:1fr}}.char-count{font-size:var(--fs-caption);color:var(--text-tertiary);text-align:right}.char-count.warn{color:var(--orange)}.char-count.over{color:var(--red)}.checklist-item{align-items:center;gap:var(--space-md);padding:12px var(--space-md);border-radius:var(--radius-md);transition:background var(--duration)var(--ease);display:flex}.checklist-item:hover{background:var(--bg-secondary)}.check-circle{border:2px solid var(--separator);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.check-circle.done{color:#fff;background:#1d1d1f;border-color:#1d1d1f}.check-circle.fail{color:#fff;background:#aeaeb2;border-color:#aeaeb2}.device-showcase{justify-content:center;align-items:flex-end;gap:var(--space-lg);padding:var(--space-3xl)0;display:flex}.device-frame{border-radius:var(--radius-lg);position:relative;overflow:hidden;box-shadow:0 20px 60px #00000026}.device-frame.imac{border:12px solid #1d1d1f;border-bottom-width:36px;border-radius:16px;width:420px}.device-frame.macbook{border:10px solid #1d1d1f;border-bottom:20px solid #333;border-radius:12px;width:360px}.device-frame.ipad{border:14px solid #1d1d1f;border-radius:20px;width:260px}.device-frame.iphone{border:8px solid #1d1d1f;border-radius:28px;width:140px}.device-frame img,.device-frame video{width:100%;display:block}@media (max-width:900px){.device-showcase{flex-wrap:wrap}.device-frame.imac{width:300px}.device-frame.macbook{width:260px}.device-frame.ipad{width:200px}.device-frame.iphone{width:120px}}.progress-bar{background:var(--bg-tertiary);border-radius:3px;height:6px;overflow:hidden}.progress-fill{height:100%;transition:width .5s var(--ease);background:#1d1d1f;border-radius:3px}.spinner{border:3px solid var(--bg-tertiary);border-top-color:#1d1d1f;border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.section{padding:var(--space-3xl)0}.section+.section{border-top:1px solid var(--separator)}.section-header{margin-bottom:var(--space-xl)}.section-header h2{margin-bottom:var(--space-sm)}.page-header{padding:var(--space-2xl)0 var(--space-lg)}.page-header h1{margin-bottom:var(--space-sm)}.page-header .subhead{max-width:600px}
