#writing-dialog{width:min(840px,calc(100% - 36px));max-height:min(88vh,1000px);max-height:min(88dvh,1000px);padding:0;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--ink);overflow:hidden;box-shadow:0 28px 110px #15112938}
#writing-dialog[open]{display:flex;flex-direction:column;animation:writing-enter .22s cubic-bezier(.2,.7,.3,1)}
#writing-dialog::backdrop{background:#17151f70;backdrop-filter:blur(9px)}
#writing-dialog .writing-dialog-header{display:flex;justify-content:space-between;gap:25px;align-items:flex-start;padding:27px 30px 23px;flex:none;border-bottom:1px solid var(--line)}
#writing-dialog .writing-dialog-header .eyebrow{color:var(--purple);font-size:10px;letter-spacing:1.9px;margin-bottom:12px}
#writing-dialog .writing-dialog-title{font-size:28px;letter-spacing:-.7px;line-height:1.3}
#writing-dialog .writing-dialog-title .zh{display:block;margin-top:7px;font-size:18px;font-weight:500;color:var(--muted);letter-spacing:.1px}
#writing-dialog .writing-dialog-intro{font-size:12px;color:var(--muted);margin-top:11px;line-height:1.7}
#writing-dialog .writing-dialog-intro .zh{margin-left:7px}
#writing-dialog [data-writing-close]{width:42px;height:42px;flex:none;border:1px solid var(--line);border-radius:50%;font-size:27px;line-height:1;display:grid;place-items:center;transition:background .2s,color .2s}
#writing-dialog [data-writing-close]:hover{background:var(--soft);color:var(--purple)}
#writing-dialog .writing-dialog-tools{padding:17px 30px;display:flex;gap:16px;align-items:center;border-bottom:1px solid var(--line);flex:none;background:color-mix(in srgb,var(--soft) 40%,var(--surface))}
#writing-dialog .writing-search{display:flex;align-items:center;gap:10px;flex:1;min-width:0;border:1px solid var(--line);background:var(--surface);padding:10px 13px;border-radius:10px}
#writing-dialog .writing-search svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linecap:round}
#writing-dialog .writing-search input{display:block;min-width:0;flex:1;width:100%;padding:0;background:transparent;color:var(--ink);font-size:13px;line-height:1.6;border:0;outline:none}
#writing-dialog .writing-search:focus-within{outline:2px solid var(--purple);outline-offset:2px}
#writing-dialog .writing-result-count{color:var(--muted);font-size:10px;line-height:1.4;white-space:nowrap;text-align:right}
#writing-dialog [data-writing-count]{display:block;font-family:var(--display);font-weight:650;font-size:26px;letter-spacing:-1px;color:var(--purple);font-variant-numeric:tabular-nums}
#writing-dialog .writing-result-count .zh{margin-left:3px}
#writing-dialog .writing-dialog-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:25px 30px 30px;scrollbar-gutter:stable}
#writing-dialog .writing-collection+.writing-collection{margin-top:30px}
#writing-dialog .writing-collection-heading{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-bottom:13px}
#writing-dialog .writing-collection-heading h3{font-size:15px;line-height:1.5;letter-spacing:.1px}
#writing-dialog .writing-collection-heading>span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
#writing-dialog .writing-articles{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
#writing-dialog .writing-article{border-bottom:1px solid var(--line)}
#writing-dialog .writing-article>a{display:flex;gap:15px;align-items:flex-start;padding:17px 6px 17px 0;transition:background .2s,color .2s;border-radius:7px}
#writing-dialog .writing-article>a:hover{color:var(--purple);background:color-mix(in srgb,var(--purple) 4%,transparent)}
#writing-dialog .writing-article>a:focus-visible{outline-offset:-2px}
#writing-dialog .writing-article-number{padding-top:2px;flex:0 0 24px;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;font-family:var(--display)}
#writing-dialog .writing-article-copy{flex:1;min-width:0}
#writing-dialog .writing-article-title{display:block;font-size:15px;line-height:1.75;overflow-wrap:anywhere}
#writing-dialog .writing-article-source{display:block;font-size:10px;letter-spacing:.2px;color:var(--muted);margin-top:5px}
#writing-dialog .writing-article-arrow{font-size:21px;line-height:1.3;color:var(--purple);flex:none;padding-top:2px;transition:transform .2s}
#writing-dialog .writing-article>a:hover .writing-article-arrow{transform:translate(2px,-2px)}
#writing-dialog .writing-empty{padding:35px 0;color:var(--muted);font-size:14px;text-align:center}
#writing-dialog .writing-empty .zh{display:block;margin-top:6px}
html[data-language=zh] #writing-dialog .writing-dialog-title .zh{color:var(--ink);font-size:27px;margin:0;font-weight:650}
html[data-language=zh] #writing-dialog .writing-dialog-intro .zh{margin-left:0}
@keyframes writing-enter{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:650px){
  #writing-dialog{width:calc(100% - 20px);max-height:92vh;max-height:92dvh;border-radius:15px}
  #writing-dialog .writing-dialog-header{padding:21px 20px 18px;gap:12px}
  #writing-dialog .writing-dialog-header .eyebrow{font-size:9px;margin-bottom:10px}
  #writing-dialog .writing-dialog-title{font-size:23px;letter-spacing:-.4px}
  #writing-dialog .writing-dialog-title .zh{font-size:16px}
  html[data-language=zh] #writing-dialog .writing-dialog-title .zh{font-size:24px}
  #writing-dialog .writing-dialog-intro{font-size:11px;max-width:230px}
  #writing-dialog .writing-dialog-intro .zh{display:block;margin:3px 0 0}
  #writing-dialog [data-writing-close]{width:38px;height:38px;font-size:25px}
  #writing-dialog .writing-dialog-tools{padding:14px 20px;gap:12px}
  #writing-dialog .writing-search{padding:9px 10px;gap:8px}
  #writing-dialog .writing-search input{font-size:12px}
  #writing-dialog .writing-result-count{font-size:9px}
  #writing-dialog [data-writing-count]{font-size:23px}
  #writing-dialog .writing-result-count .zh{display:block;margin:0}
  #writing-dialog .writing-dialog-scroll{padding:22px 20px 25px}
  #writing-dialog .writing-collection-heading{gap:8px}
  #writing-dialog .writing-collection-heading h3{font-size:14px}
  #writing-dialog .writing-article>a{gap:10px;padding-block:15px}
  #writing-dialog .writing-article-number{flex-basis:19px;font-size:10px}
  #writing-dialog .writing-article-title{font-size:14px;line-height:1.8}
}
@media(prefers-reduced-motion:reduce){#writing-dialog[open]{animation:none}#writing-dialog .writing-article>a,#writing-dialog [data-writing-close],#writing-dialog .writing-article-arrow{transition:none}}
html[data-motion-paused=true] #writing-dialog[open]{animation:none}
@media print{#writing-dialog{display:none!important}}
