/* ==========================================================================
   duolingool 复刻 · 自定义层
   基础视觉全部来自原站 CSS（base.css，保留原类名）
   本文件只负责：交互态、登录模式切换、结果面板、控制台界面
   ========================================================================== */

/* ---------- 字体（原站 @font-face 已指向 /assets/duolingo-sans.woff2） ---------- */
@font-face {
  font-family: 'Duolingo Sans Local';
  src: url('/assets/duolingo-sans.woff2') format('woff2');
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}
@font-face {
  font-family: 'Duo Feather';
  src: url('/assets/feather-bold.woff2') format('woff2');
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}
@font-face {
  font-family: 'Duolingool Feather';
  src: url('/assets/feather-bold.woff2') format('woff2');
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}

/* ---------- 补 reset（原站用 Tailwind preflight，已内联在 base.css 里一部分） ---------- */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
button { font: inherit; }
img { max-width: 100%; }

/* ---------- Tailwind preflight 补齐 ----------
   原站依赖 preflight 清零默认边距/边框/字号。提取模块样式时 preflight 没跟过来，
   若不补，h1/h2/p/ul 的浏览器默认 margin 会让整页排版与原站错位。 */
*, ::before, ::after {
  box-sizing: border-box;
  border: 0 solid;
}
html {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body { margin: 0; line-height: inherit; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; margin: 0; }
p, figure, blockquote, dl, dd, pre { margin: 0; }
ul, ol { list-style: none; margin: 0; padding: 0; }
a { color: inherit; text-decoration: inherit; }
/* 注意：原站组件大量依赖 [type='button'] 元素选择器写样式，
   若预检里的 [type='button'] 保持 (0,1,0) 优先级，会与组件类同优先级、
   因后加载而覆盖组件样式（返回按钮被刷成透明即此原因）。
   统一用 :where() 把预检降为 0 优先级，组件类永远胜出。 */
:where(button, [type='button'], [type='submit']) { -webkit-appearance: button; background: none; cursor: pointer; }
:where(button):disabled { cursor: default; }
:where(input, textarea, select) { font: inherit; color: inherit; background: none; }
input::placeholder, textarea::placeholder { opacity: 1; color: currentColor; }
:where(table) { border-collapse: collapse; border-color: inherit; text-indent: 0; }
:where(img, svg, video, canvas) { display: block; max-width: 100%; height: auto; }
:where(details) { display: block; }
:where(summary) { display: list-item; }
:where(hr) { height: 0; color: inherit; border-top-width: 1px; }
abbr:where([title]) { text-decoration: underline dotted; }

/* [hidden] 必须显式 display:none —— 原站 Tailwind preflight 提供此规则，
   提取样式时漏掉了，导致 label{display:block} / inputWrap{display:flex}
   直接覆盖 hidden 属性，隐藏的字段仍然显示 */
[hidden] { display: none !important; }

/* ---------- 礼盒插画：锁死尺寸 ----------
   原站用动画播放器渲染，这里用静态 poster。
   SVG 自身带 width:100%/height:100% 内联样式，不加约束会撑破整页布局。 */
.customer-preview-module__BO1pxW__gift {
  width: min(410px, 100%);
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  position: relative;
}
.duo-gift-animation-module__Jg-y8G__frame {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.duo-gift-animation-module__Jg-y8G__fallback {
  object-fit: contain !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  display: block;
}
.customer-preview-module__BO1pxW__art { overflow: hidden; }

/* ==========================================================================
   一、卡片内交互态
   ========================================================================== */

/* 步骤切换：隐藏的面板 */
.duo-live-app-module__MKKcqW__panel[hidden] { display: none !important; }

/* 卡密摘要条 */
.duo-live-app-module__MKKcqW__codeSummary strong {
  font-size: 13px;
  color: #4b4b4b;
  line-height: 1.3;
}
.duo-live-app-module__MKKcqW__codeSummary small {
  font-size: 11px;
  color: #678f54;
  line-height: 1.3;
}
.duo-live-app-module__MKKcqW__codeSummaryCopy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0;
  flex: 1;
}

/* 登录模式切换按钮（未激活态） */
.duo-live-app-module__MKKcqW__loginMode {
  color: #777;
  min-height: 36px;
  font: inherit;
  cursor: pointer;
  background: 0 0;
  border: 0;
  border-radius: 9px;
  flex: 1;
  font-size: 13px;
  font-weight: 800;
  transition: color .15s, background .15s;
}
.duo-live-app-module__MKKcqW__loginMode:hover { color: #46a302; }
.duo-live-app-module__MKKcqW__loginModeActive {
  color: #fff !important;
  background: #58cc02 !important;
  box-shadow: inset 0 -2px #46aa00;
}

/* 密码框内的显示/隐藏 */
.duo-live-app-module__MKKcqW__inputWrap:has(.duo-live-app-module__MKKcqW__input) {
  display: flex;
  align-items: center;
}
.duo-live-app-module__MKKcqW__inputToggle {
  flex: none;
  cursor: pointer;
  background: transparent;
  border: 0;
  color: #46a302;
  font-size: 13px;
  font-weight: 800;
  padding: 0 14px 0 8px;
  align-self: stretch;
  white-space: nowrap;
}
.duo-live-app-module__MKKcqW__inputToggle:disabled { color: #a2a39a; cursor: default; }

/* 输入聚焦态：与原站绿框一致 */
.duo-live-app-module__MKKcqW__standaloneInput:focus {
  border-color: #58cc02 !important;
  background: #fff !important;
}
.duo-live-app-module__MKKcqW__inputWrap:focus-within {
  border-color: #58cc02;
  background: #fff;
}
.duo-live-app-module__MKKcqW__standaloneInput[aria-invalid='true'] {
  border-color: #d93030 !important;
}

/* 错误文案 */
.duo-live-app-module__MKKcqW__error[hidden] { display: none !important; }

/* 勾选框 */
.duo-live-app-module__MKKcqW__checkbox input {
  flex: none;
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: #58cc02;
  cursor: pointer;
}

/* 结果面板 */
.duo-live-app-module__MKKcqW__result { text-align: left; }
.duo-live-app-module__MKKcqW__result .rRow {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 5px 0;
  border-bottom: 1px dashed #e5e5e5;
  font-size: 12px;
}
.duo-live-app-module__MKKcqW__result .rRow:last-child { border-bottom: 0; }
.duo-live-app-module__MKKcqW__result .rRow b {
  font-weight: 800;
  color: #4b4b4b;
  text-align: right;
  word-break: break-all;
}

/* ── 兑换成功 → 跳转官方页面 ── */
.duo-live-app-module__MKKcqW__officialRedirect {
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: #f2f9ec;
  border: 1px solid #cfe8bd;
  text-align: left;
}
.duo-live-app-module__MKKcqW__officialRedirect[hidden] { display: none; }
.duo-live-app-module__MKKcqW__officialRedirectText {
  margin: 0 0 12px;
  font-size: 12.5px;
  line-height: 1.6;
  color: #4a6b33;
}
.duo-live-app-module__MKKcqW__officialRedirectActions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.duo-live-app-module__MKKcqW__officialRedirectActions .duo-live-app-module__MKKcqW__primary {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.duo-live-app-module__MKKcqW__result .rRow span { color: #777; flex: none; }
/* 原站结果页用 dl > div > dt + dd */
.duo-live-app-module__MKKcqW__result > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.duo-live-app-module__MKKcqW__result dt {
  color: #777;
  flex: none;
}
.duo-live-app-module__MKKcqW__result dd {
  color: #4b4b4b;
  text-align: right;
  overflow-wrap: anywhere;
  margin: 0;
  font-weight: 700;
}
.duo-live-app-module__MKKcqW__result code {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 11px;
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 2px 6px;
  color: #4b4b4b;
}

/* 结果图标状态 */
.duo-live-app-module__MKKcqW__pendingIcon.is-pending {
  color: #a67c00;
  background: #fff8ce;
  border: 1px solid #ffd900;
}
.duo-live-app-module__MKKcqW__pendingIcon.is-failed {
  color: #d93030;
  background: #fdeeee;
  border: 1px solid #f5c2c2;
}

/* 加载中 */
.duo-live-app-module__MKKcqW__primary[disabled] {
  opacity: .6;
  cursor: wait;
  box-shadow: inset 0 -4px #46aa00;
}
.duo-live-app-module__MKKcqW__primary.is-loading span:first-child { opacity: .8; }

/* 会员信息条（卡头内） */
.duo-live-app-module__MKKcqW__membershipMeta[hidden] { display: none !important; }
.duo-live-app-module__MKKcqW__cardBadge {
  color: #4b4b4b;
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 9px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 800;
}

/* 步骤进度条：完成态连线 */
.duo-live-app-module__MKKcqW__progressItem i {
  flex: 1;
  height: 2px;
  background: #e5e5e5;
  margin: 0 2px;
  border-radius: 2px;
}
.duo-live-app-module__MKKcqW__progressItem.is-done i,
.duo-live-app-module__MKKcqW__progressItem.is-current i { background: #58cc02; }
.duo-live-app-module__MKKcqW__progressItem.is-done .duo-live-app-module__MKKcqW__progressNo {
  color: #fff;
  background: #58cc02;
  border-color: #58cc02;
}

/* FAQ 搜索过滤 */
.customer-preview-module__BO1pxW__questions details[hidden] { display: none !important; }

/* SUPER/MAX 彩色会员图标（对齐原站 duo-membership-mark-module） */
.duo-membership-mark-module__kG2ZZW__mark {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 96px;
  height: 38px;
  display: inline-flex;
}
.duo-membership-mark-module__kG2ZZW__mark img {
  object-fit: contain;
  width: 100%;
  height: 100%;
  display: block;
}

/* 弹窗（教程 / 帮助）— 尺寸对齐 duolingool 原站 */
.customer-preview-module__BO1pxW__tutorialDialog {
  border: 1px solid #dce6d3;
  border-radius: 22px;
  padding: 0;
  width: min(1000px, 100vw - 40px);
  max-width: none;
  height: min(900px, 100dvh - 40px);
  max-height: calc(100dvh - 40px);
  margin: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #fff;
  color: #4b4b4b;
  box-shadow: 0 24px 100px #1c361f38;
}
/* 教程目录（原站 document-toc-module） */
.document-toc-module__whCFFG__toc {
  scrollbar-width: thin;
  overscroll-behavior: contain;
  min-width: 0;
}
.document-toc-module__whCFFG__toc a[aria-current='location'] {
  color: #24623e;
  background: #e8f0e4;
  font-weight: 700;
  box-shadow: inset 3px 0 #39864d;
}
.document-toc-module__whCFFG__toc a[aria-current='location'] > span { color: inherit; }
@media print {
  .document-toc-module__whCFFG__toc { display: none; }
}
.customer-preview-module__BO1pxW__tutorialDialog::backdrop {
  background: rgba(23, 24, 21, .45);
  backdrop-filter: blur(3px);
}
.owlDialog {
  padding: 26px 28px 28px;
  font-family: 'Duolingo Sans Local', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
.owlDialog h3 {
  margin: 0 0 6px;
  font-size: 19px;
  font-weight: 800;
  color: #171815;
}
.owlDialog .owlDialogSub {
  margin: 0 0 18px;
  color: #777970;
  font-size: 13px;
}
.owlDialog ol, .owlDialog ul {
  margin: 0 0 18px;
  padding-left: 20px;
  color: #4b4b4b;
  font-size: 14px;
  line-height: 1.75;
}
.owlDialog code {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 1px 6px;
  font-size: 12px;
}
.owlDialog .owlDialogNote {
  background: #f1fbe9;
  border: 1px solid #b7e89e;
  border-left: 4px solid #58cc02;
  border-radius: 12px;
  padding: 11px 13px;
  font-size: 12px;
  color: #4b4b4b;
  line-height: 1.6;
}
.owlDialogClose {
  display: block;
  margin: 0 auto;
  cursor: pointer;
  background: #f0fbe9;
  border: 0;
  color: #46a302;
  border-radius: 999px;
  padding: 8px 18px;
  font-size: 14px;
  font-weight: 800;
}

/* ==========================================================================
   二、后台控制台（与前台同一套视觉语言）
   ========================================================================== */
.owlAdmin {
  --admin-bg: #f5f5f0;
  --admin-surface: #fff;
  --admin-ink: #171815;
  --admin-muted: #777970;
  --admin-rule: #dedfd8;
  --admin-green: #58cc02;
  --admin-green-dark: #46a302;
  min-height: 100dvh;
  background: var(--admin-bg);
  color: var(--admin-ink);
  font-family: 'Duolingo Sans Local', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
.owlAdmin * { box-sizing: border-box; }

.owlAdminBar {
  background: var(--admin-surface);
  border-bottom: 1px solid var(--admin-rule);
  position: sticky;
  top: 0;
  z-index: 20;
}
.owlAdminBarInner {
  width: min(1120px, 100% - 40px);
  margin: 0 auto;
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.owlAdminBrand {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--admin-ink);
  font-weight: 800;
}
.owlAdminBrand img { width: 34px; height: 34px; border-radius: 9px; }
.owlAdminBrand span { display: block; }
.owlAdminBrand small {
  display: block;
  color: var(--admin-muted);
  font-weight: 500;
  font-size: 12px;
}
.owlAdminNav { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.owlAdminNav a {
  color: var(--admin-muted);
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 10px;
}
.owlAdminNav a:hover, .owlAdminNav a.is-active {
  color: var(--admin-green-dark);
  background: #f0fbe9;
}
.owlAdminTokenBtn {
  color: var(--admin-muted);
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px dashed #c9d9c2;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
}
.owlAdminTokenBtn:hover {
  color: var(--admin-green-dark);
  background: #f0fbe9;
  border-style: solid;
}

/* 当前登录用户徽标 */
.owlAdminUser {
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 10px;
  background: #f0fbe9;
  color: var(--admin-green-dark);
  border: 1px solid #c9e5bd;
}

/* ══════════════ 登录遮罩层 ══════════════ */
.owlLoginOverlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(28, 40, 24, 0.42);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: owlLoginFade 0.18s ease-out;
}
.owlLoginOverlay[hidden] { display: none; }

@keyframes owlLoginFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes owlLoginRise {
  from { opacity: 0; transform: translateY(14px) scale(0.985); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.owlLoginCard {
  width: min(400px, 100%);
  background: #fff;
  border-radius: 20px;
  padding: 34px 30px 26px;
  box-shadow: 0 24px 60px rgba(20, 34, 16, 0.22);
  text-align: center;
  animation: owlLoginRise 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

.owlLoginIcon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  margin-bottom: 12px;
  object-fit: contain;
}

.owlLoginTitle {
  margin: 0 0 4px;
  font-size: 21px;
  font-weight: 800;
  color: #24331e;
  letter-spacing: -0.2px;
}

.owlLoginLead {
  margin: 0 0 22px;
  font-size: 13.5px;
  color: #7a8a72;
}

.owlLoginField {
  display: block;
  text-align: left;
  margin-bottom: 14px;
}
.owlLoginField > span {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  color: #5c6b55;
  margin-bottom: 6px;
}
.owlLoginField input {
  width: 100%;
  box-sizing: border-box;
  padding: 11px 14px;
  font-size: 15px;
  font-family: inherit;
  color: #24331e;
  background: #f7f9f5;
  border: 1.5px solid #dfe7d9;
  border-radius: 11px;
  outline: none;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
.owlLoginField input:focus {
  border-color: #58cc02;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(88, 204, 2, 0.14);
}
.owlLoginField input::placeholder { color: #a8b5a2; }

.owlLoginError {
  margin: 0 0 14px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 600;
  color: #b3261e;
  background: #fdecea;
  border: 1px solid #f5c6c2;
  border-radius: 9px;
  text-align: left;
}
.owlLoginError[hidden] { display: none; }

.owlLoginBtn {
  width: 100%;
  padding: 12px 16px;
  font-size: 15px;
  font-weight: 800;
  font-family: inherit;
  color: #fff;
  background: #58cc02;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: background 0.15s, transform 0.08s, box-shadow 0.15s;
  box-shadow: 0 2px 0 #4aa802;
}
.owlLoginBtn:hover:not(:disabled) { background: #63d915; }
.owlLoginBtn:active:not(:disabled) { transform: translateY(1px); box-shadow: 0 1px 0 #4aa802; }
.owlLoginBtn:disabled { opacity: 0.6; cursor: not-allowed; }

.owlLoginTip {
  margin: 14px 0 0;
  font-size: 12px;
  color: #9aa897;
}

.owlAdminWrap {
  width: min(1120px, 100% - 40px);
  margin: 0 auto;
  padding: 30px 0 60px;
}
.owlAdminTitle { margin: 0 0 4px; font-size: 26px; font-weight: 800; }
.owlAdminLead { margin: 0 0 24px; color: var(--admin-muted); font-size: 14px; }

.owlAdminGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-bottom: 26px;
}
.owlStat {
  background: var(--admin-surface);
  border: 1px solid var(--admin-rule);
  border-radius: 16px;
  padding: 16px 18px;
}
.owlStatLabel { color: var(--admin-muted); font-size: 12px; font-weight: 700; }
.owlStatValue { font-size: 26px; font-weight: 800; margin-top: 4px; line-height: 1.1; }
.owlStatFoot { color: var(--admin-muted); font-size: 11px; margin-top: 6px; }
.owlStatValue.is-green { color: var(--admin-green-dark); }
.owlStatValue.is-amber { color: #a67c00; }
.owlStatValue.is-red { color: #d93030; }

.owlPanel {
  background: var(--admin-surface);
  border: 1px solid var(--admin-rule);
  border-radius: 18px;
  overflow: hidden;
  margin-bottom: 22px;
  box-shadow: 0 8px 24px rgba(75, 75, 75, .07);
}
.owlPanelHead {
  border-bottom: 1px solid var(--admin-rule);
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.owlPanelHead h2 { margin: 0; font-size: 16px; font-weight: 800; }
.owlPanelBody { padding: 20px; }

.owlFormRow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
  align-items: end;
}
.owlField label {
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: #4b4b4b;
  margin-bottom: 6px;
}
.owlField input, .owlField select {
  width: 100%;
  height: 44px;
  border: 2px solid #e5e5e5;
  background: #f7f7f7;
  border-radius: 14px;
  padding: 0 13px;
  font: inherit;
  font-size: 14px;
  color: #4b4b4b;
  outline: 0;
}
.owlField input:focus, .owlField select:focus {
  border-color: var(--admin-green);
  background: #fff;
}

.owlBtn {
  cursor: pointer;
  border: 0;
  border-radius: 14px;
  height: 44px;
  padding: 0 18px;
  font-size: 14px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--admin-green);
  color: #fff;
  box-shadow: inset 0 -3px var(--admin-green-dark);
  text-decoration: none;
}
.owlBtn:hover { filter: brightness(.97); }
.owlBtn:disabled { opacity: .55; cursor: wait; }
.owlBtnGhost {
  background: #f0fbe9;
  color: var(--admin-green-dark);
  box-shadow: none;
  border: 1px solid #b7e89e;
}
.owlBtnPlain {
  background: #f7f7f7;
  color: #4b4b4b;
  box-shadow: none;
  border: 1px solid #e5e5e5;
  height: 36px;
  padding: 0 13px;
  font-size: 12px;
  border-radius: 10px;
}

.owlTable { width: 100%; border-collapse: collapse; font-size: 13px; }
.owlTable th {
  text-align: left;
  color: var(--admin-muted);
  font-size: 11px;
  font-weight: 800;
  padding: 10px 14px;
  border-bottom: 1px solid var(--admin-rule);
  white-space: nowrap;
}
.owlTable td {
  padding: 11px 14px;
  border-bottom: 1px solid #f0f0f0;
  vertical-align: middle;
}
.owlTable tr:last-child td { border-bottom: 0; }
.owlTable code {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 12px;
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 2px 7px;
}
.owlPill {
  display: inline-block;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 10px;
  font-weight: 800;
}
.owlPillUnused { background: #f1fbe9; color: #46a302; border: 1px solid #b7e89e; }
.owlPillClaimed { background: #edf2f8; color: #456e9e; border: 1px solid #c6d6e6; }
.owlPillFailed { background: #fdeeee; color: #d93030; border: 1px solid #f5c2c2; }
.owlPillPending { background: #fff8ce; color: #a67c00; border: 1px solid #ffe28a; }

.owlCopy {
  background: #f1fbe9;
  border: 1px solid #b7e89e;
  border-left: 4px solid var(--admin-green);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.7;
  margin-top: 14px;
}
.owlCopy ul { margin: 6px 0 0; padding-left: 18px; }
.owlCodeList {
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 12px;
  max-height: 220px;
  overflow: auto;
}
.owlCodeList li { padding: 4px 0; border-bottom: 1px dashed #dff0d3; }
.owlCodeList button {
  background: none;
  border: 0;
  cursor: pointer;
  color: #46a302;
  font: inherit;
  padding: 0;
  text-decoration: underline;
}
.owlEmpty { color: var(--admin-muted); font-size: 13px; padding: 26px 0; text-align: center; }

.owlLog {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 12px;
  background: #1f2b1c;
  color: #d7f5c6;
  border-radius: 12px;
  padding: 14px;
  max-height: 300px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-all;
  line-height: 1.7;
}

@media (max-width: 640px) {
  .owlAdminWrap, .owlAdminBarInner { width: calc(100% - 28px); }
  .owlAdminTitle { font-size: 21px; }
  .owlTable { font-size: 12px; }
}