@import"https://fonts.googleapis.com/css2?family=Lexend:wght@400;500;600;700&display=swap";:root{--blue-50: #eff6ff;--blue-100: #dbeafe;--blue-200: #bfdbfe;--blue-300: #93c5fd;--blue-400: #60a5fa;--blue-500: #3b82f6;--blue-600: #2563eb;--blue-700: #1d4ed8;--blue-800: #1e40af;--blue-900: #1e3a8a;--pink-50: #fff1f2;--pink-100: #ffe4e6;--pink-200: #fdcaca;--pink-300: #fda4af;--pink-400: #fb7185;--pink-500: #f43f5e;--pink-600: #e11d48;--pink-700: #be123c;--pink-800: #9f1239;--pink-900: #881337;--green-50: #f0fdf4;--green-100: #dcfce7;--green-200: #bbf7d0;--green-300: #86efac;--green-400: #4ade80;--green-500: #22c55e;--green-600: #16a34a;--green-700: #15803d;--green-800: #166534;--green-900: #14532d;--yellow-50: #fffbeb;--yellow-100: #fef3c7;--yellow-200: #fbf4bc;--yellow-300: #fcd34d;--yellow-400: #fbbf24;--yellow-500: #f59e0b;--yellow-600: #d97706;--yellow-700: #b45309;--yellow-800: #92400e;--yellow-900: #78350f;--purple-50: #faf5ff;--purple-100: #f3e8ff;--purple-200: #dbbcfb;--purple-300: #d8b4fe;--purple-400: #c084fc;--purple-500: #a855f7;--purple-600: #9333ea;--purple-700: #7e22ce;--purple-800: #6b21a8;--purple-900: #581c87;--orange-50: #fff7ed;--orange-100: #ffedd5;--orange-200: #fbdbbc;--orange-300: #fdba74;--orange-400: #fb923c;--orange-500: #f97316;--orange-600: #ea580c;--orange-700: #c2410c;--orange-800: #9a3412;--orange-900: #7c2d12;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--bg: var(--yellow-50);--text: var(--gray-900);--muted: var(--gray-600);--primary: var(--blue-500);--primary-contrast: #ffffff;--success: var(--green-500);--warning: var(--yellow-500);--error: var(--pink-500);--accent: var(--purple-400);--green: var(--green-200);--blue: var(--blue-300);--violet: var(--purple-200);--yellow: var(--yellow-200);--red: var(--pink-200);--slate: var(--gray-900);--panel: rgba(15, 23, 42, .8);--panel-2: rgba(17, 24, 39, .9);--text-secondary: var(--gray-600);--accent-secondary: var(--green);--accent-warm: var(--yellow);--accent-deep: var(--violet);--focus: rgba(147, 197, 253, .4);--danger: var(--red);--ok: var(--green);--tile-border: rgba(148, 163, 184, .2);--tile-placeholder: rgba(71, 85, 105, .6);--tile-overlay: rgba(15, 23, 42, .75);--light-bg: var(--yellow-50);--light-text: var(--slate);--light-text-secondary: #475569;--light-muted: #64748B;--light-border: rgba(203, 213, 225, .8);--light-panel: rgba(255, 255, 255, .9);--modal-animation-duration: .26s;--modal-animation-ease: cubic-bezier(.2, .8, .2, 1);font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,sans-serif;color-scheme:light dark}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);position:relative}body:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:var(--yellow-50);z-index:-1}.container{max-width:1100px;margin:0 auto;padding:16px}.panel{background:var(--panel);border:1px solid #1e293b;border-radius:12px;padding:16px}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:8px}.btn{-webkit-appearance:none;appearance:none;border:1px solid rgba(148,163,184,.3);background:var(--panel);color:var(--text);padding:10px 14px;border-radius:10px;cursor:pointer;transition:all .2s ease;backdrop-filter:blur(8px)}.btn.small{padding:6px 10px;font-size:13px;border-radius:8px}.btn.primary{background:var(--primary);border-color:var(--primary);box-shadow:0 4px 20px rgba(59,130,246,.3);color:var(--gray-900);font-weight:600}.btn.primary:hover{box-shadow:0 6px 25px rgba(59,130,246,.4);transform:translateY(-1px);background:var(--blue-600)}.btn.ghost{background:transparent;border-color:rgba(148,163,184,.2)}.btn.danger{background:var(--danger);border-color:var(--danger);color:var(--gray-900)}.btn.danger:hover{background:var(--pink-300)}.btn:focus{outline:3px solid var(--focus);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed}.toolbar{display:flex;gap:8px;flex-wrap:wrap}.footer .link-btn{-webkit-appearance:none;appearance:none;border:none;background:transparent;color:var(--accent-secondary);cursor:pointer;font-size:14px;padding:0;text-decoration:underline;font-family:inherit;font-weight:500;transition:all .2s ease}.footer .link-btn:hover{color:var(--purple-500);text-shadow:0 0 8px rgba(192,132,252,.3)}.footer .link-btn:focus{outline:2px solid var(--focus);outline-offset:2px}.page-footer{min-height:60px;display:flex;align-items:center;padding:12px 20px;color:#6b7280;font-size:14px;background:var(--yellow-50)}.welcome .page-footer,.setup .page-footer{justify-content:center}.editor .page-footer{position:fixed;bottom:0;left:0;right:0;justify-content:center;z-index:10}.page-footer .footer-content{display:flex;align-items:center;justify-content:center;width:100%}.page-footer .credits{display:flex;align-items:center;font-size:12px;color:var(--gray-500);text-align:center;flex-wrap:wrap;justify-content:center;gap:4px}.page-footer .external-link{color:var(--blue-300);text-decoration:none;font-size:12px;padding:0}.page-footer .external-link:hover{color:var(--blue-400);text-decoration:underline}.page-footer .link-btn{-webkit-appearance:none;appearance:none;border:none;background:transparent;color:var(--blue-300);cursor:pointer;font-size:14px;padding:0;text-decoration:underline;font-family:inherit;font-weight:500;transition:all .2s ease}.page-footer .link-btn:hover{color:var(--blue-400);text-shadow:0 0 8px rgba(147,197,253,.3)}.page-footer .link-btn:focus{outline:2px solid var(--focus);outline-offset:2px}.legal-modal,.privacy-modal{max-width:800px;max-height:85vh;width:min(800px,calc(100% - 24px))}.legal-modal .modal-body,.privacy-modal .modal-body,.modal-backdrop[aria-label="AI Board Generation"] .modal-body{display:block!important;grid-template-columns:none!important;grid-template-areas:none!important}.modal-backdrop[aria-label="AI Board Generation"] .muted-input{width:100%!important;box-sizing:border-box!important;max-width:100%!important}@media (max-width: 768px){.modal-backdrop[aria-label="AI Board Generation"] .row-inline{flex-direction:column;width:100%}.modal-backdrop[aria-label="AI Board Generation"] .row-inline>*{width:100%!important;max-width:100%!important}.modal-backdrop[aria-label="AI Board Generation"] select{width:100%!important}}.modal.light .legal-content{max-height:65vh;overflow-y:auto;padding-right:8px;line-height:1.5}.modal.light .legal-content h2{margin-top:16px;margin-bottom:8px;color:#111827;font-size:18px;font-weight:700}.modal.light .legal-content h2:first-child{margin-top:0}.modal.light .legal-content p{margin-bottom:8px;color:#374151;font-size:14px;text-align:left}.modal.light .legal-content p:first-child{margin-top:0}.modal.light .legal-content p:last-child{margin-bottom:0}.modal.light .legal-content::-webkit-scrollbar{width:6px}.modal.light .legal-content::-webkit-scrollbar-track{background:#f3f4f6;border-radius:3px}.modal.light .legal-content::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:3px}.modal.light .legal-content::-webkit-scrollbar-thumb:hover{background:var(--gray-600)}label{font-size:14px;color:var(--muted)}input[type=text],input[type=number],select{background:#0b1222;color:var(--text);border:1px solid #334155;padding:10px 12px;border-radius:8px}input[type=color]{height:40px;width:56px;padding:0;border:none;background:transparent}.board{display:grid;gap:8px}.board{width:100%}.board .tile{position:relative;border:2px solid var(--tile-border);border-radius:12px;background:#0a0f1d;overflow:hidden;user-select:none}.board .tile{aspect-ratio:1 / 1}.tile-btn{all:unset;display:block;width:100%;height:100%;cursor:pointer}.tile-img{width:100%;height:100%;object-fit:cover;display:block}.tile-label{position:absolute;left:0;right:0;bottom:0;background:var(--tile-overlay);padding:8px 10px;text-align:center;font-weight:700;text-shadow:0 1px 2px #0006}.tile-label.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--tile-overlay)}.tile-empty{background:var(--tile-placeholder);color:#94a3b8;display:flex;align-items:center;justify-content:center;font-weight:600}.tile-edit-icon{position:absolute;top:8px;right:8px;background:rgba(0,0,0,.5);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0;transition:opacity .2s ease}.tile:hover .tile-edit-icon{opacity:1}@keyframes modal-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes modal-backdrop-out{0%{opacity:1}to{opacity:0}}@keyframes modal-content-in{0%{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes modal-content-out{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(18px) scale(.96)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;box-sizing:border-box;overflow-y:auto;opacity:0}.modal-backdrop[data-motion=opening]{animation:modal-backdrop-in var(--modal-animation-duration) var(--modal-animation-ease) forwards}.modal-backdrop[data-motion=open]{opacity:1}.modal-backdrop[data-motion=closing]{animation:modal-backdrop-out var(--modal-animation-duration) var(--modal-animation-ease) forwards;pointer-events:none}.modal{background:var(--panel-2);border:1px solid #1e293b;border-radius:12px;width:min(720px,calc(100% - 24px));padding:16px;box-shadow:0 25px 50px rgba(59,130,246,.15),0 10px 25px rgba(0,0,0,.3);opacity:0;transform:translateY(16px) scale(.96);will-change:transform,opacity}.modal[data-motion=opening]{animation:modal-content-in var(--modal-animation-duration) var(--modal-animation-ease) forwards}.modal[data-motion=open]{opacity:1;transform:none}.modal[data-motion=closing]{animation:modal-content-out var(--modal-animation-duration) var(--modal-animation-ease) forwards;pointer-events:none}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.modal-title{font-size:18px;font-weight:700}.modal-body{display:flex;flex-direction:column;gap:18px}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}.muted{color:var(--muted)}.spacer{height:8px}.title{font-size:24px;font-weight:800;background:linear-gradient(135deg,var(--text) 0%,var(--accent) 100%)}.subtitle{font-size:14px;color:var(--text-secondary)}.section-title{font-size:16px;font-weight:700;color:var(--accent-secondary)}.grid-controls{display:flex;gap:8px;align-items:center}.quick-templates{display:flex;gap:8px;flex-wrap:wrap}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.play-container{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--light-bg);padding:16px;color:var(--light-text);overflow:hidden;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;overscroll-behavior:none}.play-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--light-bg);z-index:-1}.play-toolbar{position:fixed;top:0;left:16px;right:16px;display:flex;justify-content:space-between;gap:8px;background:transparent;border:none;border-radius:12px;padding:12px 16px;z-index:20;height:48px;box-sizing:border-box}.play-container .btn{background:var(--light-panel);color:var(--light-text);border:1px solid var(--light-border);backdrop-filter:blur(8px);transition:all .2s ease}.play-container .btn:hover{border-color:var(--green-300);box-shadow:0 4px 12px rgba(187,247,208,.15)}.play-container .btn.close-btn{background:var(--danger);border-color:var(--danger);color:var(--gray-900);font-weight:600;min-width:80px;position:relative}.play-container .btn.close-btn:hover{box-shadow:0 4px 20px rgba(253,164,175,.3);transform:translateY(-1px);background:var(--pink-300)}.close-progress{position:absolute;left:-50px;top:50%;transform:translateY(-50%);width:40px;height:40px}.close-progress svg{width:40px;height:40px;transform:rotate(-90deg)}.close-progress circle{fill:none;stroke:var(--gray-900);stroke-width:3;stroke-linecap:round}.close-progress .bg{stroke:rgba(0,0,0,.1)}.close-progress .fg{stroke-dasharray:113;stroke-dashoffset:113;transition:stroke-dashoffset .1s linear;stroke:var(--danger)}.close-progress .countdown{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:16px;font-weight:700;color:var(--gray-900)}.play-container .title{font-weight:700;color:var(--gray-900);background:none}.play-container .board{width:fit-content!important;height:fit-content!important}.editor{background:var(--light-bg);color:var(--light-text);height:100vh;display:flex;flex-direction:column;position:relative}.editor:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--light-bg);z-index:-1}.editor .topbar{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;backdrop-filter:blur(10px);background:var(--yellow-50)}.editor .brand{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--gray-900)}.editor .content{max-width:1400px;margin:0 auto;padding:24px}.editor .btn{background:var(--light-panel);color:var(--light-text);border:1px solid var(--light-border);backdrop-filter:blur(8px)}.editor .btn:hover{border-color:var(--green-300);box-shadow:0 4px 12px rgba(187,247,208,.15)}.editor .view-board-btn{font-size:18px;padding:16px 32px;border-radius:16px;font-weight:700;min-width:200px;background:var(--blue-300);border-color:var(--blue-300);box-shadow:0 6px 25px rgba(147,197,253,.3);transition:all .3s ease;color:var(--gray-900)}.editor .view-board-btn:hover{box-shadow:0 8px 30px rgba(147,197,253,.4);transform:translateY(-2px);background:var(--blue-400)}.editor h2{text-align:center;font-size:28px;margin:6px 0 8px;color:var(--gray-900);font-weight:700}.editor .hint{text-align:center;color:var(--light-muted);margin-bottom:18px}.cells{display:grid;gap:6px;width:fit-content;max-width:min(450px,calc(100vw - 80px));margin:0;box-sizing:border-box;justify-self:center}.cell{background:var(--light-panel);border-radius:6px;padding:0;backdrop-filter:blur(8px);transition:all .2s ease;aspect-ratio:1;box-sizing:border-box;min-width:0;overflow:hidden;display:flex;align-items:center;justify-content:center}.cell:hover{box-shadow:0 4px 12px rgba(187,247,208,.1)}.cell .tile{border:none;background:linear-gradient(135deg,#f8fafc,rgba(248,250,252,.8));aspect-ratio:1;width:calc(100% - 6px);height:calc(100% - 6px);margin:3px;padding:0;box-sizing:border-box;overflow:hidden;position:relative}.cell .tile-img{filter:saturate(1.05) brightness(1.02)}.cell .add-cta{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:transparent;color:rgba(0,0,0,.7);border:0;border-radius:8px;box-sizing:border-box;transition:all .2s ease;max-width:100%;max-height:100%;overflow:hidden;cursor:pointer;filter:drop-shadow(0 1px 2px rgba(255,255,255,.8))}.cell .add-cta:hover{background:rgba(0,0,0,.1)}@media (hover: hover){.cell .add-cta:hover{transform:scale(1.02)}}.modal.light{background:var(--light-panel);border-color:var(--light-border);width:min(680px,calc(100% - 24px));padding:12px;backdrop-filter:blur(10px);box-shadow:0 25px 50px rgba(147,197,253,.2),0 10px 25px rgba(15,23,42,.15)}.modal.light .modal-body{position:relative}.modal.light .modal-title{color:var(--light-text);color:var(--gray-900)}.modal.light .group{background:var(--light-panel);border:1px solid var(--light-border);border-radius:12px;padding:16px;display:grid;gap:10px;align-items:center;transition:all .2s ease}.modal.light .group:hover{border-color:var(--green-300);box-shadow:0 4px 12px rgba(187,247,208,.1)}.modal.light .group .icon{width:128px;height:128px;display:grid;place-items:center;background:transparent;margin:0 auto}.modal.light .group .desc{text-align:center;color:var(--light-muted);font-size:14px}.modal.light .primary{padding:12px 16px;border-radius:12px;font-weight:700;transition:all .2s ease}.modal.light .primary.blue{background:var(--blue-300);border:1px solid var(--blue-300);color:var(--gray-900);box-shadow:0 4px 20px rgba(147,197,253,.3)}.modal.light .primary.blue:hover{box-shadow:0 6px 25px rgba(147,197,253,.4);transform:translateY(-1px);background:var(--blue-400)}.modal.light .primary.purple{background:var(--purple-300);border:1px solid var(--purple-300);color:var(--gray-900);box-shadow:0 4px 20px rgba(196,181,253,.3)}.modal.light .primary.purple:hover{box-shadow:0 6px 25px rgba(196,181,253,.4);transform:translateY(-1px);background:var(--purple-400)}.modal.light .primary.green{background:var(--green);border:1px solid var(--green);color:var(--gray-900);box-shadow:0 4px 20px rgba(187,247,208,.3)}.modal.light .primary.green:hover{box-shadow:0 6px 25px rgba(134,239,172,.4);transform:translateY(-1px);background:var(--green-300)}.upload-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.95);display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:16px;backdrop-filter:blur(8px);z-index:10}.upload-spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top:4px solid var(--blue-300);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}.upload-spinner.green{border-top:4px solid var(--green-400)}.upload-spinner.purple{border-top:4px solid var(--purple-300)}.upload-spinner.blue,.upload-spinner.camera{border-top:4px solid var(--blue-300)}.upload-spinner.orange{border-top:4px solid var(--orange-300)}.upload-message{color:var(--gray-700);font-weight:600;font-size:14px;text-align:center}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.current-image-preview{margin:16px 0}.current-image-preview label{display:block;margin-bottom:8px;font-weight:600;color:var(--gray-700)}.image-preview-container{border:1px solid var(--light-border);border-radius:12px;overflow:hidden;background:#f8fafc}.image-preview{width:100%;height:120px;object-fit:cover;display:block}.session-modal{max-width:500px!important;padding:24px!important}.auth-modal{max-width:400px!important;width:100%;padding:24px!important;gap:18px}.modal-close{-webkit-appearance:none;appearance:none;border:none;background:rgba(148,163,184,.18);color:var(--gray-600);width:36px;height:36px;border-radius:999px;display:grid;place-items:center;font-size:20px;line-height:1;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}.modal-close:hover{background:rgba(59,130,246,.2);color:var(--gray-900);transform:translateY(-1px)}.modal-close:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.modal-close:disabled{opacity:.5;cursor:not-allowed;transform:none}.modal-header-actions{display:flex;align-items:center;gap:10px}.modal-section{background:#fff;border:1px solid var(--light-border);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px;box-shadow:0 18px 35px rgba(15,23,42,.08)}.modal-section h4{margin:0;font-size:16px;font-weight:700;color:var(--gray-800)}.modal-status{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:12px;font-size:14px;font-weight:600;color:var(--green-700);background:rgba(34,197,94,.12)}.modal-status--error{color:var(--error);background:rgba(239,68,68,.12)}.boards-modal{max-width:520px!important;width:100%;padding:28px!important;display:flex;flex-direction:column;gap:20px}.boards-modal .modal-body{padding:0;display:flex;flex-direction:column;gap:18px}.boards-modal .modal-section{padding:0;gap:0;box-shadow:none;border-radius:14px;border:none}.boards-modal .boards-empty,.boards-modal .boards-loading{padding:22px;border-radius:16px;border:1px solid var(--light-border);background:#fff;text-align:center;color:var(--gray-600);font-size:14px;box-shadow:0 18px 35px rgba(15,23,42,.08)}.board-card-list{display:flex;flex-direction:column;gap:0;padding:0}.board-card{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:14px;background:#fff;border:1px solid var(--light-border);box-shadow:0 18px 35px rgba(15,23,42,.08);transition:border-color .2s ease,box-shadow .2s ease}.board-card+.board-card{margin-top:16px}.board-card--active{border-color:var(--blue-300);background:var(--blue-50);box-shadow:0 22px 40px rgba(59,130,246,.12)}.board-card__name{font-size:16px;font-weight:600;color:var(--gray-900);margin:0}.board-card__meta{display:flex;flex-direction:column;gap:6px}.board-card__updated{font-size:13px;color:var(--gray-500);margin-top:4px}.board-card__tag{margin-top:8px;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(37,99,235,.18);color:var(--blue-700);font-size:12px;font-weight:600}.board-card__actions{display:flex;flex-wrap:wrap;gap:8px}.board-card__actions .primary,.board-card__actions .btn{flex:1;min-width:120px}.handoff-modal{max-width:420px!important;width:100%;padding:28px!important;gap:20px}.handoff-modal .modal-body{padding:0}.handoff-modal .modal-section{gap:16px}.handoff-modal .modal-actions{justify-content:flex-end;gap:12px}.session-modal{max-width:440px!important;width:100%;padding:28px!important;gap:20px}.session-modal .modal-body{padding:0}.session-modal .modal-section{gap:20px}.session-modal .session-message{margin:0;font-size:15px;color:var(--gray-700)}.session-modal .session-buttons{display:flex;flex-wrap:wrap;gap:10px}.session-modal .session-buttons .primary{flex:1;min-width:140px}.ai-modal .modal-body{padding:0;gap:20px}.ai-modal .modal-section{gap:18px}.ai-modal .stop-button{background:var(--pink-200);border:1px solid var(--pink-200);color:var(--gray-900);font-weight:600;padding:8px 14px;border-radius:10px;transition:transform .2s ease,box-shadow .2s ease}.ai-modal .stop-button:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(244,114,182,.4)}.choice-option{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--gray-600);cursor:pointer}.choice-option input{width:18px;height:18px;accent-color:var(--blue-500)}.section-label{font-size:14px;font-weight:600;color:var(--gray-700);text-align:left;margin:18px 0 10px}.section-label.small-note{margin:0 0 8px;font-size:13px;font-weight:600}.ai-modal .preview-voice{padding:8px 12px;font-size:12px;font-weight:600;background:#f3f4f6;border:1px solid #d1d5db;border-radius:10px;cursor:pointer;transition:background .2s ease}.ai-modal .preview-voice:hover:not(:disabled){background:#e2e8f0}.ai-modal .preview-voice:disabled{opacity:.6;cursor:not-allowed}.ai-voice-picker{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ai-voice-picker .muted-input{flex:1;min-width:160px}.ai-voice-picker .preview-voice{flex:0 0 auto;white-space:nowrap}.ai-retry__title{margin:0 0 12px;font-size:16px;font-weight:600;color:var(--error)}.ai-retry__description{margin:0 0 16px;font-size:14px;color:var(--gray-700)}.ai-retry__card{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:12px;border:1px solid var(--light-border);background:#fff}.ai-retry__card-title{font-size:14px;font-weight:600;color:var(--gray-800)}.ai-retry__error{font-size:12px;color:var(--error);font-style:italic}.ai-retry__actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.ai-retry__input{flex:1 1 auto}.ai-retry__card .btn,.ai-retry__card .primary{min-width:140px}.ai-section{gap:20px}.ai-section .group{border:none;box-shadow:none;background:transparent;padding:0}.ai-section .group .desc{text-align:left;color:var(--gray-600)}.ai-options{display:flex;flex-direction:column;gap:10px}.ai-option-group{display:flex;flex-direction:column;gap:8px}.ai-option-group+.ai-option-group{margin-top:16px}.ai-indented{margin-left:24px;display:flex;flex-direction:column;gap:10px}.ai-inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ai-modal .small-note{font-size:13px;color:var(--gray-500)}.modal-section p:last-child{margin-bottom:0}.boards-modal .modal-section .board-card__actions .btn,.boards-modal .modal-section .board-card__actions .primary{flex:1 1 48%}.admin-page{min-height:100vh;background:#f8fafc;display:flex;flex-direction:column}.admin-page__topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 24px;border-bottom:1px solid var(--light-border);background:rgba(255,255,255,.9);backdrop-filter:blur(8px);position:sticky;top:0;z-index:50}.admin-page__actions{display:flex;align-items:center;gap:12px}.admin-page__body{width:min(1160px,calc(100% - 32px));margin:32px auto;display:flex;flex-direction:column;gap:24px;padding-bottom:48px;flex:1}.admin-page__header h1{margin:0;font-size:32px;font-weight:700;color:var(--gray-900)}.admin-page__header p{margin:6px 0 0;color:var(--gray-600);font-size:15px}.admin-card{background:#fff;border:1px solid var(--light-border);border-radius:18px;padding:24px;box-shadow:0 16px 40px rgba(15,23,42,.08)}.admin-status{padding:16px 18px;border-radius:12px;font-size:14px;font-weight:600}.admin-status--error{background:rgba(220,38,38,.12);color:#991b1b;border:1px solid rgba(220,38,38,.18)}.admin-table-wrapper{overflow-x:auto}.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px}.admin-stat-card{padding:18px;border-radius:14px;background:#fff;border:1px solid var(--light-border);box-shadow:0 18px 35px rgba(15,23,42,.08)}.admin-stat-label{font-size:13px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.04em}.admin-stat-value{margin-top:6px;font-size:26px;font-weight:700;color:var(--gray-900)}.admin-content{display:flex;gap:20px;flex-wrap:wrap}.admin-users{flex:1 1 320px;max-width:380px}.admin-detail{flex:1 1 460px;max-height:60vh;overflow-y:auto}.admin-table{width:100%;border-collapse:collapse;font-size:14px}.admin-table th,.admin-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--light-border)}.admin-table tbody tr{cursor:pointer;transition:background .2s ease}.admin-table tbody tr:hover{background:rgba(148,163,184,.12)}.admin-table tbody tr.selected{background:rgba(59,130,246,.12)}.admin-user-email{font-weight:600;color:var(--gray-800)}.admin-user-meta{font-size:12px;color:var(--gray-500)}.admin-detail-header{display:flex;flex-direction:column;gap:4px;margin-bottom:16px}.admin-detail-email{font-size:16px;font-weight:600}.admin-detail-meta{font-size:13px;color:var(--gray-600)}.admin-board{border:1px solid var(--light-border);border-radius:14px;background:#fff;box-shadow:0 18px 35px rgba(15,23,42,.08);margin-bottom:16px}.admin-board summary{list-style:none;cursor:pointer;padding:14px 18px;font-weight:600;color:var(--gray-800);display:flex;justify-content:space-between;align-items:center}.admin-board summary::-webkit-details-marker{display:none}.admin-board[open] summary{border-bottom:1px solid var(--light-border)}.admin-board__body{padding:18px;display:flex;flex-direction:column;gap:16px}.admin-board__meta{display:flex;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--gray-600)}.admin-board__tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.admin-tile{border:1px solid var(--light-border);border-radius:12px;background:#fff;padding:10px;display:flex;flex-direction:column;gap:8px;box-shadow:0 10px 18px rgba(15,23,42,.06)}.admin-tile img{width:100%;height:100px;object-fit:cover;border-radius:8px;background:#f8fafc}.admin-tile-placeholder{width:100%;height:100px;border-radius:8px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--gray-500)}.admin-tile-label{font-size:13px;font-weight:600;color:var(--gray-800)}.admin-tile audio{width:100%}.admin-empty{padding:24px;text-align:center;background:#fff;border:1px solid var(--light-border);border-radius:12px;color:var(--gray-600)}.admin-guest__table .admin-empty{padding:16px;border-style:dashed;font-size:13px}.admin-page .verify-banner{width:min(1160px,calc(100% - 32px));margin:0 auto}.admin-guests{display:flex;flex-direction:column;gap:16px}.admin-guests__header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.admin-guests__meta{display:flex;gap:12px;font-size:13px;color:var(--gray-600);flex-wrap:wrap;justify-content:flex-end}.admin-guest{border:1px solid var(--light-border);border-radius:14px;background:#fff;box-shadow:0 18px 35px rgba(15,23,42,.08)}.admin-guest summary{list-style:none;cursor:pointer;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px}.admin-guest summary::-webkit-details-marker{display:none}.admin-guest[open] summary{border-bottom:1px solid var(--light-border)}.admin-guest__summary{width:100%;display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.admin-guest__id{font-weight:600;color:var(--gray-800)}.admin-guest__meta{font-size:13px;color:var(--gray-600);margin-top:4px}.admin-guest__counts{display:flex;gap:12px;font-size:13px;color:var(--gray-600);flex-wrap:wrap;justify-content:flex-end}.admin-guest__body{padding:18px;border-top:1px solid var(--light-border)}.admin-guest__grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.admin-guest__column{display:flex;flex-direction:column;gap:12px}.admin-guest__column h5{margin:0 0 12px;font-size:14px;color:var(--gray-700);text-transform:uppercase;letter-spacing:.04em}.admin-guest__media-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.admin-guest__media-grid figure{margin:0;display:flex;flex-direction:column;gap:6px}.admin-guest__media-grid img{width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:10px;background:#f8fafc}.admin-guest__file{font-size:13px;font-weight:600;color:var(--gray-800);word-break:break-all}.admin-guest__file-meta{font-size:12px;color:var(--gray-500)}.admin-guest__audio-list{display:flex;flex-direction:column;gap:12px}.admin-guest__audio-item audio{width:100%;margin-top:8px}.admin-guest__table-wrapper{overflow-x:auto}.admin-guest__table{width:100%;border-collapse:collapse;font-size:13px}.admin-guest__table th,.admin-guest__table td{border:1px solid var(--light-border);padding:12px;vertical-align:top;background:#fff}.admin-guest__table th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-500)}.admin-guest__image{display:flex;flex-direction:column;gap:8px}.admin-guest__image img{width:100%;max-width:220px;border-radius:12px;object-fit:cover;background:#f8fafc}@media (max-width: 640px){.admin-guests__header{flex-direction:column;align-items:flex-start}.admin-guests__meta{justify-content:flex-start}.admin-guest__summary{flex-direction:column}.admin-guest__counts{justify-content:flex-start}}@media (max-width: 520px){.boards-modal,.handoff-modal,.session-modal,.ai-modal,.admin-modal{padding:22px!important}.board-card__actions .primary,.board-card__actions .btn,.session-modal .session-buttons .primary{min-width:100%}}.modal.light.auth-modal .modal-header{align-items:flex-start;gap:12px}.modal.light.auth-modal .modal-body{display:flex;flex-direction:column;gap:16px;padding:0;width:100%}@media (max-width: 480px){.auth-modal{max-width:100%!important;padding:20px!important}.modal.light.auth-modal .modal-body{gap:14px}.modal.light.auth-modal .modal-header{gap:8px}}.boards-modal{max-width:480px!important;width:100%;padding:24px!important;display:flex;flex-direction:column;gap:16px}.handoff-modal{max-width:420px!important;width:100%;padding:24px!important;gap:18px}.handoff-modal .modal-body{display:flex;flex-direction:column;gap:14px}.handoff-modal .modal-actions{justify-content:flex-end}.boards-list{display:flex;flex-direction:column;gap:12px;max-height:320px;overflow-y:auto}.boards-list ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.board-item{display:flex;align-items:center;justify-content:space-between;background:var(--gray-50);border:1px solid var(--gray-200);border-radius:12px;padding:12px 16px}.board-item.current{border-color:var(--blue-300);background:var(--blue-50)}.board-name{font-weight:600;color:var(--gray-900)}.board-updated{font-size:13px;color:var(--gray-500);margin-top:2px}.board-tag{display:inline-flex;align-items:center;gap:4px;margin-top:6px;padding:2px 8px;border-radius:999px;background:rgba(37,99,235,.15);color:var(--blue-600);font-size:12px;font-weight:600}.board-actions{display:flex;flex-wrap:wrap;gap:6px}.boards-feedback{margin:0 24px;padding:10px 12px;border-radius:8px;font-weight:600;font-size:14px;color:var(--green-700);background:rgba(34,197,94,.12)}.boards-feedback.error{color:var(--error);background:rgba(244,63,94,.12)}.boards-empty{text-align:center;color:var(--gray-600);font-size:14px;display:grid;gap:6px;padding:16px}.auth-subtitle{margin-top:4px;font-size:14px;color:var(--gray-600);max-width:320px}.auth-form{display:flex;flex-direction:column;gap:14px;width:100%;margin:0;padding:0}.auth-form .primary{width:100%;justify-content:center}.auth-field{display:flex;flex-direction:column;gap:6px;font-weight:600;color:var(--gray-800);font-size:14px;width:100%}.auth-field .muted-input{margin-top:2px;background:var(--gray-50);width:100%}.auth-remember{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--gray-600);font-weight:500;cursor:pointer;user-select:none}.auth-remember input{width:18px;height:18px;accent-color:var(--blue-500);cursor:pointer}.auth-remember span{line-height:1.4}.auth-error{background:rgba(244,63,94,.12);color:var(--error);padding:10px 12px;border-radius:8px;font-weight:600;font-size:14px}.auth-status{background:rgba(34,197,94,.12);color:var(--green-600);padding:10px 12px;border-radius:8px;font-weight:600;font-size:14px}.auth-footer{display:flex;flex-direction:column;gap:8px;padding:0;margin:16px 0 0;width:100%;align-items:flex-start;text-align:left}.auth-link{all:unset;display:inline-flex;align-items:center;cursor:pointer;font-size:14px;font-weight:600;color:var(--blue-600);transition:color .2s ease}.auth-link:hover{color:var(--blue-700)}.auth-link:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:6px}.size-warning-modal{max-width:600px!important;padding:24px!important}.size-warning-modal .modal-body{display:block!important;grid-template-columns:none!important;grid-template-areas:none!important}.image-selection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:20px 0;max-height:300px;overflow-y:auto}.image-selection-item{position:relative;border:3px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;background:#f8f9fa}.image-selection-item.selected{border-color:#4caf50;background:#e8f5e8}.image-selection-item img{width:100%;height:80px;object-fit:cover;border-radius:4px;display:block}.image-selection-item .selection-checkbox{position:absolute;top:4px;right:4px;width:20px;height:20px;background:#fff;border:2px solid #ddd;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(0,0,0,.1)}.image-selection-item.selected .selection-checkbox{background:#4caf50;border-color:#4caf50;color:#fff}.selection-instructions{font-size:14px;color:#666;text-align:center;margin:12px 0}.session-modal .modal-body{display:block!important;grid-template-columns:none!important;grid-template-areas:none!important}.session-modal .modal-title{font-size:24px;margin:0;text-align:center}.session-content{text-align:center;padding:8px 0}.session-message{font-size:16px;line-height:1.6;color:var(--gray-700);margin:0 0 24px;max-width:none}.session-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.session-buttons .primary{min-width:140px;font-size:16px;padding:14px 20px}.modal.light .muted-input{width:100%;max-width:100%;box-sizing:border-box;background:var(--light-panel);border:1px solid var(--light-border);border-radius:10px;color:var(--light-text);padding:10px 12px;backdrop-filter:blur(8px);transition:all .2s ease}.modal.light .muted-input:focus{border-color:var(--blue-300);box-shadow:0 0 0 3px rgba(147,197,253,.2)}.modal.light .row-inline{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;width:100%;max-width:100%;box-sizing:border-box}.modal.light .row-inline .muted-input{flex:1 1 auto;min-width:0;max-width:100%}.modal.light .row-inline select.muted-input{flex:0 1 auto;min-width:120px;max-width:100%}.modal.light .footer{margin-top:6px;display:flex;justify-content:space-between;gap:12px}.modal.light .btn.danger{background:var(--red)!important;border:none!important;color:var(--gray-900)!important;font-weight:600;box-shadow:0 4px 20px rgba(253,202,202,.3)}.modal.light .btn.danger:hover{background:var(--pink-300)!important;transform:translateY(-1px);box-shadow:0 6px 25px rgba(251,113,133,.4)}.button-row{display:flex;gap:8px;width:100%}.button-row button{flex:1;min-width:0}.audio-controls{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.modal.light .primary.orange{background:var(--orange-300);border:1px solid var(--orange-300);color:var(--gray-900);box-shadow:0 4px 20px rgba(251,146,60,.3)}.modal.light .primary.orange:hover{box-shadow:0 6px 25px rgba(251,146,60,.4);transform:translateY(-1px);background:var(--orange-400)}.modal.light .primary.red{background:var(--red);border:1px solid var(--red);color:var(--gray-900);box-shadow:0 4px 20px rgba(251,113,133,.3)}.modal.light .primary.red:hover{box-shadow:0 6px 25px rgba(251,113,133,.4);transform:translateY(-1px);background:var(--pink-300)}.modal.light .btn.secondary{background:var(--gray-100);border:1px solid var(--gray-300);color:var(--gray-700)}.modal.light .btn.secondary:hover{background:var(--gray-200);transform:translateY(-1px)}.modal.light .btn.play-audio{background:var(--yellow-200);border:1px solid var(--yellow-200);color:var(--gray-800);font-weight:600;display:flex;align-items:center;gap:6px;box-shadow:0 4px 20px rgba(251,244,188,.3)}.modal.light .btn.play-audio:hover{background:var(--yellow-300);border-color:var(--yellow-300);transform:translateY(-1px);box-shadow:0 6px 25px rgba(252,211,77,.4)}.waveform{display:flex;align-items:center;gap:2px;margin-right:8px}.waveform-bar{width:3px;height:8px;background:#f59e0b;border-radius:1px;animation:waveform 1.2s ease-in-out infinite}.waveform-bar:nth-child(2){animation-delay:.1s}.waveform-bar:nth-child(3){animation-delay:.2s}.waveform-bar:nth-child(4){animation-delay:.3s}.waveform-bar:nth-child(5){animation-delay:.4s}@keyframes waveform{0%,to{height:8px}50%{height:20px}}.tile-btn{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M11 5L6 9H2v6h4l5 4V5zM15.54 8.46a5 5 0 0 1 0 7.07M17.07 6.93a8 8 0 0 1 0 10.14' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 12 12,pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;transition:transform .1s ease-out,filter .1s ease-out}.tile-btn.touching{transform:scale(.95);filter:brightness(1.1)}@keyframes ripple{0%{transform:scale(0);opacity:.5}to{transform:scale(2);opacity:0}}.tile-btn .ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.6);width:100px;height:100px;animation:ripple .6s ease-out;pointer-events:none}.tile-modal .modal-body{display:grid;gap:16px;grid-template-columns:1fr 1fr;grid-template-areas:"photo upload" "audio audio" "generate generate" "footer footer"}.tile-modal .modal-body>.group:nth-child(1){grid-area:photo}.tile-modal .modal-body>.group:nth-child(2){grid-area:upload}.tile-modal .modal-body>.group:nth-child(3){grid-area:audio;grid-column:1 / -1}.tile-modal .modal-body>.group:nth-child(4){grid-area:generate;grid-column:1 / -1}.tile-modal .modal-body .footer{grid-area:footer}@media (max-width: 440px){.tile-modal .modal-body{grid-template-columns:1fr;grid-template-areas:"photo" "upload" "audio" "generate" "footer"}}@media screen and (max-width: 1366px),(pointer: coarse){.modal-backdrop{align-items:flex-start!important;justify-content:center!important;padding:24px clamp(20px,6vw,48px) 24px clamp(20px,6vw,48px)!important;padding-top:calc(env(safe-area-inset-top,0px) + 24px)!important;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 24px)!important;overflow-y:auto!important}.modal{position:relative!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;margin:0 auto!important;width:min(640px,calc(100% - 48px))!important;max-width:min(640px,calc(100% - 48px))!important;max-height:calc(100vh - 48px)!important;height:auto!important;border-radius:18px!important;border:1px solid var(--light-border)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;transform:none!important;padding:clamp(20px,4vw,28px)!important;box-sizing:border-box!important;box-shadow:0 25px 45px rgba(15,23,42,.25),0 12px 24px rgba(15,23,42,.12)!important}.modal.light{padding:clamp(20px,4vw,28px)!important}.modal-header{position:static!important;margin:0 0 clamp(16px,4vw,24px) 0!important;padding:0!important;background:transparent!important;border:none!important;box-shadow:none!important}.modal-body{flex:1 1 auto!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;padding:0!important;margin:0!important;width:100%!important}.modal-actions{position:static!important;background:transparent!important;border:none!important;padding:clamp(16px,4vw,24px) 0 0 0!important;margin:0!important}.modal.light .modal-body{gap:clamp(12px,3vw,18px)!important}@media (orientation: portrait) and (max-width: 768px){.modal.light .modal-body{grid-template-columns:1fr!important;grid-template-areas:"photo" "upload" "audio" "generate" "footer"!important}}}.welcome{background:var(--light-bg);color:var(--light-text);height:100vh;display:flex;flex-direction:column;position:relative}.welcome:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--light-bg);z-index:-1}.welcome .topbar{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;backdrop-filter:blur(10px);background:var(--yellow-50)}.welcome .brand{display:inline-flex;align-items:center;gap:12px;font-weight:800;color:var(--gray-900)}.brand-btn{all:unset;cursor:pointer;transition:opacity .2s ease}.brand-btn:hover{opacity:.8}.brand-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:8px}.brand-text{font-family:Lexend,sans-serif;font-size:18px;font-weight:600;letter-spacing:-.01em}.topbar-actions{display:flex;align-items:center;gap:12px}.save-actions{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.account-controls{display:flex;align-items:center;gap:12px}.verify-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 24px 16px;padding:12px 16px;border-radius:12px;border:1px solid rgba(37,99,235,.2);background:rgba(37,99,235,.12);color:var(--blue-800);font-size:15px}.verify-banner.error{border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.12);color:var(--error)}.verify-banner.success{border-color:rgba(34,197,94,.3);background:rgba(34,197,94,.12);color:var(--green-700)}.verify-banner-text{display:flex;flex-direction:column;gap:4px}.verify-banner-text strong{font-size:15px}.verify-banner-message{font-size:14px}.verify-banner-button{all:unset;cursor:pointer;color:#1d4ed8;font-weight:600;padding:8px 12px;border-radius:8px;background:rgba(37,99,235,.15);transition:background .2s ease,transform .2s ease}.verify-banner-button:hover:not([disabled]){background:rgba(37,99,235,.25);transform:translateY(-1px)}.verify-banner-button:disabled{opacity:.6;cursor:default}@media (max-width: 640px){.verify-banner{flex-direction:column;align-items:flex-start;gap:8px;margin:0 12px 16px}.verify-banner-button{width:100%;text-align:center}}.save-feedback{font-size:13px;font-weight:600;color:var(--green-600)}.save-feedback.error{color:var(--error)}.topbar-link{all:unset;cursor:pointer;font-family:Lexend,sans-serif;font-size:15px;font-weight:600;color:var(--blue-600);padding:6px 12px;border-radius:8px;transition:background-color .2s ease,color .2s ease}.topbar-link:hover{background:rgba(59,130,246,.12);color:var(--blue-700)}.topbar-link:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.topbar-link[disabled]{cursor:default;opacity:.6}.welcome .hero-wrap{flex:0 1 auto;display:flex;align-items:flex-start;justify-content:center;padding:12px 24px 6px}.welcome .hero-card{background:var(--purple-50);border:1px solid var(--light-border);border-radius:16px;box-shadow:0 20px 50px rgba(15,23,42,.08),0 4px 12px rgba(15,23,42,.04);width:min(1000px,92%);padding:28px;backdrop-filter:blur(10px)}.welcome .hero{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}.welcome .hero-left{display:flex;flex-direction:column}@media (max-width: 768px){.welcome .hero{display:flex;flex-direction:column;gap:20px;align-items:center;text-align:center}.welcome .hero-left{width:100%;order:1}.welcome .hero-title,.welcome .hero-content{width:100%}.welcome .art{width:100%;order:2}.welcome .cta{padding:16px 32px;font-size:18px;font-weight:700;width:fit-content;margin-top:8px}}.welcome h1{margin:0 0 12px;font-size:clamp(28px,3.4vw,42px);line-height:1.1;color:var(--gray-900);font-weight:800}.welcome p{margin:0 0 16px;color:var(--light-text-secondary);font-size:16px;line-height:1.6}.welcome .cta{background:var(--blue-300);border:1px solid var(--blue-300);padding:12px 16px;color:var(--gray-900);border-radius:12px;font-weight:700;box-shadow:0 4px 20px rgba(147,197,253,.3);transition:all .2s ease}.welcome .cta:hover{box-shadow:0 6px 25px rgba(147,197,253,.4);transform:translateY(-1px);background:var(--blue-400)}.welcome .cta:focus-visible{outline:3px solid var(--blue-400);outline-offset:2px}.welcome .art{width:100%;aspect-ratio:16/12;background:var(--yellow-50);border:1px solid #e5e7eb;border-radius:12px;display:grid;place-items:center;overflow:hidden}.setup{background:var(--light-bg);color:var(--light-text);height:100vh;display:flex;flex-direction:column;position:relative}.setup:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--light-bg);z-index:-1}.setup .topbar{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;backdrop-filter:blur(10px);background:var(--yellow-50)}.setup .brand{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--gray-900)}.setup .hero-wrap{flex:0 1 auto;display:flex;align-items:flex-start;justify-content:center;padding:12px 24px 6px}.setup .hero-card{background:var(--purple-50);border:1px solid var(--light-border);border-radius:16px;box-shadow:0 20px 50px rgba(15,23,42,.08),0 4px 12px rgba(15,23,42,.04);width:min(1000px,92%);padding:28px;backdrop-filter:blur(10px)}.editor .hero-card{background:var(--purple-50);border:1px solid var(--light-border);border-radius:16px;box-shadow:0 20px 50px rgba(15,23,42,.08),0 4px 12px rgba(15,23,42,.04);width:min(1400px,95%);padding:28px;backdrop-filter:blur(10px)}.setup .content{display:grid;grid-template-columns:1fr;gap:20px;align-items:start;max-width:680px;margin:0 auto}.setup h2{margin:0 0 12px;font-size:24px;color:var(--gray-900);font-weight:700}.segmented{display:inline-flex;border:1px solid #cbd5e1;border-radius:10px;overflow:hidden}.segmented button{background:#f8fafc;border:none;padding:10px 14px;cursor:pointer}.segmented button.active{background:var(--accent);color:var(--gray-900)}.stepper{display:inline-flex;border:1px solid #cbd5e1;border-radius:10px;overflow:hidden}.stepper button{background:#f8fafc;border:none;width:40px;height:40px;font-weight:800;cursor:pointer}.stepper input{width:64px;text-align:center;border:none;outline:none;font-size:16px}.preview-panel{background:#f8fafc;border:1px dashed #e5e7eb;border-radius:12px;padding:12px}.option-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.option-card{display:grid;grid-template-rows:auto auto;gap:8px;align-items:center;justify-items:center;padding:14px;background:var(--light-panel);border:2px solid var(--light-border);border-radius:12px;cursor:pointer;transition:all .2s ease;backdrop-filter:blur(8px);aspect-ratio:1}.option-card:hover{border-color:var(--green-300);box-shadow:0 4px 12px rgba(187,247,208,.15)}.option-card.active{border-color:var(--blue-300);box-shadow:0 0 0 3px rgba(147,197,253,.2),0 8px 25px rgba(147,197,253,.15);background:linear-gradient(135deg,var(--light-panel) 0%,rgba(147,197,253,.03) 100%)}.option-card svg{width:80%;height:80%;display:block;aspect-ratio:1;margin:auto}.option-title{font-weight:700;color:#111827}.select-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.setup select{background:var(--light-panel);color:var(--light-text);border:1px solid var(--light-border);padding:12px 14px;border-radius:12px;font-size:16px;backdrop-filter:blur(8px);transition:all .2s ease}.setup select:focus{border-color:var(--blue-300);box-shadow:0 0 0 3px rgba(147,197,253,.2)}.setup .primary{background:var(--blue-300);border-color:var(--blue-300);box-shadow:0 4px 20px rgba(147,197,253,.3);transition:all .2s ease;color:var(--gray-900);font-weight:600}.setup .primary:hover{box-shadow:0 6px 25px rgba(147,197,253,.4);transform:translateY(-1px);background:var(--blue-400)}.setup .primary:disabled{opacity:.6;cursor:not-allowed}.editor .primary{background:var(--blue-300);border-color:var(--blue-300);box-shadow:0 4px 20px rgba(147,197,253,.3);color:var(--gray-900);font-weight:600}.editor .primary:hover{box-shadow:0 6px 25px rgba(147,197,253,.4);transform:translateY(-1px);background:var(--blue-400)}.editor .primary.green{background:var(--green-300);border-color:var(--green-300);box-shadow:0 4px 20px rgba(134,239,172,.3);color:var(--gray-900);font-weight:600}.editor .primary.green:hover{box-shadow:0 6px 25px rgba(134,239,172,.4);transform:translateY(-1px);background:var(--green-400)}.select-row{transition:opacity .15s ease}.select-row.fading{opacity:.3}.option-card{transition:opacity .15s ease}.option-card.fading-out{opacity:.3}@supports not (width: min(1px,1px)){.welcome{height:100%;min-height:100%;position:relative}.welcome .hero-wrap{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.welcome .hero-card{width:92%;max-width:1000px;margin:0 auto}.setup{height:auto;min-height:100%;position:relative}.setup .hero-wrap{flex:0 1 auto;overflow:visible;padding-bottom:20px}.setup .hero-card{width:92%;max-width:1000px;margin:0 auto}.preview-container{width:100%!important;max-width:100%!important}.preview-container .option-card{width:100%!important;max-width:160px!important;margin:0 auto!important}.editor .hero-card{width:95%;max-width:1400px;margin:0 auto}}@supports (-webkit-overflow-scrolling: touch) and (not (width: min(1px,1px))){html,body,#root{height:100%;position:relative}.welcome .footer,.setup .footer,.editor .footer{position:relative;z-index:10;background:var(--bg)}.welcome{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column}.setup{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;height:auto!important}.welcome .hero-wrap{-webkit-flex:1 1 auto;flex:1 1 auto;display:-webkit-flex;display:flex;-webkit-align-items:flex-start;align-items:flex-start;-webkit-justify-content:center;justify-content:center}.setup .hero-wrap{-webkit-flex:0 1 auto;flex:0 1 auto;display:-webkit-flex;display:flex;-webkit-align-items:flex-start;align-items:flex-start;-webkit-justify-content:center;justify-content:center;overflow:visible!important}.welcome .hero-card,.setup .hero-card,.editor .hero-card{position:relative;z-index:1}}@supports (-webkit-touch-callout: none) and (not (width: min(1px,1px))){.welcome{min-height:-webkit-fill-available}.setup{min-height:100%;height:auto}.setup svg{max-width:100%;height:auto}.preview-container{display:block!important;text-align:center!important}.preview-container svg{width:160px!important;height:160px!important;max-width:100%!important}}@supports not (aspect-ratio: 1){.board .tile{position:relative;width:100%;padding-bottom:100%;height:0}.board .tile>*{position:absolute;top:0;left:0;right:0;bottom:0}.welcome .art{position:relative;width:100%;padding-bottom:75%;height:0}.welcome .art>*{position:absolute;top:0;left:0;right:0;bottom:0}.option-card{position:relative;padding-bottom:100%;height:0}.option-card>*{position:absolute;top:0;left:0;right:0;bottom:0}.preview-container .option-card{padding-bottom:0;height:160px;width:160px;position:relative}.preview-container .option-card>*{position:static}}@supports not (gap: 1px){.toolbar>*+*{margin-left:8px}.modal-actions>*+*{margin-left:8px}.grid-controls>*+*{margin-left:8px}.quick-templates>*+*{margin-left:8px}.welcome .hero{grid-gap:24px}.setup .content{grid-gap:20px}.option-row,.select-row{grid-gap:16px}.modal-body{grid-gap:12px}}@supports not (backdrop-filter: blur(1px)){.topbar,.welcome .topbar,.setup .topbar{background:rgba(254,249,195,.95)!important}.welcome .hero-card,.setup .hero-card,.editor .hero-card{background:rgba(243,232,255,.95)!important}.modal-backdrop{background:rgba(15,23,42,.7)!important}.modal{background:rgba(255,255,255,.98)!important}.option-card{background:rgba(255,255,255,.95)!important}}@supports not (place-items: center){.cell .add-cta,.tile-empty{display:-webkit-flex!important;display:flex!important;-webkit-align-items:center!important;align-items:center!important;-webkit-justify-content:center!important;justify-content:center!important;text-align:center!important}}@supports not (inset: 0){.cell .add-cta,.tile-label.overlay{top:0!important;right:0!important;bottom:0!important;left:0!important}}