.grid-canvas-container[data-v-2c9f0077]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;padding:clamp(.5rem,2vw,1rem)}.grid-canvas[data-v-2c9f0077]{border:1px solid var(--gp-border, #e5e7eb);border-radius:8px;background:white;max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 4px 12px #00000014;transition:box-shadow .2s ease}.grid-canvas[data-v-2c9f0077]:hover{box-shadow:0 8px 20px #0000001f}@media (max-width: 768px){.grid-canvas-container[data-v-2c9f0077]{padding:.5rem}.grid-canvas[data-v-2c9f0077]{border-radius:6px}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.grid-canvas[data-v-2c9f0077]{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}:root{--gp-primary-50: #faf5ff;--gp-primary-100: #f3e8ff;--gp-primary-200: #e9d5ff;--gp-primary-300: #d8b4fe;--gp-primary-400: #c084fc;--gp-primary-500: #9333ea;--gp-primary-600: #7c3aed;--gp-primary-700: #6b21a8;--gp-primary-800: #581c87;--gp-primary-900: #4c1d95;--gp-neutral-50: #fafafa;--gp-neutral-100: #f4f4f5;--gp-neutral-200: #e4e4e7;--gp-neutral-300: #d4d4d8;--gp-neutral-400: #a1a1aa;--gp-neutral-500: #71717a;--gp-neutral-600: #52525b;--gp-neutral-700: #3f3f46;--gp-neutral-800: #27272a;--gp-neutral-900: #18181b;--gp-success-50: #f0fdf4;--gp-success-500: #22c55e;--gp-success-600: #16a34a;--gp-warning-50: #fffbeb;--gp-warning-500: #f59e0b;--gp-warning-600: #d97706;--gp-error-50: #fef2f2;--gp-error-500: #ef4444;--gp-error-600: #dc2626;--gp-info-50: #eff6ff;--gp-info-500: #3b82f6;--gp-info-600: #2563eb;--gp-background: #ffffff;--gp-surface: #ffffff;--gp-surface-elevated: #fafafa;--gp-surface-hover: #f4f4f5;--gp-surface-pressed: #e4e4e7;--gp-text-primary: #18181b;--gp-text-secondary: #3f3f46;--gp-text-tertiary: #71717a;--gp-text-quaternary: #a1a1aa;--gp-text-inverse: #ffffff;--gp-text-on-primary: #ffffff;--gp-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--gp-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--gp-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--gp-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--gp-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--gp-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--gp-shadow-primary: 0 10px 15px -3px rgba(147, 51, 234, .3), 0 4px 6px -4px rgba(147, 51, 234, .2);--gp-shadow-success: 0 10px 15px -3px rgba(34, 197, 94, .2), 0 4px 6px -4px rgba(34, 197, 94, .1);--gp-shadow-warning: 0 10px 15px -3px rgba(245, 158, 11, .2), 0 4px 6px -4px rgba(245, 158, 11, .1);--gp-shadow-error: 0 10px 15px -3px rgba(239, 68, 68, .2), 0 4px 6px -4px rgba(239, 68, 68, .1);--gp-border-light: #f4f4f5;--gp-border: #e4e4e7;--gp-border-strong: #d4d4d8;--gp-border-primary: var(--gp-primary-300);--gp-radius-sm: .25rem;--gp-radius-md: .375rem;--gp-radius-lg: .5rem;--gp-radius-xl: .75rem;--gp-radius-2xl: 1rem;--gp-radius-full: 9999px;--gp-space-1: .25rem;--gp-space-2: .5rem;--gp-space-3: .75rem;--gp-space-4: 1rem;--gp-space-5: 1.25rem;--gp-space-6: 1.5rem;--gp-space-8: 2rem;--gp-space-10: 2.5rem;--gp-space-12: 3rem;--gp-font-size-xs: .75rem;--gp-font-size-sm: .875rem;--gp-font-size-base: 1rem;--gp-font-size-lg: 1.125rem;--gp-font-size-xl: 1.25rem;--gp-font-size-2xl: 1.5rem;--gp-transition-base: all .3s cubic-bezier(.25, .46, .45, .94);--gp-transition-fast: all .2s cubic-bezier(.25, .46, .45, .94);--gp-transition-slow: all .4s cubic-bezier(.25, .46, .45, .94);--gp-transition-smooth: all .35s cubic-bezier(.23, 1, .32, 1);--gp-primary: var(--gp-primary-500);--gp-spacing-xs: var(--gp-space-1);--gp-spacing-sm: var(--gp-space-2);--gp-spacing-md: var(--gp-space-4);--gp-spacing-lg: var(--gp-space-6);--gp-text: var(--gp-text-primary);--gp-primary-light: #8a2be2;--gp-primary-dark: #9370db;--gp-bg: var(--gp-background);--gp-bg-light: #fafbfc;--gp-bg-dark: #0f0f0f;--gp-surface-light: #ffffff;--gp-surface-dark: #1a1a1a;--gp-text-light: #1a1a1a;--gp-text-dark: #f0f0f0;--gp-text-secondary-light: #6b7280;--gp-text-secondary-dark: #9ca3af;--gp-border-light: #e5e7eb;--gp-border-dark: #374151;--gp-shadow-light: rgba(0, 0, 0, .04);--gp-shadow-medium-light: rgba(0, 0, 0, .08);--gp-shadow-large-light: rgba(0, 0, 0, .12);--gp-shadow-dark: rgba(0, 0, 0, .2);--gp-shadow-medium-dark: rgba(0, 0, 0, .3);--gp-shadow-large-dark: rgba(0, 0, 0, .4)}@media (prefers-color-scheme: dark){:root{--gp-primary: var(--gp-primary-dark);--gp-bg: var(--gp-bg-dark);--gp-surface: var(--gp-surface-dark);--gp-text: var(--gp-text-dark);--gp-text-secondary: var(--gp-text-secondary-dark);--gp-border: var(--gp-border-dark);--gp-shadow: var(--gp-shadow-dark);--gp-shadow-medium: var(--gp-shadow-medium-dark);--gp-shadow-large: var(--gp-shadow-large-dark)}}@media (prefers-color-scheme: light){:root{--gp-primary: var(--gp-primary-light);--gp-bg: var(--gp-bg-light);--gp-surface: var(--gp-surface-light);--gp-text: var(--gp-text-light);--gp-text-secondary: var(--gp-text-secondary-light);--gp-border: var(--gp-border-light);--gp-shadow: var(--gp-shadow-light);--gp-shadow-medium: var(--gp-shadow-medium-light);--gp-shadow-large: var(--gp-shadow-large-light)}}.grid-paper-app *{box-sizing:border-box}.grid-paper-app{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--gp-bg);background-image:radial-gradient(circle at 20% 80%,rgba(138,43,226,.03) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(138,43,226,.03) 0%,transparent 50%);color:var(--gp-text);min-height:100vh;line-height:1.5;font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:1200px;margin:0 auto;padding:clamp(1rem,4vw,2.5rem)}.header{text-align:center;margin-bottom:clamp(2rem,6vw,4rem);animation:gp-fadeInUp .8s ease-out}.title{font-size:clamp(1.75rem,5vw,2.25rem);font-weight:700;margin:0 0 .75rem;background:linear-gradient(135deg,var(--gp-primary),var(--gp-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.025em;line-height:1.2}.subtitle{font-size:clamp(.95rem,2.5vw,1.125rem);color:var(--gp-text-secondary);font-weight:400;max-width:600px;margin:0 auto}.main-content{display:grid;gap:clamp(2rem,5vw,3.5rem)}.section-title{font-size:clamp(1.25rem,3vw,1.5rem);font-weight:600;margin:0 0 clamp(1rem,3vw,1.5rem) 0;color:var(--gp-primary);letter-spacing:-.015em}.type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:clamp(1rem,3vw,1.5rem)}.type-card{background:var(--gp-surface);border:1px solid var(--gp-border);border-radius:var(--gp-radius-lg);padding:clamp(1.25rem,4vw,1.75rem);text-align:center;cursor:pointer;transition:all var(--gp-transition-base);animation:gp-fadeInUp .8s ease-out;box-shadow:0 1px 3px var(--gp-shadow);position:relative;overflow:hidden}.type-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--gp-primary)08,transparent);opacity:0;transition:opacity .25s ease}.type-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px var(--gp-shadow-medium);border-color:var(--gp-primary)}.type-card:hover:before{opacity:1}.type-card.active{border-color:var(--gp-primary);box-shadow:0 4px 20px var(--gp-shadow-medium)}.type-card.active:before{opacity:1}.type-preview{margin-bottom:1.25rem;color:var(--gp-primary);position:relative;z-index:1}.type-name{font-size:clamp(1.1rem,2.5vw,1.25rem);font-weight:600;margin:0 0 .5rem;position:relative;z-index:1;letter-spacing:-.01em}.type-desc{font-size:clamp(.875rem,2vw,.95rem);color:var(--gp-text-secondary);margin:0;position:relative;z-index:1;line-height:1.4}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:clamp(1rem,3vw,1.5rem)}.setting-item{background:var(--gp-surface);border-radius:var(--gp-radius-md);padding:clamp(1.25rem,4vw,1.75rem);border:1px solid var(--gp-border);box-shadow:0 1px 3px var(--gp-shadow);transition:box-shadow .2s ease}.setting-item:hover{box-shadow:0 4px 12px var(--gp-shadow-medium)}.setting-label{display:block;font-weight:600;margin-bottom:1rem;color:var(--gp-text);font-size:clamp(.9rem,2vw,1rem);letter-spacing:-.01em}.setting-slider{width:100%;margin-bottom:.75rem;accent-color:var(--gp-primary);height:6px;border-radius:3px;background:var(--gp-border);outline:none;cursor:pointer}.setting-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--gp-primary);cursor:pointer;box-shadow:0 2px 6px #8a2be24d;transition:all var(--gp-transition-base);border:2px solid white}.setting-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px #8a2be266}.setting-slider::-webkit-slider-thumb:active{transform:scale(1.05)}.setting-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--gp-primary);cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #8a2be24d;transition:all .2s ease}.setting-slider::-moz-range-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px #8a2be266}.setting-select{width:100%;padding:.75rem 1rem;border:1px solid var(--gp-border);border-radius:var(--gp-radius-sm);background:var(--gp-surface);color:var(--gp-text);font-size:clamp(.9rem,2vw,1rem);transition:border-color .2s ease,box-shadow .2s ease;cursor:pointer}.setting-select:focus{outline:none;border-color:var(--gp-primary);box-shadow:0 0 0 3px #8a2be21a}.setting-value{font-weight:600;color:var(--gp-primary);font-size:clamp(.875rem,2vw,.95rem)}.preview-container{background:var(--gp-surface);border:1px solid var(--gp-border);border-radius:var(--gp-radius-lg);padding:clamp(1.5rem,4vw,2.5rem);margin-bottom:clamp(1.5rem,4vw,2rem);min-height:clamp(250px,40vw,350px);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px var(--gp-shadow)}.action-buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:clamp(.75rem,2vw,1rem) clamp(1.5rem,4vw,2.5rem);border:none;border-radius:var(--gp-radius-md);font-size:clamp(.9rem,2vw,1rem);font-weight:600;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);text-decoration:none;letter-spacing:-.01em;min-width:160px;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.3);border-radius:50%;transform:translate(-50%,-50%);transition:width .4s cubic-bezier(.23,1,.32,1),height .4s cubic-bezier(.23,1,.32,1)}.btn:active:before{width:300px;height:300px}.btn-primary{background:var(--gp-primary);color:#fff;box-shadow:0 2px 8px #8a2be240}.btn-primary:hover{transform:translateY(-1px) scale(1.02);box-shadow:0 6px 20px #8a2be259}.btn-primary:active{transform:translateY(0) scale(.98)}.btn-primary:focus{outline:none;box-shadow:0 6px 20px #8a2be259,0 0 0 3px #8a2be233}@keyframes gp-fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes gp-pulse{0%,to{opacity:1}50%{opacity:.8}}@keyframes gp-shimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}.loading-shimmer{background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);background-size:200px 100%;animation:gp-shimmer 1.5s infinite}@media (max-width: 768px){.container{padding:clamp(1rem,4vw,1.5rem)}.type-grid,.settings-grid{grid-template-columns:1fr}.action-buttons{flex-direction:column;align-items:stretch}.btn{width:100%;min-width:auto}}@media (max-width: 480px){.container{padding:1rem}.type-card,.setting-item{padding:1.25rem}.preview-container{padding:1.5rem;min-height:200px}}@media (hover: none) and (pointer: coarse){.type-card:hover,.btn-primary:hover{transform:none}.type-card:active,.btn-primary:active{transform:scale(.98)}}@media (prefers-contrast: high){.type-card{border-width:2px}.btn-primary{border:2px solid var(--gp-primary)}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.gp-settings-panel{background:var(--gp-surface-elevated);border:1px solid var(--gp-border-light);border-radius:var(--gp-radius-2xl);padding:var(--gp-space-8);margin-bottom:var(--gp-space-8);box-shadow:var(--gp-shadow-sm);transition:all var(--gp-transition-base);position:relative;overflow:hidden;animation:panel-slide-in .4s cubic-bezier(.16,1,.3,1)}@keyframes panel-slide-in{0%{transform:translateY(20px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.gp-settings-panel:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gp-primary-400),var(--gp-primary-600));border-radius:var(--gp-radius-2xl) var(--gp-radius-2xl) 0 0;animation:gradient-flow 3s ease-in-out infinite}@keyframes gradient-flow{0%,to{background:linear-gradient(90deg,var(--gp-primary-400),var(--gp-primary-600))}50%{background:linear-gradient(90deg,var(--gp-primary-600),var(--gp-primary-400))}}.gp-settings-panel:hover{box-shadow:var(--gp-shadow-lg);transform:translateY(-1px)}.gp-setting-group{margin-bottom:var(--gp-space-8);position:relative;animation:setting-group-appear .6s cubic-bezier(.25,.46,.45,.94);animation-fill-mode:both}@keyframes setting-group-appear{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.gp-setting-group:nth-child(1){animation-delay:.1s}.gp-setting-group:nth-child(2){animation-delay:.2s}.gp-setting-group:nth-child(3){animation-delay:.3s}.gp-setting-group:nth-child(4){animation-delay:.4s}.gp-setting-group:last-child{margin-bottom:0}.gp-setting-label{display:flex;align-items:center;gap:var(--gp-space-2);font-size:var(--gp-font-size-sm);font-weight:600;color:var(--gp-text-primary);margin-bottom:var(--gp-space-4);letter-spacing:.025em;text-transform:uppercase;position:relative}.gp-setting-label:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--gp-border),transparent);margin-left:var(--gp-space-3);animation:line-expand .8s cubic-bezier(.25,.46,.45,.94);animation-fill-mode:both}@keyframes line-expand{0%{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}.gp-slider-container{position:relative;background:var(--gp-surface);border-radius:var(--gp-radius-xl);padding:var(--gp-space-6);border:1px solid var(--gp-border-light);transition:all var(--gp-transition-base);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,var(--gp-surface-elevated) 0%,var(--gp-surface) 100%)}.gp-slider-container:hover{border-color:var(--gp-primary-200);box-shadow:var(--gp-shadow-md);transform:translateY(-1px)}.gp-slider-container:focus-within{border-color:var(--gp-primary-400);box-shadow:var(--gp-shadow-primary);transform:translateY(-1px)}.gp-slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--gp-space-5);gap:var(--gp-space-4);flex-wrap:nowrap}.gp-slider-header span{font-size:var(--gp-font-size-sm);font-weight:500;color:var(--gp-text-secondary);text-transform:capitalize;flex-shrink:0;min-width:0}.gp-slider-value{display:flex;align-items:center;gap:var(--gp-space-2);background:var(--gp-primary-50);padding:var(--gp-space-2) var(--gp-space-3);border-radius:var(--gp-radius-lg);border:1px solid var(--gp-primary-200);min-width:90px;justify-content:center;flex-shrink:0}.gp-value-input{width:64px;min-width:64px;max-width:84px;padding:var(--gp-space-2) var(--gp-space-2);border:none;border-radius:var(--gp-radius-md);background:transparent;color:var(--gp-primary-700);font-size:var(--gp-font-size-sm);font-weight:600;text-align:center;transition:all var(--gp-transition-smooth);box-sizing:border-box;line-height:1.2;font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace}.gp-value-input:focus{outline:none;background:var(--gp-primary-100);color:var(--gp-primary-800);box-shadow:0 0 0 2px var(--gp-primary-300)}.gp-value-unit{font-size:var(--gp-font-size-xs);color:var(--gp-primary-600);font-weight:500;text-transform:uppercase;letter-spacing:.05em;flex-shrink:0}.gp-slider{width:100%;height:8px;border-radius:var(--gp-radius-full);background:var(--gp-gray-200);outline:none;transition:all var(--gp-transition-base);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative}.gp-slider:before{content:"";position:absolute;top:0;left:0;height:100%;width:var(--progress, 50%);background:linear-gradient(90deg,var(--gp-primary-400),var(--gp-primary-600));border-radius:var(--gp-radius-full);transition:all var(--gp-transition-base);box-shadow:0 0 #6366f14d}.gp-slider:hover:before{box-shadow:0 0 0 4px #6366f11a}.gp-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:24px;height:24px;border-radius:var(--gp-radius-full);background:var(--gp-surface-elevated);border:3px solid var(--gp-primary-500);cursor:pointer;transition:all var(--gp-transition-base);box-shadow:var(--gp-shadow-md);position:relative;z-index:2}.gp-slider::-webkit-slider-thumb:hover{transform:scale(1.1);border-color:var(--gp-primary-600);box-shadow:var(--gp-shadow-lg),0 0 0 8px #6366f11a}.gp-slider::-webkit-slider-thumb:active{transform:scale(1.05);box-shadow:var(--gp-shadow-xl),0 0 0 12px #6366f126}.gp-slider::-moz-range-track{height:8px;border-radius:var(--gp-radius-full);background:var(--gp-gray-200);border:none}.gp-slider::-moz-range-progress{height:8px;border-radius:var(--gp-radius-full);background:linear-gradient(90deg,var(--gp-primary-400),var(--gp-primary-600));border:none}.gp-slider::-moz-range-thumb{width:24px;height:24px;border-radius:var(--gp-radius-full);background:var(--gp-surface-elevated);border:3px solid var(--gp-primary-500);cursor:pointer;transition:all var(--gp-transition-base);box-shadow:var(--gp-shadow-md)}.gp-slider::-moz-range-thumb:hover{transform:scale(1.1);border-color:var(--gp-primary-600);box-shadow:var(--gp-shadow-lg)}.gp-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:var(--gp-shadow-md),0 0 0 4px var(--gp-primary) 20}.gp-slider::-webkit-slider-thumb:active{transform:scale(.95)}.gp-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--gp-surface);border:2px solid var(--gp-primary);cursor:pointer;transition:all .2s ease;box-shadow:var(--gp-shadow-sm)}.gp-slider::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:var(--gp-shadow-md),0 0 0 4px var(--gp-primary) 20}.gp-paper-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gp-space-4)}.gp-paper-option{display:flex;flex-direction:column;align-items:center;padding:var(--gp-space-5);border:2px solid var(--gp-border-light);border-radius:var(--gp-radius-xl);background:var(--gp-surface-elevated);cursor:pointer;transition:all var(--gp-transition-base);text-align:center;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.gp-paper-option:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--gp-primary-50) 0%,transparent 50%);opacity:0;transition:opacity var(--gp-transition-base)}.gp-paper-option:hover{border-color:var(--gp-primary-300);transform:translateY(-2px) scale(1.02);box-shadow:var(--gp-shadow-lg)}.gp-paper-option:hover:before{opacity:1}.gp-paper-option.active{border-color:var(--gp-primary-400);background:var(--gp-primary-50);box-shadow:var(--gp-shadow-primary);transform:translateY(-1px)}.gp-paper-option.active:before{opacity:1;background:linear-gradient(135deg,var(--gp-primary-100) 0%,var(--gp-primary-50) 100%)}.gp-paper-option.active:after{content:"✓";position:absolute;top:var(--gp-space-2);right:var(--gp-space-2);width:20px;height:20px;background:var(--gp-primary-500);color:#fff;border-radius:var(--gp-radius-full);display:flex;align-items:center;justify-content:center;font-size:var(--gp-font-size-xs);font-weight:600;animation:checkmark-appear .4s cubic-bezier(.23,1,.32,1)}@keyframes checkmark-appear{0%{transform:scale(0) rotate(180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.gp-paper-icon{width:36px;height:44px;margin-bottom:var(--gp-space-3);fill:var(--gp-text-tertiary);transition:all var(--gp-transition-base);position:relative;z-index:1}.gp-paper-option:hover .gp-paper-icon{fill:var(--gp-primary-500);transform:scale(1.1)}.gp-paper-option.active .gp-paper-icon{fill:var(--gp-primary-600);transform:scale(1.05)}.gp-paper-name{font-weight:600;font-size:var(--gp-font-size-sm);color:var(--gp-text-primary);margin-bottom:var(--gp-space-1);position:relative;z-index:1}.gp-paper-desc{font-size:var(--gp-font-size-xs);color:var(--gp-text-secondary);font-weight:500;position:relative;z-index:1}.gp-orientation-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gp-space-4)}.gp-orientation-option{display:flex;flex-direction:column;align-items:center;padding:var(--gp-space-6);border:2px solid var(--gp-border-light);border-radius:var(--gp-radius-xl);background:var(--gp-surface-elevated);cursor:pointer;transition:all var(--gp-transition-base);text-align:center;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.gp-orientation-option:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--gp-primary-50) 0%,transparent 50%);opacity:0;transition:opacity var(--gp-transition-base)}.gp-orientation-option:hover{border-color:var(--gp-primary-300);transform:translateY(-2px) scale(1.02);box-shadow:var(--gp-shadow-lg)}.gp-orientation-option:hover:before{opacity:1}.gp-orientation-option.active{border-color:var(--gp-primary-400);background:var(--gp-primary-50);box-shadow:var(--gp-shadow-primary);transform:translateY(-1px)}.gp-orientation-option.active:before{opacity:1;background:linear-gradient(135deg,var(--gp-primary-100) 0%,var(--gp-primary-50) 100%)}.gp-orientation-option.active:after{content:"✓";position:absolute;top:var(--gp-space-2);right:var(--gp-space-2);width:18px;height:18px;background:var(--gp-primary-500);color:#fff;border-radius:var(--gp-radius-full);display:flex;align-items:center;justify-content:center;font-size:var(--gp-font-size-xs);font-weight:600;animation:checkmark-appear .4s cubic-bezier(.23,1,.32,1)}.gp-orientation-icon{width:28px;height:36px;margin-bottom:var(--gp-space-3);fill:var(--gp-text-tertiary);transition:all var(--gp-transition-base);position:relative;z-index:1}.gp-orientation-option:hover .gp-orientation-icon{fill:var(--gp-primary-500);transform:scale(1.1)}.gp-orientation-option.active .gp-orientation-icon{fill:var(--gp-primary-600);transform:scale(1.05)}.gp-orientation-name{font-weight:600;font-size:var(--gp-font-size-sm);color:var(--gp-text-primary);position:relative;z-index:1}@media (max-width: 768px){.gp-settings-panel{padding:var(--gp-spacing-md)}.gp-paper-grid{grid-template-columns:1fr;gap:var(--gp-spacing-xs)}.gp-paper-option,.gp-orientation-option,.gp-slider-container{padding:var(--gp-spacing-sm)}}
