:root{color-scheme:light;--ink:#292929;--muted:#6a6a6a;--line:#dedede;--back:#f3f3f3;font-family:"Noto Sans JP","Yu Gothic",sans-serif;color:var(--ink);background:var(--back);font-synthesis:none}
/* Reserve the context toolbar's space so focus cannot move a click target. */
#selection-tools.selection-tools{min-height:40px}
#selection-tools.selection-tools[hidden]{display:flex;visibility:hidden}
*{box-sizing:border-box}body{margin:0}button,input,select,summary{font:inherit}button,summary,.file-label{cursor:pointer}button,summary{color:inherit}button{border:1px solid #d2d2d2;background:#fff;border-radius:5px;padding:8px 12px;min-height:38px;line-height:1.5;font-size:13px}button:hover{background:#ededed}button:disabled{opacity:.35;cursor:default}button:focus-visible,summary:focus-visible,select:focus-visible,.file-label:focus-within{outline:2px solid #777;outline-offset:3px}.primary{background:#303030;color:#fff;border-color:#303030}.primary:hover{background:#151515}.app-header{max-width:880px;margin:auto;padding:25px 24px 19px;display:flex;align-items:center;justify-content:space-between;gap:16px}.app-header h1{margin:0;font-size:15px;font-weight:500;letter-spacing:.03em}.app-header small{font-size:11px;font-weight:400;color:var(--muted);margin-left:10px}details{position:relative}summary{list-style:none;font-size:12px;padding:9px 10px;min-height:38px}summary::-webkit-details-marker{display:none}summary::after{content:"⌄";margin-left:7px}.menu-panel{position:absolute;z-index:10;top:100%;right:0;width:230px;padding:12px;box-shadow:0 5px 25px #00000018;background:#fff;border:1px solid var(--line);border-radius:6px;display:grid;gap:8px}.menu-panel p{margin:6px 0 0;font-size:11px;color:var(--muted);line-height:1.7}.menu-panel button,.file-label{display:block;width:100%;text-align:left;border:0;padding:10px;font-size:13px}.file-label{border-radius:5px}.file-label:hover{background:#ededed}.file-label input{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.menu-panel label:has(select){display:grid;grid-template-columns:1fr 100px;align-items:center;gap:8px;font-size:12px}.menu-panel select{min-height:38px;padding:6px;border:1px solid #ccc;border-radius:3px;background:#fff;font-size:13px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;max-width:832px;margin:auto;padding:0 0 8px}.toolbar-group{display:flex;gap:6px;align-items:center}.format-menu .menu-panel{right:auto;left:0}.document-bar{display:flex;align-items:center;gap:14px;max-width:832px;min-height:40px;margin:0 auto 6px;font-size:11px;color:var(--muted)}.history-actions{display:flex;gap:4px}.history-actions button{padding:3px 7px;min-height:30px;border:0;background:transparent;font-size:20px}#save-status{margin-left:auto}.selection-tools{max-width:832px;margin:0 auto 10px;display:flex;align-items:center;gap:7px;min-height:34px}.selection-tools[hidden]{display:none}.selection-tools span{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50%;margin-right:5px}.selection-tools button{padding:4px 9px;min-height:32px;font-size:12px}#message{max-width:832px;margin:0 auto 12px;font-size:12px;line-height:1.7}#message:empty{display:none}#message[data-error]{color:#333;border-left:2px solid #777;padding-left:10px}.pages{padding:0 16px;display:flex;flex-direction:column;gap:30px;align-items:center}.page-frame{position:relative;flex:none}

.paper{position:absolute;left:0;top:0;transform-origin:top left;width:720px;height:1280px;padding:50px;display:flex;flex-direction:column;background:#fff;box-shadow:0 3px 18px #00000010;--layout-ratio:1;--heading-ratio:1;--item-font:32px;--detail-font:22px;--icon-size:44px;--flow-gap:14px;--column-gap:30px;--scale:1;line-break:strict;overflow-wrap:anywhere}
.paper.landscape{width:1280px;height:720px;padding:42px 50px}
.paper-header{flex:none;padding-bottom:calc(24px * var(--heading-ratio));margin-bottom:calc(18px * var(--heading-ratio));text-align:center;border-bottom:1px solid #c8c8c8}
.header-mark{display:block;width:calc(36px * var(--heading-ratio));height:calc(3px * var(--heading-ratio));background:#333;margin:0 auto calc(16px * var(--heading-ratio))}
.paper-title{font-size:calc(44px * var(--heading-ratio));font-weight:600;letter-spacing:.02em;line-height:1.5;min-height:1.5em;margin:0;color:#292929}
.paper-subtitle{font-size:calc(22px * var(--heading-ratio));line-height:1.6;color:#666;margin:calc(10px * var(--heading-ratio)) 0 0;min-height:1.6em}
.platform-badge{display:table;margin:calc(14px * var(--heading-ratio)) auto 0;background:#f2f2f2;color:#555;padding:calc(4px * var(--heading-ratio)) calc(12px * var(--heading-ratio));font-size:calc(18px * var(--heading-ratio));line-height:1.4;border-radius:3px}
.paper-header.continued{padding-bottom:calc(12px * var(--heading-ratio));margin-bottom:calc(12px * var(--heading-ratio));text-align:left}
.continued .paper-title{font-size:calc(26px * var(--heading-ratio));display:flex;align-items:baseline;gap:calc(12px * var(--heading-ratio))}
.continuation-label{font-size:calc(17px * var(--heading-ratio));font-weight:400;color:#777}
.continued .paper-subtitle{font-size:calc(18px * var(--heading-ratio));margin-top:calc(3px * var(--heading-ratio));min-height:0}
.continued .platform-badge{font-size:calc(14px * var(--heading-ratio));margin:calc(6px * var(--heading-ratio)) 0 0}
.paper-columns{flex:1;min-height:0;display:grid;grid-template-columns:repeat(var(--columns,1),minmax(0,1fr));gap:var(--column-gap);align-items:stretch}
.paper-column{min-width:0;min-height:0;display:flex;flex-direction:column;gap:var(--flow-gap)}
.paper-column>*{flex:none}
/* Reserve the final page-number line before measuring the empty footer. */
.paper-footer{flex:none;margin-top:calc(17px * var(--heading-ratio));padding-top:calc(10px * var(--heading-ratio));border-top:1px solid #dedede;font-size:calc(17px * var(--heading-ratio));color:#777;text-align:right;line-height:1.5;min-height:calc(40px * var(--heading-ratio))}
.paper-footer.single{border-color:transparent}
.flow-block{position:relative;min-width:0}
.shortcut-block{padding:calc(20px * var(--layout-ratio)) 0;border-bottom:1px solid #e3e3e3;overflow:clip}
.entry-top{display:grid;grid-template-columns:var(--icon-size) minmax(0,1fr) minmax(0,1.4fr);gap:calc(16px * var(--layout-ratio));align-items:center}
.entry-name{font-size:var(--item-font);font-weight:500;line-height:1.5;min-height:1.5em;margin:0;white-space:pre-wrap}
.icon-wrap{width:var(--icon-size);height:var(--icon-size);display:grid;place-items:center;position:relative;border-radius:50%}
.icon-wrap.has-icon{background:#f2f2f2}
.item-icon{display:block;width:calc(var(--icon-size)*.65);height:calc(var(--icon-size)*.65);object-fit:contain}
.change-icon{position:absolute;inset:0;padding:0;border:0;background:transparent;min-height:0;border-radius:50%}
.change-icon:hover{background:#00000008}
.change-icon:focus-visible,.edit-keys:focus-visible{outline:2px solid #777;outline-offset:2px}
.keys-wrap{min-width:0;position:relative}
.key-combo{min-height:calc(52px * var(--layout-ratio));display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:calc(8px * var(--layout-ratio));min-width:0}
.key-part{display:inline-flex;align-items:center;gap:calc(8px * var(--layout-ratio));min-width:0;max-width:100%}
.key-plus{color:#888;font-size:calc(21px * var(--layout-ratio));line-height:1.4;flex:none}
.keycap{display:inline-flex;align-items:center;justify-content:center;min-width:calc(46px * var(--layout-ratio));min-height:calc(48px * var(--layout-ratio));max-width:100%;padding:calc(8px * var(--layout-ratio)) calc(12px * var(--layout-ratio));background:#f8f8f8;border:1px solid #d6d6d6;border-bottom:calc(3px * var(--layout-ratio)) solid #bcbcbc;border-radius:calc(5px * var(--layout-ratio));color:#292929}
.key-label{font-size:calc(24px * var(--layout-ratio));line-height:1.3;font-weight:500;overflow-wrap:anywhere;white-space:pre-wrap;min-width:0}
.key-glyph{width:calc(26px * var(--layout-ratio));height:calc(26px * var(--layout-ratio));display:block;flex:none}
.keys-empty{color:#aaa;font-size:calc(21px * var(--layout-ratio));line-height:1.6}
.edit-keys{position:absolute;top:50%;left:0;width:100%;height:100%;min-height:calc(44px / var(--scale));transform:translateY(-50%);padding:0;border:0;background:transparent;border-radius:4px}
.edit-keys:hover{background:#00000004}
.entry-detail{font-size:var(--detail-font);line-height:1.6;color:#666;margin:calc(8px * var(--layout-ratio)) 0 0 calc(var(--icon-size) + 16px * var(--layout-ratio));min-height:0;white-space:pre-wrap}
.entry-detail:empty{position:absolute;left:calc(var(--icon-size) + 16px * var(--layout-ratio));right:0;bottom:calc(3px * var(--layout-ratio));height:calc(16px * var(--layout-ratio));margin:0;font-size:calc(16px * var(--layout-ratio));line-height:1;box-shadow:none}
.entry-detail:empty:before{content:"補足";opacity:0;color:#999}
.shortcut-block:focus-within .entry-detail:empty:before,.shortcut-block:hover .entry-detail:empty:before{opacity:1}
.field{outline:0;box-shadow:0 1px 0 #eeeeee;cursor:text;white-space:pre-wrap;overflow-wrap:anywhere}
.field:empty:before{content:attr(data-placeholder);color:#999;font-weight:400;pointer-events:none}
.field:focus{box-shadow:0 0 0 1px #d7d7d7}
.field[data-limit]{scroll-margin:180px 0 80px}
.note-block{padding:calc(18px * var(--layout-ratio)) 0 calc(10px * var(--layout-ratio))}
.note-title{font-size:calc(23px * var(--layout-ratio));line-height:1.5;min-height:1.5em;font-weight:600;letter-spacing:.03em;margin:0 0 calc(10px * var(--layout-ratio));padding-left:calc(12px * var(--layout-ratio));border-left:calc(3px * var(--layout-ratio)) solid #666;white-space:pre-wrap}
.note-text{font-size:var(--detail-font);line-height:1.6;min-height:1.6em;color:#555;margin:0;white-space:pre-wrap}
.fragment-caption{color:#777;font-size:calc(16px * var(--layout-ratio));margin:0 0 calc(6px * var(--layout-ratio));line-height:1.5}
.end-actions{padding:26px 16px 50px;text-align:center}
.end-actions button{background:transparent;border-style:dashed;min-width:180px}
.paper[data-export-clone] .field{box-shadow:none!important}
.paper[data-export-clone] .field:empty::before,.paper[data-export-clone] .entry-detail:empty::before{content:none}
.paper[data-export-clone]{box-shadow:none}
dialog{border:1px solid #ddd;border-radius:8px;box-shadow:0 15px 70px #00000022;width:min(470px,calc(100% - 30px));padding:22px;color:#292929}dialog::backdrop{background:#00000025}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.dialog-heading h2{font-size:16px;font-weight:500;margin:0}.dialog-heading button{font-size:22px;border:0;padding:3px 10px}.icon-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.icon-options button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:90px;font-size:11px}.icon-options img{width:28px;height:28px}.icon-options button[aria-pressed=true]{border-color:#333;background:#eee}body.busy #editor{opacity:.75}body.busy .toolbar{opacity:1}noscript{display:block;padding:24px}.flow-probe{visibility:hidden;pointer-events:none}
@media(max-width:880px){.toolbar,.document-bar,.selection-tools,#message{margin-left:20px;margin-right:20px}.app-header{padding-left:20px;padding-right:20px}}@media(max-width:520px){.app-header{padding:19px 14px 15px}.toolbar{margin:0 12px 5px;gap:7px;align-items:flex-start}.toolbar-group{flex-wrap:wrap;gap:4px}.toolbar button{font-size:12px;padding:8px;min-height:44px}.toolbar .primary{white-space:nowrap}.toolbar summary{font-size:12px;min-height:44px;display:flex;align-items:center}.document-bar,.selection-tools,#message{margin-left:14px;margin-right:14px}.document-bar{gap:9px;font-size:10px}.history-actions button{min-width:40px;min-height:40px}.pages{padding:0 12px;gap:24px}.selection-tools button{min-height:40px;min-width:40px}.format-menu .menu-panel{left:auto;right:0;width:220px}.more-menu summary{min-height:44px;display:flex;align-items:center}.menu-panel button,.file-label{min-height:44px}.icon-options button{min-height:88px}.end-actions button{min-height:44px}}@media print{body{background:#fff}.app-header,.toolbar,.document-bar,.selection-tools,#message,.end-actions{display:none!important}.pages{padding:0;gap:0}.paper{box-shadow:none}.page-frame{break-after:page}.field{box-shadow:none}}

/* Feedback stays outside the paper and the exported image. */
.app-footer{max-width:832px;margin:0 auto 34px;padding:0 14px;display:flex;align-items:center;justify-content:center;gap:24px;color:#727272;font-size:11px}.app-footer a,.menu-panel a,.feedback-notice a{color:inherit;text-underline-offset:3px}.app-footer button{font-size:11px;border:0;background:transparent;color:inherit}.measurement-setting{display:flex;align-items:flex-start;gap:7px;font-size:11px;line-height:1.8;margin-top:8px}.measurement-setting input{flex:none;margin-top:4px}.menu-panel>a{font-size:12px;padding:8px 10px}#feedback-dialog{width:min(440px,calc(100% - 28px));padding:22px;border:1px solid #ddd;border-radius:8px;color:var(--ink);max-height:calc(100dvh - 28px);overflow:auto}#feedback-dialog .dialog-heading h2{font-size:16px}#feedback-form{display:grid;gap:12px;font-size:12px}#feedback-form fieldset{border:0;padding:0;margin:0;display:flex;gap:24px}#feedback-form legend{margin-bottom:12px}#feedback-form fieldset label{display:flex;align-items:center;gap:6px;min-height:32px}#feedback-comment{width:100%;resize:vertical;border:1px solid #ddd;border-radius:4px;background:#fdfdfd;padding:10px;font:inherit;line-height:1.8}.feedback-notice{font-size:10px;line-height:1.9;color:var(--muted);margin:0}#feedback-status{font-size:12px;line-height:1.8;margin:0}.feedback-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media print{.app-footer,#feedback-dialog{display:none!important}}
.measurement-setting input,#feedback-form input{accent-color:#555}#feedback-comment:focus-visible{outline:2px solid #777;outline-offset:2px}


#key-form{display:grid;gap:9px;font-size:13px}#key-form input{width:100%;min-height:44px;border:1px solid #ddd;border-radius:4px;background:#fafafa;padding:10px;font:inherit}#key-form input:focus-visible{outline:2px solid #777;outline-offset:2px}#key-form p{font-size:11px;line-height:1.8;color:#666;margin:8px 0}.key-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}#key-editor{max-height:calc(100dvh - 28px);overflow:auto}#key-editor .dialog-heading h2{max-width:80%;overflow-wrap:anywhere}.icon-options{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:520px){.icon-options{grid-template-columns:repeat(3,minmax(0,1fr))}}