/*
 * Theme Name: PureSpace - Cyberpunk Protocol (Part 1)
 * Description: 赛博朋克高霓虹、霓虹荧光反叛风格主题（前半部分）
 * Version: 2.0.0
 * Author: AI Assistant
 */

/* ==========================================================================
   1. 赛博核心变量与全局重置 (Cyberpunk Core & Reset)
   ========================================================================== */
* { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
}

/* 霓虹色彩定义 */
:root {
    --bg-dark: #0a0a0f;       /* 深邃的黑客空间底色 */
    --neon-pink: #ff0055;     /* 义体/警告 荧光粉 */
    --neon-cyan: #00f0ff;     /* 矩阵/连接 荧光蓝 */
    --neon-yellow: #fcee0a;   /* 2077 经典赛博黄 */
    --text-main: #c3c7db;     /* 仿数码屏幕显示字色 */
    --panel-bg: #12121a;      /* 电子元件面板底色 */
}

body {
    font-family: "Courier New", Courier, Menlo, Monaco, Consolas, "Noto Sans SC", sans-serif;
    font-size: 15px;
    line-height: 1.8;
    color: var(--text-main);
    background-color: var(--bg-dark);
    /* 赛博噪声流：微微的复古科技感背景横向扫描线 */
    background-image: linear-gradient(rgba(18, 18, 26, 0.3) 50%, transparent 50%),
                      linear-gradient(90deg, rgba(255, 0, 85, 0.03), rgba(0, 240, 255, 0.03));
    background-size: 100% 4px, 6px 100%;
    -webkit-font-smoothing: antialiased;
}

/* 全局滚动条赛博化 */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-dark); }
::-webkit-scrollbar-thumb { background: var(--neon-pink); box-shadow: 0 0 10px var(--neon-pink); }

a { 
    color: var(--neon-cyan); 
    text-shadow: 0 0 4px rgba(0, 240, 255, 0.3);
    text-decoration: none; 
    transition: all 0.2s ease; 
}

a:hover { 
    color: var(--neon-pink);
    text-shadow: 0 0 8px var(--neon-pink);
}

.container { 
    max-width: 720px; 
    margin: 0 auto; 
    padding: 0 24px; 
}

/* 电子元件加载淡入 */
.animate-fade-in {
    animation: cyberScanIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes cyberScanIn {
    0% { opacity: 0; transform: scale(0.98) translateY(10px); filter: hue-rotate(90deg); }
    100% { opacity: 1; transform: scale(1) translateY(0); filter: hue-rotate(0deg); }
}

/* ==========================================================================
   2. 电子档案页头 (Cyber Header)
   ========================================================================== */
.site-header { 
    padding: 50px 0 30px 0; 
    border-bottom: 2px solid var(--neon-cyan);
    box-shadow: 0 15px 30px rgba(0, 240, 255, 0.05);
    margin-bottom: 40px;
    position: relative;
}

/* 赛博右下角状态指示装饰 */
.site-header::after {
    content: "SYSTEM READY";
    position: absolute;
    bottom: -9px;
    right: 24px;
    background: var(--neon-cyan);
    color: var(--bg-dark);
    font-size: 10px;
    font-weight: 900;
    padding: 0 6px;
    letter-spacing: 0.1em;
}

.header-wrap { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
}

.site-logo a { 
    font-size: 24px; 
    font-weight: 900; 
    letter-spacing: -1px; 
    color: #fff;
    text-shadow: 0 0 10px var(--neon-pink), 0 0 20px rgba(255,0,85,0.5);
    font-style: italic;
}

.site-nav a { 
    margin-left: 20px; 
    font-size: 13px; 
    font-weight: 700;
    color: var(--text-main); 
    text-transform: uppercase;
    border: 1px solid transparent;
    padding: 4px 8px;
}

.site-nav a:hover { 
    color: var(--neon-yellow); 
    border-color: var(--neon-yellow);
    box-shadow: 0 0 8px rgba(252, 238, 10, 0.3);
}

/* ==========================================================================
   3. 终端任务列表 - 首页 (Terminal Mission List)
   ========================================================================== */
.post-list { 
    margin-top: 20px; 
}

.post-item { 
    margin-bottom: 30px; 
    padding: 20px;
    background: var(--panel-bg);
    border-left: 4px solid var(--neon-pink);
    border-radius: 0 8px 8px 0;
    transition: transform 0.2s, box-shadow 0.2s;
}

.post-item:hover {
    transform: translateX(5px);
    box-shadow: -5px 0 15px rgba(255, 0, 85, 0.2), 0 5px 15px rgba(0,0,0,0.5);
}

.post-meta { 
    font-size: 11px; 
    color: #666a85; 
    margin-bottom: 8px; 
    font-family: monospace;
    letter-spacing: 0.1em;
}

.post-title { 
    font-size: 18px; 
    font-weight: 700; 
}

.post-title a {
    color: #fff;
}
.post-title a:hover {
    color: var(--neon-cyan);
}
/* ==========================================================================
   4. 赛博机密档案美化 - 文章页 (Cyber Dossier Premium)
   ========================================================================== */
.post-content-wrap { 
    margin-top: 20px; 
}

/* 赛博警示信息头 */
.post-header-hero {
    margin-bottom: 40px;
    padding: 30px;
    background: var(--panel-bg);
    border: 1px solid rgba(255,255,255,0.05);
    border-top: 4px solid var(--neon-yellow);
    position: relative;
}

.post-hero-meta {
    font-size: 11px;
    letter-spacing: 0.2em;
    color: var(--neon-pink);
    margin-bottom: 15px;
    font-family: monospace;
}

.post-hero-title {
    font-size: 32px;
    font-weight: 900;
    line-height: 1.3;
    color: #ffffff;
    text-shadow: 0 0 15px rgba(255,255,255,0.2);
}

/* 渐变装饰线条 */
.post-hero-decorator {
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, var(--neon-cyan), transparent);
    margin-top: 20px;
}

/* 正文数码流排版 */
.premium-typography {
    font-size: 15.5px;
    color: var(--text-main);
}

.premium-typography p {
    margin-bottom: 25px;
    text-align: justify;
}

/* 首字霓虹强发光 */
.premium-typography > p:first-of-type::first-letter {
    font-size: 45px;
    font-weight: 900;
    float: left;
    line-height: 0.9;
    margin-top: 5px;
    margin-right: 10px;
    color: var(--neon-yellow);
    text-shadow: 0 0 10px rgba(252, 238, 10, 0.8);
}

/* 正文标题：黑客终端节点样式 */
.premium-typography h2, 
.premium-typography h3 {
    color: #fff;
    font-weight: 800;
    border-bottom: 1px dashed rgba(0, 240, 255, 0.3);
    padding-bottom: 6px;
}

.premium-typography h2 {
    font-size: 22px;
    margin: 45px 0 20px 0;
}
.premium-typography h2::before { content: "## "; color: var(--neon-cyan); }

.premium-typography h3 {
    font-size: 18px;
    margin: 35px 0 15px 0;
}
.premium-typography h3::before { content: ">>> "; color: var(--neon-pink); }

/* 加密拦截块 (Blockquote) */
.premium-typography blockquote {
    border-left: 3px solid var(--neon-cyan);
    padding: 20px;
    margin: 35px 0;
    background: rgba(0, 240, 255, 0.03);
    box-shadow: inset 0 0 15px rgba(0, 240, 255, 0.05);
}

.premium-typography blockquote::before {
    content: "[DECRYPTED MSG]";
    display: block;
    font-size: 10px;
    color: var(--neon-cyan);
    font-family: monospace;
    margin-bottom: 10px;
    letter-spacing: 0.1em;
}

.premium-typography blockquote p {
    margin-bottom: 0;
    color: #a5b5cc;
    font-style: normal;
}

/* 核心代码区：矩阵霓虹高亮 */
.premium-typography code {
    background: #1a1a26;
    color: var(--neon-pink);
    padding: 2px 6px;
    font-size: 13.5px;
    border-radius: 4px;
    border: 1px solid rgba(255,0,85,0.2);
}

.premium-typography pre {
    background: #020204;
    border: 1px solid rgba(0, 240, 255, 0.2);
    padding: 20px;
    border-radius: 4px;
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.05);
    margin: 35px 0;
    position: relative;
    overflow-x: auto;
}

.premium-typography pre::after {
    content: "SRC_CODE";
    position: absolute;
    top: 0;
    right: 15px;
    background: rgba(0, 240, 255, 0.1);
    color: var(--neon-cyan);
    font-size: 9px;
    padding: 2px 6px;
}

.premium-typography pre code {
    background: none;
    color: #79ffa7; /* 经典黑客绿代码 */
    border: none;
    padding: 0;
    text-shadow: 0 0 2px rgba(121, 255, 167, 0.3);
}

/* 扫描线遮罩图片 */
.premium-typography img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 35px auto;
    border: 1px solid rgba(255,255,255,0.1);
    filter: grayscale(20%) contrast(110%);
    transition: all 0.3s;
}

.premium-typography img:hover {
    filter: grayscale(0%) contrast(100%);
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.2);
}

/* ==========================================================================
   5. 数据节点分页与页脚 (Pagination & Footer)
   ========================================================================== */
.pagination { 
    margin: 50px 0; 
    font-size: 13px; 
}

.pagination ol {
    list-style: none;
    display: flex;
    gap: 10px;
}

.pagination li a, .pagination li .current {
    padding: 6px 12px;
    background: var(--panel-bg);
    border: 1px solid rgba(255,255,255,0.05);
}

.pagination li .current {
    color: var(--bg-dark);
    background: var(--neon-cyan);
    font-weight: 700;
    box-shadow: 0 0 10px var(--neon-cyan);
}

.site-footer { 
    padding: 60px 0 30px 0; 
    border-top: 1px dashed rgba(255,255,255,0.1); 
    margin-top: 80px; 
    font-size: 11px; 
    color: #555973; 
    text-align: center; 
    font-family: monospace;
}

/* ==========================================================================
   6. 通信干扰评论区 (Cyber Feedback Control)
   ========================================================================== */
.comments-area { 
    margin-top: 60px; 
    padding-top: 40px; 
    border-top: 2px dashed var(--neon-pink); 
}

.comments-title, .reply-title { 
    font-size: 15px; 
    font-weight: 700; 
    color: #fff;
    text-transform: uppercase;
}
.comments-title::before { content: "[//] "; color: var(--neon-pink); }

.comment-body { 
    padding: 20px; 
    background: rgba(255,255,255,0.01);
    border: 1px solid rgba(255,255,255,0.03);
    margin-bottom: 15px;
}

.comment-author { color: var(--neon-cyan); }
.comment-meta { color: #44485f; }
.comment-content { color: #a5b5cc; margin-top: 10px; }
.comment-children { list-style: none; padding-left: 15px; border-left: 2px solid var(--neon-pink); }

/* 输入表单：虚拟控制台输入框 */
.comment-inputs { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); 
    gap: 12px; 
    margin-bottom: 12px; 
}

.comment-inputs input, 
.comment-textarea textarea { 
    width: 100%; 
    padding: 12px; 
    background: #0d0d14;
    border: 1px solid rgba(255,255,255,0.1); 
    border-radius: 0; 
    color: #fff;
    font-family: monospace;
    outline: none; 
    transition: all 0.2s ease;
}

.comment-inputs input:focus, 
.comment-textarea textarea:focus { 
    border-color: var(--neon-yellow); 
    box-shadow: 0 0 10px rgba(252, 238, 10, 0.2);
}

/* 霓虹激发提交按钮 */
.submit-btn { 
    background: transparent; 
    color: var(--neon-pink); 
    border: 1px solid var(--neon-pink); 
    padding: 12px 30px; 
    border-radius: 0;
    cursor: pointer; 
    font-size: 13px; 
    font-weight: 700;
    font-family: monospace;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    box-shadow: 0 0 8px rgba(255, 0, 85, 0.1);
    transition: all 0.2s;
}

.submit-btn:hover { 
    background: var(--neon-pink); 
    color: var(--bg-dark);
    box-shadow: 0 0 15px var(--neon-pink);
}

/* ==========================================================================
   7. 移动矩阵端适配 (Responsive Design)
   ========================================================================== */
@media (max-width: 600px) {
    .header-wrap { flex-direction: column; gap: 20px; align-items: flex-start; }
    .site-nav a { margin-left: 0; margin-right: 10px; padding: 4px 6px; }
    .post-hero-title { font-size: 24px; }
    .comment-inputs { grid-template-columns: 1fr; }
}