:root {
--sk-navy:     #1B2340;
--sk-navy-2:   #2A3458;
--sk-coral:    oklch(0.72 0.16 30);
--sk-coral-l:  oklch(0.88 0.10 30);
--sk-mint:     oklch(0.82 0.12 165);
--sk-mint-d:   oklch(0.52 0.12 165);
--sk-sun:      oklch(0.88 0.14 85);
--sk-sun-d:    oklch(0.65 0.14 85);
--sk-violet-l: oklch(0.88 0.08 300);
--sk-violet:   oklch(0.60 0.14 300);
--sk-cream:    #FBF8F1;
--sk-cream-2:  #F3EDE0;
--sk-ink:      #1B2340;
--sk-mute:     #7A7F94;
--sk-line:     #E2DFD6;
--sk-font-body: "Plus Jakarta Sans", "Noto Sans JP", system-ui, sans-serif;
--sk-font-head: "Quicksand", "Noto Sans JP", sans-serif;
--sk-radius-card: 16px;
--sk-radius-pill: 99px;
--sk-shadow: 0 2px 8px rgba(27,35,64,0.06);
}
body {
font-family: var(--sk-font-body);
} .sk-badges {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin: 12px 0;
}
.sk-pill {
display: inline-flex;
align-items: center;
padding: 4px 10px;
border-radius: var(--sk-radius-pill);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.03em;
background: var(--sk-cream-2);
color: var(--sk-ink);
line-height: 1.4;
}
.sk-pill--age {
background: var(--sk-navy);
color: #fff;
}
.sk-pill--diff {
background: var(--sk-coral-l);
color: var(--sk-ink);
}
.sk-pill--time {
background: var(--sk-cream-2);
color: var(--sk-mute);
} .sk-summary {
background: var(--sk-cream);
border-radius: 12px;
padding: 16px 20px;
border-left: 4px solid var(--sk-mint-d);
margin: 24px 0;
}
.sk-summary__label {
font-size: 11px;
font-weight: 700;
color: var(--sk-mint-d);
letter-spacing: 0.1em;
text-transform: uppercase;
margin-bottom: 8px;
}
.sk-summary__list {
margin: 0;
padding-left: 20px;
font-size: 14px;
line-height: 1.9;
}
.sk-summary__list li {
margin-bottom: 4px;
}