.dgx-page{
font-variant-numeric:tabular-nums;
}
.dgx-page [hidden]{
display:none!important;
}
.dgx-page :is(section,article,figure,dl,li,div){
min-width:0;
}
.dgx-page :is(p,dd,dt,li){
overflow-wrap:break-word;
}
.dgx-page .dgx-hero{
background:#E4EFFB;
color:#1E3550;
--surface-bg:#E4EFFB;
--surface-heading:#1E3550;
--surface-body:#1E3550;
--surface-muted:#1E3550;
--surface-line:#C9D9EC;
}
.dgx-hero-grid{
display:grid;
grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
align-items:start;
gap:var(--space-7);
}
.dgx-page .dgx-hero-copy{
min-width:0;
text-align:left;
}
.dgx-page .dgx-hero h1{
color:#1E3550;
font-size:var(--text-section);
line-height:1.2;
}
.dgx-page .dgx-hero .dgx-lead{
margin-top:var(--space-3);
color:#1E3550;
}
.dgx-page .dgx-hero-note{
margin-top:var(--space-3);
color:#1E3550;
font-size:var(--text-sm);
}
.dgx-memory-sheet{
width:100%;
height:auto;
padding:var(--space-4);
border-radius:var(--r-l);
background:#FFFFFF;
color:#1E3550;
--surface-bg:#FFFFFF;
--surface-heading:#1E3550;
--surface-body:#1E3550;
--surface-muted:#4A4640;
--surface-line:#E6E1D8;
box-shadow:var(--shadow-window);
text-align:left;
}
.dgx-sheet-head{
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:var(--space-2);
}
.dgx-sheet-label{
font-size:var(--text-sm);
font-weight:700;
}
.dgx-ring{
position:relative;
width:min(100%,20rem);
margin:var(--space-3) auto;
}
.dgx-ring>svg{
display:block;
width:100%;
height:auto;
}
.dgx-ring-copy{
position:absolute;
inset:0;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:var(--space-1);
padding:var(--space-5);
text-align:center;
}
.dgx-ring-copy strong{
font-family:var(--fh);
font-size:var(--text-section);
line-height:1.2;
font-weight:900;
color:#1E3550;
}
.dgx-ring-copy span{
font-size:var(--text-sm);
line-height:var(--lh-small);
}
.dgx-ring-copy small{
color:#4A4640;
}
.dgx-memory-sheet figcaption{
color:#4A4640;
}
.dgx-sheet-foot{
display:flex;
flex-wrap:wrap;
justify-content:space-between;
gap:var(--space-2);
margin-top:var(--space-3);
padding-top:var(--space-2);
border-top:1px solid var(--line);
font-size:var(--text-xs);
}
.dgx-white{
background:#FFFFFF;
color:#4A4640;
--surface-bg:#FFFFFF;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.dgx-sage{
background:#E6F2EA;
color:#1F4030;
--surface-bg:#E6F2EA;
--surface-heading:#1F4030;
--surface-body:#1F4030;
--surface-muted:#1F4030;
--surface-line:#C7DCD0;
}
.dgx-cream{
background:#FFF1D6;
color:#5A3A00;
--surface-bg:#FFF1D6;
--surface-heading:#5A3A00;
--surface-body:#5A3A00;
--surface-muted:#5A3A00;
--surface-line:#E4D3AF;
}
.dgx-lav{
background:#ECE8F7;
color:#34295C;
--surface-bg:#ECE8F7;
--surface-heading:#34295C;
--surface-body:#34295C;
--surface-muted:#34295C;
--surface-line:#DDD7EC;
}
.dgx-gray{
background:#F5F4F1;
color:#4A4640;
--surface-bg:#F5F4F1;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.dgx-page :is(.dgx-sage,.dgx-cream,.dgx-lav) .c-section-head :is(h2,p){
color:inherit;
}
.dgx-spec-shell{
border-radius:var(--r-l);
background:#F5F4F1;
color:#1C1B19;
--surface-bg:#F5F4F1;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
padding:var(--space-4);
}
.dgx-spec-heading{
display:grid;
gap:var(--space-1);
margin-bottom:var(--space-3);
}
.dgx-spec-heading p{
color:#4A4640;
}
.dgx-page .dgx-spec-list{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:0 var(--space-5);
margin:0;
}
.dgx-page .dgx-spec-list>div{
display:grid;
grid-template-columns:minmax(6rem,.35fr) minmax(0,1fr);
align-items:start;
gap:var(--space-2);
padding-block:var(--space-2);
border-top:1px solid var(--line);
}
.dgx-spec-list dt{
color:#625D55;
}
.dgx-spec-list dd{
color:#1C1B19;
font-weight:600;
}
.dgx-page .dgx-stack-track{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));
gap:var(--space-3);
align-items:start;
padding-block:var(--space-3);
border-block:1px dashed var(--sage-line);
}
.dgx-stack-item{
display:flex;
flex-direction:column;
align-items:center;
gap:var(--space-2);
text-align:center;
}
.dgx-page .dgx-stack-circle{
display:flex;
align-items:center;
justify-content:center;
width:6rem;
height:6rem;
padding:var(--space-1);
border-radius:var(--r-pill);
background:#FFFFFF;
color:#1F4030;
font:700 var(--text-sm)/var(--lh-small) var(--fh);
overflow-wrap:break-word;
text-align:center;
}
.dgx-stack-item p{
color:#1F4030;
font-size:var(--text-sm);
}
.dgx-section-note{
margin-top:var(--space-3);
font-size:var(--text-sm);
}
.dgx-model-grid,
.dgx-fit-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-3);
align-items:stretch;
}
.dgx-model-card{
display:flex;
flex-direction:column;
height:100%;
gap:var(--space-3);
padding:var(--space-4);
border-radius:var(--r-m);
background:#E4EFFB;
color:#1E3550;
--surface-bg:#E4EFFB;
--surface-heading:#1E3550;
--surface-body:#1E3550;
--surface-muted:#1E3550;
--surface-line:#C9D9EC;
}
.dgx-model-card h3{
color:#1E3550;
}
.dgx-model-number{
font-family:var(--fm);
font-size:var(--text-lg);
}
.dgx-model-number strong{
font-size:var(--text-section);
line-height:1.2;
}
.dgx-card-foot{
margin-top:auto;
padding-top:var(--space-2);
border-top:1px solid var(--blue-line);
font-size:var(--text-sm);
}
.dgx-price-header{
display:flex;
flex-wrap:wrap;
align-items:baseline;
gap:var(--space-2) var(--space-4);
margin-bottom:var(--space-3);
}
.dgx-price-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:var(--space-3);
align-items:stretch;
}
.dgx-price-card{
display:flex;
flex-direction:column;
gap:var(--space-2);
height:100%;
padding:var(--space-3);
border-radius:var(--r-m);
background:#FFFFFF;
color:#4A4640;
--surface-bg:#FFFFFF;
--surface-heading:#1C1B19;
--surface-body:#4A4640;
--surface-muted:#625D55;
--surface-line:#E6E1D8;
}
.dgx-price-card>.mono{
margin-top:auto;
font-size:var(--text-sm);
}
.dgx-price-value{
color:#1C1B19;
font:800 var(--text-section)/1.2 var(--fm);
}
.dgx-fit-card{
display:flex;
flex-direction:column;
gap:var(--space-3);
height:100%;
padding:var(--space-4);
border-radius:var(--r-m);
}
.dgx-fit-card--yes{
background:#E6F2EA;
color:#1F4030;
--surface-bg:#E6F2EA;
--surface-heading:#1F4030;
--surface-body:#1F4030;
--surface-muted:#1F4030;
--surface-line:#C7DCD0;
}
.dgx-fit-card--no{
background:#ECE8F7;
color:#34295C;
--surface-bg:#ECE8F7;
--surface-heading:#34295C;
--surface-body:#34295C;
--surface-muted:#34295C;
--surface-line:#DDD7EC;
}
.dgx-fit-card h3{
color:inherit;
}
.dgx-fit-card ul{
display:grid;
gap:var(--space-2);
}
.dgx-operations-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-5);
align-items:start;
}
.dgx-operations-copy{
display:grid;
gap:var(--space-1);
}
.dgx-operations-copy>.c-actions{
margin-top:var(--space-3);
}
.dgx-confirm-list{
display:grid;
gap:0;
list-style:none;
margin:0;
padding:0;
}
.dgx-confirm-row{
display:grid;
grid-template-columns:2.5rem minmax(7.5rem,11rem) minmax(0,1fr);
gap:var(--space-3);
align-items:start;
padding-block:var(--space-3);
border-top:1px solid var(--line);
}
.dgx-confirm-number{
display:inline-flex;
align-items:center;
justify-content:center;
width:2.5rem;
height:2.5rem;
border-radius:var(--r-pill);
background:#FFFFFF;
color:#1C1B19;
font-size:var(--text-sm);
}
.dgx-final{
padding-bottom:var(--space-close);
}
.dgx-page .dgx-final .c-closing>div{
text-align:left;
}
@media(max-width:64rem){
.dgx-hero-grid{
grid-template-columns:minmax(0,1fr);
gap:var(--space-6);
}
.dgx-memory-sheet{
max-width:none;
}
.dgx-ring{
width:min(100%,20rem);
}
.dgx-page .dgx-spec-list{
grid-template-columns:minmax(0,1fr);
}
.dgx-price-value{
font-size:var(--text-reading);
}
}
@media(max-width:42rem){
.dgx-page .dgx-hero h1{
font-size:2rem;
}
.dgx-memory-sheet,
.dgx-spec-shell,
.dgx-model-card,
.dgx-fit-card{
padding:var(--space-3);
}
.dgx-model-grid,
.dgx-fit-grid,
.dgx-operations-grid,
.dgx-price-grid{
grid-template-columns:minmax(0,1fr);
}
.dgx-page .dgx-spec-list>div{
grid-template-columns:minmax(0,1fr);
gap:var(--space-1);
}
.dgx-page .dgx-stack-track{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.dgx-confirm-row{
grid-template-columns:2.25rem minmax(0,1fr);
gap:var(--space-3);
}
.dgx-confirm-row>:nth-child(3){
grid-column:2;
}
.dgx-confirm-number{
width:2.25rem;
height:2.25rem;
}
.dgx-ring-copy{
padding:var(--space-4);
gap:var(--space-1);
}
.dgx-ring-copy strong{
font-size:var(--text-reading);
}
.dgx-ring-copy span{
font-size:var(--text-xs);
}
.dgx-hero-copy .c-actions>.c-btn{
width:100%;
}
}
