/*! 由 ./zh/about/flag/aboutruler.html 内联 <style> 原样提取，勿手改（保持视觉一致） */

        *{margin:0;padding:0;box-sizing:border-box}
        :root{
            --primary:#87CEEB;
            --primary-dark:#4682B4;
            --bg:#f0f4f8;
            --card:#FFFFFF;
            --text:#222;
            --gray:#555;
            --gap-sm:8px;--gap-md:16px;--gap-lg:24px;
            --padding-sm:12px;--padding-md:20px;--padding-lg:30px;
            --radius:16px;
            --card-shadow:0 8px 24px rgba(135,206,235,0.35);
            --elastic-out: cubic-bezier(0.34, 1.56, 0.64, 1);
            --elastic-soft: cubic-bezier(0.22, 1, 0.36, 1);
            --warm-gold:#c8942e;
            --warm-amber:#c9712b;
        }
        body::before{
            content:'';position:fixed;top:0;left:0;
            width:100%;height:100%;
            background:
                radial-gradient(ellipse at 20% 50%, rgba(135,206,235,0.10), transparent 60%),
                radial-gradient(ellipse at 80% 20%, rgba(70,130,180,0.06), transparent 50%);
            z-index:0;pointer-events:none;
            animation:bgDrift 14s ease-in-out infinite alternate;
        }
        @keyframes bgDrift{0%{transform:scale(1);opacity:0.7}100%{transform:scale(1.04);opacity:1}}
        body{
            font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;
            background:var(--bg);color:var(--text);
            min-height:100vh;display:flex;flex-direction:column;font-size:16px;position:relative;
        }
        /* 导航栏 */
        .navbar{
            background:var(--primary);padding:12px 0;
            box-shadow:0 2px 10px rgba(0,0,0,0.1);
            position:sticky;top:0;z-index:100;width:100%;
            opacity:0;transform:translateY(-100%);
            animation:navSlideIn 0.7s var(--elastic-soft) 0.1s forwards;
        }
        @keyframes navSlideIn{to{opacity:1;transform:translateY(0);}}
        .nav-container{
            max-width:1200px;margin:0 auto;
            display:flex;justify-content:space-between;align-items:center;
            padding:0 var(--padding-sm);
        }
        .logo{
            font-size:clamp(1.1rem,4vw,1.4rem);
            font-weight:600;color:var(--primary-dark);text-decoration:none;
            transition:transform 0.35s var(--elastic-out);
        }
        .logo:hover{transform:scale(1.06);}
        .nav-links{display:flex;gap:clamp(12px,3vw,20px);}
        .nav-links a{
            color:var(--primary-dark);font-weight:500;
            text-decoration:none;font-size:clamp(0.9rem,3vw,1rem);
            position:relative;padding-bottom:4px;
            transition:color 0.3s ease;
        }
        .nav-links a::after{
            content:'';position:absolute;bottom:0;left:0;width:0;height:2px;
            background:var(--primary-dark);border-radius:2px;
            transition:width 0.35s var(--elastic-out);
        }
        .nav-links a:hover::after{width:100%;}
        .nav-links a:hover{font-weight:600;}
        /* 页面容器 */
        .page-wrapper{
            flex:1;display:flex;flex-direction:column;
            align-items:center;padding:var(--padding-lg) var(--padding-sm);
            position:relative;z-index:1;
        }
        .container{
            max-width:800px;width:100%;
            display:flex;flex-direction:column;align-items:center;
            gap:var(--gap-lg);
        }
        /* 返回按钮 */
        .back-link{
            font-size:0.9rem;padding:6px 16px;
            border:1px solid var(--primary-dark);border-radius:8px;
            color:var(--primary-dark);text-decoration:none;
            align-self:flex-start;
            transition:all 0.3s var(--elastic-soft);
            opacity:0;transform:translateX(-12px);
            animation:fadeSlideIn 0.5s var(--elastic-soft) 0.15s forwards;
        }
        .back-link:hover{background:var(--primary-dark);color:#fff;transform:translateX(0);}
        @keyframes fadeSlideIn{to{opacity:1;transform:translateX(0);}}
        /* 卡片 */
        .card{
            background:var(--card);width:100%;
            border-radius:var(--radius);box-shadow:var(--card-shadow);
            padding:clamp(var(--padding-md),4vw,var(--padding-lg));
            opacity:0;transform:translateY(24px) scale(0.98);
            animation:cardIn 0.8s var(--elastic-out) 0.25s forwards;
            transition:transform 0.35s var(--elastic-out),box-shadow 0.35s ease;
        }
        .card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(135,206,235,0.5);}
        @keyframes cardIn{to{opacity:1;transform:translateY(0) scale(1);}}
        /* 标题 - 暖色 */
        .about-card h1{
            text-align:center;color:var(--warm-gold);
            font-size:clamp(1.3rem,5vw,1.7rem);
            margin-bottom:16px;
            opacity:0;transform:translateY(16px);
            animation:headingIn 0.7s var(--elastic-soft) 0.3s forwards;
        }
        .about-card h2{
            color:var(--warm-amber);margin:20px 0 10px;
            font-size:clamp(1.1rem,4vw,1.35rem);
            border-left:4px solid var(--warm-gold);
            padding-left:12px;
            opacity:0;transform:translateY(12px);
        }
        .about-card h2.visible{animation:headingIn 0.6s var(--elastic-soft) forwards;}
        .about-card h3{
            color:var(--primary-dark);margin:14px 0 8px;
            font-size:clamp(1rem,3.5vw,1.15rem);
            opacity:0;transform:translateY(8px);
        }
        .about-card h3.visible{animation:headingIn 0.5s var(--elastic-soft) forwards;}
        @keyframes headingIn{to{opacity:1;transform:translateY(0);}}
        /* 段落 */
        .about-card p{
            line-height:1.8;color:var(--gray);
            margin-bottom:10px;font-size:clamp(0.9rem,3vw,1rem);
            opacity:0;transform:translateY(10px);
        }
        .about-card p.visible{animation:paraIn 0.5s var(--elastic-soft) forwards;}
        @keyframes paraIn{to{opacity:1;transform:translateY(0);}}
        /* 规则条目 */
        .rule-item{
            background:#fefcf5;
            border-left:3px solid var(--warm-gold);
            padding:10px 14px;margin-bottom:8px;
            border-radius:6px;font-size:clamp(0.9rem,3vw,1rem);
            color:var(--text);
            transition:transform 0.25s var(--elastic-out),box-shadow 0.25s;
            opacity:0;transform:translateX(-10px);
        }
        .rule-item.visible{animation:ruleIn 0.4s var(--elastic-soft) forwards;}
        .rule-item:hover{transform:translateX(4px);box-shadow:0 2px 8px rgba(201,113,43,0.12);}
        @keyframes ruleIn{to{opacity:1;transform:translateX(0);}}
        /* ===== 目录树 ===== */
        .toc{
            background:#fefcf5;border:1px solid #f0e0c0;
            border-radius:10px;padding:16px 20px;margin-bottom:20px;
        }
        .toc-title{
            font-size:0.95rem;font-weight:700;color:var(--warm-gold);
            margin-bottom:10px;
        }
        .toc-list{
            list-style:none;padding:0;margin:0;
        }
        .toc-list li{
            margin:4px 0;
        }
        .toc-list a{
            color:var(--primary-dark);text-decoration:none;
            font-size:0.9rem;display:inline-flex;align-items:center;gap:6px;
            padding:4px 8px;border-radius:4px;
            transition:all 0.25s var(--elastic-soft);
        }
        .toc-list a::before{
            content:'▸';color:var(--warm-gold);font-size:0.8rem;
            transition:transform 0.25s var(--elastic-out);
        }
        .toc-list a:hover{background:rgba(200,148,46,0.08);}
        .toc-list a:hover::before{transform:rotate(90deg);}
        .toc-list .toc-sub a{padding-left:24px;font-size:0.85rem;color:var(--gray);}
        .toc-list .toc-sub a::before{content:'·';color:var(--gray);font-size:1rem;}
        /* 违规处理说明 */
        .penalty-box{
            background:#fff8f0;border:1px solid #f5e0c0;
            border-radius:8px;padding:12px 16px;margin:10px 0;
        }
        .penalty-box p{margin-bottom:4px;font-size:0.95rem;}
        .penalty-box p:last-child{margin-bottom:0;}
        .penalty-label{display:inline-block;padding:2px 8px;border-radius:4px;font-size:0.8rem;font-weight:600;margin-right:4px;}
        .penalty-mild{background:#e8f5e9;color:#2e7d32;}
        .penalty-moderate{background:#fff3e0;color:#e65100;}
        .penalty-severe{background:#fbe9e7;color:#c62828;}
        /* 页脚 */
        footer{
            background:var(--primary);color:var(--primary-dark);
            text-align:center;padding:var(--padding-md);
            font-size:14px;width:100%;
            opacity:0;animation:footerIn 0.8s ease 0.5s forwards;
        }
        @keyframes footerIn{to{opacity:1;}}
        /* 响应式 */
        @media(max-width:640px){
            .page-wrapper{padding:var(--padding-md) var(--padding-sm);}
            .card{padding:18px;}
            .about-card h1{font-size:1.2rem;}
            .toc{padding:12px 14px;}
        }
        @media(max-width:480px){
            .nav-container{flex-wrap:wrap;justify-content:center;gap:8px;}
            .nav-links{margin-top:6px;gap:14px;justify-content:center;}
        }
    
/* 内联 style="" 提取（保持原有高优先级） */
[data-css="sc1"]{font-weight:600 !important;color:var(--warm-amber) !important}
[data-css="sc2"]{font-weight:600 !important;color:var(--warm-amber) !important}
[data-css="sc3"]{font-weight:600 !important;color:var(--warm-amber) !important}
[data-css="sc4"]{font-weight:600 !important;color:var(--warm-amber) !important}
[data-css="sc5"]{margin-top:8px !important}
[data-css="sc6"]{color:var(--warm-amber) !important}
[data-css="sc7"]{font-weight:600 !important;color:#c62828 !important}
[data-css="sc8"]{font-weight:600 !important;color:#c62828 !important}
