/* Component classes (jpc- prefix). Every value is a token. */
.jpc-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:44px;min-width:44px;padding:0 var(--space-5);font-family:var(--font-body);font-weight:700;font-size:var(--text-body);line-height:1;letter-spacing:0;border:1px solid transparent;border-radius:var(--radius-sm);cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}
.jpc-btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.jpc-btn svg{width:18px;height:18px;flex:none}
.jpc-btn--sm{height:36px;min-width:36px;padding:0 var(--space-4);font-size:var(--text-body-s)}
.jpc-btn--sm svg{width:16px;height:16px}
.jpc-btn--lg{height:52px;min-width:52px;padding:0 var(--space-6);font-size:var(--text-body-l)}
.jpc-btn--icon{padding:0}
.jpc-btn--block{display:flex;width:100%}
.jpc-btn--primary{background:var(--wire);color:var(--on-wire);border-color:var(--wire)}
.jpc-btn--primary:hover{background:var(--wire-hover);border-color:var(--wire-hover);color:var(--on-wire)}
.jpc-btn--signal{background:var(--signal);color:var(--on-signal);border-color:var(--ink)}
.jpc-btn--signal:hover{transform:translate(var(--lift),var(--lift));box-shadow:var(--shadow-ledger);color:var(--on-signal)}
.jpc-btn--secondary{background:var(--paper-200);color:var(--ink);border-color:var(--rule-strong)}
.jpc-btn--secondary:hover{border-color:var(--ink);color:var(--ink)}
.jpc-btn--ghost{background:transparent;color:var(--wire)}
.jpc-btn--ghost:hover{background:var(--wire-tint);color:var(--wire)}
.jpc-btn--danger{background:var(--error);color:var(--paper-100);border-color:var(--error)}
.jpc-btn:active{transform:translate(0,0);box-shadow:none}
.jpc-btn[disabled],.jpc-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.jpc-field{display:flex;flex-direction:column;gap:var(--space-2);font-family:var(--font-body)}
.jpc-field__label{font-size:var(--text-body-s);font-weight:700;color:var(--ink);display:flex;justify-content:space-between;gap:var(--space-2)}
.jpc-field__opt{font-family:var(--font-mono);font-size:var(--text-label);font-weight:500;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--ink-muted)}
.jpc-input{display:flex;align-items:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-3);background:var(--paper-200);border:1px solid var(--rule-strong);border-radius:var(--radius-sm);transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.jpc-input:hover{border-color:var(--ink-muted)}
.jpc-input:focus-within{border-color:var(--wire);box-shadow:0 0 0 3px var(--wire-tint)}
.jpc-input input,.jpc-input textarea,.jpc-input select{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:var(--text-body);padding:0;height:42px}
.jpc-input textarea{height:auto;min-height:96px;padding:var(--space-3) 0;resize:vertical;line-height:var(--leading-body)}
.jpc-input select{appearance:none;cursor:pointer}
.jpc-input ::placeholder{color:var(--ink-subtle)}
.jpc-input__affix{font-family:var(--font-mono);font-size:var(--text-data);color:var(--ink-muted);display:flex;align-items:center}
.jpc-input__affix svg{width:18px;height:18px}
.jpc-field--error .jpc-input{border-color:var(--error)}
.jpc-field--error .jpc-input:focus-within{box-shadow:0 0 0 3px var(--error-tint)}
.jpc-field--disabled .jpc-input{background:var(--paper-300);opacity:.6;cursor:not-allowed}
.jpc-field__hint{font-size:var(--text-body-s);color:var(--ink-muted);display:flex;gap:6px;align-items:flex-start;line-height:1.45}
.jpc-field--error .jpc-field__hint{color:var(--error)}
.jpc-field__hint svg{width:16px;height:16px;flex:none;margin-top:1px}
.jpc-card{position:relative;display:flex;flex-direction:column;gap:var(--space-3);background:var(--paper-200);color:var(--ink);border:1px solid var(--rule);border-radius:var(--radius-md);padding:var(--space-5);text-align:left;font-family:var(--font-body);transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out)}
.jpc-card--featured{border-color:var(--ink);box-shadow:var(--shadow-ledger)}
.jpc-card--sunk{background:var(--paper-300);border-color:transparent}
.jpc-card--quiet{background:var(--wire-tint);border-color:transparent}
.jpc-card--interactive{cursor:pointer}
.jpc-card--interactive:hover{transform:translate(var(--lift),var(--lift));box-shadow:var(--shadow-ledger);border-color:var(--ink)}
.jpc-card--interactive:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.jpc-card__eyebrow{font-family:var(--font-mono);font-size:var(--text-label);font-weight:500;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--ink-muted);display:flex;justify-content:space-between;gap:var(--space-3);align-items:center}
.jpc-card__title{margin:0;font-family:var(--font-display);font-weight:700;font-size:var(--text-h4);line-height:var(--leading-tight);letter-spacing:-0.01em}
.jpc-card__body{font-size:var(--text-body-s);line-height:1.55;color:var(--ink-muted)}
.jpc-card__body p{margin:0}
.jpc-card__stat{font-family:var(--font-mono);font-weight:500;font-size:var(--text-stat);line-height:1;letter-spacing:-0.02em;color:var(--ink)}
.jpc-card__unit{font-size:.5em;color:var(--ink-muted);margin-left:2px}
.jpc-card__unit--signal{color:var(--signal)}
.jpc-card__footer{margin-top:auto;padding-top:var(--space-3);border-top:1px solid var(--rule);display:flex;justify-content:space-between;align-items:center;gap:var(--space-3)}
.jpc-badge{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 var(--space-2);font-family:var(--font-mono);font-size:var(--text-label);font-weight:500;letter-spacing:var(--tracking-label);text-transform:uppercase;line-height:1;border-radius:var(--radius-sm);border:1px solid transparent;white-space:nowrap;background:var(--paper-300);color:var(--ink)}
.jpc-badge svg{width:14px;height:14px}
.jpc-badge--outline{background:transparent;border-color:var(--rule-strong)}
.jpc-badge--wire{background:var(--wire-tint);color:var(--wire)}
.jpc-badge--success{background:var(--success-tint);color:var(--success)}
.jpc-badge--warning{background:var(--warning-tint);color:var(--warning)}
.jpc-badge--error{background:var(--error-tint);color:var(--error)}
.jpc-badge--signal{background:transparent;border-color:var(--ink);color:var(--ink)}
.jpc-badge__dot{width:8px;height:8px;border-radius:var(--radius-pill);background:currentColor;flex:none}
.jpc-badge--signal .jpc-badge__dot{background:var(--signal)}
.jpc-nav{display:flex;align-items:center;gap:var(--space-6);height:72px;padding:0 var(--margin-desktop);background:var(--paper-100);border-bottom:1px solid var(--rule);font-family:var(--font-body)}
.jpc-nav__brand{display:flex;align-items:center;text-decoration:none;color:var(--ink)}
.jpc-nav__links{display:flex;gap:var(--space-1);margin:0;padding:0;list-style:none}
.jpc-nav__link{display:flex;align-items:center;height:44px;padding:0 var(--space-3);font-size:var(--text-body-s);font-weight:700;color:var(--ink-muted);text-decoration:none;border-radius:var(--radius-sm);background:none;border:0;cursor:pointer;font-family:inherit;position:relative;transition:color var(--dur-fast)}
.jpc-nav__link:hover{color:var(--ink);text-decoration:none}
.jpc-nav__link[aria-current="page"]{color:var(--wire)}
.jpc-nav__link[aria-current="page"]::after{content:"";position:absolute;left:var(--space-3);right:var(--space-3);bottom:-14px;height:2px;background:var(--wire)}
.jpc-nav__actions{margin-left:auto;display:flex;align-items:center;gap:var(--space-3)}
.jpc-tabbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:64px;background:var(--paper-200);border-top:1px solid var(--rule);border-radius:var(--radius-lg) var(--radius-lg) 0 0;font-family:var(--font-body)}
.jpc-tabbar__item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:44px;background:none;border:0;cursor:pointer;color:var(--ink-muted);font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;position:relative}
.jpc-tabbar__item svg{width:22px;height:22px}
.jpc-tabbar__item[aria-current="page"]{color:var(--wire)}
.jpc-tabbar__item[aria-current="page"]::before{content:"";position:absolute;top:-1px;left:30%;right:30%;height:2px;background:var(--wire)}
.jpc-node{display:flex;flex-direction:column;gap:6px;min-width:0;width:100%;max-width:260px;padding:var(--space-3) var(--space-4);background:var(--paper-200);color:var(--ink);border:1px solid var(--rule-strong);border-radius:var(--radius-sm);position:relative;font-family:var(--font-body);text-align:left}
.jpc-node__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);font-family:var(--font-mono);font-size:var(--text-label);font-weight:500;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--ink-muted)}
.jpc-node__kind{display:flex;align-items:center;gap:6px}
.jpc-node__kind svg{width:14px;height:14px}
.jpc-node__title{font-weight:700;font-size:var(--text-body);line-height:1.3}
.jpc-node__note{font-size:var(--text-body-s);line-height:1.45;color:var(--ink-muted)}
.jpc-node--trigger{border-color:var(--wire)}
.jpc-node--trigger .jpc-node__head{color:var(--wire)}
.jpc-node--wait{background:var(--paper-300);border-style:dashed}
.jpc-node--outcome{background:var(--signal);border-color:var(--ink);color:var(--on-signal)}
.jpc-node--outcome .jpc-node__head,.jpc-node--outcome .jpc-node__note{color:var(--on-signal)}
.jpc-node--failed{border-color:var(--error)}
.jpc-node--failed .jpc-node__head{color:var(--error)}
.jpc-node__port{position:absolute;width:8px;height:8px;background:var(--paper-200);border:1.5px solid var(--wire);top:50%;margin-top:-4px}
.jpc-node__port--in{left:-5px}.jpc-node__port--out{right:-5px}
.jpc-node--outcome .jpc-node__port{border-color:var(--ink);background:var(--signal)}
.jpc-flow{display:flex;align-items:center;gap:0}
.jpc-flow--vertical{flex-direction:column;align-items:stretch}
.jpc-flow__wire{flex:0 0 40px;height:1.5px;background:var(--wire);min-width:24px}
.jpc-flow--vertical .jpc-flow__wire{flex:0 0 24px;width:1.5px;height:auto;min-width:0;margin-left:24px}
.jpc-flow--vertical .jpc-node{max-width:none}
.jpc-flow--vertical .jpc-node__port{display:none}
.jpc-logo{display:inline-block;font-family:var(--font-display);font-weight:800;color:var(--ink);letter-spacing:-0.035em;line-height:.92;white-space:nowrap}
.jpc-logo--stacked{line-height:.9}.jpc-logo--stacked>span:not(.jpc-logo__dot){display:block}
.jpc-logo--reversed{color:var(--paper-100)}
[data-theme="dark"] .jpc-logo--auto{color:var(--ink)}
.jpc-logo__dot{display:inline-block;width:.2em;height:.2em;background:var(--signal);margin-left:.05em;vertical-align:baseline}
.jpc-icon{display:inline-block;flex:none;vertical-align:middle}