.access-page{
color:#1B1030;
overflow-wrap:break-word;
}
.access-page [hidden]{
display:none!important;
}
.access-page .access-hero{
display:block;
background:#FBFAFD;
color:#1B1030;
padding-block:var(--hero-pad);
padding-inline:0;
}
.access-page .access-hero h1{
max-width:100%;
color:#1B1030;
font-size:clamp(2rem,3.5vw,3.2rem);
line-height:1.3;
}
.access-page .access-hero .c-kicker{
color:#2A1F5C;
margin-bottom:var(--space-4);
}
.access-intro{
max-width:56rem;
margin-top:var(--space-4);
color:#5B5470;
font-size:var(--text-md);
line-height:var(--lh-body);
}
.access-page .access-hero .c-actions{
margin-block:var(--space-4);
}
.access-hero-note{
max-width:56rem;
color:#5B5470;
font-size:var(--text-sm);
}
.access-section-lead{
max-width:56rem;
margin-top:var(--space-3);
}
.access-page .c-section-head .c-kicker{
margin-bottom:var(--space-4);
}
.access-page .c-section-head h2{
max-width:100%;
}
.access-page .c-card-grid{
align-items:stretch;
}
.access-page .access-method,
.access-page .access-security{
display:flex;
flex-direction:column;
gap:var(--space-3);
height:100%;
min-width:0;
padding:var(--space-5);
}
.access-page .access-method h3,
.access-page .access-security h3,
.access-page .access-explain h3,
.access-page .access-row h3,
.access-page .access-ticket h3{
font-size:var(--text-card);
line-height:var(--lh-title);
}
.access-list{
padding-inline-start:var(--space-4);
}
.access-list li{
margin-bottom:var(--space-2);
}
.access-list li:last-child{
margin-bottom:0;
}
.access-page .access-method .access-method-action,
.access-page .access-security .access-security-result{
margin-top:auto;
}
.access-after-grid{
margin-top:var(--space-4);
}
.access-page .access-terminal{
height:auto;
}
.access-page .access-terminal .c-terminal-bar{
flex-wrap:wrap;
min-width:0;
}
.access-terminal .c-terminal-bar>span:last-child{
min-width:0;
overflow-wrap:break-word;
}
.access-terminal pre{
position:relative;
max-width:100%;
overflow-x:auto;
}
.access-terminal-foot{
display:grid;
gap:var(--space-2);
padding:var(--space-4);
background:#251840;
color:#CFC7E2;
}
.access-terminal-foot p{
color:#CFC7E2;
font-size:var(--text-sm);
}
.access-terminal-foot strong{
color:#FFFFFF;
}
.access-explain-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
align-items:start;
gap:var(--space-5);
margin-top:var(--space-5);
}
.access-explain{
display:flex;
flex-direction:column;
gap:var(--space-2);
min-width:0;
}
.access-explain pre{
position:relative;
margin-top:var(--space-3);
max-width:100%;
overflow-x:auto;
}
.access-latency{
min-width:0;
}
.access-measure-note{
margin-bottom:var(--space-4);
}
.access-latency .table-scroll{
position:relative;
overflow-x:auto;
}
.access-latency-table{
display:table;
width:100%;
min-width:680px;
font-variant-numeric:tabular-nums;
}
.access-latency-table caption{
padding:var(--space-4);
background:#FFFFFF;
color:#1B1030;
text-align:start;
font-size:var(--text-sm);
font-weight:600;
}
.access-latency-table tbody th{
background:#FFFFFF;
color:#1B1030;
font-weight:600;
}
.access-latency-table td{
font-family:var(--fm);
font-variant-numeric:tabular-nums;
}
.access-latency figcaption{
margin-top:var(--space-3);
color:#5B5470;
}
.access-rows{
display:grid;
gap:var(--space-4);
list-style:none;
margin:0;
padding:0;
}
.access-rows>.access-row{
display:grid;
grid-template-columns:2.5rem minmax(7.5rem,11rem) minmax(0,1fr);
gap:var(--space-3);
align-items:start;
padding:var(--space-4);
border-radius:var(--radius-card);
background:#FFFFFF;
color:#1B1030;
min-width:0;
}
.access-row>*{
min-width:0;
}
.access-row p{
color:#5B5470;
}
.access-number{
display:inline-flex;
align-items:center;
justify-content:center;
width:2.5rem;
height:2.5rem;
border-radius:var(--radius-chip);
background:#EEECFB;
color:#2A1F5C;
font-size:var(--text-sm);
line-height:1;
}
.access-page .access-security{
padding:var(--space-4);
}
.access-security-result{
font-size:var(--text-sm);
}
.access-ticket{
display:flex;
flex-direction:column;
gap:var(--space-3);
min-width:0;
margin-top:var(--space-5);
padding:var(--space-5);
border-radius:var(--radius-card);
background:#FFFFFF;
color:#1B1030;
}
.access-ticket p{
color:#5B5470;
}
.access-ticket .c-actions{
margin-top:var(--space-3);
}
.access-email{
color:#5E0F57;
text-decoration:underline;
text-underline-offset:3px;
overflow-wrap:anywhere;
}
.access-page>section:last-child{
padding-bottom:var(--space-close);
}
.access-page .c-close{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(16rem,.65fr);
align-items:center;
gap:var(--space-6);
padding:var(--space-7);
border-radius:var(--radius-band);
background:#1B1030;
color:#FFFFFF;
}
.access-page .c-close>*{min-width:0}
.access-page .c-close .c-kicker{color:#FFFFFF}
.access-page .c-close h2{
font-size:var(--text-section);
line-height:1.18;
letter-spacing:-.8px;
font-weight:500;
color:#FFFFFF;
}
.access-page .c-close p{
margin-top:var(--space-3);
font-size:var(--text-base);
line-height:var(--lh-body);
color:#CFC7E2;
}
.access-page .c-close .c-actions{
display:flex;
flex-direction:column;
align-items:stretch;
flex-wrap:nowrap;
gap:var(--space-3);
margin-top:0;
}
.access-page .c-close .c-actions>.c-btn{
width:100%;
text-align:center;
}
.access-page .c-close .c-btn-primary{
background:#FFFFFF;
color:#5E0F57;
border-color:#FFFFFF;
}
.access-page .c-close .c-btn-primary:hover{
background:#EEECFB;
color:#470B42;
border-color:#EEECFB;
}
.access-page .c-close .c-btn-ghost{
background:transparent;
color:#FFFFFF;
border-color:color-mix(in srgb,#FFFFFF 45%,transparent);
}
.access-page .c-close .c-btn-ghost:hover{
background:#251840;
color:#FFFFFF;
border-color:color-mix(in srgb,#FFFFFF 65%,transparent);
}
@media(max-width:64rem){
.access-page .c-close{padding:var(--space-5);gap:var(--space-5)}
}
@media(max-width:42rem){
.access-page .access-hero h1{
font-size:var(--text-section);
}
.access-page .access-hero h1 br{
display:none;
}
.access-intro{
font-size:var(--text-base);
}
.access-explain-grid{
grid-template-columns:minmax(0,1fr);
gap:var(--space-4);
}
.access-page .access-method,
.access-page .access-security,
.access-ticket{
padding:var(--space-4);
}
.access-rows>.access-row{
grid-template-columns:2.25rem minmax(0,1fr);
}
.access-row>:nth-child(3){
grid-column:2;
}
.access-number{
width:2.25rem;
height:2.25rem;
}
.access-page .access-hero .c-actions>.c-btn,
.access-ticket .c-actions>.c-btn{
width:100%;
}
.access-page .c-close{
grid-template-columns:minmax(0,1fr);
padding:var(--space-4);
gap:var(--space-4);
}
.access-page .c-close .c-actions{margin-top:var(--space-3)}
}