:root{--u: 1px;--vw: 100vw}html,body{margin:0;min-height:100%;background:#fff;font-family:system-ui,sans-serif}.site{--sx: 0px;--ex: 0px;min-height:100vh;margin-left:var(--sx);margin-right:var(--ex);transition:margin .2s}.site.editing.dock-left{--sx: 380px}.site.editing.dock-right{--ex: 380px}.site.editing.dock-left .edit-toggle{left:auto;right:12px}.canvas{position:relative;width:100%;overflow:hidden;background:var(--c-background, #fff)}.item{box-sizing:border-box;z-index:1}.section{position:absolute;left:0;right:0;z-index:0;overflow:hidden;container-type:size;pointer-events:none}.section-texture{position:absolute;left:50%;top:50%;width:150cqmax;height:150cqmax;background-repeat:repeat}.section-overlay{position:absolute;top:0;right:0;bottom:0;left:0}.section.selected{outline:2px dashed #2d6cdf;outline-offset:-2px}.site.editing .item{cursor:pointer;outline:1px dashed rgba(0,0,0,.2)}.item.selected{outline:2px solid #2d6cdf!important}.media{display:block;width:100%;height:100%}.text-body{margin:0;white-space:pre-line;line-height:1.5;font-size:calc(var(--size-body, 16) * var(--u, 1px));font-weight:400;color:var(--c-text, #151814)}.text-body.level-h1{font-size:calc(var(--size-h1, 56) * var(--u, 1px));line-height:1.05}.text-body.level-h2{font-size:calc(var(--size-h2, 36) * var(--u, 1px));line-height:1.15}.text-body.level-h3{font-size:calc(var(--size-h3, 24) * var(--u, 1px));line-height:1.2}.edit-toggle{position:fixed;left:12px;bottom:12px;z-index:20;font:13px system-ui,sans-serif;padding:6px 10px;border:1px solid #999;border-radius:6px;background:var(--tb-bg, #fff);color:var(--tb-text, #111);font-family:var(--tb-font, system-ui, sans-serif);cursor:pointer}.notice{padding:8px 12px;background:#fff3cd;color:#5c4a00;font:13px system-ui,sans-serif}.editor{position:fixed;top:0;right:0;bottom:0;width:380px;z-index:30;display:flex;flex-direction:column;background:#fafafa;border-left:1px solid #ccc;font:13px/1.4 system-ui,sans-serif;color:#111}.editor header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid #ddd}.badge{padding:2px 6px;border-radius:4px;background:#ffe08a;font-size:11px}.tabs{display:flex;border-bottom:1px solid #ddd}.tabs button{flex:1;padding:8px;border:0;background:none;cursor:pointer}.tabs button.on{font-weight:700;border-bottom:2px solid #2d6cdf}.panel{flex:1;overflow:auto;padding:12px;display:grid;gap:10px;align-content:start}.editor footer{display:flex;justify-content:space-between;padding:10px 12px;border-top:1px solid #ddd}.editor button{font:inherit;padding:4px 8px;border:1px solid #aaa;border-radius:4px;background:#fff;cursor:pointer}.editor button:disabled{opacity:.4;cursor:default}.editor button.on{background:#2d6cdf;border-color:#2d6cdf;color:#fff}.editor button.danger{color:#b00020;border-color:#b00020}.editor input,.editor select,.editor textarea{font:inherit;width:100%;box-sizing:border-box;padding:4px;border:1px solid #bbb;border-radius:4px}.editor textarea{font-family:ui-monospace,monospace;font-size:11px}.row{display:flex;flex-wrap:wrap;gap:6px}.field{display:grid;gap:3px}.field span{color:#555}.check{display:flex;gap:6px;align-items:center}.check input{width:auto}.items{list-style:none;margin:0;padding:0;display:grid;gap:4px}.items button{width:100%;text-align:left}.hint{margin:0;color:#555}.details{display:grid;gap:10px;padding-top:8px;border-top:1px solid #ddd}.toolbar{display:flex;flex-wrap:wrap;gap:4px}.axis{display:grid;gap:8px;border:1px solid #ccc;border-radius:6px;padding:8px;margin:0}.axis legend{font-weight:700;padding:0 4px}.pivot{display:grid;grid-template-columns:repeat(3,32px);gap:4px;width:max-content}.pivot button{width:32px;height:28px;padding:0}.swatch{display:grid;grid-template-columns:22px 40px 1fr;gap:8px;align-items:center}.num-label{color:#555}.num{display:flex;gap:4px}.num input{flex:1;min-width:0}.num button{width:32px;font-size:16px;line-height:1}.hint.warn{color:#9a5b00}.hint code{font-size:11px;word-break:break-all}.swatch input[type=color]{width:40px;height:28px;padding:0}.editor h4{margin:8px 0 0}.frame{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.frame>.item{pointer-events:auto}.band-frame{overflow:hidden;z-index:1}.page-frame{z-index:2}.fixed-frame{position:fixed;top:0;bottom:0;left:var(--sx);right:var(--ex);z-index:10}.site.phone-preview .fixed-frame{left:calc(var(--sx) + (100% - var(--sx) - var(--ex) - var(--preview-w, 390px)) / 2);right:auto;width:var(--preview-w, 390px)}.site.phone-preview .canvas{width:var(--preview-w, 390px);margin:0 auto}.editor{overflow-y:auto}.add-bar{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;gap:4px;padding:8px 0;background:#fff;border-bottom:1px solid rgba(0,0,0,.1)}.add-bar button{font:inherit;font-size:12px;padding:4px 8px}.banner{margin:8px 0;padding:8px;border-radius:4px;background:#fff4cc;font-size:12px}.seg{display:flex;margin:8px 12px 0}.seg button{flex:1;font:inherit;padding:6px;border:1px solid #999;background:#fff;cursor:pointer}.seg button:first-child{border-radius:4px 0 0 4px}.seg button:last-child{border-radius:0 4px 4px 0;border-left:0}.seg button.on{background:#2d6cdf;border-color:#2d6cdf;color:#fff}.row.between{justify-content:space-between;align-items:center}.axis-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.swatch{display:grid;grid-template-columns:22px 40px 1fr 28px;gap:6px;align-items:center;margin-bottom:6px}.toolbar button.on{background:#2d6cdf;color:#fff}.animated{position:relative;overflow:hidden}.animated-tex{position:absolute;left:50%;top:50%;background-origin:content-box}.editor.dock-left{left:0;right:auto;border-left:0;border-right:1px solid #ccc}.editor .dock-toggle{margin-left:auto}@media(max-width:700px){.site.editing.dock-left,.site.editing.dock-right{--sx: 0px;--ex: 0px}.site.editing.dock-left .edit-toggle{left:12px;right:auto}.editor{width:100%}}html{scroll-behavior:smooth}[hidden]{display:none!important}.editor{font-size:14px;line-height:1.45}.editor header{padding:10px 12px;gap:8px}.editor .dock-toggle{font-size:12px}.search{display:flex;flex-direction:column;gap:4px;padding:10px 12px 4px}.search input{width:100%;box-sizing:border-box;font:inherit;padding:8px 10px;border:1px solid #aaa;border-radius:6px;background:#fff}.editor h4{margin:18px 0 8px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#555}.file-preview{display:flex;gap:8px;align-items:center;margin:-4px 0 10px}.file-preview img{width:48px;height:48px;object-fit:cover;border:1px solid #ccc;border-radius:4px}.advanced{margin:8px 0}.advanced summary{cursor:pointer;font-weight:600;padding:6px 0}.editor .field>span{font-weight:600;margin-bottom:2px}.hover-box,.fx-root{position:absolute;top:0;right:0;bottom:0;left:0}.hover-box .layer,.fx-body>.media{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.poster{transition:opacity .4s ease}.poster.is-hidden{opacity:0}.fade-in{animation:fx-fade .4s ease both}@keyframes fx-fade{0%{opacity:0}to{opacity:1}}.fx-link{position:absolute;top:0;right:0;bottom:0;left:0;display:block;cursor:pointer;color:inherit;text-decoration:none}.fx-body{position:absolute;top:0;right:0;bottom:0;left:0}.fx-shake{animation:fx-shake var(--shake-ms, .6s) ease-in-out 1 both}@keyframes fx-shake{0%{transform:rotate(0) translate(0)}15%{transform:rotate(calc(-1.4deg * var(--shake-k, 1))) translate(-1px)}35%{transform:rotate(calc(1.1deg * var(--shake-k, 1))) translate(1px,-1px)}55%{transform:rotate(calc(-.7deg * var(--shake-k, 1))) translateY(1px)}75%{transform:rotate(calc(.5deg * var(--shake-k, 1))) translate(-1px)}to{transform:rotate(0) translate(0)}}.fx-mask{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;-webkit-mask-size:100% 100%;mask-size:100% 100%;pointer-events:none}.fx-flash{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--flash-col, #fff);animation:fx-flash .3s ease-out forwards}@keyframes fx-flash{0%{opacity:0}25%{opacity:var(--flash-peak, .95)}to{opacity:0}}.fx-shine-band{position:absolute;top:-15%;bottom:-15%;left:0;width:var(--sw, 70%);background:linear-gradient(90deg,transparent,var(--shine, #fff),transparent);transform:skew(calc(-1 * var(--slant, 18deg)));pointer-events:none;animation:fx-shine .7s cubic-bezier(.5,0,.8,.6) forwards}@keyframes fx-shine{0%{left:calc(var(--sw, 70%) * -1)}to{left:100%}}.fx-soft-flash{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--flash-col, var(--color-3));animation:fx-soft-flash .5s ease-in-out forwards;pointer-events:none}@keyframes fx-soft-flash{0%{opacity:0}40%{opacity:.85}to{opacity:0}}.fx-card{position:fixed;z-index:1000;pointer-events:none;overflow:hidden;border-radius:var(--radius, 6px);background:var(--card-bg, transparent);isolation:isolate;-webkit-mask-image:-webkit-radial-gradient(white,black);mask-image:-webkit-radial-gradient(white,black);filter:drop-shadow(0 16px 24px rgba(0,0,0,.35));transform:perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));transition:transform .12s ease-out;animation:fx-card-open var(--open-ms, .45s) cubic-bezier(.2,.9,.25,1.05) both}.fx-card.fx-card-shake{animation:fx-card-open var(--open-ms, .45s) cubic-bezier(.2,.9,.25,1.05) both,fx-card-shake var(--shake-ms, .6s) ease-in-out 1 both}.fx-card.is-closing{animation:fx-card-close var(--close-ms, .36s) ease-in both}.fx-card img{display:block;width:100%;height:100%;object-fit:cover}.fx-card .fx-soft-flash{border-radius:inherit}.fx-card .fx-shine-band{z-index:1}@keyframes fx-card-open{0%{scale:var(--k0, .4);opacity:.6}to{scale:1;opacity:1}}@keyframes fx-card-close{0%{scale:1;opacity:1}to{scale:var(--k0, .4);opacity:0}}@keyframes fx-card-shake{0%{rotate:0deg}20%{rotate:calc(-2.5deg * var(--shake-k, 1))}40%{rotate:calc(2deg * var(--shake-k, 1))}60%{rotate:calc(-1.2deg * var(--shake-k, 1))}80%{rotate:calc(.6deg * var(--shake-k, 1))}to{rotate:0deg}}.page-tabs{position:fixed;top:10px;left:50%;transform:translate(-50%);z-index:19;display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--c-background, #fff);box-shadow:0 2px 10px #0000002e;font:13px system-ui,sans-serif;max-width:calc(100vw - 24px);overflow-x:auto}.page-tabs a{padding:5px 12px;border-radius:999px;color:var(--c-text, #000);text-decoration:none;white-space:nowrap}.page-tabs a.on{background:var(--c-highlight, #ddd);font-weight:700}.font-row{display:grid;grid-template-columns:1fr 1.4fr 1.2fr auto;gap:4px;margin-bottom:6px}.font-row input{min-width:0}.page-list{list-style:none;padding:0;margin:0 0 12px}.page-list li{display:flex;align-items:center;gap:6px;padding:4px 0;border-bottom:1px solid #eee}.page-list li.on .page-pick{font-weight:700}.page-list .page-pick{flex:1;text-align:left}.page-tabs{background:var(--tab-bg, var(--c-background, #fff));font-family:var(--tab-font, inherit)}.page-tabs a{color:var(--tab-text, var(--c-text, #000))}.page-tabs a.on{background:var(--tab-active, var(--c-highlight, #ddd))}.editor{background:var(--ws-bg, #fafafa);color:var(--ws-text, #111);font-family:var(--ws-font, system-ui, sans-serif)}.tab-stage{position:relative;overflow:hidden}.paste-guide{margin-bottom:10px}.snippet{margin:6px 0;padding:8px;background:#f1f1f1;border-radius:4px;font:11px/1.4 ui-monospace,monospace;white-space:pre-wrap}details.group{margin:6px 0;border-top:1px solid #e5e5e5}details.group>summary{cursor:pointer;padding:8px 0;font-weight:600;list-style:none}details.group>summary::-webkit-details-marker{display:none}details.group>summary:before{content:"▸ "}details.group[open]>summary:before{content:"▾ "}details.group>.group-body{padding-bottom:6px}.hint-widget{position:fixed;z-index:2147483000;font-family:var(--hint-font, inherit);width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--hint-bg, #fff);color:var(--hint-fg, #111);box-shadow:0 2px 8px #00000040;pointer-events:none;animation:hint-pulse 1.2s ease-in-out infinite;transform:translate(-50%)}.hint-widget img{width:100%;height:100%;object-fit:cover}.hint-widget .hint-arrow{font-size:22px;line-height:1}.hint-widget .hint-text{font-size:11px;line-height:1.1;text-align:center;padding:4px}@keyframes hint-pulse{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.12)}}@media(max-width:700px){.site.hide-toggle-phone:not(.editing) .edit-toggle{display:none}}