*{box-sizing:border-box;margin:0;padding:0}body{background-color:#000;margin:0;font-family:Arial,sans-serif;overflow:hidden}#mapContainer{z-index:1;width:100vw;height:100vh;position:fixed;top:0;left:0}canvas{cursor:grab;touch-action:none;width:100%;height:100%;display:block}.control-btn,.center-hex-btn,.generate-btn,.action-btn,.nav-button,.close-btn{touch-action:none;-webkit-tap-highlight-color:#0000}#infoOverlay{z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#fffffff2;border-radius:10px;padding:15px;position:fixed;box-shadow:0 4px 12px #00000026;width:400px!important;min-width:400px!important;max-width:400px!important}#skillsOverlay{z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#fffffff2;border-radius:10px;padding:15px;box-shadow:0 4px 12px #00000026;width:400px!important;min-width:400px!important;max-width:400px!important}#infoBox{margin-bottom:15px;font-size:.9rem;line-height:1.4}#navigationButtons{border-top:1px solid #eee;padding-top:10px}#navigationButtons h3{color:#333;margin:0 0 10px;font-size:1rem}.nav-button{cursor:pointer;text-align:left;color:#333;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:1px solid #ddd;border-radius:5px;width:100%;margin:5px 0;padding:8px 12px;font-size:.85rem;transition:all .3s;display:block;box-shadow:0 2px 4px #0000001a}.nav-button:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.nav-button:active{transform:translateY(0)}.terrain-icon{float:right;font-size:1.1em}.locations-area{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:5px;margin-top:10px;padding:10px}.locations-area h3{color:#495057;margin:0 0 8px;font-size:.9rem}.locations-area ul{margin:0;padding-left:20px;font-size:.85rem}.locations-area li{color:#6c757d;margin:3px 0}.character-profile{flex-direction:column;gap:15px;display:flex}.character-profile h3{border-bottom:1px solid #ddd;margin:0;padding-bottom:10px;font-size:1.2rem}.character-profile h4{color:#555;margin:0 0 10px;font-size:1rem}.character-stats,.character-attributes{flex-direction:column;gap:8px;display:flex}.stat-row{justify-content:space-between;font-size:.9rem;display:flex}.character-inventory{margin-top:10px}#inventoryList{padding-left:5px;font-size:.9rem;list-style-type:none}#inventoryList li{color:#555;padding:3px 0}.color-box{vertical-align:middle;border:1px solid #000;width:16px;height:16px;margin-left:10px;display:inline-block}#controls{z-index:1000;align-items:flex-end;gap:10px;display:flex;position:fixed;bottom:20px;right:20px}.config-buttons{opacity:0;pointer-events:none;align-items:flex-end;gap:10px;max-width:0;transition:all .3s;display:flex;overflow:hidden}.config-buttons.show{opacity:1;pointer-events:auto;max-width:300px}#zoomControls{z-index:1000;flex-direction:column;gap:10px;transition:opacity .3s,pointer-events .3s;display:flex;position:fixed;bottom:calc(25% - 120px);right:20px}.control-btn{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer;-webkit-user-select:none;user-select:none;background-color:#ffffffe6;border:none;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;font-size:24px;transition:all .2s;display:flex;box-shadow:0 4px 12px #00000026}.control-btn:hover{background-color:#fff;transform:scale(1.05);box-shadow:0 6px 16px #0003}.control-btn:disabled{opacity:.5;cursor:pointer;pointer-events:auto;background-color:#fff9}.control-btn:disabled:hover{opacity:.8;background-color:#fffc;transform:scale(1.02)}.control-btn:active{transform:translateY(1px)}.auth-user-pill{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer;-webkit-user-select:none;user-select:none;background-color:#ffffffe6;border-radius:25px;align-items:center;min-width:50px;max-width:50px;height:50px;transition:max-width .4s cubic-bezier(.175,.885,.32,1.275),background-color .2s;display:flex;overflow:hidden;box-shadow:0 4px 12px #00000026}.auth-user-pill:hover{background-color:#fff}.auth-user-pill.expanded{max-width:500px}.auth-avatar-container{flex-shrink:0;justify-content:center;align-items:center;min-width:50px;height:50px;display:flex}.auth-avatar-img{object-fit:cover;border-radius:50%;width:100%;height:100%}.auth-avatar-icon{font-size:24px}.auth-details-container{opacity:0;white-space:nowrap;pointer-events:none;flex-direction:column;padding-left:15px;padding-right:25px;transition:opacity .3s;display:flex}.auth-user-pill.expanded .auth-details-container{opacity:1;pointer-events:auto}.auth-user-name{color:#333;text-overflow:ellipsis;font-size:14px;overflow:hidden}.auth-user-meta{flex-direction:column;gap:1px;display:flex}.auth-user-email{color:#666;text-overflow:ellipsis;font-size:10px;overflow:hidden}.auth-guest-badge{color:#888;font-size:9px;font-style:italic}body.dark-mode .auth-user-pill{color:#e0e0e0;background-color:#2d2d2de6;border:1px solid #ffffff1a}body.dark-mode .auth-user-pill:hover{background-color:#3c3c3c}body.dark-mode .auth-user-name{color:#f0f0f0}body.dark-mode .auth-user-email,body.dark-mode .auth-guest-badge{color:#b0b0b0}#topLeftControls{z-index:1000;gap:10px;display:flex;position:fixed;top:20px;left:20px}#topCenterControls{z-index:1000;gap:10px;display:flex;position:fixed;top:20px;left:50%;transform:translate(-50%)}#topControls{z-index:1000;gap:10px;display:flex;position:fixed;top:20px;right:20px}#bottomLeftControls{z-index:1000;gap:10px;display:flex;position:fixed;bottom:20px;left:20px}#bottomCenterControls{z-index:1000;gap:10px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}#characterOverlay{z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#fffffff2;border-radius:10px;padding:15px;position:fixed;box-shadow:0 4px 12px #00000026;width:400px!important;min-width:400px!important;max-width:400px!important}#characterBox{font-size:.9rem;line-height:1.4}#characterBox h3{color:#333;margin:0 0 15px;font-size:1.1rem}#characterBox h4{color:#555;margin:15px 0 8px;font-size:1rem}.character-stats,.character-attributes{margin-bottom:15px}.stat-row{justify-content:space-between;margin-bottom:5px;padding:3px 0;display:flex}.stat-label{color:#666;font-weight:700}.character-inventory{border-top:1px solid #eee;padding-top:10px}#inventoryList{margin:0;padding:0;list-style-type:none}#inventoryList li{color:#777;border-bottom:1px solid #f0f0f0;padding:5px 0;font-size:.85rem}#centerHexContainer{z-index:1000;position:fixed;bottom:25%;right:20px}.center-hex-btn{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);-webkit-user-select:none;user-select:none;cursor:pointer;background-color:#ffffffe6;border:none;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;font-size:24px;transition:all .2s;display:flex;box-shadow:0 4px 12px #00000026}.center-hex-btn:hover{background-color:#fff;transform:scale(1.05);box-shadow:0 6px 16px #0003}@media (width<=768px){.control-btn,.center-hex-btn{width:45px!important;height:45px!important;font-size:20px!important}.auth-user-pill{min-width:45px;max-width:45px;height:45px}.auth-user-pill.expanded{max-width:calc(100vw - 80px)}.auth-avatar-container{min-width:45px;height:45px}.auth-avatar-img{width:100%;height:100%}.auth-avatar-icon{font-size:20px}#topLeftControls{top:10px;left:10px}#topCenterControls{top:10px;left:50%;transform:translate(-50%)}#topControls{top:10px;right:10px}#bottomLeftControls{bottom:15px;left:10px}#bottomCenterControls{bottom:15px;left:50%;transform:translate(-50%)}#characterOverlay{box-sizing:border-box;padding:12px;overflow-y:auto;width:calc(100vw - 20px)!important;min-width:auto!important;max-width:calc(100vw - 20px)!important}#centerHexContainer{bottom:35%;right:10px}#zoomControls{gap:10px;bottom:calc(35% - 110px);right:10px}#controls{gap:10px;bottom:15px;right:10px}.config-buttons{gap:10px;max-width:300px}#infoOverlay,#skillsOverlay{box-sizing:border-box;padding:12px;width:calc(100vw - 20px)!important;min-width:auto!important;max-width:calc(100vw - 20px)!important}#infoBox{font-size:.85rem}.nav-button{padding:10px 12px;font-size:.9rem}.locations-area{padding:8px}.locations-area h3{font-size:.85rem}.locations-area ul{font-size:.8rem}}body.dark-mode{color:#e0e0e0;background-color:#1a1a1a}body.dark-mode #infoOverlay,body.dark-mode #skillsOverlay{color:#e0e0e0;background-color:#2d2d2df2}body.dark-mode #navigationButtons{border-top-color:#555}body.dark-mode .nav-button{color:#e0e0e0;background:linear-gradient(135deg,#4a4a4a,#3a3a3a);border-color:#666;box-shadow:0 2px 4px #0000004d}body.dark-mode .nav-button:hover{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:translateY(-1px);box-shadow:0 4px 8px #0006}body.dark-mode .character-profile h3{border-bottom-color:#555}body.dark-mode .character-profile h4,body.dark-mode .stat-label,body.dark-mode #inventoryList li{color:#b0b0b0}body.dark-mode .control-btn{color:#e0e0e0;background-color:#2d2d2de6;border:1px solid #ffffff1a}body.dark-mode .control-btn:hover{background-color:#3c3c3c;border-color:#fff3}body.dark-mode .control-btn:disabled{color:#a0a0a0;background-color:#1e1e1e99}body.dark-mode .control-btn:disabled:hover{color:silver;background-color:#282828cc}body.dark-mode .center-hex-btn{color:#e0e0e0;background-color:#2d2d2de6;border:1px solid #ffffff1a}body.dark-mode .center-hex-btn:hover{background-color:#3c3c3c;border-color:#fff3}body.dark-mode #navigationButtons h3{color:#f0f0f0}body.dark-mode .locations-area{background-color:#3a3a3a;border-color:#555}body.dark-mode .locations-area h3{color:#f0f0f0}body.dark-mode .locations-area li{color:#b0b0b0}body.dark-mode #characterOverlay{color:#e0e0e0;background-color:#2d2d2df2}body.dark-mode #characterBox h3{color:#f0f0f0}body.dark-mode #characterBox h4{color:#d0d0d0}body.dark-mode .stat-label{color:#b0b0b0}body.dark-mode .character-inventory{border-top-color:#555}body.dark-mode #inventoryList li{color:#b0b0b0;border-bottom-color:#444}#topLeftControls.hide-button{opacity:0;pointer-events:none;transition:opacity .3s}#topLeftControls.hide-button .control-btn{transition:transform .3s;transform:scale(.8)}#centerHexContainer,#topControls{transition:opacity .3s,pointer-events .3s}#infoOverlay,#characterOverlay{z-index:1000}#topLeftControls,#topControls,#centerHexContainer{z-index:999}.character-header,#skillsBox .info-header{border-bottom:2px solid #555;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:5px;display:flex}#skillsBox .info-header h3{color:#333;margin:0;font-size:1.1rem}body.dark-mode #skillsBox .info-header{border-bottom-color:#555}body.dark-mode #skillsBox .info-header h3{color:#f0f0f0}.character-header h3{color:#333;margin:0;font-size:1.1rem}#bigFiveViz{overflow:visible}#bigFiveSvg{display:block;overflow:visible}#bigFiveSvg text{fill:#333;dominant-baseline:central;-webkit-user-select:none;user-select:none;pointer-events:none;font-family:inherit;font-size:12px}body.dark-mode #bigFiveSvg text{fill:#e0e0e0;stroke:#0000008c;stroke-width:.6px;paint-order:stroke fill}@media (width<=768px){#bigFiveSvg text{font-size:10px}}.close-btn{color:#666;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;padding:5px;font-size:18px;transition:all .2s;display:flex}.close-btn:hover{color:#333;background-color:#0000001a}body.dark-mode .close-btn{color:#b0b0b0}body.dark-mode .close-btn:hover{color:#e0e0e0;background-color:#ffffff1a}.info-header{border-bottom:2px solid #555;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:5px;display:flex}.info-header h3{color:#333;margin:0;font-size:1.1rem}.info-content,#skillsBox .info-content{margin-bottom:15px;font-size:.9rem;line-height:1.4}body.dark-mode .info-header h3{color:#f0f0f0}body.dark-mode .info-header,body.dark-mode .character-header{border-bottom-color:#555}body.dark-mode .info-header{background-color:#2c2c2c;border-bottom:1px solid #444}#aiActionsBox .character-header{border-bottom:2px solid #555;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:5px;display:flex}#aiActionsBox .character-header h3{color:#333;margin:0;font-size:1.1rem}body.dark-mode #aiActionsBox .character-header{border-bottom-color:#555}body.dark-mode #aiActionsBox .character-header h3{color:#f0f0f0}#aiActionsOverlay{z-index:200;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#fffffff2;border-radius:10px;padding:15px;position:fixed;box-shadow:0 4px 12px #00000026;width:400px!important;min-width:400px!important;max-width:400px!important}#aiActionsBox{flex-direction:column;max-height:80vh;font-size:.9rem;line-height:1.4;display:flex;overflow:hidden}.ai-actions-area{flex-direction:column;flex:1;gap:10px;display:flex;overflow-y:auto}.locations-section{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:5px;margin-bottom:15px;padding:10px}.locations-section h4{color:#495057;margin:0 0 8px;font-size:.9rem}.locations-section ul{margin:0;padding-left:20px;font-size:.85rem}.locations-section li{color:#6c757d;margin:3px 0}.generate-section{justify-content:center;display:flex}.generate-btn{color:#333;cursor:pointer;text-align:center;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:1px solid #ddd;border-radius:5px;width:100%;margin:5px 0;padding:12px 16px;font-size:.85rem;transition:all .3s;display:block;box-shadow:0 2px 4px #0000001a}.generate-btn:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.generate-btn:active{transform:translateY(0)}.generate-btn:disabled{color:#fff;cursor:not-allowed;box-shadow:none;background:#6c757d;transform:none}.generated-actions{padding-top:10px}.generated-actions h4{color:#333;margin:0 0 15px;font-size:1.1rem;font-weight:600}.action-buttons{flex-direction:column;gap:10px;display:flex}.action-btn{cursor:pointer;text-align:left;color:#333;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:1px solid #ddd;border-radius:5px;width:100%;margin:5px 0;padding:12px 16px;font-size:.85rem;transition:all .3s;display:block;box-shadow:0 2px 4px #0000001a}.action-btn:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.action-btn:active{transform:translateY(0)}.action-type-badge{text-transform:uppercase;border-radius:3px;margin-right:6px;padding:2px 6px;font-size:.7rem;font-weight:700;display:inline-block}.action-type-physical{color:#fff;background-color:#dc3545}.action-type-mental{color:#fff;background-color:#007bff}.action-type-social{color:#fff;background-color:#28a745}.action-type-exploration{color:#333;background-color:#ffc107}.action-type-survival{color:#fff;background-color:#fd7e14}.action-type-mystical{color:#fff;background-color:#6f42c1}.loading-indicator{flex-direction:column;align-items:center;gap:15px;margin-top:20px;padding:20px;display:flex}.spinner{border:4px solid #f3f3f3;border-top-color:#555;border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-indicator p{color:#666;margin:0;font-size:.9rem;transition:opacity .15s ease-in-out}body.dark-mode #aiActionsOverlay{color:#e0e0e0;background-color:#282828f2}body.dark-mode #aiActionsOverlay .character-header h3{color:#e0e0e0}body.dark-mode .generated-actions{border:none}body.dark-mode .generated-actions h4{color:#e0e0e0}body.dark-mode .locations-section{background-color:#3a3a3a;border-color:#555}body.dark-mode .locations-section h4{color:#f0f0f0}body.dark-mode .locations-section li{color:#b0b0b0}body.dark-mode .loading-indicator{border:none}body.dark-mode .loading-indicator p{color:#aaa}body.dark-mode .action-type-physical{color:#fff;background-color:#e74c3c}body.dark-mode .action-type-mental{color:#fff;background-color:#3498db}body.dark-mode .action-type-social{color:#fff;background-color:#2ecc71}body.dark-mode .action-type-exploration{color:#222;background-color:#f39c12}body.dark-mode .action-type-survival{color:#fff;background-color:#e67e22}body.dark-mode .action-type-mystical{color:#fff;background-color:#9b59b6}body.dark-mode .spinner{border-color:#555 #444 #444}body.dark-mode .action-btn{color:#e0e0e0;background:linear-gradient(135deg,#4a4a4a,#3a3a3a);border-color:#666;box-shadow:0 2px 4px #0000004d}body.dark-mode .action-btn:hover{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:translateY(-1px);box-shadow:0 4px 8px #0006}body.dark-mode .generate-btn{color:#e0e0e0;background:linear-gradient(135deg,#4a4a4a,#3a3a3a);border-color:#666;box-shadow:0 2px 4px #0000004d}body.dark-mode .generate-btn:hover{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:translateY(-1px);box-shadow:0 4px 8px #0006}body.dark-mode .generate-btn:disabled{color:#fff;box-shadow:none;background:#6c757d;transform:none}.continue-btn{color:#333;cursor:pointer;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:1px solid #ddd;border-radius:5px;padding:12px 16px;font-size:.85rem;transition:all .3s;box-shadow:0 2px 4px #0000001a}.continue-btn:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}body.dark-mode .continue-btn{color:#e0e0e0;background:linear-gradient(135deg,#4a4a4a,#3a3a3a);border:1px solid #666;box-shadow:0 2px 4px #0000004d}body.dark-mode .continue-btn:hover{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:translateY(-1px);box-shadow:0 4px 8px #0006}@media (width<=768px){#aiActionsOverlay{box-sizing:border-box;padding:12px;width:calc(100vw - 20px)!important;min-width:auto!important;max-width:calc(100vw - 20px)!important}#aiActionsBox{max-height:70vh;font-size:.85rem;overflow:hidden}.generate-btn,.action-btn{padding:12px 16px;font-size:.85rem}.locations-section{padding:8px}.locations-section h4{font-size:.85rem}}.map-loading-overlay{z-index:10000;color:#fff;background-color:#000c;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;font-family:Arial,sans-serif;display:flex;position:fixed;top:0;left:0}.map-loading-overlay .loading-icon,.map-loading-overlay .error-icon{margin-bottom:20px;font-size:40px}.map-loading-overlay .loading-text{font-size:20px}.map-loading-overlay .error-text{color:#ff6b6b;font-size:20px}.map-loading-overlay .retry-btn{cursor:pointer;color:#fff;background:#333;border:1px solid #666;border-radius:5px;margin-top:20px;padding:10px 20px}.map-loading-overlay .retry-btn:hover{background:#444}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,Segoe UI,Roboto,sans-serif;font-weight:400;line-height:1.5}html,body{background-color:#f8f9fa;width:100vw;height:100vh;margin:0;padding:0;overflow:hidden}body.dark-mode{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}#root{flex-direction:column;width:100%;height:100%;display:flex}.outcome-overlay{z-index:10000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#000000b3;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.2s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.outcome-dialog-container{color:#333;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#fffffff2;border:1px solid #ddd;border-radius:15px;flex-direction:column;width:90%;max-width:500px;max-height:90vh;padding:25px;animation:.3s cubic-bezier(.175,.885,.32,1.275) scaleUp;display:flex;overflow:hidden;box-shadow:0 10px 30px #0000004d}@keyframes scaleUp{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.outcome-dialog-container.dark-mode{color:#e0e0e0;background-color:#2d2d2df2;border-color:#555}.outcome-header{align-items:center;margin-bottom:15px;display:flex}.outcome-icon{margin-right:10px;font-size:24px}.outcome-header h3{color:inherit;margin:0;font-size:1.2rem}.outcome-choice-box{border:1px solid inherit;background:#f0f0f0cc;border-radius:8px;margin-bottom:15px;padding:12px}.outcome-dialog-container.dark-mode .outcome-choice-box{background:#5555554d}.outcome-scroll-content{flex:1;margin-bottom:15px;padding-right:5px;overflow-y:auto}.outcome-result-box{align-items:flex-start;margin-bottom:15px;display:flex}.outcome-icon-sparks{flex-shrink:0;margin-top:2px;margin-right:10px;font-size:20px}.outcome-result-text{margin:0}.outcome-dialog-container.dark-mode .outcome-result-text{color:#d0d0d0}.outcome-footer{text-align:center}.outcome-continue-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#007bff,#0056b3);border:none;border-radius:20px;padding:10px 24px;font-size:1.1rem;font-weight:700;transition:all .3s;box-shadow:0 4px 6px #007bff4d}.outcome-continue-btn:hover{transform:translateY(-2px);box-shadow:0 6px 12px #007bff66}.outcome-continue-btn:active{transform:translateY(0)}#skillsBox{flex-direction:column;max-height:80vh;padding:0;font-size:.9rem;line-height:1.4;display:flex;overflow:hidden}#skillsContent{flex:1;overflow-y:auto}.skills-pathbar{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px;display:flex}.skills-pathbar .crumb{color:#333;cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:1px solid #ddd;border-radius:5px;align-items:center;gap:6px;padding:6px 12px;font-size:.85rem;transition:all .3s;display:inline-flex;box-shadow:0 2px 4px #0000001a}.skills-pathbar .crumb:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.skills-pathbar .crumb[data-active=true]{cursor:default;background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:none}.skills-pathbar .sep{color:#aaa;font-size:.9rem}body.dark-mode .skills-pathbar .crumb,.dark-mode .skills-pathbar .crumb{color:#e0e0e0;background:linear-gradient(135deg,#4a4a4a,#3a3a3a);border-color:#666;box-shadow:0 2px 4px #0000004d}body.dark-mode .skills-pathbar .crumb:hover,.dark-mode .skills-pathbar .crumb:hover{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:translateY(-1px);box-shadow:0 4px 8px #0006}body.dark-mode .skills-pathbar .crumb[data-active=true],.dark-mode .skills-pathbar .crumb[data-active=true]{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:none}body.dark-mode .skills-pathbar .sep,.dark-mode .skills-pathbar .sep{color:#666}.skills-detail{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:5px;margin-bottom:12px;padding:10px}.skills-detail h4{color:#495057;margin:0 0 8px;font-size:.9rem;font-weight:600}.skill-detail-value{color:#4caf50;font-weight:700}.skills-detail p{color:#6c757d;margin:0;font-size:.85rem;line-height:1.45}body.dark-mode .skills-detail,.dark-mode .skills-detail{background-color:#3a3a3a;border-color:#555}body.dark-mode .skills-detail h4,.dark-mode .skills-detail h4{color:#f0f0f0}body.dark-mode .skill-detail-value,.dark-mode .skill-detail-value{color:#8bc34a}body.dark-mode .skills-detail p,.dark-mode .skills-detail p{color:#b0b0b0}.favorites-counter{color:#6c757d;text-align:center;background:#f8f9fa;border:1px solid #e9ecef;border-radius:5px;margin-bottom:4px;padding:4px 12px;font-size:.85rem;font-weight:500}.favorites-counter.at-limit{color:#ff9800;font-weight:600}body.dark-mode .favorites-counter,.dark-mode .favorites-counter{color:#b0b0b0;background:#3a3a3a;border-color:#555}body.dark-mode .favorites-counter.at-limit,.dark-mode .favorites-counter.at-limit{color:#ffa726}.favorites-hint{color:#999;text-align:center;margin-bottom:8px;padding:2px 8px;font-size:.75rem;font-style:italic}body.dark-mode .favorites-hint,.dark-mode .favorites-hint{color:#777}.skill-favorite-icon{cursor:pointer;-webkit-user-select:none;user-select:none;margin-right:8px;font-size:18px;line-height:1;transition:all .2s;display:inline-block}.skill-favorite-icon.outline{color:#0000;-webkit-text-stroke:1.5px #64646466}.skill-favorite-icon.outline:hover:not(.disabled):not(.parent){-webkit-text-stroke-color:gold;transform:scale(1.1)}.skill-favorite-icon.filled{color:gold;filter:drop-shadow(0 0 2px #ffd7004d)}.skill-favorite-icon.filled:hover{filter:drop-shadow(0 0 4px #ffd70080);transform:scale(1.1)}.skill-favorite-icon.half-filled{background:linear-gradient(90deg,gold 50%,#0000 50%);-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px #64646466;cursor:default;-webkit-background-clip:text;background-clip:text}.skill-favorite-icon.disabled{opacity:.3;cursor:not-allowed}.skill-favorite-icon.disabled:hover{transform:none}.skill-favorite-icon.parent{cursor:default;opacity:.8}body.dark-mode .skill-favorite-icon.outline,.dark-mode .skill-favorite-icon.outline{-webkit-text-stroke-color:#ffffff4d}body.dark-mode .skill-favorite-icon.outline:hover:not(.disabled):not(.parent),.dark-mode .skill-favorite-icon.outline:hover:not(.disabled):not(.parent){-webkit-text-stroke-color:#ffc107}body.dark-mode .skill-favorite-icon.filled,.dark-mode .skill-favorite-icon.filled{color:#ffc107;filter:drop-shadow(0 0 2px #ffc1074d)}body.dark-mode .skill-favorite-icon.filled:hover,.dark-mode .skill-favorite-icon.filled:hover{filter:drop-shadow(0 0 4px #ffc10780)}body.dark-mode .skill-favorite-icon.half-filled,.dark-mode .skill-favorite-icon.half-filled{background:linear-gradient(90deg,#ffc107 50%,#0000 50%);-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px #ffffff4d;-webkit-background-clip:text;background-clip:text}.skills-list{flex-direction:column;gap:8px;display:flex}.skill-row{-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:1px solid #ddd;border-radius:5px;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:12px 16px;transition:all .3s;display:grid;box-shadow:0 2px 4px #0000001a}.skill-name-container{cursor:pointer;flex-direction:column;flex:1;gap:4px;display:flex}.skill-name-container:hover{opacity:.9}.skill-name-container.leaf{cursor:default}.skill-name-container.leaf:hover{opacity:1}.skill-name-row{grid-template-columns:1fr auto auto;align-items:center;gap:12px;display:grid}.skill-description{color:#6c757d;pointer-events:none;font-size:.75rem;line-height:1.3}.skill-row:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.skill-name{color:#333;pointer-events:none;font-size:.85rem;font-weight:500}.skill-value{color:#4caf50;text-align:right;pointer-events:none;min-width:28px;font-size:.85rem;font-weight:600}.skill-bar{pointer-events:none;background:#e0e0e0;border-radius:4px;width:100px;height:8px;overflow:hidden}.skill-progress{pointer-events:none;background:linear-gradient(90deg,#4caf50,#8bc34a);height:100%;transition:width .3s}.skills-list .skill-item{display:contents}body.dark-mode .skill-row,.dark-mode .skill-row{background:linear-gradient(135deg,#4a4a4a,#3a3a3a);border-color:#666;box-shadow:0 2px 4px #0000004d}body.dark-mode .skill-row:hover,.dark-mode .skill-row:hover{background:linear-gradient(135deg,#5a5a5a,#4a4a4a);transform:translateY(-1px);box-shadow:0 4px 8px #0006}body.dark-mode .skill-name,.dark-mode .skill-name{color:#e0e0e0}body.dark-mode .skill-value,.dark-mode .skill-value{color:#8bc34a}body.dark-mode .skill-bar,.dark-mode .skill-bar{background:#2a2a2a}body.dark-mode .skill-progress,.dark-mode .skill-progress{background:linear-gradient(90deg,#4caf50,#8bc34a)}body.dark-mode .skill-description,.dark-mode .skill-description{color:#999}.auth-user-info{border-radius:25px;width:auto;padding:0 15px;display:none}.auth-user-profile-display{flex-direction:column;align-items:flex-start;line-height:1.2;display:flex}.auth-user-name{font-size:14px}.auth-user-email{opacity:.8;font-size:11px}.auth-guest-badge{opacity:.8;font-size:11px;font-style:italic}.auth-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10000;color:#fff;text-align:center;background:#000000d9;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.auth-container{background:#ffffff1a;border:1px solid #fff3;border-radius:16px;width:90%;max-width:400px;padding:40px;box-shadow:0 8px 32px #00000080}.auth-title{margin:0 0 10px}.auth-subtitle{opacity:.8;margin:0 0 30px}.auth-button-container{flex-direction:column;align-items:center;gap:15px;display:flex}.auth-google-container{min-height:40px}.auth-unavailable-info{opacity:.7;margin:0;font-size:12px}.auth-divider{background:#fff3;width:100%;height:1px;margin:5px 0}.auth-guest-btn{color:#fff;cursor:pointer;background:0 0;border:1px solid #ffffff80;border-radius:4px;width:100%;max-width:200px;padding:10px 24px;font-size:14px;font-weight:500;transition:all .2s}.auth-guest-btn:hover{background:#ffffff1a}
