/* Kinelo product Design OS: calm operational surfaces, Pretendard, a single muted forest action.
   Separate research prototype; no unapproved company logo or claim of clinical validation. */
:root {
  --surface-background:#f5f7f6;
  --surface-card:#fff;
  --surface-subtle:#f0f3f1;
  --surface-stage:#e9eeeb;
  --text-primary:#14231f;
  --text-secondary:#56635e;
  --text-tertiary:#65706c;
  --border-primary:#e6ebe8;
  --border-strong:#d5ddd9;
  --product-primary:#205c53;
  --product-primary-hover:#17453e;
  --product-primary-soft:#eaf3ef;
  --focus-ring:#366f65;
  --warning:#8a5a12;
  --font-sans:'Pretendard Variable','Pretendard','Apple SD Gothic Neo','Noto Sans KR',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --font-mono:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{font-size:14px;-webkit-font-smoothing:antialiased}
body{margin:0;background:var(--surface-background);font-family:var(--font-sans);font-size:14px;line-height:1.55;color:var(--text-primary)}
a{color:inherit}button,input,textarea,select{font:inherit}button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
[hidden],.tab-pane[hidden],.source-row[hidden],.hand-action[hidden]{display:none!important}
.site-header{height:67px;border-bottom:1px solid var(--border-primary);background:var(--surface-card)}
.site-header__inner{max-width:1680px;margin:auto;padding:0 35px;height:100%;display:flex;align-items:center;justify-content:space-between;gap:22px}
.wordmark{display:inline-flex;align-items:center;gap:15px;text-decoration:none;font-size:21px;font-weight:740;letter-spacing:-.055em;white-space:nowrap}
.wordmark__divider{width:1px;height:23px;background:var(--border-strong)}
.wordmark__sub{font-size:13px;letter-spacing:-.01em;font-weight:540;color:var(--text-secondary)}
.header-meta{display:flex;align-items:center;gap:25px;font-size:12px;color:var(--text-secondary)}
.header-meta__scope{position:relative;padding-left:12px}.header-meta__scope::before{content:'';position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:50%;background:var(--product-primary)}
.header-meta a{text-decoration:none;border-bottom:1px solid var(--border-strong);padding:3px 0}.header-meta a:hover{color:var(--product-primary)}
.app-shell{max-width:1680px;margin:0 auto;padding:0 35px}
.page-intro{min-height:166px;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:27px 0 22px}
.section-index,.section-label{margin:0;color:var(--text-tertiary);font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.section-index{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--product-primary)}
.page-intro h1{margin:8px 0 7px;font-size:clamp(25px,2.3vw,35px);line-height:1.3;letter-spacing:-.052em;font-weight:720}
.intro-sub{margin:0;font-size:13px;color:var(--text-secondary);max-width:560px;word-break:keep-all}
.intro-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;flex-shrink:0}
.button{min-height:40px;border:1px solid var(--border-strong);background:#fff;color:var(--text-primary);border-radius:7px;padding:9px 13px;font-size:12px;font-weight:630;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;transition:background-color .16s,border-color .16s,color .16s}
.button:hover{border-color:#a5b5af;background:#f9fbfa}.button:disabled{cursor:not-allowed;opacity:.52}
.button--primary,.button.primary{background:var(--product-primary);border-color:var(--product-primary);color:white}.button--primary:hover,.button.primary:hover{background:var(--product-primary-hover);color:white}
.button--secondary,.button.secondary{background:var(--product-primary-soft);border-color:#cbdcd4;color:var(--product-primary)}.button--secondary:hover,.button.secondary:hover{background:#d9e8e1}
.button--quiet{background:transparent}.button--tool{border-color:transparent;background:transparent;color:var(--text-secondary);padding:7px 10px}.button--tool:hover{border-color:var(--border-strong);background:#f4f7f5}
.button--full{width:100%}
.mode-nav{min-height:48px;display:flex;align-items:stretch;gap:28px;border-bottom:1px solid var(--border-strong);margin-bottom:17px}
.mode-nav__item{position:relative;display:flex;align-items:center;gap:9px;padding:0 2px 13px;border:0;background:transparent;color:var(--text-secondary);font-weight:600;font-size:13px;white-space:nowrap}
.mode-nav__item[aria-pressed=true]{color:var(--text-primary)}.mode-nav__item[aria-pressed=true]::after{position:absolute;content:'';height:2px;left:0;right:0;bottom:-1px;background:var(--product-primary)}
.mode-nav__number{color:#8b9691;font-size:10px;font-family:var(--font-mono)}.mode-nav__detail{color:var(--text-tertiary);font-size:11px;font-weight:430}
.mode-nav__aside{margin-left:auto;color:var(--text-tertiary);font-size:11px;align-self:center;padding-bottom:11px}
.workspace{display:grid;grid-template-columns:minmax(190px,226px) minmax(0,1fr) minmax(272px,308px);min-height:675px;background:var(--surface-card);border:1px solid var(--border-primary);border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(15,36,29,.025)}
.panel{min-width:0;background:#fff}.panel--context{border-right:1px solid var(--border-primary);display:flex;flex-direction:column}.panel--inspector{border-left:1px solid var(--border-primary);padding:24px 22px 20px;min-width:0}
.panel-section{padding:23px 21px 20px;border-bottom:1px solid var(--border-primary)}.panel-section--intro{padding-top:29px}.panel-section--source{margin-top:auto;border-bottom:0;padding-bottom:22px;background:var(--surface-card)}
.model-name{margin:9px 0 1px;font-size:28px;line-height:1.15;letter-spacing:-.055em;font-weight:710}.model-vendor{color:var(--text-secondary);margin:7px 0 22px;font-size:11px}
.model-numbers{display:flex;gap:0;padding-top:14px;border-top:1px solid var(--border-primary)}.model-numbers>div{flex:1;display:flex;flex-direction:column;gap:0}.model-numbers>div+div{border-left:1px solid var(--border-primary);padding-left:20px}.model-numbers strong{font:650 25px/1.25 var(--font-mono);letter-spacing:-.075em}.model-numbers span{font-size:11px;color:var(--text-tertiary)}
.section-title{font-size:12px;letter-spacing:-.015em;font-weight:720;margin:0 0 14px}
.method-list{display:grid;gap:15px}.method-list>div{display:flex;align-items:flex-start;gap:12px}.method-list__index{font:10px var(--font-mono);color:#7c8982;margin-top:3px}.method-list strong{display:block;font-size:12px;font-weight:630}.method-list p{margin:2px 0 0;font-size:11px;color:var(--text-secondary)}
.toggle{display:flex;align-items:center;gap:10px;margin:11px 0;color:var(--text-secondary);font-size:12px;min-height:25px}.toggle input{accent-color:var(--product-primary);width:15px;height:15px;cursor:pointer}
.panel-section--source>p:not(.section-label){font-size:11px;color:var(--text-secondary);margin:8px 0 5px}.panel-section--source a{font-size:11px;font-weight:620;color:var(--product-primary);text-underline-offset:3px}.panel-section--source .provenance-note{line-height:1.55;margin-top:15px!important;padding-top:12px;border-top:1px solid var(--border-primary);font-size:10px!important}
.viewer-shell{display:flex;flex-direction:column;min-width:0;overflow:hidden}.viewer-bar{height:59px;border-bottom:1px solid var(--border-primary);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 24px}
.viewer-bar__prefix{font:10px var(--font-mono);color:var(--text-tertiary);letter-spacing:.04em;margin-right:11px}.viewer-bar strong{font-size:12px;font-weight:670;letter-spacing:-.01em}
.display-status{font-size:11px;color:var(--text-secondary);display:flex;align-items:center;gap:8px;white-space:nowrap}.status-dot{width:7px;height:7px;flex-shrink:0;border-radius:50%;background:#a7b0ab}.display-status.loaded .status-dot{background:var(--product-primary)}
.stage{position:relative;flex:1;min-height:520px;background:var(--surface-stage);overflow:hidden}.stage canvas{display:block;width:100%;height:100%}
.corner-title{position:absolute;top:22px;left:24px;pointer-events:none;display:flex;flex-direction:column;gap:2px}.corner-title b{font:610 10px var(--font-mono);letter-spacing:.05em;color:#48564f}.corner-title span{font-size:11px;color:#6e7a72}
.axis-legend{position:absolute;bottom:19px;left:24px;right:24px;display:flex;gap:14px;flex-wrap:wrap;pointer-events:none}.legend-chip{font:10px var(--font-mono);color:#65716b}.legend-chip + .legend-chip:before{content:'·';margin-right:14px}
.stage .loading-overlay{position:absolute;inset:0;z-index:5;display:flex;justify-content:center;align-items:center;pointer-events:none;background:rgba(233,238,235,.85)}.stage .loading-overlay[hidden]{display:none!important}
.loading-card{width:min(350px,85%);padding:24px 23px;border-radius:8px;background:#fff;border:1px solid var(--border-primary);box-shadow:0 12px 36px rgba(21,45,33,.09);text-align:left;pointer-events:auto}.loading-card strong{font-size:14px;font-weight:700}.loading-card p{font-size:12px;color:var(--text-secondary);margin:7px 0 0}.loading-card a{color:var(--product-primary);font-size:12px}.progress{height:3px;width:100%;background:var(--border-primary);overflow:hidden;margin:18px 0 9px}.progress>div{height:100%;width:36%;background:var(--product-primary);animation:loading-bar 1.5s ease-in-out infinite alternate}@keyframes loading-bar{from{transform:translateX(-40%)}to{transform:translateX(230%)}}
.hint{font-size:11px;color:var(--text-tertiary)}
.viewer-bottom{padding:9px 16px;border-top:1px solid var(--border-primary);min-height:59px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:#fff}.controls{display:flex;align-items:center;gap:3px;flex-wrap:wrap}
.inspector-head{padding-bottom:19px}.inspector-head h2{font-size:18px;letter-spacing:-.04em;margin:7px 0 0;font-weight:680}
.right-tabbar{display:grid;grid-template-columns:1fr 1fr;margin:0 0 19px;border-bottom:1px solid var(--border-primary)}.right-tabbar button{font:630 12px var(--font-sans);border:0;background:none;color:var(--text-secondary);padding:0 0 13px;position:relative}.right-tabbar button.active{color:var(--product-primary)}.right-tabbar button.active::after{content:'';position:absolute;bottom:-1px;height:2px;left:0;right:0;background:var(--product-primary)}
.preset-heading{display:flex;justify-content:space-between;gap:9px;margin:6px 0 9px;align-items:baseline}.preset-heading__note{font-size:10px;color:var(--text-tertiary)}
.presetgrid{display:flex;flex-direction:column;border-top:1px solid var(--border-primary)}.preset{position:relative;width:100%;border:0;border-bottom:1px solid var(--border-primary);background:#fff;padding:12px 11px 12px 0;text-align:left;display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:52px}.preset strong{font-size:12px;font-weight:570}.preset small{font-size:10px;color:var(--text-tertiary);white-space:nowrap}.preset:hover{background:#f8faf9}.preset.active{color:var(--product-primary);box-shadow:inset 2px 0 var(--product-primary);padding-left:11px;background:#f6faf8}.preset.active strong{font-weight:720}
.joint-header{margin:22px 0 7px;display:flex;justify-content:space-between;gap:6px;align-items:baseline}.joint-header strong{font-size:12px;font-weight:720}.joint-header span{font-size:10px;color:var(--text-tertiary)}
.joint-scroll{overflow:auto;max-height:275px;border-top:1px solid var(--border-primary);padding-right:6px}details.finger{border-bottom:1px solid var(--border-primary);padding:2px 0}details.finger summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px;font-weight:620;padding:10px 0;list-style:none}details.finger summary::-webkit-details-marker{display:none}.dot{width:6px;height:6px;border-radius:50%;background:var(--product-primary)!important}.finger .count{margin-left:auto;font:10px var(--font-mono);font-weight:400;color:var(--text-tertiary)}.joint-row{padding:7px 0 11px}.joint-row .row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:4px}.joint-row label{font-size:11px;color:var(--text-secondary)}.joint-row output{font:11px var(--font-mono);color:var(--product-primary)}.joint-row input[type=range]{width:100%;accent-color:var(--product-primary);cursor:pointer}.inspector-footnote{font-size:11px;color:var(--text-tertiary);margin:14px 0 0;line-height:1.65;word-break:keep-all}
.review-disclaimer{margin:5px 0 13px;color:var(--text-secondary);font-size:12px}.review-disclaimer--border{margin:18px 0;border-top:1px solid var(--border-primary);padding-top:13px;font-size:11px;color:var(--text-tertiary)}
.field-title{display:block;font-size:12px;font-weight:650;margin:18px 0 7px}.field-select,.note-area{display:block;width:100%;background:#fff;border:1px solid var(--border-strong);border-radius:7px;font-size:13px;color:var(--text-primary);padding:11px 12px;min-height:44px}.note-area{resize:vertical;min-height:120px;line-height:1.6}
.body-catalog{border:1px solid var(--border-primary);border-radius:10px;overflow:hidden;background:#fff}
.catalog-intro{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:29px 34px;border-bottom:1px solid var(--border-primary)}.catalog-intro h2{font-size:24px;letter-spacing:-.045em;margin:8px 0 7px}.catalog-intro p:not(.section-label){font-size:12px;color:var(--text-secondary);margin:0;line-height:1.6}.catalog-intro__meta{text-align:right;display:flex;flex-direction:column;white-space:nowrap}.catalog-intro__meta strong{font:600 30px/1.2 var(--font-mono)}.catalog-intro__meta span{font-size:11px;color:var(--text-tertiary)}
.catalog-workspace{display:grid;grid-template-columns:minmax(180px,226px) minmax(0,1fr)}.catalog-sidebar{border-right:1px solid var(--border-primary);padding:28px 21px}.catalog-sidebar h3{font-size:13px;font-weight:700;margin:0 0 16px}.catalog-filters{display:grid;gap:2px}.catalog-filter{background:none;border:0;border-radius:6px;display:flex;align-items:center;justify-content:space-between;padding:10px 11px;font-size:12px;color:var(--text-secondary);text-align:left;min-height:41px}.catalog-filter span{font:11px var(--font-mono);color:var(--text-tertiary)}.catalog-filter:hover{background:#f6f8f7}.catalog-filter[aria-pressed=true]{background:var(--product-primary-soft);color:var(--product-primary);font-weight:650}
.catalog-sidebar__note{margin-top:35px;padding-top:18px;border-top:1px solid var(--border-primary)}.catalog-sidebar__note strong{font-size:12px}.catalog-sidebar__note p{font-size:11px;color:var(--text-secondary);line-height:1.7;margin:7px 0}
.catalog-list{padding:0 29px}.source-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:start;gap:20px;padding:26px 3px 27px;border-bottom:1px solid var(--border-primary)}.source-row:last-child{border-bottom:0}.source-row__num{font:12px var(--font-mono);color:#9ca6a1;margin-top:2px}.source-row__top{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-bottom:8px}.source-category{font:10px var(--font-mono);color:var(--text-tertiary);letter-spacing:.045em}.source-license{font-size:10px;color:var(--product-primary);background:var(--product-primary-soft);padding:3px 7px;border-radius:3px}.source-license--restricted{color:var(--warning);background:#faf3e5}.source-row h3{font-size:17px;font-weight:670;letter-spacing:-.025em;margin:0 0 7px}.source-row p{font-size:12px;color:var(--text-secondary);margin:0 0 10px;line-height:1.7;max-width:720px;word-break:keep-all}.source-row__meta{font-size:11px;color:var(--text-tertiary)}.source-row__meta span{padding:0 6px}.source-row__link{font-size:11px;font-weight:670;color:var(--product-primary);white-space:nowrap;text-underline-offset:4px;margin-top:29px}.catalog-caution{border-top:1px solid var(--border-primary);background:#fafbf9;margin:0;padding:14px 30px;font-size:11px;color:var(--text-secondary);line-height:1.7}.catalog-caution strong{color:var(--text-primary)}
.site-footer{margin-top:18px;padding:0 0 32px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;color:var(--text-tertiary);font-size:10px}.site-footer a{text-underline-offset:3px;text-decoration-color:var(--border-strong)}
@media (max-width:1200px){.app-shell{padding:0 23px}.site-header__inner{padding:0 23px}.workspace{grid-template-columns:192px minmax(0,1fr) 280px}.panel-section{padding-left:16px;padding-right:16px}.panel--inspector{padding:20px 16px}.stage{min-height:510px}.viewer-bottom{padding:9px 10px}.mode-nav{margin-bottom:14px}}
@media (max-width:980px){.workspace{grid-template-columns:minmax(170px,220px) minmax(0,1fr)}.panel--inspector{grid-column:1/-1;border-left:0;border-top:1px solid var(--border-primary)}.panel--inspector .tab-pane{max-width:730px}.joint-scroll{max-height:220px}.presetgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:15px}.page-intro{min-height:140px}}
@media (max-width:690px){.app-shell{padding:0 12px}.site-header{height:59px}.site-header__inner{padding:0 17px}.wordmark{font-size:18px}.wordmark__sub{font-size:11px}.header-meta__scope{display:none}.header-meta{font-size:11px}.page-intro{align-items:flex-start;flex-direction:column;gap:13px;padding:24px 4px 15px}.page-intro h1{font-size:25px}.intro-sub{font-size:12px}.intro-actions{width:100%}.intro-actions .button{flex:1}.mode-nav{gap:17px;min-height:46px;padding:0 5px}.mode-nav__detail,.mode-nav__aside{display:none}.workspace{display:flex;flex-direction:column;min-height:0}.viewer-shell{order:0}.panel--inspector{order:1}.panel--context{order:2;border-right:0;border-top:1px solid var(--border-primary)}.panel-section{padding:20px}.panel-section--intro{padding-top:20px}.panel--inspector{padding:22px 19px}.stage{min-height:390px;flex:auto;height:390px}.viewer-bar{height:52px;padding:0 17px}.corner-title{top:16px;left:17px}.axis-legend{left:17px;right:17px;bottom:14px}.viewer-bottom{gap:4px;padding:8px 9px}.button--tool{min-height:38px;padding:7px 9px}.model-numbers{max-width:270px}.catalog-intro{padding:23px 18px;align-items:flex-start}.catalog-intro h2{font-size:22px}.catalog-intro__meta{display:none}.catalog-workspace{display:flex;flex-direction:column}.catalog-sidebar{padding:14px 17px;border-right:0;border-bottom:1px solid var(--border-primary)}.catalog-sidebar h3{margin-bottom:9px}.catalog-filters{display:flex;flex-wrap:wrap;gap:6px}.catalog-filter{border:1px solid var(--border-primary);padding:8px 10px}.catalog-sidebar__note{display:none}.catalog-list{padding:0 17px}.source-row{grid-template-columns:20px minmax(0,1fr);gap:13px;padding:22px 0}.source-row__link{grid-column:2;margin-top:0}.source-row h3{font-size:15px}.catalog-caution{padding:13px 16px}.site-footer{padding:0 5px 25px}}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media (max-width:690px){.field-select,.note-area{font-size:16px}.catalog-filter{min-height:44px}}

/* G1 research motion workspace: one primary renderer, bounded playback, no ornamental cards. */
.body-viewer-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);border-bottom:1px solid var(--border-primary)}
.body-model-area{min-width:0;border-right:1px solid var(--border-primary);display:flex;flex-direction:column}
.body-stage{min-height:510px;height:510px;flex:none}
.body-joint-inspector{min-width:0;padding:22px 20px 19px}
.body-joint-scroll{max-height:435px}
.body-timeline{border-top:1px solid var(--border-primary);padding:20px 24px 24px}
.body-timeline-head{display:flex;align-items:center;justify-content:space-between;gap:14px}
.body-timeline-head h3{margin:5px 0 0;font-size:15px;font-weight:660;letter-spacing:-.02em}
.body-small-count{font:12px var(--font-mono);color:var(--text-secondary);white-space:nowrap}
.body-data-note{font-size:11px;color:var(--text-secondary);margin:9px 0;line-height:1.6;word-break:keep-all}
.body-timeline-range{width:100%;height:24px;accent-color:var(--product-primary);cursor:pointer;margin:13px 0 7px}
.body-playback-controls{display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.body-timecode{font:13px var(--font-mono);color:var(--text-primary)}
.body-frame{font:11px var(--font-mono);color:var(--text-tertiary)}
.body-speed{margin-left:auto;display:flex;gap:7px;align-items:center;font-size:11px;color:var(--text-secondary)}
.body-speed select{border:1px solid var(--border-strong);padding:7px 8px;border-radius:5px;background:white;color:var(--text-primary)}
.body-observation-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-block:1px solid var(--border-primary);margin-top:20px;padding:13px 0}
.body-observation-values>div{display:flex;gap:4px;flex-direction:column;padding:0 13px}
.body-observation-values>div:first-child{padding-left:0}
.body-observation-values>div+div{border-left:1px solid var(--border-primary)}
.body-observation-values span{font-size:10px;color:var(--text-secondary)}
.body-observation-values strong{font:650 16px var(--font-mono)}
.body-local-input{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:10px}
.body-local-input input{position:absolute;inline-size:1px;block-size:1px;opacity:0;overflow:hidden;clip-path:inset(50%)}
.body-local-input span{font-size:10px;color:var(--text-tertiary)}
.body-local-input label{cursor:pointer}
.body-provenance{border-top:1px solid var(--border-primary);margin-top:23px;padding-top:17px;display:flex;flex-direction:column;gap:9px}
.body-provenance a{font-size:11px;color:var(--product-primary);text-underline-offset:3px}
.body-provenance p:not(.section-label){font-size:11px;color:var(--text-secondary);line-height:1.65;margin:3px 0 0}
@media(max-width:980px){.body-viewer-workspace{grid-template-columns:minmax(0,1fr)}.body-model-area{border-right:0}.body-joint-inspector{border-top:1px solid var(--border-primary)}.body-joint-scroll{max-height:255px}}
@media(max-width:690px){.body-stage{min-height:410px;height:410px}.body-timeline{padding:16px}.body-playback-controls{gap:9px}.body-observation-values strong{font-size:14px}.body-observation-values>div{padding:0 8px}.body-joint-inspector{padding:20px 17px}.body-local-input label{min-height:44px}}
/* Kinelo Design OS: compact source selection, no decorative tiles. */
.body-source-picker{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0;color:var(--text-secondary);font-size:12px}
.body-source-picker label{font-weight:650;color:var(--text-primary);white-space:nowrap}
.body-source-picker select{flex:1 1 265px;min-width:0;min-height:39px;border:1px solid var(--border-strong);border-radius:7px;padding:6px 11px;color:var(--text-primary);background:var(--surface-card)}
.body-source-picker span{flex:0 1 100%;font-size:11px;color:var(--text-tertiary)}

/* Joint workbench ? direct link manipulation + calm Kinelo Design OS hierarchy. */
.page-intro{min-height:126px;padding:15px 0 18px}
.page-intro h1{font-size:clamp(24px,2.15vw,31px);line-height:1.25}
.workspace{box-shadow:none}
.stage{isolation:isolate}
.stage canvas{touch-action:none;outline-offset:-4px}
.stage canvas:focus-visible{outline:2px solid var(--focus-ring)}
.stage canvas.joint-dragging{cursor:grabbing!important}
.joint-workspace-toolbar{position:absolute;z-index:8;top:17px;right:18px;display:flex;align-items:center;gap:3px;padding:4px;background:var(--surface-card);border:1px solid var(--border-primary);border-radius:8px;box-shadow:0 2px 10px rgba(20,35,31,.05)}
.joint-workspace-toolbar__label{padding:0 9px;font-size:10px;font-weight:650;color:var(--text-tertiary);letter-spacing:.02em}
.joint-workspace-toolbar button{min-height:35px;padding:6px 11px;font-size:11px;font-weight:630;border:0;background:transparent;color:var(--text-secondary);border-radius:5px}
.joint-workspace-toolbar button:hover{background:var(--surface-subtle)}
.joint-workspace-toolbar button[aria-pressed="true"]{background:var(--product-primary-soft);color:var(--product-primary);font-weight:720}
.joint-readout{pointer-events:none;position:absolute;z-index:7;bottom:49px;right:20px;display:flex;flex-direction:column;gap:6px;min-width:204px;max-width:min(260px,50%);background:var(--surface-card);border:1px solid var(--border-primary);border-radius:7px;padding:12px 15px;box-shadow:0 3px 12px rgba(20,35,31,.045)}
.joint-readout.has-selection{border-left:3px solid var(--product-primary)}
.joint-readout__caption{font:650 10px var(--font-mono);letter-spacing:.065em;color:var(--text-tertiary)}
.joint-readout strong{font-size:12px;font-weight:690;line-height:1.35;word-break:keep-all}
.joint-readout__values{display:flex;gap:4px;flex-direction:column}
.joint-readout output{color:var(--product-primary);font:690 21px/1.2 var(--font-mono);font-variant-numeric:tabular-nums}
.joint-readout__values>span{color:var(--text-tertiary);font-size:10px}
.joint-readout:not(.has-selection) .joint-readout__caption{display:none}
.joint-readout:not(.has-selection) output{display:none}
.joint-interaction-hint{pointer-events:none;position:absolute;z-index:6;right:20px;bottom:12px;margin:0;max-width:65%;font-size:10px;color:var(--text-secondary);text-align:right;word-break:keep-all}
.joint-row.is-selected{padding:9px 10px 11px;margin:2px -10px 3px;background:var(--product-primary-soft);border-left:2px solid var(--product-primary);border-radius:0 5px 5px 0}
.joint-row.is-selected label{font-weight:700;color:var(--product-primary)}
@media(min-width:1201px){
 .workspace{grid-template-columns:minmax(175px,194px) minmax(0,1fr) minmax(275px,298px)}
 .stage{min-height:625px}
 .body-stage{height:625px;min-height:625px}
 .body-viewer-workspace{grid-template-columns:minmax(0,1fr) minmax(270px,305px)}
}
@media(min-width:981px) and (max-width:1200px){
 .stage{min-height:535px}
 .body-stage{height:535px;min-height:535px}
}
@media(max-width:690px){
 .page-intro{min-height:0;padding:22px 4px 15px}
 .stage{height:415px;min-height:415px}
 .body-stage{height:425px;min-height:425px}
 .joint-workspace-toolbar{top:10px;right:10px;padding:3px}
 .joint-workspace-toolbar__label{display:none}
 .joint-workspace-toolbar button{min-height:36px;padding:6px 9px;font-size:11px}
 .joint-readout{bottom:37px;right:9px;min-width:0;max-width:212px;padding:9px 11px}
 .joint-readout strong{font-size:11px}
 .joint-readout output{font-size:17px}
 .joint-interaction-hint{right:10px;bottom:9px;max-width:80%;font-size:9px;line-height:1.35}
 .corner-title{top:56px;left:13px}
}

/* Original and model share one transport and a matched comparison surface. */
.body-comparison{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}
.body-comparison .body-stage{min-width:0;height:520px;min-height:520px}
.body-video-panel{min-width:0;display:flex;flex-direction:column;background:#f5f7f5;border-left:1px solid var(--border-primary)}
.body-video-header,.body-video-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px}
.body-video-header span{font:10px var(--font-mono);color:var(--text-tertiary)}
.body-video-header strong{font-size:12px;color:var(--text-primary)}
.body-video-screen{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#26312d}
.body-video-screen video{width:100%;height:100%;max-height:430px;object-fit:contain}
.body-video-screen p{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;color:#fff;font-size:12px;line-height:1.6;background:#26312d}
.body-video-screen p[hidden]{display:none}
.body-video-caption{font-size:11px;color:var(--text-secondary);line-height:1.4}.body-video-caption a{color:var(--product-primary);white-space:nowrap;text-underline-offset:3px}
@media(max-width:690px){.body-comparison{grid-template-columns:minmax(0,1fr)}.body-comparison .body-stage{height:425px;min-height:425px}.body-video-panel{border-left:0;border-top:1px solid var(--border-primary)}.body-video-screen{min-height:230px;aspect-ratio:4/3}.body-video-screen video{max-height:none}}

.body-camera-note{margin:0;padding:7px 16px 10px;font-size:11px;line-height:1.5;color:var(--text-secondary);background:var(--surface-card)}
#body-camera-ego[aria-pressed="true"]{background:var(--product-primary-soft);color:var(--product-primary);border-color:var(--product-primary);font-weight:700}
.body-stage.camera-ego .joint-workspace-toolbar,.body-stage.camera-ego .joint-readout,.body-stage.camera-ego .joint-interaction-hint{display:none}
.body-stage.camera-ego canvas{pointer-events:none}
.body-stage.camera-ego .corner-title span{display:none}

.body-scene-options{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px 0;background:var(--surface-card);font-size:11px;color:var(--text-secondary);line-height:1.55}
.body-scene-options label{display:inline-flex;align-items:center;gap:7px;font-weight:650;color:var(--text-primary)}
.body-scene-options input{accent-color:var(--product-primary);width:16px;height:16px}
.body-scene-options span{color:var(--text-tertiary)}

#body-tracking-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* Equal 4:3 image areas make source and model framing directly comparable. */
.body-comparison .body-stage{height:auto;min-height:0;aspect-ratio:4/3}
.body-video-panel{position:relative}
.body-video-screen{flex:none;width:100%;min-height:0;aspect-ratio:4/3}
.body-video-screen video{max-height:none}
.body-video-header,.body-video-caption{position:absolute;z-index:1;left:0;right:0;color:#fff;background:rgba(38,49,45,.8);padding:7px 12px}
.body-video-header{top:0}.body-video-caption{bottom:0}
.body-video-header span,.body-video-header strong,.body-video-caption,.body-video-caption a{color:#fff}
.body-video-screen p{z-index:2}
.body-view-adjust{padding:8px 16px;background:var(--surface-card);font-size:12px;color:var(--text-primary)}
.body-view-adjust[hidden]{display:none}.body-view-adjust summary{cursor:pointer;font-weight:650}.body-view-adjust summary span{font-weight:400;color:var(--text-secondary);margin-left:8px}
.body-view-adjust__controls{display:flex;align-items:end;gap:16px;flex-wrap:wrap;padding-top:12px}
.body-view-adjust__controls label{display:grid;grid-template-columns:1fr auto;gap:5px 12px;min-width:130px;flex:1}.body-view-adjust__controls input{grid-column:1/-1;width:100%;accent-color:var(--product-primary)}
@media(max-width:690px){.body-comparison .body-stage{height:auto;min-height:0;aspect-ratio:4/3}.body-video-screen{min-height:0}}

/* Research motion measurements: one quiet observation rail, not decorative KPI cards. */
.body-odometry{border-top:1px solid var(--border-primary);padding:16px 0 12px;margin-top:15px}
.body-odometry__head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 14px}
.body-odometry__head h4{font-size:12px;font-weight:700;color:var(--text-primary);margin:0}
.body-odometry__head span{font-size:10px;color:var(--text-tertiary)}
.body-odometry__metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:13px 0 10px;gap:0}
.body-odometry__metrics>div{min-width:0;padding:0 13px;border-left:1px solid var(--border-primary)}
.body-odometry__metrics>div:first-child{padding-left:0;border-left:0}
.body-odometry__metrics dt{font-size:10px;line-height:1.5;color:var(--text-secondary);word-break:keep-all}
.body-odometry__metrics dd{margin:6px 0 0;font:700 clamp(13px,1.4vw,17px)/1.4 var(--font-mono);color:var(--text-primary);white-space:nowrap;font-variant-numeric:tabular-nums}
.body-odometry__current{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:11px;color:var(--text-secondary);border-top:1px solid var(--border-subtle);padding-top:10px}
.body-odometry__current output{font:650 12px var(--font-mono);color:var(--product-primary);font-variant-numeric:tabular-nums}
.body-odometry__note{font-size:11px;line-height:1.7;color:var(--text-tertiary);margin:10px 0 0;word-break:keep-all}
@media(max-width:690px){
 .body-odometry__metrics{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:13px}
 .body-odometry__metrics>div:nth-child(odd){padding-left:0;border-left:0}
 .body-odometry__metrics dd{font-size:15px}
}


/* Motion Studio: compact navigation and a quieter workspace. */
.site-header{height:60px}.site-header__inner{max-width:1600px}
.app-shell{max-width:1600px}
.page-intro{min-height:0;padding:24px 0 16px;align-items:flex-end}
.page-intro h1{margin:5px 0 3px;font-size:clamp(25px,2.2vw,32px)}
.intro-sub{font-size:13px}
.mode-nav{min-height:48px;margin-bottom:18px;gap:8px}
.mode-nav__item{min-height:40px;padding:0 17px;border-radius:8px 8px 0 0}
.mode-nav__item[aria-pressed=true]{background:var(--surface-card)}
.mode-nav__number,.mode-nav__detail{display:none}
.body-catalog,.workspace{overflow:hidden;border-radius:12px}
.catalog-intro{padding:17px 24px;min-height:70px}
.catalog-intro h2{font-size:20px;margin:3px 0 0}
.catalog-intro__caption{color:var(--text-secondary);font-size:12px;white-space:nowrap}
.body-joint-inspector{background:#fbfcfb}
.body-joint-inspector .inspector-head{margin-bottom:10px}
.body-joint-inspector .inspector-footnote{margin:0 0 12px}
.body-provenance{display:block}
.body-provenance summary,.catalog-details>summary{cursor:pointer;font-weight:650;color:var(--text-primary)}
.body-provenance summary{font-size:12px}
.body-provenance__content{display:flex;flex-direction:column;gap:9px;padding-top:14px}
.catalog-details>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 24px;font-size:14px}
.catalog-details>summary::-webkit-details-marker{display:none}
.catalog-details>summary::after{content:'+';font-size:21px;font-weight:400;color:var(--product-primary);margin-left:auto}
.catalog-details[open]>summary::after{content:'−'}
.catalog-details>summary small{font-size:11px;font-weight:400;color:var(--text-tertiary)}
.catalog-details[open]>summary{border-bottom:1px solid var(--border-primary)}
.body-timeline-head h3{font-size:16px}.body-timeline{padding-top:18px}
@media(max-width:690px){
 .page-intro{padding:20px 3px 14px}.page-intro h1{font-size:25px}
 .intro-actions{gap:8px}.mode-nav{margin-bottom:12px}
 .catalog-intro{min-height:0;padding:15px 17px}.catalog-intro h2{font-size:18px}
 .catalog-intro__caption{font-size:11px}.catalog-details>summary{padding:18px 17px}
 .catalog-details>summary small{font-size:10px}
}

/* Compact title keeps the workspace in focus. */
.page-intro{padding:18px 0 12px}.page-intro h1{margin:0}
@media(max-width:690px){.page-intro{padding:16px 3px 12px}}
