:root{--color-bg-primary: #0a0a0a;--color-bg-secondary: #1a1a1a;--color-bg-tertiary: #2a2a2a;--color-bg-widget: #1e1e1e;--color-text-primary: #ffffff;--color-text-secondary: #a0a0a0;--color-text-tertiary: #707070;--color-border: #2a2a2a;--color-border-hover: #3a3a3a;--color-accent: #3b82f6;--color-accent-hover: #2563eb;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--touch-target-min: 44px;--font-family-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-family-mono: ui-monospace, "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--transition-fast: .15s ease-in-out;--transition-base: .25s ease-in-out;--transition-slow: .35s ease-in-out;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .5);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .5);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .5);--grid-gap: 1rem;--grid-columns: 12}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;font-family:var(--font-family-sans);background-color:var(--color-bg-primary);color:var(--color-text-primary);min-height:100vh;overflow-x:hidden;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}input,textarea,[contenteditable]{-webkit-user-select:text;user-select:text}button{min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-sm) var(--spacing-md);font-family:inherit;font-size:var(--text-base);font-weight:500;border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-secondary);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}button:active{transform:scale(.98);background-color:var(--color-bg-tertiary)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background-color:var(--color-accent);border-color:var(--color-accent);color:#fff}button.primary:active{background-color:var(--color-accent-hover)}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;color:var(--color-text-primary)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl)}h5{font-size:var(--text-lg)}h6{font-size:var(--text-base)}p{line-height:1.6;color:var(--color-text-secondary)}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:active{color:var(--color-accent-hover)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-hover)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.container{width:100%;max-width:1920px;margin:0 auto;padding:0 var(--spacing-lg)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.widget-wrapper{background-color:var(--color-bg-widget);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);height:100%;display:flex;flex-direction:column;box-shadow:var(--shadow-md);transition:border-color var(--transition-fast)}.widget-wrapper:hover{border-color:var(--color-border-hover)}.widget-header{margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:1px solid var(--color-border)}.widget-title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin:0}.widget-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.widget-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--spacing-md);color:var(--color-text-secondary)}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-bg-tertiary);border-top-color:var(--color-accent);border-radius:50%;animation:spin 1s linear infinite}.widget-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--spacing-md);padding:var(--spacing-lg);text-align:center}.error-icon{font-size:var(--text-5xl);color:var(--color-error)}.error-message{color:var(--color-text-secondary);font-size:var(--text-sm);max-width:300px}.clock-widget{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;gap:var(--spacing-md)}.clock-time{font-size:var(--text-5xl);font-weight:700;color:var(--color-text-primary);font-variant-numeric:tabular-nums;line-height:1;letter-spacing:-.02em}.clock-date{font-size:var(--text-xl);color:var(--color-text-secondary);text-align:center;text-transform:capitalize}.clock-timezone{font-size:var(--text-sm);color:var(--color-text-tertiary, #888);text-align:center;margin-top:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}@media(min-width:768px){.clock-time{font-size:4rem}}@media(min-width:1024px){.clock-time{font-size:5rem}}.calendar-widget{display:flex;flex-direction:column;height:100%;overflow-y:auto}.calendar-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--color-text-secondary);font-size:var(--text-lg)}.calendar-event-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--spacing-md)}.calendar-event{display:flex;gap:var(--spacing-md);padding:var(--spacing-md);background-color:var(--color-bg-secondary);border-radius:var(--radius-md);border-left:3px solid var(--color-accent);transition:background-color var(--transition-fast);min-height:var(--touch-target-min)}.calendar-event:active{background-color:var(--color-bg-tertiary)}.event-time{flex-shrink:0;font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary);font-variant-numeric:tabular-nums;min-width:90px;padding-top:2px}.event-details{flex:1;display:flex;flex-direction:column;gap:var(--spacing-xs)}.event-title{font-size:var(--text-base);font-weight:500;color:var(--color-text-primary);line-height:1.3}.event-location{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--text-sm);color:var(--color-text-secondary)}.location-icon{font-size:var(--text-sm)}.calendar-widget{-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--color-bg-tertiary) var(--color-bg-secondary)}.calendar-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sm) 0;margin-bottom:var(--spacing-sm);border-bottom:1px solid var(--color-bg-tertiary)}.calendar-connected-badge{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--text-xs);color:var(--color-success, #22c55e);font-weight:500}.calendar-connected-badge:before{content:"";width:8px;height:8px;background:var(--color-success, #22c55e);border-radius:50%}.calendar-signout-btn{font-size:var(--text-xs);padding:var(--spacing-xs) var(--spacing-sm);background:transparent;border:1px solid var(--color-bg-tertiary);color:var(--color-text-secondary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.calendar-signout-btn:hover{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.calendar-auth-prompt{text-align:center;padding:var(--spacing-md);margin-top:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md)}.calendar-auth-prompt p{margin:0 0 var(--spacing-md);color:var(--color-text-secondary);font-size:var(--text-sm)}.calendar-auth-btn{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-accent);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast);min-height:var(--touch-target-min)}.calendar-auth-btn:hover{filter:brightness(1.1)}.calendar-demo-hint,.calendar-setup-hint,.calendar-privacy-hint{font-size:var(--text-xs);color:var(--color-text-tertiary, #666);margin-top:var(--spacing-sm)}.calendar-privacy-hint{font-style:italic}.calendar-loading{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-lg);color:var(--color-text-secondary)}.calendar-spinner{width:16px;height:16px;border:2px solid var(--color-bg-tertiary);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}.calendar-error{text-align:center;padding:var(--spacing-md);background:var(--color-error-bg, rgba(239, 68, 68, .1));border-radius:var(--radius-md);color:var(--color-error, #ef4444)}.calendar-error button{margin-top:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-md);background:var(--color-error, #ef4444);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer}.dynamic-clock-widget{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;padding:8px;box-sizing:border-box;position:relative;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif}.dynamic-clock-size-indicator{position:absolute;top:4px;right:4px;font-size:10px;color:var(--text-secondary, #888);opacity:.5;text-transform:uppercase}.dynamic-clock-tiny{display:flex;align-items:center;justify-content:center}.dynamic-clock-time-tiny{font-size:1.2rem;font-weight:600;color:var(--text-primary, #fff)}.dynamic-clock-small{display:flex;align-items:center;justify-content:center}.dynamic-clock-time-small{font-size:1.5rem;font-weight:600;color:var(--text-primary, #fff)}.dynamic-clock-medium{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.dynamic-clock-time-medium{font-size:2rem;font-weight:600;color:var(--text-primary, #fff)}.dynamic-clock-date-short{font-size:.9rem;color:var(--text-secondary, #aaa)}.dynamic-clock-large{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.dynamic-clock-time-large{font-size:2.5rem;font-weight:700;color:var(--text-primary, #fff)}.dynamic-clock-date-medium{font-size:1rem;color:var(--text-secondary, #aaa)}.dynamic-clock-timezone{font-size:.75rem;color:var(--text-tertiary, #666);opacity:.7}.dynamic-clock-xlarge{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:24px;width:100%;height:100%}.dynamic-clock-analog{flex-shrink:0}.dynamic-clock-digital{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.dynamic-clock-time-xlarge{font-size:3rem;font-weight:700;color:var(--text-primary, #fff)}.dynamic-clock-date-long{font-size:1.1rem;color:var(--text-secondary, #aaa)}.dynamic-clock-timezone-full{font-size:.85rem;color:var(--text-tertiary, #666);opacity:.7}.analog-clock{position:relative;width:120px;height:120px;border-radius:50%;background:var(--widget-bg-secondary, #2a2a2a);border:3px solid var(--border-color, #444)}.analog-clock-face{position:absolute;width:100%;height:100%}.analog-clock-mark{position:absolute;left:50%;top:4px;width:2px;height:8px;background:var(--text-secondary, #888);transform-origin:50% 56px;margin-left:-1px}.analog-clock-mark:nth-child(3n){height:12px;width:3px;background:var(--text-primary, #fff);margin-left:-1.5px}.analog-clock-hand{position:absolute;left:50%;bottom:50%;transform-origin:50% 100%;border-radius:2px}.analog-clock-hand.hour{width:4px;height:30px;background:var(--text-primary, #fff);margin-left:-2px}.analog-clock-hand.minute{width:3px;height:42px;background:var(--text-primary, #fff);margin-left:-1.5px}.analog-clock-hand.second{width:1px;height:48px;background:var(--accent-color, #3b82f6);margin-left:-.5px}.analog-clock-center{position:absolute;left:50%;top:50%;width:10px;height:10px;background:var(--accent-color, #3b82f6);border-radius:50%;transform:translate(-50%,-50%)}.size-tiny .analog-clock{width:60px;height:60px}.size-small .analog-clock{width:80px;height:80px}.size-medium .analog-clock{width:100px;height:100px}.size-large .analog-clock{width:110px;height:110px}.photo-slideshow-widget{position:relative;width:100%;height:100%;overflow:hidden;background:var(--color-bg-tertiary);border-radius:var(--radius-md)}.photo-container{position:relative;width:100%;height:100%}.photo-image{width:100%;height:100%;object-fit:cover;animation:fadeIn .5s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.photo-title-overlay{position:absolute;bottom:40px;left:0;right:0;padding:var(--spacing-sm) var(--spacing-md);background:linear-gradient(transparent,#000000b3);color:#fff;font-size:var(--text-sm);text-align:center;pointer-events:none}.photo-nav{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 var(--spacing-sm);opacity:0;transition:opacity var(--transition-fast);pointer-events:none}.photo-slideshow-widget:hover .photo-nav{opacity:1;pointer-events:auto}.photo-nav-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#00000080;color:#fff;border:none;border-radius:50%;font-size:24px;cursor:pointer;transition:all var(--transition-fast);min-height:var(--touch-target-min);min-width:var(--touch-target-min)}.photo-nav-btn:hover{background:#000c;transform:scale(1.1)}.photo-indicators{position:absolute;bottom:var(--spacing-sm);left:50%;transform:translate(-50%);display:flex;gap:var(--spacing-xs)}.photo-indicator{width:8px;height:8px;background:#ffffff80;border:none;border-radius:50%;cursor:pointer;padding:0;transition:all var(--transition-fast)}.photo-indicator.active{background:#fff;transform:scale(1.2)}.photo-indicator:hover{background:#fffc}.photo-auth-prompt{position:absolute;bottom:var(--spacing-md);left:50%;transform:translate(-50%);text-align:center;background:#000000b3;padding:var(--spacing-md);border-radius:var(--radius-md);z-index:10}.photo-auth-prompt p{margin:0 0 var(--spacing-sm);color:#fff;font-size:var(--text-sm)}.photo-auth-btn{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-accent);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast);min-height:var(--touch-target-min)}.photo-auth-btn:hover{filter:brightness(1.1)}.photo-demo-hint,.photo-setup-hint,.photo-privacy-hint{font-size:var(--text-xs);color:#fff9;margin-top:var(--spacing-xs)}.photo-privacy-hint{font-style:italic}.photo-signout-btn{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);font-size:var(--text-xs);padding:var(--spacing-xs) var(--spacing-sm);background:#00000080;color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;opacity:0;transition:all var(--transition-fast);z-index:10}.photo-slideshow-widget:hover .photo-signout-btn{opacity:1}.photo-signout-btn:hover{background:#000c}.photo-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.photo-spinner{width:32px;height:32px;border:3px solid var(--color-bg-tertiary);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}.photo-error-notice{position:absolute;top:var(--spacing-sm);left:50%;transform:translate(-50%);padding:var(--spacing-xs) var(--spacing-md);background:#000000b3;color:#fffc;font-size:var(--text-xs);border-radius:var(--radius-md);z-index:15;max-width:90%;text-align:center;display:flex;align-items:center;gap:var(--spacing-sm)}.photo-error-link{color:var(--color-accent);text-decoration:underline;cursor:pointer}.photo-error-link:hover{color:#fff}.photo-controls{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);display:flex;gap:var(--spacing-xs);opacity:0;transition:opacity var(--transition-fast);z-index:10}.photo-slideshow-widget:hover .photo-controls{opacity:1}.photo-control-btn{font-size:var(--text-xs);padding:var(--spacing-xs) var(--spacing-sm);background:#00000080;color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.photo-control-btn:hover{background:#000c}.photo-control-btn.danger:hover{background:#dc2626cc}.photo-picking-hint{font-size:var(--text-sm);color:#fff;margin-top:var(--spacing-sm)}.weather-widget{display:flex;flex-direction:column;height:100%;padding:12px;gap:8px}.weather-loading{display:flex;align-items:center;justify-content:center}.weather-loading-text{color:#ffffff80;font-size:.9rem}.weather-header{display:flex;justify-content:space-between;align-items:flex-start;flex-shrink:0}.weather-current{display:flex;flex-direction:column;gap:2px}.weather-temp-current{font-size:2rem;font-weight:600;color:#fff;line-height:1}.weather-feels-like{font-size:.8rem;color:#ffffff80}.weather-location{display:flex;align-items:center;gap:8px;font-size:.9rem;color:#ffffffb3}.weather-demo-badge{font-size:.7rem;padding:2px 6px;background:#fbbf2433;color:#fbbf24;border-radius:4px;text-transform:uppercase;font-weight:600}.weather-icon-current{font-size:1.5rem}.weather-graph{flex:1;min-height:60px;position:relative}.weather-temp-graph{width:100%;height:100%}.weather-graph-label{font-size:11px;font-weight:600;fill:#fff}.weather-graph-label.max{fill:#ef4444}.weather-graph-label.min{fill:#3b82f6}.weather-timeline{display:flex;flex-direction:column;gap:4px;flex-shrink:0}.weather-time-labels{display:flex;justify-content:space-between;padding:0 4px}.weather-time-label{font-size:.7rem;color:#fff6;font-variant-numeric:tabular-nums}.weather-icons-row{display:flex;justify-content:space-between;padding:0 4px}.weather-icon-small{font-size:1rem}.weather-widget.size-compact{padding:8px;gap:4px}.weather-widget.size-compact .weather-temp-current{font-size:1.5rem}.weather-widget.size-compact .weather-location{font-size:.75rem}.weather-widget.size-compact .weather-icon-current{font-size:1.2rem}.weather-widget.size-medium{padding:12px;gap:8px}.weather-widget.size-medium .weather-temp-current{font-size:1.75rem}.weather-widget.size-large{padding:16px;gap:12px}.weather-widget.size-large .weather-temp-current{font-size:2.5rem}.weather-widget.size-large .weather-feels-like{font-size:.9rem}.weather-widget.size-large .weather-location{font-size:1rem}.weather-widget.size-large .weather-icon-current{font-size:2rem}.weather-widget.size-large .weather-time-label{font-size:.8rem}.weather-widget.size-large .weather-icon-small{font-size:1.25rem}.weather-widget.size-large .weather-graph-label{font-size:13px}.clock-settings-form{display:flex;flex-direction:column;gap:var(--spacing-lg)}.settings-section{display:flex;flex-direction:column;gap:var(--spacing-sm)}.settings-label{font-size:var(--text-sm);font-weight:500;color:var(--color-text-primary)}.settings-input,.settings-select{min-height:48px;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--text-base);color:var(--color-text-primary);background-color:var(--color-bg-tertiary);border:2px solid var(--color-border);border-radius:var(--radius-md);transition:all .2s ease}.settings-input:focus,.settings-select:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #3b82f61a}.settings-checkbox-label{display:flex;align-items:center;gap:var(--spacing-md);font-size:var(--text-base);color:var(--color-text-primary);cursor:pointer;padding:var(--spacing-sm) 0}.settings-checkbox{min-width:24px;min-height:24px;width:24px;height:24px;cursor:pointer;accent-color:var(--color-accent)}.settings-hint{font-size:var(--text-xs);color:var(--color-text-secondary);margin:4px 0 0}.settings-actions{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border)}.settings-btn-primary,.settings-btn-secondary{min-height:48px;flex:1;padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--text-base);font-weight:500;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;border:2px solid}.settings-btn-primary{background-color:var(--color-accent);color:var(--color-bg-primary);border-color:var(--color-accent)}.settings-btn-primary:hover{opacity:.9;transform:translateY(-1px);box-shadow:var(--shadow-md)}.settings-btn-secondary{background-color:transparent;color:var(--color-text-primary);border-color:var(--color-border)}.settings-btn-secondary:hover{background-color:var(--color-bg-hover);border-color:var(--color-accent)}.settings-btn-primary:active,.settings-btn-secondary:active{transform:translateY(0)}.settings-modal-backdrop{position:fixed;inset:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-xl)}.settings-modal{background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);width:100%;max-width:600px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.settings-modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-xl);border-bottom:1px solid var(--color-border);flex-shrink:0}.settings-modal-title{font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary);margin:0}.settings-modal-close{min-width:44px;min-height:44px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--color-text-secondary);background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.settings-modal-close:hover{background-color:var(--color-bg-hover);color:var(--color-text-primary)}.settings-modal-content{padding:var(--spacing-xl);overflow-y:auto;flex:1}.settings-placeholder{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-secondary)}.widget-container{position:relative;width:100%;height:100%;transition:all .2s ease}.widget-controls{position:absolute;top:8px;right:8px;display:flex;gap:8px;z-index:100;opacity:0;transition:opacity .2s ease;pointer-events:none}.widget-container.edit-mode .widget-controls{opacity:1;pointer-events:auto}.widget-control-btn{min-width:44px;min-height:44px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:20px;background-color:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-md)}.widget-control-btn:hover{transform:scale(1.05);box-shadow:var(--shadow-lg)}.widget-control-btn:active{transform:scale(.95)}.settings-btn{color:var(--color-text-primary)}.settings-btn:hover{background-color:var(--color-accent);border-color:var(--color-accent);color:var(--color-bg-primary)}.delete-btn{color:#ef4444}.delete-btn:hover{background-color:#ef4444;border-color:#ef4444;color:#fff}.react-grid-layout{position:relative;transition:height .2s ease}.react-grid-item img{pointer-events:none;-webkit-user-select:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform,width,height}.react-grid-item.resizing{transition:none;z-index:1;will-change:width,height}.react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{background:red;opacity:.2;transition-duration:.1s;z-index:2;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.react-grid-item.react-grid-placeholder.placeholder-resizing{transition:none}.react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}.react-grid-item>.react-resizable-handle:after{content:"";position:absolute;right:3px;bottom:3px;width:5px;height:5px;border-right:2px solid rgba(0,0,0,.4);border-bottom:2px solid rgba(0,0,0,.4)}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.widget-grid-container{width:100%;height:100%;overflow:auto}.widget-grid{position:relative}.widget-grid-item{display:flex;overflow:hidden}.react-grid-item{transition:all .2s ease;transition-property:left,top,width,height}.react-grid-item.resizing,.react-grid-item.react-draggable-dragging{transition:none;z-index:100}.react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px;bottom:0;right:0;cursor:se-resize}.react-grid-item>.react-resizable-handle:after{content:"";position:absolute;right:3px;bottom:3px;width:10px;height:10px;border-right:2px solid var(--color-border);border-bottom:2px solid var(--color-border)}.dashboard.edit-mode .react-grid-item{cursor:move}.dashboard.edit-mode .react-grid-item:hover{box-shadow:0 0 0 2px var(--color-accent)}.dashboard.edit-mode .react-grid-item>.react-resizable-handle:after{border-color:var(--color-accent)}@media(max-width:768px){.widget-grid{grid-template-columns:repeat(6,1fr);gap:var(--spacing-md);padding:var(--spacing-md)}}@media(max-width:480px){.widget-grid{grid-template-columns:repeat(4,1fr);gap:var(--spacing-sm);padding:var(--spacing-sm)}}@media(min-width:1920px){.widget-grid{grid-auto-rows:minmax(150px,auto);gap:var(--spacing-xl)}}.widget-picker-backdrop{position:fixed;inset:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-xl)}.widget-picker-modal{background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);width:100%;max-width:800px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.widget-picker-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-xl);border-bottom:1px solid var(--color-border);flex-shrink:0}.widget-picker-title{font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary);margin:0}.widget-picker-close{min-width:44px;min-height:44px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--color-text-secondary);background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.widget-picker-close:hover{background-color:var(--color-bg-hover);color:var(--color-text-primary)}.widget-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--spacing-lg);padding:var(--spacing-xl);overflow-y:auto}.widget-picker-card{min-height:180px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-lg);background-color:var(--color-bg-tertiary);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.widget-picker-card:hover{border-color:var(--color-accent);background-color:var(--color-bg-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.widget-picker-card:active{transform:translateY(0)}.widget-picker-card-icon{font-size:48px;margin-bottom:var(--spacing-md)}.widget-picker-card-title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin:0 0 var(--spacing-sm) 0}.widget-picker-card-description{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0}@media(max-width:768px){.widget-picker-grid{grid-template-columns:1fr}}.account-settings-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.account-settings-panel{background:#1e1e2e;border-radius:16px;width:90%;max-width:480px;max-height:90vh;overflow-y:auto;box-shadow:0 8px 32px #0006;border:1px solid rgba(255,255,255,.1)}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.1)}.settings-header h2{margin:0;font-size:1.25rem;color:#fff}.close-btn{background:none;border:none;color:#ffffff80;font-size:1.75rem;cursor:pointer;padding:0;line-height:1;transition:color .2s}.close-btn:hover{color:#fff}.settings-content{padding:24px}.settings-section{margin-bottom:32px}.settings-section:last-child{margin-bottom:0}.settings-section h3{margin:0 0 12px;font-size:.9rem;font-weight:600;color:#ffffff80;text-transform:uppercase;letter-spacing:.05em}.section-description{color:#fff9;font-size:.9rem;margin:0 0 16px;line-height:1.5}.user-info{display:flex;align-items:center;gap:16px;padding:16px;background:#ffffff0d;border-radius:12px}.user-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:600;color:#fff}.user-details{flex:1}.user-name{font-weight:600;color:#fff;margin-bottom:4px}.user-email{font-size:.85rem;color:#ffffff80}.no-user{color:#ffffff80;font-style:italic}.connection-status{padding:16px;border-radius:12px;background:#ffffff0d}.status-indicator{display:flex;align-items:center;gap:8px;font-weight:600;margin-bottom:8px}.status-dot{width:10px;height:10px;border-radius:50%}.connected .status-dot{background:#10b981;box-shadow:0 0 8px #10b98180}.connected .status-indicator{color:#10b981}.disconnected .status-dot{background:#ffffff4d}.disconnected .status-indicator{color:#ffffffb3}.status-info{color:#ffffff80;font-size:.85rem;margin:0 0 16px;line-height:1.5}.privacy-info{color:#fff6;font-size:.8rem;font-style:italic;margin:0 0 16px;line-height:1.4}.not-configured code{background:#ffffff1a;padding:2px 6px;border-radius:4px;font-family:monospace;font-size:.85em}.connect-btn,.disconnect-btn{width:100%;padding:12px 20px;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;border:none}.connect-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.connect-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.disconnect-btn{background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.disconnect-btn:hover{background:#ef444433}.loading-state{color:#ffffff80;font-style:italic;padding:16px;text-align:center}.settings-actions{padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.logout-btn{width:100%;padding:12px 20px;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;background:#ffffff0d;color:#ffffffb3;border:1px solid rgba(255,255,255,.1)}.logout-btn:hover{background:#ffffff1a;color:#fff}.location-current{display:flex;align-items:center;justify-content:space-between;padding:16px;background:#ffffff0d;border-radius:12px}.location-info{display:flex;flex-direction:column;gap:4px}.location-name{font-weight:600;color:#fff}.location-coords{font-size:.8rem;color:#ffffff80;font-variant-numeric:tabular-nums}.location-clear-btn{padding:8px 16px;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.location-clear-btn:hover{background:#ef444433}.location-search-container{display:flex;flex-direction:column;gap:12px}.location-input-wrapper{position:relative}.location-search-input{width:100%;padding:12px 16px;border-radius:8px;font-size:.95rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff;transition:border-color .2s}.location-search-input::placeholder{color:#fff6}.location-search-input:focus{outline:none;border-color:#3b82f680}.location-searching{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:.8rem;color:#ffffff80}.location-results{list-style:none;margin:0;padding:0;background:#ffffff0d;border-radius:8px;overflow:hidden}.location-results li{border-bottom:1px solid rgba(255,255,255,.05)}.location-results li:last-child{border-bottom:none}.location-result-btn{width:100%;padding:12px 16px;text-align:left;background:none;border:none;color:#fff;cursor:pointer;transition:background .2s;display:flex;flex-direction:column;gap:2px}.location-result-btn:hover{background:#ffffff0d}.location-result-name{font-weight:500}.location-result-region{font-size:.8rem;color:#ffffff80}.location-gps-btn{width:100%;padding:12px 20px;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;background:#ffffff0d;color:#ffffffb3;border:1px solid rgba(255,255,255,.1)}.location-gps-btn:hover:not(:disabled){background:#ffffff1a;color:#fff}.location-gps-btn:disabled{cursor:not-allowed;opacity:.6}.dashboard{width:100vw;height:100vh;background-color:var(--color-bg-primary);overflow:hidden;display:flex;flex-direction:column}.dashboard-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg) var(--spacing-xl);background-color:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);flex-shrink:0}.dashboard-title{font-size:var(--text-2xl);font-weight:600;color:var(--color-text-primary);margin:0}.dashboard-actions{display:flex;gap:var(--spacing-md);align-items:center}.add-widget-btn,.edit-mode-toggle{min-width:88px;min-height:44px;padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--text-base);font-weight:500;color:var(--color-text-primary);background-color:var(--color-bg-tertiary);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.add-widget-btn:hover,.edit-mode-toggle:hover{background-color:var(--color-bg-hover);border-color:var(--color-accent)}.add-widget-btn{background-color:var(--color-accent);color:var(--color-bg-primary);border-color:var(--color-accent)}.add-widget-btn:hover{opacity:.9}.edit-mode-toggle.active{background-color:var(--color-accent);color:var(--color-bg-primary);border-color:var(--color-accent)}.add-widget-btn:active,.edit-mode-toggle:active,.reset-btn:active{transform:scale(.98)}.reset-btn{min-height:44px;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--text-sm);font-weight:500;color:var(--color-text-secondary);background-color:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.reset-btn:hover{color:var(--color-error, #ef4444);border-color:var(--color-error, #ef4444);background-color:#ef44441a}.dashboard-container{width:100%;height:100%;flex:1;overflow:auto;display:flex;flex-direction:column}.dashboard-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--spacing-md);text-align:center;padding:var(--spacing-2xl)}.dashboard-empty h2{font-size:var(--text-3xl);color:var(--color-text-primary);margin:0}.dashboard-empty p{font-size:var(--text-lg);color:var(--color-text-secondary);margin:0}.dashboard.edit-mode .widget-wrapper{cursor:move}.dashboard.edit-mode .widget-wrapper:hover{border-color:var(--color-accent);box-shadow:var(--shadow-lg)}.settings-btn{width:44px;height:44px;padding:0;font-size:var(--text-base);font-weight:600;color:var(--color-bg-primary);background:linear-gradient(135deg,var(--color-accent) 0%,#2563eb 100%);border:2px solid transparent;border-radius:50%;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.settings-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px #3b82f64d}.settings-btn:active{transform:scale(.98)}.pairing-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);z-index:1000}.pairing-card{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:48px;text-align:center;max-width:480px;width:90%;box-shadow:0 8px 32px #0000004d;border:1px solid rgba(255,255,255,.1)}.pairing-card h1{color:#fff;font-size:2rem;margin:0 0 16px;font-weight:600}.pairing-card h2{color:#fff;font-size:1.5rem;margin:16px 0;font-weight:600}.pairing-card p{color:#ffffffb3;margin:0;line-height:1.5}.pairing-instructions{font-size:1.1rem;margin-bottom:32px!important}.qr-container{background:#fff;padding:16px;border-radius:16px;display:inline-block;margin:24px 0}.qr-code{width:256px;height:256px;display:block}.pairing-code{display:flex;flex-direction:column;gap:8px;margin:24px 0}.code-label{color:#ffffff80;font-size:.9rem}.code-value{font-family:SF Mono,Fira Code,monospace;font-size:2rem;font-weight:700;letter-spacing:.3em;color:#fff;background:#ffffff1a;padding:12px 24px;border-radius:12px;display:inline-block}.pairing-timer{margin:16px 0;font-size:.9rem;color:#ffffff80}.pairing-timer .warning{color:#f59e0b;font-weight:600}.pairing-actions{display:flex;gap:12px;justify-content:center;margin-top:24px}.pairing-btn{padding:12px 32px;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.pairing-btn.primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.pairing-btn.primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.pairing-btn.secondary{background:#ffffff1a;color:#ffffffb3}.pairing-btn.secondary:hover{background:#ffffff26;color:#fff}.pairing-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;margin:0 auto 24px;background:#ffffff1a;color:#ffffffb3}.pairing-icon.success{background:#10b98133;color:#10b981}.pairing-error .pairing-icon{background:#ef444433;color:#ef4444}.pairing-expired .pairing-icon{background:#f59e0b33;color:#f59e0b}.pairing-spinner{width:48px;height:48px;border:3px solid rgba(255,255,255,.1);border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 24px}@media(max-width:480px){.pairing-card{padding:32px 24px}.pairing-card h1{font-size:1.5rem}.qr-code{width:200px;height:200px}.code-value{font-size:1.5rem;letter-spacing:.2em}}.pairing-confirm{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);padding:24px}.confirm-card{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:48px;text-align:center;max-width:440px;width:100%;box-shadow:0 8px 32px #0000004d;border:1px solid rgba(255,255,255,.1)}.confirm-card h2{color:#fff;font-size:1.75rem;margin:0 0 16px;font-weight:600}.confirm-card p{color:#ffffffb3;margin:0 0 24px;line-height:1.5}.confirm-form{text-align:left;margin-bottom:24px}.confirm-form label{display:block;color:#ffffffb3;font-size:.9rem;margin-bottom:8px}.confirm-form input{width:100%;padding:14px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#fff;font-size:1rem;transition:all .2s ease}.confirm-form input:focus{outline:none;border-color:#3b82f6;background:#ffffff1a}.confirm-form input::placeholder{color:#ffffff4d}.confirm-error{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:12px 16px;border-radius:12px;margin-bottom:24px;font-size:.9rem}.confirm-actions{display:flex;flex-direction:column;gap:12px}.confirm-btn{padding:14px 32px;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;width:100%}.confirm-btn.primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.confirm-btn.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.confirm-btn.primary:disabled{opacity:.5;cursor:not-allowed}.confirm-btn.secondary{background:#ffffff1a;color:#ffffffb3}.confirm-btn.secondary:hover:not(:disabled){background:#ffffff26;color:#fff}.confirm-success .confirm-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;margin:0 auto 24px;background:#10b98133;color:#10b981}.pairing-code-display{background:#ffffff1a;padding:12px 16px;border-radius:12px;font-family:SF Mono,Fira Code,monospace}.pairing-code-display strong{color:#fff;letter-spacing:.2em}@media(max-width:480px){.confirm-card{padding:32px 24px}.confirm-card h2{font-size:1.5rem}}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);padding:24px}.login-card{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:48px;max-width:400px;width:100%;box-shadow:0 8px 32px #0000004d;border:1px solid rgba(255,255,255,.1)}.login-header{text-align:center;margin-bottom:32px}.login-header h1{color:#fff;font-size:1.75rem;margin:0 0 8px;font-weight:600}.login-header p{color:#fff9;margin:0}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{color:#ffffffb3;font-size:.9rem;font-weight:500}.form-group input{padding:14px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:#fff;font-size:1rem;transition:all .2s ease}.form-group input:focus{outline:none;border-color:#3b82f6;background:#ffffff1a}.form-group input::placeholder{color:#ffffff4d}.login-error{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:12px 16px;border-radius:12px;font-size:.9rem;text-align:center}.login-btn{padding:14px 32px;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;margin-top:8px}.login-btn.primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.login-btn.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.login-btn.primary:disabled{opacity:.6;cursor:not-allowed}.login-footer{margin-top:24px;text-align:center;display:flex;flex-direction:column;gap:12px}.login-link{background:none;border:none;color:#3b82f6;cursor:pointer;font-size:.9rem;padding:8px;transition:color .2s ease}.login-link:hover{color:#60a5fa;text-decoration:underline}.login-link.pairing-link{color:#ffffff80}.login-link.pairing-link:hover{color:#fffc}.demo-credentials{margin-top:32px;padding:24px 16px 16px;border-top:1px solid rgba(255,255,255,.1);text-align:center;background:none;border-left:none;border-right:none;border-bottom:none;width:100%;cursor:pointer;border-radius:0 0 12px 12px;transition:background .2s ease}.demo-credentials:hover{background:#ffffff0d}.demo-credentials p{color:#fff6;font-size:.8rem;margin:0 0 8px}.demo-credentials code{background:#ffffff1a;padding:8px 16px;border-radius:8px;font-size:.85rem;color:#ffffffb3;display:inline-block;transition:all .2s ease}.demo-credentials:hover code{background:#3b82f633;color:#60a5fa}@media(max-width:480px){.login-card{padding:32px 24px}.login-header h1{font-size:1.5rem}}.app{width:100vw;height:100vh;overflow:hidden}#root{width:100%;height:100%;margin:0;padding:0}.loading-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);color:#ffffffb3;gap:16px}.loading-spinner{width:48px;height:48px;border:3px solid rgba(255,255,255,.1);border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.unpaired-options{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);padding:24px;text-align:center}.unpaired-options h1{color:#fff;font-size:2rem;margin:0 0 12px;font-weight:600}.unpaired-options>p{color:#fff9;margin:0 0 48px;font-size:1.1rem}.option-buttons{display:flex;gap:24px;flex-wrap:wrap;justify-content:center}.option-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:32px 48px;border-radius:20px;font-size:1.25rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;min-width:240px}.option-btn span{font-size:.85rem;font-weight:400;opacity:.7}.option-btn.primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.option-btn.primary:hover{transform:translateY(-4px);box-shadow:0 8px 24px #3b82f666}.option-btn.secondary{background:#ffffff0d;color:#fff;border:1px solid rgba(255,255,255,.1)}.option-btn.secondary:hover{background:#ffffff1a;transform:translateY(-4px)}@media(max-width:600px){.option-buttons{flex-direction:column}.option-btn{min-width:200px;padding:24px 32px}.unpaired-options h1{font-size:1.5rem}}