:root{color:#111;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f4f4f2;font-family:BIZ UDPGothic,Yu Gothic,Hiragino Kaku Gothic ProN,sans-serif}*,:before,:after{box-sizing:border-box}body{margin:0}.page{grid-template-columns:minmax(0,1fr);display:grid}#app{width:100%;max-width:1200px;min-height:100svh;margin:0 auto;padding:24px 20px 48px}.app-header{margin-bottom:24px}.app-title{margin:0 0 4px;font-size:1.5rem}.app-tagline{margin:0 0 4px;font-size:.95rem;font-weight:700}.app-note{color:#555550;margin:0;font-size:.85rem}.editor{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:24px;display:grid}.editor-column{flex-direction:column;gap:16px;min-width:0;display:flex}.preview-frame{aspect-ratio:16/9;background:#fff;border:1px solid #d5d5d0;border-radius:8px;overflow:hidden}.preview-frame.is-dragover,.dropzone.is-dragover{background:#eaf1fd;border-color:#1f6feb}.preview-frame canvas{width:100%;height:100%;display:block}.preview-caption{color:#555550;margin:8px 0 0;font-size:.8rem}.panel{background:#fff;border:1px solid #d5d5d0;border-radius:8px}.panel-summary{cursor:pointer;padding:14px 20px;font-weight:700;list-style-position:inside}.panel-body{flex-direction:column;gap:20px;padding:0 20px 20px;display:flex}.dropzone{background:#fafaf8;border:2px dashed #b9b9b3;border-radius:6px;flex-direction:column;gap:8px;padding:16px;display:flex}.dropzone-text{color:#555550;margin:0;font-size:.85rem}.dropzone input[type=file]{width:100%;font:inherit}.actions{flex-direction:column;gap:8px;display:flex}.control{border:none;flex-direction:column;gap:6px;margin:0;padding:0;display:flex}.control-label{align-items:center;gap:8px;padding:0;font-size:.9rem;font-weight:700;display:flex}.control-hint{color:#555550;overflow-wrap:anywhere;margin:0;font-size:.8rem}.control input[type=file],.control input[type=text],.control textarea,.control input[type=range]{width:100%;font:inherit}.control input[type=text],.control textarea{border:1px solid #b9b9b3;border-radius:4px;padding:8px}.control textarea{resize:vertical}.color-chip{background:#3a3a38;border-radius:999px;padding:2px 8px;font-size:.75rem;font-weight:700}.color-chip--white{color:#fff}.color-chip--yellow{color:#ffd400}.color-chip--red{color:#ff3b30}.app-footer{border-top:1px solid #d5d5d0;margin-top:40px;padding-top:16px}.ad-slot{border-top:1px solid #d5d5d0;margin-top:32px;padding-top:16px}.ad-slot-label{color:#7a7a74;margin:0 0 6px;font-size:.7rem}.adsbygoogle{width:100%;display:block}.ad-slot:has(ins[data-ad-status=unfilled]){display:none}.ad-rail{display:none}.ad-rail-unit{width:160px;height:600px;display:inline-block}@media (width>=1600px){.page:has(.ad-rail:not([hidden])){grid-template-columns:160px minmax(0,1200px) 160px;justify-content:center;gap:24px}.ad-rail:not([hidden]){align-self:start;width:160px;padding-top:24px;display:block;position:sticky;top:24px}.ad-rail:has(ins[data-ad-status=unfilled]){visibility:hidden}}.footer-links{flex-wrap:wrap;gap:8px 20px;display:flex}.footer-links a{color:#b35300;font-size:.85rem}.footer-note{color:#555550;margin:12px 0 0;font-size:.8rem}.export-button{font:inherit;color:#fff;cursor:pointer;background:#c0392b;border:none;border-radius:4px;padding:12px;font-weight:700}.export-button:disabled{cursor:not-allowed;background:#bdbdb8}.share-button{font:inherit;color:#1a1a18;cursor:pointer;background:#fff;border:1px solid #1a1a18;border-radius:4px;padding:12px;font-weight:700}.share-button:disabled{color:#7a7a74;cursor:not-allowed;background:#f0f0ec;border-color:#bdbdb8}.share-dialog{color:#1a1a18;background:#fff;border:1px solid #1a1a18;border-radius:8px;width:min(420px,100vw - 32px);padding:24px}.share-dialog::backdrop{background:#0a0a08bf}.share-dialog-title{margin:0 0 12px;font-size:1.1rem}.share-dialog-message{margin:0 0 16px;font-size:.95rem;font-weight:700}.share-dialog-message--failed{color:#b02020}.share-dialog-steps{color:#555550;margin:0 0 20px;padding-left:1.4em;font-size:.9rem;line-height:1.7}.share-dialog-actions{flex-direction:column;gap:8px;display:flex}.error-message{color:#b02020;min-height:1.2em;margin:0;font-size:.85rem}:focus-visible{outline-offset:2px;outline:2px solid #1f6feb}@media (width<=860px){.editor{grid-template-columns:minmax(0,1fr)}}