:root { --ink:#20312d; --muted:#6f7d78; --paper:#f3f0e8; --cream:#fbfaf5; --green:#365c4c; --line:#d9ddd3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Microsoft YaHei","PingFang SC",sans-serif; }
button,input,textarea,select { font:inherit; }
.topbar { min-height:72px; padding:14px clamp(20px,5vw,72px); display:flex; align-items:center; gap:28px; border-bottom:1px solid rgba(32,49,45,.13); background:rgba(243,240,232,.92); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }
.brand { color:var(--ink); text-decoration:none; font-family:Georgia,"STSong",serif; font-size:20px; font-weight:700; letter-spacing:.08em; display:flex; align-items:center; gap:10px; white-space:nowrap; }
.brand span { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--green); color:#fff; font-size:16px; }
.search { margin-left:auto; width:min(360px,36vw); height:40px; display:flex; align-items:center; gap:8px; padding:0 14px; border:1px solid var(--line); background:rgba(255,255,255,.58); border-radius:999px; }
.search input { border:0; outline:0; background:transparent; width:100%; color:var(--ink); }
.local { font-size:13px; color:var(--muted); white-space:nowrap; }.local i { display:inline-block; width:7px; height:7px; border-radius:50%; background:#c48c4e; margin-right:6px; }
.sync-entry { border:0; background:transparent; color:var(--muted); cursor:pointer; white-space:nowrap; }.sync-entry i { display:inline-block; width:7px; height:7px; border-radius:50%; background:#4f8a69; margin-right:6px; }
.hero { min-height:650px; padding:88px 20px 68px; text-align:center; background:radial-gradient(circle at 70% 12%,rgba(185,200,177,.45),transparent 26%),linear-gradient(180deg,#f6f3eb 0%,var(--paper) 100%); }
.eyebrow,.section-head p { color:#819084; font-size:11px; font-weight:700; letter-spacing:.22em; }
h1 { margin:16px auto 18px; font:500 clamp(42px,6vw,72px)/1.15 Georgia,"STSong",serif; letter-spacing:-.04em; } h1 em { color:var(--green); font-style:normal; }
.lead { margin:0 auto 34px; max-width:680px; color:var(--muted); line-height:1.8; }
.capture { width:min(760px,100%); margin:auto; background:var(--cream); border:1px solid #d9ded3; border-radius:20px; box-shadow:0 20px 60px rgba(54,75,67,.10); overflow:hidden; text-align:left; }
.capture textarea { display:block; resize:vertical; width:100%; min-height:150px; padding:25px 27px; border:0; outline:0; background:transparent; line-height:1.7; color:var(--ink); }.capture textarea::placeholder { color:#a6aea9; }
.capture-footer { border-top:1px solid #e4e5de; padding:13px 15px 13px 26px; display:flex; align-items:center; justify-content:space-between; gap:14px; color:#87908c; font-size:12px; }
.capture button { border:0; border-radius:12px; background:var(--green); color:#fff; padding:13px 19px; font-weight:700; cursor:pointer; }.capture button:disabled { opacity:.45; cursor:not-allowed; }.capture button b { margin-left:8px; }
.status { min-height:22px; margin:14px 0 2px; color:var(--green); font-size:13px; }.status.error { color:#9f3f35; }
.notice { width:min(760px,100%); margin:10px auto 0; padding:12px 15px; border-radius:10px; color:#6f675a; background:#eee6d6; font-size:12px; line-height:1.6; }
.library { padding:72px clamp(20px,6vw,88px) 90px; max-width:1320px; margin:auto; }.section-head { display:flex; justify-content:space-between; align-items:end; padding-bottom:24px; border-bottom:1px solid #ccd2c9; }.section-head p { margin:0 0 8px; }.section-head h2 { font:500 36px/1 Georgia,"STSong",serif; margin:0; }.section-head>span { color:var(--muted); font-size:13px; }
.library-actions { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:13px; }.library-actions select,.library-actions button { border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); padding:8px 12px; }.library-actions button { cursor:pointer; }.library-actions button:disabled { opacity:.55; cursor:wait; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding-top:24px; }.card { min-width:0; padding:24px; background:rgba(251,250,245,.76); border:1px solid var(--line); border-radius:16px; }.card-meta { display:flex; justify-content:space-between; color:#8a958f; font-size:11px; }.card-meta span { color:var(--green); font-weight:700; letter-spacing:.08em; }.summary { font:500 18px/1.7 Georgia,"STSong",serif; min-height:60px; overflow-wrap:anywhere; }.card details { color:var(--muted); font-size:13px; }.card summary { cursor:pointer; }.raw { background:#eeeee7; padding:12px; border-radius:8px; max-height:150px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; }
.edit-row { display:flex; gap:8px; margin-top:18px; }.edit-row label { flex:1; min-width:0; }.edit-row label:first-child { max-width:150px; }.edit-row span { display:block; margin:0 0 5px 8px; color:#87908c; font-size:10px; }.edit-row input { width:100%; min-width:0; border:1px solid #d9ddd3; background:#fff; color:var(--ink); border-radius:999px; padding:8px 12px; font-size:12px; }.edit-row label:first-child input { font-weight:700; }
.delete { margin-top:14px; border:0; background:transparent; color:#9a6861; font-size:11px; cursor:pointer; }.empty { text-align:center; padding:70px 20px; color:var(--muted); }.empty b { color:var(--ink); font:500 22px Georgia,"STSong",serif; } [hidden] { display:none!important; } footer { padding:28px; text-align:center; color:#87908c; border-top:1px solid var(--line); font-size:12px; }
.explanation { margin:-4px 0 16px; color:#78857f; font-size:11px; line-height:1.6; }
.raw-editor { width:100%; margin-top:10px; padding:10px; resize:vertical; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); line-height:1.6; }.save-raw,.reclassify { margin-top:9px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--green); padding:7px 12px; font-size:11px; cursor:pointer; }.correction { display:block; margin-top:12px; }.correction span { display:block; margin:0 0 5px 8px; color:#87908c; font-size:10px; }.correction input { width:100%; border:1px solid #d9ddd3; background:#fff; color:var(--ink); border-radius:999px; padding:8px 12px; font-size:12px; }
dialog { width:min(560px,calc(100% - 32px)); border:0; border-radius:18px; padding:0; color:var(--ink); box-shadow:0 30px 90px rgba(20,35,30,.3); }dialog::backdrop{background:rgba(25,35,31,.46);backdrop-filter:blur(4px)}.sync-panel{position:relative;padding:30px}.sync-panel h3{margin:0 0 10px;font:500 28px Georgia,"STSong",serif}.sync-panel p{color:var(--muted);line-height:1.6;font-size:13px}.sync-panel textarea{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;resize:none}.dialog-close{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:24px;color:var(--muted);cursor:pointer}.sync-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.sync-buttons button{border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--green);padding:9px 13px;cursor:pointer}.sync-buttons button:first-child{background:var(--green);color:#fff}.sync-message{min-height:20px}
.account-tabs{display:flex;gap:6px;margin:18px 0}.account-tabs button{border:0;border-radius:999px;background:#edf1ed;color:var(--muted);padding:8px 14px;cursor:pointer}.account-tabs button.active{background:var(--green);color:#fff}.sync-panel label{display:block;margin:12px 0;color:var(--muted);font-size:13px}.sync-panel label input{display:block;width:100%;margin-top:6px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;color:var(--ink)}[hidden]{display:none!important}
@media (max-width:720px) { .topbar { flex-wrap:wrap; gap:12px; }.search { order:3; width:100%; }.local { margin-left:auto; }.hero { padding-top:58px; }.capture-footer span { display:none; }.capture-footer { justify-content:flex-end; }.grid { grid-template-columns:1fr; }.library { padding-top:54px; }.section-head { align-items:flex-start; gap:18px; flex-direction:column; }.library-actions { width:100%; flex-wrap:wrap; }.edit-row { flex-direction:column; }.edit-row label:first-child { max-width:none; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; } }
