/*
 * The platform's own surfaces: the storefront's canvas, its header and footer,
 * and the sign-up — including the step-by-step wizard and its card field.
 *
 * Moved here from shared-wp-parent, whose only remaining job was to hold it. No
 * tenant wore that theme; the storefront and the funnel simply borrowed its
 * stylesheet, so both went unstyled the moment the platform stopped wearing it.
 * Twice in one night.
 *
 * Not written to this theme's rules and not checked against them: it is a
 * transcription of an approved design, with its own colours, its own spacing
 * and media queries rather than container queries. blocks.css is the file that
 * answers to the design tests; this one answers to the mock.
 */
/* Platform landing page — approved Platform Site mock. */
:root{--ps-bg:#f3f2f2;--ps-ink:#191919;--ps-muted:#676565;--ps-rule:#d5d2d2;--ps-accent:#e05232;--ps-tint:#f7ddd5;--ps-go:#1a7f43}
body{background:var(--ps-bg);color:var(--ps-ink);font-family:Arial,Helvetica,sans-serif}.parent-shell,.ps-wrap{box-sizing:border-box;margin-inline:auto;max-width:1440px;padding-inline:clamp(18px,4.2vw,60px)}
.ps-notice{background:#191919;color:#d5d2d2;font-size:11px;letter-spacing:.15em;text-transform:uppercase}/* Both views draw this bar with .ps-wrap; the rule named a shell neither of
   them uses, so the row was never a flex row and the auto margin under it had
   nothing to push against -- which is why the link sat against the sentence
   instead of at the far end of the bar. */
.ps-notice .parent-shell,.ps-notice .ps-wrap{align-items:center;display:flex;gap:16px;justify-content:space-between;min-height:34px}.ps-notice a{color:#f2a58f;margin-left:auto;text-decoration:none}
.parent-header{background:rgba(243,242,242,.96);border-bottom:2px solid var(--ps-rule)}.parent-header__inner{min-height:70px}.parent-brand,.parent-brand a{font-family:Arial,Helvetica,sans-serif;font-size:20px;font-weight:800}.parent-menu{gap:0}.parent-menu__link{border-radius:0;font-size:14px;font-weight:400}.parent-button{background:var(--ps-ink);border:2px solid var(--ps-ink);border-radius:999px}.parent-link{font-size:14px;font-weight:400}
.ps-page{overflow:hidden}.ps-page p{color:var(--ps-muted);line-height:1.62}.ps-kicker,.ps-section-mark span{font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase}.ps-hero{display:grid;gap:clamp(28px,4vw,58px);grid-template-columns:1.05fr .95fr;padding-block:clamp(30px,5vw,72px)}.ps-hero h1,.ps-closing h2{font-size:clamp(48px,6.6vw,96px);letter-spacing:-.055em;line-height:.9;margin:15px 0 0}.ps-lead{font-size:clamp(16px,1.35vw,19px);max-width:46ch}.ps-promises{border-top:2px solid var(--ps-ink);display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:25px;max-width:520px;padding-top:16px}.ps-promises span{color:var(--ps-muted);font-size:13px}
.ps-address{background:#f8f7f7;border:2px solid var(--ps-ink);border-radius:24px;overflow:hidden}.ps-tabs{border-bottom:2px solid var(--ps-ink);display:flex}.ps-tabs button{background:transparent;border:0;border-right:2px solid var(--ps-ink);color:var(--ps-ink);cursor:pointer;flex:1;font-size:12px;font-weight:650;min-height:48px;padding:12px;text-align:left}.ps-tabs button:last-child{border:0}.ps-tabs button[aria-selected=true]{background:var(--ps-ink);color:#fff}.ps-address__body{padding:clamp(20px,2.2vw,28px)}.ps-address-form{align-items:end;display:grid;gap:10px;grid-template-columns:1fr auto;margin-top:15px}.ps-address-form label span{display:block;font-size:13px;font-weight:650;margin-bottom:7px}.ps-address input{background:#fff;border:1px solid #aaa;border-radius:999px;font-size:16px;min-height:46px;padding:10px 16px;width:100%}.ps-address-status{font-size:13px;font-weight:600;margin:10px 0}.ps-address-extra{border-top:1px solid var(--ps-rule);margin-top:15px}.ps-address-extra p{align-items:center;border-bottom:1px solid var(--ps-rule);display:grid;font-size:13px;grid-template-columns:1fr 1fr auto;margin:0;padding:9px 0}.ps-reassure{border-top:2px solid var(--ps-rule);font-size:13px;margin:20px 0 0;padding-top:14px}
.ps-btn{align-items:center;background:transparent;border:2px solid var(--ps-ink);border-radius:999px;color:var(--ps-ink);display:inline-flex;font-size:13px;font-weight:700;justify-content:center;min-height:44px;padding:10px 18px;text-decoration:none}.ps-btn--dark{background:var(--ps-ink);color:#fff}.ps-stats{background:var(--ps-ink);color:#fff}.ps-stat-grid{display:grid;gap:24px;grid-template-columns:repeat(4,1fr);padding-block:25px}.ps-stat-grid b{display:block;font-size:clamp(24px,2.5vw,35px);letter-spacing:-.04em}.ps-stat-grid span{color:#8f8c8c;display:block;font-size:10px;letter-spacing:.18em;margin-top:7px;text-transform:uppercase}
.ps-section{border-top:2px solid var(--ps-rule);padding-block:clamp(50px,7vw,94px)}.ps-section-mark{align-items:baseline;border-bottom:2px solid var(--ps-ink);display:flex;gap:13px;justify-content:center;margin-bottom:30px;padding-bottom:14px}.ps-section-mark b,.ps-rule-grid em,.ps-domain-grid em{color:var(--ps-accent);font-size:13px;font-style:normal}.ps-section h2,.ps-dashboard h2{font-size:clamp(30px,3.25vw,44px);letter-spacing:-.045em;line-height:1;margin:0;text-align:center}.ps-rule-grid{background:var(--ps-rule);display:grid;gap:2px;margin-top:34px}.ps-three,.ps-plans{grid-template-columns:repeat(3,1fr)}.ps-rule-grid article{background:var(--ps-bg);padding:28px}.ps-rule-grid article:first-child{padding-left:0}.ps-rule-grid h3,.ps-domain-grid h3{font-size:17px;margin:0}.ps-rule-grid p{font-size:14px}
.ps-dashboard{border-top:2px solid var(--ps-rule);display:grid;gap:50px;grid-template-columns:1fr 1fr;padding-bottom:90px;padding-top:35px}.ps-dashboard h2{text-align:left}.ps-dashboard p{max-width:43ch}.ps-tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.ps-tags span{background:#e4e1e1;border-radius:999px;font-size:12px;padding:7px 11px}.ps-dashboard-art{background:#d9d8d8;border:2px solid var(--ps-ink);border-radius:20px;min-height:330px;overflow:hidden;padding:24px}.ps-dashbar{background:#222;height:25px;margin:-24px -24px 25px}.ps-dashbody{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}.ps-dashbody i{background:#f4f3f3;border:1px solid #aaa;display:block;height:70px}
.ps-cycle{border:0;display:flex;gap:20px;justify-content:center;margin:24px 0 0}.ps-cycle label{font-size:13px}.ps-plans article{display:flex;flex-direction:column}.ps-plans .is-featured,.ps-domain-grid .is-featured{background:var(--ps-tint)}.ps-plans strong{font-size:clamp(34px,3.5vw,52px);letter-spacing:-.05em;margin-top:14px}.ps-plans small{color:var(--ps-muted)}.ps-plans ul{list-style:none;margin:8px 0 18px;padding:0}.ps-plans li{border-top:1px solid var(--ps-rule);font-size:13px;padding:8px 0}.ps-plans .ps-btn{align-self:start;margin-top:auto}.ps-fine{font-size:12px}
.ps-template-grid{display:grid;gap:2px;grid-template-columns:repeat(3,1fr);margin-top:34px}.ps-template-grid article{background:var(--ps-bg);padding:18px}.ps-template-grid b,.ps-template-grid small{display:block}.ps-template-grid b{font-size:15px;margin-top:12px}.ps-template-grid small{color:var(--ps-muted);margin-top:4px}.ps-template-art{align-items:center;aspect-ratio:4/3;background:#ddd;border:2px solid var(--ps-ink);display:flex;justify-content:center;overflow:hidden;position:relative}.ps-template-art:before,.ps-template-art:after{content:"";position:absolute}.ps-template-art:before{background:#222;height:18%;left:0;right:0;top:0}.ps-template-art:after{background:rgba(255,255,255,.7);bottom:14%;height:32%;left:10%;right:10%}.ps-template-art span{color:#777;font-size:64px;font-weight:900}.ps-template-art--2{background:#d6c6bb}.ps-template-art--3{background:#c9d1c4}.ps-template-art--4{background:#bfc8d0}.ps-template-art--5{background:#d8d0bf}
.ps-domain-grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);margin-top:34px}.ps-domain-grid article{background:#f8f7f7;border:2px solid var(--ps-rule);border-radius:22px;padding:26px}.ps-domain-grid article.is-featured{border-color:var(--ps-accent)}.ps-domain-grid header{align-items:start;display:flex;gap:10px;justify-content:space-between}.ps-domain-grid header span{font-size:10px;letter-spacing:.15em;text-transform:uppercase}.ps-domain-grid p,.ps-domain-grid li{font-size:13px}.ps-domain-grid ol{list-style-position:inside;margin:12px 0;padding:0}.ps-domain-grid li{border-top:1px solid var(--ps-rule);padding:8px 0}.ps-domain-grid article>small{color:var(--ps-muted);display:block;margin-top:5px}.ps-domain-grid .ps-btn{margin-top:15px}.ps-info{border:2px solid var(--ps-accent);border-radius:50%;color:var(--ps-accent);display:inline-grid;font-size:14px;height:28px;place-items:center;vertical-align:middle;width:28px}.ps-dns{border-top:2px solid var(--ps-rule);display:grid;gap:50px;grid-template-columns:1fr 1fr;margin-top:44px;padding-top:32px}.ps-dns h3{font-size:24px}.ps-dns-card{background:#f8f7f7;border:2px solid var(--ps-ink);padding:24px}.ps-dns-card header{border-bottom:2px solid var(--ps-rule);display:flex;justify-content:space-between;padding-bottom:12px}.ps-dns-card header span{background:var(--ps-tint);border-radius:999px;font-size:11px;padding:6px 9px}.ps-dns-card p{border-bottom:1px solid var(--ps-rule);display:grid;font-size:13px;grid-template-columns:20px 1fr auto;margin:0;padding:10px 0}.ps-dns-card em{font-style:normal}.ps-dns-card small{color:var(--ps-muted);display:block;margin-top:12px}.ps-facts{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px}.ps-facts div{border-right:2px solid var(--ps-rule);padding:18px}.ps-facts small,.ps-facts b{display:block}.ps-facts small{color:var(--ps-muted)}.ps-facts b{font-size:14px;margin-top:6px}
.ps-faq{border-top:2px solid var(--ps-rule);margin-top:30px}.ps-faq article{border-bottom:2px solid var(--ps-rule);display:grid;grid-template-columns:1fr 1fr;padding:20px 0}.ps-faq h3{font-size:17px;margin:0}.ps-faq p{font-size:14px;margin:0}.ps-closing{background:var(--ps-accent);color:#fff;padding-block:clamp(55px,7vw,105px);text-align:center}.ps-closing h2{font-size:clamp(45px,6.5vw,94px)}.ps-closing p{color:#fff;margin:18px auto;max-width:46ch}.ps-closing .ps-btn{margin:8px}.ps-btn--light{background:#fff;border-color:#fff;color:var(--ps-ink)}.ps-btn--outline-light{border-color:#fff;color:#fff}
.ps-footer{background:#191919;border:0;color:#c7c4c4;padding:0}.ps-footer__grid{display:grid;gap:32px;grid-template-columns:2fr repeat(3,1fr);padding-block:48px 32px}.ps-footer__grid>div{display:flex;flex-direction:column;gap:8px}.ps-footer__grid p{font-size:14px;line-height:1.5;max-width:32ch}.ps-footer__grid b{color:#888;font-size:10px;letter-spacing:.18em;text-transform:uppercase}.ps-footer__grid a{color:#c7c4c4;font-size:14px;text-decoration:none}.ps-footer__brand{color:#fff;font-size:18px}.ps-footer__bottom{border-top:2px solid #535151;display:flex;font-size:12px;justify-content:space-between;padding-block:17px 30px}
@media(max-width:850px){.ps-hero,.ps-dashboard,.ps-dns{grid-template-columns:1fr}.ps-three,.ps-plans,.ps-domain-grid{grid-template-columns:1fr}.ps-rule-grid article:first-child{padding-left:28px}.ps-template-grid{grid-template-columns:repeat(2,1fr)}.ps-facts{grid-template-columns:repeat(2,1fr)}.ps-stat-grid{grid-template-columns:repeat(2,1fr)}.ps-footer__grid{grid-template-columns:repeat(2,1fr)}.parent-menu{display:none}}
@media(max-width:560px){.ps-tabs{flex-direction:column}.ps-tabs button{border-bottom:2px solid var(--ps-ink);border-right:0}.ps-address-form{grid-template-columns:1fr}.ps-template-grid,.ps-faq article,.ps-footer__grid{grid-template-columns:1fr}.ps-facts{grid-template-columns:1fr}.ps-facts div{border-bottom:2px solid var(--ps-rule);border-right:0}.ps-footer__bottom{flex-direction:column;gap:8px}.parent-header__inner{gap:10px}.parent-header__actions{gap:4px}.parent-menu{display:none}.parent-link{display:none}}

/* The Codex page is a complete page from the mock, not content inside the
   currently active tenant design. These selectors deliberately outrank that
   theme's global heading, link, and constrained-layout rules. */
body.ps-standalone{background:var(--ps-bg);color:var(--ps-ink);font-family:Arial,Helvetica,sans-serif;margin:0}.ps-standalone .ps-page{margin:0;max-width:none;padding:0;width:100%}.ps-standalone .ps-page h1,.ps-standalone .ps-page h2,.ps-standalone .ps-page h3,.ps-standalone .ps-brand,.ps-standalone .ps-create{font-family:Arial,Helvetica,sans-serif}.ps-standalone .ps-page h1{font-weight:800}.ps-standalone .ps-page a{font-family:Arial,Helvetica,sans-serif}.ps-standalone .aws-share,.ps-standalone .aws-social,.ps-standalone .wp-block-post-title{display:none!important}
.ps-header{background:rgba(243,242,242,.98);border-bottom:2px solid #aaa;position:sticky;top:0;z-index:30}.ps-header__inner{align-items:center;display:flex;gap:28px;min-height:108px}.ps-brand{color:var(--ps-ink);font-size:22px;font-weight:800;letter-spacing:-.035em;text-decoration:none;white-space:nowrap}.ps-nav{display:flex;gap:28px}.ps-nav a,.ps-signin{color:#c42d17;font-size:15px;text-decoration:none;white-space:nowrap}.ps-nav{margin-right:auto}.ps-signin{order:3}/* Set down and in from the corner: the tail needs somewhere to hang, and the
   account menu is the next thing along -- a callout shoulder to shoulder with
   the way out looks like part of it. Shifted rather than laid out, so the row
   keeps its height and the tail travels with the box. */
.ps-create{background:#ef3218;border:2px solid var(--ps-ink);border-radius:10px;color:#fff;font-size:15px;font-weight:800;margin-right:64px;padding:6px 22px;position:relative;text-decoration:none;top:44px;white-space:nowrap}
/* The tail, so it reads as a callout about the panel underneath rather than a
   button that takes you somewhere. It hangs off the bottom edge of a sticky
   header, which is why it draws over what is below instead of adding height.
   Two of them: the dark one is the border carrying on round the point, and the
   red one sits just inside it, because a bordered box with a bare tail reads
   as a box with something stuck to it.

   Under the middle of the box, which is where a tail belongs unless there is
   a reason for it to be elsewhere.

   Drawn long rather than hung lower. A triangle pushed down the page leaves a
   gap between itself and the box it belongs to, which reads as something that
   has come loose; one that keeps its width and grows downward reaches further
   without ever letting go. */
.ps-create:before{border-left:13px solid transparent;border-right:13px solid transparent;border-top:26px solid var(--ps-ink);content:"";left:calc(50% - 13px);pointer-events:none;position:absolute;top:100%}
.ps-create:after{border-left:11px solid transparent;border-right:11px solid transparent;border-top:26px solid #ef3218;content:"";left:calc(50% - 11px);pointer-events:none;position:absolute;top:calc(100% - 3px)}
.ps-me{position:relative}.ps-me>summary{color:#c42d17;cursor:pointer;font-size:15px;list-style:none;white-space:nowrap}.ps-me>summary::-webkit-details-marker{display:none}.ps-me>summary::after{content:" \2304"}.ps-me[open]>summary::after{display:inline-block;transform:rotate(180deg)}.ps-me__panel{background:#fff;border:1px solid #d8d8d8;box-shadow:0 8px 24px rgba(0,0,0,.12);display:grid;min-width:190px;padding:6px;position:absolute;right:0;top:calc(100% + 12px);z-index:40}.ps-me__panel a{color:var(--ps-ink);display:block;font-size:15px;padding:9px 12px;text-decoration:none}.ps-me__panel a:hover{background:#f3f2f2}
@media(max-width:900px){.ps-header__inner{flex-wrap:wrap;gap:14px 20px;min-height:auto;padding-block:18px}.ps-nav{order:4;flex:1 0 100%;gap:18px;overflow:auto}.ps-signin{order:3}}
@media(max-width:560px){.ps-header{position:static}.ps-header__inner{align-items:flex-start}.ps-brand{font-size:18px}.ps-signin{display:none}.ps-create{font-size:12px;margin-left:auto;padding:12px}.ps-create:after{display:none}.ps-nav{font-size:12px}.ps-hero{padding-top:35px}.ps-hero h1{font-size:48px}}

/* Codex2 keeps the Widget Kit's block markup and behavior. This page-scoped
   skin maps those blocks onto the approved Platform composition. */
.ps-kit-page{--wp--preset--font-family--heading:Arial,Helvetica,sans-serif;--wp--preset--font-family--body:Arial,Helvetica,sans-serif;--wp--preset--color--background:var(--ps-bg);--wp--preset--color--ink:var(--ps-ink);--wp--preset--color--accent:#ef3218;--wp--preset--color--accent-2:var(--ps-tint)}
.ps-kit-page .ps-kit-content{background:var(--ps-bg);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(420px,.85fr);padding-top:clamp(30px,4vw,60px)}
/* Jumped to from the menu above, which is sticky: without room kept for it
   the heading lands underneath the header and the section reads as starting
   at its second line. */
.ps-kit-page .ps-kit-content>section[id]{scroll-margin-top:130px}

.ps-kit-page .ps-kit-content>section{box-sizing:border-box;font-family:Arial,Helvetica,sans-serif;grid-column:1/-1;margin:0;max-width:none;width:100%}.ps-kit-page .ps-kit-content>section:first-child{grid-column:1;padding-left:max(clamp(18px,4.2vw,60px),calc((100vw - 1440px)/2 + 60px));padding-right:clamp(24px,3vw,52px)}.ps-kit-page .ps-kit-content>.aws-address{grid-column:2;padding-left:0;padding-right:max(clamp(18px,4.2vw,60px),calc((100vw - 1440px)/2 + 60px))}
.ps-kit-page .aws-hero,.ps-kit-page .aws-address{align-self:start;background:transparent!important;min-height:370px;padding-bottom:55px;padding-top:15px}.ps-kit-page .aws-hero__inner,:is(.ps-kit-page,.aws-ordering) .aws-address__inner{margin:0;max-width:none;padding:0}.ps-kit-page .aws-hero__heading{font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(58px,5.8vw,92px)!important;font-weight:800!important;letter-spacing:-.06em!important;line-height:.88!important;margin:18px 0!important;max-width:14ch}.ps-kit-page .aws-hero__lede{color:var(--ps-muted);font-family:Arial,Helvetica,sans-serif;font-size:17px;line-height:1.55;max-width:45ch}.ps-kit-page .aws-hero .aws-tag{background:transparent;border-radius:0;color:#747171;font-family:Arial,Helvetica,sans-serif;font-size:10px;letter-spacing:.2em;padding:0;text-transform:uppercase}.ps-kit-page .aws-hero__actions{display:none}.ps-kit-page .aws-hero__actions:has(a[href="/start/"]){display:flex;margin-top:22px}.ps-kit-page .aws-hero__actions a[href="/start/"]{display:none}.ps-kit-page .aws-hero__actions a[href="#"]{display:none}.ps-kit-page .aws-hero__proof{border-top:2px solid var(--ps-ink);font-family:Arial,Helvetica,sans-serif;font-size:12px;list-style:none;margin-top:24px;max-width:500px;padding:14px 0 0}.ps-kit-page .aws-hero__proof li{margin:0}
:is(.ps-kit-page,.aws-ordering) .aws-address__inner{background:#f8f7f7;border:2px solid var(--ps-ink);border-radius:24px;overflow:hidden}:is(.ps-kit-page,.aws-ordering) .aws-address__ways{border-bottom:2px solid var(--ps-ink);display:grid;gap:0;grid-auto-flow:column;grid-auto-columns:1fr;margin:0}:is(.ps-kit-page,.aws-ordering) .aws-address__ways .aws-chip{background:transparent;border:0;border-radius:0;border-right:2px solid var(--ps-ink);font-family:Arial,Helvetica,sans-serif;font-size:15px;font-weight:700;justify-content:center;min-height:52px;padding:14px;text-align:center}:is(.ps-kit-page,.aws-ordering) .aws-address__ways .aws-chip:last-child{border-right:0}:is(.ps-kit-page,.aws-ordering) .aws-address__ways .aws-chip.is-on{background:var(--ps-ink);color:#fff}:is(.ps-kit-page,.aws-ordering) .aws-address__ask{align-items:center;display:grid;gap:0;grid-template-columns:minmax(0,1fr) auto auto;margin:0;padding:70px 24px 10px}:is(.ps-kit-page,.aws-ordering) .aws-address__value{border:1px solid #aaa;border-radius:999px 0 0 999px;border-right:0;font-family:Arial,Helvetica,sans-serif;font-size:15px;grid-column:1;grid-row:1;min-height:45px;padding:10px 16px}:is(.ps-kit-page,.aws-ordering) .aws-address__suffix{color:var(--ps-muted);font-size:13px;grid-column:1/-1;grid-row:2;margin:6px 0 0;padding-left:16px;pointer-events:none}:is(.ps-kit-page,.aws-ordering) .aws-address__check,:is(.ps-kit-page,.aws-ordering) .aws-address__on{background:var(--ps-ink);border-radius:999px;color:#fff;font-family:Arial,Helvetica,sans-serif}:is(.ps-kit-page,.aws-ordering) .aws-address__check{border-radius:0 999px 999px 0;grid-column:2;grid-row:1;margin-left:-1px;min-height:45px}:is(.ps-kit-page,.aws-ordering) .aws-address__check:disabled{cursor:not-allowed;opacity:.45}:is(.ps-kit-page,.aws-ordering) .aws-address__mark{align-self:center;display:inline-block;grid-column:3;grid-row:1;line-height:0;margin-left:10px;position:relative}:is(.ps-kit-page,.aws-ordering) .aws-address__why{background:transparent;border:2px solid var(--ps-go);border-radius:50%;color:var(--ps-go);cursor:pointer;display:inline-grid;font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:700;height:24px;line-height:1;padding:0;place-items:center;width:24px}:is(.ps-kit-page,.aws-ordering) .aws-address__why[aria-expanded="true"]{background:var(--ps-go);color:#fff}
/* The note opens above the mark rather than below it: the card clips what
   leaves it, and the room is overhead. */
:is(.ps-kit-page,.aws-ordering) .aws-address__note{background:var(--ps-ink);border-radius:12px;bottom:calc(100% + 10px);color:#fff;display:block;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.45;padding:11px 13px;position:absolute;right:-6px;width:250px;z-index:5}:is(.ps-kit-page,.aws-ordering) .aws-address__note:after{border:7px solid transparent;border-top-color:var(--ps-ink);content:"";position:absolute;right:12px;top:100%}:is(.ps-kit-page,.aws-ordering) .aws-address__mark[hidden],:is(.ps-kit-page,.aws-ordering) .aws-address__note[hidden]{display:none}
:is(.ps-kit-page,.aws-ordering) .aws-address__said,:is(.ps-kit-page,.aws-ordering) .aws-address__go{font-family:Arial,Helvetica,sans-serif;margin:0;padding:4px 24px}:is(.ps-kit-page,.aws-ordering) .aws-address__go{padding-top:12px}
/* On a page of its own the panel decides its own width. The storefront has a
   column that decides it, and the rule above takes the kit's wide container
   off the card either way — which on any other page left it edge to edge. */
body:not(.ps-kit-page) .aws-address.aws-ordering{padding-inline:var(--wp--preset--spacing--4)}body:not(.ps-kit-page) .aws-address.aws-ordering .aws-address__inner{margin-inline:auto;max-width:640px}

.ps-kit-page .aws-stats{background:var(--ps-ink)!important;color:#fff;margin-top:0}.ps-kit-page .aws-stats__inner{max-width:1440px;padding:25px clamp(18px,4.2vw,60px)}.ps-kit-page .aws-stats__list{display:grid;grid-template-columns:repeat(4,1fr)}.ps-kit-page .aws-stat{display:flex;flex-direction:column}.ps-kit-page .aws-stat__figure{font-family:Arial,Helvetica,sans-serif;font-size:34px;font-weight:800;letter-spacing:-.04em;margin:0;order:1}.ps-kit-page .aws-stat__label{color:#999;font-size:10px;letter-spacing:.18em;order:2;text-transform:uppercase}
.ps-kit-page .aws-steps,.ps-kit-page .aws-split,.ps-kit-page .aws-plans,.ps-kit-page .aws-kinds,.ps-kit-page .aws-cards,.ps-kit-page .aws-goal,.ps-kit-page .aws-asked{background:var(--ps-bg)!important;border-top:2px solid var(--ps-rule);padding:clamp(55px,6vw,90px) clamp(18px,4.2vw,60px)}.ps-kit-page :is(.aws-steps__inner,.aws-split__inner,.aws-tiers__inner,.aws-cards__inner,.aws-goal__inner,.aws-asked__inner){margin-inline:auto;max-width:1320px}.ps-kit-page :is(.aws-steps__heading,.aws-split__heading,.aws-tiers__heading,.aws-cards__heading,.aws-goal__heading,.aws-asked__heading){font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(30px,3.2vw,44px)!important;font-weight:800!important;letter-spacing:-.045em!important;line-height:1!important}.ps-kit-page .aws-steps__heading,.ps-kit-page .aws-tiers__heading,.ps-kit-page .aws-cards__bar,.ps-kit-page .aws-asked__heading{text-align:center}.ps-kit-page .aws-steps__list{border-top:2px solid var(--ps-ink);display:grid;grid-template-columns:repeat(3,1fr);margin-top:30px}.ps-kit-page .aws-step{border-right:2px solid var(--ps-rule);padding:28px}.ps-kit-page .aws-step__title{font-family:Arial,Helvetica,sans-serif!important}.ps-kit-page .aws-step__body{color:var(--ps-muted);font-family:Arial,Helvetica,sans-serif}
.ps-kit-page .aws-band{background:#ef3218!important;color:#fff;padding:70px 20px;text-align:center}.ps-kit-page .aws-band__heading{font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(48px,6vw,88px)!important;font-weight:800!important;letter-spacing:-.055em!important}.ps-kit-page .aws-band__body{color:#fff}.ps-kit-page .aws-band .aws-btn{border:2px solid #fff;border-radius:999px;font-family:Arial,Helvetica,sans-serif}
@media(max-width:850px){.ps-kit-page .ps-kit-content{display:block}.ps-kit-page .ps-kit-content>section:first-child,.ps-kit-page .ps-kit-content>.aws-address{padding-inline:clamp(18px,4.2vw,60px)}.ps-kit-page .aws-hero,.ps-kit-page .aws-address{min-height:0}.ps-kit-page .aws-stats__list{grid-template-columns:repeat(2,1fr);gap:25px}.ps-kit-page .aws-steps__list{grid-template-columns:1fr}.ps-kit-page .aws-step{border-bottom:2px solid var(--ps-rule);border-right:0}}
@media(max-width:560px){:is(.ps-kit-page,.aws-ordering) .aws-address__ways{grid-auto-flow:row;grid-template-columns:1fr}:is(.ps-kit-page,.aws-ordering) .aws-address__ways .aws-chip{border-bottom:2px solid var(--ps-ink);border-right:0}:is(.ps-kit-page,.aws-ordering) .aws-address__ask{grid-template-columns:minmax(0,1fr) auto;padding-top:30px;row-gap:10px}:is(.ps-kit-page,.aws-ordering) .aws-address__value{border-radius:999px;border-right:1px solid #aaa;grid-column:1/-1}:is(.ps-kit-page,.aws-ordering) .aws-address__check{border-radius:999px;grid-column:1;grid-row:3;margin-left:0}:is(.ps-kit-page,.aws-ordering) .aws-address__mark{grid-column:2;grid-row:3;justify-self:end;margin-left:12px}:is(.ps-kit-page,.aws-ordering) .aws-address__suffix{margin:6px 0}.ps-kit-page .aws-stats__list{grid-template-columns:1fr 1fr}}
:is(.ps-kit-page,.aws-ordering) .ps-domain-results{border-top:2px solid var(--ps-rule);margin:12px 24px 24px}:is(.ps-kit-page,.aws-ordering) .ps-domain-results[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-domain-results>div{align-items:center;border-bottom:1px solid var(--ps-rule);display:grid;gap:12px;grid-template-columns:minmax(8rem,1fr) minmax(0,auto) auto;overflow:hidden;padding:14px 0;position:relative}:is(.ps-kit-page,.aws-ordering) .ps-domain-results strong,:is(.ps-kit-page,.aws-ordering) .ps-domain-results span{font-family:Arial,Helvetica,sans-serif;font-size:13px}
/* A name is as long as it is — dallas.citytrainingschool.com is a real
   address — and the column it sits in is the one that gives way, rather than
   the name running underneath its own price. */
:is(.ps-kit-page,.aws-ordering) .ps-domain-results strong{min-width:0;overflow-wrap:anywhere}:is(.ps-kit-page,.aws-ordering) .ps-domain-results>div>span{min-width:0;text-align:right}:is(.ps-kit-page,.aws-ordering) .ps-domain-results span{color:var(--ps-muted)}:is(.ps-kit-page,.aws-ordering) .ps-domain-results__choose{background:var(--ps-ink);border-radius:999px;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:700;padding:8px 14px;text-decoration:none}
:is(.ps-kit-page,.aws-ordering) .ps-address-selected{background:var(--ps-tint);border:1px solid var(--ps-accent);border-radius:12px;color:var(--ps-ink);font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:700;margin:14px 24px 24px;padding:12px 14px}:is(.ps-kit-page,.aws-ordering) .ps-address-selected[hidden]{display:none}
:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard{background:var(--ps-bg);border-top:2px solid var(--ps-ink);grid-column:1/-1;padding:clamp(40px,6vw,80px) clamp(18px,4.2vw,60px)}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard__head{margin:0 auto 25px;max-width:1320px;text-align:center}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard__head h2{font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(30px,3.2vw,44px);letter-spacing:-.045em;margin:10px 0}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard__body{margin:auto;max-width:1320px}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard__frame{background:var(--ps-bg);border:0;display:block;min-height:720px;width:100%}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard__loading,:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard__error{font-family:Arial,Helvetica,sans-serif;text-align:center}
:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard--inside{background:#f8f7f7;border:0;padding:22px 24px 26px}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard--inside .ps-inline-wizard__head{border-bottom:2px solid var(--ps-rule);margin-bottom:12px;text-align:left}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard--inside .ps-inline-wizard__head h2{font-size:24px;margin:8px 0 14px}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard--inside .parent-signup-form{background:transparent;margin:0;max-width:none;padding:10px 0 0;width:100%}:is(.ps-kit-page,.aws-ordering) .ps-inline-wizard--inside .parent-signup-form__panel{max-width:none}
:is(.ps-kit-page,.aws-ordering) .ps-codex-form{background:transparent;font-family:Arial,Helvetica,sans-serif}:is(.ps-kit-page,.aws-ordering) .ps-codex-form section{display:grid;gap:14px}:is(.ps-kit-page,.aws-ordering) .ps-codex-form section[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-form h3,:is(.ps-kit-page,.aws-ordering) .ps-codex-result h3{font-family:Arial,Helvetica,sans-serif!important;font-size:24px;margin:4px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-form label{display:grid;font-size:13px;font-weight:700;gap:6px}:is(.ps-kit-page,.aws-ordering) .ps-codex-form input:not([type=radio]):not([type=checkbox]),:is(.ps-kit-page,.aws-ordering) .ps-codex-form select{background:#f8f7f7;border:1px solid #999;border-radius:6px;font:inherit;padding:12px;width:100%}:is(.ps-kit-page,.aws-ordering) .ps-codex-progress{color:#666;font-size:12px;letter-spacing:.14em;margin-bottom:14px;text-transform:uppercase}:is(.ps-kit-page,.aws-ordering) .ps-codex-address{border-bottom:1px solid #bbb;font-weight:700;margin:0 0 5px;padding-bottom:12px}:is(.ps-kit-page,.aws-ordering) .ps-codex-check{align-items:center;display:flex!important;font-weight:400!important}:is(.ps-kit-page,.aws-ordering) .ps-codex-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval{display:flex;gap:18px}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval label{display:flex;gap:6px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plans{display:grid;gap:10px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan{border:1px solid #aaa;border-radius:8px;cursor:pointer;display:flex!important;gap:10px;padding:12px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row{display:grid;grid-template-columns:minmax(0,1fr) auto;margin-bottom:10px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row .ps-codex-plan{border-radius:8px 0 0 8px;border-right:0;grid-column:1;grid-row:1;margin:0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-detail{background:transparent;border:1px solid #aaa;border-left:0;border-radius:0 8px 8px 0;cursor:pointer;font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:700;grid-column:2;grid-row:1;padding:0 14px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-detail[aria-expanded=true]{background:var(--ps-ink);color:#fff}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-lines{border:1px solid var(--ps-rule);border-radius:8px;font-size:13px;grid-column:1/-1;grid-row:2;list-style:none;margin:6px 0 0;padding:12px 16px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-lines li{padding:3px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-lines[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan:has(input:checked){border:2px solid var(--ps-blue);padding:11px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan span{display:grid;gap:4px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan small{font-weight:400}:is(.ps-kit-page,.aws-ordering) .ps-codex-actions{display:flex;justify-content:center;gap:12px;margin-top:20px}:is(.ps-kit-page,.aws-ordering) .ps-codex-error{align-items:center;background:#fff0f0;border:1px solid #b32d2e;border-radius:6px;color:#8a1f20;display:flex;gap:12px;justify-content:space-between;margin-bottom:14px;padding:10px}:is(.ps-kit-page,.aws-ordering) .ps-codex-error[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-error .parent-button{flex:none;font-size:12px;min-height:34px;padding:6px 14px;white-space:nowrap}:is(.ps-kit-page,.aws-ordering) .ps-codex-result{font-family:Arial,Helvetica,sans-serif;padding:12px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-payment{display:grid;font-family:Arial,Helvetica,sans-serif;gap:14px;padding:10px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-payment h3{font-family:Arial,Helvetica,sans-serif!important;font-size:24px;margin:0}:is(.ps-kit-page,.aws-ordering) #ps-codex-payment-element{background:#f8f7f7;border:1px solid #aaa;border-radius:8px;padding:14px}:is(.ps-kit-page,.aws-ordering) .ps-codex-payment>.parent-button{justify-self:center;margin-top:6px;min-width:220px}@media(max-width:620px){:is(.ps-kit-page,.aws-ordering) .ps-codex-grid{grid-template-columns:1fr}:is(.ps-kit-page,.aws-ordering) .ps-codex-actions .parent-button{min-width:0}}
:is(.ps-kit-page,.aws-ordering) .ps-codex-account-tabs{border-bottom:1px solid #aaa;display:flex;gap:4px}:is(.ps-kit-page,.aws-ordering) .ps-codex-account-tabs button{background:transparent;border:0;border-bottom:3px solid transparent;cursor:pointer;font:inherit;padding:9px 12px}:is(.ps-kit-page,.aws-ordering) .ps-codex-account-tabs button.is-on{border-color:var(--ps-blue);font-weight:700}:is(.ps-kit-page,.aws-ordering) [data-account-pane]{display:grid;gap:14px}:is(.ps-kit-page,.aws-ordering) [data-account-pane][hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-auth-status{color:#555;font-size:13px;margin:0;min-height:18px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-dns{border-block:1px solid #aaa;display:grid;gap:8px;grid-template-columns:auto minmax(0,1fr);margin:18px 0;padding:16px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-dns span{color:#666;font-size:12px;font-weight:700;text-transform:uppercase}:is(.ps-kit-page,.aws-ordering) .ps-codex-dns code{background:#eee;border-radius:4px;overflow-wrap:anywhere;padding:4px 7px}:is(.ps-kit-page,.aws-ordering) .ps-codex-verify-status{color:#555;min-height:20px}:is(.ps-kit-page,.aws-ordering) .ps-codex-result>[data-codex-verify]{display:block;margin:12px auto 0}
:is(.ps-kit-page,.aws-ordering) .ps-codex-redirect{align-items:center;display:flex;justify-content:center;min-height:280px;width:100%}:is(.ps-kit-page,.aws-ordering) .ps-codex-redirect span{animation:ps-codex-spin .75s linear infinite;border:4px solid #d5d5d5;border-radius:50%;border-top-color:var(--ps-blue);height:42px;width:42px}@keyframes ps-codex-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){:is(.ps-kit-page,.aws-ordering) .ps-codex-redirect span{animation-duration:1.5s}}
:is(.ps-kit-page,.aws-ordering) .ps-codex-new-card{background:transparent;border:0;color:var(--ps-blue);cursor:pointer;font:inherit;font-weight:700;justify-self:start;padding:2px 0;text-decoration:underline}:is(.ps-kit-page,.aws-ordering) #ps-codex-card-element{background:#f8f7f7;border:1px solid #aaa;border-radius:8px;padding:16px}:is(.ps-kit-page,.aws-ordering) #ps-codex-card-element[hidden]{display:none}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog{background:#f8f7f7;border:2px solid var(--ps-ink);border-radius:18px;box-shadow:0 24px 70px rgb(0 0 0 / 28%);color:var(--ps-ink);font-family:Arial,Helvetica,sans-serif;margin:auto;max-height:min(720px,calc(100dvh - 40px));max-width:min(1400px,calc(100vw - 32px));padding:0;width:100%}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog::backdrop{background:rgb(16 21 23 / 58%);backdrop-filter:blur(2px)}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__head{align-items:flex-start;border-bottom:1px solid var(--ps-rule);display:flex;gap:20px;justify-content:space-between;padding:24px 24px 18px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__head small{color:var(--ps-muted);font-size:10px;font-weight:700;letter-spacing:.17em;text-transform:uppercase}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__head h3{font-family:Arial,Helvetica,sans-serif!important;font-size:26px;margin:5px 0 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__close{align-items:center;background:transparent;border:1px solid var(--ps-rule);border-radius:50%;color:var(--ps-ink);cursor:pointer;display:flex;flex:0 0 36px;font-size:25px;height:36px;justify-content:center;line-height:1;padding:0;width:36px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__close:hover,:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__close:focus-visible{background:var(--ps-ink);color:#fff}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plans{display:grid;gap:12px;grid-auto-columns:minmax(220px,1fr);grid-auto-flow:column;overflow-x:auto;padding:20px 24px 10px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan{background:#fff;border:1px solid var(--ps-rule);border-radius:12px;display:flex;flex-direction:column;min-width:0;padding:18px;position:relative}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan.is-selected{background:#eef1ff;border:2px solid var(--ps-blue);padding:17px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__selected{background:var(--ps-blue);border-radius:999px;color:#fff;font-size:10px;font-weight:700;padding:5px 8px;position:absolute;right:10px;top:10px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__name{align-items:center;display:flex;gap:7px;margin:0 0 18px;padding-right:96px;position:relative}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan h4{font-family:Arial,Helvetica,sans-serif!important;font-size:18px;margin:0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__info{align-items:center;background:transparent;border:1px solid var(--ps-ink);border-radius:50%;cursor:help;display:inline-flex;flex:0 0 20px;font:700 12px/1 Arial,Helvetica,sans-serif;height:20px;justify-content:center;padding:0;width:20px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__description{background:var(--ps-ink);border-radius:8px;color:#fff;display:none;font-size:12px;left:0;line-height:1.45;padding:9px 11px;position:absolute;top:calc(100% + 7px);width:210px;z-index:4}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__name:has(.ps-codex-plan-dialog__info:hover) .ps-codex-plan-dialog__description,:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__name:has(.ps-codex-plan-dialog__info:focus-visible) .ps-codex-plan-dialog__description{display:block}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan>strong{font-size:20px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan>small{color:var(--ps-muted);font-size:11px;margin-top:2px;text-transform:capitalize}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan ul{list-style:none;margin:14px 0 0;padding:0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan li{align-items:flex-start;border-top:1px solid var(--ps-rule);display:flex;font-size:12px;gap:8px;line-height:1.4;padding:9px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan li::before{color:var(--ps-go);content:"\2713";font-weight:800}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan li.ps-codex-plan-dialog__includes{color:var(--ps-muted);font-weight:700}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog__plan li.ps-codex-plan-dialog__includes::before{content:"+"}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-dialog>[data-codex-detail-done]{display:flex;margin:16px auto 24px;min-width:150px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-form .ps-codex-plan-step{align-items:center;grid-template-columns:minmax(0,1fr) auto}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-step>h3{grid-column:1;grid-row:1}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-step>.ps-codex-interval{border:1px solid var(--ps-ink);border-radius:999px;display:inline-flex;gap:0;grid-column:2;grid-row:1;justify-self:end;overflow:hidden}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval label{cursor:pointer;display:block;position:relative}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval input{block-size:1px;clip:rect(0 0 0 0);clip-path:inset(50%);inline-size:1px;margin:-1px;position:absolute}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval span{display:block;font-size:12px;padding:9px 14px}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval label+label{border-left:1px solid var(--ps-ink)}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval input:checked+span{background:var(--ps-ink);color:#fff}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval input:focus-visible+span{box-shadow:inset 0 0 0 2px var(--ps-blue)}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-step>.ps-codex-plans{grid-column:1/-1}@media(max-width:520px){:is(.ps-kit-page,.aws-ordering) .ps-codex-form .ps-codex-plan-step{grid-template-columns:1fr}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-step>.ps-codex-interval{grid-column:1;grid-row:2;justify-self:stretch}:is(.ps-kit-page,.aws-ordering) .ps-codex-interval label{flex:1;text-align:center}}
/* Selection belongs to the joined card and Detail control as one unit. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row:has(input:checked){border:2px solid var(--parent-primary);border-radius:8px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row:has(input:checked) .ps-codex-plan,:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row:has(input:checked) .ps-codex-plan-detail{border:0}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row:has(input:checked) .ps-codex-plan{padding:12px}:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-row:has(input:checked) .ps-codex-plan-detail{border-left:1px solid var(--parent-primary)}
:is(.ps-kit-page,.aws-ordering) .aws-address__inner.is-wizard:after{display:none}
@media(max-width:560px){:is(.ps-kit-page,.aws-ordering) .ps-domain-results>div{grid-template-columns:1fr auto}:is(.ps-kit-page,.aws-ordering) .ps-domain-results__choose{grid-column:1/-1;text-align:center}}

:root {
	--parent-bg: #f7f7f4;
	--parent-border: #dcdcda;
	--parent-ink: #101517;
	--parent-muted: #586164;
	--parent-primary: #3858e9;
	--parent-primary-dark: #2942bb;
	--parent-surface: #fff;
	--parent-cta-bg: #c9d0ff;
	--parent-hero-size: 98px;
	--parent-heading-size: 62px;
	--parent-lead-size: 24px;
	--parent-card-size: 28px;
	--parent-body-size: 17px;
	--parent-button-size: 15px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	background: var(--parent-bg);
	color: var(--parent-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	margin: 0;
}

a { color: inherit; }

/*
 * The page fills the window and the last block part — the footer — takes the
 * slack, so a short page ends with the footer on the bottom edge instead of
 * leaving it stranded halfway up with blank space beneath it.
 */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
	padding: 0;
}

.wp-site-blocks > .wp-block-template-part:last-child { margin-top: auto; }

.parent-shell {
	margin: 0 auto;
	max-width: 1240px;
	padding-left: 28px;
	padding-right: 28px;
}

.parent-header {
	background: rgba(247, 247, 244, .94);
	border-bottom: 1px solid var(--parent-border);
	position: sticky;
	top: 0;
	z-index: 20;
}

.parent-header__inner {
	align-items: center;
	display: flex;
	justify-content: space-between;
	min-height: 72px;
}

/* The site title arrives in two shapes: the site-title block wraps the link in
   an element carrying the class, while the account and signup pages put the
   class straight on the link. Styling only the descendant left those pages with
   a plain underlined link. */
.parent-brand,
.parent-brand a {
	color: inherit;
	font-size: 21px;
	font-weight: 750;
	letter-spacing: -.04em;
	text-decoration: none;
}

.parent-header__actions {
	align-items: center;
	display: flex;
	gap: 12px;
}

.parent-menu {
	align-items: center;
	display: flex;
	flex: 1 1 auto;
	gap: 4px;
	margin-left: 28px;
}

.parent-menu__link {
	border-radius: 6px;
	color: var(--parent-muted);
	font-size: 15px;
	font-weight: 600;
	padding: 8px 12px;
	text-decoration: none;
	white-space: nowrap;
}

.parent-menu__link:hover { background: rgba(16, 21, 23, .05); color: var(--parent-ink); }

/* Taken out of the page but left in the accessibility tree. The signup form's
   questions are answered by controls that describe themselves, so their legends
   are read but not shown — removing them outright would leave a screen reader
   with three unlabelled groups. */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

/* An element carrying [hidden] must stay hidden even when a later rule sets
   display: the attribute is a user-agent style and loses to author CSS,
   which left buttons clickable while they were meant to be hidden. */
[hidden] { display: none !important; }

.parent-button {
	border-radius: 6px;
	display: inline-flex;
	font-size: var(--parent-button-size);
	font-weight: 650;
	justify-content: center;
	line-height: 1;
	padding: 14px 20px;
	text-decoration: none;
}

.parent-link {
	align-items: center;
	display: inline-flex;
	font-size: var(--parent-button-size);
	font-weight: 650;
	padding-left: 10px;
	padding-right: 10px;
	text-decoration: none;
}

.parent-button {
	background: var(--parent-primary);
	color: #fff;
}

.parent-button:hover { background: var(--parent-primary-dark); color: #fff; }

.parent-button--outline {
	background: transparent;
	border: 1px solid var(--parent-ink);
	color: var(--parent-ink);
}

.parent-hero {
	padding-bottom: 40px;
	padding-top: 40px;
	text-align: center;
}

.parent-eyebrow {
	color: var(--parent-primary);
	font-size: 14px;
	font-weight: 750;
	letter-spacing: .08em;
	/* It is a paragraph, so its default top margin stacked on the section's
	   own padding and pushed the hero down twice. */
	margin-top: 0;
	text-transform: uppercase;
}

.parent-hero h1 {
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(52px, 8vw, var(--parent-hero-size));
	font-weight: 400;
	letter-spacing: -.06em;
	line-height: .96;
	margin: 22px auto 28px;
	max-width: 1050px;
}

.parent-hero__lead {
	color: var(--parent-muted);
	font-size: clamp(19px, 2.2vw, var(--parent-lead-size));
	line-height: 1.5;
	margin: 0 auto;
	max-width: 720px;
}

.parent-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	margin-top: 38px;
}

.parent-hero__note {
	color: var(--parent-muted);
	font-size: 14px;
	/* Last thing in the section, so its default bottom margin sat on top of the
	   section's padding the way the eyebrow's did at the other end. */
	margin-bottom: 0;
	margin-top: 18px;
}

.parent-options {
	background: var(--parent-ink);
	color: #fff;
	padding-bottom: 96px;
	padding-top: 96px;
}

.parent-section-heading { margin-bottom: 40px; max-width: 700px; }

.parent-section-heading h2 {
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(38px, 5vw, var(--parent-heading-size));
	font-weight: 400;
	letter-spacing: -.04em;
	line-height: 1.05;
	margin: 0 0 18px;
}

.parent-section-heading p { color: #b8c0c2; font-size: 18px; line-height: 1.6; }

.parent-card-grid {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.parent-card {
	background: #1b2225;
	border: 1px solid #343c3f;
	border-radius: 14px;
	padding: 34px;
}

.parent-card__number { color: #8da0ff; font-size: 14px; font-weight: 750; }
.parent-card h3 { font-size: var(--parent-card-size); margin: 32px 0 12px; }
.parent-card p { color: #bdc5c7; font-size: var(--parent-body-size); line-height: 1.6; margin: 0 0 28px; }
.parent-card .parent-button--outline { border-color: #fff; color: #fff; }

.parent-features { padding-bottom: 96px; padding-top: 96px; }

/*
 * The features heading is a title, not a paragraph, so it sits in the middle of
 * the section and stays on the one line. The size follows the window up to the
 * heading size set in Theme settings, which is what keeps it there: a fixed
 * size would fold the sentence in two long before a phone.
 */
.parent-features .parent-section-heading { max-width: none; text-align: center; }
.parent-features .parent-section-heading h2 { font-size: min(var(--parent-heading-size), 7vw); white-space: nowrap; }

.parent-feature-grid {
	display: grid;
	gap: 36px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.parent-feature { border-top: 1px solid var(--parent-border); padding-top: 24px; }
.parent-feature h3 { font-size: 20px; margin: 0 0 10px; }
.parent-feature p { color: var(--parent-muted); line-height: 1.65; margin: 0; }

.parent-cta {
	background: var(--parent-cta-bg);
	border-radius: 18px;
	margin-bottom: 96px;
	padding: 64px;
	text-align: center;
}

.parent-cta h2 { font-family: Georgia, serif; font-size: clamp(38px, 5vw, 60px); font-weight: 400; margin: 0 0 16px; }
.parent-cta p { color: #343d48; font-size: 18px; margin: 0 auto 28px; max-width: 620px; }

.parent-footer { border-top: 1px solid var(--parent-border); color: var(--parent-muted); padding: 30px 0; }
.parent-footer__inner { align-items: center; display: flex; justify-content: space-between; }

.parent-signup { max-width: 820px; padding-bottom: 72px; padding-top: 24px; }
/* The paying screen carries a bill beside the card fields and needs the room. */
.parent-signup:has(.parent-pay) { max-width: 1060px; }
/*
 * Five plans side by side need more still; the other steps stay a column.
 *
 * The width matters as much as the max: this column is a flex item with auto
 * side margins, and auto margins stop an item stretching — so without it the
 * step is as wide as its content happens to be, which for a grid of cards is
 * about half the room.
 */
.parent-signup:has(.parent-plan-grid) { max-width: 1180px; width: 100%; }
/* The page label is the heading now, so it carries the h1 rather than sitting
   above one that repeated it. */
.parent-signup h1.parent-eyebrow { margin: 0 0 4px; }
.parent-signup__lead { color: var(--parent-muted); font-size: 18px; line-height: 1.6; margin-bottom: 0; max-width: 620px; }
.parent-signup-form { background: var(--parent-surface); border: 1px solid var(--parent-border); border-radius: 14px; margin-top: 16px; padding: 34px; }
/* Back at one end and Continue at the other, so going on and going back are
   not two things to tell apart in the middle of the card. */
.parent-signup-actions { display: flex; justify-content: space-between; }
/* A step with only one way on keeps it where Continue always is. */
/* Nothing to go back to — either because there is one button, or because the
   Back on this step was hidden for want of a step behind it. The way on sits
   in the middle rather than against a side of a space that is not shared. */
.parent-signup-actions > :only-child { margin-left: 0; }
.parent-signup-actions:has(> :only-child),
.parent-signup-actions:has(> [data-signup-back][hidden]) { justify-content: center; }
/* The direction each one goes, said on the button rather than only by where it
   sits. Written here so every step's pair carries them. */
.parent-signup-actions [data-signup-back]::before { content: "\2190"; margin-right: 10px; }
.parent-signup-actions [data-signup-next]::after { content: "\2192"; margin-left: 10px; }
/* Two fields and a button fit one line, so the button joins them rather than
   sitting alone under a half-empty row. It aligns to the bottom of the row
   because the fields carry a label above them. */
.parent-form-grid--with-action { align-items: end; grid-template-columns: 1fr 1fr auto; }
.parent-form-grid--with-action .parent-signup-actions { margin-bottom: 0; }
.parent-form-grid--with-action .parent-button { min-width: 0; white-space: nowrap; }
/* The button is the last thing on the form and the only one to press, so it is
   centred under the fields rather than tucked against the left edge. */
.parent-signup-actions .parent-button { min-width: 220px; }
/* A way on that is not ready yet, said by how it looks as well as by not working. */
.parent-signup-actions .parent-button[disabled] { cursor: not-allowed; opacity: .45; }

.parent-signup-form fieldset { border: 0; margin: 0 0 28px; padding: 0; }
/* The two dropdowns are one decision each and short enough to share a line;
   a lone one still fills the row, because the site question only appears for an
   account that already has a site. */
.parent-signup-row { display: flex; flex-wrap: wrap; gap: 0 22px; }
.parent-signup-row > fieldset { flex: 1 1 240px; }
/* The two address choices sit side by side for the same reason: one decision,
   two short options. The wrapper is a div rather than the fieldset itself,
   because a legend inside a flex container is not laid out reliably. */
.parent-choice-row { display: flex; flex-wrap: wrap; gap: 10px; }
.parent-choice-row > .parent-choice { flex: 1 1 240px; margin-top: 0; }
.parent-signup-form legend { font-size: 18px; font-weight: 700; margin-bottom: 14px; }
.parent-signup-form legend.screen-reader-text { margin-bottom: 0; }
.parent-signup-honeypot { left: -10000px; position: absolute; }
.parent-choice { align-items: flex-start; border: 1px solid var(--parent-border); border-radius: 8px; cursor: pointer; display: flex; gap: 12px; margin-top: 10px; padding: 16px; }
.parent-choice input { margin-top: 4px; }
.parent-choice span, .parent-choice small { display: block; }
.parent-choice small, .parent-signup-form label small { color: var(--parent-muted); margin-top: 3px; }
.parent-select { display: block; }
/* The native control is replaced rather than restyled: its own arrow cannot be
   moved, so appearance:none plus a background chevron is what keeps it matching
   the text inputs beside it. */
.parent-select select {
	appearance: none;
	background-color: var(--parent-surface);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23586164' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: right 16px center;
	background-repeat: no-repeat;
	background-size: 12px 8px;
	border: 1px solid #949a9c;
	border-radius: 6px;
	color: var(--parent-ink);
	cursor: pointer;
	display: block;
	font: inherit;
	margin-top: 4px;
	/* The same vertical padding as the text inputs beside it: a pixel more on
	   each side made this control two pixels taller than the box it sits next
	   to, which is exactly the sort of difference that is only visible once
	   somebody sees it. */
	padding: 12px 44px 12px 14px;
	width: 100%;
}
.parent-select select:hover { border-color: var(--parent-ink); }
.parent-select select:focus-visible { border-color: var(--parent-primary); box-shadow: 0 0 0 1px var(--parent-primary); outline: 2px solid transparent; }
/* Until a category is picked the value is empty, so the placeholder is greyed
   the way a text input's placeholder would be. */
.parent-select select:invalid { color: var(--parent-muted); }
.parent-select small { color: var(--parent-muted); display: block; margin-top: 8px; }
.parent-form-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 26px; }
.parent-form-grid label { font-size: 14px; font-weight: 650; }
.parent-form-grid input { border: 1px solid #949a9c; border-radius: 6px; display: block; font: inherit; margin-top: 7px; padding: 12px; width: 100%; }
.parent-form-wide { grid-column: 1 / -1; }
.parent-form-errors { background: #fff1f0; border: 1px solid #d63638; border-radius: 8px; color: #8a2424; margin-top: 24px; padding: 10px 18px; }
.parent-form-errors p { margin: 7px 0; }
.parent-site-status { align-items: center; background: var(--parent-surface); border: 1px solid var(--parent-border); border-radius: 10px; display: flex; gap: 14px; margin: 28px 0; padding: 20px 24px; }
.parent-site-status p { margin: 0; }
.parent-spinner { animation: parent-spin 0.9s linear infinite; border: 2px solid var(--parent-border); border-radius: 50%; border-top-color: currentColor; flex: 0 0 20px; height: 20px; width: 20px; }
@keyframes parent-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .parent-spinner { animation-duration: 3s; } }

.parent-dns-record { background: var(--parent-surface); border: 1px solid var(--parent-border); border-radius: 10px; display: grid; gap: 8px; margin: 28px 0; padding: 24px; }
.parent-dns-record span { color: var(--parent-muted); font-size: 13px; font-weight: 700; text-transform: uppercase; }
.parent-dns-record code { overflow-wrap: anywhere; }

/* Account -------------------------------------------------------------- */

/* Sticky footer by layout rather than position: it rests at the bottom of a short
   page and is pushed down by a long one, so it never covers the content. Both
   pages the plugin prints itself are laid out this way. */
/* A handoff is a form so its token is posted rather than put in the address;
   it should still sit in a row of links as though it were one of them. */
.aws-handoff { display: contents; }

/*
 * Dynamic viewport height, the way .wp-site-blocks above already does it. On a
 * phone, 100vh is the window with the browser's address bar hidden — so while
 * the bar is showing, a page sized to it is taller than the screen by exactly
 * the height of that bar, and a strip of blank space sits under the footer.
 * Scroll, the bar retracts, the strip goes; scroll back and it returns. 100dvh
 * is the window as it currently is, so the footer stays on the bottom edge
 * whatever the browser is doing with its chrome.
 *
 * The 100vh line stays as the fallback for anything too old to know dvh.
 */
.parent-account-page,
.parent-signup-page { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.parent-account-page .parent-account,
.parent-signup-page .parent-signup { flex: 1 0 auto; }

.parent-account { padding-bottom: 64px; padding-top: 20px; }

.parent-page-footer { background: var(--parent-surface); border-top: 1px solid var(--parent-border); flex: 0 0 auto; padding: 20px 0; }
.parent-page-footer__inner { align-items: center; color: var(--parent-muted); display: flex; font-size: 14px; gap: 18px; justify-content: space-between; }
.parent-page-footer p { margin: 0; }
.parent-page-footer nav { display: flex; gap: 18px; }
.parent-page-footer a { color: inherit; text-decoration: none; }
.parent-page-footer a:hover { color: var(--parent-ink); text-decoration: underline; }

.parent-account__tools { align-items: center; display: flex; flex-wrap: wrap; gap: 14px; }

.parent-account__search { align-items: center; display: flex; gap: 8px; }
.parent-account__search input[type=search] {
	background: var(--parent-surface);
	border: 1px solid var(--parent-border);
	border-radius: 8px;
	font: inherit;
	font-size: 14px;
	padding: 8px 12px;
	width: 220px;
}
.parent-account__search input[type=search]:focus-visible { border-color: var(--parent-primary); outline: 2px solid transparent; box-shadow: 0 0 0 1px var(--parent-primary); }
.parent-account__search select {
	background: var(--parent-surface);
	border: 1px solid var(--parent-border);
	border-radius: 8px;
	cursor: pointer;
	font: inherit;
	font-size: 14px;
	padding: 8px 10px;
}

.parent-account__clear { color: var(--parent-muted); font-size: 13px; }
/* It is a button now rather than a link back to an unfiltered URL: there is no
   longer a URL to go back to, because filtering never left this one. */
.parent-account__clear { background: none; border: 0; cursor: pointer; font: inherit; }
.parent-account__clear[hidden] { display: none; }
.parent-pagination__page { background: none; border: 0; cursor: pointer; font: inherit; }

.parent-pagination { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 28px; }
.parent-pagination__pages { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; }
.parent-pagination__page,
.parent-pagination__step {
	border: 1px solid var(--parent-border);
	border-radius: 8px;
	color: inherit;
	display: inline-block;
	font-size: 14px;
	min-width: 38px;
	padding: 8px 12px;
	text-align: center;
	text-decoration: none;
}
.parent-pagination__page:hover, .parent-pagination__step:hover { border-color: var(--parent-ink); }
.parent-pagination__page.is-current { background: var(--parent-primary); border-color: var(--parent-primary); color: #fff; }
/* Kept in place rather than removed, so the row does not shift as you page. */
.parent-pagination__step.is-disabled { color: var(--parent-muted); opacity: .5; }


/* The header carries the identity, so it holds three stacked lines rather than
   a single wordmark and needs room for them. */
.parent-account-page .parent-header__inner { align-items: center; min-height: 88px; }

.parent-account__id > p { margin: 0; }
.parent-account__id .parent-eyebrow { font-size: 12px; }
.parent-account__name { font-size: 19px; font-weight: 750; letter-spacing: -.03em; line-height: 1.2; }
.parent-account__email { color: var(--parent-muted); font-size: 13px; }

.parent-account__summary { color: var(--parent-muted); font-size: 14px; margin: 0; }

.parent-account__section-head { align-items: baseline; display: flex; justify-content: space-between; margin-bottom: 16px; }
.parent-account__section-head h2 { font-size: 20px; margin: 0; }

/* Four fixed columns rather than auto-fill: eight tiles to a page is two rows,
   and a column count that changed with the window would change how many rows a
   page has. */
.parent-account__grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1180px) { .parent-account__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 880px) { .parent-account__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.parent-app {
	background: var(--parent-surface);
	border: 1px solid var(--parent-border);
	border-radius: 16px;
	display: flex;
	flex-direction: column;
	padding: 20px;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.parent-app:hover { border-color: #b9bec0; box-shadow: 0 6px 20px rgb(16 21 23 / 7%); transform: translateY(-1px); }

.parent-app__top { align-items: center; display: flex; justify-content: space-between; margin-bottom: 16px; }

.parent-app__mark {
	align-items: center;
	background: hsl(var(--app-hue) 62% 94%);
	border-radius: 12px;
	color: hsl(var(--app-hue) 58% 32%);
	display: flex;
	flex: 0 0 auto;
	font-size: 20px;
	font-weight: 750;
	height: 44px;
	justify-content: center;
	width: 44px;
}

.parent-app__state { align-items: center; color: var(--parent-muted); display: flex; font-size: 12px; gap: 6px; }
.parent-app__dot { background: #1a9c4b; border-radius: 50%; height: 7px; width: 7px; }
.parent-app.is-pending .parent-app__dot { background: #d29b00; }

.parent-app__host { font-size: 17px; letter-spacing: -.01em; margin: 0; overflow-wrap: anywhere; }
.parent-app__host a { text-decoration: none; }
.parent-app__host a:hover { text-decoration: underline; }

.parent-app__meta { color: var(--parent-muted); font-size: 13px; margin: 6px 0 0; }

.parent-app__dns { margin-top: 14px; }
.parent-app__dns > summary { color: var(--parent-muted); cursor: pointer; font-size: 13px; }
.parent-app__dns[open] > summary { margin-bottom: 8px; }

.parent-dns-row { align-items: center; display: flex; gap: 8px; padding: 3px 0; }
.parent-dns-row > span { color: var(--parent-muted); flex: 0 0 40px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.parent-dns-row code { flex: 1 1 auto; font-size: 12px; overflow-wrap: anywhere; }

.parent-copy {
	background: var(--parent-bg);
	border: 1px solid var(--parent-border);
	border-radius: 6px;
	color: inherit;
	cursor: pointer;
	flex: 0 0 auto;
	font: inherit;
	font-size: 12px;
	padding: 3px 9px;
}

.parent-copy:hover { border-color: var(--parent-ink); }
.parent-copy.is-copied { background: #e7f7eb; border-color: #116329; color: #116329; }

/* Which of the platform's designs one of its own addresses opens on. Chosen
   here because its owner has nowhere else to be: the admin at that address is
   the platform's, and they are not of its tenancy. */
.parent-app__front { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
.parent-app__front .parent-note { margin: 0 0 4px; }
.parent-app__front-label { color: var(--parent-muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.parent-app__front-pick { display: flex; gap: 8px; }
/* The name of a page is as long as somebody made it; the button is not made to
   shrink around it. */
.parent-app__front-pick select {
	background: var(--parent-bg);
	border: 1px solid var(--parent-line, #d8dbe0);
	border-radius: 8px;
	color: inherit;
	flex: 1 1 auto;
	font: inherit;
	font-size: 13px;
	min-width: 0;
	padding: 8px 10px;
}
.parent-app__front-pick .parent-button { flex: 0 0 auto; padding: 8px 14px; }
.parent-app__front-why { color: var(--parent-muted); font-size: 12px; }

/* Pinned to the bottom so a tile with a DNS panel keeps its buttons level with
   the tiles beside it. */
.parent-app__actions { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin-top: auto; padding-top: 18px; }
.parent-app__actions .parent-link { padding-left: 0; }
.parent-app__actions .parent-button { padding: 9px 15px; }

.parent-app--add {
	align-items: center;
	border-style: dashed;
	color: var(--parent-muted);
	font-weight: 650;
	gap: 10px;
	justify-content: center;
	min-height: 180px;
	text-decoration: none;
}

.parent-app--add:hover { border-color: var(--parent-primary); color: var(--parent-primary); }
.parent-app__plus { font-size: 26px; line-height: 1; }

/* Adding another name for this platform, beside the websites it sells. */
.parent-app--platform { display: flex; flex-direction: column; padding: 18px; }
.parent-app--platform input {
	border: 1px solid var(--parent-line, #d8dbe0);
	border-radius: 8px;
	font: inherit;
	padding: 8px 10px;
	width: 100%;
}
.parent-app--platform input + input { margin-top: 8px; }
.parent-app--platform .parent-button { margin-top: 10px; }

/* Signing in as the owner of a website, from that website's own card. */
/*
 * The sign-in-as mark. A square target rather than a line of text: it sits on a
 * card that already names the site, and who it signs you in as is on the label
 * rather than spelled out beside it.
 */
.parent-app__as {
	align-items: center;
	border-radius: 6px;
	color: #475467;
	display: inline-flex;
	height: 32px;
	justify-content: center;
	width: 32px;
}

.parent-app__as:hover,
.parent-app__as:focus-visible { background: rgb(16 24 40 / 6%); color: #101828; }

/* What came of the last thing asked for on this page. */
.parent-note {
	border-left: 3px solid var(--parent-line, #d8dbe0);
	border-radius: 6px;
	margin: 0 0 18px;
	padding: 10px 14px;
}
.parent-note--good { background: #edf7f0; border-left-color: #2f8f4e; }

/* A repair, while it runs. Every step of it changes a web server, so it holds
   the page: there is no useful thing to do on the rest of it meanwhile, and a
   reload halfway through leaves a site in the state this exists to get it out
   of. Each step is asked for on its own so the list fills in as it goes —
   reporting only at the end looks the same as having hung. */
/* Everything that changes a server lives behind the dots in the card's corner,
   away from Open and Dashboard, which change nothing. */
.parent-app__top { position: relative; }
.parent-app__menu { margin-left: auto; position: relative; }
/* Bigger than the other icons on purpose: this one is carrying a colour, and a
   colour needs enough of itself to be read at a glance. */
.parent-app__more { align-items: center; background: none; border: 0; border-radius: 9px; color: #6b7280;
    cursor: pointer; display: flex; height: 34px; justify-content: center; padding: 0; width: 34px; }
.parent-app__more .parent-app__icon { height: 24px; width: 24px; }
.parent-app__more:hover, .parent-app__more:focus-visible { background: rgba(0, 0, 0, .06); }

/* The dots are the state as well: serving, or not. Hovering names which, so the
   colour is never the only thing saying it. */
.parent-app__more.is-live { color: #2f8f4e; }
.parent-app__more.is-down { color: #b32d2e; }
.parent-app__more.is-live:hover, .parent-app__more.is-live:focus-visible { background: #e9f5ed; }
.parent-app__more.is-down:hover, .parent-app__more.is-down:focus-visible { background: #fdeceb; }
/* No fill here. A stylesheet rule beats the fill="none" on the svg itself, so
   setting one filled every stroked icon into a solid blob — the arrow became a
   disc and the bin would have too. Each icon says what it is on the element. */
.parent-app__icon { display: block; }

.parent-app__sheet { background: #fff; border: 1px solid #e3e6ea; border-radius: 10px;
    box-shadow: 0 12px 30px rgba(10, 14, 22, .16); display: flex; gap: 2px; padding: 5px;
    position: absolute; right: 0; top: 32px; z-index: 5; }
.parent-app__sheet[hidden] { display: none; }
.parent-app__do { align-items: center; background: none; border: 0; border-radius: 8px; color: #4b5563;
    cursor: pointer; display: flex; height: 32px; justify-content: center; padding: 0; width: 32px; }
.parent-app__do:hover, .parent-app__do:focus-visible { background: #f2f4f7; color: #1f2430; }
.parent-app__do--bad { color: #b32d2e; }
.parent-app__do--bad:hover, .parent-app__do--bad:focus-visible { background: #fdeceb; color: #8f1f20; }

.parent-repair__type { display: grid; gap: 6px; margin: 16px 0 0; }
.parent-repair__address { align-items: center; display: flex; gap: 8px; margin: 0; }
.parent-repair__address code { background: #f2f4f7; border-radius: 6px; padding: 4px 8px; }
.parent-repair__copy { align-items: center; background: none; border: 0; border-radius: 7px; color: #5b6472;
    cursor: pointer; display: flex; height: 28px; justify-content: center; padding: 0; width: 28px; }
.parent-repair__copy:hover, .parent-repair__copy:focus-visible { background: #f2f4f7; color: #1f2430; }
.parent-repair__copy.is-done { background: #e9f5ed; color: #2f8f4e; }
.parent-repair__type input { border: 1px solid #c9ced6; border-radius: 8px; font: inherit; padding: 9px 11px; width: 100%; }
.parent-repair__actions button[disabled] { cursor: not-allowed; opacity: .5; }
.parent-repair[data-job="delete"] .parent-repair__actions .parent-button:not([hidden]) { background: #b32d2e; border-color: #b32d2e; }
.parent-repair__start { background: none; border: 0; cursor: pointer; font: inherit; padding: 0; }
body.parent-repair-open { overflow: hidden; }

.parent-repair { align-items: center; background: rgba(16, 20, 28, .55); bottom: 0; display: flex;
    justify-content: center; left: 0; padding: 20px; position: fixed; right: 0; top: 0; z-index: 999; }
.parent-repair[hidden] { display: none; }

.parent-repair__sheet { background: #fff; border-radius: 16px; box-shadow: 0 24px 60px rgba(10, 14, 22, .28);
    max-height: calc(100dvh - 40px); max-width: 520px; overflow-y: auto; padding: 26px 28px 22px; width: 100%; }
.parent-repair__title { font-size: 1.25rem; margin: 0 0 4px; }
.parent-repair__intro { color: #5b6472; margin: 6px 0 0; }
.parent-repair__intro[hidden] { display: none; }

.parent-repair__steps { list-style: none; margin: 16px 0 0; padding: 0; }
.parent-repair__step { display: grid; gap: 2px; grid-template-columns: 22px 1fr; padding: 9px 0; }
.parent-repair__step + .parent-repair__step { border-top: 1px solid rgba(0, 0, 0, .06); }
.parent-repair__what { grid-column: 2; }
.parent-repair__detail { color: #5b6472; grid-column: 2; }
.parent-repair__detail:empty { display: none; }

.parent-repair__mark { grid-row: 1 / span 2; height: 16px; margin-top: 3px; position: relative; width: 16px; }

/* Waiting: nothing yet, so nothing is claimed. */
.parent-repair__step[data-state="waiting"] { opacity: .45; }
.parent-repair__step[data-state="waiting"] .parent-repair__mark::before { border: 2px solid #c9ced6;
    border-radius: 50%; content: ""; inset: 1px; position: absolute; }

.parent-repair__step[data-state="running"] .parent-repair__mark::before { animation: parent-repair-spin .7s linear infinite;
    border: 2px solid #c9ced6; border-radius: 50%; border-top-color: #2a5bd7; content: ""; inset: 1px; position: absolute; }

.parent-repair__step[data-state="done"] .parent-repair__mark::before { color: #2f8f4e; content: "\2713"; font-weight: 700; }
.parent-repair__step[data-state="ok"] .parent-repair__mark::before { color: #7a8290; content: "\2013"; }
.parent-repair__step[data-state="skipped"] { opacity: .45; }
.parent-repair__step[data-state="skipped"] .parent-repair__mark::before { color: #7a8290; content: "\2013"; }
.parent-repair__step[data-state="failed"] .parent-repair__mark::before { color: #b32d2e; content: "\2717"; font-weight: 700; }
.parent-repair__step[data-state="failed"] .parent-repair__detail { color: #b32d2e; }

@keyframes parent-repair-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .parent-repair__step[data-state="running"] .parent-repair__mark::before { animation-duration: 2.4s; }
}

.parent-repair__warn { background: #fdf6e3; border-radius: 10px; color: #7a5b00; font-size: .92rem;
    margin: 16px 0 0; padding: 10px 12px; }
.parent-repair__outcome { font-weight: 600; margin: 16px 0 0; }
.parent-repair__outcome[data-bad="1"] { color: #b32d2e; }
.parent-repair__actions { align-items: center; display: flex; gap: 14px; justify-content: flex-end; margin-top: 18px; }
.parent-repair__actions button[hidden] { display: none; }
.parent-repair__actions .parent-link { background: none; border: 0; cursor: pointer; font: inherit; padding: 0; }
.parent-note--bad { background: #fdf0f0; border-left-color: #c1443a; }

.parent-account__empty {
	background: var(--parent-surface);
	border: 1px dashed var(--parent-border);
	border-radius: 14px;
	padding: 44px 32px;
	text-align: center;
}

.parent-account__empty h3 { font-size: 20px; margin: 0 0 8px; }
.parent-account__empty p { color: var(--parent-muted); margin: 0 auto 22px; max-width: 460px; }
.parent-account__empty-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

@media (max-width: 760px) {
	.parent-shell { padding-left: 20px; padding-right: 20px; }
	.parent-header__inner { flex-wrap: wrap; min-height: 64px; row-gap: 4px; }
	/* The menu drops to its own line rather than squeezing the account links,
	   which are how anyone signs in or signs up. */
	.parent-menu { margin-left: 0; order: 3; overflow-x: auto; width: 100%; }
	.parent-menu__link { padding-left: 8px; padding-right: 8px; }
	/* Signing in happens through this link now, so it has to stay reachable. */
	.parent-header__actions .parent-link { padding-left: 4px; padding-right: 10px; }
	.parent-header__actions .parent-button { padding-left: 14px; padding-right: 14px; }
	.parent-hero { padding-bottom: 32px; padding-top: 28px; }
	.parent-card-grid, .parent-feature-grid { grid-template-columns: 1fr; }
	.parent-form-grid, .parent-form-grid--with-action { grid-template-columns: 1fr; }
	.parent-form-wide { grid-column: auto; }
	.parent-signup-form { padding: 22px 18px; }
	/*
	 * Two buttons at 220px each is 452px of button before any padding, which is
	 * wider than the window they were being asked to sit in — the card was cut
	 * off at the right and the page scrolled sideways. They share what there is
	 * and wrap when there is not enough.
	 */
	.parent-signup-actions { flex-wrap: wrap; gap: 10px; }
	.parent-signup-actions .parent-button { flex: 1 1 auto; min-width: 0; }
	.parent-domain-search { padding: 14px; }
	.parent-domain-search__row { flex-wrap: wrap; }
	.parent-domain-search__row input { flex: 1 1 160px; }
	.parent-signup-row > fieldset { flex-basis: 100%; }
	.parent-choice-row > .parent-choice { flex-basis: 100%; }
	.parent-options, .parent-features { padding-bottom: 72px; padding-top: 72px; }
	.parent-cta { margin-bottom: 64px; padding: 44px 24px; }
	.parent-footer__inner { align-items: flex-start; flex-direction: column; gap: 8px; }
	.parent-account { padding-top: 16px; }
	.parent-account__section-head { align-items: stretch; flex-direction: column; gap: 12px; }
	.parent-account__search input[type=search] { width: 100%; }
	.parent-page-footer__inner { align-items: flex-start; flex-direction: column; gap: 10px; }
	.parent-account__grid { grid-template-columns: 1fr; }
	.parent-dns-row { align-items: flex-start; flex-wrap: wrap; }
}

/* The options popup ------------------------------------------------------
 *
 * A native dialog, so the browser handles the backdrop, Escape and keeping
 * focus inside. Only the panel is styled; the cards inside are the same ones
 * the page uses elsewhere.
 */
.parent-modal {
	background: transparent;
	border: 0;
	max-height: 100dvh;
	max-width: min(880px, 100vw);
	padding: 0;
	width: 100%;
}

.parent-modal::backdrop { background: rgb(12 18 32 / 62%); }

/* The panel carries what the options section used to: the cards inside are
   built for a dark ground and take their light text from it. */
.parent-modal__panel {
	background: var(--parent-ink);
	border-radius: 16px;
	box-shadow: 0 24px 60px rgb(9 16 32 / 45%);
	color: #fff;
	margin: 24px;
	padding: 34px clamp(20px, 4vw, 44px) 40px;
	position: relative;
}

/* The dialog itself is only a frame, and a ring around the whole window reads
   as an error. The controls inside keep their own focus styles. */
.parent-modal:focus { outline: none; }

.parent-modal__close {
	background: transparent;
	border: 0;
	border-radius: 8px;
	color: #b8c0c2;
	cursor: pointer;
	font-size: 26px;
	line-height: 1;
	padding: 6px 12px;
	position: absolute;
	right: 12px;
	top: 12px;
}

.parent-modal__close:hover { color: #fff; }

.parent-modal .parent-section-heading { margin-bottom: 26px; }

@media (max-width: 600px) {
	.parent-modal__panel { margin: 12px; padding: 30px 18px 32px; }
}

/* Signup: the plan step ---------------------------------------------------
 *
 * Prices belong to the theme a category starts on, so a group is rendered for
 * each and the chosen one is shown.
 */
.parent-plan-grid {
	/*
	 * Side by side, because plans are read against each other: a column of
	 * cards is five separate offers, and the question is which of them. Narrow
	 * enough that five fit, and auto-fit wraps them when they cannot.
	 */
	align-items: start;
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(auto-fit, minmax(186px, 1fr));
	margin-bottom: 26px;
}

.parent-plan {
	align-items: flex-start;
	border: 1px solid var(--parent-border);
	border-radius: 12px;
	cursor: pointer;
	display: flex;
	gap: 10px;
	padding: 16px;
}

/*
 * Monthly or yearly, one control above the lot of them and over on the right.
 * It answers a question about the prices below it, and the prices are read
 * left to right — so it sits at the end of that line rather than in front of
 * it, where it would be the first thing read and the last thing wanted.
 */
.parent-plan-when {
	background: #f2f4f7;
	border-radius: 999px;
	/*
	 * Block-level, not inline-flex: an auto margin on an inline box computes
	 * to nothing, so the switch stayed where it was put however it was told.
	 */
	display: flex;
	gap: 4px;
	margin: 0 0 20px auto;
	padding: 4px;
	width: fit-content;
}

.parent-plan-when__side {
	align-items: center;
	border-radius: 999px;
	cursor: pointer;
	display: inline-flex;
	font-size: 15px;
	gap: 8px;
	padding: 8px 18px;
}

.parent-plan-when__side:has(input:checked) {
	background: #fff;
	box-shadow: 0 1px 3px rgb(16 24 40 / 12%);
	font-weight: 600;
}

.parent-plan-when__side input { height: 0; opacity: 0; pointer-events: none; position: absolute; width: 0; }

.parent-plan-when__saving,
.parent-plan__saving {
	background: #e7f5ec;
	border-radius: 999px;
	color: #1a7f45;
	font-size: 12px;
	padding: 2px 8px;
	white-space: nowrap;
}

.parent-plan__saving { border-radius: 6px; justify-self: start; }

.parent-plan__saving[hidden],
.parent-plan__yearly[hidden] { display: none; }

.parent-plan:has(input:checked) { border-color: var(--parent-ink); box-shadow: 0 0 0 1px var(--parent-ink); }

.parent-plan--featured { border-color: #8da0ff; }

.parent-plan input { margin-top: 4px; }

.parent-plan__body { display: grid; gap: 6px; }

.parent-plan__name { font-size: 16px; }

.parent-plan__price { font-size: 26px; font-weight: 700; letter-spacing: -.02em; }

.parent-plan__price small { color: var(--parent-muted); font-size: 13px; font-weight: 400; }

.parent-plan__summary { color: var(--parent-muted); line-height: 1.55; }

.parent-signup-actions { gap: 12px; }

.parent-signup__alt { color: var(--parent-muted); margin-top: 18px; text-align: center; }

.parent-plan__yearly { color: var(--parent-muted); }
.parent-plan__features { display: grid; gap: 5px; margin-top: 4px; }
.parent-plan__features span { color: var(--parent-muted); font-size: 13px; line-height: 1.4; padding-left: 18px; position: relative; }
.parent-plan__features span::before { content: "✓"; left: 0; position: absolute; }

.parent-checkout { margin: 26px 0 8px; min-height: 340px; }

/* Paying for a signup ------------------------------------------------------
 *
 * Laid out like the for-sale checkout: what is being bought sits beside the
 * card fields, so the amount in the payment frame has a bill next to it rather
 * than being the first anybody hears of it.
 */
.parent-pay { align-items: start; display: grid; gap: 28px; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
.parent-pay__main { min-width: 0; }
.parent-pay__main h1 { margin: 0 0 10px; }

.parent-basket {
	background: var(--parent-surface);
	border: 1px solid var(--parent-border);
	border-radius: 14px;
	display: flex;
	flex-direction: column;
	padding: 22px;
	position: sticky;
	top: 24px;
}

/*
 * The order and the search are one section, because on a phone they collapse
 * together. Where there is room they are simply the column, and the total reads
 * where a total belongs: under what it adds up.
 */
.parent-basket__sheet { display: contents; }
.parent-basket__lines { order: 1; }
.parent-basket__total { order: 2; }
.parent-basket__note { order: 3; }
.parent-basket__more { order: 4; }

.parent-basket__title {
	color: var(--parent-muted);
	font-size: 12px;
	font-weight: 750;
	letter-spacing: .12em;
	margin: 0 0 14px;
	text-transform: uppercase;
}

.parent-basket__lines { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.parent-basket__lines li { display: flex; gap: 12px; justify-content: space-between; }
.parent-basket__label { display: grid; gap: 3px; min-width: 0; }
.parent-basket__label strong { font-size: 15px; overflow-wrap: anywhere; }
.parent-basket__label small { color: var(--parent-muted); font-size: 12.5px; line-height: 1.4; }
.parent-basket__amount { font-weight: 700; white-space: nowrap; }
.parent-basket__drop { flex: 0 0 auto; }

/* A form before the page could redraw it, a button after. */
.parent-basket__drop, .parent-basket__drop button {
	background: none;
	border: 0;
	color: var(--parent-muted);
	cursor: pointer;
	font-size: 18px;
	line-height: 1;
	padding: 0 0 0 8px;
}

.parent-basket__drop:hover, .parent-basket__drop button:hover { color: #b32d2e; }

.parent-basket__total {
	align-items: baseline;
	border-top: 1px solid var(--parent-border);
	display: flex;
	justify-content: space-between;
	margin: 18px 0 0;
	padding-top: 14px;
}

.parent-basket__total strong { font-size: 22px; }
.parent-basket__note { color: var(--parent-muted); font-size: 12.5px; line-height: 1.5; margin: 12px 0 0; }

/* A button that is busy, rather than one that has merely stopped working. */
.parent-button.is-working { cursor: progress; opacity: .85; }

.parent-button.is-working::before {
	animation: parent-spin 0.7s linear infinite;
	border: 2px solid rgb(255 255 255 / 45%);
	border-radius: 50%;
	border-top-color: #fff;
	content: "";
	display: inline-block;
	height: 15px;
	margin-right: 9px;
	vertical-align: -2px;
	width: 15px;
}

/* Waiting, in the middle of what is being waited on ---------------------- */
.parent-basket__working { align-items: center; display: flex; justify-content: center; margin: 0; padding: 26px 0; }
.parent-basket__working[hidden] { display: none; }

.parent-basket__working-spin {
	animation: parent-spin 0.7s linear infinite;
	border: 3px solid var(--parent-border);
	border-radius: 50%;
	border-top-color: var(--parent-primary);
	display: inline-block;
	height: 30px;
	width: 30px;
}

/* Adding another name to the order, from the column that shows the order. */
.parent-basket__more { border-top: 1px solid var(--parent-border); margin-top: 18px; padding-top: 16px; }
.parent-basket__more .parent-basket__title { margin-bottom: 10px; }
.parent-basket__search { display: flex; gap: 8px; }
.parent-basket__search label { flex: 1 1 auto; min-width: 0; }
.parent-basket__search input {
	border: 1px solid var(--parent-border);
	border-radius: 8px;
	font: inherit;
	padding: 8px 10px;
	width: 100%;
}
.parent-basket__search .parent-button { flex: 0 0 auto; min-width: 0; padding: 8px 14px; }
.parent-basket__search .parent-button[disabled] { cursor: progress; opacity: .5; }
.parent-basket__results { display: grid; gap: 6px; list-style: none; margin: 12px 0 0; padding: 0; }
.parent-basket__results li.is-taken { color: var(--parent-muted); font-size: 13px; padding: 6px 2px; text-decoration: line-through; }

.parent-basket__add {
	align-items: center;
	background: #fff;
	border: 1px solid var(--parent-border);
	border-radius: 8px;
	cursor: pointer;
	display: flex;
	font: inherit;
	gap: 10px;
	justify-content: space-between;
	padding: 9px 12px;
	text-align: left;
	width: 100%;
}

.parent-basket__add:hover { border-color: var(--parent-primary); color: var(--parent-primary); }
.parent-basket__add span { flex: 1 1 auto; overflow-wrap: anywhere; }
.parent-basket__add input { accent-color: var(--parent-primary); flex: 0 0 auto; height: 16px; margin: 0; width: 16px; }
.parent-basket__add:has(input:checked) { border-color: var(--parent-primary); box-shadow: inset 0 0 0 1px var(--parent-primary); }
.parent-basket__more [data-domain-add] { margin-top: 12px; min-width: 0; width: 100%; }

/* The payment fields and the button under them. */
.parent-pay__form { margin-top: 18px; }
/*
 * The gap belongs to the row, not to the button: as a margin on one of two
 * stretched items it made that one shorter than the other by exactly the gap.
 */
.parent-pay__row { margin-top: 20px; }
.parent-pay__form .parent-button { margin-top: 0; width: 100%; }
.parent-pay__status { color: var(--parent-muted); font-size: 13px; margin: 10px 0 0; min-height: 18px; text-align: center; }

.parent-pay__row { align-items: stretch; display: flex; gap: 10px; }
.parent-pay__row .parent-button { flex: 1 1 auto; min-width: 0; }
.parent-basket__close, .parent-basket__sheet-head { display: none; }

/* Beside the pay button, and only where the list it opens is a sheet. */
.parent-pay__more {
	align-items: center;
	background: #fff;
	border: 1px solid var(--parent-border);
	border-radius: 10px;
	color: var(--parent-ink, #101828);
	cursor: pointer;
	display: none;
	flex: 0 0 auto;
	flex-direction: column;
	font: inherit;
	font-size: 12px;
	font-weight: 700;
	gap: 2px;
	justify-content: center;
	line-height: 1;
	padding: 8px 12px;
}

.parent-pay__more { position: relative; }
.parent-pay__more-label { font-size: 12px; font-weight: 700; line-height: 1.1; }
.parent-pay__more:hover { border-color: var(--parent-primary); color: var(--parent-primary); }

/* How many domains are in it, on the cart it opens. */
.parent-pay__count {
	background: var(--parent-primary);
	border-radius: 999px;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.5;
	min-width: 18px;
	position: absolute;
	right: 2px;
	text-align: center;
	top: 2px;
}

@media (max-width: 860px) {
	/* The bill first: on a phone it is the part that has to be read. */
	.parent-pay { grid-template-columns: minmax(0, 1fr); }
	.parent-basket { position: static; }
	/*
	 * The same row the for-sale page has: a third of it for the cart, the rest
	 * for the button that pays, both the same height, and the pair kept on the
	 * screen while the page scrolls under them.
	 */
	.parent-pay__more { display: flex; flex: 0 0 33%; }

	.parent-pay__row {
		background: var(--parent-bg, #f6f6f4);
		bottom: 0;
		box-shadow: 0 -12px 20px -12px rgb(16 24 40 / 18%);
		margin: 0 -20px;
		padding: 12px 20px;
		position: sticky;
		z-index: 3;
	}

	/*
	 * The order reads as a receipt on a phone — a line, a price, a total — so
	 * the payment is on the screen with it rather than below the fold. What
	 * each line means is on the wide layout, where there is room to say it.
	 */
	/*
	 * The card that summarised the order is not shown here at all: the button
	 * says what is being paid, the cart beside it opens what it is for, and a
	 * third statement of the same thing was only pushing the payment down.
	 */
	.parent-basket { background: none; border: 0; padding: 0; }
	.parent-basket > :not(.parent-basket__sheet) { display: none; }
	.parent-basket__lines { gap: 8px; }
	.parent-basket__label small { display: none; }
	.parent-pay__main h1 { font-size: 27px; margin-bottom: 6px; }
	.parent-pay__main > p { font-size: 14.5px; }
	.parent-pay__form { margin-top: 12px; }

	/*
	 * What is in the order, and adding to it, are both things to look at rather
	 * than things in the way of paying: they wait under the page and arrive
	 * over it when asked for. What is owed stays on show.
	 */
	/*
	 * The whole screen once it is open: what is in the order and the search
	 * that adds to it are the only things being looked at while it is up, and
	 * a list cut off at three quarters of the screen is a list to scroll
	 * inside something that is itself scrolling.
	 */
	.parent-basket__sheet {
		background: #fff;
		display: block;
		bottom: 0;
		box-shadow: 0 -20px 60px rgb(16 24 40 / 25%);
		left: 0;
		margin: 0;
		overflow: auto;
		padding: 0 18px 18px;
		position: fixed;
		right: 0;
		top: 0;
		transform: translateY(101%);
		transition: transform .22s ease;
		visibility: hidden;
		/* Over the page header, which is sticky at 20: reaching the top of the
		   screen means nothing if the way out is behind something else. */
		z-index: 30;
	}

	/* The middle of the sheet, over what is already there. */
	.parent-picking .parent-basket__working {
		align-items: center;
		background: rgb(255 255 255 / 72%);
		display: flex;
		inset: 0;
		padding: 0;
		position: fixed;
		z-index: 31;
	}

	.parent-picking .parent-basket__working[hidden] { display: none; }

	/* Stays put while the order scrolls under it, so the way out is always there. */
	.parent-basket__sheet-head {
		background: #fff;
		margin: 0 -18px 12px;
		padding: 16px 18px 12px;
		position: sticky;
		top: 0;
		z-index: 1;
	}

	.parent-picking .parent-basket__sheet { transform: none; visibility: visible; }
	.parent-basket__sheet .parent-basket__more { border: 0; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--parent-border); }

	/*
	 * Hung off the page rather than the body: the sheet lives inside it, and a
	 * backdrop outside would cover the sheet instead of sitting under it.
	 */
	.parent-picking .parent-signup::after {
		background: rgb(16 24 40 / 55%);
		content: "";
		inset: 0;
		position: fixed;
		z-index: 25;
	}

	.parent-basket__sheet-total { margin-left: auto; }
	.parent-basket__sheet-head {
		align-items: center;
		color: var(--parent-muted);
		display: flex;
		font-size: 12px;
		font-weight: 750;
		gap: 10px;
		letter-spacing: .12em;
		text-transform: uppercase;
	}

	.parent-basket__close {
		background: none;
		border: 0;
		color: var(--parent-muted);
		cursor: pointer;
		display: block;
		font-size: 24px;
		line-height: 1;
		padding: 0 4px;
	}
}

/* The address question, and the one field its answer needs ---------------- */
/*
 * The space under this row is its own, not borrowed from what follows it.
 *
 * Every other step is spaced by `fieldset { margin-bottom: 28px }`, and the
 * only fieldset on this one is the domain search — which is hidden unless
 * somebody is buying a name. So the gap between the address row and the Back
 * and Continue buttons existed while that search was on screen and collapsed
 * to nothing the rest of the time: the same step, spaced two different ways
 * depending on an element nobody could see.
 */
.parent-address { align-items: start; display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 28px; }
/* The gap under a select is there to separate it from the label above it. The
   labels in this row are read aloud rather than shown, so there is nothing to
   be separated from — and the gap put this control four pixels below the field
   it sits beside. */
.parent-address .parent-select select { margin-top: 0; }
.parent-address__what { flex: 1 1 240px; margin: 0; min-width: 0; }
.parent-address__field { display: block; flex: 1 1 240px; margin: 0; min-width: 0; }
.parent-address__field[hidden] { display: none; }
.parent-address__field input { border: 1px solid #949a9c; border-radius: 6px; font: inherit; padding: 12px; width: 100%; }
.parent-address__field--search { display: block; }
.parent-address__seek { display: block; position: relative; }
/* Nothing sits in the field any more: a button wide enough to say what it does
   covered what was being typed. The step's own button searches. */
.parent-address__seek input { padding-right: 12px; }

/* While it is a search rather than the way on, it wears a magnifier instead of
   the arrow — same button, saying which of the two it is at the time. */
.parent-signup-actions [data-signup-next].is-seeking::after { content: none; }
.parent-signup-actions [data-signup-next].is-seeking::before {
	-webkit-mask: var(--parent-seek-icon) center / contain no-repeat;
	background: currentColor;
	content: "";
	display: inline-block;
	height: 18px;
	margin-right: 10px;
	mask: var(--parent-seek-icon) center / contain no-repeat;
	vertical-align: -3px;
	width: 18px;
}

:root {
	--parent-seek-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
}

/* Waiting on the registry, inside the dialog the answer will appear in. */
.parent-domain-waiting { align-items: center; color: var(--parent-muted); display: flex; gap: 10px; margin: 16px 0; }
.parent-domain-waiting[hidden] { display: none; }

.parent-domain-waiting__spin {
	animation: parent-spin 0.7s linear infinite;
	border: 2px solid var(--parent-border);
	border-radius: 50%;
	border-top-color: var(--parent-primary);
	display: inline-block;
	height: 18px;
	width: 18px;
}

@keyframes parent-spin { to { transform: rotate(360deg); } }
.parent-address__note { color: var(--parent-muted); font-size: 13px; margin: 8px 0 18px; min-height: 1.2em; }

/* One address box, with what it found under it --------------------------- */
.parent-address-find { position: relative; }
/* It is a search field only so the browser does not treat it as an address; it
   should not look like one. */
.parent-address-find input::-webkit-search-decoration,
.parent-address-find input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.parent-address-find__said { color: var(--parent-muted); display: block; font-size: 12.5px; margin-top: 6px; }

.parent-address-find__list {
	background: #fff;
	border: 1px solid var(--parent-border);
	border-radius: 10px;
	box-shadow: 0 18px 40px rgb(16 24 40 / 12%);
	left: 0;
	list-style: none;
	margin: 4px 0 0;
	max-height: 260px;
	overflow: auto;
	padding: 4px;
	position: absolute;
	right: 0;
	top: 100%;
	z-index: 4;
}

.parent-address-find__list[hidden] { display: none; }

.parent-address-find__list button {
	background: none;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	display: block;
	font: inherit;
	font-size: 13.5px;
	padding: 8px 10px;
	text-align: left;
	width: 100%;
}

.parent-address-find__list button:hover { background: rgb(47 75 255 / 8%); color: var(--parent-primary); }

/* Signup: buying a domain ------------------------------------------------ */
/* Nothing but the answers now, so it has no frame of its own until it has some. */
.parent-domain-search { margin-top: 4px; }
.parent-domain-search:has(.parent-domain-cart:not([hidden])) { border: 1px solid var(--parent-border); border-radius: 10px; margin-top: 14px; padding: 16px 18px; }
.parent-domain-search legend { font-size: 13px; font-weight: 650; padding: 0 6px; }
.parent-domain-search__row { display: flex; gap: 10px; }
.parent-domain-search__row input { flex: 1 1 auto; min-width: 0; }
.parent-domain-search__status { color: var(--parent-muted); margin: 10px 0 0; min-height: 1.2em; }
.parent-domain-results { display: grid; gap: 8px; margin-top: 12px; }
.parent-domain-result { align-items: center; background: #fff; border: 1px solid var(--parent-border); border-radius: 8px; cursor: pointer; display: flex; font: inherit; justify-content: space-between; padding: 10px 14px; }
.parent-domain-result:disabled { color: var(--parent-muted); cursor: default; opacity: .6; }
.parent-domain-result.is-chosen { border-color: var(--parent-ink); box-shadow: 0 0 0 1px var(--parent-ink); }
.parent-domain-contact { margin-top: 18px; }
.parent-domain-contact__lead { color: var(--parent-muted); margin: 0 0 12px; }

.parent-domain-dialog .parent-modal__panel { background: var(--parent-bg); color: var(--parent-ink); }
.parent-domain-dialog h2 { margin: 0 0 6px; }
.parent-domain-dialog__lead { color: var(--parent-muted); margin: 0 0 18px; }
.parent-domain-dialog .parent-modal__close { color: var(--parent-muted); }
.parent-domain-dialog .parent-signup-actions { justify-content: flex-end; margin-top: 20px; }
.parent-domain-result { align-items: center; background: #fff; border: 1px solid var(--parent-border); border-radius: 8px; cursor: pointer; display: flex; gap: 12px; margin-bottom: 8px; padding: 12px 14px; }
.parent-domain-result.is-taken { color: var(--parent-muted); cursor: default; opacity: .65; }
.parent-domain-result__name { flex: 1 1 auto; font-weight: 600; }
.parent-domain-result__price small { color: var(--parent-muted); font-weight: 400; }
/* What has been picked, kept together and foldable. */
.parent-domain-cart { border: 1px solid var(--parent-border); border-radius: 10px; margin-top: 12px; padding: 10px 12px; }

.parent-domain-cart > summary {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-size: 14px;
	font-weight: 650;
	gap: 10px;
	justify-content: space-between;
	list-style: none;
}

.parent-domain-cart > summary::-webkit-details-marker { display: none; }
.parent-domain-cart > summary::before { content: "\25B8"; margin-right: 2px; transition: transform .15s ease; }
.parent-domain-cart[open] > summary::before { transform: rotate(90deg); }
.parent-domain-cart__total { color: var(--parent-muted); font-weight: 700; margin-left: auto; }
.parent-domain-chosen { display: grid; gap: 8px; margin-top: 12px; }
.parent-domain-picked { align-items: center; background: #fff; border: 1px solid var(--parent-border); border-radius: 8px; display: flex; gap: 12px; padding: 10px 14px; }
.parent-domain-picked label { align-items: center; display: flex; flex: 1 1 auto; gap: 8px; }
.parent-domain-picked__price { color: var(--parent-ink); white-space: nowrap; }
.parent-domain-picked__price small { color: var(--parent-muted); }
.parent-domain-picked__remove { background: none; border: 0; color: var(--parent-muted); cursor: pointer; font-size: 20px; line-height: 1; padding: 0 4px; }

.parent-plan__domains { color: var(--parent-ink); font-weight: 600; }

/* Said under the form that is protected, rather than only in a floating badge
   somebody may never look at. */
.aws-recaptcha-note {
	font-size: .74rem;
	line-height: 1.5;
	margin: 14px 0 0;
	opacity: .7;
	text-align: center;
}

.aws-recaptcha-note a { color: inherit; }

/* Leaving the payment is a form, because it cancels a held address rather than
   only moving the page — it should still read as the link it stands in for. */
.parent-pay__abandon { margin: 6px 0 0; }
.parent-pay__abandon .parent-link { background: none; border: 0; cursor: pointer; font: inherit; padding: 0; }
.parent-pay__abandon .parent-link::before { content: "\2190"; margin-right: 8px; }

/* What the sign-in inside the wizard has to say for itself. */
.parent-signup__said { color: var(--parent-muted); font-size: 13.5px; margin: 0; min-height: 18px; }

/* Said above a signup that was picked up rather than begun. */
.parent-signup__resumed { align-items: baseline; color: var(--parent-muted); display: flex; font-size: 14px; gap: 10px; margin: 0 0 18px; }
.parent-signup__resumed[hidden] { display: none; }
.parent-signup__resumed .parent-link { background: none; border: 0; cursor: pointer; font: inherit; padding: 0; text-decoration: underline; }

/* Whose signup this is: the name is the way to everything the account can
   do, rather than a label sitting beside two more links. */
.parent-who { position: relative; }
.parent-who[hidden] { display: none; }

.parent-who__name {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-size: 15px;
	font-weight: 650;
	gap: 8px;
	list-style: none;
	padding: 6px 2px;
}

/* The disclosure triangle a browser draws is not the arrow this wants. */
.parent-who__name::-webkit-details-marker { display: none; }

.parent-who__name::after {
	border: solid currentColor;
	border-width: 0 2px 2px 0;
	content: "";
	height: 6px;
	transform: rotate(45deg) translateY(-2px);
	width: 6px;
}

.parent-who[open] .parent-who__name::after { transform: rotate(-135deg) translateY(-1px); }

.parent-who__menu {
	background: var(--parent-surface, #fff);
	border: 1px solid var(--parent-border);
	border-radius: 10px;
	box-shadow: 0 18px 40px rgb(16 24 40 / 12%);
	display: grid;
	min-width: 190px;
	padding: 6px;
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	z-index: 20;
}

.parent-who__item {
	border-radius: 7px;
	color: inherit;
	display: block;
	font-size: 14.5px;
	padding: 9px 12px;
	text-decoration: none;
	white-space: nowrap;
}

.parent-who__item:hover,
.parent-who__item:focus-visible { background: rgb(16 24 40 / 6%); }

/*
 * What the server says about an address while somebody is typing it. Free is
 * said as plainly as taken: the point of asking early is to be able to keep
 * going, and a box that only ever speaks up to complain teaches people to
 * ignore it.
 */
.parent-address__says {
	display: block;
	font-size: .85rem;
	margin-top: .35rem;
}

.parent-address__says.is-free { color: #1b7a4b; }
.parent-address__says.is-taken { color: #a3271f; }

/* Platform front-page responsive corrections ---------------------------- */

/* The tabs already establish the top edge of the panel. A normal panel inset
   is enough below them; the former 70px top inset read as an empty section. */
:is(.ps-kit-page,.aws-ordering) .aws-address__ask {
	grid-template-columns: minmax(0, 1fr) auto;
	padding: 24px;
}

/* The explanation opens outside the field row, so the card must not crop it.
   Keep clipping on the tab strip itself to preserve the rounded top corners. */
:is(.ps-kit-page,.aws-ordering) .aws-address__inner {
	min-height: 260px;
	overflow: visible;
	position: relative;
}

/* The tab callouts need the normal address panel to allow overflow, but once
   the wizard replaces that panel its full-size form must stay inside the
   card's rounded border. */
:is(.ps-kit-page,.aws-ordering) .aws-address__inner.is-wizard {
	overflow: hidden;
}

/* The row divides by however many ways are offered, rather than by three.
   An address that does not lend its name has two — the Allow subdomains switch
   takes the subdomain out — and a third column held open for a tab that is
   not there left the tabs in two-thirds of the row with an empty box beside
   them, the last border falling in the middle of nothing. */
:is(.ps-kit-page,.aws-ordering) .aws-address__ways {
	border-radius: 22px 22px 0 0;
	overflow: hidden;
}

/* The native radios remain the accessible controls, but their browser glyphs
   stay out of the painted tabs. Focus is transferred visibly to the label. */
:is(.ps-kit-page,.aws-ordering) .aws-address__ways input[type="radio"] {
	block-size: 1px !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	inline-size: 1px !important;
	margin: -1px !important;
	opacity: 0 !important;
	overflow: hidden !important;
	position: absolute !important;
}

:is(.ps-kit-page,.aws-ordering) .aws-address__ways .aws-chip:has(input:focus-visible) {
	outline: 2px solid var(--ps-accent);
	outline-offset: -4px;
}

:is(.ps-kit-page,.aws-ordering) .aws-address__meta {
	display: grid;
	gap: 6px;
	grid-column: 1 / -1;
	grid-row: 2;
	padding-left: 16px;
}

:is(.ps-kit-page,.aws-ordering) .aws-address__meta .aws-address__suffix {
	grid-column: auto;
	grid-row: auto;
	margin: 0;
	padding-left: 0;
}

:is(.ps-kit-page,.aws-ordering) .aws-address__inner > .aws-address__note {
	background: #fff3cd;
	border: 2px solid var(--ps-ink);
	border-radius: 12px;
	color: #664d03;
	display: block;
	font-size: 12px;
	line-height: 1.45;
	margin: 26px auto 18px;
	padding: 11px 13px;
	position: relative;
	max-width: calc(100% - 48px);
	width: fit-content;
	z-index: 6;
}

/* A square, turned. Two triangles stacked half a pixel apart drew the border
   as a sliver of the darker one showing past the lighter -- a hairline that
   antialiasing softened into a grey smudge, and at the tip, where both
   triangles come to nothing, into no border at all. A rotated square carries a
   real border on the two edges that face out, and its corner is a corner:
   sharp at the tip and the same weight all the way down. Its fill matches the
   toast, and it sits half over the toast's own border so the two read as one
   shape. */
:is(.ps-kit-page,.aws-ordering) .aws-address__inner > .aws-address__note::after {
	background: #fff3cd;
	block-size: 13px;
	border-left: 2px solid var(--ps-ink);
	border-top: 2px solid var(--ps-ink);
	bottom: 100%;
	content: "";
	display: block;
	inline-size: 13px;
	/* Half its own height plus the border it meets, so the square's widest
	   point -- its side corners -- sits behind the toast rather than just
	   clear of it, where the two bordered edges ended in a nub each. What is
	   left above the line is a triangle with a border down both sides. */
	margin-bottom: -8.5px;
	margin-left: -7px;
	position: absolute;
	/* The older rule up the file puts this arrow below the toast and against
	   its right edge. Both are answered here, or the two rules place the same
	   pseudo in two places and the over-constrained one wins. */
	right: auto;
	top: auto;
	transform: rotate(45deg);
}

/* Under the tab it belongs to, wherever that tab happens to be. This named
   each way and gave it a share of three -- 16.666%, 50%, 83.333% -- which are
   the centres of three equal columns. An address that does not lend its name
   has two tabs, so every one of those numbers pointed at the wrong place: the
   first tab's toast reached for the middle and the second's for a column that
   was not there. The script measures the tab and says where, so the count
   stops mattering. */
:is(.ps-kit-page,.aws-ordering) .aws-address__inner > .aws-address__note {
	margin-left: var(--aws-note-left, auto);
	margin-right: auto;
}

:is(.ps-kit-page,.aws-ordering) .aws-address__inner > .aws-address__note::after {
	left: var(--aws-note-arrow, 50%);
}

/* While an address is being confirmed, its status belongs in the middle of
   the form that is waiting, with the words visible beside the motion. */
:is(.ps-kit-page,.aws-ordering) .ps-address-selected.is-loading {
	align-items: center;
	background: rgb(248 247 247 / 92%);
	border: 0;
	border-radius: 22px;
	display: flex;
	gap: 10px;
	inset: 52px 0 0;
	justify-content: center;
	margin: 0;
	padding: 24px;
	position: absolute;
	z-index: 10;
}

:is(.ps-kit-page,.aws-ordering) .ps-address-selected.is-loading .parent-spinner {
	display: block;
	margin: 0;
}

:is(.ps-kit-page,.aws-ordering) .ps-address-selected__waiting {
	font-size: 14px;
	font-weight: 700;
}

/* Five plans keep a readable minimum and form as many rows as their own
   container permits. This also works when the block is placed in a column. */
.ps-kit-page .aws-tiers__grid {
	grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
}

/* These short titles are deliberately single-line at the composition's wide
   sizes. The container rule below releases that instruction before it can
   turn a title into page-wide horizontal overflow. */
.ps-kit-page :is(
	.aws-steps__heading,
	.aws-tiers__heading,
	.aws-cards__heading,
	.aws-asked__heading
) {
	white-space: nowrap;
}

@container (max-width: 860px) {
	.ps-kit-page :is(
		.aws-steps__heading,
		.aws-tiers__heading,
		.aws-cards__heading,
		.aws-asked__heading
	) {
		white-space: normal;
	}
}

@container (max-width: 640px) {
	:is(.ps-kit-page,.aws-ordering) .aws-address__ask {
		display: grid;
		column-gap: 0;
		grid-template-columns: minmax(0, 1fr) auto;
		row-gap: 10px;
	}

	:is(.ps-kit-page,.aws-ordering) .aws-address__value {
		border-radius: 999px 0 0 999px;
		border-right: 0;
		font-size: 16px;
		grid-column: 1;
		grid-row: 1;
		width: 100%;
	}

	:is(.ps-kit-page,.aws-ordering) .aws-address__meta {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	:is(.ps-kit-page,.aws-ordering) .aws-address__why {
		height: 44px;
		width: 44px;
	}

	:is(.ps-kit-page,.aws-ordering) .aws-address__check {
		border-radius: 0 999px 999px 0;
		grid-column: 2;
		grid-row: 1;
		margin-left: -1px;
		min-height: 46px;
	}
}

/* Five links fit without a drawer. On narrow screens they take a clearly
   separated second row rather than becoming an unadvertised horizontal rail. */
@media (max-width: 700px) {
	.ps-nav {
		border-top: 1px solid var(--ps-rule);
		flex-wrap: wrap;
		overflow: visible;
		padding-top: 14px;
	}
}

/* Waiting for a new site to become openable. The spinner already existed and
   turned for 120ms before the page was sent to an address that was not ready;
   what is added here is the part that says which of the three things is
   happening, so the wait reads as work rather than as a hang. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting {
	display: grid;
	justify-items: center;
	padding: 24px;
	text-align: center;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting .ps-codex-redirect {
	min-height: 96px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting__said {
	font-size: 16px;
	font-weight: 700;
	margin: 6px 0 0;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting__aside {
	color: var(--ps-muted);
	font-size: 13px;
	margin: 6px 0 0;
	max-width: 34em;
}

/* The address itself, as something to press.

   Everything between the wizard and the new site is out of the wizard's hands:
   a browser may refuse the hop or sit on a name it has not resolved, and the
   panel goes on saying "Opening it now" with nothing on it to do. The link is
   put up at the same moment the hop is tried, so somebody whose browser goes
   on its own never reads it and somebody whose browser does not has their site
   one press away. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting__open {
	margin: 14px 0 0;
}

/* And the one that carries on looking, after the wait has run out and the
   owner has gone away to point their domain at us. Same spacing as the link
   above it, so the two read as a pair rather than as one thing stuck to
   another. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting__retry {
	margin: 14px 0 0;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-waiting__retry[disabled] {
	cursor: default;
	opacity: 0.6;
}

/* The end of a signup on a domain: the site is up on a name of ours, and the
   domain it is heading for is said here, where it was chosen. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-planned {
	display: grid;
	gap: 12px;
	padding: 24px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned h3 {
	margin: 0;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__move {
	border: 1px solid var(--ps-line, #dcdcde);
	border-left: 4px solid var(--ps-go);
	display: grid;
	gap: 6px;
	padding: 14px 16px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__title {
	font-size: 16px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__move p {
	margin: 0;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__last {
	color: var(--ps-muted);
	font-size: 13px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__dns code {
	background: rgba(0, 0, 0, .06);
	border-radius: 4px;
	padding: 1px 5px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__do {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__check {
	background: transparent;
	border: 2px solid var(--ps-go);
	border-radius: 999px;
	color: var(--ps-go);
	cursor: pointer;
	font-weight: 700;
	min-height: 44px;
	padding: 8px 18px;
}

:is(.ps-kit-page,.aws-ordering) .ps-codex-planned__check[disabled] {
	cursor: default;
	opacity: .6;
}

/* The other ways to have the same name, as a registrar's list of them: one row
   a name, the price on the right, and the way to take it at the end. A sale is
   the registry's own figures — a first year under the renewal price — and is
   marked rather than merely cheaper, because a row somebody scrolls past is a
   row that did not say anything. */
:is(.ps-kit-page,.aws-ordering) .aws-address__more{border-top:2px solid var(--ps-ink);margin:14px 0 0;padding:0}
:is(.ps-kit-page,.aws-ordering) .aws-address__moreHead{color:var(--ps-muted);font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.12em;margin:0;padding:14px 24px 6px;text-transform:uppercase}
:is(.ps-kit-page,.aws-ordering) .aws-address__offer{align-items:center;border-top:1px solid #e3e1e1;display:grid;font-family:Arial,Helvetica,sans-serif;gap:12px;grid-template-columns:minmax(0,1fr) auto auto;overflow:hidden;padding:14px 24px;position:relative}
:is(.ps-kit-page,.aws-ordering) .aws-address__offerName{font-size:17px;font-weight:700;overflow-wrap:anywhere}
:is(.ps-kit-page,.aws-ordering) .aws-address__offerCost{display:grid;font-size:15px;justify-items:end;line-height:1.3;text-align:right;white-space:nowrap}
:is(.ps-kit-page,.aws-ordering) .aws-address__offerCost s{color:var(--ps-muted);font-size:13px}
:is(.ps-kit-page,.aws-ordering) .aws-address__offerCost b{font-size:17px}
:is(.ps-kit-page,.aws-ordering) .aws-address__offerCost small{color:var(--ps-muted);font-size:12px}
:is(.ps-kit-page,.aws-ordering) .aws-address__offer.is-sale .aws-address__offerCost small{color:#c42d17}
/* The free one is the first row and the cheapest thing on the list, so it is
   marked as an answer rather than left to look like the others. */
:is(.ps-kit-page,.aws-ordering) .aws-address__offer.is-free{background:#f1faf2}
:is(.ps-kit-page,.aws-ordering) .aws-address__offer.is-free .aws-address__offerCost b{color:var(--ps-go)}
:is(.ps-kit-page,.aws-ordering) .aws-address__offer.is-free .aws-address__add{background:var(--ps-go);color:#fff}
:is(.ps-kit-page,.aws-ordering) .aws-address__add{background:transparent;border:2px solid var(--ps-go);border-radius:999px;color:var(--ps-go);font-size:14px;font-weight:700;min-height:40px;padding:8px 16px;white-space:nowrap}
:is(.ps-kit-page,.aws-ordering) .aws-address__add:hover,:is(.ps-kit-page,.aws-ordering) .aws-address__add:focus-visible{background:var(--ps-go);color:#fff}
/* The corner flash, drawn rather than fetched: one rotated block, clipped by the
   row it sits in. */
:is(.ps-kit-page,.aws-ordering) .aws-address__offer.is-sale:after{background:#3ba9e0;color:#fff;content:"SALE";font-size:9px;font-weight:700;letter-spacing:.08em;padding:3px 26px;position:absolute;right:-24px;top:7px;transform:rotate(45deg)}

/* A registrar's list of names: the name, how long for, what it costs, and the
   way to take it -- one row each, so the prices line up in a column somebody
   can read down rather than a sentence per line. */
.ps-domain-results>div>strong{font-size:16px!important;font-weight:700}
.ps-domain-results__price{display:grid;justify-items:end;line-height:1.25;text-align:right;white-space:nowrap}
.ps-domain-results__price b{color:var(--ps-ink);font-size:17px!important;font-weight:700}
.ps-domain-results__price s{color:var(--ps-muted);font-size:13px!important}
.ps-domain-results__price small{color:var(--ps-muted);font-size:12px!important}
/* What the figure covers sits beside it rather than under it. */
.ps-domain-results__price b small{color:inherit;font-size:13px!important;font-weight:400;margin-left:5px}
.ps-domain-results>div.is-sale .ps-domain-results__price small{color:#c42d17}
/* Struck price and new price on one line, the way a shop writes it. */
.ps-domain-results>div.is-sale .ps-domain-results__price{grid-template-columns:auto auto;justify-items:end;column-gap:8px}
.ps-domain-results>div.is-sale .ps-domain-results__price small{grid-column:1/-1}
/* The platform's own action red, the same one the header is asking with, so
   the thing to press looks the same wherever somebody meets it. */
.ps-domain-results__choose{align-items:center;background:#ef3218;border:2px solid #ef3218;color:#fff;display:inline-flex;font-size:15px!important;font-weight:800;gap:8px;letter-spacing:.06em;padding:10px 20px}
.ps-domain-results__choose:hover,.ps-domain-results__choose:focus-visible{background:#c42d17;border-color:#c42d17;color:#fff}
/* The label is a span, and every span in this list is muted grey at 13px by the
   rules above -- which a span inside a button inherits nothing past, so the word
   on a red button was being painted the colour of a footnote. Answered at the
   same specificity those rules carry, or they go on winning. */
.ps-domain-results__choose span{color:inherit}
:is(.ps-kit-page,.aws-ordering) .ps-domain-results__choose span{color:inherit;font-size:inherit}
.ps-domain-results__cart{display:block;flex:none;stroke-width:2.4}
/* The corner flash, drawn rather than fetched: one rotated block, clipped by
   the row it sits in. */
.ps-domain-results>div.is-sale:after{background:#3ba9e0;color:#fff;content:"SALE";font-size:9px;font-weight:700;letter-spacing:.08em;padding:3px 26px;position:absolute;right:-24px;top:6px;transform:rotate(45deg)}

/* The plan, chosen from a list rather than from a column of radios, with what
   it includes underneath. The list was a stack of rows each carrying a second
   button, and what a plan actually holds sat behind whichever of those the
   reader happened to press. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-pick{display:grid;gap:6px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-said{border:1px solid var(--ps-rule,#ccc);border-radius:8px;margin-top:10px;padding:14px 16px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-price{align-items:baseline;display:flex;flex-wrap:wrap;gap:4px 12px;margin:0}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-price b{font-size:22px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-price small{color:var(--ps-muted,#666);font-size:13px;font-weight:400}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-said .ps-codex-plan-lines{border:0;font-size:13px;list-style:none;margin:12px 0 0;padding:0}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-said .ps-codex-plan-lines li{align-items:flex-start;border-top:1px solid var(--ps-rule,#ddd);display:flex;gap:8px;line-height:1.45;padding:8px 0}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-said .ps-codex-plan-lines li::before{color:var(--ps-go,#1a7f37);content:"\2713";font-weight:800}
/* No longer welded to the right edge of a row: it stands under the list it
   belongs to, and opens the comparison of every plan. */
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-said .ps-codex-plan-detail{background:transparent;border:1px solid var(--ps-ink,#222);border-radius:999px;cursor:pointer;font:700 12px/1 Arial,Helvetica,sans-serif;margin-top:14px;padding:9px 16px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-plan-said .ps-codex-plan-detail:hover{background:var(--ps-ink,#222);color:#fff}

/* -------------------------------------------------------------------------
 * The account row's actions, drawn rather than written.
 *
 * Website, Dashboard and the offer of a shorter name sat in a row as three
 * pieces of text of three different lengths, which made the row longer than
 * the site it was about. Each is one small drawing now, with what it does on
 * hovering and on the label a screen reader reads.
 *
 * Sized by what is in them rather than by the padding a worded button carries,
 * or a square icon sits in an oblong.
 * ---------------------------------------------------------------------- */
.parent-link--icon,
.parent-button--icon {
	align-items: center;
	display: inline-flex;
	justify-content: center;
	line-height: 0;
	padding: 8px;
}

.parent-button--icon {
	/* Round, because it is as wide as it is tall and the pill it inherits
	   would otherwise draw an oval around a square. */
	border-radius: 50%;
}

.parent-link--icon svg,
.parent-button--icon svg {
	display: block;
}

/* -------------------------------------------------------------------------
 * Where a business says which cities it works in.
 *
 * Ticked from the directory's own list rather than typed, so the widths are
 * the names' own and they wrap into however many rows the screen allows.
 * ---------------------------------------------------------------------- */
.aws-towns {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	margin-block: 6px 2px;
}

.aws-towns__one {
	align-items: center;
	display: inline-flex;
	gap: 6px;
	/* A tick and its name are one thing to press, and one thing that should
	   not be broken across a line halfway through. */
	white-space: nowrap;
}

.aws-field--towns {
	border: 0;
	margin: 0;
	padding: 0;
}

/* -------------------------------------------------------------------------
 * A box that suggests what somebody is typing the name of.
 *
 * Under the field rather than over the page, so nothing is positioned against
 * a form that may be anywhere and at any width. A town among the suggestions
 * is marked as one: it is offered so it can be recognised, not chosen.
 * ---------------------------------------------------------------------- */
.aws-suggest {
	/* A sheet of its own, over whatever it is in front of. Fixed to the box's
	   corner by the script -- in the flow it was drawn under the panel the box
	   sits in, which has a background and wins. */
	background: var(--wp--preset--color--background, #fff);
	border: 1px solid var(--wp--preset--color--border, #e3e7ec);
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
	display: flex;
	flex-direction: column;
	max-height: 16rem;
	overflow-y: auto;
}

.aws-suggest__one {
	background: none;
	border: 0;
	border-block-end: 1px solid var(--wp--preset--color--border, #e3e7ec);
	cursor: pointer;
	font: inherit;
	padding: 8px 10px;
	text-align: start;
}

.aws-suggest__one:last-child {
	border-block-end: 0;
}

.aws-suggest__one:hover,
.aws-suggest__one:focus-visible {
	background: var(--wp--preset--color--neutral-100, #f3f4f6);
}

/* A name that is kept for the city's own page: shown so it is recognised,
   and plainly not one of the ones on offer. */
.aws-suggest__one.is-city {
	color: var(--wp--preset--color--muted, #5b6672);
	cursor: default;
}

.aws-suggest__one {
	align-items: baseline;
	display: flex;
	gap: 10px;
	justify-content: space-between;
}

.aws-suggest__what {
	flex: 1 1 auto;
}

/* Why it cannot be had, beside it rather than after pressing it. */
.aws-suggest__why {
	border: 1px solid currentColor;
	border-radius: 999px;
	flex: 0 0 auto;
	font-size: .78em;
	opacity: .8;
	padding: 1px 8px;
	white-space: nowrap;
}

.aws-suggest__note {
	font-size: .9em;
	margin-block: 6px 0;
}


/*
 * The storefront worn by a publication, rather than standing on its own canvas.
 *
 * Everything above is drawn against a full page: gutters of its own, a
 * headline sized off the viewport, a type scale that has the whole width to
 * itself. Put the same markup inside a paper's content column -- which is what
 * a publication selling addresses on a page among its pages asks for -- and
 * each of those becomes wrong in the same direction. Two sets of gutters. A
 * headline sized for a screen, set in a column. Bands of section padding meant
 * to separate one screenful from the next.
 *
 * Scaled here rather than in the mock, because the mock is still right about
 * the canvas. This is the same design asked to fit in a narrower room.
 */
.ps-worn .ps-page{overflow:visible}

/* One set of gutters. The theme's column already provides the other. */
.ps-worn .ps-wrap{max-width:none;padding-inline:0}

/*
 * And the same width as the rest of the site.
 *
 * A block theme puts a page's words in the narrow column -- awate's is 760px
 * -- and its menu, its masthead and its headline in the wide one, 1180px. The
 * storefront went in as words, so it stood indented inside a site whose every
 * other row ran to the wider measure, which reads as a page that has slipped.
 *
 * Widened by arithmetic rather than by 100vw: the viewport unit counts the
 * scrollbar and the container does not, and the few pixels between them are a
 * horizontal scrollbar across every page this is on.
 *
 * The 50% is the column it is actually sitting in, whatever that turns out to
 * be, so the box ends up centred on the same centre line as the masthead. An
 * earlier try subtracted the theme's declared content size instead and landed
 * short, because the column a page's words get is not always the number the
 * theme writes down.
 *
 * Only once there is room for it. Below this the narrow column is the whole
 * of the available width anyway, and the negative margins would be pulling
 * the page wider than the screen.
 */
@media (min-width: 1240px) {
  .ps-worn.ps-worn {
    margin-inline: calc(50% - var(--wp--style--global--wide-size, 1180px) / 2);
    max-width: none;
    width: var(--wp--style--global--wide-size, 1180px);
  }
}

/* The paper's own page title is directly above; the hero does not need to
   clear it again. */
.ps-worn .ps-hero{padding-block:0 clamp(26px,3.6vw,52px)}
.ps-worn .ps-hero h1{font-size:clamp(34px,4.2vw,58px);line-height:.95}
.ps-worn .ps-closing h2{font-size:clamp(28px,3.4vw,48px)}
.ps-worn .ps-section h2,.ps-worn .ps-dashboard h2{font-size:clamp(25px,2.5vw,34px)}
.ps-worn .ps-plans strong{font-size:clamp(28px,2.6vw,40px)}
.ps-worn .ps-stat-grid b{font-size:clamp(21px,2vw,29px)}

/* Bands sized for a screenful, set among a page's other sections. */
.ps-worn .ps-section{padding-block:clamp(32px,4.2vw,58px)}
.ps-worn .ps-closing{padding-block:clamp(38px,4.6vw,66px)}
.ps-worn .ps-dashboard{padding-bottom:clamp(38px,4.6vw,62px)}

/* The full-bleed bands are panels here, not the edge of the screen. */
.ps-worn .ps-stats,.ps-worn .ps-closing{border-radius:20px}
.ps-worn .ps-stats .ps-wrap,.ps-worn .ps-closing .ps-wrap{padding-inline:clamp(18px,3vw,40px)}

/* The platform wearing a banner instead of its name.

   The width of the window, at its own shape, above the header rather than
   inside it. A five-to-one banner squeezed into the row beside the navigation
   is a strip of gold nobody can read the tagline on — and the header sticks,
   so a masthead that tall carried down the page would take a third of a laptop
   screen with it. This way the banner scrolls away and the menu stays, which
   is the arrangement the masjids' own sites already have.

   Dark behind it, because the artwork is dark to its edges: a pale gap under a
   banner that has not painted yet reads as a broken image. */
.ps-masthead {
	background: #10100f;
	line-height: 0;
}

.ps-masthead__link {
	display: block;
}

.ps-masthead__mark {
	display: block;
	height: auto;
	width: 100%;
}

/* The row underneath holds the way in and a callout, and nothing else: the
   name is in the masthead and the sections are in the corner. So it is as
   tall as those two are and no taller — a minimum height was keeping a
   header's worth of room for a header that is no longer there, and the
   callout, shifted down 44px to hang off the old one, left the band above it
   empty and the band below it empty as well.

   Nothing to hang off, so it stops hanging: it sits on its own line with the
   way in, and its tail still points down at the panel it is about. */
.ps-header.has-mark .ps-header__inner {
	min-height: 0;
	padding-block: 0;
}

.ps-header.has-mark .ps-create {
	margin-right: 0;
	top: 0;
}

/* And under a masthead it stops being a bar at all.

   What was left in it was one button. Signed in there was not even that — the
   name is in the corner now — so the band was a rule across the page with
   nothing above it and nothing below it, holding a screen's worth of the page
   down. The button keeps its place at the right and the page starts directly
   under the banner.

   The way in goes with the band: it is in the corner menu, for a visitor and
   for somebody signed in alike, and this was the second copy of it.

   Not sticky either. What made the header worth carrying down the page was
   the navigation in it, and that is in the corner now; a lone callout stuck to
   the top of the window, pointing at a panel that is no longer on screen, is
   a button that has lost its sentence. */
.ps-header.has-mark {
	background: transparent;
	border-bottom: 0;
	position: static;
}

.ps-header.has-mark .ps-signin {
	display: none;
}

/* With a masthead above it, the row beneath is a menu bar and has no name in
   it. On a narrow screen that left the first line empty and dropped the
   callout — which is shifted down 44px to hang off a 108px header — straight
   on top of the menu. Nothing to hang from, so it stops hanging: it sits at
   the end of its own line, above the menu, with its tail put away. */
@media (max-width: 900px) {
	.ps-header.has-mark .ps-header__inner {
		padding-block: 12px;
		row-gap: 12px;
	}

	.ps-header.has-mark .ps-create {
		margin-left: auto;
		margin-right: 0;
		top: 0;
	}

	.ps-header.has-mark .ps-create::before,
	.ps-header.has-mark .ps-create::after {
		display: none;
	}
}

/* The menu in the top strip.

   The strip is small, spaced and upper-case, and the control it now holds is
   the same one the account corner uses elsewhere — so the summary takes the
   strip's voice while the panel takes its own back. Without that the links
   inside came out upper-case and letter-spaced, which is a menu shouting at
   somebody who opened it to read four words. */
.ps-notice .ps-me > summary {
	color: #f2a58f;
	font-size: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
}

.ps-notice .ps-me__panel {
	font-size: 15px;
	letter-spacing: 0;
	text-transform: none;
}

/* Clear of the strip rather than hard against it, and never underneath the
   sticky header that starts immediately below. */
.ps-notice .ps-me__panel {
	top: calc(100% + 6px);
	z-index: 50;
}

/* The row under the masthead, once the links moved to the corner.

   What is left in it is the one thing the page is for and the way in, and the
   navigation that used to push them across with margin-right:auto has gone —
   so the push comes from the button instead, or the pair of them sits at the
   left of an otherwise empty row. */
.ps-header__inner .ps-create {
	margin-left: auto;
}

/* And the links in it read from the left.

   The strip pushes its one link into the corner with margin-left:auto, which
   is right for a link sitting in a flex row and wrong for the ten inside the
   panel: the panel is a grid, and an auto left margin on a grid item shrinks
   it to its text and pins it to the right of its track. Every item in the menu
   was ranged right, each one starting in a different place. */
.ps-notice .ps-me__panel a {
	margin-left: 0;
}

/* The account menu in its parts -- the site's pages, WordPress, the Store --
   each folded under its name, one open at a time, and the way out (or in)
   under them all. */
.ps-me__group {
	display: grid;
}

.ps-me__group + .ps-me__group {
	border-top: 1px solid #e6e4e4;
}

.ps-me__head {
	align-items: center;
	color: var(--ps-ink);
	cursor: pointer;
	display: flex;
	font-size: 15px;
	font-weight: 700;
	justify-content: space-between;
	list-style: none;
	padding: 10px 12px;
}

.ps-me__head::-webkit-details-marker {
	display: none;
}

.ps-me__head::after {
	color: #8a8686;
	content: "\203A";
	font-size: 18px;
	line-height: 1;
	transition: transform .15s ease;
}

.ps-me__group[open] > .ps-me__head::after {
	transform: rotate(90deg);
}

.ps-me__head:hover {
	background: #f3f2f2;
}

.ps-me__links {
	display: grid;
	padding: 0 0 6px 10px;
}

.ps-me__group + a {
	border-top: 1px solid #e6e4e4;
	margin-top: 4px;
}

/* The Website: a name like the parts', that goes there rather than opens. */
.ps-me__panel a.ps-me__head {
	display: flex;
	padding: 10px 12px;
}

/* A link, not a part that opens: no chevron to say it does. */
.ps-me__panel a.ps-me__head::after {
	content: none;
}

.ps-me__group + .ps-me__solo,
.ps-me__solo + .ps-me__group {
	border-top: 1px solid #e6e4e4;
	margin-top: 0;
}

/* And the page starts under the masthead rather than a screen further down.

   The content's top padding was set when the header above it was a name and a
   row of links: a banner is already the width of the window and 240px of
   announcement, and another 60px of nothing under it puts the first line of
   the page below the fold on a laptop. Enough is left for the callout's tail
   to hang into without touching the panel it points at. */
.ps-masthead ~ .ps-kit-content {
	padding-top: 0;
}

/* The hero's own opening line sits straight under the callout's row rather
   than a further 15px down it. Under a banner there is nothing above it that
   needs separating from: the banner separates itself. */
.ps-masthead ~ .ps-kit-content .aws-hero {
	padding-top: 0;
}

/* The callout stops holding the page down.

   It was the last thing in the row, and a row with one button in it is still
   a row: 47px of height across the whole page so that one corner could be
   occupied. Lifted out of the flow it keeps that corner and gives the height
   back, and the first line of the page starts directly under the banner.

   On a wide screen only. Narrow, the button shares a line with nothing and
   the page is one column, so a button floating over the top of it would land
   on the first heading rather than beside it. */
@media (min-width: 901px) {
	.ps-header.has-mark {
		height: 0;
		overflow: visible;
		position: relative;
	}

	.ps-header.has-mark .ps-header__inner {
		min-height: 0;
	}

	/* Over the middle of the box it is about, rather than the corner of the
	   page.

	   Measured off the window rather than off the row it sits in, because the
	   two do not share edges: the row is a centred 1440px wrap, and the box is
	   the narrow column of a grid that runs the whole width. The column starts
	   at 57.5vw — 1.15 of the 2 parts the grid is divided into — and ends at
	   the page's right gutter, so its middle is three quarters of the way
	   across less half a gutter. The gutter is the content's own, which grows
	   once the window is wider than the 1440 the page is laid out on. */
	.ps-header.has-mark .ps-create {
		left: calc(78.75vw - max(clamp(18px, 4.2vw, 60px), (100vw - 1440px) / 2 + 60px) / 2);
		position: absolute;
		top: 6px;
		transform: translateX(-50%);
	}
}

/* Room for the callout, in the column it is about.

   Lifting it out of the flow gave the page its height back — and moved the
   panel it points at up into the same place, so the button landed on the
   panel's own top edge instead of above it.

   The room it needs is taken from the column it hangs over rather than from
   the whole page: the heading on the left still starts against the banner,
   and the panel on the right starts below the button and its tail. Nothing is
   empty here — the heading beside it is what fills the height. */
@media (min-width: 901px) {
	.ps-masthead ~ .ps-kit-content > .aws-address {
		padding-top: 80px;
	}
}

/* The strip stays, now that it is the one that carries the menu.

   What used to be carried down the page was the header underneath it, because
   the navigation lived there. The navigation is in this corner now and the
   header is a callout about a panel at the top of the page, so the sticking
   moves up with the menu: 34px of it, holding the way to every section and
   the visitor's own account.

   Above everything, because the panel that opens out of it has to draw over
   the page rather than under it. */
.ps-notice {
	position: sticky;
	top: 0;
	z-index: 60;
}

/* A platform page that is not the sign-up page is one column.

   The shell opens as two — the hero on the left, the address panel on the
   right — and every section after them spans both. That is right for the page
   somebody signs up on, and wrong for the rest of the site: a page whose only
   section is its first one put that section in the left column at 57% of the
   width, with the empty right column beside it. Five plans then came out three
   rows deep on a screen with room for two, and the fix people reach for is to
   widen the plans, which are not what is narrow. */
.ps-kit-page:not(.ps-with-panel) .ps-kit-content {
	display: block;
}

/* In the same column as the logo and the strip above it, which past 1440px
   are a centred 1440 with their own gutter. A fixed gutter here held the
   headline against the window's left edge on a wide screen while the logo
   sat a quarter of the way in, so the logo read as floating in the middle. */
.ps-kit-page:not(.ps-with-panel) .ps-kit-content > section:first-child {
	padding-inline: max(clamp(18px, 4.2vw, 60px), calc((100vw - 1440px) / 2 + 60px));
}

/* The platform wearing a mark instead of a banner.

   A lockup — the symbol and the name, a few hundred pixels of it — goes where
   the name went: at the left of the header row, the height of the row, and
   scrolling with it because that row sticks. Not across the window: artwork
   drawn at 290px enlarged to 1440 is a signature painted onto a wall, and
   everything the masthead rules do above is for artwork that was drawn to go
   there.

   Its height is the row's, within reason: enough for the name in it to be
   read at a glance and not so much that a 108px row has nothing left in it. */
.ps-brand--mark {
	align-items: center;
	display: flex;
	line-height: 0;
}

/* A site's name in words, at most so wide: a long one ("Peachtree Executive
   Car Service") breaks onto a second line rather than pushing the menu beside
   it onto one of its own -- its lines centred on each other. */
.ps-brand:not(.ps-brand--mark) {
	flex: 0 1 auto;
	line-height: 1.1;
	max-width: 9.5em;
	overflow-wrap: anywhere;
	text-align: center;
	text-wrap: balance;
	white-space: normal;
}

.ps-brand__mark {
	display: block;
	height: clamp(34px, 3.4vw, 52px);
	width: auto;
}

@media (max-width: 560px) {
	.ps-brand__mark {
		height: 30px;
	}
}

/* The rule under the header, and the gap under that.

   The header was a band with a two-pixel line across the foot of it and the
   better part of sixty pixels of nothing underneath — a line drawn between the
   name of the company and the first thing it has to say, and then a run-up to
   it. On a laptop that put the opening sentence a third of the way down the
   screen with a horizon ruled across the middle.

   The band separates itself: it is a solid colour, it sticks, and whatever
   scrolls under it stops at its edge. So the line goes, and what is left
   between the two is the hero's own top padding. */
.ps-header {
	border-bottom: 0;
}

.ps-kit-page .ps-kit-content {
	padding-top: clamp(6px, 0.8vw, 12px);
}

/* The picture starts where the words start.

   The block centres it against the column, which is right where a hero is a
   sentence and a photograph and wrong here: this column runs a headline, a
   paragraph and a row of proof points, so the circle was pushed down past the
   headline it belongs beside and hung below the fold on a laptop. Ranged to
   the top it sits level with the opening line, and what is under it is the
   space the words leave rather than the other way round. */
.ps-kit-page .aws-hero__figure {
	align-self: start;

	/* Up to the header's own edge, and a little under it: the picture's
	   ground is the page's colour, so what passes behind the header is
	   nothing anybody can see going. */
	margin-top: -40px;

	/* The width of its own column, and flush with the page's right gutter.
	   Held to 480 it left a hand's width of empty page to the right of it
	   while the words on the left ran to their own edge — a picture inset
	   from a margin that nothing else on the page is inset from. */
	margin-inline: 0;
	max-width: none;
}

/* The words run to the width of their own column.

   They were held to 14 characters of headline and 45 of paragraph, which was
   the measure for a page whose right-hand half held a sign-up panel. On the
   company's own front page the right-hand half holds a picture that stops
   well short of it, so the two were separated by a hand's width of nothing
   while the headline broke "that runs the / work flow" across four lines.

   The picture does not move: it is centred in its own column, and nothing
   here touches the columns. */
.ps-kit-page .aws-hero__heading {
	max-width: none;
}

.ps-kit-page .aws-hero__lede {
	max-width: 60ch;
}

.ps-kit-page .aws-hero__proof {
	max-width: none;
}

/* The three promises under the hero: three even columns, each led by a small
   square in the accent, rather than one line run together with dots -- which
   wrapped its last promise onto a line of its own, starting with a dot. One
   above the other where there is no room for three. */
.ps-kit-page .aws-hero__proof {
	display: grid;
	font-size: 14px;
	gap: 12px 28px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	line-height: 1.4;
	padding-top: 18px;
}

.ps-kit-page .aws-hero__proof li {
	align-items: flex-start;
	display: flex;
	gap: 10px;
	margin: 0;
}

.ps-kit-page .aws-hero__proof li::before,
.ps-kit-page .aws-hero__proof li + li::before {
	background: var(--wp--preset--color--accent);
	border-radius: 2px;
	content: "";
	flex: none;
	height: 8px;
	margin: 6px 0 0;
	width: 8px;
}

@container (max-width: 640px) {
	.ps-kit-page .aws-hero__proof { grid-template-columns: minmax(0, 1fr); }
}

/* A square frame, and the whole picture inside it.

   The block cuts a circle and fills it — background-size:cover, scaled 4% past
   the edge — which is right for a photograph of a room, where the corners are
   nothing and the middle is the subject. These are not photographs: they are
   screens, and a screen with its corners cut and 4% shaved off every side is a
   screen with its toolbar missing.

   So the frame is square and the picture is drawn whole inside it: contain
   rather than cover, and no scale. Both are said for the turning stack and for
   the single picture, because a hero given one image draws an <img> and a hero
   given several draws backgrounds. */
.ps-kit-page .aws-hero__turn,
.ps-kit-page .aws-hero__image {
	border-radius: 0;
}

.ps-kit-page .aws-hero__slide {
	background-repeat: no-repeat;
	background-size: contain;
	transform: none;
}

.ps-kit-page .aws-hero__image {
	object-fit: contain;
}

/* Less room between the sections.

   Each band carried up to 90px above and below, so two of them side by side
   put 180px of empty page between the end of one thought and the heading of
   the next — more than the height of the heading, and on a laptop a whole
   section's worth of scrolling through nothing.

   The hero had it worse. The picture is drawn on a square whose lowest eighth
   is ground the colour of the page, so under the screens there was that, then
   the hero's 55px, then the next section's own: the heading sat nearly 200px
   below the last thing on the screen above it. The figure gives most of its
   empty foot back, and the hero keeps only a little of its own. */
.ps-kit-page .aws-hero {
	padding-bottom: clamp(12px, 1.6vw, 24px);
}

.ps-kit-page .aws-hero__figure {
	margin-bottom: -7%;
}

.ps-kit-page :is(.aws-steps, .aws-split, .aws-plans, .aws-kinds, .aws-cards, .aws-goal, .aws-asked) {
	padding-block: clamp(36px, 4vw, 56px);
}

/* The shelf of cards, dressed as the platform's other sections.

   The kit draws its heading light and its card names in the design's heading
   face, which on a tenant's site is right and here is a section that looks
   borrowed from another website: every other band on these pages has the same
   heavy Arial heading, the same ground and the same rule above it. */
.ps-kit-page .aws-shelf {
	background: var(--ps-bg) !important;
	border-top: 2px solid var(--ps-rule);
	padding: clamp(36px, 4vw, 56px) clamp(18px, 4.2vw, 60px);
}

.ps-kit-page .aws-shelf__inner {
	max-width: 1320px;
	padding-inline: 0;
}

.ps-kit-page .aws-shelf__heading {
	font-family: Arial, Helvetica, sans-serif !important;
	font-size: clamp(30px, 3.2vw, 44px) !important;
	font-weight: 800 !important;
	letter-spacing: -.045em !important;
	line-height: 1 !important;
}

.ps-kit-page .aws-shelf__name,
.ps-kit-page .aws-shelf__title {
	font-family: Arial, Helvetica, sans-serif;
}

.ps-kit-page .aws-shelf__card {
	background: #f8f7f7;
	border: 2px solid var(--ps-rule);
	border-radius: 22px;
}

/* The default logo on an address the platform sells from: the platform's
   three seats, and the address's own name beside them.

   Drawn at the proportions Setayo's own lockup is (scripts/render-setayo-logo.sh):
   the name a quarter again the height of the mark, a quarter of the mark's
   height between them, Archivo 800 tracked in. The face is the brand's and is
   carried here, because a lockup set in whatever the visitor's machine has is
   a different logo on every machine. */
@font-face {
	font-display: swap;
	font-family: "Archivo Lockup";
	font-style: normal;
	font-weight: 800;
	src: url(../fonts/archivo-800-latin.woff2) format("woff2");
}

.ps-lockup {
	align-items: center;
	color: #14181c;
	display: inline-flex;
	font: 800 clamp(26px, 2.6vw, 40px)/1 "Archivo Lockup", Arial, Helvetica, sans-serif;
	gap: .2em;
	letter-spacing: -.035em;
	white-space: nowrap;
}

.ps-lockup__mark {
	display: block;
	flex: none;
	height: .8em;
	width: auto;
}

@media (max-width: 560px) {
	.ps-lockup {
		font-size: 22px;
	}
}

.ps-footer__bottom .aws-credit a,
.aws-credit-strip .aws-credit a { color: inherit; text-decoration: none; }

/* The copyright and the credit, centred under the columns, with the contact
   line centred beneath them rather than pushed to the far corner. */
.ps-footer__bottom {
	align-items: center;
	flex-direction: column;
	gap: 8px;
	justify-content: center;
	text-align: center;
}

/* The hero picture's edges, faded into the page.

   The pictures are squares drawn on the page's own colour, and the shadows of
   the screens in them run out to the square's edge and are cut off there —
   a straight line of slightly darker grey between the headline and the
   picture, read as a border nobody drew. The outermost few hundredths of each
   side fade to nothing, which takes the cut with it. Not more: a tenth faded
   the corners of the screens that sit nearest the edge -- the Northgate
   Centre's browser lost its left side -- and every corner has to be seen. */
.ps-kit-page .aws-hero__turn,
.ps-kit-page .aws-hero__image {
	-webkit-mask-composite: source-in;
	-webkit-mask-image:
		linear-gradient(to right, transparent, #000 3%, #000 97%, transparent),
		linear-gradient(to bottom, transparent, #000 3%, #000 97%, transparent);
	mask-composite: intersect;
	mask-image:
		linear-gradient(to right, transparent, #000 3%, #000 97%, transparent),
		linear-gradient(to bottom, transparent, #000 3%, #000 97%, transparent);
}

/* "LLC" at the top right of the logo, the way a registered mark sits: set in
   the logo's own face, small, and level with the top of the tallest seat. */
.ps-brand__suffix {
	align-self: flex-start;
	color: #14181c;
	font: 800 clamp(10px, .95vw, 14px)/1 "Archivo Lockup", Arial, Helvetica, sans-serif;
	letter-spacing: .04em;
	margin-left: .35em;
	margin-top: .15em;
	top: 0;
}

/* A little more room between the lines of setayo.com's headline than the
   other addresses' have. */
.ps-home.ps-kit-page .aws-hero__heading {
	line-height: 1 !important;
}

/* "Start here", at the far end of the logo's row on setayo.com.

   In the orange of the logo's first seat, so it reads as part of the mark it
   stands beside rather than as another link, and pushed to the row's right
   end. The arrow moves on hover, which is all the movement it has. */
.ps-start {
	align-items: center;
	background: #e85d1f;
	border: 2px solid #e85d1f;
	border-radius: 999px;
	box-shadow: 0 6px 18px rgb(232 93 31 / 25%);
	color: #fff;
	display: inline-flex;
	font: 800 15px/1 Arial, Helvetica, sans-serif;
	gap: 10px;
	letter-spacing: .01em;
	margin-left: auto;
	min-height: 48px;
	padding: 12px 24px;
	text-decoration: none;
	transition: background .15s ease, box-shadow .15s ease;
	white-space: nowrap;
}

.ps-start:hover,
.ps-start:focus-visible {
	background: #c94a12;
	border-color: #c94a12;
	box-shadow: 0 8px 22px rgb(232 93 31 / 35%);
	color: #fff;
}

.ps-start:focus-visible {
	outline: 3px solid #14181c;
	outline-offset: 3px;
}

.ps-start__arrow {
	transition: transform .15s ease;
}

.ps-start:hover .ps-start__arrow {
	transform: translateX(3px);
}

@media (max-width: 560px) {
	.ps-start {
		font-size: 14px;
		min-height: 44px;
		padding: 10px 18px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ps-start,
	.ps-start__arrow {
		transition: none;
	}
}

/* The switcher between somebody's places, in the logo's row at its right end,
   with the page's button after it. */
.ps-header .aws-places-nav {
	margin-left: auto;
	padding: 0;
}

.ps-header .aws-places-nav + .ps-start {
	margin-left: 0;
}

/* The portal's pages -- dashboard, sales, support, hiring, a client's portal --
   start right under the header: they are somewhere to work, not a page to read
   down into. */
.ps-kit-page .ps-kit-content:has(> .aws-portal, > .aws-desk, > .aws-support, > .aws-careers) {
	padding-bottom: 56px;
	padding-top: 0;
}

/* A second door beside the first, outlined rather than filled: Apply beside
   Add new role on the hiring page. */
.ps-start.is-quiet {
	background: transparent;
	box-shadow: none;
	color: #c94a12;
}

.ps-start.is-quiet:hover,
.ps-start.is-quiet:focus-visible {
	background: #e85d1f;
	color: #fff;
}

.ps-start + .ps-start,
.ps-header .aws-places-nav + .ps-start.is-quiet + .ps-start {
	margin-left: 0;
}

/* On the portal's pages the foot stays at the bottom of the window, however
   little the page has in it: the page is a column the window's height, and
   the work between the header and the foot takes whatever room is left. */
body:has(> .ps-footer.is-bare) {
	display: flex;
	flex-direction: column;
	min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 0px));
}

body:has(> .ps-footer.is-bare) > .ps-kit-content {
	flex: 1 0 auto;
}

/* The portal's foot is one line, in a thin band: half the height of a site's
   foot, and no gap kept for a contact line it does not have. */
.ps-footer.is-bare .ps-footer__bottom {
	padding-block: 9px 10px;
}

.ps-footer.is-bare .ps-footer__bottom > span:empty {
	display: none;
}

/* The bell beside the name in the top strip: a count of what is waiting on
   whoever is signed in, and the list of it. */
.ps-notice .ps-bell {
	margin-left: auto;
	margin-right: 18px;
	position: relative;
}

.ps-notice .ps-bell + .ps-me {
	margin-left: 0;
}

.ps-bell > summary {
	align-items: center;
	color: #f2a58f;
	cursor: pointer;
	display: flex;
	gap: 5px;
	list-style: none;
}

.ps-bell > summary::-webkit-details-marker {
	display: none;
}

.ps-bell.has-some > summary {
	color: #fff;
}

.ps-bell__n {
	background: #e85d1f;
	border-radius: 999px;
	color: #fff;
	font: 800 11px/1 Arial, Helvetica, sans-serif;
	letter-spacing: 0;
	min-width: 18px;
	padding: 3px 5px;
	text-align: center;
}

.ps-bell__panel {
	background: #fff;
	border: 1px solid #d8d8d8;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
	color: var(--ps-ink);
	display: grid;
	font-size: 14px;
	letter-spacing: 0;
	min-width: 250px;
	padding: 6px;
	inset-inline-end: -8px;
	position: absolute;
	text-align: start;
	text-transform: none;
	top: calc(100% + 6px);
	z-index: 50;
}

.ps-bell__head {
	color: #6b6b6b;
	font-size: 11px;
	letter-spacing: .12em;
	padding: 8px 12px 6px;
	text-transform: uppercase;
}

.ps-notice .ps-bell__item {
	align-items: center;
	color: var(--ps-ink);
	display: flex;
	gap: 12px;
	justify-content: space-between;
	/* From the start of the line -- the left, or the right in a language read
	   that way -- not pushed across as the strip pushes its own links. */
	margin-inline: 0;
	padding: 9px 12px;
	text-align: start;
	text-decoration: none;
}

.ps-notice .ps-bell__item:hover {
	background: #f3f2f2;
}

.ps-notice .ps-bell__item b {
	background: #ecebea;
	border-radius: 999px;
	font-size: 12px;
	min-width: 22px;
	padding: 2px 7px;
	text-align: center;
}

.ps-notice .ps-bell__item.is-hot b {
	background: #e85d1f;
	color: #fff;
}

/* Come in since the bell was last opened: said in bold, with a dot before it. */
.ps-notice .ps-bell__item.is-new span {
	font-weight: 700;
}

.ps-notice .ps-bell__item.is-new span::before {
	background: #e85d1f;
	border-radius: 50%;
	content: "";
	display: inline-block;
	height: 7px;
	margin-inline-end: 7px;
	vertical-align: middle;
	width: 7px;
}

.ps-bell__none {
	color: #6b6b6b;
	margin: 0;
	padding: 6px 12px 10px;
}

/* Which site the Store is on, in the strip along the top between the bell and
   the account menu: small, light on the dark, the name alone. */
.ps-notice .aws-portal__switch.is-in-strip { align-items: center; display: flex; margin: 0 4px 0 14px; padding: 0; width: 240px; }
.ps-notice .aws-portal__switch.is-in-strip .aws-pick { flex: 1 1 auto; min-width: 0; }
.ps-notice .aws-portal__switch.is-in-strip .aws-careers__input { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .3); color: #fff; font-size: 12px; height: 26px; min-height: 26px; padding: 0 8px; }
.ps-notice .aws-portal__switch.is-in-strip .aws-careers__input::placeholder { color: rgba(255, 255, 255, .6); }
/* Its list opens over the page, not the strip: the page's own ink, wide enough for a name. */
.ps-notice .aws-portal__switch.is-in-strip .aws-pick__list { color: #1d2327; font-size: 14px; letter-spacing: 0; min-width: 300px; right: 0; text-transform: none; z-index: 40; }
@media (max-width: 560px) { .ps-notice .aws-portal__switch.is-in-strip { width: 150px; } }

/* The mail page: the site header and its row of places above the mail, as on
   every other page of the Store -- hiding them left the account menu as the
   only way out of the mail, and the one page with no tabs. Not stuck to the
   top here: the page is the window's height and the mail scrolls inside it. */
.aws-mail-page .ps-header {
	flex: 0 0 auto;
	position: static;
}

.aws-mail-page .ps-kit-content,
.aws-mail-page .ps-kit-content > section:first-child,
.aws-mail-page .aws-portal {
	margin-top: 0;
	padding-top: 0;
}

/* And the whole of it on one screen, footer included: the page is the window's
   height and does not scroll; the mail takes what the strip and the footer
   leave, and its list and its side scroll inside it, the pager staying put. */
body.aws-mail-page.ps-kit-page {
	display: flex;
	flex-direction: column;
	height: 100dvh;
	overflow: hidden;
}

body.aws-mail-page.ps-kit-page .ps-notice,
body.aws-mail-page.ps-kit-page .ps-footer {
	flex: none;
}

body.aws-mail-page.ps-kit-page .ps-kit-content,
body.aws-mail-page.ps-kit-page .aws-portal,
body.aws-mail-page.ps-kit-page .aws-portal > .aws-careers,
body.aws-mail-page.ps-kit-page .aws-mail {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-height: 0;
}

body.aws-mail-page.ps-kit-page .ps-kit-content {
	padding-bottom: 0;
}

body.aws-mail-page.ps-kit-page .aws-mail__body {
	flex: 1;
	min-height: 0;
}

body.aws-mail-page.ps-kit-page .aws-mail__side {
	overflow-y: auto;
}

body.aws-mail-page.ps-kit-page .aws-mail__main {
	min-height: 0;
}

body.aws-mail-page.ps-kit-page .aws-mail__rows {
	min-height: 0;
	overflow-y: auto;
}
:is(.ps-kit-page,.aws-ordering) .ps-codex-how{display:grid;gap:10px;grid-template-columns:1fr 1fr}:is(.ps-kit-page,.aws-ordering) .ps-codex-how label{align-items:start;border:1px solid #aaa;border-radius:8px;cursor:pointer;display:flex;gap:10px;padding:12px}:is(.ps-kit-page,.aws-ordering) .ps-codex-how label:has(input:checked){border:2px solid var(--ps-blue);padding:11px}:is(.ps-kit-page,.aws-ordering) .ps-codex-how span{display:grid;gap:4px}:is(.ps-kit-page,.aws-ordering) .ps-codex-how small{font-weight:400}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire{display:grid;gap:14px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__cat{border:1px solid var(--ps-rule);border-radius:8px;display:grid;margin:0;padding:4px 12px 8px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__cat legend{font-size:12px;font-weight:700;letter-spacing:.1em;padding:0 6px;text-transform:uppercase}:is(.ps-kit-page,.aws-ordering) .ps-codex-form .ps-codex-hire__row{align-items:center;border-top:1px solid var(--ps-rule);cursor:pointer;display:grid;font-weight:400;gap:12px;grid-template-columns:4.2em minmax(0,1fr) auto;padding:10px 0}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__row:first-of-type{border-top:0}:is(.ps-kit-page,.aws-ordering) .ps-codex-form .ps-codex-hire__row input[type=number]{padding:6px;text-align:center;width:4.2em}:is(.ps-kit-page,.aws-ordering) .ps-codex-form .ps-codex-hire__row input[type=checkbox]{height:18px;justify-self:center;margin:0;width:18px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__what,:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__price{display:grid;gap:2px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__what small,:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__price small{color:var(--ps-muted);font-size:12px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__price{font-weight:700;text-align:right;white-space:nowrap}:is(.ps-kit-page,.aws-ordering) .ps-codex-services:empty{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-services__today{font-weight:700;margin:0}@media(max-width:620px){:is(.ps-kit-page,.aws-ordering) .ps-codex-how{grid-template-columns:1fr}}
:is(.ps-kit-page,.aws-ordering) .ps-codex-form input.is-locked{background:#ececec;color:#3c434a;cursor:not-allowed}
:is(.ps-kit-page,.aws-ordering).aws-address[data-aws-use]{min-height:0;padding-bottom:0}:is(.ps-kit-page,.aws-ordering).aws-address[data-aws-use] .aws-address__ask{padding-top:24px}:is(.ps-kit-page,.aws-ordering).aws-address[data-aws-use] .aws-address__inner{min-height:0;padding-bottom:14px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs{border-bottom:2px solid var(--ps-ink);display:flex;flex-wrap:wrap;gap:4px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs button{background:transparent;border:2px solid var(--ps-ink);border-bottom:0;border-radius:8px 8px 0 0;cursor:pointer;display:flex;font:inherit;font-size:13px;font-weight:700;gap:4px;margin-bottom:-2px;padding:8px 14px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs button[aria-selected=true]{background:var(--ps-ink);color:#fff}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__cat[hidden]{display:none}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs+.ps-codex-hire__cat,:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs~.ps-codex-hire__cat{border-top:0;border-radius:0 0 8px 8px}
:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs~.ps-codex-hire__cat legend{clip:rect(0 0 0 0);height:1px;overflow:hidden;position:absolute;width:1px}:is(.ps-kit-page,.aws-ordering) .ps-codex-hire__tabs~.ps-codex-hire__cat{padding-top:8px}
:is(.ps-kit-page,.aws-ordering).aws-address[data-aws-use] .aws-address__note,:is(.ps-kit-page,.aws-ordering).aws-address[data-aws-use] .aws-address__said-why{display:none}
:is(.ps-kit-page,.aws-ordering) .ps-codex-how span{align-items:center;display:flex!important;flex-wrap:wrap;gap:6px}:is(.ps-kit-page,.aws-ordering) .ps-codex-how label{align-items:center}:is(.ps-kit-page,.aws-ordering) .ps-codex-info{background:transparent;border:1.5px solid currentColor;border-radius:50%;color:var(--ps-muted);cursor:help;font:700 11px/1 Georgia,serif;height:18px;padding:0;position:relative;width:18px}:is(.ps-kit-page,.aws-ordering) .ps-codex-info:hover,:is(.ps-kit-page,.aws-ordering) .ps-codex-info:focus-visible{color:var(--ps-ink)}:is(.ps-kit-page,.aws-ordering) .ps-codex-info:hover::after,:is(.ps-kit-page,.aws-ordering) .ps-codex-info:focus::after{background:var(--ps-ink);border-radius:8px;bottom:calc(100% + 8px);color:#fff;content:attr(data-tip);font:400 12px/1.45 Arial,Helvetica,sans-serif;left:50%;padding:9px 11px;position:absolute;text-align:left;transform:translateX(-50%);width:230px;z-index:6}
:is(.ps-kit-page,.aws-ordering) [data-account-step].is-busy [data-account-pane],:is(.ps-kit-page,.aws-ordering) [data-account-step].is-busy .ps-codex-account-tabs{cursor:progress;opacity:.55}

/* The Store's places: the header row with their menu sits close under the strip. */
.ps-header__inner:has(.aws-places-nav){min-height:64px;padding-block:4px 10px}
.ps-header__inner:has(.aws-places-nav) .aws-places-nav{padding-top:0}

/* The organization office's menu in the header (org-topnav.js): its lists open as the account menu's panel does. */
.aws-org-topnav__list{background:#fff;border:1px solid #d8d8d8;box-shadow:0 8px 24px rgba(0,0,0,.12);display:grid;left:0;min-width:190px;padding:6px;position:absolute;top:calc(100% + 12px);z-index:40}
.aws-org-topnav .aws-org-topnav__item{border:0;color:var(--ps-ink);font:400 15px/1.3 Arial,Helvetica,sans-serif;letter-spacing:0;padding:9px 12px;text-align:left;text-transform:none;white-space:nowrap}
.aws-org-topnav .aws-org-topnav__item:hover,.aws-org-topnav .aws-org-topnav__item.is-on{background:#f3f2f2}
.aws-org-topnav .aws-org-topnav__item.is-on{font-weight:700}
/* The pages drawn in the Store's frame (page-chrome.php) on the header's own width, so their edges are the header's. */
body.ps-kit-page .aws-chrome__main{box-sizing:border-box;max-width:1440px;padding-inline:clamp(18px,4.2vw,60px)}
/* And close under the header, as the Store's own pages start. */
body.ps-kit-page.aws-chrome .ps-kit-content{padding-top:0}

/*
 * The setup wizard (/store/setup/, setup.php), in the Store's own parts: the
 * steps are the tab bar Marketing's lists use, the screens its bordered lists,
 * the buttons its own. The screens were written for WordPress's dashboard, so
 * its markup -- .form-table, .button, .notice, .widefat, .description, their
 * cards -- is dressed here in the same parts' look: square, ink lines, the
 * accent red for what saves.
 */
.aws-setup__head{align-items:center;column-gap:16px;row-gap:12px}
.aws-setup__steps{flex-wrap:wrap}
.aws-setup__steps .aws-support__mode{align-items:center;display:inline-flex;gap:6px;text-decoration:none}
.aws-setup__n{align-items:center;border:1.5px solid currentColor;border-radius:50%;display:inline-flex;font-size:10px;height:17px;justify-content:center;width:17px}
.aws-setup__go{display:flex;gap:8px;margin-left:auto}
.aws-setup__about{color:#6b6868;font-size:14px;margin:6px 0 14px}
.aws-setup .aws-careers__board.is-full{gap:16px}
.aws-setup__screen{background:#fff;min-width:0;padding:20px 22px}
/* A long address in a table (the websites, with their domains) wraps rather than widen the page. */
.aws-setup__screen .widefat td,.aws-setup__screen .wp-list-table .column-primary{overflow-wrap:anywhere}
.aws-setup__screen h1,.aws-setup__screen .wp-heading-inline{font:700 12px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.14em;margin:0 0 12px;text-transform:uppercase;color:#8a3a1a}
.aws-setup__screen h2{font-size:16px;font-weight:700;margin:16px 0 8px}
.aws-setup__screen h2:first-child{margin-top:0}
.aws-setup__screen p{font-size:14px;line-height:1.55;margin:0 0 12px}
.aws-setup__screen .description{color:#6b6868;font-size:13px}
.aws-setup__screen a:not([class*=button]):not([class*=aws-careers__btn]){color:#c42d17}
.aws-setup__screen .form-table{border-collapse:collapse;margin:8px 0 14px;width:100%}
.aws-setup__screen .form-table th{font-size:14px;font-weight:700;padding:12px 16px 12px 0;text-align:left;vertical-align:top;width:200px}
.aws-setup__screen .form-table td{font-size:14px;padding:10px 0}
.aws-setup__screen .form-table tr{border-top:1px solid #e3e1e1}
.aws-setup__screen input:not([type]),.aws-setup__screen input[type=text],.aws-setup__screen input[type=email],.aws-setup__screen input[type=url],.aws-setup__screen input[type=number],.aws-setup__screen input[type=tel],.aws-setup__screen input[type=password],.aws-setup__screen input[type=search],.aws-setup__screen select,.aws-setup__screen textarea{background:#f0ece4;border:1px solid #c9c2b6;border-radius:0;box-sizing:border-box;font:inherit;font-size:14px;max-width:100%;min-height:36px;padding:6px 10px}
.aws-setup__screen .regular-text{width:28em}
.aws-setup__screen .large-text{width:100%}
.aws-setup__screen .button,.aws-setup__screen button:not([class*=aws-]),.aws-setup__screen input[type=submit]{align-items:center;background:#fff;border:2px solid #191919;border-radius:0;box-shadow:none;color:#191919;cursor:pointer;display:inline-flex;font:700 14px/1.2 Arial,Helvetica,sans-serif;gap:6px;min-height:36px;padding:7px 14px;text-decoration:none}
.aws-setup__screen .button:hover,.aws-setup__screen button:not([class*=aws-]):hover{background:#f3f2f2}
.aws-setup__screen .button-primary,.aws-setup__screen input[type=submit].button-primary{background:#ef3218;border-color:#ef3218;color:#fff}
.aws-setup__screen .button-primary:hover{background:#d42a13}
.aws-setup__screen .notice,.aws-setup__screen .updated,.aws-setup__screen .error{background:#fff;border:2px solid #191919;border-left-width:6px;margin:0 0 14px;padding:10px 14px}
.aws-setup__screen .notice-success,.aws-setup__screen .updated{border-left-color:#2e8b57}
.aws-setup__screen .notice-error,.aws-setup__screen .error{border-left-color:#c42d17}
.aws-setup__screen .notice p{margin:0}
.aws-setup__screen .widefat{border:2px solid #191919;border-collapse:collapse;width:100%}
.aws-setup__screen .widefat th,.aws-setup__screen .widefat td{border-bottom:1px solid #e3e1e1;font-size:14px;padding:9px 12px;text-align:left}
.aws-setup__screen .widefat thead th{font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.aws-setup__screen details{border-top:1px solid #e3e1e1}
.aws-setup__screen details > summary{cursor:pointer;font-weight:700;padding:12px 0}
.aws-setup__screen .submit{margin:14px 0 0;padding:0}
.aws-setup__screen .aws-setup__save{margin:12px 0 4px}
/* The theme settings' own cards (their rounded, blue dashboard look) squared to the Store's. */
.aws-setup__screen [class*=card]{border-radius:0!important;box-shadow:none!important}
.aws-setup__screen [class*=card] [class*=icon]{background:#f3f2f2!important;border-radius:0!important;color:#191919!important}
.aws-setup__screen [class*=card] [class*=toggle],.aws-setup__screen [class*=card] [class*=chevron]{background:transparent!important;border-radius:0!important;color:#191919!important}
/* The tenant's Appearance (its themes) in the same parts: square, ink for what is chosen. */
.aws-setup__screen .aws-core-appearance-card{border:0!important;padding:0!important}
.aws-setup__screen .aws-core-theme-card{border:2px solid #e3e1e1!important}
.aws-setup__screen .aws-core-theme-card.is-active{border-color:#191919!important;box-shadow:none!important}
.aws-setup__screen .aws-core-managed-label{background:#191919!important;border-radius:0!important;color:#fff!important}
.aws-setup__screen .aws-core-theme-empty{border-radius:0}
.aws-setup__screen .aws-core-theme-toolbar input[type=search]{border-radius:0}
/*
 * Forms in the areas: every label over its field, and help in an info icon
 * beside the label or heading it explains (areas.php moves it there).
 */
.aws-setup__screen .form-table,.aws-setup__screen .form-table tbody,.aws-setup__screen .form-table tr,.aws-setup__screen .form-table th,.aws-setup__screen .form-table td{display:block;width:auto}
.aws-setup__screen .form-table tr{padding:12px 0}
.aws-setup__screen .form-table th{padding:0 0 6px;width:auto}
.aws-setup__screen .form-table td{padding:0}
.aws-info,.aws-setup__screen .aws-cc-info{align-items:center;cursor:help;display:inline-flex;margin-left:6px;position:relative;vertical-align:middle}
.aws-info__i{align-items:center;border:1.5px solid currentColor;border-radius:50%;color:#6b6868;display:inline-flex;font:700 10px/1 Georgia,serif;font-style:italic;height:15px;justify-content:center;text-transform:none;width:15px}
.aws-info:hover .aws-info__i,.aws-info:focus .aws-info__i,.aws-info.is-open .aws-info__i{background:#191919;border-color:#191919;color:#fff}
.aws-info__tip{background:#191919;bottom:calc(100% + 8px);box-shadow:0 6px 18px rgba(0,0,0,.18);color:#fff;display:none;font:400 13px/1.5 Arial,Helvetica,sans-serif;left:-8px;letter-spacing:0;max-width:min(340px,calc(100vw - 24px));padding:9px 12px;position:absolute;text-align:left;text-transform:none;transform:translateX(var(--aws-info-shift,0));white-space:normal;width:max-content;z-index:200}
.aws-info:hover .aws-info__tip,.aws-info:focus .aws-info__tip,.aws-info:focus-within .aws-info__tip,.aws-info.is-open .aws-info__tip{display:block}
.aws-info__said{display:block}
.aws-info__said + .aws-info__said{margin-top:6px}
.aws-info__tip a{color:#fff!important;text-decoration:underline}
.aws-info__tip code{background:rgba(255,255,255,.12);color:#fff}
.aws-setup__screen .aws-cc-info .aws-cc-info__tip{transform:translateX(var(--aws-info-shift,0))}
/* The call center's own icons, and a screen's popover info buttons, in the same mark as the rest. */
.aws-setup__screen .aws-cc-info > .dashicons,.aws-setup__screen .aws-core-note__toggle > .dashicons{display:none}
.aws-setup__screen .aws-core-note__toggle{background:none!important;border:0!important;cursor:help;margin-left:6px;min-height:0!important;padding:0!important;vertical-align:middle}
.aws-setup__screen .aws-core-note__toggle::before,.aws-setup__screen .aws-cc-info::before{align-items:center;border:1.5px solid #6b6868;border-radius:50%;box-sizing:border-box;color:#6b6868;content:'i';display:inline-flex;font:italic 700 10px/1 Georgia,serif;height:15px;justify-content:center;width:15px}
.aws-setup__screen .aws-cc-info:hover::before,.aws-setup__screen .aws-cc-info:focus::before{background:#191919;border-color:#191919;color:#fff}
.aws-setup__screen .aws-cc-info__tip{font:400 13px/1.5 Arial,Helvetica,sans-serif;letter-spacing:0;text-transform:none}
.aws-setup__screen .aws-cc-info__tip .aws-info__said + .aws-info__said,.aws-setup__screen .aws-cc-info__tip .aws-info__said{display:block;margin-top:6px}
.aws-setup__head > .aws-info{align-self:center;margin-left:-6px;margin-right:auto}

/* The screens' own controls in the same parts: switches in ink, a row's Save the accent, lists of choices without bullets. */
.aws-setup__screen .aws-core-switch input:checked + .aws-core-switch__track{background:#191919}
.aws-setup__screen .aws-core-switch input:focus-visible + .aws-core-switch__track{outline-color:#191919}
.aws-setup__screen .aws-core-platform__subdomains input[type=checkbox]:checked{background:#191919!important}
.aws-setup__screen .aws-core-storefronts__row--parent td:first-child{box-shadow:inset 3px 0 0 #ef3218!important}
.aws-setup__screen .aws-core-storefronts__config [data-config-save]{background:#ef3218!important;border-color:#ef3218!important;border-radius:0!important}
.aws-setup__screen .aws-core-storefronts__gear:hover,.aws-setup__screen .aws-core-storefronts__gear:focus-visible,.aws-setup__screen tr[data-dirty] .aws-core-storefronts__gear{border-color:#191919!important;color:#191919!important}
.aws-setup__screen .aws-core-storefronts__save{background:#ef3218!important;border:0!important;border-radius:0!important;color:#fff!important;font-weight:700}
.aws-setup__screen .aws-core-storefronts__save[disabled]{background:#e3e1e1!important;color:#8a8585!important}
.aws-setup__screen ul:has(> li > label > input),.aws-setup__screen .aws-core-features__list{list-style:none;margin-left:0;padding-left:0}
.aws-setup__screen .aws-core-features__item{border-radius:0!important}
.aws-setup__screen .aws-core-features__item label{align-items:flex-start;display:flex;gap:10px}
.aws-setup__screen .aws-core-features__item small{color:#6b6868;display:block;margin-top:2px}

/*
 * The manage area (/store/manage/, manage.php): WordPress's list table and a
 * record's editor boxes, in the same parts. The dashboard's furniture that
 * only its own scripts work (a box's arrows, a row's phone toggle) is put away.
 */
.aws-setup__screen .screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.aws-setup__screen .hidden,.aws-setup__screen .hide-if-js,.aws-setup__screen .toggle-row,.aws-setup__screen .postbox .handle-actions,.aws-setup__screen .sorting-indicators,.aws-setup__screen .tablenav br.clear{display:none!important}
.aws-manage__bar{align-items:center;display:flex;flex-wrap:wrap;gap:10px 14px;margin:0 0 14px}
.aws-manage__title{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}
.aws-setup__screen .aws-manage__name{font-size:20px;margin:0;flex:1 1 auto}
.aws-setup__screen a.aws-manage__back{color:#191919!important;flex-basis:100%;font-size:13px;font-weight:700;text-decoration:none}
.aws-setup__screen a.page-title-action{align-items:center;background:#fff;border:2px solid #191919;color:#191919!important;display:inline-flex;font:700 14px/1.2 Arial,Helvetica,sans-serif;min-height:36px;padding:7px 14px;text-decoration:none}
.aws-setup__screen a.page-title-action:hover{background:#f3f2f2}
.aws-setup__screen .subsubsub{display:flex;flex-wrap:wrap;font-size:13px;gap:4px 12px;list-style:none;margin:0 0 12px;padding:0}
.aws-setup__screen .subsubsub li{color:#c9c2b6;margin:0}
.aws-setup__screen .subsubsub a{color:#6b6868!important;text-decoration:none}
.aws-setup__screen .subsubsub a.current{color:#191919!important;font-weight:700}
.aws-setup__screen .subsubsub .count{color:#8a8585;font-weight:400}
.aws-setup__screen .search-box{display:flex;gap:6px;justify-content:flex-end;margin:0 0 10px}
.aws-setup__screen .tablenav{align-items:center;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.aws-setup__screen .tablenav.bottom{margin:10px 0 0}
.aws-setup__screen .tablenav .actions,.aws-setup__screen .tablenav .alignleft{align-items:center;display:flex;float:none;gap:6px}
.aws-setup__screen .tablenav-pages{align-items:center;color:#6b6868;display:flex;font-size:13px;gap:8px;margin-left:auto}
.aws-setup__screen .tablenav-pages.one-page .pagination-links{display:none}
.aws-setup__screen .pagination-links{align-items:center;display:inline-flex;gap:4px}
.aws-setup__screen .pagination-links .button,.aws-setup__screen .pagination-links .tablenav-pages-navspan{justify-content:center;min-height:30px;min-width:30px;padding:3px 8px}
.aws-setup__screen .pagination-links .tablenav-pages-navspan{border:2px solid #e3e1e1;color:#c9c2b6;display:inline-flex}
.aws-setup__screen .paging-input .current-page{min-height:30px;text-align:center;width:3em}
.aws-setup__screen .tablenav select,.aws-setup__screen .tablenav .button{min-height:32px;padding-block:4px}
.aws-setup__screen .wp-list-table{table-layout:auto}
.aws-setup__screen .wp-list-table th,.aws-setup__screen .wp-list-table td{vertical-align:top}
.aws-setup__screen .wp-list-table tfoot{display:none}
.aws-setup__screen .wp-list-table thead th a{color:#191919!important;text-decoration:none}
.aws-setup__screen .wp-list-table .check-column{padding-right:0;width:28px}
.aws-setup__screen .wp-list-table tbody tr:hover{background:#faf9f7}
.aws-setup__screen .wp-list-table a.row-title,.aws-setup__screen .wp-list-table .column-primary strong a{color:#191919!important;font-weight:700;text-decoration:none}
.aws-setup__screen .wp-list-table a.row-title:hover{text-decoration:underline}
.aws-setup__screen .wp-list-table .column-title strong{display:block}
.aws-setup__screen .wp-list-table .column-username img{float:left;margin:0 10px 0 0}
.aws-setup__screen .button-link{background:none!important;border:0!important;color:#191919;cursor:pointer;min-height:0!important;padding:0!important}
.aws-setup__screen .aws-people__mail{color:#6b6868;font-size:14px;font-weight:400;margin-left:6px}
.aws-setup__screen .aws-people__part h2:first-child{margin-top:0}
.aws-setup__screen .row-actions{color:#c9c2b6;font-size:12px;margin-top:4px}
.aws-setup__screen .row-actions a{color:#6b6868!important;text-decoration:none}
.aws-setup__screen .row-actions a:hover{color:#191919!important;text-decoration:underline}
.aws-setup__screen .row-actions .trash a,.aws-setup__screen .row-actions .delete a{color:#c42d17!important}
.aws-setup__screen .post-state{color:#6b6868;font-weight:400}
.aws-setup__screen .wp-list-table .no-items td{color:#6b6868;padding:18px 12px}
.aws-manage__cols{align-items:start;display:grid;gap:18px;grid-template-columns:minmax(0,1fr) 300px}
.aws-manage__main,.aws-manage__side{display:grid;gap:16px;min-width:0}
.aws-setup__screen .postbox{background:#fff;border:2px solid #191919;margin:0;min-width:0}
.aws-setup__screen .postbox-header{align-items:center;border-bottom:1px solid #e3e1e1;display:flex;padding:10px 16px}
.aws-setup__screen .postbox-header h2,.aws-setup__screen .postbox .hndle{color:#8a3a1a;font:700 12px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.14em;margin:0;text-transform:uppercase}
.aws-setup__screen .postbox .inside{padding:14px 16px}
.aws-setup__screen .postbox .inside > :last-child{margin-bottom:0}
.aws-setup__screen .postbox .aws-setup__save{border-top:1px solid #e3e1e1;margin:14px 0 0;padding-top:12px}
.aws-manage__field{margin:0 0 14px}
.aws-manage__field > label,.aws-setup__screen .aws-record-field > label{display:block;font-size:13px;font-weight:700;margin:0 0 6px}
.aws-setup__screen .aws-manage__field #title{font-size:18px;min-height:44px;width:100%}
.aws-setup__screen .aws-record-field{margin:0 0 16px}
.aws-setup__screen .aws-record-field .description{margin:6px 0 0;max-width:70ch}
.aws-setup__screen .aws-record-field input[type=text]{max-width:30rem;width:100%}
.aws-setup__screen .aws-record-rows input{width:100%}
.aws-setup__screen .aws-record-rows input[type=checkbox]{width:auto}
.aws-setup__screen .aws-record-rows th{text-align:center}
.aws-setup__screen .postbox textarea{width:100%}
.aws-setup__screen .categorychecklist,.aws-setup__screen .tagchecklist{list-style:none;margin:0;padding:0}
.aws-setup__screen .categorychecklist .children{list-style:none;margin:4px 0 0 18px;padding:0}
.aws-setup__screen .category-tabs,.aws-setup__screen .wp-hidden-children,.aws-setup__screen .taxonomy-add-new{display:none}
.aws-setup__screen .tabs-panel{max-height:220px;overflow:auto}
.aws-setup__screen .wp-editor-wrap{border:1px solid #c9c2b6}
.aws-setup__screen .wp-editor-tools{align-items:flex-end;background:#faf9f7;display:flex;justify-content:space-between;padding:6px 8px 0}
.aws-setup__screen .wp-editor-tabs{display:flex;gap:2px}
.aws-setup__screen .wp-editor-tabs button,.aws-setup__screen .wp-editor-tabs .wp-switch-editor{background:transparent;border:0;border-bottom:2px solid transparent;font:700 12px/1 Arial,Helvetica,sans-serif;min-height:0;padding:8px 10px}
.aws-setup__screen .tmce-active .switch-tmce,.aws-setup__screen .html-active .switch-html{border-bottom-color:#191919}
.aws-setup__screen .wp-media-buttons .button{min-height:30px;padding:4px 10px}
.aws-setup__screen .mce-container button,.aws-setup__screen .quicktags-toolbar input{background:transparent!important;border:0!important;font-weight:400!important;min-height:0!important;padding:4px 6px!important}
.aws-setup__screen .wp-editor-container textarea.wp-editor-area{background:#fff;border:0;font-family:Consolas,Monaco,monospace;min-height:260px;width:100%}
.aws-setup__screen .aws-manage__submit{margin:16px 0 0}
.aws-manage__bin{border-top:1px solid #e3e1e1;margin:20px 0 0;padding-top:4px}
.aws-manage__bin > summary{color:#c42d17}
.aws-manage__bin .button{border-color:#c42d17;color:#c42d17}
#postimagediv img{height:auto;max-width:100%}
/* A tip not shown takes no room: hidden, it still widened a phone's page. */
.aws-setup__screen .aws-cc-info:not(:hover):not(:focus) .aws-cc-info__tip{display:none}
/*
 * On a phone: a list of records is a stack of cards, each value under its
 * column's name (WordPress gives every cell it, data-colname); any other wide
 * table scrolls in its own width rather than the page's.
 */
@media(max-width:782px){
.aws-setup__screen{padding:16px 14px}
.aws-setup__screen .wp-list-table thead,.aws-setup__screen .wp-list-table tfoot{display:none}
.aws-setup__screen .wp-list-table,.aws-setup__screen .wp-list-table tbody,.aws-setup__screen .wp-list-table tr,.aws-setup__screen .wp-list-table th,.aws-setup__screen .wp-list-table td{display:block;width:auto!important}
.aws-setup__screen .wp-list-table tbody tr{border-bottom:1px solid #e3e1e1;padding:10px 12px;position:relative}
.aws-setup__screen .wp-list-table tbody th,.aws-setup__screen .wp-list-table tbody td{border:0;padding:3px 0}
.aws-setup__screen .wp-list-table tbody .check-column{left:12px;padding:0;position:absolute;top:12px;width:auto}
.aws-setup__screen .wp-list-table tbody tr:has(.check-column) > :not(.check-column){padding-left:30px}
.aws-setup__screen .wp-list-table tbody td:not(.column-primary)[data-colname]::before{color:#8a3a1a;content:attr(data-colname);display:block;font:700 10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.aws-setup__screen .wp-list-table .no-items td{padding:6px 0}
.aws-setup__screen table.widefat:not(.wp-list-table),.aws-setup__screen table[class*=__table]{display:block;max-width:100%;overflow-x:auto;position:relative}
.aws-setup__screen .tablenav .actions,.aws-setup__screen .tablenav .alignleft{flex-wrap:wrap}
.aws-setup__screen .search-box{flex-wrap:wrap}
.aws-setup__screen .search-box input[type=search]{flex:1 1 140px}
.aws-setup__screen .search-box [type=submit]{flex:0 0 auto}
.aws-setup__screen .regular-text{width:100%}
.aws-setup__screen .form-table,.aws-setup__screen .form-table tbody,.aws-setup__screen .form-table tr{display:block;width:100%}
.aws-setup__screen .form-table td input:not([type=checkbox]):not([type=radio]),.aws-setup__screen .form-table td select,.aws-setup__screen .form-table td textarea{max-width:100%}
}
@media(max-width:900px){.aws-manage__cols{grid-template-columns:minmax(0,1fr)}.aws-setup__screen .tablenav-pages{margin-left:0}.aws-setup__screen .search-box{justify-content:flex-start}}
@media(max-width:900px){.aws-setup__go{margin-left:0;width:100%}.aws-setup__screen .form-table th{display:block;padding-bottom:0;width:auto}.aws-setup__screen .form-table td{display:block}}