@use 'variables';@use 'legacy';@font-face{font-family:'KPMG';src:url("../fonts/KPMG-Bold.eot");src:url("../fonts/KPMG-Bold.eot?#iefix") format("embedded-opentype"),url("../fonts/KPMG-Bold.woff2") format("woff2"),url("../fonts/KPMG-Bold.woff") format("woff"),url("../fonts/KPMG-Bold.ttf") format("truetype");font-weight:bold;font-style:normal;font-display:swap}:root{--main-color: #1E49E2;--text-color: #0C233C;--sabias-color: #666;--bg-color: transparent}body[data-section="Firma"]{--main-color: #1E49E2}body[data-section="Negocio"]{--main-color: #7213EA}body[data-section="Personas"]{--main-color: #FD349C}body[data-section="Valores"]{--main-color: #00C0AE}.navigation-controls,.bottom-controls,.card-footer{display:none}.card-number{display:none}h1,h2,h3,h4,h5,h6{margin:0;padding:0}body{font-family:'Arial', sans-serif;font-size:1.2rem;min-height:100vh;min-height:100dvh;color:var(--text-color);background-color:var(--bg-color);padding:0;margin:0}body .card-container{min-height:100vh;min-height:100dvh;height:100vh;height:100dvh;padding:10px;box-sizing:border-box;padding-top:25px;padding-bottom:25px}body .card-container .card{padding:16px;border:3px solid var(--main-color);border-radius:40px;height:100%;box-sizing:border-box;display:flex;flex-direction:column}body .card-container .card .card-header{font-family:'KPMG', sans-serif;text-align:center;margin-bottom:40px;flex:0 0 auto}body .card-container .card .card-header h2{font-size:2.4rem;line-height:2rem}body .card-container .card .card-header h3{font-size:2.5rem;color:var(--main-color);text-transform:uppercase}body .card-container .card .editor-summary__metrics{display:flex;flex-wrap:wrap;gap:1.25rem;margin:0}body .card-container .card .editor-summary__metrics span{font-weight:600;color:#38bdf8}body .card-container .card .editor-settings{display:flex;flex-wrap:wrap;gap:1rem}body .card-container .card .editor-settings__group{flex:1 1 220px;background:rgba(15,23,42,0.6);border:1px solid rgba(148,163,184,0.35);border-radius:12px;padding:1rem}body .card-container .card .editor-settings__group h4{margin:0 0 0.75rem;font-size:0.95rem;letter-spacing:0.01em;color:#f8fafc}body .card-container .card .editor-settings__field{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:0.75rem}body .card-container .card .editor-settings__field label{font-size:0.85rem;color:#cbd5f5}body .card-container .card .editor-settings__field small{font-size:0.75rem;color:rgba(203,213,225,0.8)}body .card-container .card .editor-settings__field input,body .card-container .card .editor-settings__field select{background:rgba(15,23,42,0.8);color:#f8fafc;border:1px solid rgba(148,163,184,0.5);border-radius:8px;padding:0.4rem 0.6rem}body .card-container .card .editor-settings__field input:focus,body .card-container .card .editor-settings__field select:focus{outline:none;border-color:#38bdf8;box-shadow:0 0 0 1px rgba(56,189,248,0.4)}body .card-container .card .editor-settings__options{display:flex;flex-wrap:wrap;gap:0.5rem}body .card-container .card .editor-settings__option{display:inline-flex;align-items:center;gap:0.35rem;background:rgba(15,23,42,0.7);border:1px solid rgba(148,163,184,0.5);border-radius:999px;padding:0.35rem 0.85rem;cursor:pointer;font-weight:600}body .card-container .card .editor-settings__option input{accent-color:#38bdf8}body .card-container .card .card-content{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}body .card-container .card .card-content .question-content{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}body .card-container .card .card-content .question-content>*:not(.answer){flex:0 0 auto}body .card-container .card .card-content .question-content .card-frase{margin-bottom:12px;text-align:center}body .card-container .card .card-content .question-content .pregunta{flex:0 0 auto;color:white;background-color:var(--main-color);font-size:2.5rem;text-align:center;min-height:50px;border-radius:25px;width:100%;font-family:'KPMG', sans-serif;margin-bottom:20px;padding:0}body .card-container .card .card-content .question-content .opciones{text-align:center;flex:0 0 auto}body .card-container .card .card-content .question-content .opciones span{font-family:'KPMG', sans-serif;color:var(--main-color);font-size:2rem;display:block}body .card-container .card .card-content .question-content .answer{flex:1 1 auto;overflow-y:auto;padding:1rem;margin-top:30px;color:var(--sabias-color)}body .card-container .card .card-content .question-content .answer .sabias{font-size:1.5rem;line-height:2rem}body[data-type="Cuenta"] .card-container .card .card-content .question-content .opciones{font-family:'KPMG', sans-serif;color:var(--main-color);font-size:2rem}body[data-type="Pinta"] .card-container .card .card-content .question-content .opciones{display:none}body[data-type="Pregunta"] .card-container .card .card-content .question-content .card-frase{margin-bottom:30px;text-align:center}body[data-type="Pregunta"] .card-container .card .card-content .question-content .pregunta{display:none}body[data-type="Pregunta"] .card-container .card .card-content .question-content .opciones{font-family:'KPMG', sans-serif;color:var(--main-color);font-size:2rem;line-height:2rem}body[data-type="Pregunta"] .card-container .card .card-content .question-content .answer{color:var(--text-color)}body[data-type="Pregunta"] .card-container .card .card-content .question-content .answer .sabias{display:none}body[data-type="Pregunta"] .card-container .card .card-content .question-content .answer .feedback span{font-weight:bold;display:block;margin-bottom:10px}body[data-type="Pregunta"] .card-container .card .card-content .question-content .answer .feedback div{margin-bottom:10px}body[data-type="Pregunta"] .card-container .card .card-content .question-content .answer .feedback div strong{color:var(--main-color)}body[data-section="Valores"] .card-container .card .card-content .question-content .card-frase{color:#0C233C;text-align:left}body[data-section="Valores"] .card-container .card .card-content .question-content .pregunta{display:none}body[data-section="Valores"] .card-container .card .card-content .question-content .answer{margin-top:0px}body[data-section="Valores"] .card-container .card .card-content .question-content .answer .sabias{display:none}body[data-section="Valores"] .card-container .card .card-content .question-content .answer .feedback p{margin-top:0px}body[data-section="Valores"] .card-container .card .card-content .question-content .answer .feedback figure{margin:0 0 20px;width:100%;border-radius:0;padding:clamp(1rem, 5vw, 1.25rem)}body[data-section="Valores"] .card-container .card .card-content .question-content .answer .feedback figure img{width:90%;height:auto}body[data-section="Valores"] .card-container .card .card-content .question-content .answer .feedback figure figcaption span{background-color:black;color:white;width:30px;height:30px;border-radius:50%;display:inline-flex;text-align:center;justify-content:center;align-items:center;margin-right:10px}body[data-section="Valores"] .card-container .card .card-content .question-content .answer .feedback video{width:100%;height:auto;margin-bottom:20px}body.game-view{font-family:'Inter', 'Arial', sans-serif;background:radial-gradient(circle at top, #0f172a, #020617 70%);color:#f8fafc;min-height:100vh;margin:0}body.room-gate-active{overflow:hidden}body.room-gate-active .game-board{filter:blur(6px) brightness(0.6);pointer-events:none;user-select:none}.room-gate{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at top, rgba(15,23,42,0.92), rgba(2,6,23,0.94));padding:clamp(1.5rem, 8vw, 3.5rem);z-index:60}.room-gate[hidden]{display:none !important}.room-gate__panel{width:min(540px, 100%);border-radius:1.75rem;padding:clamp(2rem, 6vw, 3.25rem);background:rgba(15,23,42,0.85);border:1px solid rgba(148,163,184,0.35);box-shadow:0 30px 60px rgba(0,0,0,0.4);backdrop-filter:blur(12px);text-align:center}.room-gate__panel .lead{color:rgba(248,250,252,0.8);margin-bottom:1.75rem}.room-gate__hint{margin-top:1rem;font-size:0.9rem;color:rgba(248,250,252,0.7)}.room-gate__hint code{background:rgba(15,23,42,0.65);padding:0.1rem 0.35rem;border-radius:0.35rem;font-size:0.85rem;color:#38bdf8}.game-qr-overlay{position:fixed;inset:0;background:rgba(2,6,23,0.85);display:flex;align-items:center;justify-content:center;padding:clamp(1rem, 5vw, 3rem);z-index:40;opacity:0;pointer-events:none;transition:opacity 0.3s ease}.game-qr-overlay.is-visible{opacity:1;pointer-events:all}.game-qr-panel{position:relative;width:min(480px, 100%);border-radius:28px;padding:clamp(1.5rem, 4vw, 2.75rem);background:rgba(15,23,42,0.9);border:1px solid rgba(148,163,184,0.35);box-shadow:0 25px 60px rgba(2,6,23,0.65);text-align:center}.game-qr-panel h2{margin:0.35rem 0 0.75rem;font-size:clamp(1.5rem, 4vw, 2rem)}.game-qr-panel .eyebrow{text-transform:uppercase;letter-spacing:0.15em;font-size:0.85rem;margin:0;color:rgba(248,250,252,0.85)}.game-qr-close{position:absolute;top:0.75rem;right:0.75rem;width:40px;height:40px;border-radius:999px;border:none;background:rgba(15,23,42,0.75);color:#fff;font-size:1.5rem;cursor:pointer;line-height:1}.game-qr-target{margin:1.25rem auto;padding:clamp(1rem, 4vw, 1.5rem);background:#fff;border-radius:24px;display:inline-flex;justify-content:center;align-items:center}.game-qr-instructions,.game-qr-link-label{margin:0.5rem 0 0;color:rgba(248,250,252,0.85)}.game-qr-link{display:inline-flex;margin-top:0.5rem;color:#93c5fd;font-weight:600;word-break:break-all}.game-board{position:relative;min-height:100vh;overflow:hidden;background:#020617}.game-board__background{position:absolute;inset:0;background-image:var(--board-image, radial-gradient(circle at 20% -20%, rgba(59,130,246,0.45), rgba(2,6,23,0.9)));background-size:var(--board-fit, cover);background-position:center;background-repeat:var(--board-repeat, repeat);filter:saturate(1.1);z-index:0}.game-board__layer{position:absolute;inset:0;pointer-events:none;z-index:2}.game-board__layer--lap-pawns{z-index:2}.game-board__layer--tokens{z-index:3}.game-board__layer--markers{z-index:4;pointer-events:none}.game-board__layer--markers>*{pointer-events:auto}.game-board--manual .game-board__layer{pointer-events:auto}.game-board--manual .game-board__layer--markers{pointer-events:none}.editor-page .game-board__layer--markers{pointer-events:none}.game-board--manual .game-token{cursor:grab}.game-board--manual .game-token:active{cursor:grabbing}.game-token{position:absolute;--token-scale: 1;--token-base-size: clamp(64px, 8vw, 110px);width:calc(var(--token-base-size) * var(--token-scale, 1));height:calc(var(--token-base-size) * var(--token-scale, 1));transform:translate(-50%, -50%);border-radius:999px;border:2px solid transparent;background:var(--token-color, #1e40af);background-image:var(--token-image, none);background-size:cover;background-position:center;outline:6px solid rgba(15,23,42,0.45);box-shadow:0 18px 30px rgba(2,6,23,0.55);display:grid;place-items:center;text-align:center;transition:transform 0.25s ease, box-shadow 0.25s ease}.game-token.has-image{background-color:transparent;border-color:#000;outline:none !important;box-shadow:none}.game-token.has-image span,.game-token.has-image small,.game-token.has-image .game-token__count,.game-token.has-image .game-token__lap{display:none}.game-token--lap{--token-base-size: clamp(48px, 6vw, 80px);outline-color:rgba(251,191,36,0.4);background-color:var(--token-color, #fbbf24);box-shadow:0 12px 24px rgba(2,6,23,0.45)}.game-token--lap.has-image{background-color:transparent;border-color:#000;outline:none !important;box-shadow:none}.game-token--lap span{color:#111827}.game-token--lap small{color:rgba(23,23,23,0.75);font-size:0.65rem}.game-token--marker{--token-base-size: clamp(56px, 7vw, 95px);background:radial-gradient(circle at 32% 22%, rgba(248,113,113,0.95), var(--token-color, #dc2626));border-color:rgba(248,113,113,0.65);outline-color:rgba(127,29,29,0.35);box-shadow:0 18px 36px rgba(127,29,29,0.55)}.game-token--marker span{color:#fff5f5}.game-token--marker small{font-size:0.7rem;color:rgba(255,255,255,0.85)}.game-token__count{position:absolute;bottom:-6px;right:-6px;transform:translate(50%, 50%);background:rgba(15,23,42,0.9);color:#f8fafc;padding:0.1rem 0.45rem;border-radius:999px;font-size:0.65rem;font-weight:600;letter-spacing:0.02em;box-shadow:0 6px 15px rgba(2,6,23,0.35)}.game-token.is-animating{transition:left var(--token-hop-speed, 0.45s) cubic-bezier(0.2, 0.8, 0.25, 1),top var(--token-hop-speed, 0.45s) cubic-bezier(0.2, 0.8, 0.25, 1),transform 0.3s ease}.game-token.is-hopping{animation:token-hop var(--token-hop-speed, 0.45s) ease-out}@keyframes token-hop{0%{transform:translate(-50%, -50%) scale(1);box-shadow:0 18px 30px rgba(2,6,23,0.55)}45%{transform:translate(-50%, -58%) scale(1.08);box-shadow:0 28px 45px rgba(2,6,23,0.55)}100%{transform:translate(-50%, -50%) scale(1);box-shadow:0 18px 30px rgba(2,6,23,0.55)}}.game-token span{font-weight:700;font-size:clamp(1rem, 3vw, 1.5rem);letter-spacing:0.05em;color:#fff}.game-token small{display:block;font-size:0.75rem;margin-top:0.2rem;color:rgba(248,250,252,0.85)}.game-token__lap{position:absolute;top:-12px;right:-12px;transform:translate(50%, -50%);background:rgba(14,165,233,0.9);color:#021227;padding:0.15rem 0.45rem;border-radius:999px;font-size:0.65rem;font-weight:700;letter-spacing:0.02em;box-shadow:0 10px 20px rgba(2,6,23,0.45)}.game-token-group-indicator{position:absolute;transform:translate(-50%, -50%);background:rgba(15,23,42,0.85);color:#f8fafc;padding:0.2rem 0.55rem;border-radius:999px;font-size:0.7rem;font-weight:600;letter-spacing:0.02em;border:1px solid rgba(56,189,248,0.4);box-shadow:0 10px 20px rgba(2,6,23,0.4);pointer-events:none;z-index:2}.game-board__dice{position:absolute;transform:translate(-50%, -50%);--dice-scale: 1;--dice-base-size: clamp(220px, 30vw, 360px);width:var(--dice-base-size);pointer-events:auto;z-index:5}.game-board__dice .dice-widget{width:100%}.game-board__dice .dice-widget canvas{width:100%;height:auto;transform-origin:center;transform:scale(var(--dice-scale, 1))}body.game-view .game-board__dice{display:flex;justify-content:center}body.game-view .game-board__dice .dice-widget{background:none;border-radius:0;padding:0;backdrop-filter:none;box-shadow:none;display:flex;flex-direction:column;align-items:center;width:100%}body.game-view .game-board__dice canvas{width:100%;height:auto}.game-message{position:absolute;inset:0;display:grid;place-items:center;text-align:center;background:rgba(2,6,23,0.65);font-size:1.25rem;line-height:1.6;padding:1rem;z-index:10}.game-message[hidden]{display:none !important}body.admin-page{font-family:'Inter', 'Arial', sans-serif;background:#f1f5f9;color:#0f172a;min-height:100vh;margin:0}.admin-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 2rem}.admin-main{max-width:1400px;margin:0 auto;padding:0 2rem 3rem}.admin-top{display:grid;grid-template-columns:minmax(0, 1.4fr) minmax(0, 0.95fr);gap:1.5rem;margin-bottom:2rem}@media (max-width: 960px){.admin-top{grid-template-columns:1fr}}.admin-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr))}@media (min-width: 1024px){.admin-grid{grid-template-columns:repeat(12, minmax(0, 1fr))}.panel[data-panel='users']{grid-column:span 7}.panel[data-panel='cards']{grid-column:span 12}.panel[data-panel='qr']{grid-column:span 5}.panel[data-panel='activity']{grid-column:span 12}}.panel{background:linear-gradient(135deg, rgba(255,255,255,0.93), rgba(248,250,252,0.8));border:1px solid rgba(148,163,184,0.2);border-radius:1.5rem;padding:1.75rem;box-shadow:0 20px 55px rgba(15,23,42,0.12);backdrop-filter:blur(6px)}.panel-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem}.board-preview{position:relative;border-radius:1.25rem;overflow:hidden;background:#020617;border:2px dashed rgba(15,23,42,0.2);min-height:420px}.board-preview.is-ready{border-color:transparent;box-shadow:0 25px 60px rgba(15,23,42,0.25)}.board-preview__stage{position:relative;width:100%;aspect-ratio:16 / 9;min-height:380px;border-radius:1rem;overflow:hidden;background:#020617}.board-preview__stage .game-board--preview{min-height:100%}.board-preview__stage .game-board__background{filter:saturate(1.15);opacity:0.95}.board-preview__stage .game-board__dice{--dice-base-size: min(28vw, 280px)}.board-preview .game-message{font-size:1rem;background:rgba(2,6,23,0.8)}.board-preview__stage .dice-widget--mini{position:relative;padding:0.9rem;border-radius:1.5rem;background:rgba(15,23,42,0.45);box-shadow:0 18px 40px rgba(2,6,23,0.45)}.dice-widget--mini canvas{width:100%;height:auto;display:block;opacity:0.8}.board-preview__hint{margin:0;margin-top:0.85rem;padding:0.85rem 1rem;background:rgba(15,23,42,0.05);border-radius:1rem;font-size:0.95rem;color:#334155}.profile-controls{margin-top:1rem;display:flex;flex-direction:column;gap:0.75rem}.profile-controls__actions{display:flex;flex-wrap:wrap;gap:0.5rem}.profile-controls__hint{margin:0.35rem 0 0;font-size:0.85rem;color:#94a3b8}.profile-summary{margin:0;padding:0.65rem 0.85rem;border-radius:0.75rem;background:rgba(15,23,42,0.04);font-size:0.9rem;color:#334155}.profile-status{margin:0;font-size:0.85rem;color:#64748b}.profile-status[data-state='busy']{color:#0369a1}.profile-status[data-state='success']{color:#15803d}.dispatch-panel__content{display:flex;flex-direction:column;gap:1.5rem}.dispatch-panel form{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}.card-selector{display:flex;flex-direction:column;gap:0.75rem;min-height:0;flex:1 1 auto;min-height:0}.card-selector__header{display:flex;justify-content:space-between;align-items:baseline;font-size:0.95rem;color:#475569}.dispatch-panel__footer{display:flex;gap:0.75rem;margin-top:auto}.card-selector__list{flex:1 1 auto;min-height:0;max-height:clamp(340px, 62vh, 660px);overflow-y:auto;border-radius:1rem;border:1px solid rgba(15,23,42,0.08);background:rgba(248,250,252,0.65);padding:0.5rem;display:flex;flex-direction:column;gap:0.5rem}.card-row{display:flex;gap:0.75rem;align-items:stretch;padding:0.85rem;border-radius:0.95rem;border:1px solid transparent;background:#fff;box-shadow:0 10px 25px rgba(15,23,42,0.06);cursor:pointer;transition:border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease}.card-row:focus-within,.card-row:hover{border-color:rgba(98,56,245,0.45);box-shadow:0 16px 30px rgba(15,23,42,0.12)}.card-row.is-selected{border-color:#6238f5;box-shadow:0 18px 35px rgba(98,56,245,0.2)}.card-row__info{flex:1;display:flex;flex-direction:column;gap:0.35rem}.card-row__label{font-weight:600;color:#0f172a}.card-row__meta{display:inline-flex;gap:0.4rem;font-size:0.85rem;color:#6366f1}.card-row__question{margin:0;font-size:0.85rem;color:#64748b;line-height:1.4;display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-row__preview{align-self:center;flex-shrink:0;font-size:0.85rem;padding:0.5rem 0.9rem}@keyframes appear{to{transform:scale3d(1, 1, 1);opacity:1}}@keyframes appear-again{to{transform:scale3d(1, 1, 1);opacity:1}}.card-preview-pane{--size: max(5px, 1vmin);--height: 80em;--pad: 1.25em;--border-radius: 6.666em;--gutter: calc(var(--pad) * 2);--scene-pad: 5vmin;--bg-blur: 0.333em;--button-width: 0.333em;--notch-height: 3.33em;--notch-width: 33.3%;--notch-radius: calc(var(--border-radius) - calc(var(--pad) * 2));--notch-duration: 0.333s;--ease: cubic-bezier(0.666, 0, 0.4, 1);--ease-spring: cubic-bezier(0.666, 0, 0.4, 1.2);--ease-out: cubic-bezier(0.15, 0, 0.333, 1);--border-width: 0.4em;--deep-purple: 284;--gold: 22.5;--space-black: 215;--silver: 254;--c-h: var(--deep-purple);--c-s: 100%;--c-l: 50%;--r-h: 0deg;--r-s: 60%;--r-l: 70%;flex:0 0 auto;border-radius:1.25rem;border:1px solid rgba(15,23,42,0.25);background:radial-gradient(circle at top, rgba(99,102,241,0.2), rgba(2,6,23,0.95));padding:clamp(1rem, 2vw, 1.5rem);display:flex;flex-direction:column;gap:1.25rem;min-height:100%;color:#f8fafc;font-family:'Inter', 'Arial', sans-serif}.card-preview-pane__intro{display:flex;justify-content:space-between;align-items:baseline}.card-preview-pane__hint{margin:0;font-size:0.85rem;color:rgba(248,250,252,0.75);text-align:center}.card-preview-scene{display:flex;justify-content:center}.card-preview-pane input[type='radio'],.card-preview-pane input[type='checkbox']{display:none}.card-preview-pane .scene{display:flex;flex-wrap:wrap;gap:3em 0;align-items:center;align-content:center;justify-content:center;min-height:clamp(420px, 55vh, 640px);font-size:var(--size);padding:var(--scene-pad);box-sizing:border-box}.card-preview-pane .phone-con{flex-basis:100%;display:flex;justify-content:center}.card-preview-pane .phone{position:relative;z-index:1;aspect-ratio:37 / 76;background:#000;height:var(--height);border-radius:var(--border-radius);box-shadow:0 0 0.1em 0.25em hsl(var(--c-h), 20%, 25%),0 0 0 var(--border-width) hsl(var(--c-h), 30%, 85%);box-sizing:border-box;opacity:0;transform:scale3d(1.1, 1.1, 1);animation:appear 1s var(--ease-out) forwards;backface-visibility:hidden}.card-preview-pane .phone:before{content:'';position:absolute;top:var(--border-radius);right:calc(var(--border-width) * -1);bottom:var(--border-radius);left:calc(var(--border-width) * -1);border:0.5em solid hsl(var(--c-h), 20%, 30%);border-left-width:0;border-right-width:0}.card-preview-pane .buttons{position:absolute;inset:calc(var(--border-width) * -1);pointer-events:none}.card-preview-pane .buttons .left,.card-preview-pane .buttons .right{position:absolute;width:var(--button-width);display:flex;flex-direction:column;align-items:stretch;gap:1.5em}.card-preview-pane .buttons .left{right:100%;top:calc(var(--border-radius) * 2)}.card-preview-pane .buttons .left .button:nth-child(1){height:3em;margin-bottom:0.5em}.card-preview-pane .buttons .right{left:100%;transform:scale3d(-1, 1, 1);top:calc(var(--border-radius) * 3)}.card-preview-pane .buttons .right .button{height:9.5em}.card-preview-pane .buttons .button{background:hsl(var(--c-h), 20%, 95%);height:6em;box-shadow:inset -0.15em 0 0.1em #000,inset 0 0 0.1em hsl(var(--c-h), 30%, 90%),inset 0 0.2em 0.1em hsl(var(--c-h), 30%, 90%),inset 0 -0.2em 0.1em hsl(var(--c-h), 30%, 90%),inset -0.1em 0.333em 0.1em rgba(0,0,0,0.5),inset -0.1em -0.333em 0.1em rgba(0,0,0,0.5);border-top-left-radius:0.2em;border-bottom-left-radius:0.2em}.card-preview-pane .screen-container{position:absolute;inset:0;border-radius:var(--border-radius);border:var(--pad) solid #000;display:flex;flex-direction:column;align-items:center;gap:calc(var(--pad) * 2)}.card-preview-pane .screen-container:before{content:'';position:absolute;z-index:2;background:#fff;width:36.6%;bottom:calc(var(--pad) * 0.75);height:calc(var(--pad) * 0.5);border-radius:calc(var(--pad) * 0.25);filter:drop-shadow(0 0.1em 0.25em rgba(0,0,0,0.1))}.card-preview-pane .bg{position:absolute;inset:0;background:#000;border-radius:calc(var(--border-radius) - var(--pad));overflow:hidden;transform:translateZ(0)}.card-preview-pane .bg>*{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;transition:opacity 1s var(--ease-out) 0.5s;background:#000}.card-preview-pane .bg .section{--g-h: var(--c-h);--g-s: var(--c-s);--g-l: var(--c-l);flex-grow:1;position:relative;overflow:hidden;border-radius:calc(var(--border-radius) - var(--pad));border-bottom-left-radius:20em;border-bottom-right-radius:20em}.card-preview-pane .bg .section:before{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(120% 110% at 50% 92.5%, hsla(0deg, 0%, 0%, 1) 33.3%,hsla(0deg, 0%, 0%, .738) 45.973%,hsla(0deg, 0%, 0%, .541) 55.978%,hsla(0deg, 0%, 0%, .382) 64.649%,hsla(0deg, 0%, 0%, .278) 70.9855%,hsla(0deg, 0%, 0%, .194) 76.655%,hsla(0deg, 0%, 0%, .126) 81.991%,hsla(0deg, 0%, 0%, .075) 86.7934%,hsla(0deg, 0%, 0%, .042) 90.7287%,hsla(0deg, 0%, 0%, .021) 93.997%,hsla(0deg, 0%, 0%, .008) 96.7984%,hsla(0deg, 0%, 0%, .002) 98.7994%,hsla(0deg, 0%, 0%, 0) 100%),radial-gradient(100% 66.6% at 110% var(--g-hue-adjust-2-y, 100%), hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, 1) 33.3%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .738) 45.973%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .541) 55.978%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .382) 64.649%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .278) 70.9855%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .194) 76.655%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .126) 81.991%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .075) 86.7934%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .042) 90.7287%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .021) 93.997%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .008) 96.7984%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .002) 98.7994%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, 0) 100%),radial-gradient(100% 66.6% at -10% var(--g-hue-adjust-2-y, 100%), hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, 1) 33.3%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .738) 45.973%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .541) 55.978%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .382) 64.649%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .278) 70.9855%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .194) 76.655%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .126) 81.991%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .075) 86.7934%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .042) 90.7287%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .021) 93.997%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .008) 96.7984%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, .002) 98.7994%,hsla(calc(var(--g-h) - var(--g-hue-adjust-2, var(--g-hue-adjust))),100%,50%, 0) 100%),radial-gradient(150% 100% at 50% 80%, hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), 0) 35%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .262) 47.35%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .459) 57.1%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .618) 65.55%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .722) 71.725%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .806) 77.25%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .874) 82.45%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .925) 87.13%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .958) 90.965%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .979) 94.15%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .992) 96.88%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), .998) 98.83%,hsla(calc(var(--g-h) + 33.3),100%,var(--g-lightness, 82.5%), 1) 100%);background-color:hsl(var(--g-h), var(--g-s), var(--g-l));transform:scale3d(1.1, 1.25, 1);transform-origin:bottom;transition:transform 1s var(--ease-out) 0.5s}.card-preview-pane .bg .section:after{content:'';position:absolute;inset:0;border:var(--border-width) solid rgba(255,255,255,0.8);border-radius:inherit;filter:blur(0.05em);mask-image:radial-gradient(100% 100% at 50% 70%, #000 30%, transparent 50%);transform:translateZ(2px)}.card-preview-pane .bg .section .glow{position:absolute;inset:0;border-radius:inherit;mix-blend-mode:overlay;z-index:1;background:radial-gradient(80% 150% at 50% 100%, hsl(var(--g-h), 100%, var(--g-l)), transparent 70%)}.card-preview-pane .bg .section:last-of-type{--g-h: calc(var(--c-h) - var(--g-hue-adjust, 0));--g-l: calc(var(--c-l) + 40%);--g-lightness: 95%;transform:scale3d(1, -1, 1) translateZ(1px)}.card-preview-pane .notch-container{position:absolute;z-index:3;top:var(--pad);right:var(--pad);left:var(--pad);display:flex;justify-content:center;height:100%;max-height:calc(var(--notch-radius) * 2);pointer-events:none;outline:none;transition:var(--notch-duration) var(--ease);transition-property:max-height, max-width, filter, transform;will-change:max-width, max-height, filter}body.is-resizing .card-preview-pane .notch-container,body.is-resizing .card-preview-pane .notch-container *{transition:none}.card-preview-pane .notch-container:hover,.card-preview-pane .notch-container:focus-within{--shadow-opacity: 0.5;transition-timing-function:var(--ease-spring)}.card-preview-pane .notch-container:hover .content,.card-preview-pane .notch-container:focus-within .content{--content-padding: 2em}.card-preview-pane .notch-container:hover .content .text,.card-preview-pane .notch-container:focus-within .content .text{opacity:1}.card-preview-pane .notch-container:hover .notch,.card-preview-pane .notch-container:focus-within .notch{max-width:100%;max-height:100%;pointer-events:all;transform:scale3d(1, 1, 1)}.card-preview-pane .notch-container:hover ~ .notch-blur,.card-preview-pane .notch-container:focus-within ~ .notch-blur{opacity:1;max-height:calc(var(--notch-radius) * 3.333 + var(--pad))}.card-preview-pane .notch-container:focus-within{max-height:calc(var(--notch-radius) * 3);--bar-height: 1em;--bar-opacity: 1}.card-preview-pane .notch-container:focus-within .left,.card-preview-pane .notch-container:focus-within .right{max-height:calc(100% - var(--bar-height, 0%) - var(--content-gap))}.card-preview-pane .notch-container:focus-within ~ .notch-blur{max-height:calc(var(--notch-radius) * 5);opacity:1}.card-preview-pane .notch-blur{position:absolute;z-index:2;top:calc(var(--pad) - 3px);right:calc(var(--pad) - 3px);left:calc(var(--pad) - 3px);height:100%;max-height:calc(var(--notch-radius) * 1.5);backdrop-filter:blur(0.2em);mask-image:linear-gradient(to bottom, hsla(0deg, 0%, 0%, 1) 60%,hsla(0deg, 0%, 0%, .738) 67.6%,hsla(0deg, 0%, 0%, .541) 73.6%,hsla(0deg, 0%, 0%, .382) 78.8%,hsla(0deg, 0%, 0%, .278) 82.6%,hsla(0deg, 0%, 0%, .194) 86%,hsla(0deg, 0%, 0%, .126) 89.2%,hsla(0deg, 0%, 0%, .075) 92.08%,hsla(0deg, 0%, 0%, .042) 94.44%,hsla(0deg, 0%, 0%, .021) 96.4%,hsla(0deg, 0%, 0%, .008) 98.08%,hsla(0deg, 0%, 0%, .002) 99.28%,hsla(0deg, 0%, 0%, 0) 100%);opacity:0;border-radius:calc(var(--border-radius) - var(--pad));transition:var(--notch-duration) var(--ease);transition-property:max-height, max-width, opacity, transform;will-change:max-width, max-height}.card-preview-pane .notch{position:relative;border-radius:var(--notch-radius);pointer-events:all;overflow:hidden;color:#fff;display:flex;cursor:pointer;width:100%;transition:inherit;transition-property:inherit;will-change:inherit;filter:drop-shadow(0 1em 2em hsla(0 0% 0% / var(--shadow-opacity, 0)));transform:scale3d(0.375, 0.4, 1);transform-origin:top}.card-preview-pane .notch:before{content:'';position:absolute;inset:0;background:#000;filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1'><defs><filter id='round'><feGaussianBlur in='SourceGraphic' stdDeviation='5' result='blur' /><feColorMatrix in='blur' mode='matrix' values='1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9' result='goo'/><feComposite in='SourceGraphic' in2='goo' operator='atop'/></filter></defs></svg>#round");border-radius:inherit}.card-preview-pane .content{--content-padding: 1.75em;--duration-height: 0.5em;--content-gap: 1em;width:100%;display:flex;flex-wrap:wrap;align-items:stretch;justify-content:stretch;padding:var(--content-padding);gap:var(--content-gap);font-size:125%;transition-property:padding;will-change:padding;position:relative}.card-preview-pane .content .left,.card-preview-pane .content .right{height:100%;max-height:calc(100% - var(--bar-height, 0%));display:flex;align-items:center;gap:1em}.card-preview-pane .content,.card-preview-pane .content .left,.card-preview-pane .content .right,.card-preview-pane .content .bar,.card-preview-pane .content .text{transition:var(--notch-duration) var(--ease-out)}.card-preview-pane .content .left,.card-preview-pane .content .right,.card-preview-pane .content .bar{transition-property:max-height, opacity;will-change:max-height}.card-preview-pane .content .left{flex-grow:2}.card-preview-pane .content .text{display:flex;flex-direction:column;gap:0.333em;transition-property:opacity;opacity:var(--bar-opacity, 0)}.card-preview-pane .content .text:before{content:attr(data-card-title);order:1;text-transform:uppercase}.card-preview-pane .content .text:after{order:2;content:attr(data-card-code);opacity:0.5}.card-preview-pane .content .right{flex-grow:1}.card-preview-pane .content .tile{background:#1a1ab3;height:100%;aspect-ratio:1;border-radius:33.3%;position:relative}.card-preview-pane .content .tile:before{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(50% 50% at 55% 40%, #131386, #cd1385 75%, transparent) center/133.3% 133.3%;background-color:yellow;filter:blur(0.05em)}.card-preview-pane .content .bar{display:flex;align-items:center;gap:1em;flex-basis:100%;height:100%;max-height:var(--bar-height, 0%);color:rgba(255,255,255,0.5);opacity:var(--bar-opacity, 0)}.card-preview-pane .content .bar .duration{position:relative;height:var(--duration-height);background:rgba(255,255,255,0.25);border-radius:calc(var(--duration-height) * 0.5);overflow:hidden;flex-grow:1}.card-preview-pane .content .bar .duration:before{content:'';height:100%;background:#fff;width:25%;position:absolute}.card-preview-pane .content .bar:before{content:'1:20'}.card-preview-pane .content .bar:after{content:'-1:48'}.card-preview-pane .camera{display:flex;justify-content:center;align-items:center;height:var(--notch-height);aspect-ratio:1 / 1;border-radius:50%;pointer-events:none;position:absolute;z-index:4;top:calc(var(--pad) * 2);right:calc(50% - calc(var(--notch-width) * 0.5));margin-right:calc(var(--pad) * 0.333)}.card-preview-pane .camera:before{content:'';height:33.3%;aspect-ratio:1;border-radius:inherit;box-shadow:inset 0 0 0.25em #4c4da3;background:radial-gradient(#6667ac, transparent 50%) no-repeat 33.3% 10%/75% 50%,radial-gradient(#454680, transparent 50%) no-repeat 60% 85%/50% 50%;background-color:#080928}.card-preview-pane .screen{display:flex;flex-wrap:wrap;align-content:flex-start;flex-grow:1;gap:var(--gutter);box-sizing:border-box;width:100%;position:relative;overflow:hidden;z-index:1;padding:var(--gutter);padding-top:calc(var(--gutter) * 3);border-radius:calc(var(--border-radius) - var(--pad));transition:opacity 1s var(--ease-out) 0.25s}.card-preview-pane .phone-card-preview{position:absolute;inset:0;border-radius:calc(var(--border-radius) - var(--pad));background:transparent;border:none;z-index:2;box-shadow:none;display:flex;align-items:stretch;justify-content:stretch;overflow:hidden;transition:opacity 0.2s ease}.card-preview-pane .phone-card-preview iframe{width:100%;height:100%;border:none;border-radius:inherit;background:#fff;transition:opacity 0.2s ease}.card-preview-pane[data-state='empty'] .phone-card-preview,.card-preview-pane[data-state='loading'] .phone-card-preview{opacity:0;pointer-events:none}.card-preview-pane[data-state='ready'] .phone-card-preview{opacity:1}.card-preview-pane .app{--scale: 1.5;--duration: 0.8s;aspect-ratio:1;border-radius:20%;flex-basis:15%;flex-grow:1;display:flex;flex-direction:column;justify-content:space-between;gap:2%;padding:5%;box-sizing:border-box;font-size:1.5em;transform:scale3d(var(--scale), var(--scale), 1);animation:appear var(--duration) var(--ease-out) forwards;position:relative}.card-preview-pane .app:nth-child(1),.card-preview-pane .app:nth-child(2){flex-basis:40%;border-radius:15%;background:linear-gradient(190deg, var(--app-bg-s1, #fff) 33.3%, var(--app-bg-s2, var(--app-bg-s1, #fff))) top/100% 125%}.card-preview-pane .app:not(:nth-child(1)):not(:nth-child(2))::before{content:'';background:linear-gradient(190deg, var(--app-bg-s1, #fff), var(--app-bg-s2, var(--app-bg-s1, #fff))) top/100% 125%;border-radius:inherit;position:absolute;inset:0;filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1'><defs><filter id='round'><feGaussianBlur in='SourceGraphic' stdDeviation='5' result='blur' /><feColorMatrix in='blur' mode='matrix' values='1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9' result='goo'/><feComposite in='SourceGraphic' in2='goo' operator='atop'/></filter></defs></svg>#round")}.card-preview-pane .app:nth-child(1),.card-preview-pane .app:nth-child(2),.card-preview-pane .app:nth-child(3),.card-preview-pane .app:nth-child(6),.card-preview-pane .app:nth-child(7),.card-preview-pane .app:nth-child(10){--scale: 1.75;--duration: 1s}.card-preview-pane .app:nth-child(1){--app-bg-s1: #3c74c7;--app-bg-s2: #6490d2;color:#fff;transform-origin:125% 200%}.card-preview-pane .app:nth-child(1):after{content:'Sunny'}.card-preview-pane .app:nth-child(1) .weather{display:flex;flex-direction:column;gap:2%}.card-preview-pane .app:nth-child(1) .weather:before{content:'Oakland'}.card-preview-pane .app:nth-child(1) .weather:after{font-size:225%;content:'80°'}.card-preview-pane .app:nth-child(2){--app-bg-s1: #cbe2ae;--app-bg-s2: #eff6e6;transform-origin:-25% 200%}.card-preview-pane .app:nth-child(2):before{content:'';align-self:flex-end;width:40%;background:#f8d7a2;border:var(--border-width) solid #fff;aspect-ratio:1;border-radius:50%}.card-preview-pane .app:nth-child(2):after{content:'Hudson Ave';font-weight:500;margin-top:auto}.card-preview-pane .app:nth-child(3){--app-bg-s1: #a7f88f;--app-bg-s2: #41c144;transform-origin:175% 200%}.card-preview-pane .app:nth-child(4){transform-origin:75% 230%}.card-preview-pane .app:nth-child(5){--app-bg-s1: #cecdd5;--app-bg-s2: #89888d;transform-origin:-25% 230%}.card-preview-pane .app:nth-child(6){--app-bg-s1: #1ac5fb;--app-bg-s2: #1d71f2;transform-origin:-125% 200%}.card-preview-pane .app:nth-child(7){--app-bg-s1: #fe9b01;--app-bg-s2: #f67324;transform-origin:175% 80%}.card-preview-pane .app:nth-child(8){--app-bg-s1: #cb65f0;--app-bg-s2: #8628bb;transform-origin:75% 100%}.card-preview-pane .app:nth-child(9){--app-bg-s1: #1d71f2;--app-bg-s2: #1ac8fd;transform-origin:-25% 100%}.card-preview-pane .app:nth-child(10){transform-origin:-125% 80%}.card-preview-pane .pallette{position:relative;z-index:1;order:1;display:flex;gap:2em;margin-right:2.25em;margin-bottom:-0.25em}.card-preview-pane .pallette:hover ~ .phone-con .screen{transition-delay:0.5s;opacity:0}.card-preview-pane .zoom-con{order:1}.card-preview-pane .swatch{--swatch-size: max(30px, 5em);--border-opacity: 0;background:#fff;width:var(--swatch-size);height:var(--swatch-size);border-radius:50%;position:relative;cursor:pointer;border:max(1.5px, var(--border-width)) solid #000;box-sizing:border-box;background:radial-gradient(100% 100% at 50% 30%, var(--swatch-s1), var(--swatch-s2));opacity:0;transform:translate3d(0, 20%, 0) scale3d(0.75, 0.75, 1);animation:appear 0.333s var(--ease-out) forwards 0.75s;display:flex;align-items:center;color:#fff;justify-content:center;outline:none}.card-preview-pane .swatch:before{content:'';position:absolute;inset:-1px;border-radius:inherit;border:var(--border-width) solid #000;background-image:radial-gradient(400% 300% at 50% 225%, transparent 20%, #fff)}.card-preview-pane .swatch:not([for='preview-zoom']):after{content:'';position:absolute;inset:calc(var(--border-width) * -1);border-width:inherit;border-style:inherit;opacity:var(--border-opacity);transition:0.25s var(--ease-out);transition-property:opacity;border-radius:inherit}.card-preview-pane .swatch:not([for='preview-zoom']):hover{--border-opacity: 0.666}.card-preview-pane .swatch:not([for='preview-zoom']):focus-visible{--border-opacity: 1}.card-preview-pane .swatch:nth-child(1){transform-origin:100% 200%}.card-preview-pane .swatch:nth-child(2){animation-delay:0.8s;transform-origin:80% 200%}.card-preview-pane .swatch:nth-child(3){animation-delay:0.85s;transform-origin:50% 200%}.card-preview-pane .swatch:nth-child(4){animation-delay:0.9s;transform-origin:40% 200%}.card-preview-pane .swatch:nth-child(5){animation-delay:0.95s;transform-origin:20% 200%}.card-preview-pane .swatch[for='preview-deep-purple']{--swatch-s1: hsl(var(--deep-purple), 100%, 50%);--swatch-s2: hsl(calc(var(--deep-purple) - 60), 100%, 20%)}.card-preview-pane .swatch[for='preview-deep-purple']:before{opacity:0.5}.card-preview-pane .swatch[for='preview-gold']{--swatch-s1: hsl(var(--gold), 100%, 50%);--swatch-s2: hsl(var(--gold), 100%, 50%)}.card-preview-pane .swatch[for='preview-space-black']{--swatch-s1: hsl(var(--space-black), 50%, 20%);--swatch-s2: hsl(var(--space-black), 50%, 10%)}.card-preview-pane .swatch[for='preview-space-black']:before{opacity:0.5}.card-preview-pane .swatch[for='preview-silver']{--swatch-s1: hsl(var(--silver), 50%, 80%);--swatch-s2: hsl(var(--silver), 50%, 10%)}.card-preview-pane .swatch[for='preview-silver']:before{opacity:0.75}.card-preview-pane .swatch[for='preview-random']{border-color:rgba(255,255,255,0.25);transition:border-color 0.2s var(--ease-out)}.card-preview-pane .swatch[for='preview-random']:before{background:none}.card-preview-pane .swatch[for='preview-random']:hover{border-color:rgba(255,255,255,0.75)}.card-preview-pane .swatch[for='preview-random']:hover .icon{opacity:1}.card-preview-pane .swatch[for='preview-random'] .icon{position:absolute;inset:22.5%;background:url("data:image/svg+xml,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m18 15 3 3m0 0-3 3m3-3h-4l-1-1-1-1h-1m4-13 3 3m0 0-3 3m3-3h-4l-1 1-1 1-6 8-1 1-1 1H3M3 6h4l1 1 1 1 1 1' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;opacity:0.75;transition:opacity 0.2s var(--ease-out)}.card-preview-pane .swatch[for='preview-random'] .tooltip{display:inline-flex}.card-preview-pane .swatch[for='preview-zoom']{animation-delay:1s;transform-origin:40% 200%;border-color:rgba(255,255,255,0.25);transition:border-color 0.2s var(--ease-out)}.card-preview-pane .swatch[for='preview-zoom']:before{background:none}.card-preview-pane .swatch[for='preview-zoom']:after{content:'';position:absolute;inset:22.5%;background:url("data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m5 27 9-9m-9 9v-9m0 9h9M27 5l-9 9m9-9v9m0-9h-9' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/cover;opacity:0.75;transition:opacity 0.2s var(--ease-out)}.card-preview-pane .swatch[for='preview-zoom']:hover,.card-preview-pane .swatch[for='preview-zoom']:focus-visible{border-color:rgba(255,255,255,0.75)}.card-preview-pane .swatch[for='preview-zoom']:hover:after,.card-preview-pane .swatch[for='preview-zoom']:focus-visible:after{opacity:1}.card-preview-pane .tooltip{--t-caret: 0.5em;position:absolute;z-index:1;top:calc(100% + var(--t-caret) + 0.5em);white-space:nowrap;background:#000;color:rgba(255,255,255,0.75);padding:0.25em;font-size:max(11px, 1em);border-radius:0.25em;border:1px solid #404040;pointer-events:none;opacity:0;transition:opacity 0.25s var(--ease)}.card-preview-pane .tooltip:after{content:'';position:absolute;bottom:calc(100% - calc(var(--t-caret) / 2) - 1px);left:calc(50% - calc(var(--t-caret) / 2));border-radius:inherit;height:var(--t-caret);width:var(--t-caret);background:inherit;border:inherit;border-top-color:transparent;border-left-color:transparent;transform:rotate(-135deg)}#preview-zoom:checked ~ .scene .card-preview-pane .tooltip{top:unset;bottom:calc(100% + var(--t-caret) + 0.5em)}#preview-zoom:checked ~ .scene .card-preview-pane .tooltip:after{transform:rotate(45deg);top:calc(100% - calc(var(--t-caret) / 2) - 1px);bottom:unset}.card-preview-pane #preview-random:not(:checked) ~ .scene label[for='preview-random']::after{border:none}.card-preview-pane #preview-random:checked ~ .scene label[for='preview-random']{--swatch-s1: hsl(var(--r-h), var(--r-s), var(--r-l));--swatch-s2: hsl(var(--r-h), var(--r-s), calc(min(98%, var(--r-l) + 10%)))}.card-preview-pane #preview-random:checked ~ .scene label[for='preview-random']:after{border-color:hsl(var(--r-h), 50%, 75%)}.card-preview-pane #preview-random:checked ~ .scene label[for='preview-random'] .icon{background:url("data:image/svg+xml,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m18 15 3 3m0 0-3 3m3-3h-4l-1-1-1-1h-1m4-13 3 3m0 0-3 3m3-3h-4l-1 1-1 1-6 8-1 1-1 1H3M3 6h4l1 1 1 1 1 1' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain}.card-preview-pane #preview-random:checked ~ .scene label[for='preview-random']:hover .tooltip,.card-preview-pane #preview-random:checked ~ .scene label[for='preview-random']:focus-visible .tooltip{pointer-events:all;opacity:1}.card-preview-pane #preview-zoom:checked ~ .scene{--size: max(5px, 2vmin);opacity:0;animation:appear 0.5s var(--ease-out) forwards}.card-preview-pane #preview-zoom:checked ~ .scene .phone{order:1}.card-preview-pane #preview-zoom:checked ~ .scene .pallette,.card-preview-pane #preview-zoom:checked ~ .scene .zoom-con{order:0;font-size:50%}.card-preview-pane #preview-zoom:checked ~ .scene label[for='preview-zoom']::after{background:url("data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m14 18-9 9m9-9v9m0-9H5M18 14l9-9m-9 9V5m0 9h9' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/cover}.card-preview-pane #preview-zoom:not(:checked) ~ .scene{opacity:0;animation:appear-again 0.5s var(--ease-out) forwards}.card-preview-pane .deep-purple{--c-h: var(--deep-purple);--g-hue-adjust: 40;--g-hue-adjust-2: 45}.card-preview-pane .deep-purple .section:last-of-type{--g-hue-adjust-2-y: 85%}.card-preview-pane .gold{--c-h: var(--gold);--g-hue-adjust: 0}.card-preview-pane .gold .section:last-of-type{--g-hue-adjust: 15;--g-hue-adjust-2: -190;--g-lightness: 82.5%}.card-preview-pane .space-black{--c-h: var(--space-black);--g-hue-adjust: 0;--g-lightness: 95%}.card-preview-pane .space-black .section:last-of-type{--g-hue-adjust: 215;--g-hue-adjust-2: -215}.card-preview-pane .silver{--c-h: var(--silver);--c-s: 10%;--g-hue-adjust: 40;--g-lightness: 95%;--g-hue-adjust-2-y: 85%}.card-preview-pane .silver .section:last-of-type{--g-hue-adjust-2: 15}.card-preview-pane .silver .glow{opacity:0.25}.card-preview-pane label[for='preview-deep-purple']::after{border-color:hsl(var(--deep-purple), 50%, 75%)}.card-preview-pane #preview-deep-purple:checked ~ .scene .phone .bg .deep-purple{opacity:1;z-index:1;transition-delay:0s}.card-preview-pane #preview-deep-purple:checked ~ .scene .phone .bg .deep-purple .section:before{transition-delay:0s;transform:scale3d(1, 1, 1) translate3d(0, 0, 0)}.card-preview-pane #preview-deep-purple:checked ~ .scene .pallette label[for='preview-deep-purple']{--border-opacity: 1 !important}.card-preview-pane label[for='preview-gold']::after{border-color:hsl(var(--gold), 50%, 75%)}.card-preview-pane #preview-gold:checked ~ .scene .phone .bg .gold{opacity:1;z-index:1;transition-delay:0s}.card-preview-pane #preview-gold:checked ~ .scene .phone .bg .gold .section:before{transition-delay:0s;transform:scale3d(1, 1, 1) translate3d(0, 0, 0)}.card-preview-pane #preview-gold:checked ~ .scene .pallette label[for='preview-gold']{--border-opacity: 1 !important}.card-preview-pane label[for='preview-space-black']::after{border-color:hsl(var(--space-black), 50%, 75%)}.card-preview-pane #preview-space-black:checked ~ .scene .phone .bg .space-black{opacity:1;z-index:1;transition-delay:0s}.card-preview-pane #preview-space-black:checked ~ .scene .phone .bg .space-black .section:before{transition-delay:0s;transform:scale3d(1, 1, 1) translate3d(0, 0, 0)}.card-preview-pane #preview-space-black:checked ~ .scene .pallette label[for='preview-space-black']{--border-opacity: 1 !important}.card-preview-pane label[for='preview-silver']::after{border-color:hsl(var(--silver), 50%, 75%)}.card-preview-pane #preview-silver:checked ~ .scene .phone .bg .silver{opacity:1;z-index:1;transition-delay:0s}.card-preview-pane #preview-silver:checked ~ .scene .phone .bg .silver .section:before{transition-delay:0s;transform:scale3d(1, 1, 1) translate3d(0, 0, 0)}.card-preview-pane #preview-silver:checked ~ .scene .pallette label[for='preview-silver']{--border-opacity: 1 !important}.card-preview-pane label[for='preview-random']::after{border-color:hsl(var(--random), 50%, 75%)}.card-preview-pane #preview-random:checked ~ .scene .phone .bg .random{opacity:1;z-index:1;transition-delay:0s}.card-preview-pane #preview-random:checked ~ .scene .phone .bg .random .section:before{transition-delay:0s;transform:scale3d(1, 1, 1) translate3d(0, 0, 0)}.card-preview-pane #preview-random:checked ~ .scene .pallette label[for='preview-random']{--border-opacity: 1 !important}.card-preview-pane .random{background:hsl(var(--r-h), var(--r-s), var(--r-l))}.card-preview-pane .random--colourful{--bm-outer: overlay;--bm-inner: difference}.card-preview-pane .random--moody{--bm-outer: exclusion;--bm-inner: multiply}.card-preview-pane .random--neon{--bm-outer: hue;--bm-inner: multiply}.card-preview-pane .random--abstract{--bm-outer: color-burn;--bm-inner: difference}.card-preview-pane .random--grayscale{--bm-outer: color-burn;--bm-inner: difference;filter:brightness(1.2) grayscale(100%) contrast(2)}.card-preview-pane .random--light-leak{--bm-outer: color-burn;--bm-inner: multiply}.card-preview-pane .shapes{mix-blend-mode:var(--bm-outer, overlay);background:hsl(var(--r-h), var(--r-s), 85%);position:absolute;inset:0;z-index:1;backface-visibility:hidden}.card-preview-pane .shape{position:absolute;pointer-events:none;transition-property:background, inset, border-radius, filter, transform;will-change:inset, border-radius, filter;mix-blend-mode:var(--bm-inner, difference);top:50%;left:50%;aspect-ratio:1 / 1;background:hsl(var(--r-h), var(--r-s), var(--r-l));width:var(--w, 99%);border-radius:var(--b-r, 55%);filter:blur(var(--b));transform:translate3d(calc(var(--x, -1%) - 50%), calc(var(--y, -8%) - 50%), 0) scale3d(var(--s-x, 1.9), var(--s-y, 1.15), 1) rotate(var(--r, 260deg))}.card-preview-pane[data-state='empty'] .phone-card-preview iframe{opacity:0}.card-preview-pane[data-state='loading'] .phone-card-preview iframe{opacity:0.4}.card-preview-pane[data-state='ready'] .phone-card-preview iframe{opacity:1}@media (min-width: 1100px){.dispatch-panel__content{flex-direction:row;align-items:stretch;gap:2rem}.dispatch-panel form{flex:1 1 60%;height:100%;min-height:0}.card-preview-pane{flex:0 0 360px;position:sticky;top:1.5rem}}.profile-status[data-state='error']{color:#b91c1c}.profile-status[data-state='info']{color:#475569}.preview-actions{display:flex;flex-wrap:wrap;gap:0.5rem;justify-content:flex-end}.preview-actions .btn-secondary[data-state='active'],.btn-secondary.is-active{background:#1d4ed8;color:#fff;box-shadow:0 12px 24px rgba(30,73,226,0.35)}.preview-token{position:absolute;transform:translate(-50%, -50%);width:min(8vw, 100px);height:min(8vw, 100px);border:none;border-radius:999px;background:var(--token-color, #2563eb);background-image:var(--token-image, none);background-size:cover;background-position:center;box-shadow:0 14px 30px rgba(2,6,23,0.55);color:#fff;font-weight:700;display:grid;place-items:center;cursor:grab}.preview-token span{font-size:clamp(0.9rem, 2.4vw, 1.35rem)}.preview-token.is-disabled{opacity:0.45}.board-preview:not(.is-editing) .preview-token{cursor:default}.team-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1rem}.team-list>li{border:1px solid rgba(148,163,184,0.25);border-radius:1.25rem;padding:1rem 1.25rem;background:rgba(248,250,252,0.9);box-shadow:0 15px 35px rgba(15,23,42,0.07)}.team-item__row{display:flex;gap:0.75rem;align-items:center;flex-wrap:wrap}.team-item__row--lap{justify-content:flex-start}.team-item__row input[type='color']{width:48px;height:48px;padding:0}.token-preview{width:48px;height:48px;border-radius:999px;border:3px solid rgba(15,23,42,0.08);background:var(--token-color, #2563eb);background-image:var(--token-image, none);background-size:cover}.token-preview--lap{border-color:rgba(250,204,21,0.55);background:var(--token-color, #fbbf24)}.token-order{margin-left:auto;font-size:0.85rem;color:#64748b}.users-panel .share-link{display:flex;gap:0.75rem;align-items:center}.users-panel .share-link input{flex:1}.backend-status{display:inline-flex;align-items:center;gap:0.35rem;font-size:0.85rem;padding:0.25rem 0.65rem;border-radius:999px;background:#f1f5f9;color:#0f172a;margin-left:auto;white-space:nowrap}.backend-status__dot{width:0.5rem;height:0.5rem;border-radius:50%;background:#cbd5f5;box-shadow:0 0 0 2px rgba(15,23,42,0.1)}.backend-status[data-state='online'] .backend-status__dot{background:#22c55e}.backend-status[data-state='offline'] .backend-status__dot{background:#ef4444}.backend-status[data-state='checking'] .backend-status__dot{background:#fbbf24;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:0.4}50%{opacity:1}100%{opacity:0.4}}.cards-drawer{position:fixed;inset:0;background:rgba(2,6,23,0.65);display:none;padding:2rem;z-index:20}.cards-drawer.is-open{display:block}.cards-drawer__panel{background:#fff;max-width:960px;margin:0 auto;border-radius:1.5rem;padding:1.5rem;max-height:90vh;overflow-y:auto}.cards-drawer__list{flex:1 1 auto;min-height:0;max-height:clamp(320px, 58vh, 640px)}.cards-drawer__group ul{list-style:none;margin:0.5rem 0 0;padding:0;display:flex;flex-direction:column;gap:0.35rem}.cards-drawer__group li{display:flex;justify-content:space-between;gap:0.5rem;padding:0.4rem 0;border-bottom:1px solid rgba(15,23,42,0.08)}.cards-drawer__group a{color:#2563eb;font-weight:600}@media (max-width: 900px){.admin-top{grid-template-columns:1fr}.game-board__dice{--dice-base-size: clamp(200px, 45vw, 320px)}.game-token{--token-base-size: clamp(52px, 12vw, 90px)}}.btn-primary,.btn-secondary,.btn-link,.btn-admin,.btn-icon{font-family:'Inter', 'Arial', sans-serif;border:none;border-radius:0.75rem;cursor:pointer;font-weight:600;transition:transform 0.2s ease, box-shadow 0.2s ease}.btn-primary{background:linear-gradient(135deg, #1e49e2, #6238f5);color:#fff;padding:0.75rem 1.25rem;box-shadow:0 10px 20px rgba(30,73,226,0.2)}.btn-secondary{background:rgba(98,56,245,0.12);color:#4326b5;padding:0.65rem 1.1rem}.btn-link{background:transparent;color:#1e49e2;padding:0.25rem 0.5rem;text-decoration:underline;border-radius:0.25rem}.btn-admin{background:#0f172a;color:#fff;padding:0.75rem 1.2rem;border-radius:0.75rem}.btn-icon{width:2.5rem;height:2.5rem;border-radius:50%;background:rgba(15,23,42,0.08);display:inline-flex;align-items:center;justify-content:center}.btn-icon.is-muted{opacity:0.4}.btn-primary:hover,.btn-secondary:hover,.btn-admin:hover,.btn-icon:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(15,23,42,0.1)}.form-field{display:flex;flex-direction:column;gap:0.35rem;font-size:0.95rem;color:#475569}.form-field input,.form-field select,input,select{font:inherit;padding:0.65rem 0.9rem;border-radius:0.65rem;border:1px solid #d3d8f0;background:#fff;color:#0f172a}.form-inline{display:flex;gap:0.5rem;flex-wrap:wrap}.form-inline input,.form-inline select{flex:1;min-width:140px}.activity-log,.user-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.75rem}.activity-log li,.user-list li{display:flex;justify-content:space-between;align-items:center;padding:0.85rem 1rem;border-radius:1rem;border:1px solid rgba(148,163,184,0.25);background:rgba(255,255,255,0.85);box-shadow:0 12px 25px rgba(15,23,42,0.06)}.activity-log li .icon{margin-right:0.75rem}.user-list li[data-status='online']{border-color:rgba(34,197,94,0.35)}.user-list li[data-status='online'] .meta span{color:#16a34a}.user-list li[data-status='offline'] .meta span{color:#94a3b8}.user-list li[data-status='manual'] .meta span{color:#fb923c}body.home{font-family:'Inter', 'Arial', sans-serif;background:linear-gradient(180deg, #f8fbff 0%, #eef2ff 100%);min-height:100vh;color:#0f172a}body.home .container{max-width:1280px;margin:0 auto;padding:2rem 1.5rem 4rem}body.home .header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1.5rem}body.home .header .kpmg-logo h1{font-size:2.5rem;letter-spacing:0.1rem}body.home .main-content{display:flex;flex-direction:column;gap:2rem}.game-hub{display:grid;grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr);gap:1.5rem}@media (max-width: 960px){.game-hub{grid-template-columns:1fr}}.board-dropzone{background:#fff;border-radius:1.5rem;border:2px dashed rgba(15,23,42,0.12);padding:1.5rem;min-height:320px;display:flex;flex-direction:column;gap:1rem}.board-preview{flex:1;border-radius:1rem;background:var(--board-image, linear-gradient(135deg, #f1f5f9, #e2e8f0));background-size:cover;background-position:center;display:grid;place-items:center;min-height:220px;color:#475569;font-weight:600;text-align:center}.board-preview.is-empty span{opacity:0.7}.board-dropzone__cta{display:flex;flex-wrap:wrap;gap:0.75rem;align-items:center}.btn-upload{position:relative;overflow:hidden}.btn-upload input{position:absolute;inset:0;opacity:0;cursor:pointer}.dice-card,.admin-card,.sections-panel,.team-card{background:#fff;border-radius:1.5rem;padding:1.25rem;box-shadow:0 20px 35px rgba(15,23,42,0.08)}.dice-card header{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.75rem}.dice-widget{display:flex;flex-direction:column;align-items:center;position:relative;width:100%;max-width:340px;margin-inline:auto;text-align:center}.dice-widget canvas{width:100%;height:auto;display:block}.dice-widget[data-interactive='true'] canvas{cursor:pointer;transition:transform 0.2s ease, filter 0.2s ease;filter:drop-shadow(0 18px 35px rgba(0,0,0,0.35))}.dice-widget[data-interactive='true'] canvas:hover{filter:drop-shadow(0 22px 40px rgba(59,130,246,0.35))}.dice-widget[data-interactive='true'] canvas:active{transform:scale(0.97)}.dice-output{margin-top:1rem;display:flex;flex-direction:column;gap:0.5rem}.dice-history{display:flex;gap:0.35rem}.dice-history span{width:2.25rem;height:2.25rem;border-radius:0.85rem;background:#eef2ff;color:#4338ca;display:grid;place-items:center;font-weight:700}.team-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:1rem}.team-card{border:1px solid rgba(15,23,42,0.08);position:relative}.team-card__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.5rem}.team-card__score{font-size:2.75rem;color:var(--team-color, #1e49e2);margin:0}.team-card__controls{display:flex;gap:0.5rem;margin:0.75rem 0}.team-card__controls button{flex:1;padding:0.45rem 0;border-radius:0.65rem;background:rgba(15,23,42,0.08);font-weight:600}.team-card__position{display:flex;flex-direction:column;gap:0.25rem;font-size:0.85rem}.team-card__foot{margin-top:0.75rem;font-size:0.85rem;color:#475569}.admin-panel--game{display:flex;flex-direction:column;gap:1.25rem}.admin-panel__grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));gap:1rem}.share-link__row{display:flex;gap:0.5rem}.share-link__row input{flex:1}.admin-buttons{display:flex;flex-direction:column;gap:0.75rem}.sections-panel{padding:1.5rem}.sections-panel__header{margin-bottom:1rem}.sections-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:1rem}.sections-grid .section-card{background:#fff;border-radius:1rem;padding:1rem;border:1px solid rgba(15,23,42,0.08);cursor:pointer;transition:transform 0.2s ease, box-shadow 0.2s ease}.sections-grid .section-card:hover{transform:translateY(-4px);box-shadow:0 15px 25px rgba(15,23,42,0.08)}@media (max-width: 720px){.form-inline{flex-direction:column}.share-link__row{flex-direction:column}}body.player-page{font-family:'Inter', 'Arial', sans-serif;background:radial-gradient(circle at top, #1d4ed8 0%, #020617 50%, #0b1120 100%);min-height:100vh;min-height:100svh;margin:0;color:#e2e8f0}body.player-page.player-auth-mode{display:flex;align-items:center;justify-content:center;padding:clamp(1.5rem, 4vw, 3rem);overflow:hidden}body.player-page.player-view-mode{display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:100vh;align-items:stretch;min-height:100svh;padding:0;overflow:hidden;background:radial-gradient(circle at top, #11255a 0%, #020617 55%, #01030a 100%)}body.player-page [hidden]{display:none !important}.player-stage{width:min(1200px, 100%);min-height:0;margin-inline:auto;display:grid;grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);gap:0;padding:clamp(1.5rem, 4vw, 3rem);backdrop-filter:blur(12px);background:rgba(2,6,23,0.55);border-radius:2rem;box-shadow:0 25px 60px rgba(2,6,23,0.45);box-sizing:border-box}body.player-page.player-view-mode .player-stage{width:min(540px, 100%);min-height:100vh;min-height:100svh;grid-template-columns:1fr;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(1.25rem, 4vw, 2rem);border-radius:2rem;box-shadow:0 40px 90px rgba(2,6,23,0.65);background:rgba(6,12,24,0.96)}.player-stage.is-auth-only{width:min(520px, 100%);min-height:clamp(520px, 85vh, 620px);min-height:clamp(520px, 85svh, 640px);grid-template-columns:1fr;display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:1.25rem;padding:clamp(1.75rem, 6vw, 2.5rem);border-radius:2rem;box-shadow:0 25px 60px rgba(2,6,23,0.55);background:rgba(6,12,24,0.92)}.player-stage.is-auth-only #playerViewer{display:none !important}.player-stage.is-auth-only .player-auth{width:100%;margin:0;padding:0;background:transparent;border:none;border-radius:0;box-shadow:none}.player-stage.is-viewer-only{grid-template-columns:1fr}.player-stage.is-viewer-only #playerAuthPanel{display:none !important}.player-stage.is-viewer-only .player-viewer{padding:0;width:100%;max-width:none;flex:1;display:flex;flex-direction:column}@media (max-width: 960px){.player-stage{grid-template-columns:1fr;min-height:unset}}@media (max-width: 640px){body.player-page.player-auth-mode{padding:clamp(1rem, 5vw, 1.25rem)}body.player-page.player-view-mode{padding:0}.player-stage{padding:clamp(1rem, 5vw, 1.5rem);border-radius:1.5rem;box-shadow:none}.player-stage.is-auth-only,.player-stage.is-viewer-only{width:100%;min-height:100vh;min-height:100svh;padding:clamp(1rem, 5vw, 1.25rem);border-radius:0;box-shadow:none}body.player-page.player-view-mode .player-stage{width:100%;border-radius:0;padding:clamp(1rem, 5vw, 1.25rem);min-height:100vh;min-height:100svh;box-shadow:none}.player-auth,.player-viewer{padding:clamp(1.25rem, 5vw, 1.5rem)}.player-auth header h1{font-size:clamp(2rem, 6vw, 2.4rem)}.player-auth .lead{font-size:1rem;line-height:1.4}}.player-auth,.player-viewer{padding:clamp(1.75rem, 4vw, 3rem)}.player-auth{background:rgba(15,23,42,0.9);display:flex;flex-direction:column;gap:1.5rem;border-right:1px solid rgba(148,163,184,0.15);border-radius:1.75rem;box-shadow:0 25px 60px rgba(2,6,23,0.5);width:100%;max-width:480px}@media (max-width: 960px){.player-auth{border-right:none;border-bottom:1px solid rgba(148,163,184,0.15)}}.player-stage:not(.is-auth-only) .player-auth{border-radius:0;box-shadow:none}.player-auth form{display:flex;flex-direction:column;gap:1rem}.player-backend-alert{font-size:0.95rem;line-height:1.4;padding:0.85rem 1rem;border-radius:0.85rem;background:rgba(248,250,252,0.9);border:1px solid rgba(248,113,113,0.3);color:#991b1b}.player-backend-alert[hidden]{display:none !important}.player-viewer{display:flex;flex-direction:column;gap:1.5rem;background:rgba(2,6,23,0.35);flex:1}.player-viewer__header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.player-viewer__canvas{position:relative;flex:1;min-height:360px;border-radius:1.5rem;background:#020617;border:1px solid rgba(148,163,184,0.2);overflow:hidden;box-shadow:inset 0 0 40px rgba(2,6,23,0.8)}.player-viewer__canvas iframe{position:absolute;inset:0;width:100%;height:100%;border:none;background:#fff}.player-viewer.is-card-active{padding:0;background:#000}.player-viewer.is-card-active .player-viewer__header,.player-viewer.is-card-active .btn-link{display:none}.player-viewer.is-card-active .player-viewer__canvas{border-radius:0;border:none;min-height:100vh;box-shadow:none}.player-viewer.is-card-active .player-viewer__canvas iframe{height:100vh}.player-viewer.is-card-active .player-wait{display:none !important}body.player-page.player-card-active{background:#000;align-items:stretch;padding:0}body.player-page.player-card-active .player-stage,.player-stage.is-card-active{grid-template-columns:1fr;width:100%;min-height:100vh;background:#000}body.player-page.player-card-active .player-auth{display:none}.player-wait{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:2rem;color:#cbd5f5;font-size:clamp(1rem, 2vw, 1.35rem)}.player-toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(150%);background:rgba(15,23,42,0.9);color:#fff;padding:0.85rem 1.5rem;border-radius:999px;box-shadow:0 15px 40px rgba(0,0,0,0.35);transition:transform 0.4s ease}.player-toast.is-visible{transform:translateX(-50%) translateY(0)}.lead{color:#cbd5f5;line-height:1.5}.eyebrow{text-transform:uppercase;font-size:0.75rem;letter-spacing:0.1rem;color:#94a3b8}body.editor-page{font-family:'Inter', 'Arial', sans-serif;min-height:100vh;margin:0;background:radial-gradient(circle at top, #1e40af 0%, #020617 60%, #020617 100%);color:#e2e8f0;overflow-x:hidden}.editor-shell{min-height:100vh;display:flex;flex-direction:column}.editor-header{padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;background:rgba(2,6,23,0.6);border-bottom:1px solid rgba(148,163,184,0.2)}.editor-actions{display:flex;gap:0.75rem;flex-wrap:wrap}.editor-main{flex:1;display:flex;flex-direction:column;gap:1.5rem;padding:0 0 2rem}.editor-board-shell{display:flex;flex-direction:column;gap:1rem;padding:1.5rem 2rem 0}.editor-sidebar{background:rgba(15,23,42,0.75);border-radius:1.5rem;padding:1.5rem;box-shadow:0 30px 60px rgba(0,0,0,0.35);width:min(100%, 520px);align-self:flex-end;margin-right:2rem;display:flex;flex-direction:column;gap:1.25rem}.editor-tools{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:0.75rem}.editor-modes{display:inline-flex;background:rgba(15,23,42,0.4);border-radius:999px;padding:0.2rem;gap:0.15rem}.editor-mode-btn{border:none;background:transparent;color:#cbd5f5;font-weight:600;padding:0.35rem 0.85rem;border-radius:999px;cursor:pointer;transition:background 0.2s ease, color 0.2s ease}.editor-mode-btn.is-active{background:#2563eb;color:#fff}.editor-path-actions{display:flex;gap:0.5rem;opacity:0.35;pointer-events:none;transition:opacity 0.2s ease}.editor-path-actions.is-active{opacity:1;pointer-events:auto}.editor-path-actions button{border:1px solid rgba(148,163,184,0.5);background:rgba(15,23,42,0.7);color:#f8fafc;border-radius:8px;padding:0.4rem 0.85rem;cursor:pointer;font-weight:600;transition:border-color 0.2s ease, color 0.2s ease, background 0.2s ease}.editor-path-actions button:hover{border-color:#38bdf8;color:#38bdf8}.editor-path-actions button:disabled{opacity:0.45;cursor:not-allowed}.editor-board{position:relative;width:100vw;max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);min-height:100vh;height:100vh;border-radius:0;overflow:hidden;border:none;background:#020617}.editor-board .game-board,.editor-page .game-board{min-height:100vh;height:100vh}.editor-grid{position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(to right, rgba(148,163,184,0.45) 0, rgba(148,163,184,0.45) 1px, transparent 1px, transparent 40px),repeating-linear-gradient(to bottom, rgba(148,163,184,0.45) 0, rgba(148,163,184,0.45) 1px, transparent 1px, transparent 40px);z-index:1;opacity:0.75}.editor-path-layer{position:absolute;inset:0;pointer-events:none;z-index:3}.editor-path-layer--lap{z-index:4}.editor-path-line{width:100%;height:100%}.editor-path-line__stroke{fill:none;stroke:rgba(14,165,233,0.7);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:4 3}.editor-path-line__stroke--lap{stroke:rgba(250,204,21,0.9);stroke-dasharray:2 2;stroke-width:1.4}.editor-path-nodes{position:absolute;inset:0;pointer-events:none}.editor-path-node{position:absolute;transform:translate(-50%, -50%);width:28px;height:28px;border-radius:50%;border:2px solid rgba(14,165,233,0.95);background:rgba(15,23,42,0.85);color:#f8fafc;font-size:0.75rem;font-weight:700;display:grid;place-items:center;pointer-events:auto;cursor:pointer}.editor-path-node--lap{border-color:rgba(250,204,21,0.95);background:rgba(23,23,23,0.9);color:#fef3c7}.editor-board.is-path-mode .editor-path-layer{pointer-events:auto}.editor-board.is-path-mode .game-token,.editor-board.is-path-mode .game-board__dice{pointer-events:none;opacity:0.65}.editor-board.is-lap-path-mode .editor-path-layer--lap{pointer-events:auto}.editor-board.is-lap-path-mode .game-token,.editor-board.is-lap-path-mode .game-board__dice{pointer-events:none;opacity:0.65}.editor-lap-path-target{position:absolute;bottom:1rem;right:1rem;margin:0;padding:0.35rem 0.75rem;background:rgba(15,23,42,0.85);border-radius:999px;color:#fef3c7;font-size:0.85rem;pointer-events:none}.editor-summary--lap{margin-top:0.75rem;border:1px dashed rgba(250,204,21,0.5);padding:0.75rem 1rem;border-radius:10px;background:rgba(15,23,42,0.4)}.editor-path-hint{margin:0;color:#cbd5f5;font-size:0.9rem}.editor-grid::after{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(to right, rgba(15,118,230,0.35) 0, rgba(15,118,230,0.35) 2px, transparent 2px, transparent 200px),repeating-linear-gradient(to bottom, rgba(15,118,230,0.35) 0, rgba(15,118,230,0.35) 2px, transparent 2px, transparent 200px);mix-blend-mode:screen;opacity:0.7}.editor-guides{position:absolute;inset:0;pointer-events:none;z-index:4}.editor-guide{position:absolute;background:linear-gradient(180deg, rgba(125,211,252,0), rgba(59,130,246,0.9), rgba(125,211,252,0));opacity:0;transition:opacity 0.15s ease}.editor-guide--vertical{top:0;bottom:0;left:var(--guide-x, 50%);width:2px;transform:translateX(-50%)}.editor-guide--horizontal{left:0;right:0;top:var(--guide-y, 50%);height:2px;transform:translateY(-50%);background:linear-gradient(90deg, rgba(125,211,252,0), rgba(59,130,246,0.9), rgba(125,211,252,0))}.editor-guides[data-show-x="true"] .editor-guide--vertical,.editor-guides[data-show-y="true"] .editor-guide--horizontal{opacity:1}.editor-hint{margin:0;background:rgba(15,23,42,0.65);padding:0.85rem 1rem;border-radius:1rem;font-size:0.95rem;color:#cbd5f5}.editor-sidebar section:not(.panel){background:rgba(2,6,23,0.5);border-radius:1rem;padding:1rem}.editor-sidebar .panel{background:linear-gradient(135deg, rgba(15,23,42,0.92), rgba(37,99,235,0.25));border:1px solid rgba(148,163,184,0.2);border-radius:1.25rem;padding:1.5rem;box-shadow:0 25px 60px rgba(2,6,23,0.35)}.editor-sidebar .panel .panel-header h3{margin:0;color:#e2e8f0}.editor-sidebar .panel .panel-header p{color:#94a3b8}.editor-teams-panel .team-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:1rem}.editor-teams-panel .team-list:empty::after{content:'Los equipos aparecerán aquí automáticamente.';display:block;padding:1rem;border-radius:1rem;background:rgba(15,23,42,0.4);color:#cbd5f5;text-align:center}.editor-sidebar ol{margin:0;padding-left:1.25rem;color:#cbd5f5;display:flex;flex-direction:column;gap:0.5rem}.editor-sidebar ul{margin:0;padding-left:1.25rem;color:#e2e8f0;display:flex;flex-direction:column;gap:0.35rem}.editor-toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(150%);background:rgba(15,23,42,0.95);padding:0.85rem 1.5rem;border-radius:999px;color:#f8fafc;box-shadow:0 20px 40px rgba(0,0,0,0.35);transition:transform 0.35s ease}.editor-toast.is-visible{transform:translateX(-50%) translateY(0)}.editor-page .game-token{pointer-events:auto;cursor:grab;transition:transform 0.15s ease}.editor-page .game-token:active{transform:translate(-50%, -50%) scale(1.05)}.editor-page .game-token.is-animating{transition:left 0.3s ease, top 0.3s ease}.editor-page .game-token.is-selected{box-shadow:0 0 0 3px rgba(59,130,246,0.55),0 25px 45px rgba(2,6,23,0.65)}.editor-page .game-board__dice{--dice-base-size: clamp(220px, 30vw, 360px)}.editor-page .game-board__dice.is-selected{outline:3px solid rgba(59,130,246,0.65);border-radius:1.5rem;box-shadow:0 25px 45px rgba(2,6,23,0.65)}.editor-page .game-board__dice .dice-widget{padding:1rem}.editor-control{position:absolute;z-index:6;min-width:220px;max-width:280px;background:rgba(2,6,23,0.92);border:1px solid rgba(148,163,184,0.35);border-radius:1rem;padding:0.9rem 1rem;box-shadow:0 25px 60px rgba(0,0,0,0.55);color:#e2e8f0;pointer-events:auto}.editor-control__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.65rem}.editor-control__label{text-transform:uppercase;letter-spacing:0.08em;font-size:0.75rem;font-weight:600;color:#93c5fd}.editor-control__close{background:none;border:none;color:#94a3b8;font-size:1.2rem;line-height:1;cursor:pointer;padding:0.15rem 0.35rem;border-radius:0.35rem;transition:background 0.2s ease, color 0.2s ease}.editor-control__close:hover{background:rgba(148,163,184,0.15);color:#f8fafc}.editor-control__body label{display:flex;flex-direction:column;gap:0.4rem;font-size:0.85rem;color:#cbd5f5}.editor-control__slider{display:flex;align-items:center;gap:0.65rem}.editor-control__slider input[type='range']{width:160px;accent-color:#38bdf8}.editor-control__value{font-weight:700;font-size:0.95rem;color:#f8fafc}.editor-control[data-position='bottom']{transform-origin:top}.editor-status{font-size:0.9rem;color:#cbd5f5}body.has-dialog-open{overflow:hidden}.editor-dialog{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:1.5rem;z-index:1200;pointer-events:none;opacity:0;transition:opacity 0.2s ease}.editor-dialog[aria-hidden="false"]{display:flex;opacity:1;pointer-events:auto}.editor-dialog[aria-hidden="true"]{display:none;pointer-events:none}.editor-dialog__backdrop{position:absolute;inset:0;background:rgba(4,6,19,0.7);backdrop-filter:blur(3px);pointer-events:auto;cursor:pointer;z-index:0}.editor-dialog__panel{position:relative;width:min(480px, 100%);background:#0f172a;border:1px solid rgba(148,163,184,0.45);border-radius:16px;padding:2rem;box-shadow:0 35px 80px rgba(2,6,23,0.55);color:#f8fafc;pointer-events:auto;z-index:1}.editor-dialog__close{position:absolute;top:0.75rem;right:0.75rem;border:none;background:transparent;color:#94a3b8;font-size:1.2rem;cursor:pointer}.editor-dialog__eyebrow{text-transform:uppercase;font-size:0.7rem;letter-spacing:0.2em;color:#94a3b8;margin:0 0 0.5rem}.editor-dialog__step h2{margin:0 0 0.75rem;font-size:1.35rem}.editor-dialog__step[hidden]{display:none}.editor-dialog__field{display:flex;flex-direction:column;gap:0.35rem;margin-bottom:0.75rem}.editor-dialog__field input{background:rgba(15,23,42,0.8);border:1px solid rgba(148,163,184,0.5);border-radius:8px;color:#f8fafc;padding:0.6rem 0.75rem}.editor-dialog__error{min-height:1rem;font-size:0.8rem;color:#f87171;margin:0 0 0.75rem}.editor-dialog__hint{font-size:0.8rem;color:rgba(148,163,184,0.85);margin:0 0 0.5rem}.editor-dialog__actions{display:flex;gap:0.5rem;flex-wrap:wrap;margin-top:1rem}
/*# sourceMappingURL=styles.css.map */