.human-ui{--docchi-bg:#fbf9f3;--docchi-text:#232a32;--docchi-muted:#696c6a;--docchi-border:#dcdad1;--docchi-a:#ffd541;--docchi-b:#2869d8;--ink:var(--docchi-text);--muted:var(--docchi-muted);--line:var(--docchi-border);--a:var(--docchi-a);--b:var(--docchi-b);--radius:12px;--shadow:0 3px 0 var(--ink);min-height:100dvh;color:var(--ink);background:var(--docchi-bg);line-height:1.6}:is(html:has(.human-ui),body:has(.human-ui)){background:#fbf9f3}.human-ui button,.human-ui input,.human-ui select,.human-ui textarea{font:inherit}.human-ui :where(h1,h2,h3,p,strong){overflow-wrap:anywhere}.human-ui :where(button,a,input,summary,select,textarea):focus-visible{outline:3px solid var(--ink);outline-offset:4px}.human-ui .app-header{width:min(100% - 40px,920px);height:68px}.human-ui .mini-brand{gap:6px;min-height:44px;font-size:17px}.human-ui .mini-brand span{border-radius:6px;width:22px;height:24px}.human-ui .mini-brand span:first-child{transform:rotate(-8deg)}.human-ui .mini-brand span:last-child{transform:rotate(8deg)}.human-ui .connection-state{font-size:11px;font-weight:500}.human-ui .connection-state i{width:5px;height:5px;box-shadow:none;animation:none}.human-ui .connection-live i{background:var(--muted)}.human-ui .flow-shell,.human-ui .game-shell{width:min(100% - 40px,600px);padding:28px 0 max(40px, calc(env(safe-area-inset-bottom) + 24px))}.human-ui .step-heading{margin-bottom:30px}.human-ui .step-heading h1{letter-spacing:-.055em;margin:0 0 12px;font-size:clamp(30px,8.5vw,46px);font-weight:900;line-height:1.35}.human-ui .step-heading>p:last-child{font-size:14px;font-weight:500;line-height:1.85}.human-ui .eyebrow{color:var(--muted);font-size:12px}.human-ui .primary-button,.human-ui .secondary-button{border-radius:12px;min-height:56px;font-size:16px;font-weight:800}.human-ui .primary-button{padding:14px 20px;box-shadow:0 3px #10151b}.human-ui .primary-button:hover{transform:translateY(1px);box-shadow:0 2px #10151b}.human-ui .primary-button:active{box-shadow:none;transform:translateY(3px)}.human-ui .primary-button:disabled,.human-ui .primary-button:disabled:hover{color:var(--muted);box-shadow:none;opacity:1;background:#eeece5;transform:none}.human-ui .secondary-button{border:1px solid var(--line);box-shadow:none;background:0 0}.human-ui .secondary-button:hover{border-color:var(--ink);background:#f1efe7}.human-ui .text-button{border-radius:8px;min-height:44px;padding:10px 12px;font-size:13px;font-weight:600}.human-ui .small-button{border-radius:8px;min-height:44px;padding:9px 14px;font-size:13px}.human-ui .text-input{border:1px solid var(--line);background:#fffefa;border-radius:8px;min-height:52px;font-size:16px;font-weight:500}.human-ui .field-label{font-size:12px;font-weight:600}.human-ui .inline-error{text-align:left;font-weight:500;line-height:1.7}.human-ui .loading-dots i{background:var(--muted);animation:none}.human-ui .center-stage,.human-ui .compact-message{min-height:calc(100dvh - 68px)}.choice-pair{align-items:center;width:fit-content;padding:9px 8px 10px;display:flex}.choice-ticket{border:1.5px solid var(--ink);width:68px;height:82px;box-shadow:0 3px 0 var(--ink);border-radius:9px;flex-direction:column;justify-content:center;align-items:center;font-family:system-ui,sans-serif;font-size:38px;font-weight:850;line-height:1;display:flex}.choice-ticket small{letter-spacing:.04em;margin-top:8px;font-size:9px;font-weight:700}.ticket-a{background:var(--a);color:#232a32;transform:rotate(-9deg)}.ticket-b{background:var(--b);color:#fff;margin-top:10px;margin-left:-7px;transform:rotate(9deg)}.human-ui .web-lite-shell{max-width:440px;padding-top:20px}.human-ui .web-lite-heading{margin-bottom:20px;position:relative}.human-ui .web-lite-shell .play-style-option{min-height:74px;padding-block:11px}.human-ui .web-lite-heading h1{letter-spacing:-.06em;margin-bottom:16px;font-size:clamp(34px,9vw,46px);line-height:1.23}.human-ui .web-lite-heading>p:last-child{font-size:13px}.human-ui .web-lite-start{margin-top:24px}.play-style-picker{border:0;min-width:0;margin:0;padding:0}.play-style-picker legend{color:var(--muted);margin-bottom:10px;font-size:13px;font-weight:650}.play-style-option{border:1px solid #0000;border-bottom-color:var(--line);cursor:pointer;border-radius:2px;grid-template-columns:37px minmax(0,1fr) 22px;align-items:center;gap:11px;min-height:85px;padding:15px 14px;display:grid;position:relative}.play-style-option.is-selected{border-color:var(--ink);box-shadow:0 2px 0 var(--ink);background:#fffefa;border-radius:10px}.play-style-option+.play-style-option{margin-top:8px}.play-style-option input{opacity:0;width:1px;height:1px;position:absolute}.play-style-option:has(input:focus-visible){outline:3px solid var(--ink);outline-offset:4px}.play-style-symbol{text-align:center;color:var(--muted);font:800 32px/1 system-ui,sans-serif}.is-selected .play-style-symbol{color:var(--ink)}.play-style-copy strong,.play-style-copy small{display:block}.play-style-copy strong{font-size:16px;font-weight:800;line-height:1.5}.play-style-copy small{color:var(--muted);margin-top:3px;font-size:11px;font-weight:400}.play-style-check{visibility:hidden;color:#fff;background:var(--ink);border-radius:50%;place-items:center;height:22px;font-size:14px;display:grid}.is-selected .play-style-check{visibility:visible}.human-ui .invite-shell{max-width:500px;padding-top:24px}.human-ui .invite-shell>.step-heading{margin-bottom:12px}.human-ui .session-summary{gap:7px;margin:0 0 24px;font-size:12px;font-weight:400}.human-ui .session-summary strong{color:var(--muted);font-weight:550}.human-ui .invite-grid{border:0;grid-template-columns:1fr;justify-items:center;gap:22px;margin-top:28px;padding:0;display:grid}.human-ui .qr-wrap{border:1.5px solid var(--ink);width:228px;max-width:100%;box-shadow:3px 3px 0 var(--line);border-radius:8px;padding:15px}.human-ui .invite-details{gap:8px;width:100%}.human-ui .invite-share,.human-ui .invite-copy,.human-ui .invite-line{width:100%;min-height:46px;font-size:14px}.human-ui .guest-status{color:var(--muted);margin:22px 0 14px;font-size:12px;font-weight:500}.human-ui .guest-status i{width:6px;height:6px;box-shadow:none;background:#8b8e88}.human-ui .guest-status.is-ready{color:var(--ink)}.human-ui .guest-status.is-ready i{background:var(--ink)}.human-ui .invite-start:disabled{border:1px dashed var(--line);background:0 0}.human-ui .question-plan-panel{border:0;border-top:1px solid var(--line);margin:28px 0 0;padding:18px 0 0}.human-ui .question-plan-panel[hidden]{display:none}.human-ui .question-plan-heading strong{color:var(--muted);font-size:13px;font-weight:550}.human-ui .question-plan-heading .small-button{background:0 0}.human-ui .replace-question-button{color:var(--ink);font-weight:600}.human-ui .custom-question-label{color:var(--muted);background:#eeece5}.human-ui .question-plan-preview li strong{overflow-wrap:anywhere}.human-ui .custom-question-form{border:0;border-top:1px solid var(--line);background:0 0;border-radius:0;padding:15px 0}.human-ui .custom-question-form input{font-size:16px}.human-ui .custom-question-form input:focus{outline:2px solid var(--ink);border-color:var(--ink)}.human-ui .network-hint{font-size:11px;font-weight:400}.human-ui .join-shell{max-width:440px;padding-top:34px}.human-ui .join-shell .choice-pair{margin:0 0 28px}.human-ui .join-invitation{color:var(--muted);margin:0 0 12px;font-size:12px}.human-ui .join-shell .step-heading{margin-bottom:34px}.human-ui .join-shell form .primary-button{margin-top:20px}.human-ui .waiting-room{flex-direction:column;justify-content:center;align-items:center;padding-bottom:100px;display:flex}.human-ui .waiting-room h1{margin:22px 0 8px;font-size:30px}.human-ui .waiting-room>p{margin:0;font-size:13px;font-weight:400}.human-ui .code-shell{max-width:440px;padding-top:48px}.human-ui .code-input{font-size:28px}.human-ui.landing-page{flex-direction:column;min-height:100dvh;display:flex}.human-ui .landing-shell{width:min(100% - 40px,480px);min-height:0;padding:12px 0 max(24px, env(safe-area-inset-bottom));flex:1;justify-content:center;gap:16px}.human-ui .landing-mypage-link{min-height:44px;color:var(--ink);align-items:center;padding:0 2px;font-size:14px;font-weight:700;text-decoration:none;display:inline-flex}.human-ui .landing-mypage-link:hover{text-underline-offset:.2em;text-decoration:underline}.human-ui .landing-intro h1{letter-spacing:-.055em;margin:0;font-size:clamp(32px,9vw,46px);font-weight:900;line-height:1.18}.human-ui .landing-subtext{color:var(--muted);margin:6px 0 0;font-size:13px;font-weight:600}.human-ui .landing-play-modes{grid-template-columns:1fr;gap:14px;display:grid}.human-ui .landing-play-modes .landing-entry{flex-direction:column;display:flex}@media (width>=480px){.human-ui .landing-play-modes{grid-template-columns:1fr 1fr;align-items:start}}.human-ui .landing-personal{text-align:center;font-size:.875rem}.human-ui .landing-personal a{min-height:44px;color:var(--muted);text-underline-offset:.2em;align-items:center;display:inline-flex}.human-ui .landing-copy{margin:16px 0 0;font-size:14px;font-weight:500;line-height:1.8}.human-ui .landing-example{width:100%;max-width:360px;margin:0}.human-ui .landing-example figcaption,.human-ui .example-step{color:var(--muted);margin:0;font-size:12px;font-weight:500}.human-ui .landing-example h2{letter-spacing:-.04em;margin:4px 0 8px;font-size:27px}.human-ui .example-answers{justify-content:center;gap:24px;padding:14px 8px 0;display:flex}.human-ui .example-person{flex-direction:column;align-items:center;gap:14px;min-width:0;display:flex}.human-ui .landing-example .choice-ticket{width:clamp(110px,31vw,136px);height:108px;font-size:38px}.human-ui .landing-example .ticket-a{transform:rotate(-5deg)}.human-ui .landing-example .ticket-b{margin:0;transform:rotate(5deg)}.human-ui .landing-example .choice-ticket strong{margin-top:12px;font-size:14px;line-height:1.4}.human-ui .example-person-label{font-size:12px;font-weight:700}.human-ui .example-remark{margin:10px 24px 0 0;font-size:19px;font-weight:800;transform:rotate(-2deg)}.human-ui .example-reply{margin:4px 0 0 32px;font-size:15px}.human-ui .landing-demo{position:relative}.human-ui .demo-control{z-index:1;cursor:pointer;background:0 0;border:0;border-radius:8px;width:100%;position:absolute;inset:0}.human-ui .demo-control[hidden]{display:none}.human-ui .demo-description{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.human-ui .demo-stage{height:340px;position:relative}.human-ui .demo-invite-scene,.human-ui .demo-question-scene{transition:opacity .25s;position:absolute;inset:0 0 auto}.human-ui .demo-invite-scene,.human-ui .demo-static-invite{opacity:0}.human-ui [data-scene=invite] .demo-invite-scene{opacity:1}.human-ui [data-scene=invite] .demo-question-scene{opacity:0}.human-ui .demo-invite-phones{justify-content:center;align-items:center;gap:26px;margin:14px 0 10px;display:flex}.human-ui .demo-phone{border:2px solid var(--ink);width:96px;height:140px;box-shadow:0 3px 0 var(--ink);background:var(--docchi-bg);border-radius:13px;flex-direction:column;justify-content:center;align-items:center;padding:9px 5px;display:flex;position:relative}.human-ui .demo-phone:before,.human-ui .demo-phone:after{content:"";background:var(--ink);border-radius:2px;width:16px;height:2px;position:absolute;left:calc(50% - 8px)}.human-ui .demo-phone:before{top:6px}.human-ui .demo-phone:after{bottom:6px}.human-ui .demo-phone small{color:var(--muted);margin-top:7px;font-size:11px}.human-ui .demo-qr{flex-shrink:0;width:78px;height:78px;display:block}.human-ui .demo-phone-host{transform:rotate(-5deg)}.human-ui .demo-phone-guest{transform:rotate(5deg)}.human-ui .demo-phone-brand{font-size:16px;font-weight:900}.human-ui .demo-join-state{color:var(--muted);margin-block:14px;font-size:9px}.human-ui [data-phase=joined] .demo-join-state{color:var(--ink);font-size:12px;font-weight:700}.human-ui .demo-human-scene{max-width:300px;height:112px;margin-inline:auto;position:absolute;inset:auto 0 0}.human-ui .demo-people{width:100%;height:112px;display:block}.human-ui .demo-paper{fill:var(--docchi-bg)}.human-ui .demo-shirt-a{fill:var(--a)}.human-ui .demo-shirt-b{fill:var(--b)}.human-ui .demo-head-left{transform-origin:52px 69px;transition:transform .25s;transform:rotate(8deg)}.human-ui .demo-head-right{transform-origin:248px 69px;transition:transform .25s;transform:rotate(-8deg)}.human-ui .demo-held-phone{transition:transform .25s}.human-ui :is([data-phase=conversation],[data-phase=overview]) .demo-held-phone{transform:translateY(9px)}.human-ui :is([data-phase=conversation],[data-phase=overview]) :is(.demo-head-left,.demo-head-right){transform:rotate(0)}.human-ui .demo-speech{width:184px;position:absolute;top:0;left:50%;transform:translate(-50%)}.human-ui .demo-speech .example-remark{margin:0;font-size:14px}.human-ui .demo-speech .example-reply{margin:4px 0 0 12px;font-size:12px}.human-ui .demo-static-invite{text-align:left;justify-content:center;align-items:center;gap:9px;font-size:11px;display:flex;position:absolute;top:0;left:0;right:0}.human-ui .demo-static-invite .demo-qr{width:44px;height:44px}.human-ui [data-scene=overview] .demo-static-invite{opacity:1}.human-ui [data-scene=overview] .demo-question-scene{top:48px}.human-ui [data-scene=overview] .choice-ticket{height:80px;font-size:30px}.human-ui [data-scene=overview] .demo-prompt{display:none}.human-ui .landing-demo .choice-ticket{transition:box-shadow .25s;position:relative}.human-ui .landing-demo [data-selected=true] .choice-ticket{box-shadow:0 3px 0 var(--ink), 0 0 0 2px var(--docchi-bg), 0 0 0 3px var(--ink)}.human-ui .demo-check{font-size:16px;font-style:normal;position:absolute;top:8px;right:8px}.human-ui .demo-check,.human-ui .demo-selection,.human-ui .demo-reveal,.human-ui .demo-reply{opacity:0;transition:opacity .25s}.human-ui [data-selected=true] .demo-check,.human-ui [data-selected=true] .demo-selection,.human-ui [data-phase=reveal] .demo-reveal,.human-ui [data-phase=conversation] .demo-reveal,.human-ui [data-phase=conversation] .demo-reply,.human-ui [data-phase=overview] .demo-reveal,.human-ui [data-phase=overview] .demo-reply{opacity:1}@media (prefers-reduced-motion:reduce){.human-ui .landing-demo .demo-invite-scene{opacity:0}.human-ui .landing-demo .demo-static-invite,.human-ui .landing-demo .demo-question-scene{opacity:1}.human-ui .landing-demo .demo-question-scene{top:48px}.human-ui .landing-demo .choice-ticket{height:80px;font-size:30px}.human-ui .landing-demo .demo-prompt{display:none}.human-ui .landing-demo :is(.demo-head-left,.demo-head-right){transform:rotate(0)}.human-ui .landing-demo .demo-held-phone{transform:translateY(9px)}.human-ui .landing-demo .demo-check,.human-ui .landing-demo .demo-selection,.human-ui .landing-demo .demo-reveal,.human-ui .landing-demo .demo-reply{opacity:1}.human-ui .demo-control{visibility:hidden}}.human-ui .landing-actions{gap:14px}.human-ui .landing-entry .primary-button{width:100%}.human-ui .landing-footnote{color:var(--muted);margin:6px 0 0;font-size:12px}@media (width>=820px){.human-ui .landing-shell{text-align:left;grid-template-rows:auto auto;grid-template-columns:1fr 360px;align-content:center;align-items:start;gap:32px 64px;width:min(100% - 96px,900px);padding-block:60px;display:grid}.human-ui .landing-intro h1{font-size:56px}.human-ui .landing-example{text-align:center;grid-area:1/2/3;align-self:center}.human-ui .landing-actions{text-align:center;grid-column:1;max-width:300px}.human-ui .landing-play-modes{max-width:460px}}.human-ui .brand-choice{box-shadow:0 3px 0 var(--ink);border-radius:12px}@media (width>=760px){.human-ui .web-lite-shell{padding-top:38px}.human-ui .web-lite-heading h1{max-width:290px;font-size:46px}.human-ui .invite-shell{padding-top:36px}.human-ui .qr-wrap{width:260px}}@media (width<=360px){.human-ui .flow-shell,.human-ui .game-shell,.human-ui .app-header{width:calc(100% - 32px)}.human-ui .web-lite-heading h1{font-size:37px}.play-style-option{grid-template-columns:28px minmax(0,1fr) 20px;gap:8px;padding-inline:10px}.play-style-copy strong{font-size:15px}.play-style-copy small{font-size:10px}.human-ui .question-plan-preview li{grid-template-columns:1fr;gap:0}.human-ui .question-plan-preview li>button,.human-ui .question-plan-preview li>.preview-question-actions,.human-ui .question-plan-preview li>.custom-preview-actions{justify-self:end}}@media (prefers-reduced-motion:reduce){.human-ui *,.human-ui :before,.human-ui :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
