:root{--paper:#f5f2ea;--ink:#26241f;--ink2:#6d6960;--ink3:#a49f93;--line:#ddd8cb;
  --sys-bg:#e9e5da;--fs:16px;
  --sans:"BIZ UDPGothic","Yu Gothic UI","Meiryo",sans-serif;--serif:"Yu Mincho","YuMincho",serif;
  --mono:"BIZ UDGothic","Consolas",monospace}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:var(--fs);line-height:1.75}
body{padding:10px 18px 18px}
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:#d6d1c4;border-radius:5px;border:2px solid var(--paper)}
a{color:var(--ink-c,#6a6a62)}
.msg{display:flex;gap:10px;margin:14px 0;align-items:flex-start}
.msg .av{width:36px;height:36px;border-radius:12px;flex:none;overflow:hidden;display:flex;align-items:center;justify-content:center;
  font:600 15px var(--serif);color:#fff;background:var(--ink-c);border:1px solid var(--sub-c)}
.msg .av.pic{background:#fff}
.msg .av img{width:100%;height:100%;object-fit:cover}
.msg .col{display:flex;flex-direction:column;max-width:78%;min-width:0}
.msg .meta{display:flex;align-items:baseline;gap:8px;margin:0 0 3px 2px}
.msg .meta b{font:600 .82em var(--serif);letter-spacing:.1em;color:var(--ink-c)}
.msg .meta span{font-size:.7em;color:var(--ink3)}
.msg .row{display:flex;align-items:flex-end;gap:6px}
.msg .b{padding:8px 14px;border-radius:4px 16px 16px 16px;border:1px solid var(--sub-c);background:var(--back-c);color:var(--body-c);
  box-shadow:0 1px 2px rgba(38,36,31,.05);overflow-wrap:anywhere;min-width:0}
.msg .b code,.msg .b .spot{font-family:var(--mono);font-size:.86em;color:var(--ink-c);font-weight:700}
.msg .time{font-size:.66em;color:var(--ink3);white-space:nowrap;padding-bottom:2px}
.msg.right{flex-direction:row-reverse}
.msg.right .col{align-items:flex-end}
.msg.right .meta{flex-direction:row-reverse;margin:0 2px 3px 0}
.msg.right .row{flex-direction:row-reverse}
.msg.right .b{background:var(--ink-c);border-color:var(--ink-c);color:#fff;border-radius:16px 4px 16px 16px}
.msg.right .b a{color:#fff !important}
.more{font-size:.8em;margin:4px 0 0 4px}
.more a{color:var(--ink-c);text-decoration:none}
.detail{margin-top:6px;padding:10px 14px;border-radius:10px;background:#fff;border:1px dashed var(--sub-c);color:var(--body-c);font-size:.88em;line-height:1.7}
.sys{display:flex;justify-content:center;margin:12px 0}
.sys span{background:var(--sys-bg);color:#8f8a7e;font-size:.76em;padding:3px 14px;border-radius:999px;letter-spacing:.04em;text-align:center}
.day{display:flex;align-items:center;gap:14px;color:var(--ink3);font-size:.7em;letter-spacing:.2em;margin:8px 0 10px}
.day::before,.day::after{content:"";flex:1;height:1px;background:var(--line)}
.tool{margin:3px 0 3px 46px}
.tool span{display:inline-block;font-size:.74em;color:var(--ink3);padding:1px 10px;border:1px dashed var(--line);border-radius:6px;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tool span b{font-weight:600;color:var(--ink-c)}
.tool span a{color:var(--ink3);text-decoration:none;margin-left:6px}
.tool .steps{margin:3px 0 0 4px;padding-left:10px;border-left:2px solid var(--line);font-size:.74em;color:var(--ink3);line-height:1.6}
.tool .steps div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card{margin:10px 0 10px 46px;max-width:78%}
.chead{font-size:.76em;color:var(--ink3)}
.chead b{color:var(--ink-c)}
.cbody{margin-top:4px;padding:9px 14px;border-radius:10px;background:#fbfaf6;border:1px solid var(--line);color:#5a564c;overflow-wrap:anywhere}
.cbody img{max-width:420px;width:100%;border-radius:8px;display:block}
.links{margin-top:6px;display:flex;gap:8px;flex-wrap:wrap}
.btn{font-size:.8em;text-decoration:none;color:var(--ink-c);border:1px solid var(--sub-c);background:#fff;border-radius:999px;padding:2px 12px}
.btn:hover{background:var(--back-c)}
.btn.done{color:var(--ink3);border-color:var(--line);pointer-events:none}
.lyric{text-align:center;margin:4px 0}
.choice{margin:12px 0 12px 46px;max-width:78%;padding:8px 14px 9px;border-radius:12px;background:#fbf3e4;border:1px solid #e9cf9f;
  border-left:5px solid #d39a4a;color:#5b4a30}
.choice .chd{display:flex;align-items:baseline;gap:8px;font-size:.72em;color:#b0864c;letter-spacing:.08em}
.choice .cdrive::before{content:"💭 ひとりの時間・"}
.choice .ctime{margin-left:auto;color:#c8ab80}
.choice .cwhat{font-weight:700;margin-top:2px;color:#4a3a22}
.choice .cwhy{font-size:.84em;color:#8a7552;margin-top:2px}
.choice.evt{background:#eef4ea;border-color:#c5d8bb;border-left-color:#7ea56b;color:#3f5537}
.choice.evt .chd{color:#6d9160}
.choice.evt .ctime{color:#a3bb98}
.choice.evt .cwhat{color:#2f4529}
.choice.evt .epic{float:right;width:132px;margin:4px 0 4px 12px;border-radius:8px;border:1px solid #c5d8bb}
.choice.evt .cwhy{color:#6f8665}
.choice.evt .btn{color:#3f6b2f;border-color:#9fc08d}
.carry{margin:6px 0 10px 46px;color:#8a8a82;font-size:.92em}
details.more{margin-top:4px}
details.more>summary{cursor:pointer;color:var(--ink3);font-size:.84em;list-style:none;user-select:none}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::before{content:"▸ "}
details.more[open]>summary::before{content:"▾ "}
details.more[open]>summary{margin-bottom:4px}
details.more .mbody{font-size:.94em;opacity:.92}
#live .b::after{content:"";display:inline-block;width:1px;height:1em;background:var(--ink-c);margin-left:2px;vertical-align:-2px;animation:bl 1s steps(2) infinite}
@keyframes bl{50%{opacity:0}}