:root{color-scheme:dark;--ink:#f0e7cf;--navy:#172330;--dim:#aeb5ac;--text-scale:1;font-family:"Yu Gothic",Meiryo,system-ui,sans-serif;color:var(--ink);background:#0e1721}*{box-sizing:border-box}body{margin:0}button,select,a{font:inherit}button,select{color:var(--ink);background:var(--navy);border:1px solid #878d85;border-radius:0;padding:8px 12px}button{cursor:pointer}button:hover:not(:disabled),a:hover{background:#303e49}button:disabled{opacity:.36;cursor:default}button:focus-visible,select:focus-visible,a:focus-visible,#message:focus-visible{outline:2px solid #f3cd79;outline-offset:3px}a{color:inherit;text-decoration:none}.console{max-width:1180px;height:100dvh;min-height:540px;margin:auto;padding:24px;display:flex;flex-direction:column;gap:16px}header{display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{font-family:Georgia,serif;font-size:28px;letter-spacing:3px}.brand span{font-family:"Yu Gothic",sans-serif;font-size:11px;letter-spacing:2px;margin-left:18px;color:var(--dim)}.tools{display:flex;align-items:center;gap:12px}.tools label{font-size:12px}.tools select{margin-left:6px;padding:6px}#menu{display:none}.layout{flex:1;min-height:0;display:grid;grid-template-columns:204px minmax(0,1fr);gap:18px}.frame{border:1px solid #c0beaa;box-shadow:inset 0 0 0 4px var(--navy),inset 0 0 0 5px #747e7d;background:var(--navy)}aside{padding:22px 16px;display:flex;flex-direction:column;min-height:0}.archive-title{font-size:15px;letter-spacing:3px;margin-bottom:24px}.month-label{font-size:12px;color:var(--dim);display:flex;gap:10px;align-items:center;margin-bottom:18px}.month-label select{min-width:0;width:100%;padding:6px}#days{overflow:auto;flex:1;min-height:0}#days a{display:block;padding:10px 7px 10px 20px;position:relative;border-top:1px solid #33404a;font-size:14px}#days a[aria-current="date"]{color:#ffe7ab;background:#253440}#days a[aria-current="date"]::before{content:"▶";position:absolute;left:3px;font-size:9px;top:14px}#days small{display:block;font-size:11px;color:var(--dim);margin-top:5px;line-height:1.5;overflow-wrap:anywhere}.archive-note{font-size:10px;letter-spacing:2px;color:var(--dim);margin:20px 0 0}.story{min-height:0;display:flex;flex-direction:column;padding:18px 24px 16px;gap:14px}.story-heading{display:flex;align-items:baseline;gap:20px;min-height:30px}.story-heading time{font-family:monospace;font-size:13px;letter-spacing:2px;color:var(--dim);white-space:nowrap}h1{font-size:16px;font-weight:normal;line-height:1.6;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.picture{flex:1;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;background:#111c28;border:1px solid #33434e;padding:10px}.picture img{width:100%;height:100%;object-fit:contain;max-width:640px;max-height:480px}.picture-note{font-family:Georgia,serif;letter-spacing:5px;font-size:22px;color:#697a86;text-align:center;line-height:2}#image-number{position:absolute;right:9px;top:8px;font-size:10px;color:var(--ink);background:#172330d9;padding:3px 6px}.message-frame{position:relative;padding:26px 22px 16px;height:172px;flex:none}.message-label{position:absolute;top:9px;left:22px;font-size:10px;letter-spacing:3px;color:var(--dim)}#message,#measure{font-size:calc(17px * var(--text-scale));line-height:1.85;letter-spacing:.035em;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;height:100%;overflow:auto}#measure{position:absolute;left:22px;right:22px;top:26px;bottom:16px;height:auto;visibility:hidden;overflow:hidden;pointer-events:none}footer{display:flex;align-items:center;justify-content:space-between;gap:10px}footer button{font-size:13px;min-width:94px}#progress{font-family:monospace;font-size:11px;color:var(--dim)}#status{font-size:11px;color:var(--dim);height:14px;text-align:right}
@media(max-width:700px){.console{padding:12px;gap:12px;min-height:540px}.brand{font-size:23px}.brand span{display:none}.tools{gap:6px}.tools button{padding:6px 9px;font-size:12px}.tools label{font-size:0}.tools select{font-size:12px;margin:0}.layout{display:block;position:relative}.story{height:100%;padding:14px;gap:12px}.story-heading{display:block;min-height:52px}.story-heading time{font-size:11px}.story-heading h1{font-size:14px;margin-top:4px}.message-frame{padding:26px 16px 14px;height:190px}#measure{left:16px;right:16px;bottom:14px}#message,#measure{font-size:calc(15px * var(--text-scale));line-height:1.8}#menu{display:block}aside{display:none;position:absolute;z-index:2;inset:0 auto 0 0;width:230px;box-shadow:inset 0 0 0 4px var(--navy),inset 0 0 0 5px #747e7d,10px 0 30px #0008}aside.open{display:flex}footer button{min-width:80px;padding:8px}.message-label{left:16px}.picture{padding:6px}#image-number{font-size:9px}}