* {
    padding: 0;
    margin: 0;
    border: 0;
}
:root{
    --c-primary : #3BA1F7;
    --c-primary-dark : #2b7cd1;
    --c-success : #16bb16;
    --c-danger : #e63946;
    /*黑金主题点缀*/
    --c-gold : #FFD659;
    --c-gold-dark : #b69632;
    /*深色背景体系*/
    --bg-1 : #1A202C; /*右侧主面板*/
    --bg-2 : #222a37; /*左侧面板 */
    --bg-3 : #2b3344; /*卡片*/
    --bg-input : #0f131b; /* 输入框 */
    --fc-base : #EEE;
    --fc-sub : #9aa4b1;
    --card-bg-1:#3e5678;     /* 左上 */
    --card-bg-2:#4d6a95;     /* 右下 */
    --card-glow:#62b6ff;     /* Hover 边框/阴影 */
}
html {
    width: 100%;
    height: 100%;
    min-width: 600px;
}

body {
    min-width: 600px;
}

.larryms-page-login {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100%;
    min-width: 768px;
    margin: 0 auto;
    background: url(../images/login.svg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-attachment: fixed;
    overflow-y: auto;
}

.larryms-page-login .layui-container {
    padding-top: 50px
}

.login-container .top-info {
    display: block;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 40px;
}

.login-container .top-info img {
    display: block;
    width: auto;
    height: 50px;
    margin: 0 auto;
}

.login-register-content {
    display: block;
    width: 460px;
    height: 445px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 5px 10px 35px 0 rgba(180, 190, 215, 0.50);
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
}

.larryms-page-form {
    width: 350px;
    height: auto;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 35px 0 15px 0;
}

.san-code {
    display: block;
    width: 80px;
    height: 80px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}

.san-code img {
    display: block;
    width: 100%;
    height: 100%;
}

.larryms-page-form h2 {
    font-size: 24px;
    color: #000;
    padding-bottom: 20px;
    font-weight: normal;
    text-align: center;
    line-height: 50px;
}

.larryms-isee-form .layui-form-item {
    height: 46px;
    line-height: 46px;
    margin-bottom: 20px;
}

.larryms-isee-form .layui-input {
    width: 100%;
    height: 46px;
    line-height: 46px;
}

.larryms-code-input {
    margin-bottom: 0 !important;
}

.larryms-code-img {
    width: 145px;
    height: 46px;
    float: right;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    cursor: pointer;
}

.larryms-code-img img {
    display: block;
    width: 100%;
    height: 100%;
}

.larryms-code-button {
    width: 145px;
    height: 46px;
    float: right;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    cursor: pointer;
}

.larryms-code-button .layui-btn {
    width: 145px;
    height: 46px;
    line-height: 46px;
    background: #FF6D00;
    color: #fff;
}

.larryms-isee-form-button {
    margin-bottom: 8px !important;
}

.larryms-isee-form-button .layui-btn {
    display: block;
    background: #364153;
    height: 46px;
    line-height: 46px;
    font-size: 16px;
    letter-spacing: 2px;
}

.checkboxLabel {
    font-size: 12px;
    line-height: 14px;
    color: #AAA;
}

.checkboxLabel a {
    color: #FF6D00;
}

.larryms-bottom-container {
    box-sizing: border-box;
    white-space: nowrap;
    display: flex;
    justify-content: space-between; /* 左右两端对齐 */
    align-items: center; /* 垂直居中对齐 */
    margin-top: 20px;
}

.larryms-bottom-container a {
    color: #364153;
    text-decoration: none;
    font-size: 16px;
}

.larryms-bottom-container .login-type-switch a {
    color: #364153;
}

.larryms-bottom-container .login-type-switch a:hover {
    color: #FF6D00;
}

.larryms-bottom-container .register-link a {
    color: #36BAFB;
}

.larryms-bottom-container .register-link a:hover {
    text-decoration: underline;
}

.login-type-box .layui-form-item .layui-input {
    text-indent: 20px;
}

.login-type-box .layui-form-item i.layui-icon {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 30px;
    height: 46px;
    line-height: 46px;
    text-align: center;
    color: #889AA4;
}


.friendLink {
    margin-top: 50px;
    text-align: center;
    padding-bottom: 50px;
}

.friendLink span {
    width: 80px;
    display: inline-block;
    font-size: 12px;
    color: #5E6A92;
    letter-spacing: 1.2px;
    text-align: center;
    margin: 40px 18px;
}

.friendLink span > img {
    display: block;
    width: 100%;
    height: auto;
}

.copyright {
    position: absolute;
    bottom: 10px;
    text-align: center;
    width: 100%;
    opacity: 0.5;
    font-size: 15px;
    color: #5E6A92;
    letter-spacing: 1.5px;
}

.copyright p.info {
    line-height: 24px;
}

.larryms-page-protocol {
    background: #F5F5F5;
}

.larryms-page-protocol header {
    background: #fff;
    box-shadow: 1px 3px 6px #c8c8c8;
    height: 80px;
    border-bottom: 1px solid #e8e8e8;
    box-sizing: border-box;
    padding: 15px 0;
    margin-bottom: 20px;
}

.larryms-page-protocol header .logo {
    width: 80px;
    height: 40px;
}

.larryms-page-protocol header .logo img {
    display: block;
    height: 100%;
}

.big_title {
    padding: 25px 50px 10px 50px;
}

.cssWordBox {
    padding: 20px 50px;
}

.content-card {
    margin-bottom: 50px;
}

.cssWordBox h2 {
    width: 990px;
    color: #1b1b1b;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    margin-bottom: 20px;
    display: block;
}

.cssWordBox p {
    display: block;
    width: 990px;
    color: #1b1b1b;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 15px;
    word-spacing: 10px;
}

.cssWordBox i {
    font-style: normal;
}

.cssWordBox .cssHasUnderline {
    text-decoration: underline
}

.cssWordBox .cssHasBold {
    font-weight: bold;
    color: rgb(102, 102, 102);
}

.larryms-page-protocol footer {
    background: #fff;
    box-sizing: border-box;
    padding: 30px 0 10px 0;
    border-top: 1px solid #f1f1f1;
    text-align: center;
    color: #333;
}

/*首页*/
.larryms-page {
    height: 100vh;
    background: #2d3644;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}

.larryms-page .layui-fluid {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    position: relative;
}

.larryms-student-nav {
    display: inline-block;
    vertical-align: top;
    width: 220px;
    border-right: 1px solid #656D7B;
    height: 100%;
    box-sizing: border-box;
    padding: 0;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
}
.larryms-student-nav.chat-service{
    width: 90px;
}
.larryms-student-nav .logo {
    display: block;
    width: 100%;
    height: 100px;
    box-sizing: border-box;
    padding: 30px 20px 15px 20px;
    text-align: center;
}

.larryms-student-nav .logo img {
    display: inline-block;
    vertical-align: top;
    width: 80px;
}

.nav-menu-container {
    box-sizing: border-box;
    padding: 15px 20px 0 20px;
    height: auto;
    width: 100%;
}

.larryms-student-nav .menu-item {
    height: 46px;
    line-height: 46px;
    color: #d8d8d8;
    cursor: pointer;
    padding-left: 20px;
    margin-bottom: 15px;
    border-radius: 12px;
}

.larryms-student-nav .menu-item i.larry-icon {
    font-size: 18px;
    color: #d8d8d8;
    padding-right: 5px;
}

.larryms-student-nav .menu-item span.menu-item-title {
    color: #d8d8d8;
    line-height: 46px;
    font-size: 15px;
}

.larryms-student-nav .menu-item:hover {
    background: #222a37;
}

.larryms-student-nav .menu-item a {
    display: block;
    width: 100%;
    height: 100%;
}

.larryms-student-nav .menu-item.larryms-on-active {
    border: 2px solid #3F85A7;
    background: #29364a;
}

.larryms-student-nav .menu-item.larryms-on-active i.larry-icon,
.larryms-student-nav .menu-item.larryms-on-active span.menu-item-title {
    color: #49C0F8;
}

.larryms-student-container {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 225px);
    margin: 0;
    margin-left: 220px;
    box-sizing: border-box;
}
.larryms-student-container.chat-service{
    width: calc(100% - 90px);
    margin-left: 90px;
}
.larryms-student-container .larryms-student-content {
    box-sizing: border-box;
    padding: 20px 25px;
    position: relative;
}

.nav-bottom-menu {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    padding: 15px 20px;
    color: #d8d8d8;
}

.page-content {
    box-sizing: border-box;
}

.larryms-student-header {
    display: flex;
    box-sizing: border-box;
    justify-content: space-between; /* 两端对齐 */
    align-items: center; /* 垂直居中 */
    padding: 0;
    margin-bottom: 15px;
    color: #FFFFFF; /* 根据需要调整文本色 */
}

.larryms-student-header .page-title {
    flex: 1; /* 占据可用空间 */
}

.larryms-student-header .page-title h1 {
    font-size: 22px;
    color: #FFFFFF;
    padding-bottom: 5px;
    font-weight: normal;
}

.larryms-student-header .page-right {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between; /* 两端对齐 */
}

.larryms-student-header > div {
    display: inline-block;
    vertical-align: top;
}

.larryms-student-header .shopping-cart {
    display: inline-block;
    vertical-align: top;
    min-width: 80px;
    background: #1A202C;
    color: #fff;
    height: 44px;
    padding: 0 15px;
    font-size: 15px;
    line-height: 44px;
    border-radius: 6px;
}

.larryms-student-header .shopping-cart span {
    padding-left: 3px;
}

.larryms-student-header .user-info {
    padding: 0 10px;
    white-space: nowrap;
    text-align: right;
    min-width: 100px;
}

.larryms-student-header .user-info > * {
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}

.user-info .img-photo {
    width: 42px;
    height: 42px;
    box-sizing: border-box;
    border-radius: 50%;
    overflow: hidden;
}

.user-info .img-photo img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.user-info span.student-name {
    color: #b8b8b8;
    font-size: 16px;
    line-height: 42px;
    padding-left: 6px;
}

.user-info span.larryms-is-vip .larry-icon {
    color: #24D271;
    font-weight: normal;
    font-size: 38px !important;
    line-height: 38px;
}

.larryms-btn-dropdown {
    background: #1A202C;
    color: #9A9AA9;
}

.larryms-student-hom-dropdown {
    background: #1A202C;
    border-color: #1A202C;
    color: #FFFFFF;
    border-radius: 6px;
}

.larryms-student-hom-dropdown .layui-panel {
    background: #1A202C;
    border-color: #1A202C;
    border-radius: 6px;
}

.larryms-student-hom-dropdown .layui-menu {
    background: #1A202C;
    border-color: #1A202C;
    border-radius: 6px;
}

.larryms-student-hom-dropdown .layui-menu-body-title {
    color: #FFFFFF;
}

.larryms-student-hom-dropdown .layui-menu li:hover {
    background: #29364A;
    border-radius: 4px;
}


.larryms-student-learning {


}


.learning-container {
    background: linear-gradient(to right, rgba(58, 70, 91, 0.45), rgba(65, 81, 107, 0.65), rgba(68, 86, 115, 0.85));
    border-radius: 8px;
}

.learning-container .empty-box {
    padding: 20px 0 30px 0;
    text-align: center;
}

.learning-container .empty-box img {
    display: block;
    width: 230px;
    height: 230px;
    margin: 0 auto;
    margin-bottom: 20px;
}

.learning-container .empty-box p {
    display: block;
    text-align: center;
    color: #bbb;
    line-height: 32px;
    font-size: 16px;
}



/* === 智能学习路径 · 卡片盒 === */
.lp-card-box{
    display:flex;
    flex-direction:column;
    gap:18px;           /* 卡片之间垂直间距 */
    margin:26px 0;
}

/* === 单张卡片 === */
.lp-card{
    position:relative;
    background:#2b3344;
    border-radius:12px;
    padding:16px 18px;
    box-shadow:0 4px 16px rgba(0,0,0,.35);
    transition:.22s;
}
.lp-card:hover{
    box-shadow:0 8px 26px rgba(0,0,0,.55);
    transform:translateY(-2px);
}
.lp-card.open{box-shadow:0 10px 30px rgba(0,0,0,.6);}     /* 展开时再加深 */

/* === 头部行 === */
.lp-header{
    display:flex;
    align-items:center;
    gap:10px;
    cursor:pointer;
    font-weight:600;
}
.phase{color:#49C0F8;font-size:14px;white-space:nowrap;}
.course-name{
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    font-size:16px;color:#fff;
}

/* 进度条 */
.prog-wrap{flex:1;height:6px;background:#3d485d;border-radius:3px;overflow:hidden}
.prog-bar{height:6px;background:#49C0F8}

/* 折叠箭头 */
.lp-header i{font-size:16px;color:#9aa4b1;transition:.2s;margin-left:auto;}
.lp-header i:hover{color:#fff}

/* === Meta === */
.lp-meta{
    color:#9aa4b1;font-size:13px;margin:6px 0 4px;line-height:22px;
}
.lp-targets{font-size:13px;color:#cfd4e1;margin-bottom:6px;}
.sec-tag{
    display:inline-block;
    background:#3c4a63;color:#49C0F8;
    padding:2px 6px;border-radius:4px;margin-right:4px;margin-bottom:2px;
}

/* === 底部按钮 === */
.lp-footer{margin-top:4px}
.lp-footer .layui-btn-sm{
    height:30px;line-height:30px;font-size:13px;padding:0 16px;border-radius:6px;
}


/* 小节状态色 */
.sec-todo   {background:#fff5cc;color:#f0a202;}
.sec-review {background:#ffe6d1;color:#e69500;}
.sec-future {background:#3d485d;color:#bbb;}

/* ☆可选：手机缩放 */
@media(max-width:768px){
    .lp-card{padding:12px 14px;}
    .lp-header .course-name{max-width:120px;}
}
/* ---- learning-container 背景切换 ---- */
.learning-container.path-empty{
    background: linear-gradient(to right,
    rgba(58,70,91,.45),rgba(65,81,107,.65),rgba(68,86,115,.85));
}
.learning-container.path-has{
    background:transparent;
}

/* ---- 标题装饰 ---- */
.smart-path-list h3{
    color:#fff;
    font-size:20px;
    font-weight:600;
    margin:0 0 18px 6px;
    position:relative;
}
.smart-path-list h3::before{
    content:'';
    position:absolute;
    left:-4px;top:50%;transform:translateY(-50%);
    width:4px;height:22px;
    background:#49C0F8;border-radius:2px;
}

/* ---- 卡片总体调整 ---- */
.lp-card-box{display:flex;flex-direction:column;gap:30px;}

/* 卡片本体放大、间距增大、投影柔和 */
.lp-card{
    background:linear-gradient(135deg,#33405a 80%,#29364a 100%);
    border-radius:16px;
    padding:22px 28px 18px;
    box-shadow:0 6px 24px rgba(0,0,0,.55);
    border:2px solid #38445c;
    transition:.22s;
}
.lp-card:hover{
    transform:translateY(-2px) scale(1.01);
    box-shadow:0 10px 30px rgba(0,0,0,.6);
    border-color:#49C0F8;
}

/* header 行高加大 */
.lp-header{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.lp-header .phase{font-size:15px;color:#FFD659;}
.course-name{font-size:18px;font-weight:600;}

/* 进度条加高 */
.prog-wrap{flex:1;max-width:40%;height:8px;background:#424e63;border-radius:4px;overflow:hidden}
.prog-bar{background:#49C0F8;height:100%;}

/* meta & targets 行距增加 */
.lp-meta,.lp-targets{font-size:14px;color:#c0c7d8;margin-bottom:10px;line-height:24px}

/* footer 按钮统一宽度 */
.lp-footer .layui-btn{min-width:90px;font-size:13px}

/* 折叠区蛇形点间距 */
.lp-sections{display:flex;flex-wrap:wrap;gap:10px;padding-top:14px}
.lp-sections li{padding:4px 10px;border-radius:14px;font-size:12px;}

/* 试听/复习/未来配色 */
.sec-todo   {background:#fff0ba;color:#b97c07}
.sec-review {background:#ffd9c3;color:#cf6a00}
.sec-future {background:#3d485d;color:#bcc4d6}

/* 展开箭头位置微调 */
.lp-header i.larry-icon{font-size:18px;color:#9aa4b1;margin-left:auto;}
.lp-header i:hover{color:#fff}

.lp-title-bar {
    background: #16b777;
    padding: 25px 20px 25px 10px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    margin-bottom: 18px;
}

.lp-title-bar .title{
    color:#fff;font-size:16px;font-weight:600;letter-spacing:1px;
    padding-left:6px;          /* 左边距 */
}
.lp-title-bar .toggle-btn{
    margin-left:auto;          /* 右对齐 */
    color:#fff;
    cursor:pointer;
    font-size: 16px;
}
.lp-title-bar .toggle-btn i{
    display: inline-block;
    vertical-align: top;
    font-size:24px;
    padding-right: 5px;
}
.lp-title-bar .toggle-btn span{
    vertical-align: top;
    line-height: 26px;
}
.lp-title-bar .toggle-btn:hover{color:#fff}
/*主内容区域考试卡片样式*/
.exam-type-list {
    margin-top: 25px;
    background: transparent;
    border-radius: 10px;
    padding: 0 0 20px 0;
}

.exam-type-list h4 {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    margin: 0 0 18px 8px;
    letter-spacing: 1px;
}

/* Grid布局：三列→两列→一列自适应，间距统一 */
.exam-type-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 默认三列均分 */
    gap: 22px 26px; /* 行22px，列26px */
}

@media (max-width: 1300px) {
    .exam-type-cards {
        grid-template-columns: repeat(2, 1fr); /* 两列均分 */
    }
}

@media (max-width: 768px) {
    .exam-type-cards {
        grid-template-columns: 1fr; /* 一列铺满 */
    }
}

/* 卡片本体 */
.exam-type-card {
    background: linear-gradient(135deg, #33405a 80%, #29364a 100%);
    border-radius: 12px;
    box-shadow: 0 2px 10px #222a37b8;
    display: flex;
    flex-direction: column;
    padding: 20px 28px 16px 28px;
    cursor: pointer;
    border: 2px solid #374158;
    transition: box-shadow .18s, border-color .18s, transform .15s;
    position: relative;
    min-height: 120px;
}

.exam-type-card:hover {
    box-shadow: 0 6px 24px #49c0f820, 0 2px 10px #222a37b8;
    border-color: #49c0f8;
    transform: translateY(-3px) scale(1.03);
}

/* 卡片内容三行结构 */
.exam-type-card-title {
    font-size: 18px;
    color: #49C0F8;
    font-weight: 600;
    margin-bottom: 20px;
    line-height: 1.2;
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
}

.exam-type-card-middle {
    font-size: 16px;
    color: #d2d2d2;
    text-align: center;
    margin-bottom: 18px;
    font-weight: 600;
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.exam-type-card-middle b {
    font-size: 22px;
    color: #fff;
    padding: 0 5px;
    font-weight: 700;
}

.exam-type-card-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
    color: #b8bdc9;
    margin-bottom: 0;
}

.exam-type-card-label {
    color: #b8bdc9;
    font-size: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
}

.exam-type-card-count {
    color: #FFD700;
    font-size: 14px;
    white-space: nowrap;
}

.exam-type-card-count b {
    color: #fff;
    margin: 0 2px;
    font-weight: 700;
}

/* 移动端适配：缩小padding和字号 */
@media (max-width: 768px) {
    .exam-type-card {
        padding: 14px 12px 10px 12px;
    }

    .exam-type-card-title {
        font-size: 17px;
    }

    .exam-type-card-middle {
        font-size: 14px;
    }

    .exam-type-card-middle b {
        font-size: 17px;
    }

    .exam-type-card-bottom {
        font-size: 13px;
    }

    .exam-type-card-label {
        font-size: 13px;
    }

    .exam-type-card-count {
        font-size: 12px;
    }
}

/* 极小屏幕阴影变淡 */
@media (max-width: 500px) {
    .exam-type-card {
        box-shadow: 0 1px 5px #222a37b8;
    }
}

/*右侧个人卡片信息*/
.larryms-student-card {
    border-radius: 14px;
    min-width: 320px;
    background: linear-gradient(128deg, #14171e 35%, #3e5471 100%);
    box-shadow: 0 2px 10px #0a0f12;
    padding: 16px 18px 12px 18px;
    margin-bottom: 18px;
    font-size: 15px;
}

/* 每层均分3项 */
.card-level {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 18px;
    border-radius: 8px;
    margin-bottom: 15px;
}

.card-level:last-child {
    margin-bottom: 10px;
}

/* 层一：签到 */
.card-sign {
    background: linear-gradient(90deg, #232c3a 60%, #2d3644 100%);
    font-size: 15px;
    justify-content: center;
    padding: 15px 18px 15px 18px;
    border-radius: 8px;
    margin-bottom: 15px;
}

.sign-inner {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 26px; /* 控制间隔大小 */
    width: 100%;
}

.sign-btn {
    min-width: 60px;
    font-size: 14px;
    padding: 2px 13px;
    height: 34px;
    line-height: 34px;
    border-radius: 8px;
    color: #fff;
    border: none;
    cursor: pointer;
}

.card-sign .already {
    color: #d8d8d8;
    border-color: #505e76;
    background: #505e76;
}

.sign-detail {
    color: #cfdbe7;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 2px;
}

.sign-detail b {
    color: #49C0F8;
    margin: 0 1px;
    font-weight: 700;
}



.exam-type-cards-right{display:flex;flex-direction:column;gap:14px}
.exam-type-card-right{
    border:1px solid #3e4960;background:#2f384d;
    border-radius:8px;padding:12px;color:#dce1ea;cursor:pointer;
}
.exam-type-card-right:hover{border-color:#49C0F8;box-shadow:0 0 6px rgba(73,192,248,.6)}
.exam-type-card-right .exam-title{font-size:16px;font-weight:600}
.exam-type-card-right .badge{background:#49C0F8;color:#fff;border-radius:8px;padding:0 6px;margin-left:6px}
.exam-type-card-right .exam-label{font-size:12px;color:#9aa4b1;margin-top:4px;display:block}
.exam-type-card-right .exam-count{font-size:12px;color:#9aa4b1}
.exam-type-list-right h4{
    font-size:16px;
    font-weight:600;
    color:#fff;
    margin-bottom:12px;
    background:#536995;
    padding:18px 14px;
    border-radius:12px;
}
/* 层二/三：资源/学业 */
.card-resource, .card-study {
    background: linear-gradient(90deg, #26415a 70%, #29364a 100%);
    color: #fff;
    font-size: 15px;
}

.card-resource span, .card-study span {
    flex: 1 1 0;
    min-width: 0;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 4px;
}

.card-resource i, .card-study i {
    font-size: 17px;
    color: #49C0F8;
    margin-right: 4px;
    vertical-align: middle;
}

.card-resource b, .card-study b {
    color: #FFD700;
    font-weight: bold;
    font-size: 16px;
    margin-left: 2px;
}

/* 层四/五：进度/其他，弱化色彩 */
.card-progress, .card-other {
    background: #212a3a;
    color: #b8bdc9;
    font-size: 14px;
}

.card-progress span, .card-other span {
    flex: 1 1 0;
    min-width: 0;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 2px;
}

.card-progress b, .card-other b {
    color: #49C0F8;
    font-weight: bold;
    font-size: 16px;
    margin-left: 5px;
}

/* 响应式缩放 */
@media (max-width: 1200px) {
    .larryms-student-card {
        min-width: 220px;
        padding: 10px 6px 10px 7px;
        font-size: 13px;
    }

    .card-level {
        font-size: 13px;
    }

    .sign-detail {
        font-size: 12px;
    }
}

/* 弹层整体内边距和背景 */
.exam-paper-dialog {
    padding: 28px 20px 22px 20px;
    /*background: #2D3644;*/
    background: linear-gradient(141deg, #171c25 30%, #30527d 55%, #452e7b 100%);
    border-radius: 14px;
    min-height: 320px;
    box-sizing: border-box;
}

/* 标题部分 */
.exam-paper-dialog .dialog-header {
    margin-bottom: 22px;
    padding-left: 2px;
    font-size: 20px;
    font-weight: bold;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.exam-paper-dialog .dialog-header b {
    color: #49C0F8;
    font-size: 22px;
    font-weight: 600;
}

.exam-paper-dialog .dialog-header span {
    color: #bbb;
    font-size: 16px;
    margin-left: 18px;
    font-weight: normal;
}

/* 列表区 */
.exam-paper-dialog .paper-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 30px;
    margin-bottom: 16px;
    min-height: 520px;
    max-height: 560px;
    overflow-y: auto;
    box-sizing: border-box;
    padding: 15px;
    align-items: flex-start;
    align-content: flex-start;
}

/* 卡片样式 */
.exam-paper-dialog .paper-card {
    background: linear-gradient(135deg, #33405a 80%, #29364a 100%);
    border-radius: 12px;
    box-shadow: 0 4px 18px #1e212344;
    padding: 18px 18px 14px 20px;
    width: calc(50% - 60px);
    min-width: 240px;
    max-height: 160px !important;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    transition: box-shadow .18s, border-color .18s, transform .15s;
    border: 2px solid #374158;
    cursor: pointer;
}

.exam-paper-dialog .paper-card:hover {
    box-shadow: 0 8px 32px #49c0f833, 0 4px 12px #222a37b8;
    border-color: #49c0f8;
    transform: translateY(-3px) scale(1.03);
    background: linear-gradient(135deg, #3d4e6b 80%, #2e3a4c 100%);
}

.exam-paper-dialog .paper-title {
    font-size: 16px;
    color: #49C0F8;
    font-weight: 600;
    margin-bottom: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.exam-paper-dialog .paper-info,
.exam-paper-dialog .paper-meta {
    font-size: 14px;
    color: #b8bdc9;
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.exam-paper-dialog .paper-footer {
    font-size: 14px;
    color: #b8bdc9;
    display: flex;
    justify-content: space-between;
}

.exam-paper-dialog .paper-footer .layui-btn {
    border-radius: 8px;
    height: 28px;
    padding: 0 12px;
    line-height: 28px;
}

@media (max-width: 900px) {
    .exam-paper-dialog {
        padding: 12px 8px 12px 8px;
    }

    .exam-paper-dialog .paper-card {
        width: 100%;
        min-width: 0;
    }
}

.paper-pagination-box {
    text-align: center;
}


.layui-laypage-larryms-paper-laypage a {
    background: #33405A;
    border-color: #33405A !important;
    color: #fff !important;
}

.layui-laypage-larryms-paper-laypage a.layui-disabled {
    color: #787878 !important;
}

.larryms-paper-layer {
    background: transparent;
}

.larryms-paper-layer-dark {
    background: #1a202c;
    color: #fff;
    border-radius: 10px;
    padding: 10px;
    box-sizing: border-box;
}

.larryms-paper-layer-dark .layui-layer-content {
    box-sizing: border-box;
    min-height: 65px;
    height: auto !important;
}

.layui-layer.larryms-dark-layer {
    background: #293D61 !important; /* 深色背景 */
    color: #fff !important; /* 白色字体 */
    border: 1px solid #293d61 !important;
    box-shadow:0 6px 22px #000c;
    border-radius: 8px;
}
.layui-layer.larryms-dark-layer .layui-layer-title {
    background: #1d2025 !important;
    color: #fff !important;
}

.layui-layer.larryms-dark-layer .layui-layer-btn a {
    display: inline-block;
    background: #56689b !important;
    color: #fff !important;
    border-color: #56689b !important;
    margin-right: 15px;
}

.layui-layer.larryms-dark-layer .layui-layer-btn a:hover {
    background: #56689b !important;
}

.layui-layer.larryms-dark-layer-dark {
    background: #152649 !important; /* 深色背景 */
    color: #fff !important; /* 白色字体 */
    border: 1px solid #1a202c !important;
    box-shadow:0 6px 22px #000c;
    border-radius: 8px;
}
.layui-layer.larryms-dark-layer-dark .layui-layer-title {
    background: #1d2025 !important;
    color: #fff !important;
}

.layui-layer.larryms-dark-layer-dark .layui-layer-btn a {
    display: inline-block;
    background: #56689b !important;
    color: #fff !important;
    border-color: #56689b !important;
    margin-right: 15px;
}

.layui-layer.larryms-dark-layer-dark .layui-layer-btn a:hover {
    background: #56689b !important;
}
/*考试系统 start*/
.exam-ready-body {
    box-sizing: border-box;
    height: 100%;
    min-width: 800px;
    min-height: 100vh;
    overflow-x: hidden;
}

.exam-ready-body .layui-fluid {
    padding: 0;
}

.exam-ready-body .larryms-flex-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.exam-ready-body .headers {
    max-width: 1300px;
    display: block;
    height: 60px;
    margin: 0 auto;
    padding-top: 60px;
    margin-bottom: 30px;
}

.exam-ready-body .headers h1.paper-title {
    text-align: center;
    line-height: 60px;
    font-size: 30px;
    color: #e8e8e8;
}

.exam-ready-container {
    width: 90vw;
    max-width: 1170px;
    min-width: 768px;
    min-height: 480px;
    background: linear-gradient(165deg, rgb(67 103 209 / 53%) 25%, rgb(68 91 147 / 97%) 55%, rgb(32 74 177 / 88%) 80%, rgb(75 94 159) 100%);
    border-radius: 16px;
    box-shadow: 10px 18px 32px 0 #16161e, 0 3px 18px 0 rgb(73 81 87 / 60%) inset;
    padding: 40px 20px 45px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #e7eaf1;
    /* 让内容区文字颜色更柔和 */
    box-sizing: border-box;
}

.exam-ready-container .layui-btn-dark {
    background: #384353;
    color: #fff;
}

@media (max-width: 1400px) {
    .exam-ready-container {
        max-width: 1000px;
    }
}

@media (max-width: 1000px) {
    .exam-ready-container {
        max-width: 90vw;
        min-width: 0;
        padding: 32px 16px;
    }
}

@media (max-width: 768px) {
    .exam-ready-container {
        width: 96vw;
        max-width: 100vw;
        min-width: 0;
        padding: 20px 4vw;
        margin: 16px auto;
    }
}

.exam-step-title {
    font-size: 26px;
    font-weight: normal;
    color: #fff;
    padding-top: 20px;
    margin-bottom: 30px;
    letter-spacing: 1px;
    text-align: center;
}

.exam-step-desc {
    color: #d8d8d8;
    margin-bottom: 32px;
    font-size: 16px;
    text-align: center;
}

.exam-step-btns {
    margin-top: 36px;
    display: flex;
    gap: 24px;
    justify-content: center;
}

.exam-step-btns .go-back {
    margin-right: 30px;
}

.exam-step-btns .layui-btn {
    min-width: 120px;
    font-size: 16px;
    padding: 0 28px;
}

.exam-step-wavesurfer {
    height: 60px;
    background: #f0f2f7;
    border-radius: 10px;
    margin-bottom: 18px;
}

.exam-step-video {
    width: 260px;
    height: 180px;
    border-radius: 10px;
    background: #333;
    margin: 0 auto 18px auto;
    display: block;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.10);
}

.exam-step-flex {
    display: flex;
    justify-content: space-between;
}

.exam-info-row {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px; /* 控制每个信息间距 */
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.exam-info-item {
    font-size: 16px;
    background: rgba(0, 0, 0, 0.13);
    border-radius: 8px;
    padding: 5px 26px;
    color: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .07) inset;
    font-weight: 500;
    letter-spacing: 0.5px;
}

@media (max-width: 768px) {
    .exam-info-row {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }

    .exam-info-item {
        text-align: center;
        width: 100%;
    }
}

.exam-notice-block {
    width: 100%;
    margin: 0 auto 0 auto;
    padding: 0;
    font-size: 16px;
    color: #e7eaf1;
    line-height: 2.2;
}

.exam-notice-block > b {
    margin-bottom: 8px;
    display: block;
}

.exam-notice-block ol {
    padding-left: 20px;
    margin: 0 0 0 0;
    width: 100%;
    list-style: decimal;
}

.exam-notice-block ol li {
    margin-bottom: 10px;
    text-align: left;
    line-height: 1.7;
    font-size: 15px;
    word-break: break-all;
}

.exam-info-desc {
    width: 100%;
    display: flex;
    justify-content: start;
    gap: 36px;
    padding: 10px 0 20px 0;
}

.exam-info-desc-item {
    font-size: 16px;
    color: #e7eaf1;
    margin-right: 30px;
    /* 无背景，并内间距，防止挤在一起 */
}

.exam-info-desc-item b {
    color: #d9bc21;
    font-size: 16px;
    font-weight: 700;
    padding-right: 5px;
}

/*考试系统 end*/
/*================课程列表页面=====================*/
.larryms-student-course-container {
    background: linear-gradient(to right, rgba(58, 70, 91, 0.45), rgba(65, 81, 107, 0.65), rgba(68, 86, 115, 0.85));
    box-shadow: 3px 5px 8px #131313;
    border-radius: 6px;
    box-sizing: border-box;
    padding: 20px;
}

.larryms-student-course-container .sort-container {
    white-space: nowrap;
}

.larryms-student-course-container .sort-container ul {
    display: block;
    width: 100%;
    padding-left: 6px;
}

.larryms-student-course-container .sort-container ul li {
    display: inline-block;
    vertical-align: top;
    color: #f1f1f1;
    font-size: 18px;
    line-height: 32px;
    margin-right: 15px;
    cursor: pointer;
}

.larryms-student-course-container .sort-container ul li.sort-active {
    color: #35b8e0;
}

.larryms-student-course-container .course-content {
    display: flex;
    padding: 15px 0;
}

.course-content .empty-box {
    display: block;
    width: 100%;
    padding: 20px 0 30px 0;
    text-align: center;
}

.course-content .empty-box img {
    display: block;
    width: 230px;
    height: 230px;
    margin: 0 auto;
    margin-bottom: 20px;
}

.course-content .empty-box p {
    display: block;
    text-align: center;
    color: #bbb;
    line-height: 32px;
    font-size: 16px;
}

.course-list-box {
    display: flex;
    width: 100%;
    height: auto;
    min-height: 600px;
}

.course-list-ul {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 30px;
    justify-items: start;
}

.course-list-ul .course-item {
    border: 1px solid #363636;
    box-sizing: border-box;
    min-width: 260px !important;
    height: 315px;
    padding: 0;
    border-radius: 12px;
    box-shadow: 12px 15px 16px #181818, inset 0 3px 10px rgba(0, 0, 0, 0.65);
    transition: box-shadow 0.3s ease;
}

.course-list-ul .course-item:hover {
    box-shadow: 16px 18px 20px #030303, inset 0 3px 16px rgba(0, 0, 0, 0.65);
}

.course-item .cover a {
    display: block;
    width: 100%;
    height: 100%;
}

.course-item .cover img {
    width: 100%;
    height: 150px;
    display: block;
    object-fit: cover;
    -moz-border-radius-topleft: 12px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.course-list-ul .course-item .btn-click {
    cursor: pointer;
}

.course-list-ul .course-item .btn-click:hover {
    color: #fff !important;
}

.course-item .course-action {
    box-sizing: border-box;
    padding: 0 15px;
}

.course-item .course-info h3.title {
    display: block;
    height: 48px;
    padding-bottom: 5px;
    color: #f1f1f1 !important;
    font-weight: 550;
    font-size: 16px;
    line-height: 24px;
}

.course-item .course-info {
    box-sizing: border-box;
    padding: 10px 15px 5px 15px;
}

.course-item .course-info,
.course-item .course-info h3.title,
.course-item .base-info span,
.course-item .base-data-info span,
.course-item .course-action span {
    color: #c8c8c8;
}

.base-data-info span cite {
    font-style: normal;
}

.course-item .base-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 26px;
    padding-bottom: 5px;
}

.course-info .base-info .course-type {
    color: #ff6d00;
    font-weight: 600;
}

.course-item .base-data-info {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    align-items: center;
    line-height: 26px;
    white-space: nowrap;
    overflow: hidden;
}

/* 第1个span靠左 */
.course-item .base-data-info span:nth-child(1) {
    justify-self: start;
}

/* 第2个span居中 */
.course-item .base-data-info span:nth-child(2) {
    justify-self: center;
}

/* 第3个span靠右 */
.course-item .base-data-info span:nth-child(3) {
    justify-self: center;
}

/* 第4个span靠右 */
.course-item .base-data-info span:nth-child(4) {
    justify-self: end;
}

.course-item .course-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 26px;
}

.course-item .course-action .course-fee {
    color: #feae00 !important;
    font-weight: 600;
    font-size: 16px;
}

.course-item .buy-btn {
    min-width: 64px;
    box-sizing: border-box;
    padding: 0 5px;
    text-align: center;
    line-height: 24px;
    font-size: 12px;
    cursor: pointer;
    color: #fff !important;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: all 0.3s ease;
}

/* 免费：绿色 */
.course-item .course-fee.fee-free {
    color: #43a047;
    /* 绿色 */
}

/* VIP：金色 */
.course-item .course-fee.fee-vip {
    color: #ffac00;
    /* 金色 / 黄色调 */
}

/* 付费：橙色 */
.course-item .course-fee.fee-pay {
    color: #ff6d00;
    /* 橙色 */
}

/* 鼠标悬停可稍微加深颜色 */
.course-item .buy-btn:hover {
    opacity: 0.85;
}

/* 已经加入学习 => 用一些“成功”或“已拥有”的绿色 */
.buy-btn.btn-success {
    background-color: #16bb16;
    border-color: #16bb16;
}

/* 加入课程 => 蓝色 */
.buy-btn.btn-study {
    background-color: #1e9fff;
    border-color: #1e9fff;
}

/* 开通VIP => 金色，和 fee-vip 同系 */
.buy-btn.btn-vip {
    background-color: #ffac00;
    border-color: #ffac00;
}

/* 加入购物车 => 橙色，和 fee-pay 同系 */
.buy-btn.btn-pay {
    background-color: #ff6d00;
    border-color: #ff6d00;
}


.larryms-pagination {
    text-align: center;
    padding: 10px;
}

.larryms-pagination .layui-laypage input,
.larryms-pagination .layui-laypage button {
    background: transparent;
    color: #c8c8c8;
}

.larryms-pagination .layui-laypage a,
.larryms-pagination .layui-laypage span,
.larryms-pagination .layui-laypage input,
.larryms-pagination .layui-laypage button {
    background: transparent;
    color: #c8c8c8;
    border-color: rgba(35, 33, 33, 0.8);
}

.larryms-pagination .layui-laypage select {
    color: #c8c8c8;
    background: #1A202C;
    border-color: rgba(35, 33, 33, 0.8);
}

.larryms-pagination .layui-laypage .layui-laypage-curr .layui-laypage-em {
    background: #1A202C;
}
/*针对ai答疑页面css样式补丁*/
.larryms-student-nav.chat-service .logo {
    padding: 30px 10px 10px 10px;
    height: 80px;
}

.larryms-student-nav.chat-service .logo img {
    width: 60px;
}

.larryms-student-nav.chat-service .nav-menu-container {
    padding: 15px 15px 15px 15px;
}

.larryms-student-nav.chat-service .menu-item {
    text-align: center;
    padding-left: 5px;
}

.larryms-student-nav.chat-service .menu-item i.larry-icon {
    font-size: 24px;
}

.larryms-student-nav.chat-service .menu-item-title {
    display: none;
}

.larryms-student-nav.chat-service .menu-item:hover {
    position: relative;
}

.larryms-student-nav.chat-service .menu-item:hover .menu-item-title {
    display: block;
    position: absolute;
    top: 0;
    left: 82px;
    width: auto;
    white-space: nowrap;
    border-radius: 8px;
    background: #f1f1f1;
    padding: 0 10px;
    color: #333;
}

.larryms-student-nav.chat-service .menu-item.larryms-on-active:hover .menu-item-title {
    color: #333;
}
/*菜单导航响应式设计*/
@media (max-width: 1000px) {
    .larryms-student-nav {
        width: 90px;
        flex-direction: column;
        z-index: 9999;
    }

    .larryms-student-nav .logo {
        padding: 30px 10px 10px 10px;
        height: 80px;
    }

    .larryms-student-nav .logo img {
        width: 60px;
    }

    .nav-menu-container {
        padding: 15px 15px 15px 15px;
    }

    .larryms-student-nav .menu-item {
        text-align: center;
        padding-left: 5px;
    }

    .larryms-student-nav .menu-item i.larry-icon {
        font-size: 24px;
    }

    .larryms-student-nav .menu-item-title {
        display: none;
    }

    .larryms-student-nav .menu-item:hover {
        position: relative;
    }

    .larryms-student-nav .menu-item:hover .menu-item-title {
        display: block;
        position: absolute;
        top: 0;
        left: 82px;
        width: auto;
        white-space: nowrap;
        border-radius: 8px;
        background: #f1f1f1;
        padding: 0 10px;
        color: #333;
    }

    .larryms-student-nav .menu-item.larryms-on-active:hover .menu-item-title {
        color: #333;
    }

    .larryms-student-container {
        width: calc(100% - 90px);
        margin-left: 90px;
    }

    .larryms-student-container .larryms-student-content {
        display: block;
        width: 100%;
    }

    .layui-col-sm12, .layui-col-sm7, .layui-col-sm5 {
        width: 100%;
        box-sizing: border-box;
    }

    .layui-col-md6 {
        width: 100%;
        box-sizing: border-box;
    }

    .larryms-student-header {
        display: block;
    }

    .larryms-student-header .page-title {
        display: block !important;
    }

}

@media screen and (min-width: 1001px) {
    .larryms-student-container .larryms-student-content {
        width: 100% !important;
    }
}

@media screen and (min-width: 1600px) {
    .larryms-student-container .larryms-student-content {
        width: 1320px !important;
        margin: 0 auto;
        overflow: hidden;
    }

    .larryms-student-course-container {
        padding: 20px 30px;
    }
    .chat-page .larryms-student-container .larryms-student-content.chat-container{
        width: 100% !important;
    }
    .larryms-student-container .larryms-student-content.main-container{
        width: 100% !important;
    }
}

/*课程列表页*/
.larryms-tab-header li {
    display: inline-block;
    vertical-align: top;
}

.larryms-tab-body > div {
    display: none;
}

/*课程详情页面*/
.course-detail-page h1.course-title {
    display: block;
    box-sizing: border-box;
    font-size: 18px;
    color: #d8d8d8;
    padding-top: 10px;
}

.course-top-info {
    display: flex;
    align-items: flex-start;
    padding-bottom: 35px;
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.course-top-info::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px; /* 阴影高度 */
    border-radius: 20px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), transparent); /* 渐变阴影 */
    box-shadow: 20px 12px 24px #000;
    z-index: 1; /* 确保阴影在上层 */
}

.course-cover-pic {
    flex-shrink: 0;
    width: 360px;
    height: 240px;
    margin-right: 20px;
    background-color: #f2f2f2;
    overflow: hidden;
    border-radius: 8px;
}

.course-cover-pic img {
    display: block;
    border-radius: 8px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-base-info {
    flex: 1;
    min-height: 240px;
    box-sizing: border-box;
    padding-left: 15px;
    position: relative;
}


.course-detail-page .larryms-student-header {
    margin-bottom: 0;
}

.title-bar {
    white-space: nowrap;
}

.title-bar .h1-course-title {
    line-height: 38px;
    color: #f8f8f8;
    font-weight: 600;
    font-size: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.type-name {
    color: #35cfe0;
    font-size: 20px;
}

.base-desc {
    display: block;
    line-height: 38px;
    color: #35e044;
    font-size: 14px;
    text-shadow: 1px 2px 3px #000;
}

.base-desc span {
    padding-right: 30px;
}

.course-desc {
    display: block;
    max-height: 80px;
    line-height: 26px;
    color: #fafafa;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    margin-bottom: 10px;
}

.course-bottom-group {
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 0;
    display: flex;
    justify-content: space-between; /* 确保两个 base-data-info 两端对齐 */
    align-items: center; /* 垂直居中 */
    white-space: nowrap; /* 防止换行 */
}

.course-bottom-group .base-data-info {
    display: flex;
    align-items: center; /* 垂直居中 */
    line-height: 38px;
    color: #fff;
}

.course-bottom-group .base-data-info span.icon {
    padding-right: 20px;
    color: #d8d8d8;
}

.course-bottom-group .base-data-info:last-child {
    justify-content: flex-end; /* 右侧 base-data-info 内的元素右对齐 */
}

.course-bottom-group .base-data-info:last-child > * {
    margin-left: 10px; /* 右侧 base-data-info 内的元素间距 */
}

.course-bottom-group .base-data-info .course-fee {
    margin-right: 20px;
    font-size: 22px;
}

/* 免费：绿色 */
.base-data-info .course-fee.fee-free {
    color: #43a047;
    /* 绿色 */
}

/* VIP：金色 */
.base-data-info .course-fee.fee-vip {
    color: #ffac00;
    /* 金色 / 黄色调 */
}

/* 付费：橙色 */
.base-data-info .course-fee.fee-pay {
    color: #ff6d00;
    /* 橙色 */
}

.base-data-info .cursor-icon {
    cursor: pointer;
}

.base-data-info .cursor-icon:hover {
    color: #fff !important;
}

.course-detail-page-body {
    padding: 25px 30px;

}

.course-detail-page-body .course-detail-content {
    padding: 25px 0 15px 0;
    display: flex;
    justify-content: space-between;
}

.course-detail-content .page-left-content {
    flex-grow: 1; /* 左侧容器占据剩余空间 */
    flex-shrink: 1; /* 允许缩小 */
    margin-right: 20px; /* 添加右侧间距，避免与右侧容器紧贴 */
}


.course-detail-content .page-right-content {
    width: 330px;
    flex-shrink: 0; /* 禁止缩小 */
}


.larryms-tab-header {
    display: block;
    height: 38px;
    line-height: 38px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    padding-bottom: 20px;
    margin-bottom: 15px;
}

.larryms-tab-header li {
    padding: 0 20px 15px 20px;
    margin-right: 60px;
    text-shadow: 3px 12px 8px #000;
    cursor: pointer;
}

.larryms-tab-header li.layui-this {
    color: #02ed6d;
    border-bottom: 4px solid #1caf68;
    position: relative;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.larryms-tab-header li.layui-this::after {
    content: '';
    position: absolute;
    bottom: 1px;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 20px;
    box-shadow: 1px 2px 3px #000, inset 4px 2px 3px #11c26d;
}

.course-detail-content .page-left-content .larryms-tab-body {
    color: #fff;
    padding-right: 15px;
    line-height: 26px;
    font-size: 14px;
    padding-top: 20px;
}

.course-detail-content .page-left-content .larryms-tab-body p {
    margin-bottom: 10px;
    color: #d8d8d8;
}

.course-detail-content .page-left-content .larryms-tab-body p span {
    display: block;
    background: transparent !important;
    font-weight: 600;
    color: #fff !important;
    padding-top: 10px;
}

.course-detail-content .page-left-content img {
    width: 100%;
    border-radius: 6px;
    height: auto;
}

/*右侧内容区域*/
.course-detail-content .page-right-content .page-content {

}

.course-detail-content .page-right-content .page-content .page-card {
    border-radius: 12px;
    min-height: 100px;
    box-shadow: 4px 8px 12px #131313;
    box-sizing: border-box;
    padding: 15px;
    margin-bottom: 30px;
    background: #313b4c;
}

.page-content .page-card .page-card-header {
    color: #fff;
    font-weight: 550;
    font-size: 16px;
    line-height: 32px;
    margin-bottom: 10px;
}


.course-detail-content .page-right-content .page-content .page-card.trial-preview-card {
    background: #526069;
    color: #333;
}

.trial-preview-card .page-card-body {
    text-align: center;
}

.trial-preview-box {
    display: block;
    text-align: center;
    height: 180px;
    background-color: #282d35;
    color: #bcbcbc;
    border-radius: 8px;
    box-sizing: border-box;
    padding: 50px 30px;
    font-size: 14px;
    cursor: pointer;
}

.trial-preview-box:hover {
    background: #131313;
}

.trial-preview-box span.larry-icon {
    font-size: 38px;
    line-height: 50px;
}

.trial-preview-box p {
    display: block;
    line-height: 32px;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.trial-preview-box:hover span, .trial-preview-box:hover p {
    color: #fff;
}

.page-card-body .teacher-info {
    line-height: 40px;
    color: #fff;
    padding-bottom: 15px;
}

.page-card-body .teacher-info span.name {
    padding-left: 10px;
}

.page-card-body .teacher-text {
    line-height: 24px;
    color: #e8e8e8;
    font-size: 13px;
}

.page-card-body p.text-none {
    display: block;
    text-align: center;
    color: #989898;
    font-size: 14px;
    line-height: 70px;
}

@media screen and (min-width: 901px) and (max-width: 1200px) {
    .course-detail-page .page-title, .course-detail-page .page-right {
        display: inline-block !important;
        vertical-align: top;
        width: auto !important;
    }

    .course-detail-page .page-right {
        display: flex !important;
        float: right;
        min-width: 300px;
    }

    .course-title {
        display: inline-block;
        vertical-align: top;
    }

    .course-cover-pic {
        width: 280px;
        height: 180px;
    }

    .course-base-info {
        min-height: 180px;
    }

    .course-desc {
        max-height: 50px;
    }

    .course-bottom-group .base-data-info span.icon {
        padding-right: 8px;
    }

}

@media screen and (max-width: 900px) {
    .course-detail-page {
        min-width: 620px;
    }

    .course-detail-page .page-title, .course-detail-page .page-right {
        display: inline-block !important;
        vertical-align: top;
        width: auto !important;
    }

    .course-detail-page .page-right {
        display: flex !important;
        float: right;
        min-width: 300px;
    }

    .course-detail-page .page-right .user-info {
        min-width: 130px;
    }

    .course-detail-page .page-title .course-title {
        display: inline-block;
        vertical-align: top;
        font-size: 18px;
    }


    .course-cover-pic {
        display: none;
    }

    .course-base-info {
        min-height: 210px;
    }
}


.aliyun-player-container .videos {
    display: block;
    width: 100%;
    height: 100%;
    background: #070C11;
    border-radius: 10px;
    overflow: hidden;
}

.laybot-layer.layui-layer-page,
.laybot-layer.layui-layer-iframe {
    box-shadow: 12px 18px 18px #000, inset 3px 6px 9px #333;
    background-color: #545C63;
}

.laybot-layer.layui-layer-page .layui-layer-content,
.laybot-layer.layui-layer-iframe .layui-layer-content,
.laybot-layer {
    border-radius: 16px;
    background-color: #545C63;
}

.laybot-layer.layui-layer-iframe .layui-layer-content iframe {
    border-radius: 16px;
    background-color: #545C63;
}

.aliyun-player-container {
    background: #545C63 !important;
    color: #FFFFFF;
    box-sizing: border-box;
    padding: 30px 20px 20px 20px;
    overflow: hidden;
}

.course-bottom-group .base-data-info span.icon .larry-yishoucang {
    color: #ff5722 !important;
}

.course-bottom-group .base-data-info span.icon .already.larry-like {
    color: #ff5722 !important;
}

.base-data-info span .larry-yishoucang {
    color: #ff5722 !important;
}

.base-data-info span .already.larry-like {
    color: #ff5722 !important;
}

.larryms-vip-content {
    box-sizing: border-box;
    padding: 50px 40px 20px 0;
    max-width: 600px;
    margin: 0 auto;
}

.top-vip-list {
    width: 100%;
    height: 230px;
}

.top-vip-list .swiper {
    width: 100%;
    height: 230px;
    overflow: visible;
}

.top-vip-list .swiper .swiper-wrapper {
    box-sizing: border-box;
    padding: 20px;
}

.top-vip-list .swiper .swiper-wrapper .swiper-slide {
    height: 200px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 6px 12px 18px #000, inset 3px 6px 12px #ea700e;
    box-sizing: border-box !important;
}

.top-vip-list .swiper .swiper-wrapper .swiper-slide li.li-slide {
    background: linear-gradient(to bottom, #FFF6EC, #FFF2E6, #FEEED4);
    border: 4px solid #E9EBEE;
    border-radius: 12px;
    height: 100%;
    box-sizing: border-box !important;
    padding: 20px 30px;
    cursor: pointer;
}

.top-vip-list .swiper .swiper-wrapper .swiper-slide span {
    display: block;
}

.swiper-slide li.li-slide span.name {
    color: #333;
    font-size: 18px;
    line-height: 38px;
}

.swiper-slide li.li-slide span.price {
    font-size: 26px;
    line-height: 60px;
    color: #FF6600;
    font-weight: 600;
}

.swiper-slide li.li-slide span.days {
    font-size: 16px;
    line-height: 38px;
}

.top-vip-list .swiper .swiper-wrapper .swiper-slide.active-card li.li-slide {
    background: linear-gradient(to bottom, #fad59b, #f4ad2c, #e6bc80);
    border: 4px solid #e47d13;
}

.swiper-button-next, .swiper-rtl .swiper-button-prev {
    right: -60px !important;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
    left: -20px !important;
}

.selected-vip {
    display: block;
    text-align: center;
    box-sizing: border-box;
    padding: 30px;
}

.selected-info {
    padding-bottom: 15px;
    box-sizing: border-box;
    height: 80px;
}

.selected-info span {
    display: block;
    color: #fff;
    line-height: 32px;
}

.selected-info span.name {
    color: #e8e8e8;
    font-size: 18px;
}

.selected-info span.price {
    color: #ff5722;
    font-size: 16px;
}

.vip-body {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.top-vip-list .swiper .swiper-wrapper .swiper-slide.active-card li.li-slide span {
    text-shadow: 4px 2px 6px #d3aa09;
}

.larryms-top-header {
    display: flex;
    align-items: center;
    width: 100%;
    height: 60px;
    background: #1A202C;
    box-shadow: 1px 6px 12px #000;
    font-size: 14px;
    color: #fff !important;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 9999;
}

.larryms-top-header .logo {
    flex: 0 0 140px;
    padding: 10px 20px 10px 30px;
    height: 60px;
    box-sizing: border-box;
    cursor: pointer;
}

.larryms-top-header .logo img {
    width: 60px;
}

.larryms-top-header .nav-menu-container {
    flex: 1;
    height: 60px;
    box-sizing: border-box;
    padding: 5px 20px;
}


/* 新增ul的flex布局 */
.larryms-top-header .nav-menu-container ul {
    display: flex;
    gap: 10px; /* 菜单项间距 */
    height: 100%;
    align-items: center;
    list-style-type: none; /* 移除默认列表样式 */
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 优化菜单项样式 */
.larryms-top-header .nav-menu-container .menu-item {
    position: relative;
    margin: 0;
    box-sizing: border-box;
    border-radius: 6px;
    min-width: 100px;
}

/* 菜单项悬停效果 */
.larryms-top-header .nav-menu-container .menu-item a {
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, .8);
    text-decoration: none;
    transition: all 0.3s;
    padding: 10px 15px;
    border-radius: 6px;
}

/* 激活状态样式 */
.larryms-top-header .nav-menu-container .menu-item.larryms-on-active,
.larryms-top-header .nav-menu-container .menu-item:hover {
    background: rgba(0, 0, 0, .8);
    color: #fff;
}

.larryms-top-header .nav-menu-container .menu-item:hover a {
    color: #fff;
}

.user-actions {
    flex: 0 0 335px;
    display: flex;
    align-items: center;
    gap: 15px;
    margin-left: auto;
    cursor: pointer;
}

.user-actions li {
    display: flex;
    align-items: center;
    color: rgba(255, 255, 255, .8);
    gap: 8px;
    white-space: nowrap;
}

/* 课程学习页面 */
.larryms-study-page-container {
    position: relative;
    padding-top: 60px;
    height: calc(100vh - 60px);
    display: flex;
    overflow: hidden;
}

.left-chapter-container {
    width: 365px;
    height: 100%;
    border-right: 1px solid #1A202C;
    box-shadow: 3px 6px 16px #131313;
    overflow-y: auto;
}

.right-study-container {
    flex: 1;
    height: 100%;
    box-sizing: border-box;
    width: calc(100% - 385px);
    overflow-y: auto;
}

.study-main-content {
    max-width: 1170px;
    box-sizing: border-box;
    padding: 30px;
    margin: 0 auto;
}

.custom-tree {
    box-sizing: border-box;
    padding: 20px 25px 20px 5px;
}

.chapter-menu {
    padding: 0;
    margin: 0;
    list-style: none;
    color: #fff !important;
    font-size: 14px;
}

.chapter-item {
    position: relative;
    padding: 0 0 0 15px;
}

.item-content {
    display: flex;
    align-items: center;
    padding: 12px 0;
    gap: 5px;
    cursor: pointer;
    transition: all 0.3s;
}

.item-content span.title {
    min-width: 150px;
    line-height: 26px;
}

.chapter-item:hover .item-content {
    /*background: #f8f9fa;*/
}

.toggle-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    transition: transform 0.3s;
}

.toggle-spacer {
    width: 10px;
    margin-right: 8px;
}

.expanded .toggle-icon {
    transform: rotate(360deg);
}

.title {
    flex: 1;
    font-size: 14px;
    color: #fff;
}

.status-info {
    display: flex;
    gap: 15px;
    font-size: 14px;
    color: #d8d8d8;
    text-align: right;
}

.duration {
    color: #e8e8e8;
    min-width: 40px;
    text-align: right;
}

.progress {
    color: #1890ff;
    min-width: 40px;
    text-align: right;
}

/* 层级缩进 */
.chapter-menu.level-1 .chapter-item {
    padding-left: 15px;
}

.chapter-menu.level-2 .chapter-item {
    padding-left: 30px;
}

/* 激活状态 */
.chapter-item.active .item-content {
    /*background: #e6f7ff;*/
}

.chapter-item.active .title {
    color: #1890ff;
    font-weight: 500;
}

/* 购物车动画样式 */
.cart-fly-item {
    color: #ff5722 !important;
    pointer-events: none;
    transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}

.cart-fly-item i.larry-icon {
    color: #ff5722;
    font-size: 50px;
}

/* 购物车数字动画 */
.shoppingCartNums {
    transition: all 0.3s ease;
}

.shopping-cart {
    cursor: pointer;
}

.user-actions.layui-nav {
    background: transparent;
    padding: 0;
    white-space: nowrap;
}

.user-actions.layui-nav .user-info a {
    display: flex;
    max-width: 230px;
    padding: 0 10px;
    line-height: 38px;
}

.user-actions.layui-nav .user-info a .student-name {
    display: inline-block;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-actions.layui-nav .layui-nav-more {
    font-size: 14px;
    right: -10px;
}

.user-actions.layui-nav .layui-nav-child {
    background: #1A202C;
    border: 1px solid #1A202C;
    border-radius: 6px;
    text-align: center;
    font-size: 14px;
    line-height: 38px;
}

.user-actions.layui-nav .layui-nav-child span {
    padding-left: 10px;
}

.user-actions.layui-nav .shopping-cart {
    font-size: 14px !important;
}

.user-actions.layui-nav .shopping-cart:hover {
    background: #1A202C !important;
    border-radius: 6px;
}

.larryms-shopping-cart-container {
    border-radius: 12px;
    box-sizing: border-box;
    padding: 30px;
}

.cart-bottom {
    position: fixed;
    bottom: 30px;
    right: 30px;
    left: 30px;
    z-index: 9999;
    text-align: right;
}

.cart-bottom .bottom-right-text {
    padding-right: 15px;
    line-height: 44px;
    color: #fff;
    font-size: 14px;
}

.cart-bottom .bottom-right-text cite {
    font-style: normal;
    color: #24D271;
    font-size: 20px;
    padding: 0 5px;
}

.cart-top {
    display: block;
    height: 50px;
    line-height: 50px;
    text-align: left;
    font-size: 18px;
    padding-bottom: 5px;
    /*border-bottom: 3px solid #ed6a40;*/
    border-bottom: 3px solid rgba(215, 231, 246, 0.65);
}

.cart-top span.title {
    padding-right: 10px;
    font-size: 16px;
}

.cart-top span.nums {
    color: #e1ef0a;
    font-size: 20px;
}

.cart-container {
    padding: 15px 0;
}

.user-actions.layui-nav .user-info a {

}

.user-actions.layui-nav .user-info .img-photo {
    width: 32px;
    height: 32px;
    margin-top: 6px;
}

.user-actions.layui-nav .user-info .student-name {
    line-height: 48px;
}

.user-actions.layui-nav .user-info .larryms-is-vip {
    padding-top: 3px;
}

.user-actions.layui-nav .user-info .layui-nav-more {
    line-height: 48px;
}


/*课程学习界面*/
.study-main-content {
    display: block;
    min-height: 600px;
}

.top-study-content {
    display: block;
    width: 100%;
    min-height: 450px;
    background: green;
}

.larryms-video-player {
    display: block;
    width: 100%;
    min-height: 450px;
    height: auto;
}


/* =============== AI 在线答疑专用 =============== */
.chat-page .chat-container{
    height:100vh;
    display:flex;
    flex-direction:column;
    padding: 0;
    overflow: hidden;
}

/* -------- 顶部 Header -------- */
.chat-page .chat-header{
    height:50px;
    display:flex;
    align-items:center;
    padding:0 20px;
    backdrop-filter:blur(8px);
    background: #1a202c;
    box-shadow: 15px 10px 18px #000;
    margin-bottom: 0 !important;
    box-sizing: border-box;
}
.chat-page .header-info{
    flex:1;
    color:#eee;
    display:flex;
    gap:24px;
    font-size:14px;
    background:rgba(255,255,255,.05);
    padding:6px 14px;
    border-radius:8px;
}
.chat-page .header-info b{color:#ffd659;font-weight:600}
.chat-page .header-user{display:flex;align-items:center;gap:12px}

.chat-page .summary-bar{
    display:flex;
    align-items:center;
    gap:26px;
    font-size:14px;
    line-height: 30px;
    color:var(--fc-base);
}
.chat-page .summary-bar h1{
    font-size: 18px !important;
    vertical-align: top;
    padding: 5px 0;
    line-height: 42px !important;
    white-space: nowrap;
    min-width: 80px !important;
}
.chat-page .summary-bar i.larry-icon{
    font-size:18px;color:var(--c-gold);
}
.chat-page .summary-bar .stat{
    display:flex;
    gap:6px;
    align-items:center;
    padding-right: 5px;
}
.chat-page .summary-bar .stat label{
    color:var(--c-gold-dark);
    font-size:14px;
    padding-right: 3px;
}
.chat-page .summary-bar .stat b{
    color:var(--c-gold);
    font-weight:600;
    font-size: 16px;
    padding-right: 3px;
}
.chat-page .summary-bar .btn-recharge{
    background:#d36311;
    border:none;border-radius:6px;
    padding:0 10px;font-size:14px;line-height:30px;
    color:#fff;display:flex;align-items:center;gap:6px;
    cursor: pointer;
    transition:.2s;
}
.chat-page .summary-bar .btn-recharge:hover{
    background:#cd0000;
}
.chat-page .summary-bar .btn-recharge i{font-size:16px;}

.chat-page .user-info .img-photo{
    width: 38px;
    height: 38px;
    margin-top: 2px;
}
/* -------- 水平主体区域 -------- */
.chat-body-wrap{
    flex:1;
    display:flex;
    height:calc(100% - 60px)
}

/* ==== 左侧 Sidebar ==== */
/* 侧栏整体 */
.chat-body-wrap .sidebar{
    flex-direction:column;
    padding:15px;
    background:#222a37;
    width: 265px;
    box-sizing: border-box;
    border-right: 1px #333;
}

/* ①② 两行独占 */
.chat-body-wrap .sidebar-item{margin-bottom:12px}
.chat-body-wrap .sidebar-item select{
    width:100%;
    height:42px;
    border:none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 0 40px 0 15px; /* 右侧留足空间 */
    background: #1d2533 url('data:image/svg+xml;utf8,<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg"><polygon points="6,9 12,15 18,9" fill="%23aaa"/></svg>') no-repeat right 10px center;
    color:#eee;
    box-sizing: border-box;
    font-size:14px
}
.chat-body-wrap .sidebar-item select::-ms-expand {
    display: none;
}
.chat-body-wrap .sidebar select:focus{outline:none;border-color:var(--c-primary);}
.chat-body-wrap .sidebar .sidebar-item.btn-new-topic{
    display: block;
    width: 100%;
    text-align: center;
}
.chat-body-wrap .sidebar .sidebar-item.btn-new-topic .layui-btn{
    width:160px;
    height: 42px;
    margin: 0 auto;
    background: #4c5f7d;
    color:#fff;
    border:none;
    border-radius:8px;
    line-height: 42px;
    font-size:14px;
    transition:.2s;
    cursor: pointer;
}
.chat-body-wrap .sidebar .btn-new-topic:hover .layui-btn{
    background: rgba(140, 188, 239, 0.75);
}
.chat-body-wrap .sidebar .btn-new-topic:hover .layui-btn em{
    padding-left: 10px;
    font-style: normal;
}
/* 话题列表 */
.chat-body-wrap .topic-list{
    display:flex;
    flex: 1;
    flex-direction:column;
    grid-template-columns:repeat(auto-fill,minmax(100%,1fr));
    gap:10px;
    overflow-y:auto;
    padding: 0 5px;
    margin-bottom: 15px;
    border-radius:8px;
}

/* 话题卡片 */
.chat-body-wrap .topic-card{
    position:relative;
    background: linear-gradient(120deg, #2b3344 80%, #232a3a 120%);
    color: #e8eaf1;
    padding: 10px 12px;
    border-radius:8px;
    box-sizing: border-box;
    cursor:pointer;
    height: 100px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    border: 1px solid transparent;
    box-shadow: 1px 3px 12px #000000e0;
    transition:0.20s;
    overflow: hidden;
    margin-bottom: 8px;
}

/* ② 选中高亮：柔和而高端 */
.chat-body-wrap .topic-card.active {
    /*background: linear-gradient(134deg, #213d89 30%, #000 100%);*/
    background: linear-gradient(90deg, rgba(104, 155, 255, 0.18) 0%, rgba(104, 155, 255, 0.12) 35%, rgba(104, 155, 255, 0.06) 65%, rgb(104 155 255 / 7%) 100%);
    border: 1px solid #1a202c;
    /*box-shadow: -6px -18px 17px #000000;*/
    z-index: 1;
    color: #212a3b;
}
.chat-body-wrap .topic-card:hover {
    background: linear-gradient(120deg, #050505 16%, #000 100%);
    box-shadow: 0 4px 12px rgba(73,192,248,0.09), 0 2px 8px #13131360;
    border: 1px solid transparent;
}
/* ③ 标题区域：两行，超出省略号 */
.chat-body-wrap .topic-title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    line-height: 24px;
    height: 52px !important;
    color: #b8b8b8;
    letter-spacing: 0.01em;
    margin-bottom: 5px;
    overflow: hidden;
}
.chat-body-wrap .topic-card.active .topic-title {
    color:#8bb4eb;
}
/* ④ 底部flex布局（时间、操作） */
.chat-body-wrap .topic-bottom-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 24px;
    font-size: 13px;
    margin-top: 0;
    padding-bottom: 0;
    position: absolute;
    bottom: 10px;
    left: 12px;
    right: 12px;
}

.chat-body-wrap .topic-time {
    color: #8fa6c4;
    font-size: 13px;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color 0.2s;
}
.chat-body-wrap .topic-card.active .topic-time,
.chat-body-wrap .topic-card:hover .topic-time {
    color: #11c26d;
}

/* 操作区：灰色->主色->白，动画过渡 */
.chat-body-wrap .topic-bottom-row .ops {
    display: flex;
    gap: 12px;
}
.chat-body-wrap .topic-bottom-row .ops i {
    color: #7a86a0;
    font-size: 18px;
    cursor: pointer;
    transition: color 0.18s;
    opacity: 0.82;
}
.chat-body-wrap .topic-card:hover .ops i {
    color: #49C0F8;
    opacity: 1;
}
.chat-body-wrap .topic-card.active .ops i {
    color: #3BA1F7;
    opacity: 1;
}
.chat-body-wrap .topic-bottom-row .ops i:hover {
    color: #fff !important;
}

.sidebar .load-more{color:#9aa4b1;text-align:center;padding:6px 0;
    cursor:pointer;font-size:13px;}
.sidebar .load-more:hover{color:#fff}



/* ==== 右侧 Chat Main ==== */
.chat-body-wrap .chat-main{
    flex:1;
    display:flex;
    flex-direction:column;
    background:#1A202C
}
.chat-body-wrap .chat-content{
    flex:1;
    overflow-y:auto;
    padding:18px 22px;
    background:radial-gradient(circle at 50% 0%, #22304a 0, #1A202C 100%);
}
.chat-body-wrap .chat-content::-webkit-scrollbar,
.speaking-main::-webkit-scrollbar,
.chat-body-wrap .topic-list::-webkit-scrollbar{width:6px}
.chat-body-wrap .chat-content::-webkit-scrollbar-thumb,
.speaking-main::-webkit-scrollbar-thumb,
.chat-body-wrap .topic-list::-webkit-scrollbar-thumb{background:#4e5a74;border-radius:3px}



.chat-body-wrap .chat-empty{
    text-align:center;
    color:#999;
    padding-top:0;
}
.chat-body-wrap .model-cards{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    justify-content:center;
    margin-top:20px
}

.chat-body-wrap .model-card:hover{
    background:#2c3b52;
    color:#fff
}

/* ---- 气泡 ---- */
/******** 行容器 ********/
.chat-page .msg-row{
    display:flex;
    flex-direction:row;          /* AI 默认：头像→气泡→tools */
    align-items:flex-start;
    gap:10px;
    margin:18px 0 30px;
}
.chat-page .msg-row.me{
    flex-direction:row-reverse;  /* 学生：气泡→头像→tools */
}

/******** 头像 ********/
.chat-page .msg-row .avatar{
    width:34px;
    height:34px;
    border-radius:50%;
    flex:0 0 34px;               /* 固定宽高，避免被挤压 */
}
/* ===== bubble-wrap：相对定位 ===== */
.chat-page .bubble-wrap{
    position:relative;
    flex:0 1 auto;             /* 允许收缩 */
    max-width:80%;
}

/******** 气泡 ********/
.chat-page .msg-row .bubble{
    display:inline-block;
    padding:10px 14px;
    border-radius:8px;
    font-size:15px;
    line-height:1.6;
    word-break:break-word;
    box-shadow:0 2px 6px rgba(0,0,0,.25);
    position:relative;
    background: #3d485d;
    color:#fff;
    flex:0 1 auto;               /* 让气泡可收缩 */
}

/* ——学生气泡—— */
.chat-page .msg-row.me .bubble{
    background: #35486ddb;
    color:#fff;
}

/* ——AI 气泡—— */
.chat-page .msg-row.ai .bubble{
    background:#3a455b;color:#eee;padding-left:16px;
}

/* ===== 工具条：绝对定位到 bubble 顶部 ===== */
.chat-page .msg-tools{
    position:absolute;
    top:-30px;                 /* 距气泡上方 24px */
    left:0;
    display:flex;
    gap:8px;
    opacity:0;
    transition:opacity .15s,
    transform .15s;
    list-style:none;margin:0;padding:0;
}
.chat-page .msg-row.me .msg-tools{
    right:0;left:auto;         /* 自己的消息 → 右对齐 */
}
.chat-page .bubble-wrap:hover .msg-tools{opacity:1;transform:translateY(-4px);}

.chat-page .msg-tools li{
    width:26px;height:26px;border-radius:4px;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;transition:.15s;
}
.chat-page .msg-tools li:hover{
    background:rgba(255,255,255,.12);
}

.chat-page .msg-tools i{
    font-size:16px;
    color:#c0c4cc;
    cursor:pointer;
}
.chat-page .msg-tools li:hover i{color:#fff;}


.chat-page .msg-row.me:hover .msg-tools{opacity:1;}            /* 学生：hover 行时出现 */
.chat-page .msg-row.ai .bubble:hover + .msg-tools{opacity:1;}  /* AI：仅 hover 气泡时 */

.chat-page a{
    color: #e8e8e8;
}
.chat-page pre{
    padding: 5px 0;
}
.chat-page pre code{
    display:block;padding:0;
    background:#0f131b;border-radius:6px;
    font-size:13px;color:#e8e8e8;
}
.chat-page .bubble pre{
    white-space:pre-wrap;
    font-family:Menlo,Consolas,monospace;
}
.chat-page code{background:#2c3344;padding:2px 4px;border-radius:4px;}
/* ==== 输入区 ==== */
.chat-body-wrap .chat-input{
    border-top:1px solid #444;
    background:#1a202c;
    height: 200px;
}

.chat-body-wrap .tool-bar{
    display:flex;
    align-items:center;
    background:#222b39;
    padding:8px 15px;
    gap:12px;
    min-height: 30px;
    border-top:1px solid #313a4d;
    user-select:none;
    box-shadow:0 -1px 3px rgba(0,0,0,.6);
}
.chat-body-wrap .tool-bar>div{
    display:flex;
    align-items:center;
    justify-content:center;
}
.chat-body-wrap .tool-bar .tool-left span{
    width:32px;
    height:32px;
    border-radius:6px;
    display:flex;
    gap: 10px;
    align-items:center;
    justify-content:center;
    color:var(--fc-sub);
    cursor:pointer;
    transition:.2s;
    font-size: 18px;
    margin-right: 5px;
}
.chat-body-wrap .tool-bar .tool-left span i.larry-icon{
    font-size: 20px;
    padding-right: 15px;
}
.chat-body-wrap .tool-bar .tool-right{
    margin-left:auto;
    min-width: 200px;
    white-space: nowrap;
    font-size:13px;
    color:var(--fc-sub);
}
.chat-body-wrap .tool-bar .tool-right span.tips{
    padding-right: 20px;
    font-size: 13px;
}
.chat-body-wrap .tool-bar .tool-right span{
    display: inline-block;
    vertical-align: top;
}
.chat-body-wrap .tool-bar .price-tag{
    color:var(--c-gold);margin-left:8px;
}
.chat-body-wrap .upload-list{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    padding:4px 10px
}
.chat-body-wrap .upload-item{
    background:#3d4d6b;
    padding:4px 8px;
    border-radius:6px;
    font-size:12px;
    color:#eee
}
.chat-body-wrap .chat-input-box{
    display:flex;
    gap:8px;
    padding:10px
}

.chat-body-wrap .chat-input-box{
    position:relative;
    padding:0; /* 预留给 send-btn */
    background:var(--bg-input);
    border-radius: 4px;
}
.chat-body-wrap .textarea-wrap{
    flex:1;border-radius:8px;
    background:var(--bg-input);overflow:hidden;
}
.chat-body-wrap .textarea-wrap textarea{
    display:block;
    width:100%;
    height:130px;
    resize:none;
    border:none;background:transparent;
    padding:10px 12px;color:var(--fc-base);
    font-size:14px;
    line-height:28px;
    overflow-y:auto;
}
.chat-body-wrap .textarea-wrap textarea::-webkit-scrollbar{
    width:6px;background:transparent;
}
.chat-body-wrap .textarea-wrap textarea::-webkit-scrollbar-thumb{
    background:#3d4d6b;border-radius:3px;
}
.chat-body-wrap .send-btn{
    cursor: pointer;
    position:absolute;right:22px;bottom:12px;
    width:42px;height:42px;border-radius:50%;
    background:var(--c-primary);border:none;
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:18px;box-shadow:0 2px 8px rgba(0,0,0,.35);
    transition:.2s;
}
.chat-body-wrap .send-btn:hover{background:var(--c-primary-dark);}
.chat-body-wrap .send-btn.disabled{opacity:.4;pointer-events:none;}
.chat-body-wrap .send-btn i{font-size:22px;}

.chat-body-wrap .chat-input-box{resize:vertical;min-height:120px;max-height:500px;}

.chat-body-wrap .chat-input-box{cursor:n-resize;}


/* -------- 通用隐藏切换 -------- */
.chat-body-wrap .layui-hide{display:none !important}

/* 侧栏滚动条与正文一致 */
.chat-body-wrap .sidebar::-webkit-scrollbar{width:6px}
.chat-body-wrap .sidebar::-webkit-scrollbar-thumb{background:#4e5a74;border-radius:3px}


/* 上传文件块 */
.chat-body-wrap .upload-float{
    position:absolute;bottom:58px;left:18px;right:18px;
    max-height:120px;overflow-y:auto;
    display:flex;flex-wrap:wrap;gap:8px;
}
.chat-body-wrap .upload-float li{
    background:#48546b;padding:6px 10px;border-radius:6px;
    font-size:12px;color:#fff;display:flex;gap:6px;
    cursor:pointer;
}
.chat-body-wrap .upload-float li i{cursor:pointer;color:#ddd;}
.chat-body-wrap .upload-float li i:hover{color:#fff;}

.chat-body-wrap .sidebar-top select{background:#1e2635;color:#eee;border:none}

@keyframes blinkDot{0%{opacity:.4;}50%{opacity:1;}100%{opacity:.4;}}
.badge{animation:blinkDot 1.4s infinite;}

/*markdown样式扩展*/
/* ===== 气泡内通用 ===== */
.chat-page .bubble table{
    width:100%;
    border-collapse:collapse;
    margin:10px 0;
    font-size:14px;
}
.chat-page .bubble th,
.chat-page .bubble td{
    border:1px solid #4e5a74;
    padding:6px 10px;
    text-align:left;
    vertical-align:top;
    color:#e8e8e8;
}
.chat-page .bubble th{
    background: #466db975;
}
/* 图片在气泡里自适应、不撑破布局 */
.chat-page .bubble img{
    max-width:70%;
    border-radius:6px;
    display:block;
    margin:8px 0;
}

@keyframes ellipsis {
    0%   {content:"";}
    33%  {content:".";}
    66%  {content:"..";}
    100% {content:"...";}
}
.bubble.loading::after{
    content:"";
    /* ↑ 加这一句保证初始就有 content 属性 */
    display:inline-block;
    width:1em;
    animation:ellipsis 1.1s infinite steps(3,end);
    color:#FFD659;
    font-weight:700;
}
.msg-row.ai .bubble.loading{
    background:#2c3344;
    color:#FFD659;
}
/* Katex / MathJax 行内公式略放大一点，避免灰蒙蒙 */
.chat-page .bubble .katex{
    font-size:1.05em;
}
.chat-page .mopen,
.chat-page .mclose{
    padding-right: 3px;
    padding-left: 5px;
}

/*代码块*/
/* 代码块整体容器 */
pre.code-box{
    position:relative;
    margin: 14px 0;               /* 与正文间距 */
    padding: 10px 14px 14px;      /* 顶部留 32px 给工具条 */
    background:#0f131b;
    border-radius:8px;
    overflow:auto;
}

/* 工具条 */
.code-toolbar{
    position:absolute;
    top:10px;
    right:15px;
    left:15px;                    /* 让语言名靠左 */
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:13px;
    pointer-events:none;          /* 避免遮挡选中 */
}

.code-lang{
    color:#b5bdc9;
    font-family:Menlo,monospace;
    pointer-events:none;
}

/* 复制按钮 */
.copy-btn{
    pointer-events:auto;          /* 允许点击 */
    display:flex;align-items:center;justify-content:center;
    width:22px;height:22px;border-radius:4px;
    color:#bbb;font-size:16px;
    cursor:pointer;opacity:0.8;transition:.15s;
}
pre.code-box:hover .copy-btn{opacity:1;}
.copy-btn i{pointer-events:none;}
.copy-btn:hover{color: #fff;}
/* 气泡工具条里的图标 */
.msg-tools li[data-copy] i{ pointer-events:none; }
.chat-page a.layui-layer-btn1{
    color: #333;
}
.chat-page .tool-bar .layui-rate li i.layui-icon{
    font-size: 14px;
}

.msg-row.system .bubble{background:#34415a;color:#cfd4e1}

/* 工具栏—角色下拉深色主题 */
.role-select{
    width: 100%;
    min-width: 180px;
    height:32px;
    padding:3px 15px;
    border:none;
    border-radius:6px;
    background:#2c3344 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><polygon points="6,9 12,15 18,9" fill="%23aaa"/></svg>') no-repeat right 8px center;
    color:#eee;
    font-size:13px;
    appearance:none;-webkit-appearance:none;-moz-appearance:none;
    cursor:pointer;
    transition:border .2s;
}
.role-select:focus{outline:none;}
.role-select option{line-height:38px;}
.role-tips{
    padding-left: 15px;
    cursor: pointer;
}
.chat-page .bubble blockquote{
    border-left: 4px solid #2368c3;
    background: #0e10276b;
    margin:10px 0;
    padding:6px 10px;
    font-size:13px;
    color:#b8c2d1;
    border-radius: 4px;
}
.chat-page .bubble blockquote{
    border-left:4px solid #11c26d;
    background:#2c3344;
    padding:6px 12px;
    margin:10px 0;
}
.chat-page .bubble blockquote ul li{
    margin: 6px 0;
    line-height: 22px;
}
.chat-page .bubble p{white-space:pre-line;}


.chat-page .msg-row.system .bubble {
    background: #1a202c;
    color: #eee;
    padding-left: 16px;
}

.chat-page .msg-row.system .bubble blockquote {
    border-left: 4px solid #1e9fff;
    background: #26324b;
    padding: 6px 15px;
    margin: 10px 0;
    font-size: 14px;
    border-radius: 6px;
}

.chat-page .msg-row.system .bubble p {
    white-space: pre-line;
    font-size: 15px;
    line-height: 26px;
}

/*欢迎页*/
:root{
    --c-primary:#49C0F8;
    --c-gray:#9aa4b1;
    --c-dark:#1A202C;
    --c-card:#2b3344;
}
/* ====== HERO ====== */
.hero-area{
    max-width:1200px;                 /* 区域仍在中轴，但内部左对齐 */
    min-width: 400px;
    margin:15px 20px 30px 30px;
    padding:0 24px;
    text-align:left;
}

.hero-title{
    font-size:clamp(26px,5vw,42px);
    line-height:1.45;
    font-weight:700;
    color:#f5f7fa;
    margin-bottom:14px;
}

.hero-sub{
    font-size:clamp(18px,2.5vw,26px);  /* 大一号 */
    line-height:1.45;
    font-weight:500;
    color:#e0e4ee;                     /* 更亮一些 */
    margin-bottom:30px;
}

.brand{color:var(--c-primary);}

/* ====== BENEFIT LIST ====== */
.benefit-list{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(480px,1fr)); /* 两列自适应 */
    gap:8px 24px;
    list-style:none;
    margin:0 0 40px;
    padding:0;
    font-size:16px;
    color:#dfe4ec;
}

.benefit-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    line-height: 26px;
}

.benefit-list i{
    color:#59d3ff;               /* 品牌色 */
    font-size:18px;
    margin-top:2px;              /* 让勾对齐文本顶部 */
}

/* ====== GRID 卡片 ====== */
.model-area{
    max-width: 1000px;
    min-width: 600px;
    margin: 48px 20px 50px 50px;
    padding: 0 24px;
    text-align: left;
}
.model-area .area-title{
    display: block;
    color: #fff;
    font-size: 20px;
    line-height: 48px;
    text-align: left;
    margin-bottom: 20px;
}
.model-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
    gap:50px 40px;
    justify-content:center;
    max-width:1200px;
    margin:0 auto;
    align-items:start;
}
@media (max-width:960px){
    .model-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width:600px){
    .model-grid{
        grid-template-columns:1fr;
    }
}
/* ---- 单张模型卡 ---- */
.model-card{
    background:#263553fc;
    border-radius:14px;
    padding:26px 30px;
    display:flex;
    flex: 1;
    min-width: 360px;
    height: 260px !important;
    flex-direction:column;
    box-shadow:0 4px 14px rgba(0,0,0,.42);
    transition:.25s;
    cursor:pointer;
}
.model-card:hover{
    transform:translateY(-6px);
    box-shadow:0 8px 24px rgba(0,0,0,.55);
}
.model-name{
    font-size:22px;
    font-weight:600;
    margin-bottom:12px;
    color:#fff;
    text-align:left;
}
.model-intro{
    white-space:pre-line;                  /* 识别 \n */
    font-size:14px;
    line-height:32px;
    color:#c3cad7;
    flex:1 1 auto;                         /* 占满剩余 */
    overflow:hidden;
    -webkit-line-clamp:8;
    -webkit-box-orient:vertical;
    display:-webkit-box;text-align:left;
}
.model-meta{
    display:flex;
    justify-content:flex-end;
    font-size:14px;
}
.model-meta .price{color:#ffd659;font-weight:600;}

/* 角色卡片内部对齐优化 */
.role-card{
    display:flex;
    gap:10px;
    align-items:center;
}
.role-card .avatar{
    width:42px;height:42px;border-radius:50%;object-fit:cover;
}
.role-card .info strong{font-size:15px;color:#fff;}
.role-card .info small{font-size:13px;color:#c1c8d4;}

:root{
    /* AI 冷蓝主色 —— 已在上一条回复中用到 */
    --ai-r: 104;  --ai-g: 155;  --ai-b: 255;

    /* ===== 用户气泡主色：三选一，把其余两组注释掉 ===== */

    --user-r: 93;  --user-g: 83;  --user-b: 74;    /* #5D534A */
    --user-accent: #C29C6B;
}
.chat-page .msg-row.ai .bubble{
    /* 尺寸 & 位置 */
    max-width: 1200px;          /* 宽度撑到一定值即可换行 */
    margin-bottom: 15px;
    padding: 20px 25px 20px;

    /* 左→右线性渐变（90deg）——从左侧亮色过渡到完全透明 */
    background: linear-gradient(90deg, rgba(104, 155, 255, 0.18) 0%, rgba(104, 155, 255, 0.12) 35%, rgba(104, 155, 255, 0.06) 65%, rgb(104 155 255 / 7%) 100%);


    /* 暗色边框 + 轻微内阴影，增强分层 */
    border: 1px solid #1a202c;
    box-shadow: 4px 12px 12px #080808c4, inset 0 0 6px rgba(0, 0, 0, 0.35);

    /* 圆角 & 文本设置 */
    border-radius: 14px;
    color: #E3EAF4;
    line-height: 1.7;
    font-size: 15px;

    /* 毛玻璃：为深色背景增加一丝通透感（可选）*/
    backdrop-filter: blur(4px);
}

.msg-row.ai .bubble hr{
    border: 0;
    border-top: 1px solid rgba(255,255,255,0.15);
    margin: 14px 0;
}
.msg-row.ai .bubble p{
    line-height: 26px;
}
/* code 高亮示例，可根据你项目里的 highlight.js / prism.js 主题调整 */
.msg-row.ai .bubble code,
.msg-row.ai .bubble pre{
    color: #d1dce3;
    background: rgba(0,0,0,0.25);
}

@media (max-width: 480px){
    .msg-row.ai .bubble{
        padding: 14px 16px 16px;
        font-size: 14px;
    }
}

/* —— 发送遮罩 —— */
.chat-loading-mask{
    position:absolute;           /* 相对于 .chat-body-wrap */
    top:50px;                    /* 刚好盖在工具栏上方 */
    left:245px;                  /* 把左侧侧栏排除 */
    right:0;
    bottom:200px;                /* 不遮住输入框 */
    backdrop-filter:blur(2px);
    background:rgba(0,0,0,.35);
    z-index:110;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
.chat-loading-mask .loader{
    font-size:52px;
    height:60px;
    line-height:60px;
    color:#FFD659;
    letter-spacing:4px;
}
.chat-loading-mask .loader span{
    animation:blinkDot 1.2s infinite steps(3,end);
}
.chat-loading-mask .btn-stop{
    margin-top:26px;
    padding:6px 22px;
    background:#d36311;
    border-radius:8px;
    color:#fff;
    cursor:pointer;
    transition:.2s;
}
.chat-loading-mask .btn-stop:hover{background:#cd0000;}

/* —— 充值弹层 —— */
.recharge-box{
    border-radius:14px;
    padding:36px 38px 30px;
    min-width:340px;
    color:#fff;
}

/* 标题 + 副标题 */
.recharge-box h3{
    font-size:24px;
    font-weight:600;
    line-height:1.35;
    text-align:center;
    margin-bottom:26px;
}
.recharge-box h3 small{
    font-size:15px;
    font-weight:400;
    color:#FFD659;
    letter-spacing:.5px;
    margin-top:15px;          /* 行距 */
    display:inline-block;
}

/* 金额列表：2 行 3 列网格 */
.quick-amt{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px 16px;
    list-style:none;
    padding:0;
    margin:0 0 22px;
}
.quick-amt li{
    background:#334C88;
    border:2px solid transparent;
    border-radius:10px;
    height:60px;
    line-height:56px;
    font-size:18px;
    font-weight:600;
    color:#e6ecff;
    text-align:center;
    cursor:pointer;
    transition:.18s;
    user-select:none;
}
.quick-amt li:hover{
    transform:translateY(-2px);
    background:#37569e;
}
.quick-amt li.active{
    border-color:#49C0F8;
    background:#3C64A9;
    color:#fff;
}

/* 自定义金额输入框 */
.rc-input{
    width:100%;
    height:44px;
    line-height:44px;
    font-size:16px;
    text-align:center;
    background:#1f2e54;
    color:#e6ecff;
    border:none;
    border-radius:8px;
    margin-bottom:20px;
}

/* 提交按钮 */
.rc-submit{
    display:block;
    width:100%;
    height:46px;
    line-height:46px;
    font-size:17px;
    font-weight:600;
    background:#0f5145;
    border:none;
    border-radius:8px;
    transition:.2s;
}
.rc-submit:hover{background:#0d6277;}

/* 1) 输入框容器要能定位子元素 */
.chat-input-box{position:relative;}

/* 2) 小条 Loading——顶在输入框“正上方”并水平居中 */
.chat-loading-bar{
    position:absolute;
    top:-105px;                 /* 距输入框上边沿 38px */
    left:50%;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    gap:14px;
    z-index:9998;
}
.chat-loading-bar i{
    font-size:26px;
    color:#ffd659;
}
.chat-loading-bar .btn-stop{
    padding:4px 16px;
    background:#d36311;
    border-radius:8px;
    color:#fff;
    font-size:14px;
    cursor:pointer;
    transition:.18s;
}
.chat-loading-bar .btn-stop:hover{background:#cd0000;}

/* 3) 三点动画 —— 跟随文字并占 1.2em 宽度 */

/* 仍然在 chat-page 样式区域 */
@keyframes blinkDots{
    0%  {opacity:0}
    25% {opacity:1}
    50% {opacity:0}
    75% {opacity:1}
    100%{opacity:0}
}
.bubble.loading::after{
    content:"...";               /* 始终是三个点 */
    display:inline-block;
    width:auto;                 /* 固定宽度 → 不会换行抖动 */
    animation:blinkDots 1s steps(3,end) infinite;
}


/*口语测试-作文批改*/
.larryms-page .main-container {
    height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}
.larryms-student-container.main-service {
    /*width: calc(100% - 90px);*/
    /*margin-left: 90px;*/
}
.larryms-student-container.main-service .larryms-student-content{
    padding: 0;
}
.larryms-page .main-header {
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    backdrop-filter: blur(8px);
    background: #1a202c;
    box-shadow: 2px 6px 18px #000;
    margin-bottom: 0 !important;
    box-sizing: border-box;
    z-index: 9999;
}
.main-header .summary-bar{
    display:flex;
    align-items:center;
    gap:26px;
    font-size:14px;
    line-height: 35px;
    vertical-align: top;
    color:var(--fc-base);
}
.main-header .summary-bar h1{
    font-size: 18px !important;
    vertical-align: top;
    padding: 5px 0;
    line-height: 42px !important;
    white-space: nowrap;
    min-width: 80px !important;
}

.main-header .summary-bar span{
    vertical-align: top;
}
.main-header .summary-bar i.larry-icon{
    font-size:18px;
    color:var(--c-gold);
}
.main-header .summary-bar .stat{
    display:flex;
    gap:6px;
    align-items:center;
    padding-right: 5px;
}
.main-header .summary-bar .stat label{
    color:var(--c-gold-dark);
    font-size:14px;
    padding-right: 3px;
}
.main-header .summary-bar .stat b{
    color:var(--c-gold);
    font-weight:600;
    font-size: 16px;
    padding-right: 3px;
}
.main-header .summary-bar .btn-recharge{
    background:#d36311;
    border:none;border-radius:6px;
    padding:0 10px;font-size:14px;line-height:30px;
    color:#fff;display:flex;align-items:center;gap:6px;
    cursor: pointer;
    transition:.2s;
}
.main-header .summary-bar .btn-recharge:hover{
    background:#cd0000;
}
.main-header .summary-bar .btn-recharge i{font-size:16px;}

.main-header .user-info .img-photo{
    width: 38px;
    height: 38px;
    margin-top: 2px;
}

.essay-banner{
    position:sticky;          /* 固定在 chat-main 顶部随滚动 */
    top:0;
    z-index:1;
    padding:6px 12px;
    font-size:16px;
    color:#fff;
    height: 44px;
    line-height: 46px;
    background:#1D2533;
    box-shadow: 8px 6px 20px #080d14;
}
.essay-banner.warn{         /* 未选择时高亮提醒 */
    background:#1D2533;
    color:#1cc580;
}
.essay-banner a{
    color:#1e6bb8;
}
@media (max-width: 1201px){
    .main-header .summary-bar{
        gap: 10px;
    }
    .main-header .summary-bar .stat label{
        min-width: 40px;
        white-space: nowrap;
    }
    .main-header .summary-bar .btn-recharge{
        white-space: nowrap;
        min-width: 70px;
    }
}
/*-----------口语训练中心----------------*/
:root{
    --card-bg-1:#0E1D38;
    --card-bg-2:#1A4F9D;
    --card-border:#2C6CFF;
    --card-glow :#4B8DFF;

    --cta-bg-1  :#264FA3;  /* 亮 */
    --cta-bg-2  :#4B8DFF;  /* 亮 */
    --cta-deep-1:#123571;  /* 深 +25 % */
    --cta-deep-2:#2F6DFF;  /* 深 +25 % */
}

/* ===== aqua-teal ===== */
.theme-aqua{
    --card-bg-1:#00363C;
    --card-bg-2:#17A2A0;
    --card-border:#21C4BF;
    --card-glow :#4AF0E9;

    --cta-bg-1  :#146A68;
    --cta-bg-2  :#4AF0E9;
    --cta-deep-1:#064645;
    --cta-deep-2:#1CB0AC;
}

/* ===== neon-purple ===== */
.theme-purple{
    --card-bg-1:#2B0F3F;
    --card-bg-2:#7E2FFB;
    --card-border:#9A56FF;
    --card-glow :#C79AFF;

    --cta-bg-1  :#6538A8;
    --cta-bg-2  :#C79AFF;
    --cta-deep-1:#3F2674;
    --cta-deep-2:#9A56FF;
}

/* ===== emerald-green ===== */
.theme-green{
    --card-bg-1:#012B28;
    --card-bg-2:#0AAD5D;
    --card-border:#11C779;
    --card-glow :#43E8A5;

    --cta-bg-1  :#0B7C53;
    --cta-bg-2  :#43E8A5;
    --cta-deep-1:#034C34;
    --cta-deep-2:#23B47E;
}

/* ===== sunset-orange ===== */
.theme-orange{
    --card-bg-1:#341300;
    --card-bg-2:#C6420E;
    --card-border:#F05A28;
    --card-glow :#FF8B63;

    --cta-bg-1  :#8A2F00;
    --cta-bg-2  :#FF8B63;
    --cta-deep-1:#541B00;
    --cta-deep-2:#D66A3E;
}

/* =====（可选）黑金高阶按钮 ===== */
.theme-gold{
    /* CTA 按钮 */
    --card-bg-1: #000;
    --card-bg-2: #8c7d40;
    --card-border: #605228;
    --card-glow: #7c6415;
    --cta-bg-1: #1E1C13;
    --cta-bg-2: #c7a41d;
    --cta-deep-1: #0F0E09;
    --cta-deep-2: #9E8125;
}
/* ===== 右侧主体 ===== */
.speaking-wrapper{height:100vh;display:flex;flex-direction:column;padding:0;overflow:hidden}
.speaking-header{height:50px;display:flex;align-items:center;background:#1a202c;
    padding:0 24px;box-shadow:0 4px 12px #000;font-size:18px;color:#fff}
.speaking-main{
    max-width:1360px;
    width:100%;          /* 新增：撑满父级，避免 shrink */
    margin:0 auto;
    flex:1;overflow-y:auto;
    padding:26px 48px 60px;
    background:#2d3644;
    box-sizing: border-box;
    padding-right: 15px !important;
}
.speaking-title{
    display: block;
    width: 100%;
    text-align: center;
    color:#49C0F8;
    font-size:42px;
    font-weight:600;
    padding-top: 20px;
    margin-bottom: 60px;
}
/* ===== 卡片网格 ===== */
div.card-grid{
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) !important;
    gap:52px !important;          /* 上下 40；左右 48 */
    margin-top:40px !important;
    padding-bottom:40px !important;
}
/* ============= 卡片整体 ============= */
.s-card{
    position:relative;
    min-height:220px;
    padding:26px 28px 22px;
    display:flex;flex-direction:column;
    background:linear-gradient(135deg,var(--card-bg-1) 0%,var(--card-bg-2) 100%);
    border:none;
    border-radius:16px;
    box-shadow:0 6px 20px rgba(0,0,0,.35);
    backdrop-filter:blur(6px);          /* 轻玻璃 */
    transition:.28s cubic-bezier(.25,.8,.25,1);
    cursor:pointer;
}
.s-card:hover{
    /* Hover 再加一层“透亮蓝”高光 */
    background:
            linear-gradient(145deg,var(--card-bg-1) 0%,var(--card-bg-2) 100%),
            rgba(124,208,255,.08);                 /* 轻高光 */
    transform:translateY(-6px) scale(1.05);
    box-shadow:0 14px 36px rgba(0,0,0,.55);
    transform:translateY(-8px) scale(1.04);
}
.s-card{
    background:linear-gradient(145deg,var(--card-bg-1) 0%,var(--card-bg-2) 100%);
    transition:.28s cubic-bezier(.25,.8,.25,1);
}
.card-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(360px,360px)); /* 固定列宽 */
    gap:40px 48px;
    justify-content:center;       /* 把整张网格居中 */
}
@media (max-width:768px){
    .speaking-main{padding:20px 20px 40px;}
    .card-grid{gap:30px 32px;}
}
/* ============= 行1：标题 ============= */
.s-card-header{
    display:flex;
    flex-direction:row;   /* ← 关键：横向排列 */
    align-items:center;    /* 垂直居中 */
    justify-content:center;/* 水平居中整个 header */
    padding-top: 10px;
    gap:10px;              /* 图标与标题间距 */
    margin-bottom:24px;
}

.s-card-header i{
    font-size:34px;
    color:#8ad6ff;
}
.s-card-header h3{
    font-size:24px;
    font-weight:700;
    letter-spacing:.5px;
    color:#ffffff;
    text-shadow:0 1px 3px rgba(0,0,0,.25);
    margin:0;              /* 消除 h3 默认 margin */
}
/* ============= 行2：Tagline ============= */
.tagline{
    white-space:pre-line;
    text-align:left;
    font-size:15px;
    line-height:24px;
    color:#e5ecf4;
    flex:1;
    margin-bottom:20px;
}

/* ============= 行3：统计 ============= */
.stats{
    text-align:left;
    font-size:14px;
    color:#ffd659;
    margin-bottom:18px;
}

/* ============= 行4：CTA 按钮 ============= */
.cta-btn{
    align-self:center;
    display:flex;align-items:center;gap:6px;
    background:linear-gradient(90deg,var(--cta-bg-1) 0%,var(--cta-bg-2) 100%);
    padding:6px 26px;
    border-radius:24px;
    font-size:15px;
    color:#fff;
    transition:background .22s;
}
.s-card:hover .cta-btn{
    background:linear-gradient(90deg,var(--cta-bg-2) 0%,var(--cta-bg-1) 100%);
}

/* 角标 */
.lock-badge{
    position:absolute;top:10px;right:14px;
    background:#ffb400;color:#222;font-size:12px;font-weight:600;
    padding:1px 7px;border-radius:6px;pointer-events:none;
}

/* ============= 网格最小宽更新 ============= */
.card-grid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(360px,1fr));
    gap:26px 30px;margin-top:26px;
}


/*css补丁*/
.larryms-home-pages .course-list{
    padding-left: 30px;
}
/* =========================================================
   智能学习路径 · 整体容器背景
   =========================================================*/
.learning-container.path-empty{
    background:linear-gradient(to right,
    rgba(58,70,91,.45),
    rgba(65,81,107,.65),
    rgba(68,86,115,.85));
}
.learning-container.path-has{background:transparent;}

/* =========================================================
   标题栏
   =========================================================*/
.lp-title-bar{
    background:#16b777;
    padding:22px 20px 22px 10px;
    border-radius:12px;
    display:flex;align-items:center;margin-bottom:18px;
}
.lp-title-bar .title{
    color:#fff;font-size:16px;font-weight:600;letter-spacing:1px;
    padding-left:6px;
}
.lp-title-bar .toggle-btn{
    margin-left:auto;font-size:16px;color:#fff;cursor:pointer;
}
.lp-title-bar .toggle-btn:hover{opacity:.85}

/* =========================================================
   卡片盒
   =========================================================*/
.lp-card-box{
    display:flex;flex-direction:column;gap:26px;margin:26px 0;
}

/* =========================================================
   单张卡片
   =========================================================*/
.lp-card{
    width:100%;
    box-sizing: border-box;
    position:relative;
    margin:0 auto;
    background:linear-gradient(135deg,#33405a 78%,#2a3751 100%);
    border:2px solid #39475e;border-radius:16px;
    padding:22px 28px 18px;
    box-shadow:0 4px 18px rgba(0,0,0,.45);
    transition:.22s;
    display:flex;flex-direction:column;gap:14px;
}
.lp-card:hover{
    transform:translateY(-2px) scale(1.01);
    box-shadow:0 10px 30px rgba(0,0,0,.6);
    border-color:#49C0F8;
}
.lp-card.open{box-shadow:0 10px 34px rgba(0,0,0,.65);}

/* =========================================================
   顶行：阶段 + 课程名 + 折叠按钮
   =========================================================*/
.top-row{display:flex;align-items:center;justify-content:space-between;gap:16px;}

.left-box{

}

.phase-tag {
    color: #60849b;
    font-size: 24px;
    font-weight: 700;
    border-radius: 14px;
    white-space: nowrap;
}
.lp-card.open .phase-tag{
    color: #fff;
}
.course-name{
    font-size:18px;font-weight:600;white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis;color:#fff;
    padding-left: 20px;
}

.title-box{display:flex;align-items:center;gap:6px;min-width:0}

.title-box .layui-icon{
    font-size:18px;color:#9aa4b1;cursor:pointer;transition:.2s;
}
.title-box .layui-icon:hover{color:#fff}

/* =========================================================
   中行：左信息右圆环
   =========================================================*/
.mid-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.info-box{flex:1;min-width:0}
.lp-meta{
    font-size:14px;color:#aab2c6;line-height:22px;
}
.lp-meta i{
    padding-right: 5px;
}
.lp-targets{
    font-size:14px;line-height:22px;word-break:break-all
}
.lp-targets .larry-icon{font-size:14px;margin-right:4px}
.lp-targets span{margin-right:6px}
.lp-targets span.title{
    color:#ffd859;
}
.lp-targets span.targets {
    background: #2c95e3;
    color: #fff;
    border-radius: 10px;
    padding: 4px 10px;
}
/* 统一控高 + 圆角 */
.lp-progress{
    flex:1;
    min-width: 100px;
    max-width:260px;
    background-color: #263147;
}
.lp-progress .bar{
    transition:.4s
}
/*.lp-progress .txt{*/
/*    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);*/
/*    font-size:11px;font-weight:600;color:#fff;pointer-events:none}*/
/* 小屏自动纵向 */
@media(max-width:500px){
    .mid-row{flex-direction:column;align-items:flex-start;gap:10px}
    .circle-wrap{align-self:center;margin-top:4px}
}

/* =========================================================
   底行：按钮 + 查看章节
   =========================================================*/
.bot-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.bot-row .layui-btn-sm{
    height:30px;line-height:30px;font-size:13px;padding:0 18px;border-radius:6px;
}
.look-more{
    font-size:13px;color:#49C0F8;cursor:pointer;white-space:nowrap
}


/* =========================================================
   折叠章节列表
   =========================================================*/
.lp-sections{
    display:flex;flex-wrap:wrap;gap:10px;padding-top:14px;
    overflow-y:auto;
}
.lp-sections li{
    font-size:12px;padding:4px 10px;border-radius:14px;
    cursor:pointer;white-space:nowrap;user-select:none;transition:.18s;
}
.lp-sections li:hover{transform:translateY(-1px);}
.sec-todo   {background:#fff0ba;color:#b97c07}
.sec-review {background:#ffd9c3;color:#cf6a00}
.sec-future {background:#3d485d;color:#bcc4d6}
/* 如有 done 状态可追加 */
/*.sec-done   {background:#2f3b50;color:#7a8296}*/

/* =========================================================
   智能学习路径 · 右侧在线测评卡片（保持一致）
   =========================================================*/
.exam-type-cards-right{display:flex;flex-direction:column;gap:14px}
.exam-type-card-right{
    position:relative;border-radius:12px;background:#2c364b;
    color:#dfe4ee;padding:16px 20px;transition:.2s;cursor:pointer;
}
.exam-type-card-right:hover{border-color:#49C0F8;box-shadow:0 0 6px rgba(0,0,0,.45)}
.exam-type-card-right .subject-ribbon{
    position:absolute;top:-2px;right:-2px;
    background:#49C0F8;color:#fff;font-size:12px;
    padding:4px 26px;transform:rotate(45deg);box-shadow:0 3px 6px rgba(0,0,0,.4)}
.exam-type-card-right .exam-title{font-size:16px;font-weight:600}
.exam-type-card-right .badge{
    background:#FF5722;color:#fff;border-radius:10px;padding:0 8px;margin-left:6px;
    animation:breath 1.8s infinite alternate}
@keyframes breath{from{transform:scale(1)}to{transform:scale(1.18)}}
.exam-type-card-right .exam-label{font-size:12px;color:#9aa4b1;margin:6px 0 2px;display:block}
.exam-type-card-right .exam-count{font-size:12px;color:#9aa4b1}
.exam-button{text-align:center;margin-top:14px}
.exam-button .layui-btn-xs{padding:0 28px;font-size:12px}


/*作文批改*/
/* ================== 作文输入三行 ================== */
.essay-input-box{
    background:#181a1e;
    padding:14px 18px 20px;
    border-top:1px solid #313a4d;
    position: relative;
    display: flex;             /* 纵向排列子行 */
    flex-direction: column;
    resize: vertical;          /* 出现上下拖拽柄 */
    overflow: hidden;          /*   resize 必须配 overflow */
    min-height: 300px;         /* 起始高度 */
    max-height: 90vh;          /* 不超过视口 90% */
}
.writing-page .essay-input-box .row{
    flex: 0 0 auto;            /* 固定高度行 */
    align-items:center;margin-bottom:14px;font-size:14px;color:#c8d0e0
}
.essay-input-box .row label{min-width:92px;color:#9aa4b1}
.essay-input-box .row select,
.essay-input-box .row input{
    flex:1;height:38px;border:none;border-radius:6px;
    background:#2c3344;color:#eee;padding:0 10px;font-size:14px
}
.essay-input-box .row select{appearance:none;-webkit-appearance:none;background:#2c3344 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><polygon points="6,9 12,15 18,9" fill="%239aa4b1"/></svg>') no-repeat right 8px center}
.essay-input-box .row-body{position:relative;display:block;margin:0}
.essay-input-box .row-body textarea{
    width:100%;min-height:160px;max-height:380px;resize:vertical;
    background:#1a202c;border:none;border-radius:6px;
    color:#fff;font-size:14px;line-height:26px;padding:12px 50px 52px 12px;
    overflow-y:auto
}
.essay-input-box .essay-tool-bar{
    height: 50px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}
.essay-input-box .btn-upload{
    position:absolute;
    left:10px;
    top:0;
    font-size:38px;
    color:#77829a;
    cursor:pointer;
    transition:.2s
}
.essay-input-box .btn-upload i{
    font-size: 26px;
}
.essay-input-box .btn-upload:hover{color:#49C0F8}
.essay-input-box .btn-send{
    position:absolute;
    right:26px;
    bottom:10px;
    width:90px;
    height:34px;
    background:var(--c-primary);
    border:none;border-radius:6px;
    font-size:15px;
    color:#fff;
    cursor:pointer;
    transition:.18s;
    text-align: center;
    line-height: 34px;
}
.essay-input-box .btn-send.disabled,
.essay-input-box .btn-send[disabled]{opacity:.45;cursor:not-allowed}
.essay-input-box .btn-send:not(.disabled):hover{background:var(--c-primary-dark)}
/* 上传文件列表 */
.essay-input-box .upload-preview{
    position:absolute;left:12px;bottom:12px;right:116px;
    display:flex;gap:6px;flex-wrap:wrap;max-height:42px;overflow:auto
}
.essay-input-box .upload-preview li{
    background:#3d4d6b;padding:4px 8px;border-radius:6px;font-size:12px;
    color:#eee;display:flex;gap:4px;align-items:center;cursor:pointer
}
.essay-input-box .upload-preview i{cursor:pointer;color:#ddd;font-size:12px}
.essay-input-box .upload-preview i:hover{color:#fff}

.writing-page .layui-form-select dl{
    border: 1px solid #1a202c;
    background-color: #1d3159;
    color: #fff;
}
.writing-page .layui-form-select dl::-webkit-scrollbar{
    width: 8px;
    height: 8px;
}
.writing-page .layui-form-select dl::-webkit-scrollbar-track {
    background-color: rgba(14, 55, 101, 0.75); /* 背景色 */
}
/* 滚动块（滑块）颜色 */
.writing-page .layui-form-select dl::-webkit-scrollbar-thumb {
    background-color: rgba(126, 113, 113, 0.8); /* 滑块颜色 */
    border-radius: 6px; /* 可选，圆角 */
}

/* 滚动块悬停时的颜色（可选） */
.writing-page .layui-form-select dl::-webkit-scrollbar-thumb:hover {
    background-color: #021417;
}
.writing-page .layui-form-select dl dd.layui-this{
    background-color: #050c1a;
    color: #16b777;
}
.writing-page .layui-form-select dl dt, .layui-form-select dl dd{
    color: #fff;
}
.writing-page .layui-form-select dl dt, .layui-form-select dl dd:hover{
    background-color: #666666;
    color: #fff;
}

.writing-page .card          {background:#fff;border-radius:6px;padding:18px;margin-bottom:16px}
.writing-page .submit-text   {background:#f7f8fa;border-radius:4px;padding:12px;white-space:pre-wrap}
.writing-page .file-list li  {margin:4px 0;cursor:pointer;color:#1e88ff}
.writing-page .file-list li:hover{text-decoration:underline}
.writing-page .essay-tool-bar{display:flex;align-items:center;margin-top:8px}
.writing-page .essay-tool-bar .btn-upload{cursor:pointer;margin-right:8px;color:#1e88ff}
.writing-page .essay-tool-bar .btn-send{margin-left:auto}
.writing-page .origin-text   {background:#fafafa;padding:12px;border-radius:4px}
.writing-page .ai-loading{text-align:center;padding:60px 0;color:#999}
.writing-page .score-card{display:flex;gap:28px;align-items:center}
.writing-page .score-card .sc-left{font-size:46px;color:#ff5722;text-align:center}
.writing-page .score-card ul{flex:1}
.writing-page .msg-row{display:flex;margin-bottom:12px}
.writing-page .msg-row .bubble{background:#f5f5f5;padding:10px;border-radius:6px;max-width:70%}
.writing-page .msg-row.me       {flex-direction: row-reverse}
.writing-page .msg-row.me .bubble{background:#1e88ff;color:#fff}

.writing-page .essay-input-box{
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 300px;           /* 初始高度 */
    max-height: 90vh;            /* 不超过视口 90% */
    resize: vertical !important; /* 出现上下拖拽柄 */
}
.writing-page .essay-input-box>form{
    flex:1 1 auto;
    display:flex;flex-direction:column;
    overflow:hidden;
}
.writing-page .essay-input-box .row-body{
    flex: 1 1 auto;            /* 跟随父盒子增高 */
    display: flex;
    flex-direction: column;    /* 里面纵向：textarea + tool-bar */
    position: relative;        /* 供按钮栏绝对定位 */
    margin: 0;                 /* 已写，可保持 */
}
.writing-page .essay-input-box .row-title .layui-textarea{
    background: #1A202C;
    border-radius: 6px;
    border: 1px solid #1A202C;
    min-height: 60px;
    height: 80px;
    color: #fff;
    line-height: 26px;
}
/* textarea 100% 填充 row-body，取消旧的固定 min/max */
.writing-page .essay-input-box .row-body textarea{
    flex: 1 1 auto;             /* 关键：在 flex 中可拉伸 */
    min-height: 0 !important;   /* 覆盖 layui-textarea 的 100px */
    max-height: none !important;
    resize: none !important;    /* 不单独拖 textarea */
    box-sizing: border-box;
    padding: 12px 50px 60px 12px;/* 底部 60px 留给工具栏 */
    overflow-y: auto;
}
/* 按钮栏固定在 row-body 底部 */
.writing-page .essay-tool-bar{
    position:absolute;
    left:0; right:0; bottom:0;
    height:50px;               /* 与 padding-bottom 对应 */
    display:flex; align-items:center;
}
.writing-page .chat-body-wrap .chat-content{
    position: relative;
}
/* 遮罩层 */
.writing-page .mask-loading{
    position: absolute;                 /* 相对 chat-content */
    left:0; right:0; top:0; bottom:0;
    background: rgba(0,0,0,.55);        /* 深色半透明 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 20;
    pointer-events: auto;               /* ↓两种交互方案：二选一 */
}
/* ① 完全禁止正文区点击：保持 pointer-events:auto (默认) */
/* ② 仅显示动画，不拦截点击：改成 pointer-events:none */

/* 文案颜色微亮 */
.writing-page .mask-loading p{
    margin-top: 12px;
    color: #c9d1e8;
}
.writing-page .chat-body-wrap .sidebar{
    padding: 15px 12px;
    min-width: 245px;
}
.writing-page .chat-body-wrap .topic-list{
    overflow-y: auto;
    padding-top: 6px;
    padding-right: 4px;                /* 露出滚动条 */
}
.writing-page .chat-body-wrap .topic-list::-webkit-scrollbar{width:6px}
.writing-page .chat-body-wrap .topic-list::-webkit-scrollbar-thumb{
    background:rgba(120,130,150,.45);border-radius:4px
}

/* ───── 卡片本体 ───── */
.writing-page .chat-body-wrap .essay-card{
    position: relative;
    background: linear-gradient(135deg,#2c3344 0%,#232a36 100%);
    color:#dce1ee;
    padding:10px 12px;
    border-radius:8px;
    display:flex;flex-direction:column;justify-content:space-between;
    height:100px;                      /* 与答疑卡统一 */
    margin-bottom:8px;
    cursor:pointer;
    border:1px solid transparent;
    box-shadow:1px 3px 12px #000000e0;
    transition:transform .18s,box-shadow .18s,border-color .18s;
}

/* Hover 微浮起 */
.writing-page .chat-body-wrap .essay-card:hover{
    transform:translateY(-2px);
    box-shadow:0 6px 14px rgba(0,0,0,.7);
}

/* 选中态（active） */
.writing-page .chat-body-wrap .essay-card.active{
    border-color:#49c0f8;
    box-shadow:0 0 0 1px #49c0f8,inset 0 0 12px rgba(73,192,248,.35);
}

/* ------ 内部文字 ------ */
.writing-page .chat-body-wrap .essay-card .ttl{
    font-size:14px;font-weight:500;
    line-height:1.35;
    display:-webkit-box;
    -webkit-line-clamp:2;              /* clamp2 在 Safari/Chrome 生效 */
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.writing-page .chat-body-wrap .essay-card .meta{
    font-size:12px;color:#9aa4b1;
    display:flex;justify-content:space-between;align-items:center;
    margin-top:4px;
}
.writing-page .chat-body-wrap .essay-card .meta span:not(:last-child){margin-right:6px}

/* 删除图标 */
.writing-page .chat-body-wrap .essay-card .del{
    font-size:16px;color:#8f98ad;margin-left:6px;transition:.2s
}
.writing-page .chat-body-wrap .essay-card .del:hover{color:#ff776c}

.empty-essay-tip{
    width:100%;height:100%;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    color:#6f798e;text-align:center;pointer-events:none;user-select:none
}
.empty-essay-tip i{
    font-size:46px;color:#49c0f8;margin-bottom:12px;
}

.writing-page .card.origin{
    background:#101827;                /* 深底 */
    border:1px solid #28334b;
    border-radius:10px;
    box-shadow:0 6px 14px rgba(0,0,0,.55);
    color:#dfe3ee;
    padding:22px 24px 20px;
    position:relative;
}

/* 标题 */
.writing-page .card.origin h3,
.oral-page .card.origin h3{
    font-size:18px;font-weight:600;margin-bottom:10px;
    color:#49c0f8;
}
.writing-page .card.origin p{
    margin-bottom: 12px;
    line-height: 24px;
}
.writing-page .card.origin p span{
    display: inline-block;
    padding-right: 30px;
}
    /* 正文区域 */
.writing-page .card.origin pre{
    overflow:auto;
    background:#1a2336;border:1px solid #2b3550;
    box-shadow: 8px 12px 20px #000;
    border-radius:8px;padding:12px 15px;
    line-height:26px;font-size:14px;
    white-space:pre-wrap;color:#d6dced;
    margin-bottom: 20px;
    margin-top: 10px;
}
.toggle-btn{
    padding: 0 16px !important;
}

.writing-page .card.origin .layui-btn{
    padding:0 22px;
    height:34px;
    line-height:34px;
    margin-left: 30px;
}
.writing-page .card.origin .fail-msg{margin-left:8px;color:#ff776c;font-size:12px;}

.writing-page .submit-text.collapsed{
    max-height:252px;
    overflow:auto;
}

.writing-page .err-mark{
    background:#ffecec;
    border-bottom:1px solid #ff5722;
    color:#ff5722;
}
.writing-page .chart-box.radar{width:100%;height:260px}
.writing-page .chart-box.pie  {width:100%;height:240px}



/******************************************************************
* 统一卡片基类
******************************************************************/
.writing-page .card{
    background:#0f1626;                     /* 深底 */
    border:1px solid #27324a;
    border-radius:10px;
    box-shadow:0 6px 14px rgba(0,0,0,.55);
    color:#dfe3ee;
    padding:22px 24px;
    margin-bottom:24px;
    min-width: 850px;
}
.writing-page .card h3{
    font-size:18px;
    font-weight:600;
    color:#49c0f8;
    margin-bottom:12px;
}
.writing-page .card h4{
    font-size:16px;
    font-weight:500;
    color:#49c0f8;
    margin:15px 0;
}
.writing-page .meta-bar span{
    display:inline-block;
    padding-right:28px;
    line-height:24px;
    font-size:14px;
}

/******************************************************************
* 1. 原文标注（错因定位）
******************************************************************/
.writing-page .card.origin pre{
    background:#1a2336;
    border:1px solid #2b3550;
    border-radius:8px;
    padding:12px 15px;
    font-size:14px;
    line-height:26px;
    color:#d6dced;
    overflow:auto;
    margin:10px 0;
}
.writing-page mark{
    background:#ff5555;
    color:#fff;
    padding:0 2px;
    border-radius:2px;
}
.writing-page .toggle-btn{padding:0 14px!important;}
.writing-page .fail-msg{
    margin-left:8px;
    color:#ff776c;
    font-size:12px;
}

/******************************************************************
* 2. 综合得分 + 写作雷达
******************************************************************/
.writing-page .score-radar{
    display:block !important;
    align-items:center;
    justify-content:space-between;
    height:auto !important;
}
.writing-page .score-radar .score-left{min-width:420px;text-align:center;height: 365px;}
.writing-page .radar-box{width:300px;height:300px;margin:0 auto;}
.writing-page .score-radar .score-mid{
    min-width:220px;text-align:center;
}
.writing-page .score-radar .overall{
    font-size:50px;
    color:#ffd659;
}
.writing-page .score-radar .score-right{
    flex:1;
    list-style:none;
    margin:0;
    padding-left:30px;
}
.writing-page .score-right li{
    display:flex;
    justify-content:space-between;
    margin:6px 0;
}
.writing-page .dim-name{color:#9cb4d8;}
.writing-page .dim-val{color:#49c0f8;}

/******************************************************************
* 3. 智能纠错
******************************************************************/
.writing-page .ic-card{background:#161e2f;}
.writing-page .ic-card .ic-item{
    background:#1d273a;
    border-left:3px solid #ff5722;
    border-radius:6px;
    padding:12px 14px;
    margin-bottom:14px;
}
.writing-page .ic-card .ic-item p{margin:5px 0;}
.writing-page .ic-card b{color:#49c0f8;}

/******************************************************************
* 4. 整体点评
******************************************************************/
.writing-page .review-card{background:#131c2e;}
.writing-page .review-card div{line-height:24px;font-size:14px;}

.dim-review      {margin:0;padding:0;list-style:none;}
.dim-item        {margin-bottom:16px;}

.dim-head        {display:inline-flex;align-items:center;gap:10px;} /* 左对齐+间隔 */
.dim-name        {font-size:16px;font-weight:600;color:#49c0f8;}    /* 放大字号 */
.dim-score       {min-width:34px;height:22px;line-height:22px;
    text-align:center;border-radius:4px;
    font-weight:700;color:#222;}

/* 彩色分数胶囊（可根据分段自行调整） */
.badge-high {background:#3fb25f;}   /* ≥7 */
.badge-mid  {background:#49c0f8;}   /* 4–6 */
.badge-low  {background:#ff5722;}   /* 0–3 */

.dim-comment     {margin-top:4px;font-size:13px;line-height:1.6;color:#c9d1e6;}
/******************************************************************
* 5. 词汇分布
******************************************************************/
.writing-page .vocab-card{background:#0f1b2a;}
/* echarts 自适应父容器，无需额外样式 */

/******************************************************************
* 6. 提升指南
******************************************************************/
.writing-page .improve-card{background:#102030;}
.writing-page .improve-card ul{
    padding-left:18px;
    margin:4px 0 10px;
}
.writing-page .improve-card li{
    line-height:24px;
    margin:2px 0;
}

/******************************************************************
* 7. 高分范文
******************************************************************/
.writing-page .sample-card{
    background:#182437;
}
.writing-page .sample-card div{
    line-height:26px;
    font-size:14px;
    white-space:pre-wrap;
}

/******************************************************************
* 追问聊天气泡（保持原有）
******************************************************************/
.writing-page .msg-row{
    display:flex;
    margin:18px 0;
}
.writing-page .msg-row .avatar{
    width:36px;height:36px;border-radius:50%;
    margin-right:10px;
}
.writing-page .msg-row .bubble{
    max-width:85%;
    background:#1d273a;
    border:1px solid #2b3550;
    border-radius:8px;
    padding:10px 14px;
    line-height:22px;
    font-size:14px;
    color:#dfe3ee;
}
.writing-page .msg-row.me .bubble{background:#254066;border-color:#2f4d74;}

/* ============ 通用左右分栏卡片 ============ */
.writing-page .split-card .split-body{display:flex;gap:28px;}
.writing-page .split-card .split-left,
.writing-page .split-card .split-right{flex:1;min-width:0;}

.writing-page .split-left .origin-text{
    background:#1a2336;border:1px solid #2b3550;border-radius:8px;
    padding:12px 15px;font-size:14px;line-height:26px;color:#d6dced;
    overflow:hidden;               /* 默认无滚动 */
    min-height:300px;              /* 最高优先 */
}

/* 右侧可滚动 */
.writing-page .split-right{
    display:flex;
    flex-direction:column;
    min-height:0;                 /* 关键 */
}

/* 纠错条 */
.writing-page .ic-item{
    background:#1d273a;border-left:3px solid #ff5722;
    border-radius:6px;padding:12px 14px;margin-bottom:12px;
    cursor:pointer;transition:background .2s;
}
.writing-page .ic-item:hover{background:#25324a;}
.writing-page .ic-item.sel{
    background:#32405c;border-left-color:#49c0f8;
}

/* 标记高亮、闪烁 */
mark{background:none;color:#ff5555;padding:0 2px;border-radius:2px;}
mark.sel{background:#ffb347;color:#000;}
@keyframes blinkKey{0%,100%{background:#ffb347}50%{background:#ffd27f}}
mark.blink{animation:blinkKey .8s linear 1;}

/* 1-1  顶部基础信息 */
.writing-page .meta-bar.large{
    font-size:20px;
    font-weight:500;
    margin-bottom:16px;
    color: #49C0F8;
}
.writing-page .meta-bar.large span{
    padding-right:34px;
    font-size:16px;
    font-weight:500;
}
.writing-page .card .split-body h3.split-title{
    padding-bottom: 10px;
    color: #4672ad !important;
    font-size: 16px;
    flex:0 0 auto;
}
/* 1-2  左侧 mark 样式：默认只有文字色 */
.writing-page mark{
    color:#ff5555;
    background:none;
    padding: 5px 8px;
    border-radius:4px;
    cursor: pointer;}
.writing-page mark.sel{background:#ffb347;color:#000;}   /* 选中时高亮 */

/* 1-3  右侧布局：标题固定、列表滚动 */
.writing-page .split-right{display:flex;flex-direction:column;}
.writing-page .split-right h3{flex:0 0 auto;margin-bottom:8px;}
.writing-page .split-right .err-list{
    flex:1 1 auto;                /* 自动占满 */
    min-height:0;
    overflow-y:auto;
    padding-right: 8px;
    box-sizing: border-box;
}
/* 右侧普通/选中配色 */
.writing-page .ic-item{
    background:#222d42;border-left:3px solid #394867;
    border-radius:6px;padding:10px 12px;margin-bottom:10px;
    cursor:pointer;transition:background .2s;
}
.writing-page .ic-item:hover{background:#263450;}
.writing-page .ic-item.sel{
    background:#354769;border-left-color:#49c0f8;
}
.writing-page .ic-item p{margin:4px 0;font-size:13px;line-height:20px;}
.writing-page .ic-item .raw   {color:#ffc072;}
.writing-page .ic-item .reason{color:#ff7b7b;}
.writing-page .ic-item .fix   {color:#8dffa3;font-style:italic;}


/* 2-1 六角雷达中文 indicator 已在 JS 用 name_zh，若仍英文检查 dimInfo */
.writing-page .radar-title{
    text-align:center;color:#7fa6d5;font-size:14px;margin-top:6px;
}

/* 2-2 让卡片高一点 + 字体大 */
.writing-page .score-radar .overall{font-size:60px;}
.writing-page .score-right li{font-size:14px;}

.writing-page .score-radar{min-height:250px;}
.writing-page .radar-box{width:300px;height:300px;}

/* 左侧点评滚动，右侧建议固定高度（如果内容多右侧自滚） */
.writing-page .review-box{}
.writing-page .review-box div{max-height:400px;line-height:24px;font-size:14px;overflow-y:auto;}

.writing-page .improve-card .split-right{overflow-y:auto;}
.writing-page .improve-card li{list-style:disc inside;margin:4px 0;color:#d0d7e6;}


.writing-page .sample-card div{
    font-size:14px;
    line-height:24px;
    white-space:pre-wrap;
    margin-left:2px;
}
.writing-page .sample-card div p{margin:8px 0;}

.writing-page .chat-body-wrap{
    display:flex;
    min-width:600px;            /* 关键：允许子元素被压缩 */
}
.writing-page .chat-main{
    flex:1 1 auto;
    min-width:600px;
    display:flex;
    flex-direction:column;
}
.writing-page .chat-content{
    flex:1 1 auto;
    min-width:0;
    overflow-y:auto;
    padding:18px 22px;
    background:radial-gradient(circle at 50% 0%,#22304a 0,#1A202C 100%);
}
.writing-page .chat-input,
.writing-page .essay-input-box{
    flex:0 0 auto;
}

/* 仅作用于作文批改卡片内部的滚动容器 */
.writing-page .submit-text,
.writing-page .origin-text,
.writing-page .review-box,
.writing-page .err-list{
    scrollbar-width: thin;              /* Firefox */
    scrollbar-color:#3c4f6c #0f1626;    /* thumb  track */
    overscroll-behavior: contain;
}

/* Chrome / Edge / Safari */
.writing-page .submit-text::-webkit-scrollbar,
.writing-page .origin-text::-webkit-scrollbar,
.writing-page .review-box::-webkit-scrollbar,
.writing-page .err-list::-webkit-scrollbar{
    width:8px;
}
.writing-page .submit-text::-webkit-scrollbar-track,
.writing-page .origin-text::-webkit-scrollbar-track,
.writing-page .review-box::-webkit-scrollbar-track,
.writing-page .err-list::-webkit-scrollbar-track{
    background:#0f1626;                 /* 与卡片同色 */
    border-radius:4px;
}
.writing-page .submit-text::-webkit-scrollbar-thumb,
.writing-page .origin-text::-webkit-scrollbar-thumb,
.writing-page .review-box::-webkit-scrollbar-thumb,
.writing-page .err-list::-webkit-scrollbar-thumb{
    background:#3c4f6c;                 /* 略深 */
    border-radius:4px;
}
.writing-page .submit-text::-webkit-scrollbar-thumb:hover,
.writing-page .origin-text::-webkit-scrollbar-thumb:hover,
.writing-page .review-box::-webkit-scrollbar-thumb:hover,
.writing-page .err-list::-webkit-scrollbar-thumb:hover{
    background:#49607f;
}
.writing-page .essay-question{
    color:#7a8085;
    font-size: 14px;
}
.writing-page .essay-question b{
    color:#1ccd9e;
}
/*css优化*/
.score-mid .overall{font-size:80px;color:#FFD659;}
.score-mid .overall-label{margin-top:4px;font-size:15px;color:#7fa6d5;}



.float-chat{
    position:fixed;right:28px;bottom:28px;
    width:56px;height:56px;border-radius:50%;
    background:#49c0f8;color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:28px;cursor:pointer;z-index:999;
    box-shadow:0 4px 12px rgba(0,0,0,.45);
}
.float-chat:hover{background:#67d2ff}

/* 1-B 让三块内容占等宽 */
.score-radar .score-body{
    display:flex;
    justify-content:space-between;
    gap:24px;
    margin-top:12px;               /* 与标题拉开距离 */
}
.score-left,.score-mid,.dim-table{flex:1 1 0}
.oral-page .score-radar .score-left{min-width:420px;text-align:center;height: 300px;}
.oral-page .dim-table{height: 300px !important;}
.score-left{display:flex;flex-direction:column;align-items:center}
.score-mid{display:flex;flex-direction:column;align-items:center;justify-content:center}



/* 2-B 左右布局 */
.diag-card .split-body{
    display:flex;
    gap:28px;
}
.review-box       {flex:1 1 0;overflow-y:auto;}
.improve-box      {flex:1 1 0;overflow-y:auto;}


/* 2-C 列表样式 */
.dim-review{
    box-sizing: border-box;
    padding-right: 20px;
}
.dim-review li{
    margin:6px 0;
    line-height:22px;
    box-sizing: border-box;
}
.improve-box ul   {list-style:disc inside;margin:4px 0 12px;color:#d0d7e6;}

/********************* Ⅰ. 写作评分总览  *********************/

/* 1. 标题、子标题进一步放大 */
.radar-title    {font-size:16px;color:#b9d4ff;margin-top:10px;}

/* 2. 主体三栏保持垂直居中 */
.score-radar .score-body{
    display:flex;align-items:center;gap:40px;margin-top:6px;
}
.score-left,.score-mid,.dim-table{flex:1 1 0;}

/* 3. 雷达图容器 & 字体放大 */
#radarChart{width:340px;height:340px;}
/* ECharts 顶点 label 文字（全局改） */
.radar-box text{font-size:14px!important;}

/* 4. 中间综合分数字更突出 */
.score-mid .overall      {font-size:78px;font-weight:800;color:#ff9759;}
.score-mid .overall-label{margin-top:14px;font-size:18px;color:#dbe2ff;}
.score-body{display:flex;align-items:center;gap:40px;}
/* 5. 维度行：左对齐，名称→固定间距→分值 */
.dim-table{
    display:flex;               /* 列自身也是 flex-column */
    flex-direction:column;
    flex:1 1 0;
    min-width:0;
    height: 365px;
}
/* dim-box 自动填满，评分行在中间垂直居中 */
.dim-box{
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:20px;
}

/* 维度行 */
.dim-row{
    display:inline-flex;
    align-items:center;
    font-size:16px;
}
.dim-name{
    color:#e7ecf6;
    margin-right:12px;
    white-space:nowrap;
    min-width: 150px;
}
.dim-val {
    font-size:20px;
    font-weight:700;
    color:#ffb64d;
}

/* ⓘ 图标 */
.tip-icon{
    font-size:16px;
    color:#8fa6c9;
    margin-left:6px;
    cursor:pointer;
}
.tip-icon:hover{color:#49c0f8;}

/* 列底部标题 */
.dim-title{
    margin-top:auto;            /* 把自己压到列底 */
    align-self:center;          /* 水平居中 */
    font-size:16px;
    color:#b9d4ff;
    margin-bottom:4px;
}
/*************** Ⅱ. 智能诊断报告  *********************/

/* 1. 整体点评块：浅色背景条 + 间隔线 */
.diag-card .overall-comment{
    background:#172237;
    padding:15px 16px;
    margin-top: 15px;
    margin-bottom: 10px;
    border-radius: 8px;
    font-size:15px;
    line-height:24px;
    color:#e8ecf4;
}

/* 2. 左右栏保持滚动且层次分明 */
.diag-card .split-body{display:flex;gap:36px;}
.review-box,.improve-box{flex:1 1 0;overflow-y:auto;}

/* 3. 维度点评：名称高亮，内容常规色 */
.dim-review li{
    color: #a7b2c7;
    font-size: 13px;
    line-height:26px;
    background: #172237;
    padding: 8px;
    border-radius: 6px;
    margin-bottom: 12px;
}
.dim-review li b{
    color:#bbb;                     /* 湖蓝高亮维度名 */
    font-weight:600;margin-right:6px;
}
.dim-review li{color:#cfd6e8;}
/* 4. 提升建议列表样式 */
.improve-box h4{margin:10px 0 6px;font-size:16px;color:#ffd659;}
.improve-box ul{
    list-style:disc inside;
    margin-bottom: 0;
    padding-left:4px;color:#d0d7e6;
}
.improve-box li{margin:4px 0;line-height:22px;}

/* 5. 小屏适配（≤1200 折两行） */
@media (max-width:1200px){
    .score-radar .score-body{flex-wrap:wrap;}
    .score-left,.score-mid,.dim-table{flex:1 1 48%;}
    .score-mid   {margin-top:16px;}
}

/* 遮罩层 */
.writing-page .mask-loading{
    position:absolute;             /* 相对 chat-content 容器 */
    inset:0;                       /* top/right/bottom/left 全 0 */
    background:rgba(15,25,45,.5);  /* 深蓝半透明 + 50% */
    backdrop-filter:blur(4px);     /* 毛玻璃高级感 */
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:20;
    pointer-events:auto;
}

/* 内部盒子 */
.mask-loading .loader{
    text-align:center;
    color:#dde3f9;
    animation:fadeIn .4s ease-out;
}

.mask-loading i{
    font-size:64px;
    color:#49c0f8;                 /* 主色调 */
}

/* 主文案 */
.mask-loading p{
    margin-top:18px;
    font-size:18px;
    line-height:1.6;
    letter-spacing:1px;
    color:#eaf1ff;
    text-shadow:0 1px 3px rgba(0,0,0,.4);
}
.mask-loading p small{
    font-size:14px;
    opacity:.85;
}

/* 进入动画（可选） */
@keyframes fadeIn{
    0%{opacity:0;transform:scale(.9);}
    100%{opacity:1;transform:scale(1);}
}

.no-err-tip{
    padding:18px 12px;
    text-align:center;
    color:#9db0d9;
    font-size:15px;
}
.no-err-tip .larry-icon{margin-right:6px;color:#5fb878;}

.review-box.full{flex:1;width:100%;}


/* 原文区独占时拉满 */
.split-left.full{flex:1;width:100%;}

/* Perfect 提示标签 */
.perfect-tag{
    margin-left:12px;
    font-size:14px;
    color:#5fb878;
}
.perfect-tag .larry-icon{margin-right:4px;}

/*语言细节指标*/
.writing-page .card-title{font-size:18px;font-weight:600;margin-bottom:12px;}
.writing-page .metric-list{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px 100px;
    margin-top:20px;
    font-size:14px;
    list-style:none;
    padding:0;
}

@media (max-width: 1400px) {
    .writing-page .metric-list{
        display:grid;
        grid-template-columns:repeat(3,1fr);
        gap: 15px 80px;
    }
}
/* 语言细节指标列表 */
.writing-page .metric-list li{
    flex:1 1 280px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:15px;
    line-height:24px;
    color:#d0d7e6;
}
.writing-page .metric-list li span.value{
    color: #189dff;
    font-size: 18px;
}
.writing-page .metric-list .v{color:#fff;font-weight:700;}

/* ECharts 内文字更亮 */
#langBarChart text{fill:#dfe5ff!important;}

/* 让两栏同宽 */
.diag-card .split-body {display:flex;gap:24px}
.diag-card .review-box {flex:1;height: auto}
.dim-review li{margin-bottom:14px;padding-bottom:10px;border-bottom:1px dashed #384662}
.dim-head{display:flex;justify-content:space-between;align-items:center}
.badge-high{background:#4caf50;color:#fff;padding:0 6px;border-radius:4px}
.badge-mid {background:#ff9800;color:#fff;padding:0 6px;border-radius:4px}
.badge-low {background:#f44336;color:#fff;padding:0 6px;border-radius:4px}
.improve-box{margin-top:24px}
.improve-box h5{margin:6px 0;font-weight:600}

.improve-box{
    display:flex;
    gap:24px;
    margin-top:5px;
}
.improve-col{
    flex:1;
}
.improve-col h5{
    margin:6px 0 8px;
    font-weight:600;
    color:#ffd659;
}
.improve-col ul{
    list-style:disc inside;
    padding-left:4px;
}
/* 录音输入区 */
.speak-input           {position:relative;width:100%;min-height:300px;background:#1b243a;border-radius:6px;overflow:hidden}
.wave-container        {position:absolute;left:0;right:0;top:0;bottom:60px;z-index: 1}   /* 60px 给按钮条 */
.wave-container .waves {width:100%;height:100%}

.ctrl-bar              {position:absolute;left:0;right:0;bottom:0;height:60px;display:flex;align-items:center;justify-content:center;background:#111a2d}
.ctrl-bar .layui-btn   {margin:0 6px}
.ctrl-bar .timer       {color:#49c0f8;font-size:18px;margin-left:12px;min-width:60px;text-align:center}

.preview-bar           {position:absolute;left:0;right:0;top:0;bottom:60px;padding:12px;background:#0f182b;display:flex;flex-direction:column;justify-content:center;align-items:center}
.preview-bar audio     {width:90%}
.preview-bar .preview-btns{margin-top:12px}

.wave-container        {position:absolute;left:0;right:0;top:0;bottom:60px;}
.wave-container .waves {width:100%;height:100%;}

.mic-icon{
    display: block;
    width: 100px;
    height: 120px;
    position:absolute;
    left:50%;
    top:60%;
    z-index: 9999;
    transform:translate(-50%,-50%);
    text-align:center;
    font-size:48px;
    color:#49c0f8;
    opacity:.45;pointer-events:none
}
.mic-icon i.larry-icon{
    width: 100px;
    height: 60px;
    font-size: 46px;
    margin-bottom: 10px;
}
.mic-icon .timer{
    display:block;
    width: 100%;
    height: 50px;
    font-size:26px;
    color:#49C0F8;
    opacity:.9;
    line-height: 50px;
    text-align: center;
}
.wave-container{position:absolute;left:0;right:0;top:0;bottom:60px}
.wave-container .waves{width:100%;height:100%}


/* 整个侧栏滚动条一致 */
.topic-list::-webkit-scrollbar{
    width:6px;
}
.topic-list::-webkit-scrollbar-thumb{
    background:#4e5a74;border-radius:3px;
}

/* 口语任务卡片 —— 与作文 .essay-card 相同基调 */
.oral-card{
    position:relative;
    background:linear-gradient(135deg,#2c3344 0%,#232a36 100%);
    padding:10px 12px;
    border-radius:8px;
    box-shadow:1px 3px 12px #000000e0;
    margin-bottom:8px;
    cursor:pointer;
    transition:.18s;
    color:#dce1ee;
    height:100px;                     /* 与其它业务保持一致高度 */
    display:flex;flex-direction:column;justify-content:space-between;
}

/* 选中高亮 */
.oral-card.active{
    border:1px solid #49c0f8;
    box-shadow:0 0 0 1px #49c0f8,inset 0 0 12px rgba(73,192,248,.35);
}

/* hover */
.oral-card:hover{
    transform:translateY(-2px);
    box-shadow:0 6px 14px rgba(0,0,0,.7);
}

/* 标题 – 两行省略 */
.oral-card .ttl{
    font-size:14px;font-weight:500;line-height:1.35;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    color:#b8b8b8;
}

/* meta 行 */
.oral-card .meta{
    font-size:12px;color:#9aa4b1;
    display:flex;justify-content:space-between;align-items:center;
    position:absolute;bottom:8px;left:12px;right:12px;
}
.oral-card .meta .score{
    color:#FFD659;font-weight:600;padding-left:4px;
}
.oral-card .meta .del{
    font-size:16px;margin-left:6px;color:#8f98ad;transition:.2s;
    cursor:pointer;
}
.oral-card .meta .del:hover{color:#ff776c}

/* 整个评分卡再暗一点，去掉默认白底 */
.radar-card{
    background:#0f1626;
    border:1px solid #27324a;
    box-shadow:0 6px 14px rgba(0,0,0,.55);
    border-radius:10px;
    padding:22px 24px;
    color:#dfe3ee;
}

/* 综合分、维度行保持主色 */
.radar-card .overall b{color:#FFD659;}
.radar-card .dim-review li{
    color:#cfd6e8;font-size:14px;line-height:24px;
}
.radar-card .dim-review li b{color:#49c0f8;}

.word-line{
    margin-top:12px;
    line-height:28px;
    word-break:break-all;
}
.word-line span{padding-right:2px;font-size:15px}

/* 播放器卡片 */
.card.origin{
    background:#101827;
    border:1px solid #28334b;
    box-shadow:0 6px 14px rgba(0,0,0,.55);
    color:#dfe3ee;
    padding:22px 24px 16px;
    border-radius:10px;
}
.card.origin audio{
    width:100%;
    margin-bottom:12px;
    outline:none;
}
.card.origin h3{color:#49c0f8;font-size:18px;margin-bottom:10px}

.oral-page .card{
    margin-bottom: 15px;
}
/* =========================================
   口语录音播放器 • 统一外观
   ========================================= */
.card.origin audio{
    width:100%;
    height:40px;                /* 与默认高度保持 */
    background:#1a2336;         /* 深底色，解决白条 */
    border:1px solid #2b3550;
    border-radius:6px;
    outline:none;
    accent-color:#49c0f8;       /* 滑块/进度条主色 (Chromium / Safari 15.4+) */
}

/* ---------- 针对旧版 Chrome / Edge --------- */
audio::-webkit-media-controls-panel{
    background:#1a2336;
    border-radius:6px;
}
audio::-webkit-media-controls-play-button,
audio::-webkit-media-controls-mute-button,
audio::-webkit-media-controls-volume-slider{
    filter:invert(79%) sepia(10%) saturate(560%) hue-rotate(158deg)
    brightness(103%) contrast(101%);
}
.ai-review-card .section-block{margin-top:18px}
.ai-review-card h4{font-size:16px;color:#49c0f8;margin-bottom:6px}
.error-list li,.advice-list li{margin-left:18px;list-style:disc;color:#d0d7e6;line-height:22px}
.improved,.model-answer{background:#172237;padding:10px;border-radius:6px;color:#dfe4ff}

.oral-page .card{
    background:#0f1626;border:1px solid #27324a;
    border-radius:10px;box-shadow:0 6px 14px rgba(0,0,0,.55);
    color:#dfe3ee;padding:22px 24px;margin-bottom:24px;
}
.oral-page audio{
    width:100%;height:40px;background:#1a2336;
    border:1px solid #2b3550;border-radius:6px;
    accent-color:#49c0f8;
}
.ai-review-card .section-block{margin-top:18px}
.ai-review-card h4{font-size:16px;color:#49c0f8;margin-bottom:6px}
.error-list li,.advice-list li{
    margin-left:18px;list-style:disc;color:#d0d7e6;line-height:22px
}
.improved,.model-answer{
    background:#172237;padding:10px;border-radius:6px;color:#dfe4ff
}
.ai-review-card h4{color:#1ccd9e;}