/* app-kit.css —— 银川藏宝图·国潮主题补充样式
配合 index.html 里的中国风改造使用。
在 index.html 里 即可用 */
/* ===== 国潮·中国风补充组件 ===== */
/* 祥云装饰背景 */
.cloud-bg{position:relative;overflow:hidden}
.cloud-bg::before{content:'☁️';position:absolute;left:-10px;top:-10px;font-size:48px;opacity:.1;transform:rotate(-10deg)}
.cloud-bg::after{content:'☁️';position:absolute;right:-10px;bottom:-10px;font-size:36px;opacity:.08;transform:rotate(15deg)}
/* 印章按钮 */
.seal-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px 18px;
border:2px solid #c0392b;border-radius:4px;background:transparent;color:#c0392b;
font-family:"KaiTi","STKaiti","楷体",serif;font-weight:800;font-size:14px;
cursor:pointer;transition:all .15s;text-decoration:none}
.seal-btn:hover,.seal-btn:active{background:#c0392b;color:#f5e6b8}
/* 朱砂按钮 */
.cinnabar-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;
border:1px solid #a52a2a;border-radius:4px;background:linear-gradient(135deg,#c0392b,#a52a2a);
color:#f5e6b8;font-family:"KaiTi","STKaiti","楷体",serif;font-weight:800;font-size:15px;
cursor:pointer;transition:all .15s;box-shadow:0 2px 6px rgba(160,40,30,.25)}
.cinnabar-btn:active{transform:scale(.97);opacity:.9}
/* 宣纸卡片 */
.paper-card{background:rgba(255,248,235,.92);border:1px solid #d4c8a8;border-radius:4px;
padding:16px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
/* 金框卡片 */
.gold-card{background:rgba(255,248,235,.92);border:2px solid #c9a24b;border-radius:4px;
padding:16px;box-shadow:0 2px 8px rgba(0,0,0,.08)}
/* 红木分割线 */
.divider-red{height:1px;background:linear-gradient(90deg,transparent,#c0392b,transparent);margin:12px 0;border:0}
/* 金色分割线 */
.divider-gold{height:1px;background:linear-gradient(90deg,transparent,#c9a24b,transparent);margin:12px 0;border:0}
/* 古风标题装饰 */
.classic-title{font-family:"KaiTi","STKaiti","楷体",serif;font-weight:800;color:#5d3a1a;
border-left:4px solid #c0392b;padding-left:12px;margin-bottom:12px}
/* 水墨装饰条 */
.ink-bar{height:3px;background:linear-gradient(90deg,#2b1a0e,transparent);border-radius:2px;margin:8px 0}
/* 灯笼风格徽章 */
.lantern-badge{display:inline-flex;align-items:center;justify-content:center;
min-width:22px;height:22px;padding:0 8px;border-radius:11px 11px 8px 8px;
background:linear-gradient(180deg,#c0392b,#8b1a1a);color:#f5e6b8;
font-size:11px;font-weight:800;box-shadow:0 1px 3px rgba(0,0,0,.15)}
/* 中国风 Toast */
.toast-guochao{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(20px);
background:#8b1a1a;color:#f5e6b8;padding:10px 18px;border-radius:4px;
font-size:13px;font-weight:700;opacity:0;transition:all .25s;
pointer-events:none;z-index:60;max-width:86%;border:1px solid #c9a24b;
font-family:"KaiTi","STKaiti","楷体",serif}
.toast-guochao.show{opacity:1;transform:translateX(-50%) translateY(0)}
/* 中国风弹层 */
.modal-guochao{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
width:86%;max-width:320px;background:#fbf6ea;border-radius:8px;
padding:22px 18px 14px;z-index:51;text-align:center;
border:2px solid #c9a24b;box-shadow:0 12px 40px rgba(43,26,14,.25)}
/* 古风列表项 */
.list-guochao{list-style:none;margin:0;padding:0}
.list-guochao li{display:flex;align-items:center;gap:12px;padding:14px 0;
border-bottom:1px dashed #d4c8a8}
.list-guochao li:last-child{border-bottom:0}
/* 水墨渐变背景 */
.ink-bg{background:linear-gradient(170deg,#f8f1e2,#f4ecdd,#ece1cb)}
/* 红金渐变背景 */
.redgold-bg{background:linear-gradient(135deg,#8b1a1a,#a52a2a)}
/* 中国风输入框 */
.input-guochao{width:100%;padding:12px 14px;border:2px solid #d4c8a8;border-radius:4px;
font:inherit;font-size:16px;outline:none;transition:border-color .2s;
background:rgba(255,255,255,.8);box-sizing:border-box}
.input-guochao:focus{border-color:#c9a24b}
/* 古风标题页眉 */
.page-header{font-size:22px;font-weight:800;margin-bottom:8px;color:#5d3a1a;
border-left:4px solid #c0392b;padding-left:10px;
font-family:"KaiTi","STKaiti","楷体",serif}
/* ===== 4 个新主题内联定义（确保点击生效） ===== */
.ak-theme-ocean{--ak-bg-deep:#d4e5f7;--ak-bg:#e3f0fa;--ak-surface:#eef6fc;--ak-card:#ffffff;--ak-card-2:#e3f0fa;--ak-text:#1a3a5c;--ak-text-2:#3d6a8e;--ak-muted:#7a9fbe;--ak-primary:#1a7fc4;--ak-primary-2:#5bb5e8;--ak-on-primary:#ffffff;--ak-primary-soft:rgba(26,127,196,.14);--ak-border:rgba(26,58,92,.10);--ak-divider:rgba(26,58,92,.08);--ak-track:rgba(26,58,92,.06);--ak-track-strong:rgba(26,58,92,.18);--ak-header-bg:rgba(227,240,250,.82);--ak-tabbar-bg:rgba(255,255,255,.92);--ak-radius:14px;--ak-r-3:14px;--ak-elev-1:0 2px 8px rgba(26,127,196,.12);--ak-elev-2:0 8px 22px rgba(26,127,196,.14);--ak-elev-3:0 16px 40px rgba(26,127,196,.18);--ak-primary-shadow:0 8px 20px rgba(26,127,196,.26);}
.ak-theme-sunset{--ak-bg-deep:#fde8d0;--ak-bg:#fef0e0;--ak-surface:#fff6ea;--ak-card:#ffffff;--ak-card-2:#fef0e0;--ak-text:#5a3a22;--ak-text-2:#8a6040;--ak-muted:#b89070;--ak-primary:#e07c3c;--ak-primary-2:#f5b86e;--ak-on-primary:#5a2a10;--ak-primary-soft:rgba(224,124,60,.16);--ak-border:rgba(90,58,34,.10);--ak-divider:rgba(90,58,34,.08);--ak-track:rgba(90,58,34,.06);--ak-track-strong:rgba(90,58,34,.18);--ak-header-bg:rgba(254,240,224,.82);--ak-tabbar-bg:rgba(255,255,255,.92);--ak-radius:16px;--ak-r-3:16px;--ak-elev-1:0 2px 8px rgba(224,124,60,.12);--ak-elev-2:0 8px 22px rgba(224,124,60,.14);--ak-elev-3:0 16px 40px rgba(224,124,60,.18);--ak-primary-shadow:0 8px 20px rgba(224,124,60,.26);}
.ak-theme-lavender{--ak-bg-deep:#ede0f5;--ak-bg:#f5ecfa;--ak-surface:#faf4fd;--ak-card:#ffffff;--ak-card-2:#f5ecfa;--ak-text:#3d2a5a;--ak-text-2:#6a4e8a;--ak-muted:#9a7eb5;--ak-primary:#8b5cf6;--ak-primary-2:#c084fc;--ak-on-primary:#ffffff;--ak-primary-soft:rgba(139,92,246,.14);--ak-border:rgba(61,42,90,.10);--ak-divider:rgba(61,42,90,.08);--ak-track:rgba(61,42,90,.06);--ak-track-strong:rgba(61,42,90,.18);--ak-header-bg:rgba(245,236,250,.82);--ak-tabbar-bg:rgba(255,255,255,.92);--ak-radius:16px;--ak-r-3:16px;--ak-elev-1:0 2px 8px rgba(139,92,246,.12);--ak-elev-2:0 8px 22px rgba(139,92,246,.14);--ak-elev-3:0 16px 40px rgba(139,92,246,.18);--ak-primary-shadow:0 8px 20px rgba(139,92,246,.26);}
.ak-theme-watermelon{--ak-bg-deep:#f0e0d8;--ak-bg:#f8ece6;--ak-surface:#fcf3ee;--ak-card:#ffffff;--ak-card-2:#f8ece6;--ak-text:#4a2a2a;--ak-text-2:#7a4e4e;--ak-muted:#b08080;--ak-primary:#e85a5a;--ak-primary-2:#7bc47f;--ak-on-primary:#ffffff;--ak-primary-soft:rgba(232,90,90,.14);--ak-border:rgba(74,42,42,.10);--ak-divider:rgba(74,42,42,.08);--ak-track:rgba(74,42,42,.06);--ak-track-strong:rgba(74,42,42,.18);--ak-header-bg:rgba(248,236,230,.82);--ak-tabbar-bg:rgba(255,255,255,.92);--ak-radius:18px;--ak-r-3:18px;--ak-elev-1:0 2px 8px rgba(232,90,90,.12);--ak-elev-2:0 8px 22px rgba(232,90,90,.14);--ak-elev-3:0 16px 40px rgba(232,90,90,.18);--ak-primary-shadow:0 8px 20px rgba(232,90,90,.26);}