/* ==========================================================================
   Linear 主题设计系统（基于 Linear.app DESIGN.md）
   深色 canvas、薰衣草蓝单一强调色、四层 surface、Inter 字体
   ========================================================================== */
:root {
    /* 品牌与强调色 */
    --primary: #5e6ad2;
    --on-primary: #ffffff;
    --primary-hover: #828fff;
    --primary-focus: #5e69d1;

    /* 文本层级 */
    --ink: #f7f8f8;
    --ink-muted: #d0d6e0;
    --ink-subtle: #8a8f98;
    --ink-tertiary: #62666d;

    /* 表面层级 */
    --canvas: #010102;
    --surface-1: #0f1011;
    --surface-2: #141516;
    --surface-3: #18191a;
    --surface-4: #191a1b;

    /* 边框 */
    --hairline: #23252a;
    --hairline-strong: #34343a;
    --hairline-tertiary: #3e3e44;

    /* 语义色 */
    --success: #27a644;
    --danger: #f0506e;
    --warning: #d9983d;

    /* 圆角 */
    --r-xs: 4px;
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 12px;
    --r-xl: 16px;
    --r-pill: 9999px;

    /* 间距 */
    --sp-xxs: 4px;
    --sp-xs: 8px;
    --sp-sm: 12px;
    --sp-md: 16px;
    --sp-lg: 24px;
    --sp-xl: 32px;
    --sp-xxl: 48px;

    /* 字体 */
    --font-display: "Inter", -apple-system, "SF Pro Display", "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    --font-body: "Inter", -apple-system, "SF Pro Text", "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* ===== 基础重置 ===== */
.linear-theme {
    background: var(--canvas);
    color: var(--ink);
    font-family: var(--font-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}
.linear-theme * { box-sizing: border-box; }
.linear-theme a { color: inherit; text-decoration: none; }
.linear-theme a:hover { color: var(--primary); }

/* ===== 按钮 ===== */
.ln-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: var(--r-md);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
}
.ln-btn:focus-visible { outline: 2px solid var(--primary-focus); outline-offset: 2px; }

.ln-btn-primary { background: var(--primary); color: var(--on-primary); }
.ln-btn-primary:hover { background: var(--primary-hover); color: var(--on-primary); }
.ln-btn-primary:active { background: var(--primary-focus); }

.ln-btn-secondary { background: var(--surface-1); color: var(--ink); border-color: var(--hairline); }
.ln-btn-secondary:hover { background: var(--surface-2); color: var(--ink); }

.ln-btn-tertiary { background: transparent; color: var(--ink); }
.ln-btn-tertiary:hover { background: var(--surface-1); color: var(--ink); }

.ln-btn-inverse { background: #ffffff; color: #000000; }
.ln-btn-inverse:hover { background: #e8e9eb; color: #000000; }

/* ===== 卡片与面板 ===== */
.ln-card {
    background: var(--surface-1);
    border: 1px solid var(--hairline);
    border-radius: var(--r-lg);
    padding: 24px;
}
.ln-card-featured {
    background: var(--surface-2);
    border: 1px solid var(--hairline-strong);
}

/* ===== 输入框 ===== */
.ln-input {
    width: 100%;
    padding: 8px 12px;
    background: var(--surface-1);
    border: 1px solid var(--hairline);
    border-radius: var(--r-md);
    color: var(--ink);
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.5;
    transition: border-color .15s;
}
.ln-input::placeholder { color: var(--ink-tertiary); }
.ln-input:focus {
    outline: none;
    border-color: var(--primary-focus);
    box-shadow: 0 0 0 2px rgba(94, 105, 209, .5);
}

/* ===== 文本层级工具 ===== */
.ln-display { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.6px; color: var(--ink); }
.ln-eyebrow { font-size: 13px; font-weight: 500; letter-spacing: .4px; color: var(--ink-subtle); text-transform: uppercase; }
.ln-mono { font-family: var(--font-mono); font-size: 13px; }

/* ===== 状态徽章 ===== */
.ln-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: var(--surface-2);
    color: var(--ink-muted);
    font-size: 12px;
}
.ln-badge-success { background: rgba(39, 166, 68, .15); color: #4ade80; }

/* ===== 顶部导航 ===== */
.ln-topnav {
    position: sticky;
    top: 0;
    z-index: 100;
    height: 56px;
    background: var(--canvas);
    border-bottom: 1px solid var(--hairline);
    display: flex;
    align-items: center;
}
.ln-topnav .ln-inner {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    gap: 24px;
}

/* ===== 页脚 ===== */
.ln-footer {
    background: var(--canvas);
    color: var(--ink-subtle);
    font-size: 12px;
    padding: 64px 32px;
    text-align: center;
    border-top: 1px solid var(--hairline);
}