:root{--ink:#14231e;--muted:#657069;--paper:#f6f2e9;--panel:#fffdfa;--coral:#f0765f;--line:#d9ddd3;--dark:#173b31;--shadow:0 28px 70px rgba(25,52,44,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}button,textarea,input{font:inherit}.skip{position:fixed;left:-10000px;top:1rem;z-index:100;background:#fff;color:#000;padding:.8rem 1rem}.skip:focus{left:1rem}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,72px);border-bottom:1px solid rgba(20,35,30,.12)}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-size:1.35rem;font-weight:800;letter-spacing:-.04em}.brand sup{background:var(--coral);color:#fff;border-radius:20px;font-size:.52rem;letter-spacing:.04em;padding:3px 7px;margin-left:5px;vertical-align:top}.brand-mark{display:flex;align-items:flex-end;gap:2px;width:24px;height:30px;transform:rotate(-8deg)}.brand-mark i{display:block;background:var(--ink);border-radius:6px;width:4px}.brand-mark i:nth-child(1){height:17px}.brand-mark i:nth-child(2){height:26px}.brand-mark i:nth-child(3){height:29px}.brand-mark i:nth-child(4){height:22px}.top-meta{font-size:.76rem;text-transform:uppercase;letter-spacing:.12em;font-weight:750;color:var(--muted)}.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#4aa766;margin-right:8px;box-shadow:0 0 0 4px rgba(74,167,102,.12)}main{max-width:1440px;margin:auto}.intro{padding:clamp(58px,8vw,110px) clamp(20px,7vw,104px) 56px;position:relative}.intro:after{content:"";position:absolute;width:280px;height:280px;border:1px solid rgba(20,35,30,.08);border-radius:50%;right:6%;top:12%;box-shadow:0 0 0 46px rgba(20,35,30,.02),0 0 0 92px rgba(20,35,30,.015);pointer-events:none}.eyebrow,.section-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.17em;font-weight:800;color:var(--muted)}.eyebrow:before{content:"";display:inline-block;width:38px;height:2px;background:var(--coral);vertical-align:middle;margin-right:12px}.intro h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(3.3rem,7.2vw,7.4rem);line-height:.91;letter-spacing:-.065em;font-weight:500;margin:26px 0 30px;max-width:970px;position:relative;z-index:1}.intro h1 em{font-weight:400;color:var(--coral)}.lede{font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.65;max-width:750px;color:#526159}.notice{max-width:900px;margin-top:32px;display:flex;gap:14px;align-items:flex-start;padding:17px 20px;border:1px solid #dfd6c9;background:rgba(255,253,250,.58);border-radius:15px;color:#5f625c}.notice svg{width:22px;min-width:22px;fill:none;stroke:var(--coral);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.notice p{margin:0;font-size:.88rem}.studio{margin:0 clamp(14px,3vw,44px);display:grid;grid-template-columns:minmax(300px,.8fr) minmax(520px,1.35fr);background:var(--panel);border:1px solid rgba(20,35,30,.1);border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}.composer{padding:clamp(28px,4.5vw,62px);border-right:1px solid var(--line);display:flex;flex-direction:column}.section-label{display:flex;align-items:center;gap:12px}.section-label span{display:grid;place-items:center;width:29px;height:29px;border:1px solid #b8c2ba;border-radius:50%;font-size:.62rem}.composer>label{font-family:Georgia,serif;font-size:clamp(1.75rem,2.7vw,2.65rem);letter-spacing:-.04em;line-height:1.1;margin:42px 0 17px}.composer textarea{width:100%;resize:vertical;border:0;border-bottom:2px solid var(--ink);background:transparent;color:var(--ink);outline:0;padding:12px 0;font-size:1.08rem;line-height:1.5;min-height:95px}.composer textarea:focus{border-color:var(--coral)}.suggestions{display:flex;gap:7px;flex-wrap:wrap;margin:19px 0 34px}.suggestions button{border:1px solid #cfd5ce;border-radius:999px;background:#fff;color:#405048;padding:7px 11px;font-size:.74rem;cursor:pointer}.suggestions button:hover,.suggestions button:focus-visible{border-color:var(--dark);color:var(--dark)}.primary{border:0;background:var(--dark);color:#fff;border-radius:13px;min-height:58px;padding:0 18px 0 23px;display:flex;align-items:center;justify-content:space-between;font-weight:750;cursor:pointer;box-shadow:0 12px 24px rgba(23,59,49,.16);transition:.2s transform,.2s background}.primary:hover{transform:translateY(-2px);background:#205044}.primary svg{width:23px;fill:none;stroke:currentColor;stroke-width:1.8}.helper{font-size:.72rem;color:#7a817c;margin-top:18px;line-height:1.55}.stage-panel{min-width:0;background:#e6ede1;display:flex;flex-direction:column}.stage-head{padding:23px 27px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(20,35,30,.1)}.stage-head>div:first-child{display:flex;align-items:baseline;gap:12px}.stage-kicker{text-transform:uppercase;letter-spacing:.14em;font-size:.65rem;color:#5f7167;font-weight:800}.stage-head strong{font-size:.82rem}.stage-actions{display:flex;gap:8px}.stage-actions button{display:grid;place-items:center;width:37px;height:37px;border:1px solid rgba(20,35,30,.16);border-radius:50%;background:rgba(255,255,255,.46);cursor:pointer}.stage-actions button:hover{background:#fff}.stage-actions svg{width:17px;fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.avatar-stage{height:540px;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.82),rgba(255,255,255,0) 46%)}.ambient{position:absolute;border-radius:50%;filter:blur(1px);opacity:.5}.a1{width:130px;height:130px;background:#f5bd88;left:7%;top:17%}.a2{width:190px;height:190px;background:#b7d9ca;right:-5%;bottom:12%}.avatar{position:relative;width:min(100%,470px);height:100%;z-index:1;overflow:visible}.shadow{fill:rgba(20,35,30,.1)}.torso{fill:#294f43}.collar{fill:none;stroke:#8fb3a1;stroke-width:4;stroke-linecap:round}.neck,.face,.ear,.palm{fill:#b86f4d}.hair{fill:#17231f}.eye{fill:#18231f}.nose,.mouth,#brows path{fill:none;stroke:#442f28;stroke-width:4;stroke-linecap:round}.arm-line{stroke:#b86f4d;stroke-width:34;stroke-linecap:round}.joint{fill:#b86f4d}.finger{stroke:#a95f40;stroke-width:9;stroke-linecap:round;transition:.18s all}.limb,.limb>g,.hand,#head,#brows{transform-box:fill-box;transition:transform .42s cubic-bezier(.2,.8,.2,1)}.hand.fist .finger{opacity:.2}.current-sign{position:absolute;left:50%;bottom:23px;transform:translateX(-50%);z-index:2}.current-sign span{display:block;background:rgba(255,255,255,.87);backdrop-filter:blur(10px);border:1px solid rgba(20,35,30,.1);border-radius:999px;padding:8px 17px;font-size:.75rem;font-weight:800;letter-spacing:.04em;white-space:nowrap}.timeline-wrap{background:rgba(255,255,255,.72);padding:19px 27px 22px}.timeline{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:thin}.token{white-space:nowrap;padding:6px 10px;border-radius:8px;background:#edf0eb;color:#667169;font-size:.72rem;border:1px solid transparent}.token.known{color:#263f36}.token.active{background:var(--dark);color:#fff}.token.unknown{border-style:dashed;border-color:#b7b8b2}.progress{height:3px;background:#d6ddd6;border-radius:2px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:var(--coral);transition:width .2s}.speed-row{display:grid;grid-template-columns:auto 1fr 35px;align-items:center;gap:12px;margin-top:15px;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:#647068}.speed-row input{accent-color:var(--dark);width:100%}.speed-row output{text-align:right}.how{padding:clamp(85px,11vw,150px) clamp(20px,7vw,104px)}.how h2{font-family:Georgia,serif;font-weight:500;letter-spacing:-.04em;font-size:clamp(2.4rem,5vw,5rem);line-height:1.02;margin:35px 0 60px}.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #bfc7bf}.steps article{padding:28px 24px 10px 0;border-right:1px solid #cbd0c9;min-width:0}.steps article+article{padding-left:24px}.steps article:last-child{border:0}.steps b{font-family:Georgia,serif;color:var(--coral);font-size:1.5rem}.steps h3{font-size:.88rem;text-transform:uppercase;letter-spacing:.12em;margin:23px 0 12px}.steps p{color:#69736d;font-size:.87rem;margin:0;line-height:1.65}footer{border-top:1px solid rgba(20,35,30,.13);padding:25px clamp(20px,5vw,72px);display:flex;justify-content:space-between;color:#6d756f;text-transform:uppercase;letter-spacing:.1em;font-size:.65rem}@media(max-width:940px){.studio{grid-template-columns:1fr}.composer{border-right:0;border-bottom:1px solid var(--line)}.avatar-stage{height:500px}.steps{grid-template-columns:repeat(2,1fr)}.steps article:nth-child(2){border-right:0}.steps article:nth-child(n+3){border-top:1px solid #cbd0c9}}@media(max-width:600px){.topbar{height:66px}.top-meta{font-size:0}.top-meta .live-dot{margin:0}.intro{padding-top:52px}.intro h1{font-size:clamp(3rem,16vw,4.3rem)}.lede{font-size:1rem}.notice{padding:14px}.studio{margin:0 9px;border-radius:20px}.composer{padding:28px 21px}.composer>label{margin-top:30px}.stage-head{padding:18px}.stage-head>div:first-child{display:block}.stage-kicker{display:block;margin-bottom:3px}.avatar-stage{height:430px}.avatar{width:390px;max-width:112%}.timeline-wrap{padding:16px 18px 18px}.how{padding-top:90px}.steps{grid-template-columns:1fr}.steps article,.steps article+article{padding:25px 0;border-right:0;border-top:1px solid #cbd0c9}.steps article:first-child{border-top:0}.how h2 br{display:none}footer{gap:12px;align-items:flex-start;flex-direction:column}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.limb,.limb>g,.hand,#head,#brows{transition-duration:.01ms!important}}
/* Avatar 3D : Three.js + squelette humain glTF */
.avatar-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:2;opacity:0;transition:opacity .45s ease;touch-action:pan-y}.avatar-stage.three-ready .avatar-canvas{opacity:1}.legacy-avatar{display:none}.avatar-stage.three-fallback .legacy-avatar{display:block}.avatar-stage.three-fallback .avatar-canvas{display:none}.avatar-loader{position:absolute;z-index:4;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:#496057;font-size:.78rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.avatar-loader[hidden]{display:none}.avatar-loader i{width:34px;height:34px;border-radius:50%;border:3px solid rgba(23,59,49,.14);border-top-color:var(--dark);animation:avatar-spin .8s linear infinite}.current-sign{z-index:5}.ambient{z-index:1;pointer-events:none}@keyframes avatar-spin{to{transform:rotate(360deg)}}@media(max-width:600px){.avatar-canvas{min-height:430px}}@media(prefers-reduced-motion:reduce){.avatar-canvas{transition:none}.avatar-loader i{animation-duration:1.8s}}