.daily-alchemy-section {
    position: relative;
    z-index: 4;
    width: min(1320px, calc(100% - 48px));
    margin: -38px auto 100px;
    color: #55424f;
}

.daily-alchemy-shell {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(191, 137, 161, .27);
    border-radius: 32px;
    background:
        radial-gradient(circle at 90% 0, rgba(255, 212, 135, .13), transparent 26%),
        linear-gradient(145deg, rgba(255, 252, 253, .97), rgba(247, 241, 245, .96));
    box-shadow: 0 26px 65px rgba(82, 54, 71, .12), inset 0 1px rgba(255, 255, 255, .86);
}

.daily-alchemy-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: radial-gradient(circle, rgba(205, 101, 146, .14) 1px, transparent 1px);
    background-size: 31px 31px;
    opacity: .3;
    mask-image: linear-gradient(115deg, #000, transparent 38%, transparent 70%, #000);
}

.daily-alchemy-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 30px 34px 24px;
    border-bottom: 1px solid rgba(191, 137, 161, .22);
}

.daily-alchemy-heading {
    display: grid;
    grid-template-columns: 54px 1fr;
    align-items: center;
    gap: 15px;
}

.daily-alchemy-gem {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(201, 83, 134, .25);
    border-radius: 18px;
    color: #bd4d80;
    font-style: normal;
    font-size: 23px;
    background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(249,220,233,.84));
    box-shadow: 0 10px 24px rgba(187, 77, 128, .12);
}

.daily-alchemy-kicker,
.daily-alchemy-heading h2,
.daily-alchemy-heading p,
.daily-alchemy-date span,
.daily-alchemy-date strong,
.alchemy-round-label span,
.alchemy-round-label strong {
    margin: 0;
}

.daily-alchemy-kicker {
    color: #c95487;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .22em;
}

.daily-alchemy-heading h2 {
    margin-top: 3px;
    font-size: clamp(25px, 2.3vw, 36px);
    line-height: 1.12;
    letter-spacing: -.035em;
}

.daily-alchemy-heading p {
    margin-top: 6px;
    color: #7c6875;
    font-size: 13px;
    font-weight: 650;
}

.daily-alchemy-date {
    flex: 0 0 auto;
    min-width: 205px;
    padding: 12px 17px;
    border: 1px solid rgba(191, 137, 161, .25);
    border-radius: 16px;
    background: rgba(255, 255, 255, .55);
    text-align: right;
}

.daily-alchemy-date span {
    display: block;
    color: #927582;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .15em;
}

.daily-alchemy-date strong {
    display: block;
    margin-top: 3px;
    color: #55424f;
    font-size: 14px;
}

.daily-alchemy-date small {
    display: block;
    margin-top: 3px;
    color: #738790;
    font-size: 10px;
    font-weight: 700;
}

.daily-alchemy-body {
    position: relative;
    z-index: 1;
    padding: 23px 28px 29px;
}

.daily-alchemy-days {
    display: block;
}

.daily-alchemy-day {
    min-width: 0;
}

.daily-alchemy-day[hidden] { display: none; }

.daily-alchemy-day-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 18px;
    margin: 0 4px 14px;
}

.daily-alchemy-day-head > span {
    display: inline-grid;
    place-items: center;
    min-width: 88px;
    min-height: 34px;
    padding: 7px 15px;
    border: 1px solid rgba(191, 77, 125, .24);
    border-radius: 999px;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    background: linear-gradient(135deg, #bd4d7e, #de7ca1);
    box-shadow: 0 8px 20px rgba(180, 63, 113, .17);
}

.daily-alchemy-day.is-tomorrow .daily-alchemy-day-head > span {
    border-color: rgba(69, 151, 173, .24);
    background: linear-gradient(135deg, #3b8ea4, #69b9c7);
    box-shadow: 0 8px 20px rgba(54, 139, 160, .16);
}

.daily-alchemy-day-head div {
    min-width: 0;
    text-align: left;
}

.daily-alchemy-day-head strong,
.daily-alchemy-day-head small {
    display: block;
}

.daily-alchemy-day-head strong {
    color: #594550;
    font-size: 16px;
}

.daily-alchemy-day-head small {
    margin-top: 2px;
    color: #8c7582;
    font-size: 10px;
    font-weight: 800;
}

.daily-alchemy-empty {
    margin: 0;
    padding: 28px 20px;
    border: 1px dashed rgba(191, 137, 161, .34);
    border-radius: 18px;
    color: #806d78;
    text-align: center;
    font-size: 13px;
    font-weight: 750;
    background: rgba(255, 255, 255, .38);
}

.daily-alchemy-tabs {
    display: inline-flex;
    gap: 5px;
    margin: 0 0 18px;
    padding: 4px;
    border: 1px solid rgba(191, 137, 161, .24);
    border-radius: 15px;
    background: rgba(255, 255, 255, .55);
}

.daily-alchemy-tab {
    min-width: 132px;
    min-height: 42px;
    padding: 9px 22px;
    border: 0;
    border-radius: 11px;
    color: #806a77;
    font: inherit;
    font-size: 12px;
    font-weight: 850;
    background: transparent;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, box-shadow .18s ease;
}

.daily-alchemy-tab:hover { color: #4f3c49; }
.daily-alchemy-tab:focus-visible { outline: 3px solid rgba(102, 183, 200, .35); outline-offset: 2px; }
.daily-alchemy-tab.is-active {
    color: #fff;
    background: linear-gradient(135deg, #bf4d7d, #dc789d);
    box-shadow: 0 7px 18px rgba(180, 63, 113, .2);
}

.daily-alchemy-board[hidden] { display: none; }

.alchemy-table-wrap {
    overflow-x: auto;
    padding: 14px 13px;
    border: 1px solid rgba(137, 148, 174, .15);
    border-radius: 23px;
    background:
        radial-gradient(circle at 83% 33%, rgba(223, 184, 78, .055), transparent 22%),
        linear-gradient(145deg, #151720, #0d1017 70%);
    box-shadow: inset 0 1px rgba(255,255,255,.035), 0 18px 38px rgba(46, 35, 44, .14);
    scrollbar-color: rgba(218, 119, 157, .55) rgba(255,255,255,.05);
    scrollbar-width: thin;
}

.daily-alchemy-table {
    width: 100%;
    min-width: 890px;
    border-collapse: separate;
    border-spacing: 7px 8px;
    table-layout: fixed;
}

.daily-alchemy-table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.daily-alchemy-table th,
.daily-alchemy-table td {
    padding: 0;
    border: 0;
}

.daily-alchemy-table th {
    width: 74px;
    text-align: center;
    vertical-align: middle;
}

.alchemy-round-label {
    display: block;
    padding: 0 4px;
}

.alchemy-round-label span {
    display: block;
    color: #a4a8b6;
    font-size: 10px;
    font-weight: 800;
}

.alchemy-daily-slot {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 1;
    min-height: 78px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(170, 179, 202, .13);
    border-radius: 12px;
    background:
        radial-gradient(circle at 45% 38%, rgba(86, 102, 132, .13), transparent 50%),
        linear-gradient(145deg, #10131a, #080a0f);
    box-shadow: inset 0 0 18px rgba(0, 0, 0, .23);
}

.alchemy-daily-slot::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    box-shadow: inset 0 1px rgba(255,255,255,.035);
}

.alchemy-daily-slot img {
    display: block;
    width: 72px;
    height: 72px;
    max-width: 87%;
    max-height: 87%;
    object-fit: contain;
    filter: drop-shadow(0 5px 6px rgba(0,0,0,.32));
    transition: transform .2s ease, filter .2s ease;
}

.alchemy-daily-slot:hover img {
    transform: translateY(-2px) scale(1.06);
    filter: drop-shadow(0 7px 8px rgba(0,0,0,.4)) brightness(1.08);
}

.alchemy-daily-quantity {
    position: absolute;
    right: 6px;
    bottom: 5px;
    z-index: 2;
    color: #fff;
    padding: 3px 6px 4px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    background: rgba(7, 9, 15, .82);
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .01em;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .4);
    text-shadow: 0 1px 2px #000;
}

.alchemy-daily-probability {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 2;
    padding: 3px 6px 4px;
    border: 1px solid rgba(123, 232, 255, .33);
    border-radius: 8px;
    background: rgba(7, 18, 27, .88);
    color: #aeeeff;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .01em;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .4);
    text-shadow: 0 1px 2px #000;
}

.daily-alchemy-note {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 13px 4px 0;
    color: #806d78;
    font-size: 11px;
    font-weight: 650;
}

.daily-alchemy-note span:first-child::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 7px;
    border-radius: 50%;
    background: #65bea7;
    box-shadow: 0 0 0 4px rgba(101, 190, 167, .13);
}

html[data-theme="dark"] .daily-alchemy-section { color: #f1e8ed; }
html[data-theme="dark"] .daily-alchemy-shell {
    border-color: rgba(224, 151, 183, .17);
    background:
        radial-gradient(circle at 90% 0, rgba(211, 151, 57, .08), transparent 26%),
        linear-gradient(145deg, rgba(25, 26, 42, .98), rgba(16, 24, 38, .98));
    box-shadow: 0 26px 65px rgba(0, 0, 0, .29), inset 0 1px rgba(255,255,255,.035);
}
html[data-theme="dark"] .daily-alchemy-gem {
    color: #ef8db7;
    background: linear-gradient(145deg, rgba(62,40,57,.96), rgba(42,34,53,.9));
}
html[data-theme="dark"] .daily-alchemy-heading p,
html[data-theme="dark"] .daily-alchemy-note { color: #bcaeba; }
html[data-theme="dark"] .daily-alchemy-date,
html[data-theme="dark"] .daily-alchemy-tabs { border-color: rgba(224,151,183,.17); background: rgba(7,14,27,.36); }
html[data-theme="dark"] .daily-alchemy-date span { color: #d49ab4; }
html[data-theme="dark"] .daily-alchemy-date strong { color: #f3e8ee; }
html[data-theme="dark"] .daily-alchemy-date small { color: #9ec4ce; }
html[data-theme="dark"] .daily-alchemy-tab { color: #c4b4bf; }
html[data-theme="dark"] .daily-alchemy-tab:hover { color: #fff; }
html[data-theme="dark"] .daily-alchemy-day-head strong { color: #f3e8ee; }
html[data-theme="dark"] .daily-alchemy-day-head small,
html[data-theme="dark"] .daily-alchemy-empty { color: #bcaeba; }
html[data-theme="dark"] .daily-alchemy-empty { border-color: rgba(224,151,183,.2); background: rgba(7,14,27,.25); }

@media (max-width: 760px) {
    .daily-alchemy-section { width: min(100% - 24px, 1320px); margin: -28px auto 70px; }
    .daily-alchemy-shell { border-radius: 24px; }
    .daily-alchemy-head { align-items: flex-start; flex-direction: column; padding: 24px 19px 20px; }
    .daily-alchemy-heading { grid-template-columns: 46px 1fr; gap: 12px; }
    .daily-alchemy-gem { width: 46px; height: 46px; border-radius: 15px; }
    .daily-alchemy-heading p { font-size: 11px; }
    .daily-alchemy-date { min-width: 0; width: 100%; text-align: left; }
    .daily-alchemy-body { padding: 19px 13px 22px; }
    .daily-alchemy-day-head { align-items: flex-start; }
    .daily-alchemy-day-head strong { font-size: 12px; }
    .daily-alchemy-tabs { width: 100%; }
    .daily-alchemy-tab { flex: 1; padding-inline: 8px; }
    .alchemy-table-wrap { padding: 8px 6px; border-radius: 17px; }
    .daily-alchemy-note { align-items: flex-start; flex-direction: column; gap: 7px; padding-inline: 3px; }
}

@media (prefers-reduced-motion: reduce) {
    .daily-alchemy-tab,
    .alchemy-daily-slot img { transition: none; }
}
