.osxhost-ord-order{
  --ac-primary: #E0103A;
  --ac-accent: #FF6B4A;
  --ac-bg: #FEFEFD;
  --ac-card: #FFFFFF;
  --ac-ink: #0C0C10;
  --ac-on-primary: #ffffff;
  --ac-primary-text: color-mix(in srgb, var(--ac-primary) 42%, var(--ac-ink));
  --ac-ok: #1e8e5a;
  --ac-warn: #9a6b0f;
  --ac-danger: #c53939;
  --ac-shadow: #0C0C10;
  --ac-r: 15px;
  --ac-font-head: "Chivo", "PingFang SC", "Noto Sans CJK SC", system-ui, sans-serif;
  --ac-font-body: "Manrope", "PingFang SC", "Noto Sans CJK SC", system-ui, sans-serif;
  --ac-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
width:min(var(--width-standard),calc(100% - var(--gutter)*2));
margin-inline:auto;
padding-block:var(--hero-pad) var(--space-close);
background:var(--paper);
color:var(--ink);
font-family:var(--font-body);
font-variant-numeric:tabular-nums;
overflow-x:clip
}
.osxhost-ord-order [hidden]{display:none!important}
.osxhost-ord-order *,
.osxhost-ord-order *::before,
.osxhost-ord-order *::after{box-sizing:border-box}
.osxhost-ord-opening{
display:grid;
gap:var(--space-3);
margin:0 0 var(--space-6);
max-width:var(--width-reading)
}
.osxhost-ord-headline{
margin:0;
font-family:var(--font-heading);
font-size:var(--text-section);
font-weight:var(--weight-display);
line-height:var(--leading-title);
letter-spacing:var(--tracking-title);
overflow-wrap:break-word
}
.osxhost-ord-introduction{
margin:0;
font-size:var(--text-lead);
line-height:var(--leading-body);
color:var(--muted);
overflow-wrap:break-word
}
.osxhost-ord-allocation{
display:grid;
grid-template-columns:minmax(0,1fr);
gap:var(--space-5);
padding:var(--space-4);
background:var(--soft);
color:var(--ink);
border-radius:var(--radius-md)
}
.osxhost-ord-hardware{
min-width:0;
margin:0;
padding:0;
border:0
}
.osxhost-ord-register{
display:block;
width:fit-content;
padding:0;
margin:0 0 var(--space-3);
color:var(--muted);
font-family:var(--font-mono);
font-size:var(--text-xs);
line-height:var(--leading-control)
}
.osxhost-ord-register code{
display:block;
padding:var(--space-1) var(--space-2);
background:var(--yellow);
color:var(--yellow-ink);
border-radius:var(--radius-md);
font-size:var(--text-xs)
}
.osxhost-ord-caption{
margin:0 0 var(--space-4);
font-family:var(--font-heading);
font-size:var(--text-card);
font-weight:var(--weight-heavy);
line-height:var(--leading-card);
letter-spacing:-.02em;
overflow-wrap:break-word
}
.osxhost-ord-machines{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
gap:var(--space-3);
align-items:stretch;
min-width:0
}
.osxhost-ord-plan{
position:relative;
display:flex;
flex-direction:column;
align-items:stretch;
gap:var(--space-3);
height:100%;
min-width:0;
width:100%;
margin:0;
padding:var(--space-4);
border:1px solid transparent;
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
font-family:var(--font-body);
text-align:left;
cursor:pointer;
transition:border-color var(--duration),box-shadow var(--duration)
}
.osxhost-ord-plan:hover{
border-color:var(--control-line);
background:var(--paper);
color:var(--ink)
}
.osxhost-ord-plan.is-on,
.osxhost-ord-plan[aria-checked="true"]{
border-color:var(--primary);
box-shadow:inset 0 3px 0 var(--primary);
background:var(--paper);
color:var(--ink)
}
.osxhost-ord-plan-name{
display:block;
min-width:0;
font-family:var(--font-heading);
font-size:var(--text-card);
font-weight:var(--weight-heavy);
line-height:var(--leading-card);
overflow-wrap:break-word
}
.osxhost-ord-plan-chip{
display:inline-flex;
align-items:center;
justify-content:center;
align-self:flex-start;
gap:var(--space-1);
width:fit-content;
max-width:100%;
padding:.4em .9em;
border-radius:var(--radius-pill);
background:var(--yellow);
color:var(--yellow-ink);
font-family:var(--font-mono);
font-size:var(--text-xs);
line-height:1;
overflow-wrap:break-word
}
.osxhost-ord-plan-spec{
display:block;
width:100%;
min-width:0;
font-family:var(--font-mono);
font-size:var(--text-sm);
line-height:var(--leading-body);
color:var(--muted);
overflow-wrap:break-word
}
.osxhost-ord-plan-spec>*{min-width:0}
.osxhost-ord-plan-price{
display:block;
margin-top:auto;
min-width:0;
font-family:var(--font-mono);
font-size:var(--text-reading);
font-weight:var(--weight-bold);
line-height:var(--leading-title);
overflow-wrap:break-word
}
.osxhost-ord-plan-price em{
display:inline;
margin-left:var(--space-1);
font-style:normal;
font-size:var(--text-sm);
font-weight:var(--weight-normal);
color:var(--muted)
}
.osxhost-ord-dispatch{
min-width:0;
margin:0;
padding-top:var(--space-4);
border-top:1px solid var(--line-strong)
}
.osxhost-ord-dispatch-caption{
display:flex;
align-items:baseline;
flex-wrap:wrap;
gap:var(--space-3);
margin-bottom:var(--space-3)
}
.osxhost-ord-dispatch-caption .osxhost-ord-register{
margin:0;
padding:var(--space-1) var(--space-2);
border-radius:var(--radius-md);
background:var(--ice);
color:var(--ice-ink)
}
.osxhost-ord-dispatch-caption .osxhost-ord-caption{margin:0}
.osxhost-ord-destinations{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));
align-items:stretch;
gap:var(--space-2);
min-width:0
}
.osxhost-ord-region{
display:flex;
flex-direction:column;
justify-content:center;
align-items:flex-start;
gap:var(--space-2);
width:100%;
height:100%;
min-width:0;
min-height:var(--control-height);
padding:var(--space-3) var(--space-4);
border:1px solid var(--line-strong);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
font-family:var(--font-body);
font-size:var(--text-sm);
font-weight:var(--weight-bold);
line-height:var(--leading-body);
text-align:left;
overflow-wrap:break-word;
cursor:pointer;
transition:border-color var(--duration),background var(--duration)
}
.osxhost-ord-region:hover{border-color:var(--control-line)}
.osxhost-ord-region.is-on,
.osxhost-ord-region[aria-checked="true"]{
border-color:var(--primary);
background:var(--paper);
color:var(--primary);
box-shadow:inset 3px 0 0 var(--primary)
}
.osxhost-ord-region small{font-size:var(--text-xs);line-height:var(--leading-body)}
.osxhost-ord-rental{
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
gap:var(--space-4);
margin-block:var(--space-4);
padding:var(--space-4);
border-bottom:1px solid var(--line);
background:var(--paper);
color:var(--ink)
}
.osxhost-ord-rental .osxhost-ord-caption{margin:0}
.osxhost-ord-durations{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:var(--space-2);
flex:0 1 36rem;
min-width:0
}
.osxhost-ord-seg-btn{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
gap:var(--space-1);
width:100%;
min-width:0;
min-height:var(--control-height);
padding:var(--space-2) var(--space-3);
border:1px solid var(--line-strong);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
font-family:var(--font-body);
font-size:var(--text-sm);
font-weight:var(--weight-bold);
line-height:var(--leading-control);
text-align:center;
overflow-wrap:break-word;
cursor:pointer;
transition:background var(--duration),border-color var(--duration)
}
.osxhost-ord-seg-btn:hover{border-color:var(--control-line)}
.osxhost-ord-seg-btn.is-on,
.osxhost-ord-seg-btn[aria-checked="true"],
.osxhost-ord-seg-btn[aria-selected="true"]{
background:var(--ink);
color:var(--paper);
border-color:var(--ink)
}
.osxhost-ord-seg-btn small,
.osxhost-ord-seg-btn em{font-size:var(--text-xs);font-style:normal}
.osxhost-ord-completion{
display:block;
min-width:0;
padding-top:var(--space-3)
}
.osxhost-ord-expansion{
display:block;
margin:0;
padding:var(--space-4);
border:0;
border-radius:var(--radius-md);
background:var(--soft);
color:var(--ink)
}
.osxhost-ord-expansion-heading{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-3);
padding:0 0 var(--space-3);
cursor:pointer;
list-style:none
}
.osxhost-ord-expansion-heading::-webkit-details-marker{display:none}
.osxhost-ord-expansion-heading::after{
content:"+";
flex:none;
font-family:var(--font-mono);
font-size:var(--text-card)
}
.osxhost-ord-expansion[open]>.osxhost-ord-expansion-heading::after{content:"−"}
.osxhost-ord-expansion-heading .osxhost-ord-caption{margin:0}
.osxhost-ord-capacity{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));
gap:var(--space-2);
padding-top:var(--space-3);
border-top:1px solid var(--line-strong)
}
.osxhost-ord-network{
min-width:0;
margin:var(--space-4) 0 0;
padding:0;
border:0
}
.osxhost-ord-network-caption{
margin:0;
padding:0 0 var(--space-2);
font-size:var(--text-sm);
font-weight:var(--weight-bold);
line-height:var(--leading-body)
}
.osxhost-ord-interconnect{
display:grid;
grid-template-columns:1.125rem minmax(0,1fr) auto;
align-items:start;
gap:var(--space-2) var(--space-3);
padding:var(--space-4);
border:1px solid var(--line-strong);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
cursor:pointer
}
.osxhost-ord-interconnect:has(input:checked){border-color:var(--primary)}
.osxhost-ord-checkbox{
appearance:none;
width:1.125rem;
height:1.125rem;
margin:.2rem 0 0;
border:1px solid var(--control-line);
border-radius:var(--radius-sm);
background:var(--paper);
color:var(--ink);
cursor:pointer
}
.osxhost-ord-checkbox:checked{
border-color:var(--primary);
background:var(--primary);
color:var(--white);
box-shadow:inset 0 0 0 3px var(--paper)
}
.osxhost-ord-interconnect-title{
min-width:0;
font-size:var(--text-base);
line-height:var(--leading-body);
overflow-wrap:break-word
}
.osxhost-ord-interconnect-price{
min-width:0;
font-family:var(--font-mono);
font-style:normal;
font-size:var(--text-sm);
line-height:var(--leading-body)
}
.osxhost-ord-interconnect-hint{
grid-column:2/-1;
min-width:0;
color:var(--muted);
font-size:var(--text-sm);
line-height:var(--leading-body);
overflow-wrap:break-word
}
.osxhost-ord-proof{
display:grid;
gap:var(--space-4);
min-width:0;
margin-top:var(--space-6);
padding:var(--space-5) var(--space-4);
border-top:1px solid var(--line);
background:var(--paper);
color:var(--ink)
}
.osxhost-ord-proof>.osxhost-ord-caption{margin:0}
.osxhost-ord-specification{
min-width:0;
margin:0;
padding:var(--space-4);
border:1px solid var(--line-strong);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink)
}
.osxhost-ord-specification-legend{padding:0 var(--space-2)}
.osxhost-ord-specification-title{
margin:0;
font-family:var(--font-heading);
font-size:var(--text-card);
line-height:var(--leading-card);
font-weight:var(--weight-heavy)
}
.osxhost-ord-manifest{
display:grid;
grid-template-columns:minmax(7.5rem,12rem) minmax(12rem,1fr);
gap:var(--space-3) var(--space-4);
margin:0;
min-width:0
}
.osxhost-ord-manifest dt,
.osxhost-ord-manifest dd{
min-width:0;
margin:0;
font-size:var(--text-sm);
line-height:var(--leading-body);
overflow-wrap:break-word
}
.osxhost-ord-manifest dt{color:var(--muted)}
.osxhost-ord-manifest dd{font-family:var(--font-mono);font-weight:var(--weight-medium)}
.osxhost-ord-manifest-extra{display:contents}
.osxhost-ord-settlement{
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
gap:var(--space-4);
padding:var(--space-3) var(--space-4);
border-radius:var(--radius-md);
background:var(--ink);
color:var(--white)
}
.osxhost-ord-amount{display:grid;gap:var(--space-2);min-width:0;margin:0}
.osxhost-ord-amount dt{font-size:var(--text-sm);color:var(--code-muted)}
.osxhost-ord-amount dd{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-2);min-width:0;margin:0}
.osxhost-ord-total{font-family:var(--font-mono);font-size:var(--text-reading);font-weight:var(--weight-bold)}
.osxhost-ord-total-period{font-family:var(--font-mono);font-size:var(--text-sm);font-style:normal;color:var(--code-muted)}
.osxhost-ord-payment-actions,
.osxhost-ord-dialog-actions{
display:flex;
align-items:center;
justify-content:flex-start;
flex-wrap:wrap;
gap:var(--space-2);
min-width:0
}
.osxhost-ord-button{
display:inline-flex;
align-items:center;
justify-content:center;
gap:var(--space-2);
min-width:0;
min-height:var(--button-height);
padding:var(--space-2) var(--space-4);
border:1px solid transparent;
border-radius:var(--radius-pill);
font-family:var(--font-body);
font-size:var(--text-button);
font-weight:var(--weight-bold);
line-height:var(--leading-control);
text-align:center;
text-decoration:none;
white-space:normal;
overflow-wrap:break-word;
cursor:pointer;
transition:background var(--duration),border-color var(--duration),color var(--duration)
}
.osxhost-ord-button-primary{background:var(--ac-primary);color:var(--ac-on-primary);border-color:var(--ac-primary)}
.osxhost-ord-button-primary:hover{background:color-mix(in srgb,var(--ac-primary) 88%,var(--ink));color:var(--ac-on-primary)}
.osxhost-ord-button-ink{background:var(--ink);color:var(--white);border-color:var(--ink)}
.osxhost-ord-button-ink:hover{background:var(--muted);color:var(--white)}
.osxhost-ord-button-outline{background:var(--paper);color:var(--ink);border-color:var(--control-line)}
.osxhost-ord-button-outline:hover{background:var(--soft);color:var(--ink)}
.osxhost-ord-settlement .osxhost-ord-button-outline{background:var(--ink);color:var(--white);border-color:var(--code-muted)}
.osxhost-ord-settlement .osxhost-ord-button-outline:hover{background:var(--line-on-dark);color:var(--white)}
.osxhost-ord-button:disabled{opacity:.55;cursor:wait}
.osxhost-ord-payment-methods,
.osxhost-ord-security{display:block;min-width:0;font-size:var(--text-sm);line-height:var(--leading-body);color:var(--muted);overflow-wrap:break-word}
.osxhost-ord-security{margin-top:calc(var(--space-2) * -1)}
.osxhost-ord-payment-picker{
display:grid;
gap:var(--space-3);
min-width:0;
padding:var(--space-4);
border-radius:var(--radius-md);
background:var(--ice);
color:var(--ice-ink)
}
.osxhost-ord-runtime-title{margin:0;font-size:var(--text-card);line-height:var(--leading-card)}
.osxhost-ord-gateways{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:var(--space-3);min-width:0}
.osxhost-ord-gw-item{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--space-3);
width:100%;
min-width:0;
min-height:var(--control-height);
padding:var(--space-4);
border:1px solid var(--control-line);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
text-align:left;
cursor:pointer
}
.osxhost-ord-gw-item strong{min-width:0;font-size:var(--text-base);line-height:var(--leading-body);overflow-wrap:break-word}
.osxhost-ord-gw-item small{flex:none;font-family:var(--font-mono);font-size:var(--text-xs);color:var(--muted)}
.osxhost-ord-gw-item:hover{background:var(--soft);color:var(--ink);border-color:var(--ink)}
.osxhost-ord-gw-item:disabled{opacity:.55;cursor:wait}
.osxhost-ord-gateway-actions{display:flex;justify-content:flex-start;margin-top:var(--space-2)}
.osxhost-ord-ownership{
display:grid;
gap:var(--space-4);
min-width:0;
padding:var(--space-4);
border:1px solid var(--line-strong);
border-radius:var(--radius-md);
background:var(--soft);
color:var(--ink)
}
.osxhost-ord-ownership-lead{margin:0;font-size:var(--text-base);line-height:var(--leading-body)}
.osxhost-ord-email-entry{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:var(--field-gap);
align-content:start;
align-items:center;
min-width:0;
margin:0;
padding:0;
border:0
}
.osxhost-ord-field-label{display:block;min-width:0;padding:0 0 var(--field-gap);font-size:var(--text-sm);font-weight:var(--weight-bold)}
.osxhost-ord-code-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--field-gap);align-content:start;align-items:center;min-width:0}
.osxhost-ord-code-entry>.osxhost-ord-field-label{grid-column:1/-1;padding:0}
.osxhost-ord-input{
display:block;
width:100%;
min-width:0;
height:var(--control-height);
padding:var(--space-2) var(--space-3);
border:1px solid var(--control-line);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
font-family:var(--font-body);
font-size:var(--text-base);
line-height:var(--leading-control)
}
.osxhost-ord-input[aria-invalid="true"]{border-color:var(--primary)}
.osxhost-ord-code-input{font-family:var(--font-mono);letter-spacing:.14em}
.osxhost-ord-notice{
margin:0;
padding:var(--space-4);
border:1px solid var(--primary);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--primary);
font-size:var(--text-base);
line-height:var(--leading-body);
overflow-wrap:break-word
}
.osxhost-ord-notice.is-ok{border-color:var(--mint);background:var(--mint);color:var(--mint-ink)}
.osxhost-ord-order .is-mine{background:var(--ice);color:var(--ice-ink)}
.osxhost-ord-payment-picker.is-open,
.osxhost-ord-ownership.is-open{box-shadow:inset 3px 0 0 var(--primary)}
.osxhost-ord-dialog{
position:fixed;
inset:0;
z-index:100;
display:grid;
place-items:center;
padding:var(--gutter);
isolation:isolate
}
.osxhost-ord-dialog-backdrop{position:absolute;inset:0;background:color-mix(in srgb,var(--ink) 65%,transparent);color:var(--white)}
.osxhost-ord-dialog-panel{
position:relative;
display:grid;
gap:var(--space-3);
width:min(100%,32rem);
max-height:calc(100dvh - var(--gutter)*2);
overflow-y:auto;
padding:var(--space-5);
border-radius:var(--radius-md);
background:var(--paper);
color:var(--ink);
text-align:center;
box-shadow:var(--shadow-menu)
}
.osxhost-ord-dialog-kicker{
display:inline-flex;
align-items:center;
justify-content:center;
width:fit-content;
max-width:100%;
margin:0 auto var(--space-1);
padding:.4em .9em;
border-radius:var(--radius-pill);
background:var(--mint);
color:var(--mint-ink);
font-family:var(--font-mono);
font-size:var(--text-xs);
line-height:1
}
.osxhost-ord-dialog-title{margin:0;font-family:var(--font-heading);font-size:var(--text-card);line-height:var(--leading-card);overflow-wrap:break-word}
.osxhost-ord-dialog-body{margin:0;font-size:var(--text-base);line-height:var(--leading-body);color:var(--muted);overflow-wrap:break-word}
.osxhost-ord-dialog-panel .osxhost-ord-dialog-actions{justify-content:center;margin-top:var(--space-3)}
.osxhost-ord-dialog-panel .osxhost-ord-button-primary:hover{background:color-mix(in srgb,var(--ac-primary) 80%,var(--ink));color:var(--ac-on-primary)}
@media(max-width:760px){
.osxhost-ord-opening{margin-bottom:var(--space-4)}
.osxhost-ord-allocation{gap:var(--space-4)}
.osxhost-ord-machines{grid-template-columns:minmax(0,1fr)}
.osxhost-ord-destinations{grid-template-columns:repeat(2,minmax(0,1fr))}
.osxhost-ord-rental{display:grid;grid-template-columns:minmax(0,1fr)}
.osxhost-ord-durations{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
.osxhost-ord-capacity{grid-template-columns:minmax(0,1fr)}
.osxhost-ord-interconnect{grid-template-columns:1.125rem minmax(0,1fr)}
.osxhost-ord-interconnect-price{grid-column:2}
.osxhost-ord-interconnect-hint{grid-column:2}
.osxhost-ord-proof{margin-top:var(--space-5)}
.osxhost-ord-manifest{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--space-3)}
.osxhost-ord-settlement{align-items:flex-start;flex-direction:column}
.osxhost-ord-payment-actions{width:100%}
.osxhost-ord-payment-actions>.osxhost-ord-button{flex:1 1 100%}
.osxhost-ord-gateways{grid-template-columns:minmax(0,1fr)}
.osxhost-ord-email-entry,
.osxhost-ord-code-entry{grid-template-columns:minmax(0,1fr)}
.osxhost-ord-email-entry>.osxhost-ord-button,
.osxhost-ord-code-entry>.osxhost-ord-button{width:100%;margin-top:var(--space-2)}
.osxhost-ord-dialog-panel{padding:var(--space-4)}
.osxhost-ord-dialog-panel .osxhost-ord-dialog-actions>.osxhost-ord-button{flex:1 1 100%}
}
@media(max-width:390px){
.osxhost-ord-destinations{grid-template-columns:minmax(0,1fr)}
.osxhost-ord-manifest{grid-template-columns:minmax(0,1fr)}
.osxhost-ord-manifest dd{margin-bottom:var(--space-2)}
.osxhost-ord-manifest-extra{display:contents}
.osxhost-ord-allocation,
.osxhost-ord-expansion,
.osxhost-ord-specification,
.osxhost-ord-ownership,
.osxhost-ord-payment-picker{padding:var(--space-4)}
}
@media(prefers-reduced-motion:reduce){
.osxhost-ord-plan,
.osxhost-ord-region,
.osxhost-ord-seg-btn,
.osxhost-ord-button{transition:none}
}
body:has(> main[data-shell]){display:flex;flex-direction:column;min-height:100vh}
body > main[data-shell]{flex:1 0 auto}