:root{--mf-teal:#0F766E;--mf-teal-hover:#115E59;--mf-teal-light:#ECFDF5;--mf-bg:#F8FAFC;--mf-surface:#FFFFFF;--mf-heading:#111827;--mf-body:#4B5563;--mf-muted:#6B7280;--mf-border:#E5E7EB;--mf-divider:#D1D5DB;--mf-error:#DC2626;--tile-bg:#F1F5F9;--tile-border:#CBD5E1;--hint-card-bg:#E6F4F1;--hint-card-border:#CBE7E0;--hint-card-text:#334155;--grid-cell-size:clamp(48px,5.8vw,68px);--grid-cell-size-4x4:clamp(38px,4.4vw,52px);--icon-size:clamp(28px,3.8vw,42px);--icon-size-4x4:clamp(22px,2.8vw,32px)}.game-shell{width:100%;max-width:1120px;margin:0 auto;padding:1.5rem 1rem;box-sizing:border-box}.induction-game{width:100%;max-width:none;margin:0}.game-layout{display:flex;gap:clamp(1.5rem,3.5vw,3.5rem);align-items:flex-start;justify-content:center;margin-top:1.25rem;width:100%}.induction-section{flex:1 1 0;min-width:0;display:flex;flex-direction:column}.section-title{display:block;font-family:"Manrope",sans-serif;font-size:1.125rem;font-weight:700;color:var(--mf-heading);margin-bottom:1.5rem;line-height:1.4;text-align:left}.layout-divider-dashed{width:1px;align-self:stretch;border-left:1.5px dashed var(--mf-divider);background:none;flex-shrink:0;margin:0 0.5rem}.grids-horizontal{display:flex;flex-direction:row;gap:clamp(0.75rem,1.8vw,1.5rem);align-items:center;justify-content:flex-start;flex-wrap:nowrap;width:100%}.candidate-matrix{display:grid;grid-template-columns:repeat(2,minmax(0,auto));gap:clamp(0.75rem,1.8vw,1.5rem);justify-content:flex-start;align-items:center;width:100%}.pattern-grid{display:grid;background:var(--tile-bg);border:2px solid var(--tile-border);border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,0.04);box-sizing:border-box;overflow:hidden}.pattern-grid.grid-3x3{grid-template-columns:repeat(3,var(--grid-cell-size));grid-template-rows:repeat(3,var(--grid-cell-size))}.pattern-grid.grid-4x4{grid-template-columns:repeat(4,var(--grid-cell-size-4x4));grid-template-rows:repeat(4,var(--grid-cell-size-4x4))}.candidate-card{cursor:pointer;border:2px solid var(--mf-border);border-radius:10px;padding:4px;background:var(--mf-surface);transition:transform 0.15s ease,border-color 0.15s ease,box-shadow 0.15s ease;touch-action:manipulation}.candidate-card:hover{border-color:var(--mf-teal);transform:translateY(-2px)}.candidate-card.selected{border-color:var(--mf-teal);background:var(--mf-teal-light);box-shadow:0 0 0 2px var(--mf-teal)}.candidate-card.selected .pattern-grid{border-color:var(--mf-teal)}.grid-cell{display:flex;align-items:center;justify-content:center;border:1px solid #CBD5E1;background:var(--mf-surface);box-sizing:border-box;position:relative}.grid-cell-number{font-family:"Manrope",sans-serif;font-size:clamp(1.25rem,2vw,1.75rem);font-weight:700}.grid-cell svg{width:var(--icon-size);height:var(--icon-size);fill:currentColor;stroke:#0b312e;stroke-width:1.5px;stroke-linejoin:round;stroke-linecap:round;overflow:visible;filter:drop-shadow(0px 1px 1px rgba(11,49,46,0.25)) drop-shadow(0px 4px 6px rgba(11,49,46,0.12));transition:transform 0.15s ease}.pattern-grid.grid-4x4 .grid-cell svg{width:var(--icon-size-4x4);height:var(--icon-size-4x4)}.hint-card-deck{display:none;flex-direction:column;gap:0.5rem;margin-top:1.5rem;width:100%}.hint-card-deck.active{display:flex}.hint-deck-label{font-family:"Manrope",sans-serif;font-size:1rem;font-weight:700;color:var(--mf-heading);margin-bottom:0.25rem}.hints-list{display:flex;flex-direction:column;gap:0.65rem;width:100%}.hint-card{background-color:var(--hint-card-bg);border:1px solid var(--hint-card-border);color:var(--hint-card-text);font-family:"Inter",sans-serif;font-size:16px;font-weight:500;line-height:1.5;padding:0.5rem;border-radius:8px;box-shadow:0 1px 3px rgba(15,118,110,0.04);animation:fadeInHint 0.25s ease-out forwards}@keyframes fadeInHint{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.controls-section{display:flex;flex-direction:column;align-items:flex-start;margin-top:1.75rem;width:100%;gap:0.5rem}.mf-btn{font-family:"Inter",sans-serif;font-size:1rem;font-weight:600;padding:0.75rem 1.75rem;border-radius:8px;cursor:pointer;border:none;transition:background-color 0.2s ease,opacity 0.2s ease;user-select:none}.mf-btn-primary{background-color:var(--mf-teal);color:#FFFFFF}.mf-btn-primary:hover:not(:disabled){background-color:var(--mf-teal-hover)}.mf-btn-primary:disabled{background-color:var(--mf-border);color:#9CA3AF;cursor:not-allowed;opacity:0.7}.shake-btn{animation:shake 0.4s cubic-bezier(0.36,0.07,0.19,0.97) both}@keyframes shake{10%,90%{transform:translate3d(-2px,0,0)}20%,80%{transform:translate3d(3px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}.submit-feedback-msg{display:block;font-family:"Inter",sans-serif;font-size:0.9rem;line-height:1.4;font-weight:500;min-height:1.25rem;transition:opacity 0.2s ease}.submit-feedback-msg.error{color:var(--mf-error)}.submit-feedback-msg.success{color:var(--mf-teal);font-weight:600}@media (max-width:768px){:root{--grid-cell-size:clamp(48px,13vw,75px);--grid-cell-size-4x4:clamp(38px,10vw,55px);--icon-size:clamp(28px,7.5vw,44px);--icon-size-4x4:clamp(22px,5.5vw,34px)}.game-shell{padding:1rem 0.5rem}.game-layout{flex-direction:column;align-items:center;gap:1.5rem;row-gap:10px}.section-title{text-align:center}.example-section{order:1;width:100%;align-items:center}.layout-divider-dashed{order:2;width:100%;height:1px;border-left:none;border-top:1.5px dashed var(--mf-divider);margin:0.5rem 0}.candidate-section{order:3;width:100%;align-items:center}.controls-section{order:4;align-items:center;margin-top:1.25rem;margin-bottom:0;padding:0}.submit-feedback-msg{text-align:center}.hint-card-deck{order:5;align-items:center;width:100%;max-width:480px;margin-top:1.25rem}.grids-horizontal{justify-content:center;gap:1rem}.candidate-matrix{justify-content:center;gap:1rem}.hint-card{font-size:15px;text-align:left}}