#app,body,html{height:100%;margin:0;padding:0;overflow:auto}:root{--primary-color:#b3925b;--primary-hover:#9d7b3e;--secondary-color:#f8f4e3;--text-color:#2c2b2b;--text-light:#666;--dark-bg:#2a2a2a;--dark-panel:#3a3a3a;--dark-border:#404040;--dark-text:#fff;--dark-text-muted:#ccc;--success-color:#28a745;--success-hover:#218838;--warning-color:#ffc107;--error-color:#dc3545;--info-color:#007bff;--font-family-brand:"Special Elite",Courier,monospace;--font-family-code:"Courier New",Consolas,Monaco,monospace;--font-family-ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-xs:0.75rem;--font-sm:0.875rem;--font-base:1rem;--font-lg:1.125rem;--font-xl:1.25rem;--font-2xl:1.5rem;--font-3xl:2rem;--space-xs:0.25rem;--space-sm:0.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--radius-xs:4px;--radius-sm:6px;--radius-md:8px;--radius-lg:10px;--radius-xl:12px;--radius-full:9999px;--shadow-sm:0 1px 2px rgba(0,0,0,.1);--shadow-md:0 2px 8px rgba(0,0,0,.1);--shadow-lg:0 4px 12px rgba(0,0,0,.15);--shadow-xl:0 8px 24px rgba(0,0,0,.2);--transition-fast:0.15s ease;--transition-base:0.2s ease;--transition-slow:0.3s ease}body{background:url(https://www.transparenttextures.com/patterns/paper-fibers.png);font-family:var(--font-family-brand);color:var(--text-color);text-align:center;margin:0;padding:0;line-height:1.5}.btn,.case-button,.subscribe-button,button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);font-family:var(--font-family-brand);font-size:var(--font-base);font-weight:600;text-decoration:none;padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-sm);cursor:pointer;background-color:var(--primary-color);color:#fff;box-shadow:var(--shadow-sm);transition:all var(--transition-base);-webkit-user-select:none;-moz-user-select:none;user-select:none}.btn:hover,.case-button:hover,.subscribe-button:hover,button:hover{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn:active,.case-button:active,.subscribe-button:active,button:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.btn:disabled,button:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:var(--shadow-sm)}.btn-secondary,.toggle-instructions-btn{background-color:var(--dark-panel);color:var(--dark-text);border:1px solid var(--dark-border)}.btn-secondary:hover,.toggle-instructions-btn:hover{background-color:var(--dark-border);transform:translateY(-1px)}.btn-success{background-color:var(--success-color);color:#fff}.btn-success:hover{background-color:var(--success-hover)}.btn-small{padding:var(--space-xs) var(--space-sm);font-size:var(--font-sm);border-radius:var(--radius-xs)}.btn-large{padding:var(--space-md) var(--space-lg);font-size:var(--font-lg);border-radius:var(--radius-md)}a{text-decoration:none;color:inherit}nav{background:var(--secondary-color);padding:var(--space-lg) var(--space-2xl);border-bottom:4px solid var(--primary-color);display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-xl);box-shadow:inset 0 -3px 5px rgba(0,0,0,.2);font-family:var(--font-family-code)}nav a{font-weight:600;font-size:var(--font-base);background-color:#dfd3c3;border:2px solid var(--primary-color);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);transition:all var(--transition-base);box-shadow:1px 1px 0 var(--primary-color);color:#3e3a2f;text-decoration:none}nav a:hover{background-color:#e6cfa8;transform:translateY(-2px);box-shadow:var(--shadow-md)}nav a.router-link-exact-active{background-color:var(--primary-color);color:#fff;transform:translateY(-1px)}.access-card,.case-container,.editor-wrapper,.home-container{width:100%;max-width:1000px;margin:0 auto;padding:var(--space-xl) var(--space-md);box-sizing:border-box}.editor-wrapper{width:100%;overflow-x:hidden}.card,.feature,.mystery-box,.super-mystery-box{background-color:var(--secondary-color);border:2px solid var(--primary-color);border-radius:var(--radius-lg);padding:var(--space-xl);margin-bottom:var(--space-xl);text-align:center;box-shadow:var(--shadow-md);transition:transform var(--transition-base),box-shadow var(--transition-base)}.card:hover,.feature:hover,.mystery-box:hover,.super-mystery-box:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.feature{max-width:250px;border-style:dashed}.feature.case-feature{width:100%;max-width:100%;box-sizing:border-box}.card-dark{background-color:var(--dark-bg);border-color:var(--dark-border);color:var(--dark-text)}.card-compact{padding:var(--space-lg);margin-bottom:var(--space-lg)}.how-it-works{display:flex;justify-content:center;gap:2rem;flex-wrap:nowrap;margin:3rem 0;overflow-x:auto}.footer{background-color:var(--secondary-color);padding:.75rem;font-size:.85rem;border-top:4px solid var(--primary-color);font-family:var(--font-family-main);box-shadow:inset 0 -3px 5px rgba(0,0,0,.2)}.container{max-width:1000px;margin:0 auto;padding:0 1rem;box-sizing:border-box}.case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;justify-items:center;width:100%}.case-card{background-color:#fdf8ef;border:2px solid var(--primary-color);border-radius:var(--radius-lg);padding:var(--space-lg);font-family:var(--font-family-code);text-align:left;transition:transform var(--transition-base);box-shadow:var(--shadow-sm)}.case-card:hover{background-color:#f9f2d7;transform:translateY(-4px);box-shadow:var(--shadow-md)}.case-card h3{font-family:var(--font-family-brand);margin-bottom:var(--space-sm);font-size:var(--font-lg)}.visually-hidden{position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0}@media (max-width:768px){nav{flex-direction:column;align-items:center;gap:1rem;padding:20px 10px}.case-button,.subscribe-button,nav a{width:90%;max-width:300px;text-align:center}.how-it-works{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:2rem;margin:3rem auto;padding:0 1rem}.home-container,.how-it-works{max-width:1000px;box-sizing:border-box}.home-container{width:100%;margin:0 auto;padding:2rem 1rem 0}}.main-content{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap}.editor-panel{width:100%;background-color:#fdf8ef;border:2px solid var(--primary-color);border-radius:var(--radius-lg);padding:var(--space-xl);box-shadow:var(--shadow-md);font-family:var(--font-family-code);display:flex;flex-direction:column;min-height:400px;overflow:auto;box-sizing:border-box}.reduced-top-padding{padding-top:0}#editor{flex:1;width:100%;min-height:500px;font-size:var(--font-base);padding:var(--space-md);border:1px solid #ccc;border-radius:var(--radius-md);font-family:var(--font-family-code);resize:vertical;box-sizing:border-box;transition:border-color var(--transition-base)}#editor:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px rgba(179,146,91,.2)}.editor-header{display:flex;justify-content:flex-end;margin-bottom:var(--space-md);gap:var(--space-sm)}.fade-slide-enter-active,.fade-slide-leave-active{transition:opacity .3s ease,transform .3s ease}.fade-slide-enter-from,.fade-slide-leave-to{opacity:0;transform:translateX(-20px)}.takeaway-card{background-color:var(--secondary-color);border:2px solid var(--primary-color);border-radius:var(--radius-lg);padding:var(--space-lg);margin-top:var(--space-xl);box-shadow:var(--shadow-md);font-family:var(--font-family-brand);color:var(--text-color);text-align:left}.takeaway-header{font-size:var(--font-xl);font-weight:600;color:var(--primary-color);margin-bottom:var(--space-md);border-bottom:1px dashed var(--primary-color);padding-bottom:var(--space-sm)}.takeaway-content{margin:0 0 var(--space-md);line-height:1.6;font-size:var(--font-base)}.takeaway-info{font-size:var(--font-sm);color:var(--text-light);line-height:1.5}.info-card{background-color:var(--secondary-color);border:2px solid var(--primary-color);border-radius:var(--radius-lg);padding:var(--space-lg);margin-top:var(--space-xl);box-shadow:var(--shadow-md);font-family:var(--font-family-brand);color:var(--text-color);text-align:left}.info-card-header{font-size:var(--font-xl);font-weight:600;color:var(--primary-color);margin-top:var(--space-md);margin-bottom:var(--space-md);border-bottom:1px dashed var(--primary-color);padding-bottom:var(--space-sm)}.code-example pre{background:#fdf8ef;padding:1rem;border-radius:8px;overflow-x:auto;font-family:var(--font-family-alt);font-size:.9rem}.learn-more a{color:var(--primary-color);font-weight:700;text-decoration:underline}.clue-strip{background:var(--primary-color);color:#fff;padding:.75rem 1rem;border-radius:6px 6px 0 0;font-size:1rem;margin-bottom:1rem;text-align:left}.clue-strip,.maybe-next-time{font-family:var(--font-family-main)}.maybe-next-time{text-align:center;padding:2rem;max-width:500px;margin:0 auto}.rank-label{font-size:.85rem;color:var(--primary-color);font-weight:700;margin-bottom:.5rem;font-family:var(--font-family-main)}.feature-box-wrapper{text-decoration:none;color:inherit;display:block}.feature-box-wrapper:hover .feature{transform:translateY(-4px);transition:transform .2s ease}.back-button{display:inline-block;margin-bottom:1rem;font-weight:700;color:var(--primary-color);text-decoration:underline;font-family:var(--font-family-main)}.back-button:hover{color:var(--hover-color)}.lock-badge{border:1px solid #f5c6cb;padding:.25rem .5rem;border-radius:5px}.lock-badge,.membership-lock{margin-top:1rem;font-size:.9rem;font-weight:700;color:#b94e4e;background-color:#fcebea;display:inline-block}.membership-lock{border:1px solid #f5c6cb;padding:.4rem .75rem;border-radius:6px;font-family:var(--font-family-alt)}.case-intro{position:relative;text-align:center;padding:2rem;padding-bottom:4rem;background-color:var(--secondary-color);border:2px solid var(--primary-color);border-radius:10px;box-shadow:var(--box-shadow);font-family:var(--font-family-main);display:flex;flex-direction:column;align-items:center}.intro-text{max-width:600px}.intro-text h2{font-size:1.5rem;margin-bottom:1rem;text-align:center}.intro-text p{text-align:center;line-height:1.6}.intro-actions{margin-top:2rem;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.refuse{background-color:#aaa}.refuse:hover{background-color:#888}.toggle-clue-btn{margin-left:.5rem}.header-buttons{display:flex;gap:.75rem}