/* Loaded only on phones. Desktop cabinet rules remain in cabinet.css. */
html,body{min-width:0;overflow-x:hidden;background:#f3f1ee}
main{width:100%;max-width:100%}
.scene-scroll,.mobile-navigation{display:none!important}
.mobile-library{display:block!important;max-width:540px;margin:auto;padding-top:max(18px,env(safe-area-inset-top));color:#443a32}
.library-heading{text-align:center;padding:0 20px 12px}
.library-kicker{font:10px/1.4 Georgia,serif;letter-spacing:2px;color:#78677b;margin:0 0 7px}
.library-heading h2{font:normal clamp(32px,9vw,45px)/1.1 Georgia,serif;margin:0 0 9px;letter-spacing:-1px}
.library-heading>p:last-child{font:italic 14px/1.4 Georgia,serif;margin:0;color:#70675c}
.library-scene{position:relative;width:100%;isolation:isolate}
.library-art{display:block;width:100%;height:auto;aspect-ratio:2/3}
.shelf-book,.field-book,.shelf-game{position:absolute;display:flex;align-items:center;justify-content:center;margin:0;padding:0;appearance:none;border:0;background:transparent;color:#392d26;text-decoration:none;font-family:Georgia,serif;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border-radius:4px}
.shelf-book{top:5%;height:34%;width:18%;font-size:clamp(15px,4.3vw,23px)}
.shelf-book span{writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:1px;text-shadow:0 1px #fff8;line-height:1.2}
.shelf-teacher{left:10%}.shelf-tutor{left:30%}.shelf-projects{left:50%}.shelf-qualifications{left:70%}
.shelf-book:active,.field-book:active{transform:translateY(-4px);background:#f9e8c32b}
.shelf-book:focus-visible,.field-book:focus-visible,.shelf-game:focus-visible{outline:3px solid #f9edce;outline-offset:-3px;box-shadow:0 0 0 2px #675071}
.field-book{top:44%;height:28%;width:24%;font-size:clamp(12px,3.7vw,19px);line-height:1.3;text-align:center}
.field-book span{padding:5px 2px;text-shadow:0 1px #fff9;transform:translateY(-5%)}
.field-zoo{left:9%}.field-mews{left:38%}.field-green{left:67%}
.shelf-game{top:77%;height:20%;width:40%;font-size:clamp(10px,2.9vw,15px);align-items:flex-end;padding-bottom:1.5%}
.shelf-loop{left:7%}.shelf-zambia{left:53%}.shelf-game span{padding:3px 6px;background:#f8f1dfed;border-radius:2px;box-shadow:0 1px 4px #37291e33}
.library-footnote{text-align:center;font:12px/1.6 Georgia,serif;padding:12px 22px max(22px,env(safe-area-inset-bottom));margin:0;color:#75695e}
/* A single, comfortably readable paper leaf on a phone. */
dialog,dialog.is-career,dialog.is-tutoring,dialog.is-book,dialog.is-welcome{width:calc(100% - 24px);max-width:540px;height:auto;max-height:calc(100dvh - 24px);margin:auto;border:0;border-radius:3px;background:#faf6e9;box-shadow:0 14px 65px #21160d66;filter:none;overflow:auto;overscroll-behavior:contain;--book-font:16px;--tutor-font:16px}
dialog[open],dialog.is-tutoring[open]{display:block}
dialog::backdrop{background:#29221b9e;backdrop-filter:blur(3px)}
dialog .dialog-bar,dialog.is-book .dialog-bar,dialog.is-welcome .dialog-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;min-height:48px;padding:4px 12px;background:#faf6e9f5;border-bottom:1px solid #dcd2be;box-shadow:none}
dialog .dialog-bar>span{display:none}dialog .dialog-bar .close,dialog.is-welcome .dialog-bar .close{margin-left:auto;color:#675071;font:30px/1 Georgia,serif;min-width:44px;min-height:44px;background:transparent;border:0}
dialog #back{font-size:14px;min-height:44px}
dialog .dialog-paper,dialog.is-book .dialog-paper,dialog.is-career .dialog-paper,dialog.is-tutoring .dialog-paper,dialog.is-welcome .dialog-paper{display:block;height:auto;max-height:none;min-height:0;overflow:visible;padding:24px;background:#faf6e9;filter:none;box-shadow:none;clip-path:none;border-radius:0;font:16px/1.6 Georgia,serif}
dialog .dialog-paper:before,dialog .dialog-paper:after{display:none!important}
dialog .dialog-paper>h2{font-size:29px;line-height:1.2;margin-bottom:18px}
dialog #dialog-content{height:auto;overflow:visible;min-height:0;max-height:none}
.mobile-chapter h2{font:normal 29px/1.2 Georgia,serif;margin:8px 0 20px}.mobile-chapter .book-chapter{font:10px/1.5 Georgia,serif;letter-spacing:1px;margin:0;color:#766352}
dialog.is-book .mobile-chapter .book-model{position:relative;inset:auto;display:block;min-height:0;width:100%;height:180px;max-height:none;aspect-ratio:auto;margin:0 0 24px;background-size:300% 100%;mask-image:none;clip-path:inset(0)}
.mobile-chapter .prose,.mobile-chapter .prose p{font:16px/1.65 Georgia,serif;overflow:visible}.mobile-chapter .prose h3{font-size:20px;margin:24px 0 8px}.mobile-chapter .prose p{margin:0 0 16px}
.is-career .career-overview{padding:0;background:none;box-shadow:none}.is-career .career-overview h2{font-size:28px;line-height:1.2}.is-career .career-highlights{display:grid;grid-template-columns:1fr;gap:20px}.is-career .career-highlights article{padding:0 0 16px;border-bottom:1px solid #ded5c5}.is-career .career-highlights h3{font-size:21px}.is-career .career-intro{font-size:16px}.is-career .cv-document{margin:18px 0;padding:0;background:white;transform:none;filter:none}.cv-actions{display:flex;flex-wrap:wrap;gap:12px}
.is-tutoring .tutoring-letter{display:block;font-size:16px;line-height:1.55;padding:0}.is-tutoring .tutoring-info{margin-bottom:24px}.is-tutoring .tutoring-info p{margin-bottom:14px}.is-tutoring .paper-contact-form{display:grid;grid-template-columns:1fr;gap:16px}.is-tutoring .contact-field{grid-column:1}.is-tutoring .paper-contact-form label{font-size:14px}.is-tutoring .paper-contact-form input{height:44px;font-size:16px}.is-tutoring .paper-contact-form textarea{height:110px;font-size:16px}.is-tutoring .primary-action{min-height:44px}
.is-welcome h2{font-size:29px}.welcome-note{font:16px/1.6 Georgia,serif}.welcome-portrait{width:85px;height:85px}.welcome-note .primary-action{min-height:44px;font:inherit}.welcome-note p{margin-bottom:14px}
.uni-list{display:grid;grid-template-columns:1fr;gap:14px}.uni-list button{min-height:92px}.uni-view{display:block}.uni-view .uni-picture{height:170px;margin-bottom:20px}.uni-view h3{font-size:25px}.project-list{display:grid;grid-template-columns:1fr}.project-card{text-align:left}.project-card h3{font-size:23px}.project-card p{font-size:15px}.profile-page-link{font-size:15px;text-decoration:underline;margin-top:24px}
dialog.is-game{width:100%;max-width:none;height:100dvh;max-height:100dvh;border-radius:0;background:#faf6e9}dialog.is-game[open]{display:flex;flex-direction:column}.is-game .dialog-bar{flex:0 0 48px}.is-game .dialog-paper{flex:1;padding:0;min-height:0;overflow:hidden}.is-game #dialog-content{height:100%}.is-game .circular-game{width:100%;height:100%;border:0;display:block}
@media(prefers-reduced-motion:reduce){.shelf-book,.field-book{transition:none}}
/* Labels sit inside the photographed brass and paper holders. */
.shelf-book{top:5%;height:31.7%;width:18%}
.shelf-book span{position:absolute;top:35.1%;left:0;right:0;writing-mode:horizontal-tb;transform:translateY(-50%);font-size:clamp(10px,3.3vw,17px);letter-spacing:0;text-align:center}
.shelf-qualifications span{font-size:clamp(8px,2.4vw,13px)}
.shelf-teacher{left:11%}.shelf-tutor{left:30.7%}.shelf-projects{left:50.8%}.shelf-qualifications{left:71.1%}
.field-book{top:43%;height:21.8%;width:24%}
.field-book span{position:absolute;top:28%;left:0;right:0;transform:translateY(-50%);font-size:clamp(12px,3.5vw,18px);line-height:1.15}
.field-zoo{left:11%}.field-mews{left:38.7%}.field-green{left:65.6%}
.shelf-game{top:68%;height:28%;padding-bottom:0;align-items:flex-end}
.shelf-loop{left:14%;width:35%}.shelf-zambia{left:57%;width:32%}

/* Physical models and photograph-integrated labels, with invisible accessible tap targets. */
.models-shelf .library-art{aspect-ratio:2/5}
.shelf-target{position:absolute;display:block;margin:0;padding:0;appearance:none;border:0;border-radius:3px;background:transparent;color:transparent;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.shelf-target:focus-visible{outline:3px solid #f8edce;outline-offset:-3px;box-shadow:0 0 0 2px #675071}
.shelf-target:active{background:#fff4cd14}
.mobile-teacher{left:10%;top:2%;width:19%;height:18%}.mobile-tutor{left:32%;top:2%;width:19%;height:18%}.mobile-education{left:54%;top:2%;width:19%;height:18%}
.mobile-zoo{left:7%;top:23%;width:86%;height:18%}.mobile-mews{left:7%;top:44%;width:86%;height:18%}.mobile-green{left:7%;top:65%;width:86%;height:18%}
.mobile-loop{left:10%;top:86%;width:38%;height:11%}.mobile-zambia{left:55%;top:86%;width:36%;height:11%}

.mobile-teacher{left:8%;top:3%;width:20%;height:18.7%}.mobile-tutor{left:29%;top:3%;width:19.5%;height:18.7%}.mobile-education{left:49%;top:3%;width:19.5%;height:18.7%}
.mobile-zoo{left:4%;top:23%;width:91%;height:20%}.mobile-mews{left:4%;top:44.5%;width:91%;height:19%}.mobile-green{left:4%;top:65%;width:91%;height:19%}
.mobile-loop{left:17%;top:85.5%;width:38%;height:14%}.mobile-zambia{left:61%;top:85.5%;width:31%;height:14%}

.models-shelf .library-art{aspect-ratio:793/1983}

/* Obvious, persistent close control and undistorted illustration plates. */
dialog .dialog-bar,dialog.is-book .dialog-bar,dialog.is-welcome .dialog-bar{min-height:60px;padding:7px 12px;border-bottom:1px solid #d4c8b5}
dialog .dialog-bar .close,dialog.is-welcome .dialog-bar .close{display:flex!important;align-items:center;justify-content:center;gap:8px;position:relative;flex:0 0 auto;min-height:44px;min-width:104px;margin-left:auto;padding:10px 16px;border:1px solid #574161;border-radius:5px;background:#675071;color:#fffdf7;font:17px/1.2 Georgia,serif;box-shadow:0 2px 4px #261b2d20}
.dialog-bar .desktop-close-label{display:none}.dialog-bar .mobile-close-label{display:inline}
dialog .dialog-bar .close:focus-visible{outline:3px solid #c09d46;outline-offset:3px}
dialog.is-book .mobile-chapter .book-model{height:auto;min-height:0;max-height:none;width:100%;max-width:100%;aspect-ratio:1;margin:0 auto 26px;background-size:300% 100%;background-position:0 center;filter:none}
dialog.is-book .mobile-chapter .book-model-fieldwork{width:min(100%,280px);aspect-ratio:2/3;background-size:450% 100%;background-position:42.857143% center}
dialog.is-book .mobile-chapter .book-model-green{aspect-ratio:1;background-size:100% 100%;background-position:center}
dialog.is-game .dialog-bar{flex-basis:60px}
/* Experience is a paper document, with the same visible controls as every other leaf. */
dialog.is-career .dialog-bar{display:flex!important;position:sticky;top:0;z-index:10;min-height:60px;padding:7px 12px;background:#faf6e9f5;border-bottom:1px solid #d4c8b5;color:#493b2b}
dialog.is-career .dialog-bar:before{content:'Experience';font:italic 18px/1.2 Georgia,serif;color:#756047;margin-right:12px}
dialog .dialog-bar .close,dialog.is-welcome .dialog-bar .close,dialog.is-career .dialog-bar .close{border:1px solid #8f7551;background:#eee3ce;color:#493b2b;font:17px/1.2 Georgia,serif;border-radius:3px;box-shadow:0 2px 3px #59432c15}
dialog .dialog-bar .close:hover,dialog .dialog-bar .close:active{background:#e3d4b8;color:#302519}
dialog.is-career .dialog-paper{padding:28px 26px 32px;background:#faf6e9 url('art/photo-writing-paper.webp?v=detail1') center 15%/110% 150% no-repeat;color:#493b2b;filter:none}
dialog.is-career .career-overview{padding:0;margin:0;background:none;filter:none;box-shadow:none;color:#493b2b;font:16px/1.65 Georgia,serif}
dialog.is-career .career-overline{font:italic 13px/1.4 Georgia,serif;letter-spacing:.4px;color:#887151;margin-bottom:12px}
dialog.is-career .career-overview h2{font:normal 27px/1.22 Georgia,serif;letter-spacing:-.4px;color:#493b2b;margin:0 0 20px}
dialog.is-career .career-intro{font:16px/1.7 Georgia,serif;color:#594a38;margin:0 0 26px}
dialog.is-career .career-highlights{display:block;margin:0}
dialog.is-career .career-highlights article{margin:0 0 24px;padding:22px 0 0;background:none;border:0;border-top:1px solid #c5b49875;box-shadow:none}
dialog.is-career .career-highlights h3{font:normal 22px/1.25 Georgia,serif;color:#493b2b;letter-spacing:-.2px;margin:0 0 7px}
dialog.is-career .career-highlights .highlight-employer{font:italic 14px/1.5 Georgia,serif;color:#887151;margin:0 0 10px}
dialog.is-career .career-highlights p{font:16px/1.65 Georgia,serif;color:#594a38;margin:0}
dialog.is-career .full-cv{margin:26px 0 0;padding:0;border:0;color:#493b2b}
dialog.is-career .full-cv>summary{padding:14px 16px;border:1px solid #b39b77;border-radius:2px;background:#eee3ce;color:#493b2b;font:17px/1.4 Georgia,serif;box-shadow:none;cursor:pointer}
dialog.is-career .full-cv details,dialog.is-career .cv-text{margin:18px 0;color:#493b2b;border-color:#c5b498}
dialog.is-career .cv-actions{font:14px/1.5 Georgia,serif;color:#756047}
dialog.is-career .profile-page-link{font:italic 15px/1.5 Georgia,serif;color:#756047;border-top:1px solid #c5b49875;padding-top:18px;margin-top:26px}