@charset "utf-8";
/* ============================================================
   QQ空间怀旧博客 · 前台主样式（2008 经典风格）
   ------------------------------------------------------------
   皮肤颜色全部走 CSS 变量，改皮肤只需要改 :root 里的变量，
   或者到 assets/css/skins/ 下复制一份改颜色即可。
   ============================================================ */

/* ---------------- 1. 变量与基础 ---------------- */
:root{
    --qs-main:#2a7fbe;          /* 主题主色 */
    --qs-main-d:#1b5e93;        /* 深色 */
    --qs-main-l:#64abdc;        /* 浅色 */
    --qs-body-bg:#cfe7f7;       /* 页面大背景 */
    --qs-page-bg:#ffffff;       /* 内容区背景 */
    --qs-panel-bg:#ffffff;      /* 模块/卡片底色 */
    --qs-border:#a9cfe8;        /* 描边色 */
    --qs-border-soft:#d6eaf8;
    --qs-head-bg1:#eaf7ff;      /* 标题栏渐变起 */
    --qs-head-bg2:#bfe3f7;      /* 标题栏渐变止 */
    --qs-title:#1a5b90;         /* 标题文字 */
    --qs-text:#333333;
    --qs-text-light:#7b8a99;
    --qs-link:#1b6aa5;
    --qs-link-hover:#e2571c;
    --qs-btn-bg1:#fcfeff;
    --qs-btn-bg2:#dceffb;
    --qs-btn-border:#8fbfdd;
    --qs-top1:#4aa6dd;          /* 顶部标题栏渐变起 */
    --qs-top2:#1d64a0;          /* 顶部标题栏渐变止 */
    --qs-shadow:0 2px 6px rgba(23,92,146,.18);
    --qs-radius:5px;
}

*{ box-sizing:border-box; }

html,body{ margin:0; padding:0; }

body{
    font-family:"宋体", SimSun, "微软雅黑", "Microsoft YaHei", Tahoma, sans-serif;
    font-size:12px;
    line-height:1.7;
    color:var(--qs-text);
    background:var(--qs-body-bg);
    background-attachment:fixed;
}

a{ color:var(--qs-link); text-decoration:none; }
a:hover{ color:var(--qs-link-hover); text-decoration:underline; }

img{ border:0; vertical-align:middle; max-width:100%; }

h1,h2,h3,h4{ font-family:"黑体", SimHei, "微软雅黑", sans-serif; margin:0; font-weight:normal; }

ul,ol{ margin:0; padding:0; list-style:none; }

input,select,textarea,button{ font-family:inherit; font-size:12px; color:var(--qs-text); }

/* 2008 年的细小滚动条（颜色跟随皮肤变量自动换肤） */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-thumb{ background:var(--qs-main-l); border-radius:5px; }
::-webkit-scrollbar-thumb:hover{ background:var(--qs-main); }
::-webkit-scrollbar-track{ background:var(--qs-border-soft); }
::-webkit-scrollbar-corner{ background:var(--qs-border-soft); }
/* Firefox：scrollbar-color 会被内层滚动区继承，跟随皮肤 */
html{ scrollbar-width:thin; scrollbar-color:var(--qs-main-l) var(--qs-border-soft); }

/* ---------------- 2. 顶部渐变标题栏 ---------------- */
.qs-topbar{
}
.qs-topbar::after{
    content:"";
    position:absolute; left:0; right:0; top:0; height:50%;
    background:linear-gradient(to bottom, rgba(255,255,255,.35), rgba(255,255,255,0));
    pointer-events:none;
}
.qs-topbar-inner{
    background:linear-gradient(to bottom, var(--qs-top1) 0%, var(--qs-top2) 100%);
    border-bottom:1px solid #0e4c7d;
    box-shadow:0 2px 6px rgba(6,50,90,.35);
    position:relative;
    z-index:5;
    width:960px; max-width:100%; margin:0 auto;
    padding:10px 12px 0;
    display:flex; flex-wrap:wrap; align-items:center;
}
.qs-brand{ display:flex; align-items:center; gap:6px; padding-bottom:8px; flex:0 0 100%; }
.qs-space-name{
    font-family:"黑体", SimHei, sans-serif;
    font-size:20px; color:#ffffff; letter-spacing:1px;
    text-shadow:1px 1px 0 #0b4a7a, 0 0 6px rgba(255,255,255,.55);
    text-decoration:none;
}
/* 空间 Logo（后台上传，未设置时用默认 assets/img/logo.png） */
.qs-logo{
    display:inline-block; width:48px; height:48px;
    object-fit:cover; border-radius:50%;
}
/* 后台上传了顶部图片：图片平铺在 qs-topbar-inner 容器内，内容浮于其上 */
.qs-topbar-bg{
    position:absolute; left:0; top:0; z-index:0;
    width:100%; height:100%; object-fit:cover; pointer-events:none;
}
.qs-topbar-img .qs-topbar-inner > :not(.qs-topbar-bg){ position:relative; z-index:1; }
.qs-topbar-img .qs-space-name,
.qs-topbar-img .qs-subtitle,
.qs-topbar-img .qs-nav a,
.qs-topbar-img .qs-userbar{ text-shadow:0 1px 2px rgba(0,0,0,.55); }
.qs-space-name:hover{ color:#fff8c8; text-decoration:none; }
.qs-subtitle{
    color:#dcefff; font-size:12px; margin-left:6px;
    border-left:1px solid rgba(255,255,255,.45); padding-left:8px;
}
.qs-userbar{ margin-left:auto; flex:0 0 auto; color:#eaf6ff; }
.qs-userbar a{
    color:#f3fbff; margin-left:10px; font-size:12px;
    padding:1px 6px; border-radius:3px;
}
.qs-userbar a:hover{ background:rgba(255,255,255,.2); color:#fff; text-decoration:none; }

.qs-nav{ flex:1 1 auto; min-width:0; display:flex; flex-wrap:wrap; gap:3px; }
.qs-nav a{
    display:flex; align-items:center; gap:4px;
    padding:5px 14px 6px;
    color:#eaf6ff; font-size:13px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.28);
    border-bottom:0;
    border-radius:5px 5px 0 0;
    text-decoration:none;
}
.qs-nav a img{ width:14px; height:14px; opacity:.95; }
.qs-nav a:hover{ background:rgba(255,255,255,.28); color:#fff; text-decoration:none; }
.qs-nav a.cur{
    background:var(--qs-page-bg); color:var(--qs-main-d);
    font-weight:bold; border-color:var(--qs-border);
    box-shadow:0 -1px 2px rgba(255,255,255,.4) inset;
}

/* ---------------- 3. 页面容器 ---------------- */
.qs-page{
    width:960px; max-width:100%; margin:0 auto;
    padding:0 0 12px;
}
.qs-page-inner{
    background:var(--qs-page-bg);
    border:1px solid var(--qs-border);
    border-top:0;
    border-radius:0 0 6px 6px;
    padding:10px;
    min-height:320px;
    box-shadow:0 2px 8px rgba(20,80,130,.12);
}

.qs-flash{
    padding:8px 10px; margin-bottom:10px; border-radius:4px;
    border:1px solid #b7dff0; background:#f2fbff; color:#135f8f;
    font-size:12px;
}
.qs-flash-err{ border-color:#f0b8b8; background:#fff3f3; color:#b52626; }

.qs-footer{
    width:960px; max-width:100%; margin:12px auto 24px;
    text-align:center; color:#5c7b93; font-size:12px;
}
.qs-footer p{ margin:2px 0; }
.qs-powered{ color:#8497a8; font-size:11px; }
.qs-powered b{ color:#e2571c; }

/* ---------------- 4. 首页布局与模块 ---------------- */
.qs-home{ display:flex; gap:10px; align-items:flex-start; }
.qs-col{ min-width:0; }
.qs-layout-two .qs-col-1{ width:250px; flex:0 0 250px; }
.qs-layout-two .qs-col-2{ flex:1; }
.qs-layout-three .qs-col-1{ width:230px; flex:0 0 230px; }
.qs-layout-three .qs-col-2{ flex:1; }
.qs-layout-three .qs-col-3{ width:230px; flex:0 0 230px; }
.qs-col-empty{
    border:1px dashed var(--qs-border);
    background:#f6fbff; color:#7794aa;
    padding:18px 10px; text-align:center; border-radius:5px; font-size:12px;
}

.qs-module{
    background:var(--qs-panel-bg);
    border:1px solid var(--qs-border);
    border-radius:var(--qs-radius);
    margin-bottom:10px;
    box-shadow:0 1px 3px rgba(23,92,146,.12);
    overflow:hidden;
    position:relative;
}
.qs-module-head{
    display:flex; align-items:center; justify-content:space-between;
    height:28px; padding:0 8px;
    background:linear-gradient(to bottom, var(--qs-head-bg1), var(--qs-head-bg2));
    border-bottom:1px solid var(--qs-border);
}
.qs-module-title{
    display:flex; align-items:center; gap:5px;
    font-family:"黑体", SimHei, sans-serif;
    font-size:13px; color:var(--qs-title);
    text-shadow:0 1px 0 rgba(255,255,255,.85);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.qs-module-title img{ width:14px; height:14px; }
.qs-module-tools{ display:flex; align-items:center; gap:4px; color:#7ba4c2; }
.qs-drag{ cursor:move; font-size:14px; line-height:1; padding:0 3px; user-select:none; }
.qs-drag:hover{ color:#e2571c; }
.qs-module-body{ padding:8px; }

.qs-module-more{ text-align:right; padding-top:6px; font-size:12px; }
.qs-module-more a{ color:var(--qs-link); }

.qs-owner-tip{
    margin-top:10px; padding:8px 10px; text-align:center;
    background:#fffbe6; border:1px dashed #f0cf7a; color:#8a6d1f;
    border-radius:4px; font-size:12px;
}
body.qs-dragging .qs-module{ transition:box-shadow .15s; }
.qs-module.qs-dragging{ opacity:.55; }
.qs-module.qs-drop-target{ box-shadow:0 0 0 2px #ffa53b inset; }

/* ---------------- 5. 通用卡片 / 标题 / 按钮 / 表单 ---------------- */
.qs-page-title{
    display:flex; align-items:baseline; gap:8px;
    margin:2px 0 10px; padding:0 0 6px 8px;
    border-left:4px solid var(--qs-main);
    border-bottom:1px dashed var(--qs-border-soft);
}
.qs-page-title h1{
    font-size:18px; color:var(--qs-title);
    text-shadow:0 1px 0 #fff;
}
.qs-page-title-en{ color:#9bb4c7; font-size:11px; font-family:Verdana, Arial, sans-serif; }
.qs-page-title-action{ margin-left:auto; font-size:12px; }

.qs-card{
    background:var(--qs-panel-bg);
    border:1px solid var(--qs-border);
    border-radius:var(--qs-radius);
    margin-bottom:10px;
    box-shadow:0 1px 3px rgba(23,92,146,.1);
    overflow:hidden;
}
.qs-card-head{
    padding:6px 10px;
    background:linear-gradient(to bottom, var(--qs-head-bg1), var(--qs-head-bg2));
    border-bottom:1px solid var(--qs-border);
    font-family:"黑体", SimHei, sans-serif;
    font-size:13px; color:var(--qs-title);
}
.qs-card-body{ padding:10px; }

.qs-btn{
    display:inline-block; cursor:pointer;
    padding:4px 14px; margin:2px 2px 2px 0;
    color:#1b5c8c;
    background:linear-gradient(to bottom, var(--qs-btn-bg1), var(--qs-btn-bg2));
    border:1px solid var(--qs-btn-border);
    border-radius:3px;
    font-size:12px; line-height:1.6; text-align:center;
    box-shadow:0 1px 0 #fff inset, 0 1px 2px rgba(30,90,140,.15);
    text-decoration:none;
}
.qs-btn:hover{
    color:#0f4a75;
    background:linear-gradient(to bottom, #ffffff, #cfe9fb);
    text-decoration:none;
}
.qs-btn:active{ background:#cfe4f5; box-shadow:0 1px 2px rgba(0,0,0,.12) inset; }
.qs-btn-small{ padding:2px 10px; font-size:12px; }
.qs-btn-block{ display:block; width:100%; padding:6px 0; }

.qs-link{
    background:none; border:0; padding:0; cursor:pointer;
    color:var(--qs-link); font-size:12px; text-decoration:none;
}
.qs-link:hover{ color:var(--qs-link-hover); text-decoration:underline; }
.qs-link-danger{ color:#c0392b; }

.qs-form label{ display:block; margin:6px 0 3px; color:#5f7d95; }
.qs-form input[type=text],.qs-form input[type=password],.qs-form input[type=email],
.qs-form textarea,.qs-form select,
.qs-comment-form input[type=text],.qs-comment-form textarea{
    width:100%; padding:5px 7px;
    border:1px solid #b4d3e8; border-radius:3px;
    background:#fbfeff; color:var(--qs-text);
    box-shadow:0 1px 2px rgba(30,90,140,.08) inset;
    outline:none;
}
.qs-form input:focus,.qs-form textarea:focus,.qs-form select:focus,
.qs-comment-form input:focus,.qs-comment-form textarea:focus{
    border-color:var(--qs-main-l); background:#fff;
    box-shadow:0 0 4px rgba(80,160,220,.45);
}
.qs-form textarea{ resize:vertical; min-height:60px; }
.qs-form-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:4px 0; }
.qs-form-row input[type=text]{ flex:1; }
.qs-check{ display:inline-flex; align-items:center; gap:4px; color:#5f7d95; font-size:12px; }
.qs-file-label{ display:inline-block; padding:3px 10px; font-size:12px;
    background:#f1f9ff; border:1px solid #b4d3e8; border-radius:3px; cursor:pointer; }
.qs-file-label input{ display:none; }
.qs-tip{ color:var(--qs-text-light); font-size:12px; }
.qs-empty{ color:#8aa2b5; padding:12px 0; text-align:center; font-size:12px; }

.qs-inline-form{ display:inline; }

.qs-table{ width:100%; border-collapse:collapse; }
.qs-table th,.qs-table td{ padding:5px 8px; border-bottom:1px solid var(--qs-border-soft); text-align:left; font-size:12px; }
.qs-table th{ background:#f1f9ff; color:#4b7a9c; font-weight:normal; }
.qs-table tr:hover td{ background:#f7fcff; }

.qs-info-table{ width:100%; border-collapse:collapse; margin:8px 0; }
.qs-info-table th,.qs-info-table td{ padding:5px 8px; border-bottom:1px dashed var(--qs-border-soft); font-size:12px; }
.qs-info-table th{ width:70px; color:#5f7d95; font-weight:normal; text-align:left; }

.qs-badge-top,.qs-badge-private,.qs-badge-draft,.qs-badge-owner{
    display:inline-block; padding:0 5px; margin-left:4px;
    font-size:11px; line-height:16px; border-radius:2px; vertical-align:middle;
}
.qs-badge-top{ background:#ffe9e3; color:#d2502a; border:1px solid #f5c0ae; }
.qs-badge-private{ background:#f3eaff; color:#7d4fbf; border:1px solid #dcc8f5; }
.qs-badge-draft{ background:#fff7d9; color:#9a7b17; border:1px solid #efdd98; }
.qs-badge-owner{ background:#ffe9f0; color:#d4506a; border:1px solid #f5bccd; }

.qs-pager{ text-align:center; padding:12px 0 4px; font-size:12px; }
.qs-pager a,.qs-pager span{
    display:inline-block; min-width:20px; padding:2px 7px; margin:0 2px;
    border:1px solid var(--qs-border); border-radius:3px;
    background:linear-gradient(to bottom,#ffffff,#eaf5fd); color:var(--qs-link);
}
.qs-pager a:hover{ text-decoration:none; border-color:var(--qs-main-l); }
.qs-pager .cur{ background:var(--qs-main); border-color:var(--qs-main-d); color:#fff; }
.qs-pager-info{ border:0 !important; background:none !important; color:#8aa2b5; }

/* ---------------- 6. 个人资料模块 ---------------- */
.qs-profile{ text-align:center; }
.qs-profile-avatar img{
    width:96px; height:96px; padding:3px;
    border:1px solid #9fc9e4; border-radius:4px;
    background:#fff; box-shadow:0 1px 4px rgba(30,90,140,.22);
}
.qs-profile-name{ margin:6px 0 2px; font-family:"黑体", SimHei, sans-serif; font-size:15px; }
.qs-profile-name a{ color:var(--qs-title); }
.qs-level{
    display:inline-block; margin-left:4px; white-space:nowrap; vertical-align:middle;
}
/* QQ 式等级图标：皇冠 / 太阳 / 月亮 / 星星 */
.qs-lv-ico{ width:13px; height:13px; margin-right:1px; vertical-align:-2px; }
.qs-vip{
    display:inline-block; margin:2px 0 4px; padding:0 6px;
    font-size:11px; color:#8a6400;
    background:linear-gradient(to bottom,#fff8d6,#ffe17a);
    border:1px solid #e8c34a; border-radius:9px;
}
.qs-vip-star{ color:#e2571c; margin-right:2px; }
.qs-profile-sign{
    margin:4px 4px 8px; padding:4px 6px;
    background:#f7fcff; border:1px dashed var(--qs-border);
    border-radius:3px; color:#55738a; font-size:12px;
    text-align:left; word-break:break-all;
}
.qs-profile-meta{ text-align:left; font-size:12px; color:#4d6c83; padding:0 4px; }
.qs-profile-meta li{ line-height:1.9; border-bottom:1px dotted #e3eff8; }
.qs-profile-meta b{ color:#91a8ba; font-weight:normal; }
.qs-profile-stats{
    display:flex; margin:8px 0 2px; border-top:1px solid var(--qs-border-soft);
    padding-top:6px;
}
.qs-profile-stats > div{ flex:1; color:#7b94a8; font-size:12px; }
.qs-profile-stats .num{ font-family:Verdana, Arial, sans-serif; font-size:16px; color:#e2571c; font-weight:bold; }
.qs-profile-actions{ margin-top:6px; }

/* ---------------- 7. 访客统计模块 ---------------- */
.qs-visitor-count{ display:flex; gap:6px; margin-bottom:6px; }
.qs-visitor-count > div{
    flex:1; text-align:center; padding:5px 0;
    background:linear-gradient(to bottom,#f8fdff,#e9f5fd);
    border:1px solid var(--qs-border-soft); border-radius:4px;
}
.qs-visitor-count b{ display:block; font-family:Verdana, Arial, sans-serif; font-size:15px; color:#e2571c; }
.qs-visitor-count span{ color:#7b94a8; font-size:11px; }
.qs-visitor-title{ color:#6f8ba0; font-size:12px; margin:4px 0; }
.qs-visitor-list ul li{
    display:flex; align-items:center; gap:4px;
    padding:3px 0; border-bottom:1px dotted #e6f1f9; font-size:11px;
}
.qs-visitor-list ul li img{ width:18px; height:18px; border-radius:3px; }
.qs-visitor-ip{ color:#4d6c83; }
.qs-visitor-ua{ color:#8aa2b5; flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.qs-visitor-time{ color:#a4b7c6; }
.qs-visitor-actions{ margin-top:6px; text-align:center; }

/* ---------------- 8. 音乐盒 ---------------- */
.qs-music-module .qs-music-now{
    display:flex; align-items:center; gap:8px;
    padding:6px; background:linear-gradient(to bottom,#f8fdff,#ecf7fe);
    border:1px solid var(--qs-border-soft); border-radius:4px;
}
.qs-music-disc{
    width:38px; height:38px; line-height:38px; text-align:center;
    border-radius:50%; font-size:18px; color:#fff;
    background:radial-gradient(circle at 35% 30%, #74b7e2, #1d64a0 70%);
    box-shadow:0 0 0 1px #14547f, 0 1px 3px rgba(0,0,0,.25);
}
.qs-music-disc-big{ width:84px; height:84px; line-height:84px; font-size:34px; }
.qs-music-now-info{ flex:1; min-width:0; }
.qs-music-now-title{ display:block; font-size:12px; color:var(--qs-title); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qs-music-now-artist{ display:block; font-size:11px; color:#8aa2b5; }
.qs-music-list{ margin-top:6px; }
.qs-music-list li{
    display:flex; align-items:center; gap:6px; padding:3px 0;
    border-bottom:1px dotted #e6f1f9; font-size:12px;
}
.qs-music-index{ color:#a4b7c6; font-family:Verdana, Arial, sans-serif; }
.qs-music-title{ flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.qs-music-mini{ padding:0 6px; font-size:11px; line-height:16px; }
.qs-music-page .qs-music-current{ display:flex; align-items:center; gap:12px; padding:12px; }
.qs-music-info h2{ font-size:17px; color:var(--qs-title); }
.qs-music-info p{ margin:2px 0; color:#6f8ba0; }
.qs-music-tip{ font-size:12px; color:#8aa2b5; }

/* ---------------- 9. 好友头像墙 ---------------- */
.qs-friend-wall{ display:flex; flex-wrap:wrap; gap:6px; }
.qs-friend-wall .qs-friend{
    display:block; width:52px; text-align:center;
    color:#5f7d95; font-size:11px; text-decoration:none;
}
.qs-friend-wall .qs-friend img{
    width:44px; height:44px; padding:2px;
    border:1px solid var(--qs-border); border-radius:4px; background:#fff;
}
.qs-friend-wall .qs-friend span{
    display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;
}
.qs-friend-wall-big .qs-friend{ width:64px; }
.qs-friend-wall-big .qs-friend img{ width:56px; height:56px; }
.qs-friend-wall-page{ display:flex; flex-wrap:wrap; gap:10px; }
.qs-friend-wall-page .qs-friend{
    width:82px; text-align:center; padding:6px; background:#f9fdff;
    border:1px solid var(--qs-border-soft); border-radius:4px; color:#5f7d95;
}
.qs-friend-wall-page .qs-friend img{ width:64px; height:64px; }

/* ---------------- 10. 说说 ---------------- */
.qs-shuoshuo-list .qs-shuoshuo-item{ padding:8px 0; border-bottom:1px dashed var(--qs-border-soft); }
.qs-shuoshuo-list .qs-shuoshuo-item:last-child{ border-bottom:0; }
.qs-shuoshuo-head{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:12px; }
.qs-mini-avatar{ width:22px; height:22px; border:1px solid var(--qs-border); border-radius:3px; background:#fff; }
.qs-shuoshuo-name{ color:var(--qs-title); }
.qs-shuoshuo-time{ color:#a4b7c6; font-size:11px; }
.qs-shuoshuo-permalink{ margin-left:auto; font-size:11px; }
.qs-shuoshuo-text{ margin:5px 0; color:#444; word-break:break-word; }
.qs-shuoshuo-big{ font-size:14px; line-height:1.8; }
.qs-shuoshuo-imgs{ display:flex; gap:4px; margin:4px 0; }
.qs-shuoshuo-imgs img{ width:72px; height:72px; object-fit:cover; border:1px solid var(--qs-border); padding:1px; background:#fff; }
.qs-shuoshuo-foot{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:12px; color:#8aa2b5; }
.qs-mood{ color:#8aa2b5; }
.qs-shuoshuo-card{ padding:10px; margin-bottom:10px; }
.qs-shuoshuo-card .qs-photo-wall img{ border:1px solid var(--qs-border); padding:2px; background:#fff; }
.qs-shuoshuo-form textarea{ min-height:80px; }

.qs-like{
    cursor:pointer; padding:1px 8px;
    background:linear-gradient(to bottom,#fff,#eef8fe);
    border:1px solid #b4d3e8; border-radius:12px;
    color:#1b6aa5; font-size:12px;
}
.qs-like:hover{ border-color:#f0a76b; color:#e2571c; }
.qs-like.qs-liked{ background:linear-gradient(to bottom,#fff3e2,#ffd9ae); border-color:#f0a76b; color:#c9560f; }
.qs-like-icon{ margin-right:3px; }
.qs-like-count{ font-family:Verdana, Arial, sans-serif; }

/* ---------------- 11. 日志 ---------------- */
.qs-log-list{ }
.qs-log-item{ padding:9px 0; border-bottom:1px dashed var(--qs-border-soft); display:flex; gap:8px; }
.qs-log-item:last-child{ border-bottom:0; }
.qs-log-cover img{ width:96px; height:68px; object-fit:cover; border:1px solid var(--qs-border); padding:2px; background:#fff; }
.qs-log-info{ flex:1; min-width:0; }
.qs-log-title{ font-family:"黑体", SimHei, sans-serif; font-size:13px; }
.qs-log-title a{ color:var(--qs-title); }
.qs-log-summary{ color:#6f8ba0; margin:2px 0; font-size:12px; }
.qs-log-meta{ color:#a4b7c6; font-size:11px; display:flex; gap:8px; flex-wrap:wrap; }
.qs-log-cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.qs-log-card{ display:flex; gap:8px; padding:8px; background:var(--qs-panel-bg);
    border:1px solid var(--qs-border); border-radius:5px; }
.qs-log-card-cover img{ width:88px; height:66px; object-fit:cover; border:1px solid var(--qs-border-soft); }
.qs-log-card-info{ flex:1; min-width:0; }
.qs-log-detail-head{ padding:6px 10px; border-bottom:1px solid var(--qs-border); }
.qs-log-detail-head h2{ font-size:18px; color:var(--qs-title); }
.qs-log-detail{ padding:10px; }
.qs-log-detail-cover{ text-align:center; margin:6px 0; }
.qs-log-detail-cover img{ max-height:300px; border:1px solid var(--qs-border); padding:3px; background:#fff; }
.qs-log-content{ font-size:13px; line-height:1.9; color:#333; word-break:break-word; }
.qs-log-content p{ margin:8px 0; }
.qs-log-content img{ max-width:100%; height:auto; }
.qs-log-content blockquote{ margin:8px 0; padding:6px 10px; border-left:3px solid var(--qs-main-l); background:#f6fbff; color:#5f7d95; }
.qs-log-nav{ display:flex; justify-content:space-between; padding:8px 10px; font-size:12px; }
.qs-cat-list{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.qs-tags{ display:flex; flex-wrap:wrap; gap:5px; }
.qs-tags span,.qs-tags a{
    padding:1px 8px; font-size:11px; color:#4b7a9c;
    background:#f0f9ff; border:1px solid #cbe4f5; border-radius:9px;
}

/* ---------------- 12. 相册 / 照片 ---------------- */
.qs-album-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.qs-album-card{
    display:block; background:var(--qs-panel-bg);
    border:1px solid var(--qs-border); border-radius:5px;
    overflow:hidden; text-decoration:none;
    box-shadow:0 1px 3px rgba(23,92,146,.1);
}
.qs-album-card:hover{ border-color:var(--qs-main-l); text-decoration:none; box-shadow:0 2px 8px rgba(23,92,146,.2); }
.qs-album-card-cover{ height:140px; background:#eef7fd; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.qs-album-card-cover img{ width:100%; height:140px; object-fit:cover; }
.qs-album-noimg{ color:#9bb4c7; font-size:12px; }
.qs-album-card-info{ padding:6px 8px; }
.qs-album-name{ display:block; font-family:"黑体", SimHei, sans-serif; font-size:13px; color:var(--qs-title); }
.qs-album-desc{ display:block; color:#7b94a8; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qs-album-count{ display:block; color:#a4b7c6; font-size:11px; margin-top:2px; }
.qs-album-head{ display:flex; justify-content:space-between; padding:6px 8px; border-bottom:1px solid var(--qs-border-soft); flex-wrap:wrap; gap:4px; }
.qs-album-meta{ color:#a4b7c6; font-size:11px; }

.qs-album-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.qs-album-item{ border:1px solid var(--qs-border-soft); border-radius:4px; overflow:hidden; background:#fff; }
.qs-album-item .qs-album-cover{ height:100px; overflow:hidden; }
.qs-album-item .qs-album-cover img{ width:100%; height:100px; object-fit:cover; }

.qs-photo-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:8px; }
.qs-photo-item{
    display:block; border:1px solid var(--qs-border); padding:3px;
    background:#fff; border-radius:3px; text-align:center; text-decoration:none;
}
.qs-photo-item:hover{ border-color:var(--qs-main-l); text-decoration:none; }
.qs-photo-item img{ width:100%; height:120px; object-fit:cover; display:block; }
.qs-photo-name{ display:block; font-size:11px; color:#6f8ba0; padding-top:2px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qs-photo-wall{ display:flex; flex-wrap:wrap; gap:5px; margin:6px 0; }
.qs-photo-thumb img{ width:84px; height:84px; object-fit:cover; border:1px solid var(--qs-border); padding:2px; background:#fff; }
.qs-photo-detail{ padding:0 0 10px; }
.qs-photo-detail-head{ display:flex; justify-content:space-between; align-items:center; gap:8px;
    padding:6px 10px; border-bottom:1px solid var(--qs-border-soft); flex-wrap:wrap; }
.qs-photo-stage{ text-align:center; padding:10px; background:
    repeating-linear-gradient(45deg,#f4f9fd 0 8px,#eef6fc 8px 16px); }
.qs-photo-stage img{ max-height:620px; border:3px solid #fff; box-shadow:0 2px 10px rgba(0,60,120,.25); }
.qs-photo-desc{ padding:6px 12px; color:#5f7d95; font-size:12px; }
.qs-photo-time{ text-align:right; padding:0 12px; color:#a4b7c6; font-size:11px; }

/* ---------------- 13. 留言板 ---------------- */
.qs-guest-list li{ display:flex; gap:6px; padding:5px 0; border-bottom:1px dotted #e6f1f9; }
.qs-guest-name{ color:var(--qs-title); }
.qs-guest-time{ color:#a4b7c6; font-size:11px; margin-left:4px; }
.qs-guest-text{ color:#55738a; font-size:12px; }
.qs-phrase-bar{ display:flex; flex-wrap:wrap; gap:4px; margin:4px 0; }
.qs-phrase{
    cursor:pointer; padding:1px 8px; font-size:11px;
    color:#4b7a9c; background:#f4fbff;
    border:1px solid #cbe4f5; border-radius:10px;
}
.qs-phrase:hover{ background:#e6f5ff; border-color:#8fbfdd; color:#1b6aa5; }

.qs-guest-list-page .qs-guest-item{
    display:flex; gap:8px; padding:10px;
    background:var(--qs-panel-bg); border:1px solid var(--qs-border);
    border-radius:5px; margin-bottom:8px;
}
.qs-guest-avatar img{ width:40px; height:40px; border:1px solid var(--qs-border); border-radius:4px; background:#fff; }
.qs-guest-main{ flex:1; min-width:0; }
.qs-guest-head{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.qs-guest-content{ margin:4px 0; color:#444; word-break:break-word; }
.qs-guest-ip{ color:#a4b7c6; font-size:11px; }
.qs-guest-reply{
    margin:4px 0; padding:5px 8px; font-size:12px; color:#5f7d95;
    background:#f7fcff; border:1px dashed var(--qs-border); border-radius:3px;
}
.qs-guest-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:12px; }
.qs-guest-actions details summary{ cursor:pointer; color:var(--qs-link); list-style:none; }
.qs-guest-actions details summary::-webkit-details-marker{ display:none; }
.qs-form-tight{ margin-top:4px; }
.qs-form-tight textarea{ min-height:44px; }

/* ---------------- 14. 评论 ---------------- */
.qs-comment-list{ padding:4px 10px; }
.qs-comment{ display:flex; gap:8px; padding:7px 0; border-bottom:1px dotted #e6f1f9; }
.qs-comment:last-child{ border-bottom:0; }
.qs-comment-avatar img{ width:26px; height:26px; border:1px solid var(--qs-border); border-radius:3px; background:#fff; }
.qs-comment-main{ flex:1; min-width:0; }
.qs-comment-name{ color:var(--qs-title); font-size:12px; }
.qs-comment-time{ color:#a4b7c6; font-size:11px; margin-left:6px; }
.qs-comment-text{ color:#444; font-size:12px; word-break:break-word; }
.qs-comment-form{ padding:0 10px 10px; }
.qs-comment-form-row{ margin:4px 0; }
.qs-comment-form textarea{ min-height:56px; }
.qs-comment-tip{ margin-left:8px; color:#8aa2b5; font-size:12px; }

/* 评论 / 留言回复（楼中楼） */
.qs-comment-ops{ margin-top:2px; }
.qs-reply-btn{ font-size:12px; color:var(--qs-link); cursor:pointer; }
.qs-reply-btn:hover{ text-decoration:underline; }
.qs-reply-at{ color:#7d9db8; }
.qs-comment-replies{ margin:2px 0 0 10px; padding-left:8px; border-left:2px solid #dcebf7; }
.qs-comment-replies:empty{ display:none; }
.qs-comment-reply .qs-comment-avatar img{ width:20px; height:20px; }
.qs-reply-inline{ margin:6px 0 2px; padding:6px 8px; background:#f7fbff; border:1px solid #dbeaf6; border-radius:4px; }
.qs-reply-inline textarea{ min-height:40px; }
.qs-reply-ops{ margin-top:4px; display:flex; align-items:center; gap:8px; }
.qs-guest-replies{ margin-top:6px; }
.qs-guest-replies:empty{ display:none; }
.qs-guest-replies .qs-comment{ padding:5px 0; }
.qs-captcha-row{ display:flex; align-items:center; gap:6px; }
.qs-captcha-img{ height:28px; border:1px solid #b4d3e8; cursor:pointer; background:#fff; }

/* 表情 */
.qs-emoji-panel{ display:none; flex-wrap:wrap; gap:3px; padding:4px; margin:4px 0;
    background:#f9fdff; border:1px solid var(--qs-border-soft); border-radius:3px; max-height:104px; overflow:auto; }
.qs-emoji-panel.cur{ display:flex; }
.qs-emoji{
    cursor:pointer; padding:1px; border:1px solid transparent; border-radius:2px; background:none;
}
.qs-emoji:hover{ border-color:#b4d3e8; background:#fff; }
.qs-emoji img{ width:22px; height:22px; }
.qs-emoji-toggle{ color:#5f7d95; font-size:12px; cursor:pointer; margin:4px 0 2px; }

/* ---------------- 15. 个人档 / 登录注册 / 搜索 ---------------- */
.qs-profile-page{ display:flex; gap:10px; align-items:flex-start; }
.qs-profile-card{ width:300px; flex:0 0 300px; text-align:center; padding:12px; }
.qs-profile-avatar-big img{ width:120px; height:120px; }
.qs-profile-page-name{ font-size:17px; color:var(--qs-title); margin:6px 0; }
.qs-profile-right{ flex:1; min-width:0; }
.qs-profile-intro{ padding:10px; color:#55738a; }
.qs-simple-list li{ display:flex; justify-content:space-between; gap:8px; padding:6px 10px;
    border-bottom:1px dotted #e6f1f9; font-size:12px; }
.qs-simple-list li span{ color:#a4b7c6; white-space:nowrap; }
.qs-simple-list li a{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.qs-auth-wrap{ display:flex; justify-content:center; padding:24px 0; }
.qs-auth-card{ width:340px; max-width:100%; }
.qs-auth-head{
    padding:8px 12px;
    background:linear-gradient(to bottom, var(--qs-head-bg1), var(--qs-head-bg2));
    border-bottom:1px solid var(--qs-border);
    font-family:"黑体", SimHei, sans-serif; font-size:14px; color:var(--qs-title);
}
.qs-auth-icon{ margin-right:4px; }
.qs-auth-card .qs-form{ padding:10px 14px 4px; }
.qs-auth-card .qs-form label{ margin-top:8px; }
.qs-auth-links{ padding:4px 14px 10px; display:flex; justify-content:space-between; font-size:12px; }
.qs-auth-card .qs-tip{ padding:0 14px 10px; }
.qs-auth-card .qs-flash{ margin:8px 14px 0; }

.qs-search{ display:flex; gap:6px; padding:10px; }
.qs-search input[type=text]{ flex:1; }
.qs-search-big .qs-search{ padding:0; }
.qs-filter-bar{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; font-size:12px; }
.qs-filter-bar a{ padding:2px 10px; border:1px solid var(--qs-border-soft); border-radius:10px; background:#f9fdff; }
.qs-filter-bar a.cur{ background:var(--qs-main); border-color:var(--qs-main-d); color:#fff; }

.qs-notice{ display:flex; gap:8px; padding:8px; align-items:flex-start;
    background:#fffdf2; border:1px solid #f0e3b0; border-radius:4px; }
.qs-notice-icon{ width:20px; height:20px; }
.qs-notice-text{ flex:1; color:#7a6428; font-size:12px; }

.qs-back{ padding:4px 2px 10px; font-size:12px; }

/* 标题字效（闪光 / 彩虹 / 描边） */
.qs-title-glitter{
    animation:qsGlitter 1.2s infinite alternate;
}
@keyframes qsGlitter{
    0%{ color:#ffffff; text-shadow:1px 1px 0 #0b4a7a, 0 0 3px #fff, 0 0 8px #ffe86b; }
    100%{ color:#fff6b3; text-shadow:1px 1px 0 #0b4a7a, 0 0 6px #fff, 0 0 16px #ffd53d; }
}
.qs-title-rainbow{
    background:linear-gradient(90deg,#ffdf6b,#ff9f6b,#ff7fb0,#c49bff,#7fd0ff,#8bffc0,#ffdf6b);
    background-size:200% 100%;
    -webkit-background-clip:text; background-clip:text;
    color:transparent;
    -webkit-text-fill-color:transparent;
    text-shadow:none;
    animation:qsRainbow 4s linear infinite;
}
@keyframes qsRainbow{ 0%{ background-position:0 0; } 100%{ background-position:200% 0; } }
.qs-title-outline{
    color:#ffffff;
    text-shadow:-1px -1px 0 #14547f, 1px -1px 0 #14547f, -1px 1px 0 #14547f, 1px 1px 0 #14547f,
                0 0 6px rgba(255,255,255,.6);
}

/* ---------------- 16. 播放器 / 挂件 / 特效 ---------------- */
/* 播放器配色全部取自皮肤变量，换肤后自动跟随 */
.qs-player{
    position:fixed; right:14px; bottom:14px; z-index:50;
    width:212px; background:var(--qs-panel-bg); color:var(--qs-text);
    border:1px solid var(--qs-border); border-radius:6px;
    box-shadow:0 3px 12px rgba(10,60,110,.28);
    overflow:hidden; font-size:12px;
}
.qs-player-bar{ display:flex; align-items:center; gap:3px;
    padding:4px 5px;
    background:linear-gradient(to bottom,var(--qs-head-bg1),var(--qs-head-bg2));
    border-bottom:1px solid var(--qs-border);
}
.qs-player-btn{
    cursor:pointer; padding:0 5px; height:20px; line-height:18px; font-size:11px;
    display:inline-flex; align-items:center; justify-content:center;
    color:var(--qs-main-d); background:linear-gradient(to bottom,var(--qs-btn-bg1),var(--qs-btn-bg2));
    border:1px solid var(--qs-btn-border); border-radius:3px;
}
.qs-player-btn svg{ width:11px; height:11px; display:block; }
.qs-player-btn:hover{ background:var(--qs-panel-bg); color:var(--qs-main); }
.qs-player-info{ flex:1; min-width:0; overflow:hidden; }
.qs-player-title{ display:block; font-size:11px; color:var(--qs-title);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qs-player-artist{ display:block; font-size:10px; color:var(--qs-text-light);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qs-player-list{ display:none; max-height:132px; overflow:auto; background:var(--qs-panel-bg); }
.qs-player-list.cur{ display:block; }
.qs-player-list li{ padding:3px 8px; cursor:pointer; border-bottom:1px dotted var(--qs-border-soft);
    color:var(--qs-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qs-player-list li:hover{ background:var(--qs-head-bg1); }
.qs-player-list li.cur{ background:var(--qs-head-bg2); color:var(--qs-title); }

.qs-pet{
    position:fixed; left:8px; bottom:8px; width:76px; z-index:40;
    cursor:grab; user-select:none; touch-action:none;
    -webkit-user-drag:none;
    transition:transform .2s ease;
}
.qs-pet:hover{ transform:scale(1.08); }
/* 拖动时：放大层级、换抓手光标 */
.qs-pet.qs-pet-dragging{
    transform:none; transition:none;
    cursor:grabbing; z-index:60;
}
/* 小企鹅说的话：气泡显示在头顶上方 */
.qs-pet-tip{
    position:fixed; z-index:52; display:none; transform:translate(-50%,-100%);
    max-width:none; padding:6px 10px; white-space:nowrap;
    background:#fffdf2; border:1px solid #e6c86d; border-radius:8px;
    color:#7a5a12; font-size:12px; line-height:1.5;
    box-shadow:0 2px 8px rgba(0,0,0,.18);
    pointer-events:none; word-break:break-word;
}
.qs-pet-tip::before,
.qs-pet-tip::after{ content:""; position:absolute; left:50%; border-style:solid; }
.qs-pet-tip::before{ bottom:-13px; margin-left:-7px; border-width:7px; border-color:#e6c86d transparent transparent; }
.qs-pet-tip::after{ bottom:-11px; margin-left:-6px; border-width:6px; border-color:#fffdf2 transparent transparent; }
/* 头顶放不下时改在企鹅脚下显示，尖角朝上 */
.qs-pet-tip.qs-pet-tip-below{ transform:translate(-50%,0); }
.qs-pet-tip.qs-pet-tip-below::before{ bottom:auto; top:-13px; border-color:transparent transparent #e6c86d; }
.qs-pet-tip.qs-pet-tip-below::after{ bottom:auto; top:-11px; border-color:transparent transparent #fffdf2; }
.qs-petal{
    position:fixed; top:-30px; z-index:30; pointer-events:none;
    font-size:16px; opacity:.9;
    animation:qsPetalFall linear forwards;
}
@keyframes qsPetalFall{
    0%{ transform:translateY(-10px) rotate(0); opacity:.9; }
    100%{ transform:translateY(105vh) rotate(540deg); opacity:.2; }
}
.qs-click-heart{
    position:fixed; z-index:60; pointer-events:none;
    font-size:20px; animation:qsHeartUp .9s ease-out forwards;
}
@keyframes qsHeartUp{
    0%{ transform:translate(-50%,-50%) scale(.6); opacity:1; }
    100%{ transform:translate(-50%,-140%) scale(1.3); opacity:0; }
}
.qs-follow-dot{
    position:fixed; z-index:65; pointer-events:none;
    width:6px; height:6px; border-radius:50%;
    background:radial-gradient(circle,#fff 0,#8fd0ff 40%,rgba(143,208,255,0) 70%);
    animation:qsDotFade .7s ease-out forwards;
}
@keyframes qsDotFade{
    0%{ transform:scale(1); opacity:.9; }
    100%{ transform:scale(2.2); opacity:0; }
}

/* ---------------- 17. 响应式（窄屏也能看） ---------------- */
@media (max-width:1000px){
    .qs-page,.qs-topbar-inner,.qs-footer{ width:auto; margin-left:8px; margin-right:8px; }
    /* 稍窄的屏幕上缩小导航，尽量让导航与用户栏保持同一行 */
    .qs-nav a{ padding:5px 8px 6px; font-size:12px; }
    .qs-userbar a{ margin-left:6px; padding:1px 4px; }
}
@media (max-width:820px){
    .qs-home{ flex-wrap:wrap; }
    .qs-layout-two .qs-col-1,
    .qs-layout-three .qs-col-1,
    .qs-layout-three .qs-col-3{ width:100%; flex:1 1 100%; }
    .qs-layout-two .qs-col-2,
    .qs-layout-three .qs-col-2{ flex:1 1 100%; }
    .qs-profile-page{ flex-wrap:wrap; }
    .qs-profile-card{ width:100%; flex:1 1 100%; }
    .qs-album-cards,.qs-log-cards{ grid-template-columns:repeat(2,1fr); }
    .qs-photo-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px){
    .qs-album-cards,.qs-log-cards,.qs-photo-grid{ grid-template-columns:repeat(2,1fr); }
    .qs-nav a{ padding:4px 9px; font-size:12px; }
    .qs-space-name{ font-size:17px; }
    .qs-pet{ width:58px; }
    .qs-player{ width:184px; right:8px; bottom:8px; }
}

/* ---------------- 18. 相册灯箱幻灯片 ---------------- */
.qs-lightbox{ position:fixed; inset:0; z-index:9999; display:none; background:rgba(12,16,22,.92); }
.qs-lightbox.cur{ display:block; }
body.qs-lb-open{ overflow:hidden; }
.qs-lb-stage{
    position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center;
    padding:58px 76px 78px;
}
.qs-lb-stage img{
    max-width:100%; max-height:100%; padding:6px; background:#fff; border-radius:2px;
    box-shadow:0 8px 34px rgba(0,0,0,.55); cursor:pointer;
}
.qs-lb-close{
    position:absolute; top:12px; right:16px; z-index:2; width:34px; height:34px; padding:0;
    font-size:22px; line-height:1; color:#fff; text-align:center;
    background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35);
    border-radius:50%; cursor:pointer;
}
.qs-lb-close:hover{ background:rgba(255,255,255,.28); }
.qs-lb-nav{
    position:absolute; top:50%; z-index:2; width:38px; height:58px; margin-top:-29px; padding:0;
    font-size:26px; line-height:56px; color:#fff; text-align:center;
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.3);
    border-radius:4px; cursor:pointer;
}
.qs-lb-nav:hover{ background:rgba(255,255,255,.26); }
.qs-lb-prev{ left:14px; }
.qs-lb-next{ right:14px; }
.qs-lb-bar{
    position:absolute; left:0; right:0; bottom:0; z-index:2; height:54px;
    display:flex; align-items:center; gap:12px; padding:0 18px;
    font-size:12px; color:#fff; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.6));
}
.qs-lb-count{ color:#ffe9a8; }
.qs-lb-name{ flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.qs-lb-toggle{
    padding:3px 12px; font:12px "宋体",SimSun,sans-serif; color:#fff;
    background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35);
    border-radius:3px; cursor:pointer;
}
.qs-lb-toggle:hover{ background:rgba(255,255,255,.28); }
@media (max-width:560px){
    .qs-lb-stage{ padding:50px 12px 70px; }
    .qs-lb-nav{ width:30px; height:46px; line-height:44px; font-size:20px; }
    .qs-lb-prev{ left:4px; }
    .qs-lb-next{ right:4px; }
}