*{box-sizing:border-box}body{margin:0;background:#f7f7fc;color:#17152a;font:16px/1.5 system-ui,sans-serif}header{background:#fff;border-bottom:1px solid #dedbea;padding:12px 18px}.topbar-inner{max-width:1150px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#251b58;font-size:clamp(19px,4vw,23px);font-weight:850;letter-spacing:-.035em;white-space:nowrap}.brand img{width:42px;height:42px;flex:none}.brand strong{color:#6246ea}.share-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 13px;border-radius:10px;background:#25d366;color:#112c1b;font-size:14px;font-weight:800;text-decoration:none;white-space:nowrap}footer{margin-top:35px;padding:28px 18px;text-align:center;background:#fff;border-top:1px solid #dedbea;color:#514c6b;font-size:14px}footer a{color:#6246ea;font-weight:800;text-decoration:none}
.editor-main{max-width:1300px;margin:auto;padding:24px 18px 50px}.editor-main h1{font-size:clamp(27px,4vw,36px);line-height:1.2;margin:0 0 6px}.editor-intro{margin:0 0 18px;color:#615d74}.editor-layout{display:grid;grid-template-columns:minmax(275px,340px) minmax(0,1fr);gap:18px;align-items:start}.editor-panel,.editor-workspace{background:#fff;border:1px solid #dedbea;border-radius:16px;padding:18px}.editor-panel h2{font-size:18px;margin:22px 0 12px}.editor-panel textarea{width:100%;resize:vertical;border:1px solid #cfcadf;border-radius:8px;padding:10px;font:inherit}.editor-panel input[type="range"]{width:100%;accent-color:#6246ea}.editor-panel input[type="color"]{width:70px;height:40px}.editor-tools{display:flex;gap:8px;flex-wrap:wrap}.editor-tool,.editor-pagebar button{border:1px solid #dedbea;border-radius:9px;background:#fff;color:#423780;padding:9px 12px;font:700 14px system-ui,sans-serif;cursor:pointer;min-height:42px}.editor-tool.active{background:#6246ea;color:#fff;border-color:#6246ea}.editor-tool:disabled,.editor-pagebar button:disabled{opacity:.45;cursor:not-allowed}.editor-panel #saveEdit{width:100%;margin-top:20px}.editor-panel #editorStatus{font-size:14px;font-weight:650;color:#423780}.editor-caveat{border-left:3px solid #c47a18;background:#fff9ee;border-radius:4px;padding:11px;font-size:13px;line-height:1.45;color:#55401d}.editor-pagebar{display:flex;justify-content:center;align-items:center;gap:16px;margin-bottom:14px;font-weight:700}.editor-scroll{overflow:auto;background:#e9e7f0;border-radius:8px;min-height:300px;padding:12px}.editor-stage{position:relative;margin:0 auto;background:#fff;box-shadow:0 8px 22px #2222}.editor-stage canvas{display:block}.editor-overlay{position:absolute;inset:0;touch-action:none}.text-hit{position:absolute;display:block;border:1px solid transparent;padding:0;background:transparent;color:transparent;text-align:left;white-space:pre;cursor:text;line-height:1.2}.text-hit:hover,.text-hit:focus-visible{border-color:#6246ea;background:#6246ea22}.text-hit.changed{background:#fff;color:#17152a;z-index:2;cursor:move}.text-hit.selected,.image-edit.selected{outline:2px solid #6246ea;outline-offset:1px}.image-edit{position:absolute;border:2px dashed #6246ea;background-color:#ffffffbb;background-size:100% 100%;background-position:center;cursor:move;touch-action:none}.image-mark{position:absolute;border:2px dashed #6246ea;background:#6246ea33;pointer-events:none}.editor-panel section[hidden]{display:none}.editor-main button:focus-visible,.editor-main input:focus-visible,.editor-main textarea:focus-visible{outline:3px solid #6246ea;outline-offset:2px}@media(max-width:820px){.editor-layout{grid-template-columns:1fr}.editor-panel{order:1}.editor-workspace{order:2}}@media(max-width:380px){header{padding:10px 12px}.brand{gap:7px;font-size:18px}.brand img{width:36px;height:36px}.share-link{font-size:13px;padding:7px 9px;min-height:38px}.editor-pagebar{gap:7px}.editor-pagebar button{padding:7px}}
