:root{--fs:20px;--bg:#fff;--fg:#111;--pri:#0b3d91;--red:#c00000;--grn:#0a7a2f}
html{font-size:var(--fs)}body{margin:0;font-family:system-ui,"Noto Sans",sans-serif;background:var(--bg);color:var(--fg);line-height:1.45}
body.big{--fs:26px}
header{display:flex;justify-content:space-between;align-items:center;background:var(--pri);color:#fff;padding:.5rem .8rem}
.brand{color:#fff;font-weight:800;font-size:1.3rem;text-decoration:none}.tools button{margin-left:.3rem;background:#fff;color:var(--pri);font-weight:800}
nav{display:flex;border-bottom:3px solid var(--pri)}nav a{flex:1;text-align:center;padding:.7rem .2rem;font-weight:700;color:var(--pri);text-decoration:none}nav a.on{background:var(--pri);color:#fff}
.disclaimer{background:#fff3cd;border-bottom:2px solid #b38600;padding:.4rem .8rem;font-size:.85rem;font-weight:600}
main{max-width:980px;margin:0 auto;padding:.8rem}
button,.btn{font-size:1rem;padding:.7rem 1rem;border-radius:12px;border:2px solid var(--pri);background:var(--pri);color:#fff;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;min-height:48px}
button.sec,.btn.sec{background:#fff;color:var(--pri)}button:disabled,.btn.dis{opacity:.45;cursor:not-allowed}
.mic{width:min(60vw,220px);height:min(60vw,220px);border-radius:50%;font-size:4.5rem;display:block;margin:1rem auto;box-shadow:0 6px 18px #0003}
.mic.rec{background:var(--red);border-color:var(--red);animation:p 1s infinite}@keyframes p{50%{transform:scale(1.05)}}
input,select,textarea{font-size:1rem;padding:.6rem;border:2px solid #444;border-radius:10px;width:100%;box-sizing:border-box;min-height:48px}
label{font-weight:700;display:block;margin-top:.6rem}.row{display:flex;gap:.5rem;flex-wrap:wrap}.row>*{flex:1}
.card{border:2px solid #333;border-radius:14px;padding:.8rem;margin:.7rem 0;background:#fff}
.emerg{background:var(--red);color:#fff;border:none;padding:1rem;border-radius:14px;text-align:center}
.emerg a{display:block;background:#fff;color:var(--red);font-size:1.6rem;font-weight:900;padding:.8rem;border-radius:12px;margin:.5rem 0;text-decoration:none}
.sample{background:#ffe0e0;border:2px dashed var(--red);padding:.5rem;font-weight:800;text-align:center;border-radius:10px}
.tag{display:inline-block;background:#e6eefc;border:1px solid var(--pri);border-radius:20px;padding:.1rem .6rem;margin:.15rem;font-size:.85rem}
.opts button{margin:.25rem;background:#fff;color:var(--pri)}.opts button.sel{background:var(--pri);color:#fff}
.dfv{border:4px solid var(--grn);background:#f2fbf4}.dfv h2{margin-top:0;color:var(--grn)}.auto{background:#fff3cd;font-size:.85rem;padding:.1rem .4rem;border-radius:6px;font-weight:700}
.grid{display:grid;grid-template-columns:1fr;gap:.6rem}@media(min-width:900px){.grid{grid-template-columns:1fr 1fr}}
h1{font-size:1.5rem;margin:.4rem 0}h2{font-size:1.25rem}small{font-size:.85rem}
#qr svg,#qr img{width:200px;height:200px}
@media print{header,nav,.noprint,button{display:none!important}.disclaimer{display:block}.card{break-inside:avoid}}

header{padding-top:calc(.5rem + env(safe-area-inset-top));padding-left:calc(.8rem + env(safe-area-inset-left));padding-right:calc(.8rem + env(safe-area-inset-right))}
main{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom));padding-left:calc(.8rem + env(safe-area-inset-left));padding-right:calc(.8rem + env(safe-area-inset-right))}
input,select,textarea{font-size:max(16px,1rem)}
.nudge{background:#e6eefc;border-bottom:2px solid var(--pri);padding:.5rem .8rem;font-size:.9rem;display:flex;gap:.5rem;align-items:center}
.nudge .x{background:#fff;color:var(--pri);min-height:40px;padding:.3rem .7rem}
.ioshint{background:#e8f6ec;border:2px solid var(--grn);border-radius:12px;padding:.6rem;font-weight:700;margin:.5rem 0}
.guide{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}.guide div{border:2px solid #333;border-radius:12px;padding:.5rem;text-align:center;flex:1;min-width:90px;background:#fff}.guide b{font-size:2rem;display:block}

.meter{display:flex;gap:4px;justify-content:center;align-items:flex-end;height:40px;margin:.3rem 0}.meter.big{height:110px}
.meter i{flex:0 0 18px;background:#ccd;border-radius:4px;height:20%}.meter.big i{flex:0 0 22px}
.meter i:nth-child(n){height:calc(15% + var(--h,0%))}.meter i.on{background:var(--grn)}
.meter i:nth-child(1){--h:5%}.meter i:nth-child(2){--h:12%}.meter i:nth-child(3){--h:19%}.meter i:nth-child(4){--h:26%}.meter i:nth-child(5){--h:33%}.meter i:nth-child(6){--h:40%}.meter i:nth-child(7){--h:47%}.meter i:nth-child(8){--h:54%}.meter i:nth-child(9){--h:61%}.meter i:nth-child(10){--h:68%}.meter i:nth-child(11){--h:75%}.meter i:nth-child(12){--h:85%}
.meter i:nth-child(n+10).on{background:#d97706}
.heard{text-align:center;font-size:1.3rem;font-weight:800;padding:.6rem;border-radius:12px;background:#eee}.heard.ok{background:var(--grn);color:#fff}

.tiles{display:grid;grid-template-columns:1fr;gap:1rem;margin:1rem 0}@media(min-width:700px){.tiles{grid-template-columns:repeat(3,1fr)}}
.tile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.25rem;padding:1.3rem 1rem;border:3px solid var(--pri);border-radius:20px;background:#f3f7ff;color:var(--fg);text-decoration:none;box-shadow:0 4px 12px #0002;min-height:150px}
.tile:active{transform:scale(.98)}.tile .ti{font-size:3.4rem}.tile b{font-size:1.45rem;color:var(--pri)}.tile .t2{font-weight:700;font-size:1.05rem}.tile small{color:#333}
.tiles .tile:nth-child(2){border-color:var(--grn);background:#f2fbf4}.tiles .tile:nth-child(2) b{color:var(--grn)}.tiles .tile:nth-child(3){border-color:#7a3db8;background:#f7f1fd}.tiles .tile:nth-child(3) b{color:#7a3db8}
.chathead{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}.chathead h1{flex:1}
.msgs{display:flex;flex-direction:column;gap:.5rem;padding:.4rem 0;min-height:30vh}
.bub{max-width:85%;padding:.6rem .8rem;border-radius:16px;font-size:1.05rem}.bub.bot{background:#e6eefc;align-self:flex-start;border-bottom-left-radius:4px}.bub.me{background:#d8f5d0;align-self:flex-end;border-bottom-right-radius:4px;font-weight:600}
.bub .emerg a{display:inline-block;margin:.3rem;font-size:1.4rem;padding:.4rem 1rem}
.composer{position:sticky;bottom:0;display:flex;gap:.4rem;background:#fff;padding:.5rem 0 calc(.5rem + env(safe-area-inset-bottom));border-top:2px solid #ccc}.composer button{flex:0 0 60px;font-size:1.4rem}
