:root{--bg:#faf9fc;--surface:#fff;--ink:#292634;--muted:#7c7486;--line:#e9e1ef;--purple:#a184c6;--deep:#715197;--wash:#f2edf9;--shadow:0 18px 55px rgba(77,57,96,.075);--ease:cubic-bezier(.22,1,.36,1);--sans:'DM Sans','Noto Sans TC','Microsoft JhengHei',sans-serif;--serif:'Noto Serif TC','Songti TC',serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.75 var(--sans)}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:default}a{color:var(--deep)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #ccb9e5;outline-offset:2px}.app{max-width:1460px;padding:22px clamp(16px,4vw,58px) 60px;margin:auto}.header,.identity,.navigation,.sectionbar,.controls,.stats,.actionrow,.chips,.attachmentitem,.dialogtop,.formbuttons{display:flex;align-items:center}.header,.sectionbar,.dialogtop{justify-content:space-between}.header{padding-bottom:14px;border-bottom:1px solid var(--line)}.identity{gap:9px;font-weight:650;font-size:14px}.logo{width:30px;height:30px;background:var(--wash);color:var(--deep);border-radius:9px;display:grid;place-items:center;font:700 16px var(--sans)}.nonofficial{color:var(--muted);font-size:12px}.hero{padding:43px 0 21px;animation:enter .6s var(--ease) both}.eyebrow{display:flex;gap:11px;align-items:center;color:var(--deep);font:700 10px var(--sans);letter-spacing:.16em}.rule{height:1px;width:23px;background:#bda5da}.hero h1{font:600 clamp(28px,3.4vw,45px)/1.5 var(--serif);margin:7px 0 6px}.hero p{margin:0;color:var(--muted);font-size:13px}.stats{gap:0;margin-top:18px;color:var(--muted);font-size:12px;flex-wrap:wrap}.stats span{padding:0 16px;border-right:1px solid var(--line);white-space:nowrap}.stats span:first-child{padding-left:0}.stats span:last-child{border:0}.stats b{font:700 18px var(--sans);color:var(--deep);font-variant-numeric:tabular-nums}.navigation{gap:9px;flex-wrap:wrap;margin:24px 0 8px}.nav,.button{background:#fff;border:1px solid var(--line);border-radius:11px;color:#665b73;padding:9px 18px;transition:background .22s,transform .22s var(--ease),box-shadow .22s,color .22s}.nav:hover,.button:hover{transform:translateY(-2px);box-shadow:0 8px 22px #75648713}.nav.active,.primary{background:var(--deep);border-color:var(--deep);color:#fff}.status{min-height:22px;font-size:12px;color:var(--deep)}.status.error{color:#a53c59}.view{display:none}.view.is-active{display:block;animation:enter .4s var(--ease) both}@keyframes enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.sectionbar{gap:14px;align-items:flex-end;margin:22px 0 17px}.sectionbar h2{font:600 21px/1.5 var(--serif);margin:0}.sectionbar p{font-size:12px;color:var(--muted);margin:2px 0 0}.controls{gap:8px;flex-wrap:wrap}.controls input,.controls select,#graphTopic{border:1px solid var(--line);background:#fff;padding:9px 11px;border-radius:10px;min-width:150px;max-width:240px;color:var(--ink)}.timeline{overflow:auto;padding:26px 10px 30px;scrollbar-color:#d1c0e2 transparent;min-height:415px}.rail{position:relative;min-height:360px}.axis{position:absolute;left:0;right:0;top:176px;height:3px;border-radius:5px;background:linear-gradient(90deg,#e5d8f1,#ac8ed0,#e5d8f1);transform-origin:left;animation:draw .85s var(--ease) both}@keyframes draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}.yearmark{position:absolute;top:185px;color:#9b90a7;font-size:11px;white-space:nowrap}.eventcard{border:1px solid var(--line);background:var(--surface);border-radius:16px;text-align:left;padding:16px 18px;box-shadow:var(--shadow);color:var(--ink);transition:transform .25s var(--ease),box-shadow .25s,border-color .25s;animation:cardin .44s var(--ease) both;overflow:hidden}.eventcard:hover{transform:translateY(-4px);border-color:#b9a1d5;box-shadow:0 16px 38px #55406a19}@keyframes cardin{from{opacity:0;translate:0 13px}to{opacity:1;translate:0 0}}.eventcard .date{font:700 13px var(--sans);color:var(--deep);font-variant-numeric:tabular-nums}.eventcard .tag{display:inline-block;padding:2px 8px;background:var(--wash);border-radius:99px;color:var(--deep);font-size:10px;margin-left:8px}.eventcard h3{font:600 16px/1.5 var(--serif);margin:9px 0 6px;overflow-wrap:anywhere}.eventcard p{font-size:12px;color:#716b7b;margin:0 0 10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}.eventcard small{font-size:11px;color:#948b9d}.rail .eventcard{position:absolute;width:270px;min-height:143px}.rail .eventcard.upper{top:0}.rail .eventcard.lower{top:220px}.connector{position:absolute;width:2px;background:#cdb8e3;height:31px;top:146px}.connector.lower{top:180px;height:40px}.dot{position:absolute;top:169px;width:17px;height:17px;border-radius:99px;background:#ad8dcc;border:4px solid var(--bg);box-shadow:0 0 0 2px #ad8dcc}.blank{padding:45px 22px;text-align:center;color:var(--muted);border:1px dashed #d9cae9;border-radius:15px;background:#fff}.listgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:15px}.listgrid .eventcard{min-height:170px}.graphbox{background:#fff;border:1px solid var(--line);border-radius:20px;min-height:350px;padding:18px;overflow:auto;box-shadow:var(--shadow)}#graphSvg{display:block;width:100%;height:auto;min-width:300px}.graph-edge{stroke:#b49acc;fill:none;stroke-width:2;animation:linein .7s var(--ease) both}@keyframes linein{from{opacity:0;stroke-dasharray:3 1000}to{opacity:1}}.graph-node{cursor:pointer;transition:filter .2s}.graph-node:hover{filter:drop-shadow(0 5px 8px #9c7ac245)}.graph-empty{text-align:center;padding:50px 10px;color:var(--muted)}.legend{display:flex;gap:18px;margin-top:10px;color:var(--muted);font-size:11px;flex-wrap:wrap}footer{margin-top:60px;padding:20px 0;border-top:1px solid var(--line);color:#9a91a3;font-size:11px}.backdrop,.lightbox{position:fixed;inset:0;z-index:30;background:#2520348c;display:flex;align-items:center;justify-content:center;padding:18px;animation:fadein .22s ease both}[hidden]{display:none!important}@keyframes fadein{from{opacity:0}to{opacity:1}}.dialog{background:#fff;border-radius:20px;width:min(740px,100%);max-height:min(92vh,920px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 90px #261b3440;animation:modalin .3s var(--ease) both}@keyframes modalin{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}.dialogtop{padding:13px 21px;border-bottom:1px solid var(--line);font-weight:600;flex:none}.iconbtn{border:0;background:var(--wash);border-radius:9px;padding:3px 11px;font-size:22px;color:var(--deep)}#dialogBody{overflow:auto;padding:22px}.detailDate,.mini{color:var(--deep);font-size:12px;font-weight:600}.detailTitle{font:600 clamp(22px,3vw,30px)/1.55 var(--serif);margin:9px 0 9px}.detailBody{white-space:pre-wrap;overflow-wrap:anywhere;color:#514b58;font-size:14px;line-height:1.85}.detailSection{font:600 17px var(--serif);margin:24px 0 10px}.actionrow{gap:9px;flex-wrap:wrap;margin-top:18px}.attachmentgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:10px}.attachmentitem{background:#fbf9fe;border:1px solid var(--line);border-radius:12px;padding:11px;gap:10px;text-align:left;min-width:0;overflow-wrap:anywhere;font-size:12px}.attachmentitem img{width:52px;height:52px;object-fit:cover;border-radius:7px}.attachmentitem a{min-width:0;overflow-wrap:anywhere}.relationitem{display:flex;align-items:center;gap:8px;justify-content:space-between;border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin:7px 0}.relationitem button{border:0;background:transparent;color:var(--deep);text-align:left;flex:1}.relationitem .remove{flex:none;color:#a23b60}.field{display:grid;gap:6px;margin:12px 0}.field label{font-weight:600;font-size:12px}.field input,.field textarea,.field select{border:1px solid #ded4e9;border-radius:10px;padding:11px 12px;color:var(--ink);background:#fff;max-width:100%;width:100%}.field textarea{min-height:125px;resize:vertical}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 13px}.formbuttons{gap:9px;margin-top:16px;flex-wrap:wrap}.hint{font-size:11px;color:var(--muted)}.uploadstatus{font-size:12px;color:var(--deep)}.attached{border:1px solid var(--line);border-radius:10px;padding:7px 10px;margin:5px 0;display:flex;gap:8px;align-items:center;justify-content:space-between}.attached span{overflow-wrap:anywhere;min-width:0}.attached button{border:0;background:transparent;color:#9d3d59}.lightbox{z-index:50}.lightbox img{object-fit:contain;max-width:95vw;max-height:88vh}.lightbox button{position:absolute;top:18px;right:22px;background:#fff;border:0;border-radius:99px;padding:1px 13px;font-size:28px}.historyrow{padding:10px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;align-items:center}.historyrow .button{font-size:11px;padding:5px 10px}@media(max-width:700px){.app{padding:13px 16px 45px}.nonofficial{display:none}.hero{padding:31px 0 17px}.hero h1{font-size:29px}.stats{row-gap:8px}.stats span{padding:0 10px}.stats span:first-child{padding:0}.stats b{font-size:16px}.navigation{margin:19px 0 6px}.nav{padding:8px 11px;font-size:12px}.sectionbar{align-items:flex-start;flex-direction:column;margin-top:17px}.controls{width:100%}.controls input{flex:1;min-width:130px}.controls select{min-width:113px;max-width:140px}.timeline{padding:0 0 10px;overflow:visible;min-height:0}.rail{min-height:0!important;width:auto!important;display:grid;gap:13px;padding-left:33px}.axis{left:11px;right:auto;top:0;bottom:0;width:2px;height:auto;transform-origin:top;animation:drawvertical .8s ease both}@keyframes drawvertical{from{transform:scaleY(0)}to{transform:scaleY(1)}}.rail .eventcard,.rail .eventcard.upper,.rail .eventcard.lower{position:relative;top:auto;left:auto!important;width:100%;min-height:0}.rail .eventcard:before{content:'';position:absolute;left:-28px;top:23px;width:12px;height:12px;background:#ad8dcc;border:3px solid var(--bg);border-radius:99px;box-shadow:0 0 0 1px #ad8dcc}.connector,.dot,.yearmark{display:none}.eventcard:hover{transform:none}.eventcard:active{transform:scale(.99)}.graphbox{padding:8px;min-height:270px}.dialog{max-height:94vh}.dialogtop{padding:11px 15px}#dialogBody{padding:17px}.formgrid{grid-template-columns:1fr}.detailTitle{font-size:23px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important;translate:none!important}}

.quick-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin:12px 0}.categoryline{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #eee7f4}.categoryline .button{flex-shrink:0}.category-new{display:flex;gap:8px;margin-top:16px}.category-new input{min-width:0;flex:1}.category-help{font-size:12px;color:#766e82;margin:12px 0}

.image-drop{margin-top:15px;display:flex;flex-direction:column;align-items:center;gap:5px;padding:23px 16px;border:1.5px dashed #c5afe0;background:#faf7fd;border-radius:13px;cursor:pointer;text-align:center;color:#735398;transition:background .2s,border-color .2s}.image-drop:hover,.image-drop.over,.image-drop:focus-visible{background:#f0e8f8;border-color:#8962b8}.image-drop strong{font-size:14px}.image-drop span{font-size:12px;color:#655c6f}.image-drop small{font-size:11px;color:#898090}.attached-thumb{height:43px;width:43px;object-fit:cover;border-radius:7px;flex:none}.attached span{flex:1}.uploadstatus:not(:empty){padding:10px 0;font-size:12px}

/* Thumbnail preview on timeline cards; preserves card proportions. */
.eventcard-preview{position:relative;width:100%;height:98px;overflow:hidden;border-radius:10px;background:#f1edf6;margin:10px 0 12px;border:1px solid #e9e1ef}
.eventcard-preview img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .35s var(--ease)}
.eventcard:hover .eventcard-preview img{transform:scale(1.025)}
.eventcard-preview .preview-count{position:absolute;right:8px;bottom:7px;background:#292634cc;color:#fff;border-radius:6px;padding:2px 7px;font-size:11px;line-height:1.6}
.eventcard-preview .preview-count:empty{display:none}
.timeline.with-previews .rail{min-height:625px}
.timeline.with-previews .axis{top:299px}
.timeline.with-previews .yearmark{top:310px}
.timeline.with-previews .dot{top:292px}
.timeline.with-previews .connector{top:267px;height:33px}
.timeline.with-previews .connector.lower{top:303px;height:42px}
.timeline.with-previews .rail .eventcard.lower{top:345px}
/* Announcements are detached from the existing event editor. */
.header-tools{display:flex;align-items:center;gap:16px}
.announcement-link{border:0;background:transparent;color:var(--deep);font-size:12px;padding:6px 0;text-decoration:underline;text-underline-offset:4px}
.announcement-backdrop{position:fixed;inset:0;z-index:90;background:rgba(34,27,46,.48);display:flex;align-items:center;justify-content:center;padding:20px;animation:fadein .24s ease both}
.announcement-backdrop[hidden]{display:none!important}
.announcement-open{overflow:hidden}
.announcement-panel{width:min(440px,100%);max-height:min(80vh,690px);overflow:auto;background:#fff;border-radius:20px;box-shadow:0 24px 78px #281d3c33;padding:26px 28px 25px;animation:modalin .34s var(--ease) both}
.announcement-head{display:flex;align-items:center;justify-content:space-between}
.announcement-eyebrow{color:#947ab0;font-size:10px;font-weight:700;letter-spacing:.15em}
.announcement-close{border:0;background:#f2edf9;color:#715197;border-radius:9px;font-size:23px;width:33px;height:33px;line-height:1}
.announcement-panel h2{font:600 23px/1.45 var(--serif);margin:12px 0 15px}
.announcement-panel ul{padding-left:20px;margin:0 0 22px;color:#595263;line-height:1.9;font-size:13px}
.announcement-panel li+li{margin-top:7px}
.announcement-dismiss{width:100%;padding:11px}
@media(max-width:700px){.timeline.with-previews .rail{min-height:0}.timeline.with-previews .axis{top:0}.timeline.with-previews .rail .eventcard.lower{top:auto}.eventcard-preview{height:132px}.announcement-panel{padding:20px;border-radius:17px}}
@media(prefers-reduced-motion:reduce){.eventcard-preview img{transition:none}}

/* Event comments */
.comments-block{margin-top:24px;border-top:1px solid #eee8f3;padding-top:16px}
.comments-head{display:flex;justify-content:space-between;align-items:center}
.comments-list{display:grid;gap:10px;margin:12px 0 18px;max-height:360px;overflow:auto}
.comment-item{padding:12px 14px;background:#f9f7fc;border:1px solid #eae2f3;border-radius:12px;animation:modalin .22s ease both}
.comment-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12px;color:#6e6081}
.comment-meta time{font-size:11px;color:#928b9c}
.comment-item p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.7;margin:8px 0;color:#37323f}
.comment-delete{border:0;background:transparent;color:#85758e;font-size:11px;cursor:pointer;padding:4px 0}
.comment-delete:hover{text-decoration:underline;color:#a14d6b}
.comment-form{background:#fff;border:1px solid #eae2f3;border-radius:14px;padding:14px;display:grid;gap:10px}
.comment-form textarea{min-height:76px;resize:vertical}
.comment-submit{display:flex;align-items:center;justify-content:space-between;gap:8px}
@media(max-width:700px){.comment-item{padding:11px}.comment-form{padding:12px}}

/* Per-image optional blur: preview stays blurred until the user chooses the lightbox. */
.eventcard[role="button"]{cursor:pointer;display:block}
.eventcard[role="button"]:focus-visible{outline:3px solid #a487d0;outline-offset:3px}
.eventcard-preview img,.attachment-image-button img,.attached-thumb{transition:filter .25s ease,transform .3s ease}
.eventcard-preview.is-blurred img,.attachment-image-button.is-blurred img,.attached-thumb.is-blurred{filter:blur(15px)}
.eventcard-preview .preview-open{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;border:1px solid #fff9;background:#2d263bdc;color:white;border-radius:99px;padding:7px 12px;font:500 12px var(--sans);cursor:pointer;white-space:nowrap}
.eventcard-preview .preview-open:hover{background:#594174}
.eventcard-preview .preview-count{z-index:2;pointer-events:none}
.attachment-image-button{position:relative;display:block;width:100%;height:116px;border:0;padding:0;border-radius:9px;overflow:hidden;background:#eee7f3;cursor:pointer}
.attachment-image-button img{width:100%;height:100%;object-fit:cover;border-radius:0}
.attachment-image-button span{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:#2d263bdc;color:white;padding:5px 10px;border-radius:99px;font-size:11px;white-space:nowrap;max-width:95%;overflow:hidden;text-overflow:ellipsis}
.attachment-name{margin-top:7px;color:#665c71;overflow-wrap:anywhere}
.blur-toggle{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:12px;color:#6a4d8e;cursor:pointer;margin-left:auto}
.blur-toggle input{accent-color:#956cbe;width:16px;height:16px}
.attached{flex-wrap:wrap}
.attached span{flex:1;min-width:100px}
@media(prefers-reduced-motion:reduce){.eventcard-preview img,.attachment-image-button img,.attached-thumb{transition:none}}