.obt-update {
    --obt-gold: #f4bd4d;
    --obt-cyan: #4bd4e8;
    --obt-green: #67d9a1;
    --obt-line: rgba(125, 199, 225, .18);
    color: #dbe8f1;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    gap: 18px;
}

.obt-update * { box-sizing: border-box; }
.obt-update > * { min-width: 0; }
.obt-update h3, .obt-update h4, .obt-update p { margin-top: 0; }
.obt-update h3 { color: #fff; line-height: 1.28; }
.obt-update h4 { color: #f5d88c; margin-bottom: 8px; }
.obt-update p, .obt-update li { line-height: 1.65; }

.obt-hero {
    overflow: hidden;
    position: relative;
    padding: clamp(20px, 4vw, 34px);
    border: 1px solid rgba(244, 189, 77, .3);
    border-radius: 14px;
    background:
        radial-gradient(circle at 90% 10%, rgba(75, 212, 232, .18), transparent 34%),
        linear-gradient(135deg, rgba(38, 25, 20, .96), rgba(12, 27, 43, .96));
}

.obt-hero::after {
    content: "MU";
    position: absolute;
    right: 22px;
    bottom: -34px;
    color: rgba(255, 255, 255, .035);
    font: 900 9rem/1 Georgia, serif;
    pointer-events: none;
}

.obt-kicker, .obt-label {
    color: var(--obt-cyan);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.obt-hero h3 { max-width: 760px; margin: 8px 0 12px; font-size: clamp(1.45rem, 3vw, 2.1rem); }
.obt-hero > p { max-width: 760px; margin-bottom: 18px; color: #bfd0de; }
.obt-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.obt-badges span { padding: 7px 11px; border: 1px solid rgba(244, 189, 77, .25); border-radius: 999px; color: #f6db98; background: rgba(244, 189, 77, .08); font-size: .8rem; font-weight: 700; }

.obt-nav { display: flex; flex-wrap: wrap; gap: 8px; }
.obt-nav a { padding: 9px 12px; border: 1px solid var(--obt-line); border-radius: 8px; color: #bfeef5; background: rgba(75, 212, 232, .06); text-decoration: none; font-size: .88rem; }
.obt-nav a:hover, .obt-nav a:focus-visible { color: #fff; border-color: rgba(75, 212, 232, .55); background: rgba(75, 212, 232, .12); }

.obt-section { scroll-margin-top: 18px; padding: clamp(18px, 3vw, 28px); border: 1px solid var(--obt-line); border-radius: 14px; background: linear-gradient(145deg, rgba(8, 18, 31, .82), rgba(15, 25, 40, .62)); }
.obt-section-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.obt-section-heading h3 { margin: 2px 0 0; font-size: 1.35rem; }
.obt-section-heading p { margin-bottom: 0; }
.obt-number { display: grid; flex: 0 0 45px; height: 45px; place-items: center; border-radius: 50%; border: 1px solid rgba(244, 189, 77, .45); color: var(--obt-gold); background: rgba(244, 189, 77, .08); font-weight: 900; }

.obt-callout, .obt-warning { display: grid; gap: 4px; margin: 14px 0 18px; padding: 14px 16px; border-left: 3px solid var(--obt-gold); background: rgba(244, 189, 77, .07); }
.obt-callout strong, .obt-warning b { color: #ffdf91; }
.obt-callout span, .obt-warning span { color: #c5d2dc; line-height: 1.55; }
.obt-callout-green { border-color: var(--obt-green); background: rgba(103, 217, 161, .07); }
.obt-callout-green strong { color: #9ce9c3; }

.obt-steps, .obt-boss-grid, .obt-two-col { display: grid; gap: 12px; }
.obt-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.obt-step, .obt-boss-grid article, .obt-two-col article { padding: 15px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; background: rgba(4, 11, 21, .42); }
.obt-step > span { color: var(--obt-cyan); font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.obt-step h4 { margin-top: 6px; }
.obt-step p:last-child, .obt-boss-grid p:last-child, .obt-two-col p:last-child { margin-bottom: 0; }

.obt-table-wrap { overflow-x: auto; margin: 16px 0; border: 1px solid rgba(255, 255, 255, .09); border-radius: 10px; }
.obt-table { width: 100%; min-width: 620px; border-collapse: collapse; background: rgba(3, 10, 19, .35); }
.obt-table th, .obt-table td { padding: 11px 12px; border-bottom: 1px solid rgba(255, 255, 255, .07); text-align: left; vertical-align: top; }
.obt-table th { color: #8fe2ed; background: rgba(75, 212, 232, .07); font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.obt-table tr:last-child td { border-bottom: 0; }
.obt-table-center td:first-child, .obt-table-center td:nth-child(2) { font-weight: 800; }

.obt-note { color: #aebdca; font-size: .9rem; }
.obt-list { margin: 14px 0 0; padding-left: 20px; }
.obt-list li + li, .obt-two-col li + li { margin-top: 6px; }
.obt-details { margin-top: 14px; border: 1px solid rgba(255, 255, 255, .09); border-radius: 10px; background: rgba(3, 10, 19, .32); }
.obt-details summary { cursor: pointer; padding: 13px 15px; color: #f5d88c; font-weight: 800; }
.obt-details[open] summary { border-bottom: 1px solid rgba(255, 255, 255, .08); }
.obt-class-grid, .obt-rewards { padding: 14px 16px; }
.obt-class-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 16px; }
.obt-rewards p:last-child { margin-bottom: 0; }

.obt-schedule { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 15px; }
.obt-schedule span { padding: 8px 11px; border-radius: 7px; color: #101722; background: var(--obt-gold); font-weight: 900; }
.obt-schedule small { flex-basis: 100%; color: #9eb0bf; }
.obt-boss-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 16px 0; }
.obt-boss-grid h4 { margin-bottom: 3px; }
.obt-boss-grid p { color: #9db0c0; margin-bottom: 10px; }
.obt-boss-grid strong { color: #fff; }

.obt-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.obt-facts div { padding: 12px; border: 1px solid rgba(75, 212, 232, .14); border-radius: 9px; background: rgba(75, 212, 232, .05); }
.obt-facts b, .obt-facts span { display: block; }
.obt-facts b { color: #fff; }
.obt-facts span { margin-top: 3px; color: #9fb2c1; font-size: .82rem; }
.obt-two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 16px 0; }
.obt-two-col ol, .obt-two-col ul { margin: 0; padding-left: 20px; }

.obt-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: clamp(19px, 3vw, 28px); border: 1px solid rgba(88, 101, 242, .36); border-radius: 14px; background: linear-gradient(130deg, rgba(38, 42, 91, .7), rgba(12, 23, 40, .86)); }
.obt-footer h3 { margin: 4px 0 7px; }
.obt-footer p:last-child { margin-bottom: 0; color: #bdc9da; }
.obt-footer a { flex: 0 0 auto; padding: 11px 16px; border-radius: 8px; color: #fff; background: #5865f2; font-weight: 800; text-decoration: none; }
.obt-footer a:hover, .obt-footer a:focus-visible { background: #7180ff; }

@media (max-width: 820px) {
    .obt-steps, .obt-boss-grid { grid-template-columns: 1fr; }
    .obt-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .obt-section { padding: 16px 13px; }
    .obt-two-col, .obt-class-grid { grid-template-columns: 1fr; }
    .obt-footer { align-items: stretch; flex-direction: column; }
    .obt-footer a { text-align: center; }
    .obt-hero::after { font-size: 6rem; }
}