:root{--ink:#294f45;--muted:#777c70;--green:#315e51;--gold:#b9a16d;--paper:#faf8ef;--line:#e4decb}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Microsoft YaHei",sans-serif;height:100vh;height:100dvh;display:flex;flex-direction:column}button,input{font:inherit}button{min-height:44px;padding:10px 15px;border:1px solid #d8d4c5;border-radius:12px;background:#fffdf6;color:var(--ink);cursor:pointer;transition:background .15s,box-shadow .15s}button:hover{background:#eeeede}button:focus-visible,summary:focus-visible{outline:3px solid #c99444;outline-offset:3px}button:disabled{opacity:.42;cursor:default}.primary{background:var(--green);border-color:var(--green);color:white}.primary:hover{background:#254d41}header{display:flex;align-items:center;justify-content:space-between;padding:20px 32px 17px;border-bottom:1px solid var(--line);gap:20px;background:#fffdf8}.brand{display:flex;align-items:center;gap:15px}.seal{border:1px solid #b77761;border-radius:7px;color:#a36c54;font-family:"华文中宋",serif;writing-mode:vertical-rl;padding:9px 6px;font-size:17px;letter-spacing:3px}h1{margin:0;font-family:"华文中宋","Microsoft YaHei",serif;font-size:26px;letter-spacing:3px}header p{margin:6px 0 0;font-size:12px;letter-spacing:2px;color:var(--muted)}nav{display:flex;gap:10px}main{display:grid;grid-template-columns:340px 1fr;gap:24px;padding:20px 28px 12px;min-height:0;flex:1}aside{overflow:auto;scrollbar-width:thin;padding:0 12px 14px 0}aside section{margin-bottom:20px}h2{font-size:16px;font-weight:600;display:flex;align-items:center;gap:9px;margin:0 0 9px}h2 b{font-family:Georgia,serif;font-size:16px;font-weight:400;color:#a58c53}.hint{color:var(--muted);font-size:12px;line-height:1.7;margin:6px 0 10px}.tiny{font-size:11px}.row{display:flex;gap:8px}.row>*{flex:1;min-width:0}.text-button{background:none;border:0;min-height:34px;padding:7px 0;font-size:12px;color:#897243}.text-button:hover{background:none;color:var(--green)}#editorWrap{background:#edece4;border:1px solid var(--line);border-radius:12px;position:relative;overflow:hidden}#editor{width:100%;display:block;touch-action:none;user-select:none}#empty{position:absolute;left:0;right:0;top:40%;text-align:center;line-height:1.9;color:#94988c;font-size:14px;pointer-events:none}.small{margin-top:8px}.small button{font-size:12px;min-height:38px;padding:6px}.wide{width:100%}details{font-size:12px;margin-top:10px}summary{cursor:pointer;color:var(--muted);padding:7px 0}label{display:flex;align-items:center;gap:8px;margin:12px 0}label input{min-width:0;flex:1;accent-color:var(--green)}output{min-width:38px;font-size:11px}.selected{border:2px solid var(--green);background:#e7ede5}.actions{margin:9px 0}.showcase{position:relative;border:1px solid #e0d8bf;border-radius:22px;background:#f7f3e7;overflow:hidden;min-height:0;display:flex;flex-direction:column}.showcase:before{content:"";position:absolute;inset:0;background-image:var(--bg);background-size:cover;background-position:center;opacity:.42;pointer-events:none}.stage-top,.stage-bottom{position:relative;z-index:1}.stage-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;font-size:12px}.pill{border-radius:30px;background:#fffdf1cc;padding:8px 14px;border:1px solid #ded5bb}.offline{color:#879083;font-size:11px}.canvas-box{min-height:0;flex:1;display:flex;align-items:center;justify-content:center;position:relative}#stage{height:100%;width:100%;object-fit:contain;display:block;max-width:100%;max-height:100%}.stage-bottom{text-align:center;padding:8px 12px 20px}.stage-bottom p{font-family:"华文中宋",serif;font-size:19px;letter-spacing:3px;margin:0 0 7px}.stage-bottom span{font-size:11px;letter-spacing:2px;color:#8f9588}#status{font-size:11px;color:#8b8f83;min-height:26px;padding:3px 28px 8px}#toast{position:fixed;bottom:36px;left:50%;transform:translateX(-50%);background:#244e43;color:white;padding:14px 22px;border-radius:14px;box-shadow:0 5px 30px #0002;max-width:90vw;z-index:20;font-size:14px}body.recording aside button,body.recording aside input,body.recording nav button{pointer-events:none;opacity:.6}body.recording #video{opacity:1}body.recording #editor{pointer-events:none}body.loading #apply{pointer-events:none}button.busy{opacity:.6}
@media(min-width:1500px){main{max-width:1500px;width:100%;margin:auto;grid-template-columns:380px 1fr}}@media(max-width:1050px){header{padding:14px 20px}h1{font-size:23px;letter-spacing:1px}main{grid-template-columns:295px 1fr;padding:14px 18px 8px;gap:14px}.stage-top{padding:12px;flex-wrap:wrap;gap:5px}.offline{font-size:10px}.stage-bottom{padding-bottom:12px}.stage-bottom p{font-size:16px}}@media(max-height:670px) and (min-width:651px){header{padding:9px 18px}header p{display:none}.seal{font-size:14px;padding:4px}h1{font-size:22px}main{padding-top:10px}.stage-top{padding:8px 15px}.stage-bottom{padding:6px 10px 12px}.stage-bottom span{display:none}}@media(max-width:650px){body{height:auto;min-height:100dvh}header{padding:12px 14px;flex-wrap:wrap;gap:12px}h1{font-size:22px}.brand{gap:10px}nav{width:100%}nav button{flex:1;font-size:12px}main{display:flex;flex-direction:column;padding:12px;gap:12px}aside{overflow:visible;padding:0;order:2}aside section{padding:16px;background:#fffdf7;border:1px solid var(--line);border-radius:16px}.showcase{height:65vh;min-height:450px;order:1}#editorWrap{max-width:420px;margin:auto}#status{padding:8px 16px}#toast{width:max-content;max-width:90vw}}