:root{color-scheme:dark;--bg:#080b11;--panel:#111722;--panel2:#0d121b;--line:#242d3b;--text:#f3f5f8;--muted:#96a0af;--accent:#5f7cff;--danger:#ff5f6d;--ok:#49d17d}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#121a2a 0,#080b11 42%);color:var(--text);font:14px/1.45 Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;min-height:100vh}.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.auth-card{width:min(420px,100%);background:rgba(17,23,34,.96);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:0 30px 90px rgba(0,0,0,.35)}.brand{font-weight:900;letter-spacing:.16em;font-size:13px}.sub,.panel p{color:var(--muted);margin:.2rem 0 0}.auth-card h1{margin:12px 0 4px;font-size:28px}label{display:flex;flex-direction:column;gap:7px;color:#c7ced9;margin:12px 0;font-weight:650}input,select,textarea{width:100%;background:#090e16;color:#fff;border:1px solid #2b3545;border-radius:9px;padding:10px 11px;outline:none}input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(95,124,255,.15)}input[type=color]{padding:3px;height:41px}input[type=range]{padding:0;border:0}.primary,.ghost-btn,.danger-soft,.ghost,.file-button{border:0;border-radius:9px;padding:10px 14px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.primary{background:var(--accent);color:#fff}.ghost,.ghost-btn{background:#182131;color:#e9edf5;border:1px solid #2c3749}.danger-soft{background:#2a171b;color:#ff9ca5;border:1px solid #5a2b31}.file-button{background:#182131;border:1px solid #2c3749;color:#fff;margin:0;position:relative;overflow:hidden}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.alert{padding:10px 12px;border-radius:9px;margin:12px 0}.error{background:#2c1518;color:#ffadb4;border:1px solid #5b252b}.app-shell{max-width:1500px;margin:auto;padding:22px}.app-shell>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.header-actions{display:flex;gap:8px}main{display:grid;grid-template-columns:minmax(550px,1.35fr) minmax(360px,.65fr);gap:16px}.panel{background:rgba(17,23,34,.95);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 12px 40px rgba(0,0,0,.18)}.preview-panel{grid-row:span 2}.ts-panel,.help-panel{grid-column:2}.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.panel h2{font-size:18px;margin:0 0 12px}.panel-title h2{margin:0}.status{font-size:12px;border:1px solid #334058;background:#131c2b;padding:5px 9px;border-radius:999px;color:#aeb8c8}.status.saved{color:#9af3b8;border-color:#275d3a;background:#102519}.preview-scroll{overflow:auto;padding:30px 0 24px}.banner-preview{position:relative;overflow:hidden;background:#0b0f17 center/cover no-repeat;box-shadow:0 18px 55px rgba(0,0,0,.4);border:1px solid #313b4b;margin:auto;user-select:none}.banner-preview .shade{position:absolute;inset:0;pointer-events:none}.banner-element{position:absolute;white-space:nowrap;cursor:grab;line-height:1.05;font-family:Arial,sans-serif;font-weight:600;z-index:2;padding:2px;border:1px dashed transparent}.banner-element:hover,.banner-element.active{border-color:rgba(255,255,255,.55);background:rgba(95,124,255,.12)}.banner-element:active{cursor:grabbing}.preview-bottom{display:flex;gap:12px;align-items:end;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px}.preview-bottom label{margin:0;max-width:260px;flex:1}.actual-wrap{margin-top:14px;border-top:1px solid var(--line);padding-top:12px;color:var(--muted);display:flex;flex-direction:column;gap:9px}.actual-wrap img{max-width:100%;width:max-content;border:1px solid #2d3746}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid2 label{margin:5px 0}.upload-row,.button-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}hr{border:0;border-top:1px solid var(--line);margin:20px 0}.element-card{border:1px solid #283344;background:var(--panel2);border-radius:12px;padding:12px;margin:10px 0}.element-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.element-head strong{text-transform:capitalize}.element-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.element-grid label{font-size:12px;margin:4px 0}.element-text{margin-top:8px}.switch{display:inline-flex;margin:0}.switch input{display:none}.switch span{width:42px;height:23px;background:#333d4c;border-radius:99px;display:block;position:relative;transition:.2s}.switch span:after{content:"";position:absolute;width:17px;height:17px;border-radius:50%;background:white;left:3px;top:3px;transition:.2s}.switch input:checked+span{background:var(--accent)}.switch input:checked+span:after{transform:translateX(19px)}.toggle-line{display:flex;gap:10px;align-items:center;margin:12px 0}.result-box{margin-top:12px;padding:11px;border:1px solid #2c3747;background:#0a1018;border-radius:9px;color:#aab4c2}.result-box.ok{border-color:#285a3b;color:#a4efbb}.result-box.bad{border-color:#5a2b31;color:#ffafb6}.help-panel code{display:block;overflow:auto;background:#080d14;border:1px solid #283343;border-radius:9px;padding:10px;color:#c8d4ff}.help-panel p:last-child{color:var(--muted)}@media(max-width:1050px){main{grid-template-columns:1fr}.preview-panel,.ts-panel,.help-panel{grid-column:auto;grid-row:auto}}@media(max-width:650px){.app-shell{padding:12px}.grid2,.element-grid{grid-template-columns:1fr 1fr}.preview-bottom{align-items:stretch;flex-direction:column}.preview-bottom label{max-width:none}.app-shell>header{align-items:flex-start;gap:10px;flex-direction:column}}

.size-tools{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin:10px 0 14px}.size-tools .ghost-btn{padding:8px 10px}.zoom-control{min-width:150px;margin:0 0 0 auto}.zoom-control select{padding:8px 10px}.preview-stage{position:relative;margin:auto}.banner-preview{transform-origin:top left}.preview-size-hint{color:var(--muted);font-size:12px;margin-top:6px}

.panel-title.compact{margin-bottom:6px}.font-manager h2{margin-bottom:2px}.font-list{display:flex;flex-direction:column;gap:8px;margin-top:10px}.font-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#0b111a;border:1px solid #283344;border-radius:10px;padding:9px 10px}.font-sample{font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.danger-soft.small{padding:7px 10px;font-size:12px;flex:0 0 auto}.element-text select{margin-top:0}

.greeting-grid{display:grid;grid-template-columns:140px 1fr;gap:8px 10px}.greeting-grid label{margin:4px 0}.greeting-grid input[type=time]{min-width:0}@media(max-width:650px){.greeting-grid{grid-template-columns:1fr 1fr}}