.tool{scroll-margin-top:24px;padding:36px;margin-bottom:30px;border:1px solid var(--line);border-radius:20px;background:var(--paper)}.tool>p{max-width:780px}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.tool form{box-shadow:none;border:1px solid var(--line);margin-bottom:16px}.tool small{color:var(--muted);display:block;font-size:12px}.tool .result{padding:22px;border-left:4px solid var(--blue);margin:20px 0;background:var(--white);color:#081c34;white-space:pre-line}.resource-nav{flex-wrap:wrap;margin-top:25px;justify-content:flex-start}.resource-nav a{border:1px solid var(--line);padding:8px 15px;border-radius:24px}.check{display:flex;gap:12px;align-items:start;padding:12px 0;font-size:15px}.check input{width:20px;height:20px;flex-shrink:0;margin:3px 0;accent-color:var(--blue)}.question{border-top:1px solid var(--line);padding:25px 0}.question legend{font-weight:700;padding:0 0 10px}.question fieldset{border:0;padding:0;margin:0}.answer{display:block;text-align:left;width:100%;border:1px solid var(--line);padding:12px 16px;margin:8px 0;background:transparent;color:inherit;border-radius:8px;cursor:pointer}.answer:disabled{cursor:default;opacity:.85}.answer.selected{border:2px solid var(--blue);font-weight:700}.explanation{padding:15px;border-left:3px solid var(--blue);margin-top:15px}.library-card{border:1px solid var(--line);padding:22px;border-radius:12px}.library-card span{color:var(--blue);font-size:11px;letter-spacing:.1em}.library-card h3{margin:10px 0}.library-card p{font-size:14px}.library-card a{text-decoration:underline;font-size:12px}.work-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}.work-pair img{max-width:100%;border-radius:12px}.work-pair figure{margin:0}#qr img{width:180px;height:180px;border:10px solid white;margin-top:20px;border-radius:8px}.tool button{white-space:normal}@media(max-width:700px){.tool{padding:23px}.tool-grid,.work-pair{grid-template-columns:1fr}.tool form{padding:20px}.resource-nav{gap:8px}.resource-nav a{font-size:12px}.tool h2{font-size:32px}}

/* Logo centrada, pequena, com margem branca e QR de alta correção. */
#qr .qr-frame{position:relative;width:240px;max-width:100%;margin-top:20px;background:#fff}
#qr .qr-code{display:block;width:100%;height:auto;margin:0;border:0;border-radius:0}
#qr .qr-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:16%;height:auto;margin:0;padding:2px;border:2px solid #fff;border-radius:0;background:#fff;filter:none;mix-blend-mode:normal}

#snake-game{max-width:440px}#snake-board{display:block;width:100%;height:auto;border:2px solid var(--navy);margin-top:14px} .snake-info{display:flex;justify-content:space-between;gap:20px;font-family:var(--mono);font-size:13px}.snake-pad{display:grid;grid-template-columns:repeat(3,56px);gap:8px;margin:20px 0}.snake-pad button{min-height:52px;border:1px solid var(--line);background:var(--white);color:var(--navy);font-size:24px;cursor:pointer;touch-action:manipulation}.snake-pad button:first-child{grid-column:2}.snake-pad button:nth-child(2){grid-column:1}.snake-pad button:active{background:var(--paper)}#snake-game button:disabled{opacity:.5;cursor:default}#snake-status{margin-top:16px}