:root{--bg: #14161a;--panel: #1c2027;--panel-2: #232830;--line: #2f3641;--line-soft: #262c35;--text: #e7eaee;--muted: #9aa4b2;--subtle: #6b7684;--accent: #1E7A46;--accent-2: #43A472;--danger: #CD3D1C;--radius: 10px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg)}button,input,select,textarea{font:inherit;color:inherit}.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);cursor:pointer;white-space:nowrap}.btn:hover{border-color:#3d4652;background:#2a3039}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn--primary:hover{background:#17693b;border-color:#17693b}.btn--ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn--ghost:hover{background:var(--panel-2);color:var(--text)}.btn--danger:hover{border-color:var(--danger);color:#ff8b6b}.btn--sm{padding:4px 8px;font-size:12px}.btn:disabled{opacity:.45;cursor:default}.input,.select,.textarea{width:100%;padding:8px 10px;background:#171b21;border:1px solid var(--line);border-radius:8px;outline:none}.input:focus,.select:focus,.textarea:focus{border-color:var(--accent-2)}.textarea{resize:vertical;line-height:1.5;font-family:var(--font)}.label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--subtle);margin:0 0 5px}.help{font-size:11px;color:var(--subtle);margin-top:5px;line-height:1.45}.field{margin-bottom:14px}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--panel);border-bottom:1px solid var(--line);flex:0 0 auto}.topbar__title{font-weight:600;letter-spacing:-.01em}.topbar__spacer{flex:1}.docname{background:transparent;border:1px solid transparent;border-radius:8px;padding:6px 8px;font-size:15px;font-weight:600;min-width:260px}.docname:hover{border-color:var(--line)}.docname:focus{border-color:var(--accent-2);background:#171b21;outline:none}.savestate{font-size:12px;color:var(--subtle);min-width:92px}.savestate--dirty{color:#d6a15a}.savestate--error{color:#ff8b6b}.meta{display:flex;gap:10px;padding:10px 14px;background:var(--panel);border-bottom:1px solid var(--line);flex:0 0 auto}.meta>div{flex:1}.meta .counter{font-size:11px;color:var(--subtle);text-align:right;margin-top:4px}.meta .counter--warn{color:#d6a15a}.work{display:flex;flex:1;min-height:0}.col{display:flex;flex-direction:column;min-height:0;background:var(--panel)}.col--left{width:264px;border-right:1px solid var(--line)}.col--right{width:348px;border-left:1px solid var(--line)}.col__head{padding:11px 14px;border-bottom:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--subtle);display:flex;align-items:center;gap:8px}.col__body{overflow-y:auto;padding:10px;flex:1}.palette__group{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--subtle);margin:12px 4px 6px}.palette__group:first-child{margin-top:2px}.palette__item{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:7px 9px;margin-bottom:3px;border:1px solid transparent;border-radius:8px;background:transparent;cursor:pointer}.palette__item:hover{background:var(--panel-2);border-color:var(--line)}.palette__item:disabled{opacity:.3;cursor:default;background:transparent;border-color:transparent}.palette__icon{width:22px;height:22px;display:grid;place-items:center;border-radius:6px;background:#171b21;color:var(--accent-2);font-size:12px;flex:0 0 auto}.outline__item{display:flex;align-items:center;gap:8px;padding:8px 9px;margin-bottom:3px;border:1px solid transparent;border-radius:8px;cursor:pointer;background:transparent;width:100%;text-align:left}.outline__item:hover{background:var(--panel-2)}.outline__item.is-sel{background:#1d2b23;border-color:var(--accent)}.outline__item.is-drop{border-top:2px solid var(--accent-2)}.outline__grip{color:var(--subtle);cursor:grab;font-size:13px;letter-spacing:-2px}.outline__label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.outline__sub{display:block;font-size:11px;color:var(--subtle);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.outline__lock{font-size:11px;color:var(--subtle)}.stage{flex:1;display:flex;flex-direction:column;min-width:0;background:#0f1114}.stage__bar{display:flex;align-items:center;gap:8px;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--panel)}.stage__frame{flex:1;overflow:auto;display:flex;justify-content:center;padding:18px}.stage__frame iframe{border:0;background:#fff;box-shadow:0 8px 30px #0006;width:100%;height:100%}.stage__inner{transition:max-width .15s ease}.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}.seg button{padding:5px 11px;background:transparent;border:0;cursor:pointer;color:var(--muted);font-size:12px}.seg button.is-on{background:var(--panel-2);color:var(--text)}.inspector__title{font-size:15px;font-weight:600;margin:0 0 2px}.inspector__type{font-size:11px;color:var(--subtle);margin-bottom:14px}.listitem{border:1px solid var(--line);border-radius:var(--radius);margin-bottom:8px;background:#171b21}.listitem__head{display:flex;align-items:center;gap:6px;padding:7px 9px;cursor:pointer}.listitem__head strong{flex:1;font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.listitem__body{padding:4px 10px 10px;border-top:1px solid var(--line-soft)}.empty{color:var(--subtle);text-align:center;padding:40px 20px;line-height:1.6}.list{max-width:880px;margin:0 auto;padding:34px 20px}.list h1{font-size:24px;margin:0 0 4px}.list p.lead{color:var(--muted);margin:0 0 24px}.card{display:flex;align-items:center;gap:14px;padding:14px 16px;margin-bottom:8px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer}.card:hover{border-color:#3d4652}.card__dot{width:10px;height:10px;border-radius:3px;flex:0 0 auto}.card__main{flex:1;min-width:0}.card__name{font-weight:600}.card__meta{font-size:12px;color:var(--subtle);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.newrow{display:flex;gap:8px;margin-bottom:22px;flex-wrap:wrap;align-items:center}.banner{padding:10px 14px;border-radius:8px;background:#3a2018;border:1px solid #5c3225;color:#ffb9a3;margin-bottom:14px;font-size:13px}.col--left{position:relative}.palette-pop{position:absolute;top:42px;left:8px;right:8px;bottom:8px;z-index:20;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 18px 40px #00000080;overflow-y:auto;padding:8px}.login{display:grid;place-items:center;height:100%}.login__box{width:340px;padding:28px;background:var(--panel);border:1px solid var(--line);border-radius:14px}.login__box h1{font-size:19px;margin:0 0 3px}.login__box p{color:var(--subtle);font-size:12px;margin:0 0 22px}.login__error{margin-top:10px;font-size:12px;color:#ff8b6b}.settings{display:flex;flex-direction:column;height:100%}.settings__body{flex:1;display:flex;min-height:0}.settings__nav{width:250px;border-right:1px solid var(--line);background:var(--panel);padding:10px;flex:0 0 auto}.settings__tab{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:9px 10px;margin-bottom:4px;border:1px solid transparent;border-radius:8px;background:transparent;cursor:pointer}.settings__tab:hover{background:var(--panel-2)}.settings__tab.is-on{background:var(--panel-2);border-color:var(--line)}.settings__badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center}.settings__form{flex:1;overflow-y:auto;padding:26px 30px;max-width:620px}.settings__group{margin-bottom:28px}.settings__group h3{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--subtle);margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#0000008c;display:grid;place-items:center;padding:30px}.modal__box{width:620px;max-width:100%;max-height:82vh;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 60px #0000008c;overflow:hidden}.modal__head{display:flex;align-items:center;gap:8px;padding:13px 16px;border-bottom:1px solid var(--line)}.modal__body{flex:1;overflow-y:auto;padding:12px 16px}.modal__foot{display:flex;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}.pick{display:flex;gap:12px;align-items:flex-start;padding:10px;border:1px solid transparent;border-radius:10px;cursor:pointer;margin-bottom:4px}.pick:hover{background:var(--panel-2);border-color:var(--line)}.pick.is-on{background:#1d2b23;border-color:var(--accent)}.pick__img{width:54px;height:54px;border-radius:8px;object-fit:cover;background:#fff;flex:0 0 auto}.pick__img--empty{display:grid;place-items:center;background:var(--panel-2);color:var(--subtle);font-size:10px}.pick__main{flex:1;min-width:0}.pick__title{font-weight:600;margin-bottom:3px}.pick__meta{font-size:12px;color:var(--muted)}.pick__note{font-size:11px;color:var(--subtle);margin-top:3px}.pick__warn{color:#d6a15a}.pick__check{width:20px;color:var(--accent-2);font-weight:700}.diff{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px}.diff__title{font-weight:600;margin-bottom:7px}.diff__row{display:flex;align-items:baseline;gap:8px;font-size:12px;padding:2px 0}.diff__label{width:116px;color:var(--subtle);flex:0 0 auto}.diff__from{color:var(--muted);text-decoration:line-through}.diff__arrow{color:var(--subtle)}.diff__to{color:var(--accent-2);font-weight:600}