@layer tokens,reset,base;@layer components{.tr-depth{gap:var(--x-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex;position:relative}.tr-layer{column-gap:var(--x-space-4);row-gap:var(--x-space-1);padding:var(--x-space-4) var(--x-space-5);border-radius:var(--x-radius-l);background:var(--x-role-surface-raised);border:var(--x-border-width-hairline) solid var(--x-role-border-subtle);grid-template-columns:auto minmax(0,1fr);grid-template-areas:"n head""n fix";min-inline-size:0;display:grid}@media (width>=900px){.tr-layer{grid-template-columns:auto minmax(0,1fr) minmax(0,2fr) auto;grid-template-areas:"n head fix go";align-items:center;margin-inline-start:calc(var(--d) * var(--x-space-5))}}.tr-layer[data-state=planned]{background:var(--x-role-surface-sunken);border-style:dashed}.tr-layer-n{inline-size:var(--x-size-control-m);block-size:var(--x-size-control-m);border-radius:var(--x-radius-full);font-size:var(--x-font-size-caption);font-weight:var(--x-font-weight-bold);background:var(--x-role-accent-subtle);color:var(--x-role-accent-text);border:var(--x-border-width-hairline) solid var(--x-role-accent-border);grid-area:n;place-items:center;display:inline-grid}.tr-layer[data-state=planned] .tr-layer-n{background:var(--x-role-surface-raised);color:var(--x-role-text-secondary);border-color:var(--x-role-border-default)}.tr-layer-head{align-items:center;gap:var(--x-space-2);flex-wrap:wrap;grid-area:head;min-inline-size:0;display:flex}.tr-layer-head h3{font-size:var(--x-font-size-body);overflow-wrap:anywhere}.tr-layer-fix{grid-area:fix;min-inline-size:0}.tr-layer-go{grid-area:go;display:none}@media (width>=900px){.tr-layer-go{display:inline-flex}}.tr-state{font-size:var(--x-font-size-caption);font-weight:var(--x-font-weight-semibold);border-radius:var(--x-radius-full);padding:0 var(--x-space-2);border:var(--x-border-width-hairline) solid var(--x-role-border-default);color:var(--x-role-text-secondary);white-space:nowrap}.tr-state[data-state=available]{color:var(--x-role-state-success-fg);border-color:var(--x-role-state-success-border);background:var(--x-role-state-success-bg)}.tr-state[data-state=beta]{color:var(--x-role-accent-text);border-color:var(--x-role-accent-border);background:var(--x-role-accent-subtle)}.tr-steps{gap:var(--x-space-3);counter-reset:tr-step;grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none;display:grid}@media (width>=900px){.tr-steps{grid-template-columns:repeat(4,minmax(0,1fr))}}.tr-step{gap:var(--x-space-2);padding:var(--x-space-5);border-radius:var(--x-radius-l);background:var(--x-role-surface-raised);border:var(--x-border-width-hairline) solid var(--x-role-border-subtle);counter-increment:tr-step;flex-direction:column;min-inline-size:0;display:flex;position:relative}.tr-step:before{content:counter(tr-step);inline-size:var(--x-size-icon-l);block-size:var(--x-size-icon-l);border-radius:var(--x-radius-full);background:var(--x-role-accent-solid);color:var(--x-role-text-on-solid);font-size:var(--x-font-size-caption);font-weight:var(--x-font-weight-bold);place-items:center;display:inline-grid}.tr-step:last-child{border-color:var(--x-role-accent-border);background:var(--x-role-accent-subtle)}.tr-step h3{font-size:var(--x-font-size-body)}.tr-fail{gap:var(--x-space-3);padding:var(--x-space-4) var(--x-space-5);border-radius:var(--x-radius-l);border:var(--x-border-width-hairline) dashed var(--x-role-border-default);max-inline-size:var(--x-size-content-prose);align-items:flex-start;display:flex}.tr-fail svg{inline-size:var(--x-size-icon-m);block-size:var(--x-size-icon-m);color:var(--x-role-accent-text);flex:none}.tr-limits{gap:var(--x-space-3);grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none;display:grid}@media (width>=900px){.tr-limits{grid-template-columns:repeat(3,minmax(0,1fr))}}.tr-limit{gap:var(--x-space-2);padding:var(--x-space-5);border-radius:var(--x-radius-l);border:var(--x-border-width-hairline) solid var(--x-role-border-subtle);background:var(--x-role-surface-raised);flex-direction:column;min-inline-size:0;display:flex}.tr-limit h3{font-size:var(--x-font-size-title-s)}}@layer utilities;
