:root{--primary-50:#ecfdf5;--primary-100:#d1fae5;--primary-500:#10b981;--primary-600:#059669;--primary-700:#047857;--surface-0:#fff;--surface-50:#f8fafc;--surface-100:#f1f5f9;--surface-200:#e2e8f0;--surface-800:#1e293b;--surface-900:#0f172a;--surface-950:#020617}@layer base{html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;-webkit-tap-highlight-color:transparent;overflow-x:hidden}body{font-family:var(--font-body);background-color:var(--surface-0);color:var(--surface-800);font-feature-settings:"cv02", "cv03", "cv04", "cv11";overflow-x:hidden}::selection{color:inherit;background-color:#10b98126}}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#d4d4d8;border-radius:100px}::-webkit-scrollbar-thumb:hover{background:#a1a1aa}@layer utilities{.animate-in{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.2s;animation-fill-mode:forwards}.animate-out{--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial;animation-name:exit;animation-duration:.2s;animation-fill-mode:forwards}.fade-in-0{--tw-enter-opacity:0}.fade-out-0{--tw-exit-opacity:0}.zoom-in-95{--tw-enter-scale:.95}.zoom-out-95{--tw-exit-scale:.95}.slide-in-from-top-2{--tw-enter-translate-y:-.5rem}.slide-in-from-bottom-2{--tw-enter-translate-y:.5rem}.slide-in-from-left-2{--tw-enter-translate-x:-.5rem}.slide-in-from-right-2{--tw-enter-translate-x:.5rem}.slide-in-from-left-1\/2{--tw-enter-translate-x:-50%}.slide-in-from-top-\[48\%\]{--tw-enter-translate-y:-48%}.slide-out-to-left-1\/2{--tw-exit-translate-x:-50%}.slide-out-to-top-\[48\%\]{--tw-exit-translate-y:-48%}.bg-grain{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E")}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0), var(--tw-enter-translate-y,0), 0) scale3d(var(--tw-enter-scale,1), var(--tw-enter-scale,1), var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0) scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}@keyframes slide-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}@keyframes float-badge{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes play-ring{0%{opacity:.5;transform:scale(1)}to{opacity:0;transform:scale(2.2)}}@keyframes shimmer{0%,to{opacity:1}50%{opacity:.7}}.annotation-highlight{animation:1.5s ease-in-out infinite pulse-highlight;outline-offset:2px!important;outline:3px solid #10b981!important}@keyframes pulse-highlight{0%,to{outline-color:#10b981}50%{outline-color:#10b98166}}.focus-ring:focus{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px #10b981}.annotation-pin{cursor:pointer;z-index:10;background:linear-gradient(135deg,#10b981,#059669);border:2.5px solid #fff;border-radius:50%;outline:none;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s;display:flex;position:absolute;transform:translate(-50%,-100%);box-shadow:0 2px 8px #10b98159,0 1px 3px #0000001a}.annotation-pin:hover{transform:translate(-50%,-100%)scale(1.15);box-shadow:0 4px 14px #10b98173,0 2px 4px #00000026}.annotation-pin--active{background:linear-gradient(135deg,#059669,#047857);transform:translate(-50%,-100%)scale(1.2);box-shadow:0 0 0 3px #10b98133,0 4px 14px #10b98173}.annotation-pin__icon{color:#fff6;width:14px;height:14px;position:absolute}.annotation-pin__number{color:#fff;font-size:11px;font-weight:700;line-height:1;font-family:var(--font-body);-webkit-user-select:none;user-select:none;z-index:1;position:relative}.annotation-pin__pulse{pointer-events:none;border:2px solid #10b98180;border-radius:50%;animation:2s ease-in-out infinite pin-pulse;position:absolute;inset:-6px}@keyframes pin-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:0;transform:scale(1.4)}}.annotation-click-overlay{z-index:5;cursor:crosshair;background:0 0;position:absolute;inset:0}.annotation-click-overlay:after{content:"";border-radius:inherit;pointer-events:none;border:2px solid #10b98180;animation:1.5s ease-in-out infinite overlay-border-pulse;position:absolute;inset:0}@keyframes overlay-border-pulse{0%,to{border-color:#10b98180}50%{border-color:#10b98133}}.annotation-card--active{border-color:#10b981!important;box-shadow:0 0 0 2px #10b9811a,0 4px 12px #10b98114!important}.pin-placement-badge{color:#047857;background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1px solid #a7f3d0;border-radius:8px;align-items:center;gap:6px;padding:5px 10px;font-size:12px;font-weight:600;display:inline-flex}