:root{--jtp-paper: #f7f6f2;--jtp-panel: #ffffff;--jtp-panel-2: #f1efe9;--jtp-line: #e3dfd6;--jtp-line-2: #cbc5b8;--jtp-ink: #1d1b26;--jtp-ink-2: #45414f;--jtp-dim: #716b7c;--jtp-plum: #6d28d9;--jtp-plum-2: #5520ad;--jtp-plum-soft: #f3eefc;--jtp-moss: #3f7d20;--jtp-moss-soft: #eff6e9;--jtp-amber: #a85b06;--jtp-amber-soft: #fcf3e6;--jtp-rose: #b4234a;--jtp-rose-soft: #fcf0f3;--jtp-stage: #24212c;--jtp-check: #e6e3ec;--jtp-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--primary: #6d28d9;--primary-dark: #5520ad;--border: #e3dfd6;--surface: #ffffff;--surface-muted: #f7f6f2;--shadow-soft: 0 2px 10px rgba(29, 27, 38, 0.06);--text-main: #1d1b26;--text-muted: #716b7c;}
.jtp-sr{position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;}
.jtp-app{background: var(--jtp-paper);border: 1px solid var(--jtp-line);border-radius: 14px;padding: 1rem;margin-bottom: 2.6rem;color: var(--jtp-ink);}
.jtp-head{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 0.5rem 1rem;margin-bottom: 0.9rem;}
.jtp-byline{display: flex;flex-wrap: wrap;gap: 0.2rem 0.7rem;font-size: 0.82rem;color: var(--jtp-dim);}
.jtp-byline-author a, .jtp-byline-author .author-link{color: var(--jtp-plum-2);font-weight: 600;text-decoration: none;}
.jtp-byline-author a:hover, .jtp-byline-author .author-link:hover{text-decoration: underline;}
.jtp-facts{display: flex;flex-wrap: wrap;gap: 0.4rem;list-style: none;margin: 0;padding: 0;}
.jtp-facts li{font-size: 0.78rem;color: var(--jtp-ink-2);background: var(--jtp-panel);border: 1px solid var(--jtp-line);border-radius: 999px;padding: 0.22rem 0.7rem;}
.jtp-facts b{color: var(--jtp-plum-2);}
.jtp-drop{position: relative;display: flex;align-items: center;justify-content: center;gap: 1.1rem;padding: 2.8rem 1.2rem;background: var(--jtp-panel);border: 2px dashed var(--jtp-line-2);border-radius: 12px;cursor: pointer;text-align: left;transition: border-color 0.15s, background 0.15s;}
.jtp-drop:hover, .jtp-drop:focus-visible, .jtp-drop.is-over{border-color: var(--jtp-plum);background: var(--jtp-plum-soft);outline: none;}
.jtp-file{display: none;}
.jtp-drop-mark{flex: 0 0 auto;display: grid;place-items: center;width: 64px;height: 76px;border-radius: 6px 18px 6px 6px;background: var(--jtp-ink);color: #fff;font: 700 0.85rem/1 var(--jtp-mono);letter-spacing: 0.06em;box-shadow: 6px 6px 0 var(--jtp-plum);}
.jtp-drop-text{display: flex;flex-direction: column;gap: 0.25rem;}
.jtp-drop-title{font-size: 1.12rem;font-weight: 700;color: var(--jtp-ink);}
.jtp-drop-more{display: none;font-weight: 700;color: var(--jtp-plum-2);}
.jtp-drop-hint{font-size: 0.86rem;color: var(--jtp-dim);}
.jtp-drop.is-compact{padding: 0.65rem 1rem;justify-content: flex-start;gap: 0.8rem;border-width: 1px;}
.jtp-drop.is-compact .jtp-drop-mark{width: 34px;height: 40px;font-size: 0.6rem;border-radius: 4px 10px 4px 4px;box-shadow: 3px 3px 0 var(--jtp-plum);}
.jtp-drop.is-compact .jtp-drop-title{display: none;}
.jtp-drop.is-compact .jtp-drop-more{display: block;}
.jtp-drop.is-compact .jtp-drop-hint{font-size: 0.8rem;}
.jtp-note{font-size: 0.86rem;margin: 0.6rem 0 0;min-height: 0;}
.jtp-note:empty{display: none;}
.jtp-note.is-warn{color: var(--jtp-amber);}
.jtp-note.is-ok{color: var(--jtp-moss);}
.jtp-note.is-err{color: var(--jtp-rose);}
.jtp-bench{display: grid;grid-template-columns: minmax(0, 1fr) 280px;grid-template-areas: "stage panel" "rail rail";gap: 0.9rem;margin-top: 0.9rem;}
.jtp-bench[hidden]{display: none;}
.jtp-stage{grid-area: stage;background: var(--jtp-panel);border: 1px solid var(--jtp-line);border-radius: 12px;padding: 0.75rem;min-width: 0;}
.jtp-panel{grid-area: panel;background: var(--jtp-panel);border: 1px solid var(--jtp-line);border-radius: 12px;padding: 0.9rem;display: flex;flex-direction: column;gap: 1rem;}
.jtp-rail{grid-area: rail;background: var(--jtp-panel);border: 1px solid var(--jtp-line);border-radius: 12px;padding: 0.75rem;}
.jtp-stage-bar{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 0.5rem;margin-bottom: 0.65rem;}
.jtp-stage-hint{font-size: 0.8rem;color: var(--jtp-dim);}
.jtp-seg{display: inline-flex;background: var(--jtp-panel-2);border: 1px solid var(--jtp-line);border-radius: 8px;padding: 3px;gap: 3px;}
.jtp-seg-full{display: flex;}
.jtp-seg-full .jtp-seg-btn{flex: 1 1 0;}
.jtp-seg-btn{border: 0;background: transparent;color: var(--jtp-ink-2);font-size: 0.84rem;font-weight: 600;padding: 0.38rem 0.75rem;border-radius: 6px;cursor: pointer;}
.jtp-seg-btn:hover{color: var(--jtp-ink);}
.jtp-seg-btn[aria-pressed="true"]{background: var(--jtp-panel);color: var(--jtp-plum-2);box-shadow: 0 1px 3px rgba(29, 27, 38, 0.14);}
.jtp-seg-btn:focus-visible, .jtp-size:focus-visible, .jtp-btn:focus-visible, .jtp-mini:focus-visible, .jtp-icon:focus-visible, .jtp-item-pick:focus-visible{outline: 2px solid var(--jtp-plum);outline-offset: 2px;}
.jtp-frame{display: flex;align-items: center;justify-content: center;min-height: 340px;padding: 0.8rem;border-radius: 9px;background: var(--jtp-stage);overflow: hidden;}
.jtp-frame.is-checker{background-color: #fff;background-image: conic-gradient(var(--jtp-check) 25%, transparent 0 50%, var(--jtp-check) 0 75%, transparent 0);background-size: 20px 20px;}
.jtp-stage-img{display: block;max-width: 100%;max-height: 540px;height: auto;cursor: crosshair;image-rendering: auto;}
.jtp-stage-img:not([src]){visibility: hidden;}
.jtp-caption{margin: 0.55rem 0 0;font: 0.8rem/1.4 var(--jtp-mono);color: var(--jtp-dim);word-break: break-all;}
.jtp-group{display: flex;flex-direction: column;gap: 0.4rem;}
.jtp-label{font-size: 0.78rem;font-weight: 700;letter-spacing: 0.04em;text-transform: uppercase;color: var(--jtp-ink-2);}
.jtp-label-row{display: flex;align-items: baseline;justify-content: space-between;}
.jtp-out{font: 700 0.9rem/1 var(--jtp-mono);color: var(--jtp-plum-2);}
.jtp-help{font-size: 0.76rem;line-height: 1.4;color: var(--jtp-dim);}
.jtp-keybox{display: flex;flex-direction: column;gap: 1rem;padding: 0.8rem;border-radius: 9px;background: var(--jtp-plum-soft);border: 1px solid #e2d6f7;transition: opacity 0.15s;}
.jtp-keybox.is-off{opacity: 0.55;background: var(--jtp-panel-2);border-color: var(--jtp-line);}
.jtp-keyrow{display: flex;align-items: center;gap: 0.5rem;flex-wrap: wrap;}
.jtp-swatch{width: 38px;height: 32px;padding: 2px;border: 1px solid var(--jtp-line-2);border-radius: 6px;background: #fff;cursor: pointer;}
.jtp-hex{font: 600 0.84rem/1 var(--jtp-mono);color: var(--jtp-ink);background: transparent;padding: 0;}
.jtp-mini{margin-left: auto;border: 1px solid var(--jtp-line-2);background: var(--jtp-panel);color: var(--jtp-ink-2);font-size: 0.76rem;font-weight: 600;border-radius: 6px;padding: 0.3rem 0.55rem;cursor: pointer;}
.jtp-mini:hover{border-color: var(--jtp-plum);color: var(--jtp-plum-2);}
.jtp-range{width: 100%;accent-color: var(--jtp-plum);}
.jtp-sizes{display: grid;grid-template-columns: repeat(3, 1fr);gap: 0.35rem;}
.jtp-size{border: 1px solid var(--jtp-line);background: var(--jtp-panel);color: var(--jtp-ink-2);font: 600 0.8rem/1 var(--jtp-mono);padding: 0.5rem 0.3rem;border-radius: 6px;cursor: pointer;}
.jtp-size:hover{border-color: var(--jtp-line-2);color: var(--jtp-ink);}
.jtp-size[aria-pressed="true"]{border-color: var(--jtp-plum);background: var(--jtp-plum-soft);color: var(--jtp-plum-2);}
.jtp-actions{display: flex;flex-direction: column;gap: 0.45rem;margin-top: auto;padding-top: 0.3rem;border-top: 1px solid var(--jtp-line);}
.jtp-btn{border: 1px solid var(--jtp-line-2);background: var(--jtp-panel);color: var(--jtp-ink);font-size: 0.9rem;font-weight: 700;padding: 0.6rem 0.8rem;border-radius: 8px;cursor: pointer;}
.jtp-btn:hover:not(:disabled){border-color: var(--jtp-ink-2);}
.jtp-btn:disabled{opacity: 0.45;cursor: not-allowed;}
.jtp-btn-main{background: var(--jtp-plum);border-color: var(--jtp-plum);color: #fff;}
.jtp-btn-main:hover:not(:disabled){background: var(--jtp-plum-2);border-color: var(--jtp-plum-2);}
.jtp-btn-quiet{border-color: transparent;background: transparent;color: var(--jtp-dim);font-weight: 600;}
.jtp-btn-quiet:hover:not(:disabled){color: var(--jtp-rose);border-color: transparent;}
.jtp-totals{display: grid;grid-template-columns: repeat(4, 1fr);gap: 0.5rem;margin: 0 0 0.7rem;}
.jtp-totals div{background: var(--jtp-panel-2);border-radius: 8px;padding: 0.5rem 0.65rem;}
.jtp-totals dt{font-size: 0.7rem;font-weight: 700;letter-spacing: 0.05em;text-transform: uppercase;color: var(--jtp-dim);}
.jtp-totals dd{margin: 0.15rem 0 0;font: 700 1rem/1.2 var(--jtp-mono);color: var(--jtp-ink);}
.jtp-list{list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));gap: 0.5rem;}
.jtp-item{display: flex;align-items: center;gap: 0.6rem;padding: 0.45rem;border: 1px solid var(--jtp-line);border-radius: 9px;background: var(--jtp-panel);min-width: 0;}
.jtp-item.is-current{border-color: var(--jtp-plum);box-shadow: 0 0 0 1px var(--jtp-plum);}
.jtp-item-pick{flex: 0 0 auto;padding: 0;border: 0;background: var(--jtp-panel-2);border-radius: 6px;cursor: pointer;line-height: 0;}
.jtp-item-thumb{width: 54px;height: 54px;object-fit: cover;border-radius: 6px;}
.jtp-item-body{flex: 1 1 auto;min-width: 0;display: flex;flex-direction: column;gap: 0.2rem;cursor: pointer;}
.jtp-item-name{font-size: 0.84rem;font-weight: 600;color: var(--jtp-ink);white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.jtp-item-meta{font: 0.74rem/1.3 var(--jtp-mono);color: var(--jtp-dim);}
.jtp-item.is-fail .jtp-item-meta{color: var(--jtp-rose);}
.jtp-item-bar{display: block;height: 5px;border-radius: 3px;background: var(--jtp-panel-2);overflow: hidden;}
.jtp-item-bar span{display: block;height: 100%;width: 0;background: var(--jtp-moss);transition: width 0.25s;}
.jtp-item.is-heavy .jtp-item-bar span{background: var(--jtp-amber);}
.jtp-item.is-busy .jtp-item-bar span{width: 35%;background: var(--jtp-line-2);animation: jtp-pulse 1s ease-in-out infinite alternate;}
@keyframes jtp-pulse{from{opacity: 0.4;}to{opacity: 1;}}
.jtp-item-acts{display: flex;gap: 0.25rem;}
.jtp-icon{width: 30px;height: 30px;display: grid;place-items: center;border: 1px solid var(--jtp-line);background: var(--jtp-panel);color: var(--jtp-ink-2);border-radius: 6px;font-size: 1rem;line-height: 1;cursor: pointer;}
.jtp-icon:hover:not(:disabled){border-color: var(--jtp-plum);color: var(--jtp-plum-2);}
.jtp-icon:disabled{opacity: 0.35;cursor: not-allowed;}
.jtp-icon[data-act="rm"]:hover{border-color: var(--jtp-rose);color: var(--jtp-rose);}
.jtp-article{margin: 0 auto 2.4rem;color: var(--jtp-ink-2);font-size: 1rem;line-height: 1.7;}
.jtp-article h2{font-size: 1.45rem;font-weight: 800;color: var(--jtp-ink);margin: 2.4rem 0 0.8rem;line-height: 1.3;}
.jtp-article h2:first-child{margin-top: 0.4rem;}
.jtp-article h3{font-size: 1.12rem;font-weight: 700;color: var(--jtp-ink);margin: 1.8rem 0 0.6rem;}
.jtp-article p{margin: 0 0 1rem;}
.jtp-article strong{color: var(--jtp-ink);}
.jtp-article a{color: var(--jtp-plum-2);font-weight: 600;}
.jtp-article code{font-family: var(--jtp-mono);font-size: 0.86em;background: var(--jtp-panel-2);color: var(--jtp-ink);padding: 0.1rem 0.35rem;border-radius: 4px;}
.jtp-verdict{display: grid;grid-template-columns: 1fr 1fr;gap: 0.9rem;margin: 0.4rem 0 1rem;}
.jtp-verdict-col{border-radius: 12px;padding: 1rem 1.1rem;border: 1px solid var(--jtp-line);}
.jtp-verdict-col.is-yes{background: var(--jtp-moss-soft);border-color: #d3e6c4;}
.jtp-verdict-col.is-no{background: var(--jtp-amber-soft);border-color: #f1dcbc;}
.jtp-verdict-col h3{margin: 0 0 0.55rem;font-size: 1rem;}
.jtp-verdict-col.is-yes h3{color: var(--jtp-moss);}
.jtp-verdict-col.is-no h3{color: var(--jtp-amber);}
.jtp-verdict-col ul{margin: 0;padding-left: 1.1rem;font-size: 0.94rem;}
.jtp-verdict-col li{margin-bottom: 0.45rem;}
.jtp-scroll{overflow-x: auto;margin: 0 0 1rem;border: 1px solid var(--jtp-line);border-radius: 10px;}
.jtp-table{width: 100%;border-collapse: collapse;font-size: 0.9rem;min-width: 540px;background: var(--jtp-panel);}
.jtp-table th{text-align: left;font-size: 0.74rem;letter-spacing: 0.05em;text-transform: uppercase;color: var(--jtp-dim);background: var(--jtp-panel-2);padding: 0.6rem 0.8rem;}
.jtp-table td{padding: 0.6rem 0.8rem;border-top: 1px solid var(--jtp-line);}
.jtp-table td:last-child{font-family: var(--jtp-mono);font-weight: 700;color: var(--jtp-plum-2);white-space: nowrap;}
.jtp-steps{counter-reset: jtp;list-style: none;padding: 0;margin: 0 0 1.2rem;}
.jtp-steps li{counter-increment: jtp;position: relative;padding: 0 0 0.9rem 2.6rem;}
.jtp-steps li::before{content: counter(jtp);position: absolute;left: 0;top: 0.1rem;width: 1.8rem;height: 1.8rem;display: grid;place-items: center;border-radius: 50%;background: var(--jtp-ink);color: #fff;font: 700 0.85rem/1 var(--jtp-mono);}
.jtp-steps b{color: var(--jtp-ink);}
.jtp-callout{border-left: 4px solid var(--jtp-amber);background: var(--jtp-amber-soft);border-radius: 0 10px 10px 0;padding: 0.9rem 1.1rem;margin: 0 0 1rem;}
.jtp-callout p{margin: 0;}
.jtp-facts-dl{display: grid;grid-template-columns: 190px 1fr;gap: 0;margin: 0 0 1rem;border-top: 1px solid var(--jtp-line);}
.jtp-facts-dl dt{font-weight: 700;color: var(--jtp-ink);padding: 0.75rem 1rem 0.75rem 0;border-bottom: 1px solid var(--jtp-line);}
.jtp-facts-dl dd{margin: 0;padding: 0.75rem 0;border-bottom: 1px solid var(--jtp-line);}
.jtp-limits{padding-left: 1.1rem;margin: 0 0 1rem;}
.jtp-limits li{margin-bottom: 0.55rem;}
@media (max-width: 991.98px){.jtp-bench{grid-template-columns: 1fr;grid-template-areas: "stage" "panel" "rail";}.jtp-totals{grid-template-columns: repeat(2, 1fr);}}
@media (max-width: 767.98px){.jtp-app{padding: 0.7rem;}.jtp-drop{flex-direction: column;text-align: center;padding: 2rem 1rem;}.jtp-drop.is-compact{flex-direction: row;text-align: left;}.jtp-frame{min-height: 240px;}.jtp-verdict{grid-template-columns: 1fr;}.jtp-facts-dl{grid-template-columns: 1fr;}.jtp-facts-dl dt{border-bottom: 0;padding-bottom: 0.1rem;}.jtp-facts-dl dd{padding-top: 0;}.jtp-list{grid-template-columns: 1fr;}}