.ms-shell-ribbon{height:64px;min-height:64px;max-height:64px;background:var(--neutral-warm-white);border-bottom:1px solid var(--neutral-medium-gray);display:flex;align-items:center;padding:0 var(--space-4);gap:var(--space-6);position:relative;z-index:var(--z-ribbon);overflow-x:auto;overflow-y:visible}.ms-ribbon-group{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);border-radius:var(--radius-md);min-width:0;flex-shrink:0}.ms-ribbon-group-label{font-size:.75rem;font-weight:500;color:var(--neutral-dark-gray);text-transform:uppercase;letter-spacing:.025em;margin-bottom:var(--space-1);text-align:center}.ms-ribbon-button,.ms-ribbon-group-content{display:flex;align-items:center;gap:var(--space-1)}.ms-ribbon-button{flex-direction:column;padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-md);background:transparent;color:var(--neutral-dark-gray);cursor:pointer;transition:all var(--transition-fast);min-width:44px;position:relative}.ms-ribbon-button:hover{background:var(--neutral-light-gray);color:var(--neutral-charcoal)}.ms-ribbon-button:active{background:var(--neutral-medium-gray);transform:translateY(1px)}.ms-ribbon-button--primary{background:var(--brand-primary);color:white}.ms-ribbon-button--primary:hover{background:var(--primary-dark)}.ms-ribbon-button--active{background:var(--primary-sage);color:white}.ms-ribbon-button--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ms-ribbon-button-icon{width:20px;height:20px;flex-shrink:0}.ms-ribbon-button-label{font-size:.75rem;font-weight:500;line-height:1;text-align:center;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ms-ribbon-button--large{min-width:60px;padding:var(--space-3) var(--space-4)}.ms-ribbon-button--large .ms-ribbon-button-icon{width:24px;height:24px}.ms-ribbon-button--large .ms-ribbon-button-label{font-size:.875rem;max-width:80px}.ms-ribbon-button--horizontal{flex-direction:row;gap:var(--space-2);min-width:0;width:auto}.ms-ribbon-button--horizontal .ms-ribbon-button-label{white-space:nowrap}.ms-ribbon-separator{width:1px;height:40px;background:var(--neutral-medium-gray);margin:0 var(--space-2);flex-shrink:0}.ms-ribbon-dropdown{position:relative}.ms-ribbon-dropdown-arrow{position:absolute;bottom:2px;right:2px;width:8px;height:8px;color:currentColor}.ms-ribbon-split-button{display:flex;border-radius:var(--radius-md);overflow:hidden}.ms-ribbon-split-button-main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:1px solid rgba(0,0,0,.1)}.ms-ribbon-split-button-dropdown{border-top-left-radius:0;border-bottom-left-radius:0;min-width:20px;padding:var(--space-2)}@media (max-width:1024px){.ms-shell-ribbon{padding:0 var(--space-2);gap:var(--space-4)}.ms-ribbon-button{min-width:38px}.ms-ribbon-button-label{font-size:.6875rem;max-width:50px}}@media (max-width:768px){.ms-shell-ribbon{gap:var(--space-2)}.ms-ribbon-group{gap:var(--space-1)}.ms-ribbon-button{flex-direction:row;gap:var(--space-2);min-width:0}.ms-ribbon-button-label{display:none}}.ms-ribbon-button:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}.ribbon-menu{position:relative;background:var(--neutral-warm-white);border-bottom:1px solid var(--neutral-medium-gray);z-index:var(--z-ribbon)}.ribbon-menu--collapsed .ribbon-content{display:none}.ribbon-tabs{display:flex;align-items:center;justify-content:space-between;height:48px;background:var(--neutral-warm-white);border-bottom:1px solid var(--neutral-light-gray)}.ribbon-tabs-container{display:flex;align-items:center;gap:0}.ribbon-tab{display:flex;align-items:center;justify-content:center;height:48px;padding:0 var(--space-4);background:transparent;border:none;border-bottom:3px solid transparent;color:var(--neutral-dark-gray);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);position:relative}.ribbon-tab:hover{background:var(--neutral-light-gray);color:var(--neutral-charcoal)}.ribbon-tab--active{background:var(--neutral-warm-white);border-bottom-color:var(--brand-primary);color:var(--brand-primary);font-weight:600}.ribbon-tab--suggested{position:relative}.ribbon-tab--suggested:after{content:""}.ribbon-tab--suggested:after,.ribbon-tab-indicator{position:absolute;top:8px;right:8px;width:6px;height:6px;background:var(--primary-sage);border-radius:50%;opacity:.8}.ribbon-collapse-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin-right:var(--space-3);background:transparent;border:1px solid var(--neutral-medium-gray);border-radius:var(--radius-md);color:var(--neutral-dark-gray);cursor:pointer;transition:all var(--transition-fast)}.ribbon-collapse-btn:hover{background:var(--neutral-light-gray);border-color:var(--neutral-dark-gray)}.ribbon-collapse-icon{transition:transform var(--transition-fast)}.ribbon-collapse-icon--collapsed{transform:rotate(180deg)}.ribbon-content{min-height:64px;max-height:120px;background:var(--neutral-warm-white)}.ribbon-tab-container{width:100%;height:100%}.ribbon-tab-loading{display:flex;align-items:center;justify-content:center;height:64px;background:var(--neutral-warm-white)}.ribbon-tab-error,.ribbon-tab-placeholder{padding:var(--space-2) var(--space-4);height:64px;display:flex;align-items:center}.ribbon-tab:focus-visible{outline:2px solid var(--brand-primary);outline-offset:-2px;z-index:1}.ribbon-collapse-btn:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}@media (max-width:768px){.ribbon-tabs{height:40px}.ribbon-tab{height:40px;padding:0 var(--space-3);font-size:.8125rem}.ribbon-collapse-btn{width:28px;height:28px;margin-right:var(--space-2)}.ribbon-content{min-height:48px;max-height:96px}.ribbon-tab-error,.ribbon-tab-loading,.ribbon-tab-placeholder{height:48px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ribbon-home-tab,.ribbon-insert-tab{width:100%;height:100%;background:var(--neutral-warm-white)}.ribbon-group{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-1);min-width:0;flex-shrink:0}.ribbon-group-header h3{font-size:.75rem;font-weight:500;color:var(--neutral-dark-gray);text-transform:uppercase;letter-spacing:.025em;margin:0;text-align:left}.ribbon-group-content{display:flex;flex-wrap:wrap;gap:var(--space-1);align-items:flex-start}.ribbon-group-separator{width:1px;height:40px;background:var(--neutral-medium-gray);flex-shrink:0}.ribbon-button{display:flex;align-items:center;justify-content:center;min-height:32px;border:1px solid;border-radius:var(--radius-md);background:var(--neutral-warm-white);color:var(--neutral-dark-gray);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;white-space:nowrap;position:relative}.ribbon-button:hover:not(:disabled){background:var(--neutral-light-gray);border-color:var(--brand-primary);color:var(--brand-primary)}.ribbon-button:active:not(:disabled){transform:translateY(1px);background:var(--neutral-medium-gray)}.ribbon-button:disabled{opacity:.5;cursor:not-allowed;background:var(--neutral-light-gray);border-color:var(--neutral-medium-gray);color:var(--neutral-medium-gray)}.ribbon-button:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px;z-index:1}.ribbon-button--primary{background:var(--brand-primary);border-color:var(--primary-dark);color:white}.ribbon-button--primary:hover:not(:disabled){background:var(--primary-dark);border-color:var(--primary-dark);color:white}.ribbon-button svg{flex-shrink:0;margin-right:var(--space-2)}.ribbon-button svg:only-child{margin-right:0}.ribbon-button .shortcut{font-size:.75rem;opacity:.7;margin-left:auto;padding-left:var(--space-2)}@media (max-width:1024px){.ribbon-group{gap:var(--space-1)}.ribbon-group-content{gap:1px}.ribbon-button{font-size:.8125rem;min-height:28px;padding-left:var(--space-2);padding-right:var(--space-2)}.ribbon-button svg{width:14px;height:14px}}@media (max-width:768px){.ribbon-button span:not(.shortcut){display:none}.ribbon-button svg{margin-right:0}.ribbon-button .shortcut{display:none}.ribbon-group-header h3{font-size:.6875rem}}.ribbon-button[data-testid=ribbon-btn-upload-image]{background:var(--brand-primary);border-color:var(--primary-dark);color:white;font-weight:600}.ribbon-button[data-testid=ribbon-btn-upload-image]:hover:not(:disabled){background:var(--primary-dark);border-color:var(--primary-dark);box-shadow:0 2px 4px rgba(59,130,246,.3)}.ribbon-button[data-testid=ribbon-btn-zoom-reset]{min-width:60px;font-weight:600;background:var(--neutral-light-gray);border-color:var(--neutral-dark-gray)}.ribbon-button[aria-pressed=true]{background:var(--primary-sage);border-color:var(--primary-sage);color:white}.ribbon-tab-loading .animate-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ms-shell-status-bar{height:40px;min-height:40px;max-height:40px;background:var(--neutral-light-gray);border-top:1px solid var(--neutral-medium-gray);display:flex;align-items:center;padding:0 var(--space-4);gap:var(--space-4);position:relative;z-index:var(--z-shell)}.ms-status-bar-left{display:flex;align-items:center;gap:var(--space-3)}.ms-status-bar-center{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-4)}.ms-status-bar-right{display:flex;align-items:center;gap:var(--space-3)}.ms-status-item{display:flex;align-items:center;gap:var(--space-2);font-size:.8125rem;color:var(--neutral-dark-gray);white-space:nowrap}.ms-status-item-label{font-weight:500}.ms-status-item-value{font-weight:400;color:var(--neutral-charcoal)}.ms-status-item--interactive{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.ms-status-item--interactive:hover{background:var(--neutral-medium-gray);color:var(--neutral-charcoal)}.ms-status-item--interactive:active{background:var(--neutral-dark-gray);color:var(--neutral-warm-white)}.ms-zoom-controls{display:flex;align-items:center;gap:var(--space-2)}.ms-zoom-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:transparent;border:1px solid var(--neutral-medium-gray);border-radius:var(--radius-sm);color:var(--neutral-dark-gray);cursor:pointer;transition:all var(--transition-fast)}.ms-zoom-button:hover{background:var(--neutral-medium-gray);border-color:var(--neutral-dark-gray);color:var(--neutral-charcoal)}.ms-zoom-button:active{background:var(--neutral-dark-gray);color:var(--neutral-warm-white)}.ms-zoom-button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ms-zoom-button-icon{width:14px;height:14px}.ms-zoom-percentage{min-width:60px;text-align:center;font-weight:500;color:var(--neutral-charcoal);font-size:.8125rem}.ms-zoom-percentage--interactive{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.ms-zoom-percentage--interactive:hover{background:var(--neutral-medium-gray)}.ms-canvas-info{display:flex;align-items:center;gap:var(--space-4)}.ms-canvas-dimensions,.ms-canvas-units{font-size:.8125rem;color:var(--neutral-dark-gray)}.ms-canvas-units{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.ms-canvas-units:hover{background:var(--neutral-medium-gray);color:var(--neutral-charcoal)}.ms-status-indicator{display:flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:.75rem;font-weight:500}.ms-status-indicator--success{background:var(--primary-sage);color:white}.ms-status-indicator--warning{background:var(--accent-gold);color:var(--neutral-charcoal)}.ms-status-indicator--error{background:var(--primary-rose);color:white}.ms-status-indicator--info{background:var(--brand-primary);color:white}.ms-status-separator{width:1px;height:20px;background:var(--neutral-medium-gray)}.ms-performance-indicator{display:flex;align-items:center;gap:var(--space-1);font-size:.75rem;color:var(--neutral-dark-gray)}.ms-performance-dot{width:6px;height:6px;border-radius:50%;background:var(--primary-sage)}.ms-performance-dot--warning{background:var(--accent-gold)}.ms-performance-dot--error{background:var(--primary-rose)}@media (max-width:1024px){.ms-shell-status-bar{padding:0 var(--space-2);gap:var(--space-2)}.ms-status-bar-center,.ms-status-bar-left,.ms-status-bar-right{gap:var(--space-2)}}@media (max-width:768px){.ms-status-bar-center{display:none}.ms-canvas-info{gap:var(--space-2)}.ms-canvas-dimensions{font-size:.75rem}.ms-zoom-controls{gap:var(--space-1)}.ms-zoom-button{width:24px;height:24px}.ms-zoom-percentage{min-width:50px;font-size:.75rem}}@media (max-width:480px){.ms-canvas-dimensions,.ms-performance-indicator{display:none}}.ms-canvas-units:focus-visible,.ms-status-item--interactive:focus-visible,.ms-zoom-button:focus-visible,.ms-zoom-percentage--interactive:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}:root{--primary:#6C63FF;--primary-dark:#5650DB;--primary-light:#8B84FF;--primary-pale:#F0EFFF;--accent-pink:#FF6B6B;--accent-pink-dark:#FF5252;--accent-pink-light:#FF8A8A;--accent-pink-pale:#FFF0F0;--accent-teal:#4ECDC4;--accent-teal-dark:#3AB7B0;--accent-teal-light:#6DD5CE;--accent-teal-pale:#E8FAF9;--gray-900:#1A1D23;--gray-800:#2C3E50;--gray-700:#34495E;--gray-600:#5A6C7D;--gray-500:#7C8A9A;--gray-400:#9CA8B8;--gray-300:#C5CDD8;--gray-200:#E1E6EC;--gray-100:#F0F3F7;--gray-50:#F8F9FA;--white:#FFFFFF;--neutral-charcoal:#4A453F;--neutral-warm-white:#FFFEFB;--neutral-light-gray:#F5F3F0;--neutral-medium-gray:rgba(224,224,224,0.8);--success:#10B981;--warning:#F59E0B;--danger:#EF4444;--info:#3B82F6;--shadow-sm:0 1px 2px 0 rgba(0,0,0,0.05);--shadow-md:0 4px 6px -1px rgba(139,134,128,0.1),0 2px 4px -1px rgba(139,134,128,0.06);--shadow-lg:0 10px 15px -3px rgba(139,134,128,0.1),0 4px 6px -2px rgba(139,134,128,0.05);--transition-normal:200ms ease-out;--transition-base:200ms ease-out;--transition-fast:0.15s;--space-sm:0.5rem;--space-md:1rem;--space-2:0.5rem;--space-4:1rem;--space-1:0.25rem;--space-3:0.75rem;--radius-sm:0.375rem;--radius-md:0.5rem}*{box-sizing:border-box}.ms-ribbon--modern{background:var(--white,#FFFFFF);border-bottom:1px solid var(--gray-200,#e1e6ec);box-shadow:var(--shadow-sm,0 1px 2px 0 rgba(0,0,0,.05));position:relative;transition:box-shadow var(--transition-normal,.2s ease-out) ease;padding:0 20px;overflow:hidden;max-height:64px}.ms-ribbon--modern,.ribbon-content{display:flex;gap:12px;justify-content:center}.ribbon-content{align-items:center;max-width:100%}.ms-ribbon-tab--enhanced{background:rgba(255,255,255,.7);border:1px solid transparent;border-bottom:none;color:var(--neutral-charcoal,#4A453F);font-weight:500;letter-spacing:.025em;padding:var(--space-sm,.5rem) var(--space-md,1rem);border-radius:var(--radius-sm,.375rem) var(--radius-sm,.375rem) 0 0;transition:all var(--transition-base,.2s ease-out) ease;position:relative;overflow:hidden;cursor:pointer;display:flex;align-items:center;gap:var(--space-sm,8px)}.ms-ribbon-tab--enhanced:hover{transform:translateY(-1px);box-shadow:var(--shadow-md,0 4px 6px -1px rgba(139,134,128,.1),0 2px 4px -1px rgba(139,134,128,.06))}.ms-ribbon-tab--enhanced:hover,.ms-tab-bar>.ms-ribbon-tab--enhanced:not(.ms-ribbon-tab--active):hover{background:var(--primary-light,#8B84FF)!important;border-color:var(--primary-light,#8B84FF)!important;color:var(--white,#FFFFFF)!important}.ms-ribbon-tab--enhanced.ms-ribbon-tab--active{background:var(--primary,#6C63FF);border-color:var(--primary,#6C63FF);color:var(--white,#FFFFFF);box-shadow:var(--shadow-sm,0 1px 2px rgba(0,0,0,.05));z-index:var(--z-tabbar);font-weight:600}.ms-tab-bar{display:flex;align-items:center;gap:2px;padding:0 20px;background:rgba(255,255,255,.8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(224,224,224,.3);min-height:40px}.ms-tab-bar .ms-ribbon-tab--enhanced{border-radius:8px 8px 0 0;margin-bottom:-1px}.h-screen{height:100vh}.w-screen{width:100vw}.flex{display:flex}.flex-col{flex-direction:column}.overflow-hidden{overflow:hidden}.flex-1{flex:1 1 0%}.min-h-0{min-height:0}.ms-shell-toolbar{height:64px;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(224,224,224,.5);padding:0 20px;gap:24px;box-shadow:0 2px 20px rgba(0,0,0,.05)}.app-logo,.ms-shell-toolbar{display:flex;align-items:center}.app-logo{gap:var(--space-md);font-size:1.25rem;font-weight:600;color:var(--gray-800);cursor:pointer;transition:all .3s ease;position:relative}.app-logo:hover{transform:translateY(-1px)}.logo-icon{width:32px;height:32px;position:relative}.logo-square{position:absolute;width:14px;height:14px;border-radius:3px}.logo-square:first-child{background:linear-gradient(135deg,var(--primary),var(--primary-dark));top:0;left:0}.logo-square:nth-child(2){background:linear-gradient(135deg,var(--accent-pink),var(--accent-pink-dark));top:5px;left:14px;opacity:.9}.logo-square:nth-child(3){background:linear-gradient(135deg,var(--accent-teal),var(--accent-teal-dark));top:14px;left:0;opacity:.9}.app-logo-text{display:inline-block;transition:all .3s ease}.app-logo-name{color:var(--gray-800)}.app-logo-studio{color:var(--primary);font-weight:700}.ms-brand-divider{color:var(--gray-400);font-weight:300;margin:0 8px}.project-name-container{display:flex;align-items:center;gap:8px}.ms-title-display{display:inline-block;min-width:100px;cursor:pointer;padding:4px 12px;border-radius:var(--radius-sm);transition:background-color .2s ease;font-weight:500;color:var(--gray-800);position:relative}.ms-title-display:hover{background:rgba(88,80,236,.1)}.ms-title-editing{background:var(--white);border:2px solid var(--primary);border-radius:var(--radius-sm);padding:4px 8px;font-size:14px;font-weight:500;color:var(--gray-800);outline:none;transition:all .2s ease;min-width:200px}.ms-title-editing:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(108,99,255,.2)}.ms-title-editing--error{border-color:var(--danger);box-shadow:0 0 0 3px rgba(239,68,68,.2)}.ms-title-saving{opacity:.6;pointer-events:none}.ms-title-error{color:var(--danger);font-size:12px;font-weight:500;margin-left:8px}.ms-shell-toolbar__btn{width:40px;height:40px;border:none;background:transparent;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;color:var(--gray-600)}.ms-shell-toolbar__btn:hover{background:rgba(88,80,236,.1);color:var(--primary);transform:translateY(-1px)}.ms-shell-toolbar__btn--active{background:var(--primary);color:white;box-shadow:0 2px 8px rgba(88,80,236,.3)}.ms-shell-toolbar__btn--active:hover{background:var(--primary-dark);transform:translateY(-1px)}.ms-title-bar{display:flex;align-items:center;background:var(--white);border-bottom:1px solid var(--gray-200);padding:var(--space-md) var(--space-md);min-height:60px;position:sticky;top:0;z-index:var(--z-canvas-status);box-shadow:0 1px 3px rgba(0,0,0,.1)}.ms-title-bar-content{display:flex;align-items:center;gap:var(--space-md);width:100%}.ms-title-bar-name{display:flex;align-items:center;flex:1;position:relative}.ms-title-bar-display{font-size:18px;font-weight:600;color:var(--gray-800);cursor:pointer;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);border:2px solid transparent;transition:all var(--transition-base);outline:none;min-width:200px}.ms-title-bar-display:hover{background-color:var(--gray-50);border-color:var(--gray-200)}.ms-title-bar-display:focus{background-color:var(--primary-pale);border-color:var(--primary);box-shadow:0 0 0 3px rgba(108,99,255,.1)}.ms-title-bar-edit{display:flex;flex-direction:column;gap:var(--space-sm);flex:1;max-width:400px}.ms-title-bar-input{font-size:18px;font-weight:600;color:var(--gray-800);background:var(--white);border:2px solid var(--primary);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);outline:none;transition:all var(--transition-base);box-shadow:0 0 0 3px rgba(108,99,255,.1)}.ms-title-bar-input:focus{border-color:var(--primary-dark);box-shadow:0 0 0 4px rgba(108,99,255,.15)}.ms-title-bar-input:disabled{opacity:.6;cursor:not-allowed}.ms-title-bar-input--error{border-color:var(--danger);box-shadow:0 0 0 3px rgba(239,68,68,.1)}.ms-title-bar-input--error:focus{border-color:var(--danger);box-shadow:0 0 0 4px rgba(239,68,68,.15)}.ms-title-bar-error{color:var(--danger);font-size:14px;font-weight:500;display:flex;align-items:center;gap:var(--space-sm)}.ms-title-bar-error:before{content:"⚠";font-size:16px}.ms-title-bar-saving{color:var(--gray-600);font-size:14px;display:flex;align-items:center;gap:var(--space-sm)}.ms-title-bar-spinner{width:16px;height:16px;border-top:2px solid var(--gray-300);border:2px solid var(--gray-300);border-top-color:var(--primary);border-radius:50%;animation:ms-spin 1s linear infinite}@keyframes ms-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ms-title-bar-hint{color:var(--gray-500);font-size:12px;font-style:italic;opacity:0;transition:opacity var(--transition-base)}.ms-title-bar:hover .ms-title-bar-hint{opacity:1}.ms-ribbon-btn--modern{background:transparent;border:none;border-radius:var(--radius-md,.5rem);color:var(--gray-700,#34495E);font-weight:500;transition:all var(--transition-normal,.2s ease-out) ease;position:relative;cursor:pointer;overflow:hidden}.ms-ribbon-btn--modern:hover{background:rgba(108,99,255,.1);color:var(--primary,#6C63FF);transform:translateY(-1px);box-shadow:var(--shadow-sm,0 1px 2px 0 rgba(0,0,0,.05))}.ms-ribbon-btn--modern:active{background:rgba(108,99,255,.15);color:var(--primary-dark,#5650DB);transform:translateY(0);box-shadow:inset 0 1px 2px 0 rgba(0,0,0,.1)}.ms-ribbon-btn--modern:focus{outline:2px solid var(--primary,#6C63FF);outline-offset:2px;background:rgba(108,99,255,.05)}.ms-ribbon-btn--modern:disabled{opacity:.5;cursor:not-allowed;transform:none}.ms-ribbon-btn--modern:disabled:hover{background:transparent;color:var(--gray-700,#34495E);transform:none;box-shadow:none}.ms-ribbon-btn--modern.ms-ribbon-btn--with-icon .text-gray-700{transition:all var(--transition-normal,.2s ease-out) ease}.ms-ribbon-btn--modern.ms-ribbon-btn--with-icon:hover .text-gray-700{color:var(--primary,#6C63FF)!important;transform:scale(1.05)}.ms-ribbon-btn--modern.ms-ribbon-btn--with-icon:active .text-gray-700{transform:scale(.95)}.ms-shell-panel{background:rgba(255,255,255,.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:2px 0 12px rgba(88,80,236,.04);z-index:2;display:flex;flex-direction:column;transition:width .3s ease,box-shadow .3s ease}.ms-shell-panel--left{width:220px;border-right:1px solid #e0e0e0}.ms-shell-panel--collapsed{width:60px;min-width:60px}.ms-shell-panel__header{padding:20px 20px 12px;font-weight:600;font-size:16px;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(224,224,224,.3)}.ms-shell-panel__content{flex:1;padding:8px 16px 16px}.ms-shell-panel--pinned{transform:translateX(0)}.ms-shell-panel--unpinned{transition:transform .3s ease}.ms-shell-panel--unpinned:not(.ms-shell-panel--visible){transform:translateX(-100%);pointer-events:none}.ms-shell-panel--visible{transform:translateX(0);pointer-events:auto}.ms-shell-panel--animating{transition:all .3s ease}.ms-canvas-interaction-safe{z-index:var(--z-content);pointer-events:auto}.ms-shell-panel__pin-btn{width:32px;height:32px;border:none;background:transparent;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;color:var(--gray-600);opacity:.7}.ms-shell-panel__pin-btn:hover{background:rgba(88,80,236,.1);color:var(--primary);opacity:1}.ms-shell-panel__header-content{display:flex;align-items:center;gap:8px;flex:1}@media (max-width:768px){.ms-title-bar{padding:var(--space-sm) var(--space-md);min-height:50px}.ms-title-bar-display,.ms-title-bar-input{font-size:16px}.ms-title-bar-hint{display:none}.ms-ribbon-btn--modern{min-width:40px;padding:var(--space-2,.5rem)}}.ms-shell-canvas{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;position:relative;overflow:visible!important;background:white}.ms-workspace{flex:1;position:relative;overflow:auto!important;overscroll-behavior:contain;background:white!important;scrollbar-width:thin;scrollbar-color:rgba(107,114,128,.8) transparent;scrollbar-gutter:stable both-edges}.ms-workspace::-webkit-scrollbar{width:12px;height:12px}.ms-workspace::-webkit-scrollbar-thumb{background-color:rgba(107,114,128,.75);border-radius:8px;border:3px solid transparent;background-clip:content-box}.ms-workspace::-webkit-scrollbar-thumb:hover{background-color:rgba(75,85,99,.9)}.ms-workspace::-webkit-scrollbar-corner,.ms-workspace::-webkit-scrollbar-track{background-color:transparent}.ms-canvas-container{position:relative;transform:translateZ(0);will-change:transform;display:block}.ms-canvas-wrapper{position:relative}.ms-canvas-position-wrapper{width:-moz-fit-content;width:fit-content;margin:0 auto;position:relative;background:white}.ms-canvas-position-wrapper>.MaskOverlay,.ms-canvas-position-wrapper>[class*=MaskOverlay]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.ms-shell-canvas-target{position:relative;background:transparent;border:none;border-radius:0;box-shadow:none;display:block;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;box-shadow:0 0 0 1px rgba(0,0,0,.08)!important}.ms-shell-canvas-target canvas{display:block;border-radius:0;box-shadow:none}.ms-canvas-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-6);background:rgba(255,255,255,.9);backdrop-filter:blur(2px);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);color:var(--neutral-dark-gray);font-size:.875rem;z-index:var(--z-shell)}.ms-canvas-overlay{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:var(--z-canvas-status)}.ms-canvas-overlay--interactive{pointer-events:auto}@media (max-width:768px){.ms-workspace{scrollbar-width:auto}.ms-workspace::-webkit-scrollbar{width:8px;height:8px}}.ms-shell-canvas-target:focus-visible{outline:2px solid var(--brand-primary);outline-offset:4px}#shell-canvas-target,.canvas-area,.canvas-container,.ms-canvas-centering-wrapper,.ms-canvas-container,.ms-canvas-wrapper,.ms-shell-canvas,.ms-shell-canvas-target,.ms-shell-canvas-target canvas,.ms-workspace{background:white!important;background-color:white!important}.ms-shell-main{display:flex!important;flex:1 1 auto!important;min-height:0!important;height:auto!important;overflow:hidden}.editor-main-content{padding-bottom:32px}.ms-workspace{margin-bottom:0!important;padding-bottom:0!important}