#appointment-result { width: min(440px, calc(100% - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: 32px 28px; border: 1px solid #dfcdb5; border-radius: 16px; background: #fff5eb; color: #29403d; box-shadow: 0 20px 70px #213c3938; text-align: center; }
#appointment-result::backdrop { background: #213c3980; }
#appointment-result .appointment-result-mark { display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto 18px; border-radius: 50%; background: #e2ebe5; color: #006f8c; font: 28px/1 sans-serif; }
#appointment-result[data-status="failure"] .appointment-result-mark { background: #efdfd5; color: #946451; }
#appointment-result h2 { margin: 0 0 14px; color: #006f8c; font: 600 24px/1.4 "Microsoft YaHei", sans-serif; }
#appointment-result p { margin: 0 0 22px; color: #53625e; font: 15px/1.8 "Microsoft YaHei", sans-serif; }
#appointment-result button { min-width: 120px; min-height: 44px; padding: 10px 24px; border: 0; border-radius: 5px; background: #006f8c; color: white; cursor: pointer; }
#appointment-result button:focus-visible { outline: 3px solid #b49253; outline-offset: 4px; }