:root {
--yd-fmt-radius: 12px;
--yd-fmt-radius-sm: 8px;
--yd-fmt-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
--yd-fmt-text: #0f172a;
--yd-fmt-muted: #64748b;
--yd-fmt-gap: 1.25rem;
} .yoo-design_note,
.yoo-design_callout,
.yoo-design_attention,
.yoo-design_strip,
.yoo-design_aside,
.yoo-design_mark,
.yoo-design_bignum,
.yoo-design_quote,
.yoo-design_checklist,
.yoo-design_stoplist,
.yoo-design_bonuslist,
.yoo-design_badge,
.yoo-design_digit,
.yoo-design_new,
.yoo-design_text {
box-sizing: border-box;
max-width: 100%;
} .yoo-design_note {
position: relative;
display: block;
margin: var(--yd-fmt-gap) 0 calc(var(--yd-fmt-gap) * 1.25);
padding: 1.15rem 1.35rem;
font-style: normal;
font-weight: 400;
line-height: 1.65;
color: var(--yd-fmt-text);
border-radius: var(--yd-fmt-radius);
}
.yoo-design_note--mint { background: linear-gradient(125deg, #e7f6ef 0%, #f2faf6 48%, #e3f3eb 100%);
color: #0f172a;
}
.yoo-design_note--violet { background: #ebe6db;
color: #0f172a;
}
.yoo-design_note--coral { background: #dde1f0;
color: #0f172a;
}
.yoo-design_note--slate {
background: #f1f5f9;
color: #1e293b;
}
.yoo-design_note--peach { background: #edd9cc;
color: #0f172a;
}
.yoo-design_note--rose { background: #dde5d8;
color: #0f172a;
}
.yoo-design_note--card {
background: #fff;
padding: 1.75rem 1.85rem;
border-radius: 1.25rem;
box-shadow: var(--yd-fmt-shadow);
border: 1px solid rgba(15, 23, 42, 0.06);
}
.yoo-design_note--sky {
background: linear-gradient(105deg, #e0f2fe 0%, #dbeafe 100%);
color: #0c4a6e;
}
.yoo-design_note--outline {
background: #fff;
border: 1.5px solid transparent;
background-image:
linear-gradient(#fff, #fff),
linear-gradient(96deg, #a7f3d0 0%, #93c5fd 50%, #c4b5fd 100%);
background-origin: border-box;
background-clip: padding-box, border-box;
box-shadow: var(--yd-fmt-shadow);
}
@media screen and (min-width: 1024px) {
.yoo-design_note {
padding: 1.35rem 1.75rem;
font-size: 1.05em;
}
.yoo-design_note--card {
padding: 2.1rem 2.4rem;
font-size: 1.15em;
}
} .yoo-design_callout {
position: relative;
margin: var(--yd-fmt-gap) 0;
padding: 1rem 1.15rem 1rem 3rem;
border-radius: var(--yd-fmt-radius);
line-height: 1.55;
color: var(--yd-fmt-text);
border-left: 3px solid transparent;
}
.yoo-design_callout::before {
content: "";
position: absolute;
left: 0.95rem;
top: 1.05rem;
width: 1.15rem;
height: 1.15rem;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.yoo-design_callout--ok {
background: #eff9e8;
border-left-color: #65a30d;
}
.yoo-design_callout--ok::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2365a30d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.yoo-design_callout--tip {
background: #eef2ff;
border-left-color: #4f46e5;
}
.yoo-design_callout--tip::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v5'/%3E%3Ccircle cx='12' cy='16' r='0.9' fill='%234f46e5' stroke='none'/%3E%3C/svg%3E");
}
.yoo-design_callout--error {
background: #fef2f2;
border-left-color: #dc2626;
}
.yoo-design_callout--error::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
}
.yoo-design_callout--warn {
background: #fffbeb;
border-left-color: #d97706;
}
.yoo-design_callout--warn::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3Cpath d='M10.3 4.3 2.5 18a2 2 0 0 0 1.7 3h15.6a2 2 0 0 0 1.7-3L13.7 4.3a2 2 0 0 0-3.4 0Z'/%3E%3C/svg%3E");
}
@media screen and (min-width: 1024px) {
.yoo-design_callout {
padding: 1.2rem 1.5rem 1.2rem 3.35rem;
font-size: 1.05em;
border-radius: 16px;
}
.yoo-design_callout::before {
left: 1.15rem;
top: 1.25rem;
width: 1.25rem;
height: 1.25rem;
}
} .yoo-design_attention {
margin: 2rem 0;
padding: 1.5rem 1.35rem;
border: 3px solid #65a30d;
border-radius: var(--yd-fmt-radius-sm);
background: #fff;
box-shadow: 0 8px 24px rgba(101, 163, 13, 0.18);
font-size: 1.05em;
line-height: 1.55;
color: var(--yd-fmt-text);
}
.yoo-design_attention p {
margin: 0 0 0.75em;
font-size: inherit;
line-height: inherit;
}
.yoo-design_attention p:last-child {
margin-bottom: 0;
}
@media screen and (min-width: 1024px) {
.yoo-design_attention {
padding: 2.4rem 2.75rem;
border-width: 6px;
font-size: 1.2em;
line-height: 1.45;
}
} .yoo-design_strip {
display: table;
margin: 1.25rem 0 0.85rem;
padding: 0.45rem 0.9rem;
border-radius: 6px;
color: #fff !important;
text-transform: uppercase;
letter-spacing: 0.03em;
font-size: 0.9em;
font-weight: 600;
line-height: 1.35;
}
.yoo-design_strip::before {
content: "";
display: inline-block;
width: 0.7em;
height: 0.7em;
margin-right: 0.45em;
vertical-align: -0.05em;
background-size: contain;
background-repeat: no-repeat;
}
.yoo-design_strip--ok {
background: #65a30d;
}
.yoo-design_strip--ok::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
}
.yoo-design_strip--no {
background: #dc2626;
}
.yoo-design_strip--no::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
}
.yoo-design_strip--blue {
background: #2563eb;
}
.yoo-design_strip--blue::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
} .yoo-design_aside {
position: relative;
color: #475569;
font-style: italic;
line-height: 1.55;
opacity: 0.95;
font-size: 0.95em;
}
.yoo-design_aside p {
margin: 0 0 0.6em;
font-size: inherit;
font-style: inherit;
}
.yoo-design_aside p:last-child {
margin-bottom: 0;
}
.yoo-design_aside--left,
.yoo-design_aside--right {
width: min(42%, 16.5rem);
max-width: 16.5rem;
margin-top: 0.15rem;
margin-bottom: 1rem;
padding: 0.65rem 1.1rem 0.65rem 1rem;
}
.yoo-design_aside--left {
float: left;
clear: left;
margin-right: 1.15rem;
margin-left: 0;
border-left: 3px solid #94a3b8;
border-right: none;
text-align: left;
}
.yoo-design_aside--right {
float: right;
clear: right;
margin-left: 1.15rem;
margin-right: 0;
border-left: none;
border-right: 3px solid #94a3b8;
text-align: right;
} .yoo-design_aside:not(.yoo-design_aside--right):not(.yoo-design_aside--left) {
float: left;
clear: left;
width: min(42%, 16.5rem);
max-width: 16.5rem;
margin: 0.15rem 1.15rem 1rem 0;
padding: 0.65rem 1.1rem 0.65rem 1rem;
border-left: 3px solid #94a3b8;
text-align: left;
}
@media screen and (min-width: 1024px) {
.yoo-design_aside,
.yoo-design_aside--left,
.yoo-design_aside--right,
.yoo-design_aside:not(.yoo-design_aside--right):not(.yoo-design_aside--left) {
font-size: 1em;
}
.yoo-design_aside--left,
.yoo-design_aside--right,
.yoo-design_aside:not(.yoo-design_aside--right):not(.yoo-design_aside--left) {
width: min(40%, 18rem);
max-width: 18rem;
padding: 0.75rem 1.25rem 0.75rem 1.1rem;
}
.yoo-design_aside--left,
.yoo-design_aside:not(.yoo-design_aside--right):not(.yoo-design_aside--left) {
margin-right: 1.5rem;
border-left-width: 4px;
}
.yoo-design_aside--right {
margin-left: 1.5rem;
border-right-width: 4px;
}
}
@media screen and (max-width: 767px) {
.yoo-design_aside--left,
.yoo-design_aside--right,
.yoo-design_aside:not(.yoo-design_aside--right):not(.yoo-design_aside--left) {
float: none;
clear: none;
width: auto;
max-width: 100%;
margin: 1.25rem 0;
}
} .yoo-design_mark {
display: inline-block;
margin: 0 0 1rem;
padding: 0.2em 0.55em;
color: #1e293b;
background: #dbeafe;
border-radius: 6px;
line-height: 1.55;
font-weight: 500;
} .yoo-design_bignum {
position: relative;
margin: 2.5rem 0 2rem;
padding: 0 12%;
text-align: center;
font-size: clamp(2.75rem, 8vw, 4.75rem);
font-weight: 600;
line-height: 1;
color: #e2e8f0;
letter-spacing: -0.02em;
}
.yoo-design_bignum::before,
.yoo-design_bignum::after {
content: "";
position: absolute;
top: 54%;
width: 28%;
height: 1px;
background: #e2e8f0;
}
.yoo-design_bignum::before {
left: 4%;
}
.yoo-design_bignum::after {
right: 4%;
} .yoo-design_quote {
max-width: 36rem;
margin: 1.5rem auto;
padding: 0.25rem 1.25rem;
text-align: center;
font-weight: 600;
font-size: 1.15em;
line-height: 1.4;
letter-spacing: -0.02em;
color: transparent;
background-image: linear-gradient(
270deg,
#2882db,
#7b71d3 20%,
#ae5bbb 40%,
#cf4294 60%,
#dd3266 80%,
#d73b35
);
-webkit-background-clip: text;
background-clip: text;
}
.yoo-design_quote--accent {
color: #334155;
background: none;
-webkit-background-clip: unset;
background-clip: unset;
border-top: 1px solid #94a3b8;
border-bottom: 1px solid #94a3b8;
padding: 1.1rem 1.5rem;
font-style: italic;
font-weight: 500;
}
.yoo-design_quote--lg {
font-size: 1.45em;
line-height: 1.35;
max-width: 40rem;
}
@media screen and (min-width: 1024px) {
.yoo-design_quote {
font-size: 1.45em;
line-height: 1.35;
max-width: 32rem;
}
.yoo-design_quote--lg {
font-size: 1.75em;
max-width: 38rem;
}
} .yoo-design_checklist,
.yoo-design_stoplist,
.yoo-design_bonuslist {
margin: 1.25rem 0 1.5rem;
padding: 0.25rem 0 0.25rem 0.15rem;
color: var(--yd-fmt-text);
}
.yoo-design_checklist ul,
.yoo-design_checklist ol,
.yoo-design_stoplist ul,
.yoo-design_stoplist ol,
.yoo-design_bonuslist ul,
.yoo-design_bonuslist ol {
margin: 0;
padding: 0;
list-style: none;
}
.yoo-design_checklist li,
.yoo-design_checklist p,
.yoo-design_stoplist li,
.yoo-design_stoplist p,
.yoo-design_bonuslist li,
.yoo-design_bonuslist p {
position: relative;
margin: 0 0 0.65em;
padding-left: 2.15rem;
line-height: 1.5;
}
.yoo-design_checklist li::before,
.yoo-design_checklist p::before,
.yoo-design_stoplist li::before,
.yoo-design_stoplist p::before,
.yoo-design_bonuslist li::before,
.yoo-design_bonuslist p::before {
content: "";
position: absolute;
left: 0;
top: 0.18em;
width: 1.4rem;
height: 1.4rem;
border-radius: 50%;
background-repeat: no-repeat;
background-position: center;
}
.yoo-design_checklist li::before,
.yoo-design_checklist p::before {
background-color: #ecfccb;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2365a30d' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
background-size: 0.85rem;
}
.yoo-design_stoplist li::before,
.yoo-design_stoplist p::before {
background-color: #fee2e2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
background-size: 0.8rem;
}
.yoo-design_bonuslist li::before,
.yoo-design_bonuslist p::before {
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='13' rx='2'/%3E%3Cpath d='M12 8v13'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M12 8c-1.5-2.5-4-3-5.5-1.5S5 10 7 10h5'/%3E%3Cpath d='M12 8c1.5-2.5 4-3 5.5-1.5S19 10 17 10h-5'/%3E%3C/svg%3E"),
linear-gradient(135deg, #6366f1 0%, #2563eb 55%, #0ea5e9 100%);
background-size: 0.85rem, cover;
background-repeat: no-repeat, no-repeat;
background-position: center, center;
} .yoo-design_badge {
display: inline-block;
float: left;
margin: 0.15rem 0.85rem 0.5rem 0;
padding: 0.2rem 0.7rem;
color: #fff;
font-size: 0.8em;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.4;
border-radius: 6px;
text-transform: uppercase;
}
.yoo-design_badge--example {
background: #84cc16;
}
.yoo-design_badge--new {
background: #f59e0b;
}
.yoo-design_digit {
display: inline-block;
float: left;
margin: 0 0.65rem 0.35rem 0;
padding: 0.1rem 0.55rem 0.1rem 0;
font-size: 1.55em;
font-weight: 700;
line-height: 1.2;
color: #475569;
}
code.yoo-design_code,
.yoo-design_code {
display: inline;
vertical-align: baseline;
padding: 0.12em 0.4em;
border: 1px solid #e2e8f0;
border-radius: 5px;
background: #f8fafc;
color: #0f172a;
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
font-size: 0.9em;
overflow-wrap: anywhere;
white-space: break-spaces;
} .yoo-design_muted {
color: var(--yd-fmt-muted) !important;
}  .yoo-design_new--rail {
margin: 1.25rem 0;
padding: 0.85rem 1.15rem 0.85rem 1.25rem;
border-left: 3px solid #0d9488;
background: #f0fdfa;
border-radius: 0 12px 12px 0;
color: var(--yd-fmt-text);
line-height: 1.55;
}
.yoo-design_new--dash {
margin: 1.35rem 0;
padding: 1.2rem 1.35rem;
border: 1.5px dashed #94a3b8;
border-radius: 14px;
background: #f8fafc;
color: #334155;
line-height: 1.55;
}
.yoo-design_new--ink {
margin: 1.5rem 0;
padding: 1.35rem 1.45rem;
border-radius: 14px;
background: #0f172a;
color: #e2e8f0;
line-height: 1.6;
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
font-size: 0.95em;
}
.yoo-design_new--meta {
margin: 0.35rem 0 1.15rem;
font-size: 0.88em;
line-height: 1.45;
color: #64748b;
}
@media screen and (min-width: 1024px) {
.yoo-design_new--ink {
padding: 1.65rem 1.85rem;
}
} .yoo-design_new--tape {
position: relative;
display: inline-block;
max-width: 100%;
margin: 1.35rem 0;
padding: 0.85rem 1.25rem;
background: rgba(253, 224, 71, 0.45);
color: #422006;
line-height: 1.55;
transform: rotate(-1.2deg);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.35) inset;
}
.yoo-design_new--tape::before,
.yoo-design_new--tape::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
width: 10px;
background: repeating-linear-gradient(
-45deg,
transparent,
transparent 3px,
rgba(255, 255, 255, 0.35) 3px,
rgba(255, 255, 255, 0.35) 5px
);
opacity: 0.7;
pointer-events: none;
}
.yoo-design_new--tape::before {
left: 0;
}
.yoo-design_new--tape::after {
right: 0;
} .yoo-design_new--corners {
position: relative;
margin: 1.75rem 0;
padding: 1.35rem 1.5rem;
color: var(--yd-fmt-text);
line-height: 1.6;
background:
linear-gradient(#0f172a, #0f172a) 0 0 / 1.4rem 2px no-repeat,
linear-gradient(#0f172a, #0f172a) 0 0 / 2px 1.4rem no-repeat,
linear-gradient(#0f172a, #0f172a) 100% 0 / 1.4rem 2px no-repeat,
linear-gradient(#0f172a, #0f172a) 100% 0 / 2px 1.4rem no-repeat,
linear-gradient(#0f172a, #0f172a) 0 100% / 1.4rem 2px no-repeat,
linear-gradient(#0f172a, #0f172a) 0 100% / 2px 1.4rem no-repeat,
linear-gradient(#0f172a, #0f172a) 100% 100% / 1.4rem 2px no-repeat,
linear-gradient(#0f172a, #0f172a) 100% 100% / 2px 1.4rem no-repeat;
} .yoo-design_new--bubble {
position: relative;
margin: 1.5rem 0 2rem;
padding: 1.15rem 1.35rem;
border-radius: 18px;
background: #f1f5f9;
color: #1e293b;
line-height: 1.55;
}
.yoo-design_new--bubble::after {
content: "";
position: absolute;
left: 1.5rem;
bottom: -0.65rem;
width: 1.1rem;
height: 1.1rem;
background: #f1f5f9;
transform: rotate(45deg);
border-radius: 0 0 3px 0;
} .yoo-design_new--diag {
position: relative;
z-index: 0;
isolation: isolate;
display: block;
max-width: 34rem;
margin: 2rem auto;
padding: 2rem 2.25rem;
text-align: center;
font-size: 1.08em;
font-weight: 500;
letter-spacing: -0.01em;
line-height: 1.55;
color: #0f172a;
background: #fff;
border-radius: 14px;
box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}
.yoo-design_new--diag::before {
content: "";
position: absolute;
inset: -14px;
z-index: -1;
border-radius: 20px;
background-color: #eef2ff;
background-image: repeating-linear-gradient(
-18deg,
transparent,
transparent 9px,
rgba(99, 102, 241, 0.14) 9px,
rgba(99, 102, 241, 0.14) 18px
);
pointer-events: none;
} .yoo-design_new--stamp {
display: inline-block;
max-width: 100%;
margin: 1.25rem 0;
padding: 0.55rem 1rem;
border: 3px double #be123c;
border-radius: 6px;
color: #9f1239;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
font-size: 0.92em;
line-height: 1.35;
transform: rotate(-3deg);
opacity: 0.9;
} .yoo-design_new--brackets {
position: relative;
margin: 1.5rem auto;
max-width: 36rem;
padding: 0.85rem 2rem;
text-align: center;
color: #334155;
font-style: italic;
line-height: 1.5;
}
.yoo-design_new--brackets::before,
.yoo-design_new--brackets::after {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 2.4em;
font-style: normal;
font-weight: 300;
line-height: 1;
color: #94a3b8;
pointer-events: none;
}
.yoo-design_new--brackets::before {
content: "[";
left: 0.15rem;
}
.yoo-design_new--brackets::after {
content: "]";
right: 0.15rem;
}
@media screen and (min-width: 1024px) {
.yoo-design_new--corners,
.yoo-design_new--bubble {
padding-left: 1.75rem;
padding-right: 1.75rem;
}
.yoo-design_new--diag {
max-width: 38rem;
padding: 2.35rem 2.75rem;
font-size: 1.15em;
}
.yoo-design_new--diag::before {
inset: -16px;
}
} .yoo-design_new--editorial {
max-width: 32rem;
margin: 2rem auto;
padding: 1.35rem 0.5rem;
text-align: center;
color: #1e293b;
font-size: 1.08em;
line-height: 1.55;
letter-spacing: -0.01em;
border-top: 1px solid #0f172a;
border-bottom: 1px solid #0f172a;
} .yoo-design_new--dropcap {
margin: 1.35rem 0;
color: #0f172a;
line-height: 1.65;
}
.yoo-design_new--dropcap::first-letter {
float: left;
margin: 0.1em 0.15em 0 0;
padding: 0.05em 0.12em;
font-size: 3.1em;
font-weight: 700;
line-height: 0.85;
color: #0f172a;
background: linear-gradient(145deg, #ccfbf1, #e0f2fe);
border-radius: 8px;
}
@media screen and (min-width: 1024px) {
.yoo-design_new--editorial {
font-size: 1.18em;
padding: 1.55rem 0.75rem;
}
.yoo-design_new--dropcap::first-letter {
font-size: 3.4em;
}
} span.yoo-design_text--marker,
.yoo-design_text--marker {
display: inline;
padding: 0.05em 0.2em;
background: linear-gradient(transparent 55%, #fef08a 55%);
color: inherit;
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
}
span.yoo-design_text--grad,
.yoo-design_text--grad {
display: inline;
font-weight: 700;
color: transparent;
background-image: linear-gradient(90deg, #2563eb, #7c3aed, #db2777);
-webkit-background-clip: text;
background-clip: text;
}
span.yoo-design_text--uline,
.yoo-design_text--uline {
display: inline;
background-image: linear-gradient(90deg, #22d3ee, #6366f1);
background-size: 100% 0.18em;
background-repeat: no-repeat;
background-position: 0 100%;
padding-bottom: 0.08em;
font-weight: 600;
}
span.yoo-design_text--outline,
.yoo-design_text--outline {
display: inline-block;
vertical-align: middle;
padding: 0.12em 0.55em;
border: 1.5px solid #94a3b8;
border-radius: 8px;
color: #334155;
font-size: 0.88em;
font-weight: 600;
line-height: 1.35;
}