.ding-page { margin:0; min-height:100dvh; background:#f5f7fb; color:#172a41; }
.ding-header { min-height:72px; display:flex; align-items:center; gap:20px; max-width:1200px; margin:0 auto; padding:16px 28px; border-bottom:1px solid #e0e6ee; }
.ding-header .brand { flex-direction:row; gap:10px; }
.ding-return { margin-left:auto; font-size:14px; }
.ding-main { max-width:1160px; padding:32px 28px 64px; margin:auto; }
.ding-title h1 { margin:6px 0 10px; font-size:28px; }
.ding-title .eyebrow { margin:0; }
.ding-title p { max-width:760px; line-height:1.7; }
.ding-navigation { display:flex; flex-wrap:wrap; gap:8px; margin:22px 0; }
.ding-navigation a { padding:8px 14px; border-radius:8px; background:white; border:1px solid #dbe3ed; }
.ding-navigation a[aria-current="page"] { border-color:#196dd4; color:#1559b1; background:#eef5ff; }
.ding-message { padding:13px 16px; border-radius:10px; background:#eaf5f0; border:1px solid #bcddcf; margin:18px 0; overflow-wrap:anywhere; }
.ding-message.error { background:#fff2f0; border-color:#edc7bf; color:#983d2e; }
.ding-panel { background:white; border:1px solid #dfe6ef; border-radius:12px; padding:24px; margin:18px 0; }
.ding-panel h2 { font-size:19px; margin:0 0 12px; }
.ding-panel h3 { font-size:15px; margin:20px 0 10px; }
.ding-panel p { line-height:1.65; }
.ding-panel:focus { outline:none; }
.ding-narrow { max-width:540px; margin:24px auto; }
.ding-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.ding-form label { display:flex; flex-direction:column; gap:7px; font-size:14px; font-weight:500; }
.ding-form input,.ding-form select { min-width:0; width:100%; padding:10px 12px; border:1px solid #c9d4e2; border-radius:8px; background:white; }
.ding-form .ding-check { flex-direction:row; align-items:center; gap:8px; font-weight:400; }
.ding-form .ding-check input { width:18px; height:18px; margin:0; }
.ding-form .ding-wide,.ding-actions { grid-column:1 / -1; }
.ding-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:8px; }
.ding-actions a { padding:8px 0; }
.ding-actions button { min-height:38px; }
.ding-note { font-size:13px; color:#52677f; }
.ding-selector { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:20px; }
.ding-selector select { max-width:100%; min-width:220px; }
.ding-empty { padding:22px 0; color:#52677f; }
.ding-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:14px 0; }
.ding-fact { border:1px solid #e4eaf2; border-radius:8px; padding:12px; min-width:0; }
.ding-fact dt { font-size:12px; color:#5b6d83; }
.ding-fact dd { margin:5px 0 0; font-weight:550; overflow-wrap:anywhere; }
.ding-table-wrap { overflow-x:auto; max-width:100%; }
.ding-table { width:100%; border-collapse:collapse; font-size:13px; }
.ding-table th,.ding-table td { padding:11px 10px; text-align:left; border-bottom:1px solid #e3e9f0; vertical-align:top; }
.ding-table th { color:#52677f; white-space:nowrap; font-weight:500; }
.ding-table td { overflow-wrap:anywhere; }
.ding-table td button { white-space:nowrap; }
.ding-details { margin:16px 0; }
.ding-details summary { cursor:pointer; font-weight:550; }
.ding-details[open] summary { margin-bottom:16px; }
.ding-preview { max-height:400px; overflow:auto; background:#f5f7fa; border:1px solid #dfe6ef; border-radius:8px; padding:12px; font-size:12px; white-space:pre-wrap; overflow-wrap:anywhere; }
.ding-status { display:inline-block; font-size:12px; padding:4px 8px; border-radius:6px; background:#edf2f8; color:#38506e; }
.ding-status.active { color:#185c3f; background:#e8f4ed; }
.ding-login-options { display:grid; gap:12px; }
.ding-login-options a { display:block; border:1px solid #cad8e9; border-radius:9px; padding:13px 16px; text-align:center; background:#f2f7ff; }
.ding-form button:disabled { opacity:.6; }
.ding-spinner { width:28px; height:28px; border:3px solid #d7e5f5; border-top-color:#196dd4; border-radius:50%; animation:ding-spin 1s linear infinite; }
@keyframes ding-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .ding-spinner { animation:none; } }
@media(max-width:680px) { .ding-header { padding:13px 16px; min-height:60px; gap:10px; flex-wrap:wrap; }.ding-header .brand-mark { width:30px;height:30px; }.ding-header #ding-environment { display:none; }.ding-main { padding:22px 16px 40px; }.ding-title h1 { font-size:24px; }.ding-panel { padding:18px 15px; }.ding-form { grid-template-columns:minmax(0,1fr); }.ding-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }.ding-table th,.ding-table td { padding:9px 7px; }.ding-return { font-size:13px; }.ding-actions button { flex:1 1 auto; }.ding-navigation a { font-size:13px; }.ding-selector select { width:100%; } }