.app-header{background-color:var(--surface-color);padding:.5rem 0;position:sticky;top:0;z-index:100;box-shadow:0 2px 10px #00000014;border-bottom:1px solid var(--border-color)}.app-header nav{display:flex;justify-content:space-between;align-items:center;max-width:1280px;margin:0 auto;padding:.75rem 2rem}.app-header .logo{font-size:1.8em;font-weight:700;color:var(--primary-color);text-decoration:none}.app-header .logo:hover{color:var(--secondary-color)}.app-header .nav-links{display:flex;gap:1.5rem;flex-grow:1;justify-content:center}.app-header .nav-links a{font-size:1.05em;font-weight:500;color:var(--text-color);text-decoration:none;padding:.5em 0;position:relative;transition:color .2s ease}.app-header .nav-links a:after{content:"";position:absolute;width:0;height:2px;bottom:0;left:50%;transform:translate(-50%);background-color:var(--primary-color);transition:width .3s ease-in-out}.app-header .nav-links a:hover:after,.app-header .nav-links a.active:after{width:100%}.app-header .nav-links a:hover,.app-header .nav-links a.active{color:var(--primary-color);font-weight:600}.nav-auth-links{display:flex;align-items:center;gap:.75rem}.username-display{margin-right:1rem;font-weight:500;color:var(--text-color-muted)}.auth-button{padding:.5em 1em;font-size:.95em;margin:0;background-color:var(--accent-color);border-color:var(--accent-color)}.auth-button:hover{background-color:hsl(var(--accent-hue),60%,50%)}.auth-button.button-link-secondary{background-color:transparent;color:var(--text-color-muted);border:1px solid var(--border-color)}.auth-button.button-link-secondary:hover{background-color:var(--surface-color-lighter);border-color:var(--text-color-muted);color:var(--text-color)}.app-footer{background-color:var(--surface-color);padding:1.5rem 2rem;margin-top:3rem;border-top:1px solid var(--border-color);text-align:center;font-size:.9em;color:var(--text-color-muted)}.app-footer p{margin-bottom:.3rem}.homepage-hero{padding:4rem 1rem;text-align:center;background:linear-gradient(135deg,hsla(var(--primary-hue),75%,65%,.1),hsla(var(--secondary-hue),65%,70%,.1));border-radius:12px;margin-bottom:2rem}.homepage-hero h1{font-size:3.5em;margin-bottom:.5em;color:var(--primary-color);font-weight:700}.homepage-hero .tagline{font-size:1.5em;color:var(--text-color-muted);margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}.homepage-cta-buttons .button-link{font-size:1.2em;padding:.8em 2em;margin:.5em .8em}.homepage-content-sections{margin-top:3rem}.quiz-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:25px;margin-top:25px}.quiz-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:10px;padding:0;display:flex;flex-direction:column;box-shadow:0 4px 12px #00000012;transition:transform .25s ease-in-out,box-shadow .25s ease-in-out;overflow:hidden}.quiz-card:hover{transform:translateY(-6px);box-shadow:0 8px 20px #0000001a}.quiz-card-thumbnail{width:100%;height:180px;object-fit:cover}.quiz-card-content{padding:20px;flex-grow:1;display:flex;flex-direction:column}.quiz-card h3{margin-top:0;margin-bottom:10px;color:var(--primary-color);font-size:1.4em}.quiz-card h3 a{color:var(--primary-color)}.quiz-card-rating{margin-bottom:12px;display:flex;align-items:center}.interactive-rating-text{margin-right:5px;font-size:.9em}.quiz-card-description{font-size:.95em;color:var(--text-color-muted);flex-grow:1;margin-bottom:15px;line-height:1.5}.quiz-card-meta{font-size:.8em;color:var(--text-color-muted);display:flex;justify-content:space-between;margin-bottom:15px;border-top:1px solid var(--border-color);padding-top:10px}.author-link{color:var(--accent-color);font-weight:500}.author-link:hover{color:var(--primary-color)}.quiz-card-tags{margin-bottom:15px;display:flex;flex-wrap:wrap;gap:6px}.quiz-card-tags .tag{background-color:var(--primary-color-transparent);color:var(--primary-color);padding:4px 10px;border-radius:15px;font-size:.8em;font-weight:500;border:1px solid var(--primary-color-semi-transparent)}.quiz-card-button{width:100%;box-sizing:border-box;text-align:center;border-radius:0 0 8px 8px;margin:auto 0 0}.search-bar-container{margin-bottom:25px;display:flex;justify-content:center}.search-input{width:100%;max-width:600px;padding:12px 18px;font-size:1em}.take-quiz-container{max-width:800px;margin:2rem auto}.quiz-header-details{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px;gap:15px}.quiz-title-and-rating{flex-grow:1}.quiz-title-and-rating .page-title{text-align:left;margin-bottom:8px}.quiz-meta-actions{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.quiz-timer{font-size:1.1em;font-weight:700;color:var(--primary-color);background-color:var(--surface-color-lighter);padding:6px 12px;border-radius:6px;min-width:100px;text-align:center}.quiz-progress{text-align:right;font-size:.9em;color:var(--text-color-muted);margin-bottom:1rem}.question-container{background-color:var(--surface-color);padding:30px;border-radius:10px;margin-bottom:25px;border:1px solid var(--border-color);box-shadow:0 3px 8px #0000000d}.question-container h2{margin-top:0;margin-bottom:25px;font-size:1.6em;line-height:1.4}.options-container{display:flex;flex-direction:column;gap:12px}.option-button{background-color:var(--background-color);color:var(--text-color);border:1px solid var(--border-color);padding:14px 20px;text-align:left;font-size:1.05em;border-radius:8px;width:100%}.option-button:hover{background-color:var(--primary-color-transparent);border-color:var(--primary-color)}.option-button.selected{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color);font-weight:500}.quiz-navigation{display:flex;justify-content:flex-end;margin-top:25px}.quiz-results-container{text-align:center}.quiz-results-container h2{margin-bottom:.5rem;color:var(--text-color)}.quiz-score{font-size:2.2em;font-weight:700;color:var(--primary-color);margin:25px 0}.quiz-results-container ul{list-style-type:none;padding:0;text-align:left;max-width:550px;margin:25px auto}.quiz-results-container li{background-color:var(--surface-color);border:1px solid var(--border-color);padding:12px;margin-bottom:10px;border-radius:6px}.quiz-results-container li strong{color:var(--primary-color)}.quiz-actions{margin-top:35px;display:flex;justify-content:center;gap:20px}.personality-result{margin:25px 0;padding:25px;background-color:var(--surface-color-lighter);border-radius:10px;text-align:center}.personality-result h3{color:var(--primary-color);margin-bottom:18px}.outcome-image{max-width:100%;max-height:350px;border-radius:8px;margin-bottom:18px;object-fit:contain;box-shadow:0 4px 10px #0000001a}.fitb-input-container{display:flex;align-items:center;gap:8px;margin:25px 0;font-size:1.2em}.fitb-answer-input{width:auto;flex-grow:1;max-width:350px;padding:10px 14px;font-size:1em}.matching-question-container{margin-top:25px}.matching-instructions{margin-bottom:18px;font-style:italic;color:var(--text-color-muted)}.matching-pair-row{display:flex;align-items:center;margin-bottom:14px;padding:12px;background-color:var(--surface-color-lighter);border-radius:8px}.matching-prompt{flex:1;padding-right:12px;font-weight:500}.matching-arrow{font-size:1.3em;margin:0 12px;color:var(--primary-color)}.matching-select-wrapper{flex:1.5}.matching-select{width:100%;padding:10px 12px}.sequence-question-take{margin-top:25px}.sequence-instructions{margin-bottom:18px;font-style:italic;color:var(--text-color-muted)}.sequence-item-take{-webkit-user-select:none;user-select:none;padding:12px 15px;margin:0 0 10px;background-color:var(--surface-color-lighter);border:1px solid var(--border-color);border-radius:6px;display:flex;align-items:center;font-weight:500}.sequence-item-take.is-dragging{background-color:var(--primary-color-transparent);box-shadow:0 3px 8px #00000026}.create-quiz-container{max-width:900px;margin:2rem auto}.quiz-form .form-group{margin-bottom:22px}.quiz-form label{font-weight:500}.personality-outcomes-editor,.question-editor,.fitb-answers-editor,.matching-items-editor,.sequence-items-editor{background-color:var(--surface-color-lighter);padding:25px;border-radius:10px;margin-bottom:30px;border:1px solid var(--border-color)}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.question-header h4{margin:0;color:var(--primary-color)}.remove-button,.add-button{background-color:var(--primary-color-transparent);color:var(--primary-color);border:1px solid var(--primary-color-semi-transparent);padding:7px 14px;border-radius:6px;font-size:.95em}.remove-button:hover,.add-button:hover{background-color:var(--primary-color-semi-transparent)}.remove-button.remove-question-button{background-color:#e052521a;color:#e05252;border-color:#e052524d}.remove-button.remove-question-button:hover{background-color:#e052524d}.option-editor{display:flex;align-items:center;margin-bottom:12px;gap:12px}.option-input{flex-grow:1}.correct-option-label{display:flex;align-items:center;font-size:.95em;white-space:nowrap;margin-left:5px}.correct-option-label input[type=radio]{margin-right:6px}.remove-option-button{background:none;border:none;color:var(--text-color-muted);font-size:1.6em;cursor:pointer;padding:0 5px;line-height:1}.remove-option-button:hover{color:#e05252}.add-option-button,.add-question-button,.add-fitb-answer-button,.add-match-item-button,.add-sequence-item-button{margin-top:12px;display:inline-block}.add-question-button{margin-bottom:25px}.submit-quiz-button{display:block;width:auto;margin:35px auto 0;padding:12px 35px;font-size:1.15em}.fitb-answer-item{display:flex;align-items:center;margin-bottom:10px;gap:10px}.matching-item-pair{display:flex;align-items:center;margin-bottom:12px;gap:12px}.matching-separator{font-size:1.3em;font-weight:700;color:var(--primary-color)}.sequence-item-create{display:flex;align-items:center;margin-bottom:10px;padding:10px;background-color:var(--background-color);border:1px solid var(--border-color);border-radius:6px;gap:10px}.sequence-item-create.is-dragging{background-color:var(--primary-color-transparent);box-shadow:0 3px 8px #00000026}.drag-handle{cursor:grab;padding:0 10px;font-size:1.3em;color:var(--text-color-muted)}.auth-form-container{max-width:480px;margin:2.5rem auto;padding:2.5rem}.auth-form .form-group{margin-bottom:1.8rem}.auth-form button[type=submit]{width:100%;padding:.85rem;font-size:1.1em}.auth-switch-link{text-align:center;margin-top:1.8rem;font-size:.95em}.form-error-message,.form-success-message{padding:12px 15px;margin-bottom:18px;border-radius:6px;text-align:center;font-weight:500}.form-error-message{background-color:#e052521a;border:1px solid hsl(0,70%,60%);color:#c33}.form-success-message{background-color:#2eb82e1a;border:1px solid hsl(120,60%,45%);color:#2d862d}@media (prefers-color-scheme: dark){.form-error-message{color:#e87d7d}.form-success-message{color:#70db70}}.social-share-container{margin-top:35px;padding-top:25px;border-top:1px solid var(--border-color)}.social-share-container h4{text-align:center;margin-bottom:18px;font-size:1.3em;color:var(--text-color)}.social-share-buttons{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:18px}.social-share-button{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background-color:var(--social-color, var(--surface-color));color:#fff;text-decoration:none;transition:transform .2s ease-out,box-shadow .2s ease-out;border:none;box-shadow:0 3px 6px #0000001a}.social-share-button:hover{transform:scale(1.12) translateY(-2px);box-shadow:0 6px 12px #00000026}.social-share-button svg{fill:#fff}.copy-link-button{cursor:pointer;font-family:inherit}.comment-section{margin-top:45px;padding-top:25px;border-top:1px solid var(--border-color)}.comment-section h3{margin-bottom:22px;color:var(--primary-color)}.comment-form{margin-bottom:35px}.comment-form textarea{width:100%;padding:12px 15px;min-height:90px;margin-bottom:12px}.comment-form button{display:block;margin-left:auto}.comment-list{list-style:none;padding:0}.comment-item{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;padding:18px;margin-bottom:18px;position:relative;box-shadow:0 2px 4px #0000000a}.comment-header-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.comment-author{font-size:.95em}.comment-author strong{color:var(--primary-color)}.comment-date{color:var(--text-color-muted);font-size:.85em}.comment-text{margin:0;line-height:1.65;white-space:pre-wrap}.comment-actions .report-button{margin-left:8px}.delete-comment-button{position:static;background:none;border:none;color:var(--text-color-muted);cursor:pointer;font-size:.85em;padding:5px}.delete-comment-button:hover{color:#e05252}.login-prompt-comment{padding:18px;background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;text-align:center;margin-bottom:25px}.admin-table{width:100%;border-collapse:collapse;margin-top:25px;font-size:.9em}.admin-table th,.admin-table td{border:1px solid var(--border-color);padding:10px 14px;text-align:left}.admin-table th{background-color:var(--surface-color);color:var(--primary-color);font-weight:600}.admin-table tbody tr:nth-child(2n){background-color:var(--surface-color-lighter)}.admin-table td a{color:var(--accent-color)}.button-danger-small{background-color:#e23636;color:#fff;border:none;padding:6px 12px;border-radius:5px;cursor:pointer;font-size:.9em}.button-danger-small:hover{background-color:#df2020}.button-success-small{background-color:#29a847;color:#fff;border:none;padding:6px 12px;border-radius:5px;cursor:pointer;font-size:.9em;margin-right:5px}.button-success-small:hover{background-color:#24943e}.button-warning-small{background-color:#ffc105;color:#212529;border:none;padding:6px 12px;border-radius:5px;cursor:pointer;font-size:.9em;margin-right:5px}.button-warning-small:hover{background-color:#ebb000}.button-link-small{font-size:.9em;padding:6px 12px;margin-left:5px}.admin-dashboard-links{list-style:none;padding:0;margin-top:25px}.admin-dashboard-links li{margin-bottom:18px}.admin-dashboard-links .button-link{display:inline-block;min-width:220px}.admin-filters{margin-bottom:25px;display:flex;align-items:center;gap:12px}.form-select-small{padding:5px 10px;font-size:.9em}.dashboard-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:25px;margin-bottom:35px}.stat-card{background-color:var(--surface-color);padding:25px;border-radius:10px;text-align:center;border:1px solid var(--border-color);box-shadow:0 3px 8px #0000000f}.stat-card h2{font-size:2.8em;color:var(--primary-color);margin:0 0 8px}.stat-card p{margin:0;font-size:1.05em;color:var(--text-color-muted)}.stat-card-warning h2{color:#ffc105}.stat-card-link{display:inline-block;margin-top:12px;font-size:.95em;color:var(--primary-color);text-decoration:underline}.full-width-card{grid-column:1 / -1;text-align:left}.full-width-card h3{margin-bottom:12px}.full-width-card ul{list-style:none;padding:0}.ad-placeholder{display:flex;align-items:center;justify-content:center;background-color:var(--surface-color-lighter);border:1px dashed var(--border-color);color:var(--text-color-muted);font-size:.9em;text-align:center;margin:25px auto;border-radius:6px}.quiz-type-editor-form{padding:20px;border:1px solid var(--border-color);border-radius:8px;margin-top:20px;background-color:var(--surface-color-lighter)}.quiz-type-editor-form h3{margin-top:0;padding-bottom:10px;border-bottom:1px solid var(--border-color);margin-bottom:20px}:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;line-height:1.6;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;color-scheme:light dark;--primary-hue: 220;--secondary-hue: 260;--accent-hue: 160;--text-light: #f0f0f5;--text-dark: #1a1a2e;--bg-light: #ffffff;--bg-dark: #161625;--surface-light: #f8f9fa;--surface-dark: #1e1e32;--border-light: #dee2e6;--border-dark: #3a3a5a;--primary-color-light: hsl(var(--primary-hue), 70%, 55%);--primary-color-dark: hsl(var(--primary-hue), 75%, 65%);--secondary-color-light: hsl(var(--secondary-hue), 60%, 60%);--secondary-color-dark: hsl(var(--secondary-hue), 65%, 70%);--accent-color-light: hsl(var(--accent-hue), 60%, 45%);--accent-color-dark: hsl(var(--accent-hue), 65%, 55%);--primary-color-transparent-light: hsla(var(--primary-hue), 70%, 55%, .1);--primary-color-transparent-dark: hsla(var(--primary-hue), 75%, 65%, .1);--primary-color-semi-transparent-light: hsla(var(--primary-hue), 70%, 55%, .3);--primary-color-semi-transparent-dark: hsla(var(--primary-hue), 75%, 65%, .3);--text-color: var(--text-dark);--background-color: var(--bg-light);--surface-color: var(--surface-light);--surface-color-lighter: #ffffff;--border-color: var(--border-light);--primary-color: var(--primary-color-light);--secondary-color: var(--secondary-color-light);--accent-color: var(--accent-color-light);--primary-color-transparent: var(--primary-color-transparent-light);--primary-color-semi-transparent: var(--primary-color-semi-transparent-light);--text-color-muted: #555e68}@media (prefers-color-scheme: dark){:root{--text-color: var(--text-light);--background-color: var(--bg-dark);--surface-color: var(--surface-dark);--surface-color-lighter: #2a2a45;--border-color: var(--border-dark);--primary-color: var(--primary-color-dark);--secondary-color: var(--secondary-color-dark);--accent-color: var(--accent-color-dark);--primary-color-transparent: var(--primary-color-transparent-dark);--primary-color-semi-transparent: var(--primary-color-semi-transparent-dark);--text-color-muted: #a0a8b0}}body{margin:0;display:flex;flex-direction:column;min-height:100vh;background-color:var(--background-color);color:var(--text-color);transition:background-color .3s,color .3s}#root{max-width:1280px;margin:0 auto;padding:2rem;width:100%;box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.75rem;font-weight:600;line-height:1.3;color:var(--primary-color)}h1{font-size:2.8rem}h2{font-size:2rem}h3{font-size:1.6rem}h4{font-size:1.3rem}p{margin-bottom:1rem}a{font-weight:500;color:var(--accent-color);text-decoration:none;transition:color .2s ease-in-out}a:hover{color:var(--primary-color);text-decoration:underline}button,.button-link{border-radius:8px;border:1px solid transparent;padding:.7em 1.5em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--primary-color);color:#fff;cursor:pointer;transition:background-color .2s ease-in-out,box-shadow .2s ease-in-out,transform .1s ease-in-out;text-decoration:none;display:inline-block;margin:.5em;box-shadow:0 2px 4px #0000001a}button:hover,.button-link:hover{background-color:hsl(var(--primary-hue),70%,60%);box-shadow:0 4px 8px #00000026;transform:translateY(-1px)}@media (prefers-color-scheme: dark){button:hover,.button-link:hover{background-color:hsl(var(--primary-hue),75%,70%)}}button:focus,button:focus-visible,.button-link:focus,.button-link:focus-visible{outline:3px solid hsla(var(--primary-hue),75%,65%,.5);outline-offset:2px}button:disabled,.button-link:disabled{background-color:var(--text-color-muted);color:var(--background-color);cursor:not-allowed;opacity:.7;box-shadow:none;transform:none}.container{padding:25px;background-color:var(--surface-color);border-radius:12px;box-shadow:0 5px 15px #00000014;margin-bottom:25px;transition:background-color .3s,box-shadow .3s}.page-container{display:flex;flex-direction:column;min-height:calc(100vh - 4rem)}.main-content{flex-grow:1;padding-top:1rem}.form-input,.form-textarea,.form-select{width:100%;padding:12px 15px;border:1px solid var(--border-color);border-radius:6px;background-color:var(--background-color);color:var(--text-color);font-size:1em;box-sizing:border-box;transition:border-color .2s,box-shadow .2s}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px var(--primary-color-transparent)}.form-textarea{min-height:100px;resize:vertical}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500;color:var(--text-color)}.form-checkbox-group{display:flex;align-items:center;gap:.5rem}.form-checkbox-group input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary-color)}.form-checkbox-group label{margin-bottom:0;font-weight:400}.page-title{margin-bottom:1.5rem;color:var(--primary-color);text-align:center}