.brida-pfive{--pf-ink:#183d3b;--pf-green:#27796e;--pf-gold:#c79926;--pf-slate:#65747b;--pf-cream:#fff9e9;--pf-line:#d8d3c6;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--pf-ink);max-width:100%;}
.brida-pfive *, .brida-pfive *:before, .brida-pfive *:after{box-sizing:border-box}
.brida-pfive .pf-wrap{max-width:600px;margin:12px auto;padding:24px 20px;border:1px solid #e3dece;border-radius:22px;background:var(--pf-cream);box-shadow:0 7px 30px rgba(36,66,60,.06)}
.brida-pfive .pf-topline{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:10px;letter-spacing:.16em;font-weight:800;color:#516c5c}
.brida-pfive .pf-topchip{background:#e6eadc;border-radius:20px;padding:7px 9px;letter-spacing:.06em;white-space:nowrap}
.brida-pfive .pf-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:20px 0 8px}
.brida-pfive h2{color:var(--pf-ink);font-family:Georgia,serif;font-size:clamp(27px,6vw,39px);font-weight:700;letter-spacing:-.03em;line-height:1.15;margin:0 0 6px}
.brida-pfive h3{color:var(--pf-ink);font-size:19px;margin:0 0 8px}
.brida-pfive p{margin:0;line-height:1.55}
.brida-pfive .pf-heading p{font-size:14px;color:#5e6e62}
.brida-pfive .pf-help{font-size:19px;border:1px solid #b6c8bd;background:#fff;border-radius:50%;width:36px;height:36px;color:var(--pf-ink);cursor:pointer;flex-shrink:0}
.brida-pfive .pf-british{margin:14px 0 16px;padding:11px 13px;background:#e9eee4;border-radius:12px;font-size:13px}
.brida-pfive .pf-info{font-size:13px;text-align:center;color:#52625f;margin:8px 0 16px}
.brida-pfive .pf-grid{display:flex;flex-direction:column;gap:6px;align-items:center;margin:13px auto}
.brida-pfive .pf-row{display:flex;gap:6px}
.brida-pfive .pf-cell{display:flex;align-items:center;justify-content:center;width:clamp(43px,10.5vw,55px);height:clamp(43px,10.5vw,55px);border:2px solid #c5d1c7;border-radius:7px;background:#fffcf2;color:var(--pf-ink);font-weight:800;font-size:clamp(20px,5vw,27px);text-transform:uppercase;transition:background .15s}
.brida-pfive .pf-current{border-color:#789e94}
.brida-pfive .pf-hit{background:var(--pf-green)!important;color:#fff!important;border-color:var(--pf-green)!important}
.brida-pfive .pf-near{background:var(--pf-gold)!important;color:#1e2825!important;border-color:var(--pf-gold)!important}
.brida-pfive .pf-miss{background:var(--pf-slate)!important;color:#fff!important;border-color:var(--pf-slate)!important}
.brida-pfive .pf-message{min-height:22px;margin:14px 0 8px;text-align:center;font-size:13px;color:#3c6356}
.brida-pfive .pf-error{color:#9b3737!important;font-weight:700}
.brida-pfive .pf-entry{max-width:335px;margin:0 auto 8px}
.brida-pfive .pf-entry label{font-weight:700;display:block;font-size:12px;margin:0 0 6px}
.brida-pfive .pf-entryline{display:flex;gap:8px}
.brida-pfive .pf-entry input{min-width:0;flex:1;width:100%;border:1px solid #9faea4;background:white;color:var(--pf-ink);border-radius:9px;font-size:17px;font-weight:750;text-transform:uppercase;letter-spacing:.2em;height:45px;padding:8px 12px}
.brida-pfive .pf-entryline button,.brida-pfive .pf-understood{font-weight:750;font-size:14px;background:var(--pf-ink);border:0;border-radius:9px;color:#fff;padding:9px 17px;cursor:pointer}
.brida-pfive button:disabled{opacity:.42;cursor:default}
.brida-pfive .pf-entry span{font-size:11px;color:#60736b;display:block;margin-top:6px}
.brida-pfive .pf-keyboard{display:flex;flex-direction:column;gap:5px;align-items:center;margin-top:16px;max-width:100%;overflow:hidden}
.brida-pfive .pf-keyrow{display:flex;gap:4px;justify-content:center;width:100%}
.brida-pfive .pf-key{min-width:0;flex:1;max-width:45px;height:43px;padding:0;background:#e7ece8;border:1px solid #b6c8bd;border-radius:6px;color:var(--pf-ink);font-size:13px;font-weight:800;cursor:pointer;touch-action:manipulation}
.brida-pfive .pf-key.pf-special{flex:1.45;max-width:64px;background:#d6dfd8}
.brida-pfive .pf-finish{margin:15px auto;padding:16px;background:#e8f2e9;border:1px solid #bed5c4;border-radius:13px;text-align:center;max-width:385px}
.brida-pfive .pf-finish p{margin-top:5px;font-size:14px}
.brida-pfive .pf-next{color:#547463}
.brida-pfive .pf-share{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:14px auto 20px}
.brida-pfive .pf-sharebutton{border:1px solid #1f6958;background:#1f6958;color:white;padding:10px 12px;border-radius:10px;font-weight:700;font-size:12px;cursor:pointer}
.brida-pfive .pf-share-copy{background:white;color:#1f6958}
.brida-pfive .pf-stats{margin:18px auto;padding-top:16px;border-top:1px solid var(--pf-line);text-align:center}
.brida-pfive .pf-statgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
.brida-pfive .pf-stat{display:flex;flex-direction:column;gap:4px}
.brida-pfive .pf-stat strong{font-size:21px}.brida-pfive .pf-stat span{font-size:10px;color:#61756b}
.brida-pfive .pf-bottom{border-top:1px solid var(--pf-line);padding-top:18px;margin-top:20px;text-align:center}
.brida-pfive .pf-bottom p{font-size:12px;color:#667b72}
.brida-pfive .pf-bottomlinks{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.brida-pfive .pf-bottomlinks a{font-size:12px;font-weight:750;color:#1d6255;text-decoration:underline;cursor:pointer}
.brida-pfive .pf-dialog{padding:0;border:1px solid #d0d9cf;border-radius:18px;max-width:min(420px,92vw);width:92vw;box-shadow:0 14px 60px #1a342955}
.brida-pfive .pf-dialog::backdrop{background:rgba(19,42,35,.52)}
.brida-pfive .pf-dialog-content{background:var(--pf-cream);padding:23px;position:relative}
.brida-pfive .pf-dialog-content p{font-size:13px;margin:9px 0}
.brida-pfive .pf-dialog-content .pf-examples{display:flex;gap:5px;margin-top:11px}
.brida-pfive .pf-example{width:35px;height:35px;border:1px solid #a3b4ac;border-radius:5px;background:white;display:flex;align-items:center;justify-content:center;font-weight:800}
.brida-pfive .pf-close{position:absolute;right:13px;top:9px;border:0;background:transparent;font-size:25px;cursor:pointer;color:var(--pf-ink)}
.brida-pfive .pf-understood{width:100%;margin-top:10px}
.brida-pfive [hidden]{display:none!important}
.brida-pfive :focus-visible{outline:3px solid #e4a728;outline-offset:2px}
.brida-pfive-tile{display:inline-flex;padding:12px 17px;background:#fff2be;color:#25473e;border-radius:14px;text-decoration:none;font-weight:800}
@media(max-width:390px){.brida-pfive .pf-wrap{padding:19px 10px}.brida-pfive .pf-topline{letter-spacing:.06em}.brida-pfive .pf-keyrow{gap:2px}.brida-pfive .pf-key{font-size:11px;height:42px}.brida-pfive .pf-statgrid{gap:5px}}
@media(prefers-reduced-motion:reduce){.brida-pfive *{transition:none!important}}

/* Always-visible colour key for first-time players */
.brida-pfive .pf-colour-guide{display:grid;gap:7px;margin:0 0 13px;padding:12px;background:#f3efe1;border:1px solid #e4dfcd;border-radius:12px}
.brida-pfive .pf-guide-item{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.35;color:var(--pf-ink)}
.brida-pfive .pf-guide-item strong{font-weight:800}
.brida-pfive .pf-guide-tile{width:27px;height:27px;flex:0 0 27px;display:flex;align-items:center;justify-content:center;border-radius:4px;font-size:14px;font-weight:800;border:1px solid transparent}

/* v1.0.2: Original Pineapple identity and position symbols. */
.brida-pfive .pf-wrap{background:linear-gradient(180deg,#fff4d8 0,#fff9e9 160px,#fff9e9 100%);border-color:#e4d4ae}
.brida-pfive .pf-topchip{background:#f4d88c;color:#234e47}
.brida-pfive .pf-cell{border-radius:12px;position:relative;box-shadow:inset 0 -2px rgba(0,0,0,.05)}
.brida-pfive .pf-cell.pf-hit:after,.brida-pfive .pf-cell.pf-near:after,.brida-pfive .pf-cell.pf-miss:after{position:absolute;right:3px;top:1px;font-size:10px;font-weight:900;line-height:1;color:inherit;opacity:.9}
.brida-pfive .pf-cell.pf-hit:after{content:'✓'}
.brida-pfive .pf-cell.pf-near:after{content:'↔'}
.brida-pfive .pf-cell.pf-miss:after{content:'×'}
.brida-pfive .pf-guide-tile{border-radius:9px;font-size:17px}
.brida-pfive .pf-finish{background:#fff1cb;border-color:#ddc991}
.brida-pfive .pf-story{margin-top:14px!important;padding-top:12px;border-top:1px solid #ddc991}
.brida-pfive .pf-storylink{display:block;font-weight:800;color:#185f57;margin-top:4px;text-underline-offset:3px}
.brida-pfive .pf-sharebutton{border-radius:13px}
