:root{font-family:Space Grotesk,sans-serif;color:#233c3a;background:#edf3f0;font-synthesis:none;--muted: #586d67;--line: #d9e3de;--accent: #087d70}*{box-sizing:border-box}body{margin:0}button,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button,textarea{transition:background-color .18s ease-out,border-color .18s ease-out,color .18s ease-out}button:focus-visible,textarea:focus-visible{outline:3px solid #087d70;outline-offset:3px}::selection{background:#b5e4d3;color:#233c3a}h1,h2,p{margin:0}.app-shell{min-height:100dvh}.app-header{min-height:76px;padding:16px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:#233c3a;color:#fff}.brand{display:flex;align-items:center;gap:12px}.brand>svg{color:#b5e4d3}h1{font-size:20px;font-weight:700;letter-spacing:-.03em}h1 span{font-weight:400;color:#b9cec7}.brand p{margin-top:3px;font-size:11px;color:#b9cec7}.header-actions{display:flex;gap:10px}.button{min-height:44px;border-radius:7px;padding:11px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;font-size:13px;font-weight:600}.reset-button{background:transparent;color:#e2eee9;border-color:#5c756d}.reset-button:hover{background:#36524a}.export-button{background:#d3eddf;color:#233c3a}.export-button:hover{background:#b5e4d3}.header-actions button:focus-visible{outline-color:#b5e4d3}.header-actions button:disabled{opacity:.5}.workspace{padding:24px;display:grid;grid-template-columns:308px minmax(0,1fr);grid-template-areas:"controls canvas";gap:24px;min-height:calc(100dvh - 76px)}.controls{grid-area:controls;display:flex;flex-direction:column;padding:28px 24px 20px;background:#fff;border:1px solid var(--line);border-radius:12px}.pose-form{display:flex;flex-direction:column;gap:14px}.section-title{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600;letter-spacing:-.02em}.section-title svg{color:var(--accent)}.form-description{color:var(--muted);font-size:13px;line-height:1.6;margin-top:-7px}textarea{width:100%;min-height:120px;padding:14px;resize:vertical;color:#233c3a;background:#f8faf9;border:1px solid #b6c9bf;border-radius:7px;font-size:14px;line-height:1.6;caret-color:var(--accent)}textarea::placeholder{color:var(--muted)}textarea:disabled{opacity:.65}.prompt-examples{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.prompt-examples>span{margin-right:2px}.prompt-examples button{min-height:32px;padding:5px 8px;border:1px solid var(--line);background:#fff;border-radius:5px;font-size:11px;color:#435f55}.prompt-examples button:hover{background:#edf5f0;border-color:#a6c4b5}.primary{width:100%;justify-content:space-between;background:var(--accent);color:#fff}.primary:hover:not(:disabled){background:#05685d}.primary:disabled{background:#e2eae6;color:#586d67}.pose-status{min-height:36px;color:var(--muted);font-size:12px;line-height:1.6}.pose-status.has-message{background:#edf5f0;border-radius:7px;padding:10px 12px;color:#233c3a}.instructions{margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}.instructions h2{font-size:21px;letter-spacing:-.03em;font-weight:500;line-height:1.35;max-width:220px}.instructions>p{margin:24px 0 16px;font-size:12px;color:var(--muted)}.instruction{display:flex;gap:12px;margin-top:20px}.instruction>svg{margin-top:2px;color:var(--muted)}.instruction>div{display:flex;flex-direction:column;gap:5px}.instruction strong{font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px}.instruction span{font-size:12px;color:var(--muted)}.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%}.root-dot{background:#d85d44}.joint-dot{background:var(--accent)}.instructions .keyboard-help{font-size:12px;line-height:1.7;margin-top:24px}.sidebar-footer{margin-top:auto;padding-top:20px;display:flex;flex-direction:column;gap:5px}.sidebar-footer span:first-child{font-size:13px;font-weight:700;letter-spacing:.08em}.sidebar-footer span:last-child{font-size:10px;color:var(--muted)}.canvas-panel{grid-area:canvas;min-width:0;display:flex;flex-direction:column;background:#f8fcfa;border:1px solid var(--line);border-radius:12px;overflow:hidden}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;min-height:58px;padding:0 24px;border-bottom:1px solid var(--line);background:#fff}.canvas-toolbar h2{font-size:14px;font-weight:500}.view-label{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:7px}.view-label:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}.pose-canvas{flex:1;min-height:440px;position:relative;background-image:radial-gradient(#cddcd3 .8px,transparent .8px);background-size:24px 24px}.figure{display:block;position:absolute;width:100%;height:100%;overflow:hidden}.bone,.connector{pointer-events:none}.connector{opacity:.65}.joint{cursor:grab;outline:none}.joint:active{cursor:grabbing}.joint-circle{transition:stroke .15s ease-out,fill .15s ease-out}.joint:hover .joint-circle,.joint:focus-visible .joint-circle{stroke:var(--accent);stroke-width:4px;fill:#d3eddf}.joint-tooltip{opacity:0;pointer-events:none;transition:opacity .15s ease-out}.joint:hover .joint-tooltip,.joint:focus-visible .joint-tooltip,.joint.is-active .joint-tooltip{opacity:1}.canvas-footer{min-height:43px;padding:12px 24px;display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);background:#fff}.canvas-footer>span:first-child{display:flex;align-items:center;gap:7px}.canvas-data{font-variant-numeric:tabular-nums}.canvas-data span{margin:0 7px;color:#a0b3a9}.is-generating{opacity:.6}.spinner{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:800px){.app-shell{height:100dvh;display:flex;flex-direction:column}.workspace{flex:1;min-height:0}.controls{overflow:auto}.pose-canvas{min-height:0}}@media(max-width:799px){.app-header{padding:12px 16px;min-height:68px;gap:8px}.brand{gap:8px}.brand>svg{width:22px}h1{font-size:18px}h1 span{display:none}.brand p{font-size:9px;max-width:160px}.header-actions{gap:6px}.header-actions .button{padding:10px;font-size:11px}.reset-button span{display:none}.workspace{display:flex;flex-direction:column;gap:16px;padding:16px}.canvas-panel{flex:none}.canvas-toolbar{min-height:44px;padding:0 16px}.pose-canvas{flex:none;height:340px;min-height:0}.canvas-footer{padding:11px 14px;min-height:38px;font-size:10px}.canvas-data{display:none}.controls{padding:20px}.pose-form{gap:12px}textarea{min-height:80px;height:80px;font-size:16px;padding:10px 12px}.prompt-examples button{min-height:44px;font-size:12px;padding:8px 10px}.pose-status{min-height:0}.instructions{margin-top:20px;padding-top:20px}.instructions h2{max-width:none;font-size:18px}.instructions>p{margin:16px 0 12px}.sidebar-footer{padding-top:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
