:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#0f172a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;min-width:320px;min-height:100vh;overflow:hidden}#root{width:100%;height:100vh;display:flex}.designer-container{display:grid;grid-template-columns:280px 1fr 320px;width:100%;height:100%}.sidebar{background:#1e293b;border-right:1px solid #334155;padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}.canvas-area{background:#0f172a;padding:2rem;overflow:auto;display:flex;justify-content:center;align-items:flex-start;position:relative}.canvas{background:#fff;width:210mm;min-height:297mm;box-shadow:0 25px 50px -12px #00000080;position:relative;color:#333;padding:15mm;font-family:Tahoma,sans-serif;border-top:4px solid #000099}.properties-panel{background:#1e293b;border-left:1px solid #334155;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.glass{background:#1e293bb3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.1);border-radius:12px}.tool-item{padding:.75rem;background:#334155;border-radius:8px;cursor:grab;display:flex;align-items:center;gap:.5rem;transition:all .2s;border:1px solid transparent}.tool-item:hover{background:#475569;border-color:#6366f1}.header{grid-column:1 / -1;background:#1e293b;height:60px;border-bottom:1px solid #334155;display:flex;align-items:center;padding:0 1.5rem;justify-content:space-between}.btn-primary{background:#6366f1;color:#fff;padding:.5rem 1rem;border-radius:6px;border:none;font-weight:600;cursor:pointer}.btn-secondary{background:transparent;color:#94a3b8;padding:.5rem 1rem;border-radius:6px;border:1px solid #334155;cursor:pointer}.form-group{display:flex;flex-direction:column;gap:.5rem}.input-field{background:#0f172a99;border:1px solid rgba(255,255,255,.1);padding:.5rem .75rem;border-radius:10px;color:#fff;font-size:.8rem;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 2px 4px #0000001a}.input-field:focus{outline:none;border-color:#6366f1;background:#0f172ae6;box-shadow:0 0 0 3px #6366f133,inset 0 2px 4px #0000001a}aside::-webkit-scrollbar{width:5px}aside::-webkit-scrollbar-track{background:transparent}aside::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}aside::-webkit-scrollbar-thumb:hover{background:#fff3}.property-section{background:#0f172a;border:1px solid #334155;border-radius:8px;overflow:hidden;margin-bottom:1rem}.property-section-header{padding:.5rem .75rem;background:#1e293b;border-bottom:1px solid #334155;font-size:.7rem;font-weight:700;color:#94a3b8;display:flex;align-items:center;gap:8px;text-transform:uppercase}.property-section-body{padding:.75rem}.toolbar-group{display:flex;background:#020617;border:1px solid #334155;border-radius:6px;padding:2px;gap:2px}.toolbar-btn{flex:1;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:4px;color:#94a3b8;cursor:pointer;transition:all .2s}.toolbar-btn:hover{background:#1e293b;color:#fff}.toolbar-btn.active{background:#6366f1;color:#fff}@keyframes slideDown{0%{transform:translate(-50%,-100%);opacity:0}to{transform:translate(-50%);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalEnter{0%{opacity:0;transform:scale(.95) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.animate-fade-in{animation:fadeIn .3s ease-out forwards}.animate-modal-enter{animation:modalEnter .4s cubic-bezier(.16,1,.3,1) forwards}.xslt-click-highlight{background-color:#fcd34d73!important;border-radius:2px;box-shadow:0 0 0 1px #fcd34db3 inset;transition:background-color .3s ease-out}[data-render-index]{outline:1px dashed rgba(99,102,241,.35);outline-offset:1px;cursor:pointer;transition:outline-color .15s ease-out,background-color .15s ease-out}[data-render-index]:hover{outline:2px solid rgba(99,102,241,.85);outline-offset:0;background-color:#6366f10f}.xslt-bind-glyph{background:linear-gradient(180deg,#6366f1d9,#6366f199);border-left:2px solid rgba(67,56,202,.9);width:4px!important;margin-left:6px;cursor:help;border-radius:1px}.xslt-bind-glyph:hover{background:linear-gradient(180deg,#fcd34df2,#fcd34db3)!important;border-left-color:#b45309e6!important}
