/* Il mondo a blocchi accompagna la lezione; testo e codice restano leggibili. */
@font-face{font-family:Silkscreen;src:url('fonts/Silkscreen-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--bg:#f7f5e9;--ink:#243126;--muted:#4d5b48;--accent:#315f29;--soft:#e9efdb;--line:#b4bda8;--ok:#28562e;--okbg:#e4efda;--bad:#8c3024;--warn:#f5e7bc;background:var(--bg);color:var(--ink)}
.web{--accent:#315f29;--soft:#e9efdb;--tag-ink:#614223;--attr-ink:#225b78;--value-ink:#2d642b}
body>header{background:#283e28;border-bottom:6px solid #79a64c;color:#fff}
body>header a,body>header .brand{color:#fff}
body>header a:hover{text-decoration:underline;text-underline-offset:5px}
body>header :focus-visible{outline-color:#e3c67e}
.web .hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;padding:54px 0 46px;align-items:center}
.web .hero h1{font-family:Silkscreen,sans-serif;font-weight:400;font-size:clamp(2rem,3.5vw,3.1rem);letter-spacing:0;line-height:1.18;max-width:18ch;margin:0 0 24px}
.web .hero h1 em{background:none;padding:0;color:var(--accent);display:block}
.hero .lead{font-size:1.14rem;max-width:47ch}
.hero .theme-choice{font-size:.9rem;margin-top:22px;max-width:52ch;color:var(--muted)}
.web button,.web .button{border-radius:2px;border-width:2px}
.web button.primary,.web .button.primary{border-color:#244a20}
.web button.primary:hover,.web .button.primary:hover{background:#244a20}
.web :is(details,pre,.result-pane,.rule-reading,iframe,.feedback,.prova,.tag-anatomy>div,.structure-map>div,textarea){border-radius:2px}
.web .source-pane pre,.web .tag-anatomy>div,.web .tag-guide dt code{background:#eee9d9}
.web .tag-anatomy>div:nth-child(2){background:#e5edda}
.web .result-pane{border:1px solid var(--line);background:#fffefa}
.web .rule-reading{background:#eee9d9}
.web .section{padding-top:48px;padding-bottom:48px}
.web .section h2{color:#30452b}
.web .code{background:#fffefa}
.refuge-preview{background:#fffefa;border:2px solid #56654b;min-width:0;margin:0;overflow:hidden}
.terrain-band{height:48px;background:#8b6543;border-top:16px solid #78a94a;border-bottom:8px solid #725238;position:relative}
.terrain-band::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 12%,#a57b51 12% 18%,transparent 18% 42%,#745033 42% 52%,transparent 52% 78%,#a57b51 78% 88%,transparent 88%)}
.refuge-content{padding:28px}
.refuge-content h2{font-family:Silkscreen,sans-serif;font-size:1.35rem;font-weight:400;line-height:1.35;margin:0 0 14px;letter-spacing:0}
.refuge-content>p{font-size:.95rem}
.inventory-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;list-style:none;margin:24px 0;padding:0}
.inventory-preview li{min-width:0;margin:0;padding:14px 5px 10px;background:#e6e5d9;border:2px solid #909681;text-align:center;display:flex;align-items:center;flex-direction:column}
.inventory-preview strong{font-size:.87rem;margin:10px 0 4px;overflow-wrap:anywhere}
.inventory-preview li>span:last-child{font-size:.72rem;line-height:1.4}
.block-icon{display:block;position:relative;width:48px;height:48px;border:4px solid #6a4c2d;background:#b88b54;flex:none}
.block-icon.wood{background:repeating-linear-gradient(90deg,#b88b54 0 8px,#8b6338 8px 12px)}
.block-icon.stone{background:#a9afa3;border-color:#6e786b}
.block-icon.stone::before{content:'';position:absolute;inset:8px 4px;background:#8b9584;clip-path:polygon(0 0,50% 0,50% 40%,100% 40%,100% 100%,30% 100%,30% 60%,0 60%)}
.block-icon.diamond{border:0;background:#318f97;clip-path:polygon(25% 0,75% 0,100% 25%,100% 50%,50% 100%,0 50%,0 25%)}
.block-icon.diamond::before{content:'';position:absolute;inset:8px;background:#9fe2df;clip-path:polygon(25% 0,75% 0,100% 30%,50% 100%,0 30%)}
.refuge-content .refuge-caption{padding-top:18px;margin:0;border-top:1px solid var(--line);font-size:.87rem;color:var(--muted)}
.web #sfida-extra{border-top:6px solid #79a64c}
@media(max-width:950px){.web .hero{gap:28px}.refuge-content{padding:20px}.refuge-content h2{font-size:1.15rem}.inventory-preview{gap:6px}}
@media(max-width:760px){.web .hero{display:grid;grid-template-columns:1fr;gap:30px;padding:32px 0}.web .hero h1{font-size:clamp(1.8rem,6.8vw,2.7rem);max-width:20ch}.refuge-preview{max-width:520px;width:100%}.web .section{padding-top:32px;padding-bottom:32px}.inventory-preview strong{font-size:.9rem}}
@media print{.refuge-preview{display:none}.web .hero{display:block}.web .hero h1{font-family:'Trebuchet MS',sans-serif;font-size:2rem}.web .section{padding:20px 0}}