*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246/0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246/0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*
! tailwindcss v3.4.18 | MIT License | https://tailwindcss.com
*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.top-24{top:6rem}.isolate{isolation:isolate}.mx-auto{margin-left:auto;margin-right:auto}.mb-8{margin-bottom:2rem}.\!block{display:block!important}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.table{display:table}.grid{display:grid}.hidden{display:none}.\!h-full{height:100%!important}.h-\[100px\]{height:100px}.h-\[600px\]{height:600px}.h-\[90px\]{height:90px}.h-full{height:100%}.max-h-\[160px\]{max-height:160px}.\!w-full{width:100%!important}.w-\[160px\]{width:160px}.w-full{width:100%}.max-w-\[1200px\]{max-width:1200px}.max-w-\[720px\]{max-width:720px}.max-w-\[728px\]{max-width:728px}.shrink{flex-shrink:1}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.items-center{align-items:center}.justify-center{justify-content:center}.overflow-hidden{overflow:hidden}.border{border-width:1px}.border-0{border-width:0}.bg-\[\#5dd8d0\]{--tw-bg-opacity:1;background-color:rgb(93 216 208/var(--tw-bg-opacity,1))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.text-xs{font-size:.75rem;line-height:1rem}.uppercase{text-transform:uppercase}.tracking-widest{letter-spacing:.1em}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity,1))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.text-white\/70{color:rgb(255 255 255/.7)}.underline{text-decoration-line:underline}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}body{font-family:Roboto,Arial,Helvetica,sans-serif;margin:0;padding:0;background-color:#ffffff;color:#333;line-height:1.6}.container{max-width:1400px;margin:0 auto;padding:0 20px}.main-header{background-color:rgba(255,255,255,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:15px 0;box-shadow:0 2px 15px rgba(0,0,0,.08);position:sticky;top:0;z-index:1000;border-bottom:1px solid rgba(0,0,0,.05)}.header-content{display:flex;justify-content:space-between;align-items:center}.logo h1{margin:0;font-size:24px;font-weight:700;letter-spacing:-.5px}.logo h1 a{text-decoration:none;color:#333;display:flex;align-items:center;gap:10px}.logo-g{color:#4285F4}.logo-o1{color:#EA4335}.logo-o2{color:#FBBC05}.logo-g2{color:#4285F4}.logo-l{color:#34A853}.logo-e{color:#EA4335}.main-header nav>ul{list-style:none;margin:0;padding:0;display:flex;align-items:center}.main-header nav>ul>li{margin-left:20px}.main-header nav>ul>li>a{text-decoration:none;color:#555;font-weight:500;font-size:.95rem;padding:8px 12px;border-radius:6px;transition:all .3s ease}.main-header nav>ul>li>a:hover{color:#007bff;background-color:rgba(0,123,255,.05)}.main-header nav>ul>li>a.active{color:#007bff;font-weight:700}.dropdown{position:relative;display:inline-flex;align-items:center}.dropdown-content{display:grid;grid-template-columns:repeat(2,180px);gap:5px;position:absolute;background-color:rgba(255,255,255,.98);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 20px 50px rgba(0,0,0,.15),0 5px 15px rgba(0,0,0,.05);z-index:1001;border-radius:18px;padding:12px;list-style:none;top:100%;left:50%;transform:translateX(-50%) translateY(15px);opacity:0;visibility:hidden;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid rgba(0,0,0,.08);pointer-events:none;margin:8px 0 0}.dropdown:after{content:"";position:absolute;top:100%;left:0;width:100%;height:20px;z-index:1000}.dropdown:hover .dropdown-content{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);pointer-events:all}.dropdown:hover .arrow{transform:rotate(180deg)}.dropdown-content:before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%) rotate(45deg);width:12px;height:12px;background-color:#ffffff;border-left:1px solid rgba(0,0,0,.06);border-top:1px solid rgba(0,0,0,.06)}.dropdown-content li{margin:0!important;display:block}.dropdown-content li a{color:#444;padding:12px 14px;display:flex;align-items:center;font-size:.9rem;border-radius:10px;transition:all .2s ease;border:1px solid transparent}.dropdown-content li a:hover{background:linear-gradient(135deg,#f0f7ff,#e1efff);color:#007bff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,123,255,.1);border-color:rgba(0,123,255,.1)}.arrow{font-size:.65rem;margin-left:6px;vertical-align:middle;transition:transform .3s ease;opacity:.7}.dropdown-content li.view-all-item{grid-column:span 2;margin-top:10px!important;padding-top:10px;border-top:1px solid rgba(0,0,0,.08)}.dropdown-content li.view-all-item a{background:#f8f9fa;color:#4285F4!important;justify-content:center;font-weight:700;letter-spacing:.5px;border:1px solid rgba(66,133,244,.2);transition:all .3s cubic-bezier(.4,0,.2,1)}.dropdown-content li.view-all-item a:hover{background:#4285F4;color:white!important;transform:translateY(-2px);box-shadow:0 4px 12px rgba(66,133,244,.25);border-color:transparent}.explore-grid{gap:30px;margin-top:30px}.explore-item{background:#ffffff;padding:30px;border-radius:16px;transition:all .3s ease;text-align:left}.explore-item:hover{transform:translateY(-5px);box-shadow:0 10px 30px rgba(0,0,0,.05);border-color:#007bff}.explore-icon{font-size:2.5rem;margin-bottom:20px}.explore-item h3{margin:0 0 15px;font-size:1.4rem}.explore-item p{flex-grow:1}.card-link{color:#007bff;text-decoration:none;font-weight:700;font-size:.95rem}.card-link:hover{text-decoration:underline}.breadcrumbs{display:flex;align-items:center;gap:8px;margin-bottom:20px;font-size:.9rem;color:#666}.breadcrumbs a{color:#007bff;text-decoration:none;transition:color .3s ease}.breadcrumbs a:hover{color:#0056b3;text-decoration:underline}.breadcrumbs .separator{color:#ccc;font-size:.8rem}.breadcrumbs .current{color:#333;font-weight:500}.main-content{padding:40px 0;display:grid;grid-template-columns:1fr;gap:30px}.card{background-color:#ffffff;border-radius:12px;box-shadow:0 0 10px rgba(0,0,0,.3);padding:30px}.card h2{font-size:22px}.game-section{text-align:center;margin-bottom:40px}.game-embed-placeholder{max-width:1100px;margin:40px auto;padding:30px;background:linear-gradient(145deg,#ffffff,#f0f2f5);border-radius:24px;box-shadow:0 10px 40px rgba(0,0,0,.08),0 1px 3px rgba(0,0,0,.05);border:1px solid rgba(255,255,255,.8);position:relative;overflow:hidden}.challenge-banner{background:linear-gradient(90deg,#EA4335,#FBBC05,#34A853,#4285F4);background-size:300% 100%;animation:gradient-move 8s linear infinite;color:#fff;padding:12px 20px;border-radius:12px;font-size:1.1rem;font-weight:500;margin-bottom:20px;box-shadow:0 4px 15px rgba(0,0,0,.1);text-shadow:0 1px 2px rgba(0,0,0,.2)}.challenge-banner strong{font-size:1.3rem;font-weight:800;text-decoration:underline}@keyframes gradient-move{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.game-info{display:flex;justify-content:space-between;padding:18px 30px;background:linear-gradient(180deg,#ffffff,#f9fafb);border-radius:16px;margin-bottom:25px;font-size:1.3em;font-weight:700;color:#1a73e8;border:1px solid #e8eaed;box-shadow:0 4px 12px rgba(0,0,0,.03)}.pass-rate-stunt{background:#fff8f1;border:1px solid #ffe8d5;color:#e67e22;padding:8px 16px;border-radius:50px;font-size:.95rem;font-weight:600;margin-bottom:15px;display:inline-block;box-shadow:0 2px 8px rgba(230,126,34,.1);animation:pulse-soft 2s infinite}@keyframes pulse-soft{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.game-container{position:relative;width:fit-content;margin:0 auto;border-radius:24px;padding:15px;background:#ffffff;border:2px solid #e0e0e0;box-shadow:0 25px 50px -12px rgba(0,0,0,.1),inset 0 2px 0 rgba(255,255,255,1),inset 0 -2px 1px rgba(0,0,0,.02),0 4px 0 #d0d0d0}#gameCanvas{display:block;max-width:100%;height:auto;cursor:crosshair;border-radius:12px;background:#ffffff;box-shadow:inset 0 2px 10px rgba(0,0,0,.03),0 0 0 1px rgba(0,0,0,.02)}.levels-section{margin-top:40px}.levels-table-container{overflow-x:auto;background:#ffffff;border-radius:16px;box-shadow:inset 0 2px 10px rgba(0,0,0,.02);padding:10px}.levels-table{width:100%;border-collapse:collapse;text-align:left;font-size:.95rem}.levels-table td,.levels-table th{padding:12px 15px;border-bottom:1px solid #f0f0f0}.levels-table th{background-color:#f8f9fa;color:#5f6368;font-weight:600;text-transform:uppercase;font-size:.8rem;letter-spacing:.5px}.levels-table tr:last-child td{border-bottom:none}.levels-table tr:hover{background-color:#fcfcfc}.overlay-content{display:flex;flex-direction:column;align-items:center;gap:15px}.restart-first-level{transition:transform .2s,background-color .2s!important}.restart-first-level:hover{background-color:#3c4043!important;transform:scale(1.05)}.game-start-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.1);backdrop-filter:blur(1px);display:flex;justify-content:center;align-items:center;z-index:100}.game-start-overlay.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important;display:none!important}.overlay-play{padding:18px 45px!important;font-size:1.5em!important;background:#34A853!important;box-shadow:0 4px 15px rgba(52,168,83,.4)!important;border:none!important;border-radius:50px!important;color:white!important;cursor:pointer;display:flex;align-items:center;gap:12px;transition:transform .2s ease,background .2s ease,box-shadow .2s ease!important}.overlay-play:hover{transform:scale(1.05);background:#2d9147!important;box-shadow:0 6px 20px rgba(52,168,83,.5)!important}.play-icon{font-size:1.2em}.game-controls{margin-top:20px;display:flex;justify-content:center;gap:15px}.play-button{padding:12px 30px;font-size:1.1em;background:#4285F4;color:white;border:none;border-radius:8px;cursor:pointer;font-weight:700;transition:all .2s ease;box-shadow:0 4px 10px rgba(66,133,244,.3)}.play-button:hover{background:#357ae8;transform:translateY(-2px);box-shadow:0 6px 15px rgba(66,133,244,.4)}.reset-button{background:#EA4335;box-shadow:0 4px 10px rgba(234,67,53,.3)}.reset-button:hover{background:#d33828;box-shadow:0 6px 15px rgba(234,67,53,.4)}.share-button{background:#34A853;box-shadow:0 4px 10px rgba(52,168,83,.3)}.share-button:hover{background:#2d9147;box-shadow:0 6px 15px rgba(52,168,83,.4)}.result-button{background:#FBBC05;color:#333!important;box-shadow:0 4px 10px rgba(251,188,5,.3)}.result-button:hover{background:#f29900;box-shadow:0 6px 15px rgba(251,188,5,.4)}.bookmark-reminder{margin-top:20px;padding:12px 20px;background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1px solid #fcd34d;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:10px}.bookmark-icon{font-size:1.2em}.bookmark-text{color:#92400e;font-size:.95em;font-weight:500}.bookmark-text kbd{background:#fff;border:1px solid #d97706;border-radius:4px;padding:2px 8px;font-family:inherit;font-size:.9em;color:#92400e;box-shadow:0 1px 2px rgba(0,0,0,.1)}.explore-more-section{margin-top:40px;background:none!important;box-shadow:none!important;padding:0!important}.section-header h2{text-align:left;margin-bottom:0;font-size:1.8rem}@media (max-width:600px){.section-header{flex-direction:column;align-items:flex-start;gap:15px}.view-all-btn{width:100%;justify-content:center}}.view-all-btn{gap:6px;padding:10px 18px;background:#ffffff;border:1.5px solid #eee;border-radius:10px;color:#555;font-size:.95rem;transition:all .2s ease;white-space:nowrap}.view-all-btn:hover{background:#f8f9fa;border-color:#007bff;color:#007bff;box-shadow:0 4px 12px rgba(0,0,0,.05)}.view-all-btn .icon{font-size:1.1em}.explore-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px}.explore-item{background-color:#ffffff;border-radius:12px;padding:25px;box-shadow:0 4px 15px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #eee}.explore-item:hover{transform:translateY(-8px);box-shadow:0 10px 25px rgba(0,0,0,.15)}.explore-item h3{margin-top:0;font-size:1.4em;margin-bottom:15px}.explore-item h3 a{color:#333;text-decoration:none;display:block}.explore-item h3 a:hover{color:#007bff}.explore-item p{color:#666;font-size:.95em;margin-bottom:20px;line-height:1.5}.explore-item .card-link{display:inline-block;color:#007bff;text-decoration:none;font-weight:700;font-size:.9em;margin-top:auto}.explore-item .card-link:hover{text-decoration:underline}.explore-icon{font-size:2.5em;margin-bottom:15px;display:block}.play-button-container{text-align:center;margin-top:30px}.play-button-link{display:inline-block;padding:15px 30px;background-color:#007bff;color:white;text-decoration:none;border-radius:5px;font-weight:700;font-size:1.2em;transition:background-color .3s ease}.play-button-link:hover{background-color:#0056b3}.how-to-play-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;margin-top:25px}.step-card{background:#fdfdfd;border:1px solid #eee;border-radius:12px;padding:20px;text-align:center;transition:all .3s ease}.step-card:hover{border-color:#007bff;box-shadow:0 5px 15px rgba(0,123,255,.1)}.step-number{display:inline-block;width:30px;height:30px;background-color:#007bff;color:white;border-radius:50%;line-height:30px;font-weight:700;margin-bottom:15px}.step-image-placeholder{width:100%;aspect-ratio:16/9;background-color:#f0f2f5;border-radius:8px;margin-bottom:15px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;border:1px dashed #ccc}.step-image-placeholder img{width:100%;height:100%;object-fit:cover}.step-image-placeholder span{color:#999;font-size:.85em;padding:10px}.step-card h3{margin:10px 0;font-size:1.15em;color:#333}.step-card p{font-size:.9em;color:#666;line-height:1.4}.mini-board{display:grid;grid-template-columns:repeat(3,30px);gap:5px;background:#fff;padding:10px;border-radius:4px;box-shadow:0 2px 5px rgba(0,0,0,.1)}.mini-tile{width:30px;height:30px;border-radius:3px}.mini-tile.red{background-color:#EA4335}.mini-tile.blue{background-color:#4285F4}.mini-tile.blank{background-color:#f0f0f0;border:1px dashed #ccc}.mini-tile.selected{border:2px solid #333;box-shadow:0 0 5px rgba(0,0,0,.3);position:relative;z-index:2}.connection-line{position:absolute;background:transparent;pointer-events:none;z-index:1}.connection-line.horizontal{height:0;width:100px;top:60px;left:10px;border-top:2px dashed #ea4335}.connection-line.vertical{width:0;height:100px;left:60px;top:10px;border-left:2px dashed #ea4335}.mini-board.wide{grid-template-columns:repeat(5,30px);width:180px;height:50px;display:grid;gap:5px;padding:10px}.mini-board.wide .connection-line.horizontal{width:170px;top:25px;left:5px}.pro-tip{margin-top:20px;background:#e7f3ff;border-left:4px solid #4285f4;padding:15px;border-radius:0 8px 8px 0}.tile-highlight{position:relative;z-index:3}.mini-tile.green{background-color:#34A853}.tile-highlight:after{content:"";position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;border:2px dashed var(--highlight-color,#ea4335);border-radius:6px;pointer-events:none;animation:pulse-border 1.5s infinite}@keyframes pulse-border{0%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.article-content{line-height:1.8;color:#444}.article-header{text-align:center;margin-bottom:40px;border-bottom:2px solid #f0f2f5;padding-bottom:30px}.article-header h1{font-size:2.8rem;margin-bottom:10px;color:#333;line-height:1.2}.subtitle{font-size:1.2rem;color:#666;font-style:italic}.meta-info{font-size:.9rem;color:#999;margin-top:15px}.toc-container{background:#f8f9fa;padding:25px;border-radius:12px;margin:30px 0;border-left:5px solid #4285f4}.toc-container h3{margin-top:0;color:#333}.toc-container ul{list-style:none;padding:0;margin:0}.toc-container ul li{margin-bottom:10px}.toc-container ul li a{color:#4285f4;text-decoration:none;font-weight:500}.toc-container ul li a:hover{text-decoration:underline}.content-box{background:#fff;border:1px solid #e0e0e0;padding:30px;border-radius:16px;margin:40px 0;box-shadow:0 4px 15px rgba(0,0,0,.02)}.diagram-placeholder{text-align:center;margin:30px 0}.diagram-placeholder svg{max-width:100%;height:auto;box-shadow:0 5px 15px rgba(0,0,0,.05)}.caption{font-size:.9rem;color:#888;margin-top:10px}.pro-tip{background:#fff9e6;border-left:5px solid #fbbc05;padding:20px;border-radius:8px;margin:30px 0}.article-content h2{font-size:2rem;color:#333;margin-top:50px;margin-bottom:20px}.article-content h3{font-size:1.5rem;color:#444;margin-top:35px}.article-footer{margin-top:60px;padding-top:30px;border-top:2px solid #f0f2f5}.article-footer p{margin-bottom:15px}.article-footer a{color:#4285f4;font-weight:700;text-decoration:none}.article-footer a:hover{text-decoration:underline}.explore-more-section{margin-top:60px;margin-bottom:40px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:20px}.section-header h2{margin:0;font-size:2rem}.view-all-btn{display:flex;align-items:center;gap:8px;background:#4285f4;color:white;text-decoration:none;padding:10px 20px;border-radius:50px;font-weight:600;transition:all .3s ease;box-shadow:0 4px 12px rgba(66,133,244,.2)}.view-all-btn:hover{background:#3367d6;transform:translateY(-2px);box-shadow:0 6px 15px rgba(66,133,244,.3)}@media (max-width:768px){.article-header h1{font-size:2rem}.section-header{flex-direction:column;align-items:flex-start}.dropdown-content{grid-template-columns:1fr;min-width:240px;left:50%;transform:translateX(-50%) translateY(15px)}.dropdown:hover .dropdown-content{transform:translateX(-50%) translateY(0)}}.main-footer{background-color:#f8f9fa;padding:40px 0;border-top:1px solid #dee2e6;margin-top:40px;text-align:center}.main-footer nav a{margin:0 10px;color:#6c757d;text-decoration:none}.main-footer nav a:hover{color:#333}@media (max-width:768px){.header-content{flex-direction:column;text-align:center}.main-header nav ul{margin-top:15px}.main-header nav ul li{margin:0 10px}.main-content{grid-template-columns:1fr;gap:30px}.card{background-color:#ffffff;border-radius:12px;box-shadow:0 6px 20px rgba(0,0,0,.08);padding:30px}.card h2{font-size:22px}}@media (max-width:480px){.logo h1{font-size:24px}.main-header nav ul li{margin:0 8px}.play-button{padding:10px 20px;font-size:16px}}.game-over-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.7);display:flex;justify-content:center;align-items:center;z-index:1000}.game-over-overlay.hidden{display:none}.game-over-content{background-color:#fff;padding:30px;border-radius:10px;text-align:center;box-shadow:0 0 20px rgba(0,0,0,.5)}.game-over-content h2{font-size:2.5em;color:#333;margin-bottom:15px}.game-over-content p{font-size:1.5em;color:#555;margin-bottom:25px}.game-over-content button{background-color:#4CAF50;color:white;padding:12px 25px;border:none;border-radius:5px;font-size:1.2em;cursor:pointer;transition:background-color .3s ease}.game-over-content button:hover{background-color:#45a049}.share-result-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.7);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease}.share-result-overlay.hidden{display:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.share-result-content{background:linear-gradient(145deg,#ffffff,#fffbeb);padding:35px;border-radius:24px;text-align:center;box-shadow:0 25px 60px rgba(0,0,0,.25);max-width:420px;width:90%;border:2px solid #fbbf24}.share-result-content h2{font-size:2em;color:#333;margin-bottom:25px;font-weight:700}.share-game-desc{font-size:1.1em;color:#666;margin-bottom:25px;line-height:1.5}.result-badge{background:linear-gradient(135deg,#4285F4,#34A853);border-radius:16px;padding:20px;margin-bottom:20px;color:white;box-shadow:0 8px 25px rgba(66,133,244,.3)}.badge-level{font-size:2.5em;font-weight:800;margin-bottom:5px}.badge-name{font-size:1.1em;opacity:.9;font-weight:500}.result-highlight{font-size:1.25em;color:#d97706;margin-bottom:25px;padding:12px 20px;background:#fff7ed;border-radius:12px;border:1px solid #fed7aa}.result-highlight strong{color:#dc2626;font-size:1.4em}.share-buttons-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}.share-buttons-grid.six-buttons{grid-template-columns:repeat(3,1fr);gap:10px}@media (max-width:480px){.share-buttons-grid.six-buttons{grid-template-columns:repeat(2,1fr)}}.share-btn{padding:15px 10px;font-size:.9em;border:none;border-radius:12px;cursor:pointer;font-weight:600;transition:all .25s ease;display:flex;flex-direction:column;align-items:center;gap:6px}.share-btn span:first-child{font-size:1.8em}.share-buttons-grid.six-buttons .share-btn{padding:12px 8px;font-size:.85em}.share-buttons-grid.six-buttons .share-btn span:first-child{font-size:1.5em}.share-btn .btn-text{font-size:.85em}.share-btn.facebook{background:linear-gradient(135deg,#1877F2,#0d5bbf);color:white;box-shadow:0 4px 12px rgba(24,119,242,.35)}.share-btn.facebook:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(24,119,242,.5)}.share-btn.twitter{background:linear-gradient(135deg,#1DA1F2,#0c85d0);color:white;box-shadow:0 4px 12px rgba(29,161,242,.35)}.share-btn.twitter:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(29,161,242,.5)}.share-btn.linkedin{background:linear-gradient(135deg,#0077B5,#005885);color:white;box-shadow:0 4px 12px rgba(0,119,181,.35)}.share-btn.linkedin:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,119,181,.5)}.share-btn.pinterest{background:linear-gradient(135deg,#BD081C,#8b0514);color:white;box-shadow:0 4px 12px rgba(189,8,28,.35)}.share-btn.pinterest:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(189,8,28,.5)}.share-btn.whatsapp{background:linear-gradient(135deg,#25D366,#1da851);color:white;box-shadow:0 4px 12px rgba(37,211,102,.35)}.share-btn.whatsapp:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(37,211,102,.5)}.share-btn.reddit{background:linear-gradient(135deg,#FF4500,#cc3700);color:white;box-shadow:0 4px 12px rgba(255,69,0,.35)}.share-btn.reddit:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(255,69,0,.5)}.share-btn.friend{background:linear-gradient(135deg,#FBBC05,#f29900);color:#333;box-shadow:0 4px 12px rgba(251,188,5,.35)}.share-btn.friend:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(251,188,5,.5)}.share-btn.close-btn{background:#f3f4f6;color:#6b7280;padding:10px 30px;font-size:.95em;flex-direction:row;gap:8px}.share-btn.close-btn:hover{background:#e5e7eb;transform:none}@media (min-width:1024px){.lg\:block{display:block}.lg\:flex{display:flex}.lg\:h-\[160px\]{height:160px}.lg\:h-\[90px\]{height:90px}.lg\:min-w-0{min-width:0}.lg\:flex-1{flex:1 1 0%}.lg\:items-stretch{align-items:stretch}.lg\:justify-center{justify-content:center}.lg\:gap-4{gap:1rem}}