:root{color-scheme:light;--ink:#292929;--muted:#6a6966;--paper:#f4f3ef;--line:#c4c3bd;--ground:#dededb;font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:var(--ink);background:var(--ground);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background-image:radial-gradient(#77777715 .6px,transparent .7px);background-size:4px 4px}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{color:inherit;border:1px solid var(--line);background:var(--paper);cursor:pointer;border-radius:3px;padding:9px 13px;font-size:12px}button:hover:not(:disabled){background:#e6e5e0;border-color:#7d7c76}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #31312f;outline-offset:4px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}fieldset{border:0;margin:0;padding:0;min-width:0}
.site-header{min-height:70px;border-bottom:1px solid #9f9f99;display:flex;gap:20px;align-items:center;padding:14px 30px;background:#eeede9ef}.brand{display:flex;align-items:center;gap:10px;font-size:20px;letter-spacing:-.5px;font-weight:650}.brand img{width:30px;height:30px;filter:grayscale(1)}.page-name{color:var(--muted);font-size:12px;letter-spacing:1px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:13px;min-width:0}.account{font-size:11px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.site-lang{font-size:12px}.icon-button{width:35px;height:35px;padding:0;display:inline-grid;place-items:center;font-size:17px;background:transparent;flex-shrink:0}
.workspace{max-width:1700px;margin:0 auto;display:grid;grid-template-columns:minmax(600px,1.55fr) minmax(330px,1fr);gap:24px;padding:30px}.inputs{display:grid;grid-template-columns:minmax(245px,.85fr) minmax(310px,1.15fr);gap:24px;align-items:start;min-width:0}.control-label{display:flex;justify-content:space-between;gap:8px;align-items:center;margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.045em}.quiet{font:10px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);font-weight:400}.characters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.reference{min-width:0;background:var(--paper);border:1px solid #aaa9a3;box-shadow:2px 3px 0 #b7b7b155}.pick-image{display:block;width:100%;padding:0;border:0;border-radius:0;aspect-ratio:3/5;background:#faf9f6;position:relative;overflow:hidden}.pick-image img{width:100%;height:100%;object-fit:contain;display:block;mix-blend-mode:multiply}.empty-mark{display:none;font-size:28px;font-weight:300;color:#8e8d88;position:absolute;inset:0;align-items:center;justify-content:center}.reference.empty .empty-mark{display:flex}.reference.empty img{display:none}.reference-foot{display:flex;align-items:center;justify-content:space-between;padding:5px 4px 5px 7px;border-top:1px solid var(--line);min-height:31px;gap:2px}.reference-number{font:10px ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}.remove-image{padding:0;border:0;background:none;font-size:18px;line-height:22px;width:24px;min-height:24px}.reference.empty .remove-image{visibility:hidden}.reference.dragover{outline:2px dashed #32322f;outline-offset:3px}.layout-reference{margin-top:26px}.layout-card{width:100%;max-width:280px;margin:0 auto}.layout-card .pick-image{aspect-ratio:3/4;max-height:330px}.hint{font-size:11px;line-height:1.8;color:var(--muted);margin:14px 0 0;overflow-wrap:anywhere}.reference-actions{display:flex;gap:14px;margin-top:10px;flex-wrap:wrap}.text-button{padding:4px 0;border:0;border-bottom:1px solid #aaa;background:transparent;font-size:10px;border-radius:0}#inputStatus{display:block;min-height:1.8em}.writing{padding:22px;background:var(--paper);border:1px solid #aaa9a3;box-shadow:3px 4px 0 #aaa9a344;position:relative}.writing::before{content:"";position:absolute;right:12px;top:10px;width:27px;height:2px;background:#b0afa9;box-shadow:0 4px 0 #d0cfc9}.template-hint{margin:0 0 15px;font-size:10px}.writing textarea{display:block;width:100%;min-height:360px;resize:vertical;padding:13px 11px;border:1px solid #bebdb5;border-radius:0;color:#30302c;background-color:#faf9f5;background-image:repeating-linear-gradient(transparent 0,transparent 29px,#c5c4bb40 29px,#c5c4bb40 30px);background-position:0 13px;line-height:30px;font-size:12px;outline-offset:3px}.prompt-footer{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-top:9px}.prompt-footer .hint{margin:0;font-size:10px}.prompt-footer .quiet{white-space:nowrap;padding-top:4px}.size-fields{display:flex;flex-direction:column;gap:8px;margin-top:24px}.size-option{display:flex;align-items:center;gap:9px;font-size:12px;padding:13px 10px;border:1px solid var(--line);cursor:pointer;background:#f8f7f3}.size-option:has(input:checked){border-color:#3b3b37;background:#e6e5df}.size-option input{accent-color:#383835;margin:0}.cost-tag{margin-left:auto;font:11px ui-monospace,Consolas,monospace}.format-hint{display:flex;gap:12px;flex-wrap:wrap;font-size:10px}.format-hint>span+span{border-left:1px solid var(--line);padding-left:12px}.generate{width:100%;display:flex;gap:16px;justify-content:space-between;align-items:center;margin-top:20px;padding:17px 14px;background:#343432;color:#fff;border-color:#343432;box-shadow:3px 3px 0 #aaa9a2;letter-spacing:.05em}.generate:hover:not(:disabled){background:#171715;color:#fff}.generate span:first-child{margin-right:auto;font-weight:700}.generate #generationCost{font:11px ui-monospace,Consolas,monospace}.generate:disabled{opacity:.5}.safety-note{font-size:9px}#availability:empty{display:none}
.output{padding:0 18px 20px;border-left:1px solid #bbbcb5;min-width:0}.output-toolbar{height:36px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;font-size:11px;gap:10px}.output-actions{display:flex;gap:7px}.paper-preview{border:1px solid #9b9b96;background:#fff;box-shadow:5px 6px 0 #bbbcb655;padding:0;border-radius:0;display:block;max-width:100%;width:100%;cursor:zoom-in;aspect-ratio:3/4;overflow:hidden}.paper-preview img{width:100%;height:100%;object-fit:contain;display:block}.paper-preview:hover:not(:disabled){background:#fff}.job-status{font-size:11px;line-height:1.8;min-height:20px;margin:12px 0 0}.error{border:1px solid #555;border-left:4px solid #333;font-size:11px;padding:12px;line-height:1.8;overflow-wrap:anywhere}.progress-line{height:3px;background:#c0c0ba;overflow:hidden;margin-top:18px}.progress-line span{height:100%;width:35%;display:block;background:#41413c;animation:working 1.8s ease-in-out infinite}.result-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}.paging{display:flex;align-items:center;gap:12px;font:11px ui-monospace,Consolas,monospace}.zip-button{font-size:11px;background:#efeee8}.thumbnails{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:18px}.thumbnail{padding:3px;border:1px solid #aaa9a3;position:relative;min-width:0;background:#eeede8;aspect-ratio:3/4}.thumbnail[aria-pressed=true]{border:2px solid #222;padding:2px;box-shadow:0 2px 0 #222}.thumbnail img{width:100%;height:100%;object-fit:contain;display:block}.thumbnail span{position:absolute;bottom:3px;right:3px;font:9px ui-monospace,Consolas,monospace;background:#fffffff0;padding:2px 4px}.output-note{font-size:10px}.solid{background:#33332f;color:#fff;border-color:#33332f}.solid:hover:not(:disabled){background:#111;color:#fff}.dialog-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:22px}.confirm-dialog{max-width:420px;width:calc(100% - 32px);padding:27px;border:1px solid #51514c;background:var(--paper);color:var(--ink);font-size:13px;line-height:1.9;box-shadow:5px 5px 0 #33333322}.confirm-dialog::backdrop,.lightbox::backdrop{background:#171713b8}.lightbox{background:#e3e2dc;padding:38px 12px 12px;border:0;max-width:96vw;max-height:96vh}.lightbox>button{position:absolute;top:2px;right:6px}.lightbox img{max-width:90vw;max-height:84vh;object-fit:contain;display:block}
.tour{position:fixed;inset:0;z-index:200;overflow:hidden}.tour-spotlight{position:fixed;pointer-events:none;border:2px solid #fff;box-shadow:0 0 0 9999px #161613ab;border-radius:3px;transition:top .18s,left .18s,width .18s,height .18s}.tour-card{position:fixed;width:320px;max-width:calc(100vw - 32px);padding:20px;background:#f4f3ed;border:1px solid #42423c;box-shadow:4px 4px 0 #18181440;color:#30302c}.tour-head{display:flex;align-items:center;justify-content:space-between;font:11px ui-monospace,Consolas,monospace;color:#74736b}.tour-head .icon-button{border:0}.tour-title{font-size:14px;font-weight:700;margin:7px 0 12px}.tour-card p:not(.tour-title){font-size:12px;line-height:1.95;margin:0}.tour-card .dialog-actions{margin-top:18px}@keyframes working{0%{transform:translateX(-105%)}100%{transform:translateX(390%)}}
@media(min-width:1600px){.writing textarea{min-height:425px}.layout-card{max-width:300px}.layout-card .pick-image{max-height:none}}
@media(max-width:1150px){.workspace{grid-template-columns:minmax(530px,1.4fr) minmax(280px,1fr);gap:14px;padding:22px 18px}.inputs{grid-template-columns:minmax(220px,.9fr) minmax(285px,1.1fr);gap:16px}.writing{padding:17px}.output{padding-left:14px;padding-right:0}.account{max-width:150px}.characters{gap:6px}.reference-number{font-size:9px}}
@media(max-width:900px){.workspace{grid-template-columns:1fr;max-width:850px}.inputs{grid-template-columns:minmax(230px,1fr) minmax(290px,1.2fr)}.output{border-left:0;border-top:1px solid #aaa9a3;padding:20px 0 0;max-width:580px;width:100%;margin:10px auto 0}.writing textarea{min-height:340px}.site-header{padding:14px 18px;gap:12px}.account{display:none}}
@media(max-width:580px){.site-header{min-height:60px;padding:12px;gap:9px;flex-wrap:wrap}.brand{font-size:17px;gap:7px}.brand img{width:26px;height:26px}.page-name{font-size:10px;letter-spacing:0}.header-actions{gap:8px}.header-actions button:not(.icon-button){padding:7px;font-size:10px}.header-actions .site-lang{font-size:10px}.header-actions .icon-button{width:28px;height:28px}.workspace{padding:22px 14px;gap:16px}.inputs{grid-template-columns:1fr;gap:24px}.characters{gap:12px}.pick-image{aspect-ratio:3/4}.reference-number{font-size:11px}.layout-reference{margin-top:23px}.layout-card{max-width:230px}.layout-card .pick-image{max-height:245px}.writing{padding:19px}.writing textarea{min-height:300px;font-size:12px}.output{margin-top:0}.tour-card{width:300px}.site-header:has(#logout:not([hidden])) .page-name{display:none}}
.mode-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:24px}.mode-option{display:flex;align-items:center;gap:8px;padding:12px 10px;font-size:12px;border:1px solid var(--line);background:#f8f7f3;cursor:pointer;flex-wrap:wrap}.mode-option:has(input:checked){border-color:#3b3b37;background:#e6e5df}.mode-option input{accent-color:#383835;margin:0}.mode-rate{font-size:9px;color:var(--muted);margin-left:auto}.mode-fields+.size-fields{margin-top:10px}
.prompt-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}.prompt-heading .control-label{margin:0}.prompt-heading .text-button{font-size:10px;padding:4px 0}
.monochrome-option{display:flex;align-items:flex-start;gap:8px;font-size:11px;line-height:1.8;margin-top:12px;cursor:pointer}.monochrome-option input{accent-color:#383835;margin:4px 0 0;flex-shrink:0}.required-hint{margin-top:10px;font-size:10px}
.page-menu{position:relative}.page-menu summary{list-style:none;display:grid;place-items:center;width:35px;height:35px;border:1px solid var(--line);border-radius:3px;cursor:pointer;font-size:17px}.page-menu summary::-webkit-details-marker{display:none}.page-menu summary:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.page-menu nav{position:absolute;z-index:110;right:0;top:42px;min-width:210px;max-width:calc(100vw - 32px);padding:8px;background:var(--paper);border:1px solid var(--line);box-shadow:3px 4px 0 #3332}.page-menu nav a,.page-menu nav button{display:block;width:100%;text-align:left;font-size:12px;padding:10px;border:0;background:transparent;white-space:nowrap}.page-menu nav a:hover,.page-menu nav button:hover{background:#e6e5e0}.page-menu [aria-current=page]{font-weight:700}@media(max-width:580px){.page-menu summary{width:28px;height:28px}.site-header .page-name{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.progress-line span{width:100%;opacity:.55}}