/* 工具 01 · 请假理由生成器
   独立视觉：拟真请假条稿纸 + 便签墙 + 朱红印章；衬线大标题，墨绿 / 铜红配色。 */
.lx {
    --a1: #2d6a55; --a1b: #b05a3b; --a1s: #e6f0e7; --a1i: #245646;
    --a2: #7bcaa6; --a2b: #e2a07e; --a2s: rgba(123, 202, 166, .14); --a2i: #a9e2c8;
    --h15-h1: clamp(30px, 3.6vw, 42px);
    --h15-h2: 21px;
}
.lx .lx-h1 { font-family: var(--h15-font-serif); font-weight: 700; letter-spacing: .015em; }
.lx .lx-sub { font-size: 16px; line-height: 1.9; }

.lx-hero {
    padding-right: 150px;
    background:
        repeating-linear-gradient(0deg, transparent 0 31px, rgba(45, 106, 85, .045) 31px 32px),
        radial-gradient(700px 280px at 88% -20%, var(--h15-accent-soft), transparent 72%),
        linear-gradient(135deg, #fffdf6 0%, #f7f3e6 100%);
}
.lx-hero::before { width: 7px; background: repeating-linear-gradient(180deg, var(--a1b) 0 12px, transparent 12px 20px); }
:root[data-theme="dark"] .lx .lx-hero {
    background:
        repeating-linear-gradient(0deg, transparent 0 31px, rgba(123, 202, 166, .05) 31px 32px),
        radial-gradient(700px 280px at 88% -20%, var(--h15-accent-soft), transparent 72%),
        linear-gradient(135deg, #14232a 0%, #101b21 100%);
}
:root[data-theme="dark"] .lx .lx-hero::before { background: repeating-linear-gradient(180deg, var(--a2b) 0 12px, transparent 12px 20px); }

.lx-stamp {
    position: absolute; right: 34px; top: 34px;
    width: 92px; height: 92px; display: grid; place-content: center; gap: 1px;
    border: 3px double var(--a1b); border-radius: 50%;
    color: var(--a1b); font-family: var(--h15-font-serif); font-size: 17px; font-weight: 700;
    line-height: 1.2; text-align: center; transform: rotate(-13deg); opacity: .78;
    box-shadow: inset 0 0 0 3px var(--h15-card), inset 0 0 0 4px var(--a1b);
}
:root[data-theme="dark"] .lx .lx-stamp { color: var(--a2b); border-color: var(--a2b); box-shadow: inset 0 0 0 3px var(--h15-card), inset 0 0 0 4px var(--a2b); }

.lx-quick {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
    padding: 14px 16px; border: 1px solid var(--h15-line); border-radius: 14px;
    background: var(--h15-card); box-shadow: var(--h15-shadow-sm);
}
.lx-quick-f { display: grid; gap: 4px; min-width: 118px; flex: 1 1 118px; }
.lx-quick-f > span { font-size: var(--h15-fs-12); font-weight: 700; color: var(--h15-ink-2); }
.lx-main-btn { padding-left: 24px; padding-right: 24px; }
.lx-err { min-height: 20px; margin-top: 8px; }

.lx-desk { grid-template-columns: minmax(0, 400px) minmax(0, 1fr); }
@media (max-width: 960px) { .lx-desk { grid-template-columns: 1fr; } .lx-hero { padding-right: 38px; } .lx-stamp { display: none; } }

.lx-paper {
    position: relative; overflow: hidden;
    background:
        linear-gradient(90deg, transparent 0 30px, rgba(176, 90, 59, .16) 30px 31px, transparent 31px),
        repeating-linear-gradient(0deg, transparent 0 33px, rgba(45, 106, 85, .055) 33px 34px),
        var(--h15-card);
    padding-left: 44px;
}
.lx-paper .h15-note { margin-top: 16px; }
:root[data-theme="dark"] .lx .lx-paper {
    background:
        linear-gradient(90deg, transparent 0 30px, rgba(226, 160, 126, .2) 30px 31px, transparent 31px),
        repeating-linear-gradient(0deg, transparent 0 33px, rgba(123, 202, 166, .05) 33px 34px),
        var(--h15-card);
}
.lx-board { background: var(--h15-card-2); }
.lx-toolbar { margin: 0 0 16px; }

.lx-notes { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; align-items: start; }
.lx-notes .h15-empty { grid-column: 1 / -1; }
.lx-note {
    position: relative; padding: 16px 16px 13px;
    border: 1px solid rgba(45, 106, 85, .2); border-radius: 4px 14px 4px 14px;
    background: linear-gradient(150deg, #fffdf3 0%, #f6f1dd 100%);
    box-shadow: 0 4px 12px rgba(60, 50, 25, .1);
    transform: rotate(var(--tilt, -1deg)); transition: transform .18s, box-shadow .18s;
}
.lx-note:hover { transform: rotate(0deg) translateY(-2px); box-shadow: 0 10px 24px rgba(60, 50, 25, .16); }
.lx-note::after {
    content: ""; position: absolute; right: 12px; bottom: 10px; width: 22px; height: 22px;
    border-right: 2px solid rgba(176, 90, 59, .35); border-bottom: 2px solid rgba(176, 90, 59, .35);
    transform: rotate(-18deg); pointer-events: none;
}
:root[data-theme="dark"] .lx .lx-note {
    background: linear-gradient(150deg, #1b2c31 0%, #16242a 100%);
    border-color: rgba(123, 202, 166, .3); box-shadow: 0 4px 14px rgba(0, 0, 0, .35);
}
.lx-note-top { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.lx-note-no { font-family: var(--h15-font-num); font-size: var(--h15-fs-12); font-weight: 700; color: var(--a1b); }
:root[data-theme="dark"] .lx .lx-note-no { color: var(--a2b); }
.lx-note-tag { flex: 1; font-size: var(--h15-fs-11); color: var(--h15-ink-3); }
.lx-note-chars { font-family: var(--h15-font-num); font-size: var(--h15-fs-11); color: var(--h15-ink-3); }
.lx-note-reason { margin: 0 0 12px; font-size: var(--h15-fs-14); line-height: 1.85; color: var(--h15-ink); }
.lx-note-risk { margin-top: 9px; padding: 7px 9px; border-radius: 7px; background: rgba(184, 121, 28, .12); color: var(--h15-warn); font-size: var(--h15-fs-12); line-height: 1.6; }
.lx-note-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.lx-note-actions button {
    padding: 4px 10px; border: 1px solid var(--h15-line); border-radius: 999px;
    background: var(--h15-card); color: var(--h15-ink-2); font-family: inherit;
    font-size: var(--h15-fs-11); cursor: pointer;
}
.lx-note-actions button:hover { border-color: var(--h15-accent); color: var(--h15-accent-ink); }

.lx-ai { margin-top: 22px; padding-top: 18px; border-top: 1px dashed var(--h15-line); display: grid; gap: 9px; justify-items: start; }
.lx-ai .h15-hint { max-width: 620px; }
.lx-ai-box { width: 100%; margin-top: 8px; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--h15-line); background: var(--h15-card); font-size: var(--h15-fs-14); line-height: 1.9; white-space: pre-wrap; }
.lx-letter { margin: 0; font-family: var(--h15-font); font-size: var(--h15-fs-14); line-height: 2; white-space: pre-wrap; word-break: break-word; }

.lx-scenes { margin-top: 20px; }
.lx-scene { padding: 14px 16px; border-radius: 12px; border: 1px solid var(--h15-line); background: var(--h15-card-2); }
.lx-scene .h15-h3 { color: var(--h15-accent-ink); font-family: var(--h15-font-serif); font-size: 16px; }
.lx-scene .h15-lead { margin: 0; line-height: 1.85; }
.lx-faq .h15-faq-q { font-family: var(--h15-font-serif); }
.lx-history { margin-top: 12px; border-top: 1px dashed var(--h15-line); padding-top: 10px; }
.lx-hist-item { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 6px 0; font-size: var(--h15-fs-12); color: var(--h15-ink-2); }
.lx-hist-item button { border: 0; background: transparent; color: var(--h15-accent-ink); font-weight: 700; cursor: pointer; font-size: var(--h15-fs-12); }