/* About */
.about-page { min-height: 100vh; background: rgb(160 228 128); color: #111; font-family: "Times New Roman", Times, serif; }
.about-page.dark-mode { background: #092216 url("../ui-img/dark-leaves.svg") repeat; color: #e5f7da; }.about-page.dark-mode .about-home { color: #bfe9a6; }.about-page.dark-mode .likes-caption a { color: #bcd7ff; }.about-page.dark-mode .button-collection h1 { text-shadow: 0 1px #001107; }
.about-main { width: min(1220px, calc(100% - 3rem)); margin: 0 auto; padding: 1.2rem 0 4rem; text-align: center; }
.about-home { display: block; width: fit-content; color: #153e29; font-weight: bold; text-align: left; }
.about-art { display: block; width: min(100%, 960px); max-height: 590px; margin: .35rem auto 1.65rem; object-fit: contain; }
.button-collection h1 { margin: 0 0 .9rem; font-size: 1.45rem; font-weight: normal; }.button-grid { display: grid; grid-template-columns: repeat(7, 88px); justify-content: center; gap: .6rem; }.button-grid a, .button-grid span { display: block; width: 88px; height: 31px; }.button-grid a { outline-offset: 3px; }.button-grid img { display: block; width: 88px; height: 31px; image-rendering: auto; }.button-grid a:hover img { transform: translateY(-2px); filter: brightness(1.12); }.likes-caption { margin: .9rem 0 0; font: .95rem "Times New Roman", Times, serif; }.likes-caption a { color: #0000ee; }
.contact-panel { position: fixed; z-index: 5; top: 50%; right: 1.25rem; width: min(275px, 23vw); padding: .75rem; border: 3px solid #b7bec2; border-radius: .7rem; background: linear-gradient(125deg, #dadee1 0%, #8c969d 20%, #eff2f3 42%, #838d93 65%, #d6dcdf 100%); box-shadow: inset 0 0 0 2px #606970, inset 0 1px 2px #fff, 3px 5px 8px rgb(32 48 29 / .4); color: #16220b; transform: translateY(-50%); }
.contact-panel h2 { margin: 0 0 .55rem; padding: .32rem .5rem; border: 2px outset #b8e661; border-radius: .25rem; background: linear-gradient(#d7ff76, #8fbf2e); color: #1f3b09; font: bold 1.35rem Arial, sans-serif; text-shadow: 0 1px #efffb5; }.contact-panel a { display: block; margin: .35rem 0; padding: .42rem .45rem; border: 1px solid transparent; border-radius: .2rem; color: #173d0c; font: .94rem Arial, sans-serif; text-decoration: none; }.contact-panel a:hover, .contact-panel a:focus-visible { border-color: #9ac53f; background: #baff4d; box-shadow: inset 0 0 8px #5f8a1f, 0 0 5px #e1ff8e; color: #071900; text-shadow: 0 0 2px #e7ffaf; }.contact-panel small { display: block; margin-top: .7rem; color: #3c5226; font: italic .76rem Arial, sans-serif; text-align: center; }
@media (max-width: 1250px) { .contact-panel { position: static; width: min(470px, calc(100% - 2rem)); margin: 0 auto 2rem; transform: none; }.about-main { padding-bottom: 1rem; } }
@media (max-width: 720px) { .about-main { width: min(100% - 1.2rem, 1220px); }.button-grid { grid-template-columns: repeat(3, 88px); gap: .45rem; } }

/* Coffee shrine */
.coffee-page { min-height: 100vh; background: radial-gradient(circle at top, #7d301c, #240d08 70%); color: #fff1d7; font-family: "Times New Roman", Times, serif; }.coffee-main { width: min(900px, calc(100% - 2rem)); margin: 0 auto; padding: 1.5rem 0 4rem; text-align: center; }.coffee-main > a { color: #ffcd6a; }.coffee-main header { padding: 1rem; }.coffee-main header img { width: 130px; vertical-align: middle; }.coffee-main h1 { display: inline-block; margin: 0; color: #ffd475; font-size: clamp(2rem, 6vw, 4rem); text-shadow: 3px 3px #4c160c; }.coffee-main header p { font-size: 1.2rem; }.coffee-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }.coffee-photos figure { margin: 0; padding: .6rem; background: #f3d8a4; color: #3e190e; transform: rotate(-1deg); }.coffee-photos figure:nth-child(2) { transform: rotate(1deg); }.coffee-photos img { width: 100%; height: 230px; object-fit: cover; }.coffee-facts { display: flex; align-items: center; gap: 1rem; margin-top: 1.5rem; padding: 1rem; border: 2px dashed #e6af53; background: #5a2115; text-align: left; }.coffee-facts img { width: min(240px, 40%); }.coffee-facts h2 { color: #ffd475; }
/* Learn coding */
.learn-page { min-height: 100vh; background-color: #e9dab4; background-image: repeating-linear-gradient(0deg, rgb(111 79 41 / .12) 0 1px, transparent 1px 33px), repeating-linear-gradient(90deg, rgb(111 79 41 / .08) 0 1px, transparent 1px 37px); color: #392719; font-family: "Times New Roman", Times, serif; }.bookshelf { position: fixed; top: 0; bottom: 0; width: 140px; height: 100vh; object-fit: fill; }.shelf-left { left: 0; }.shelf-right { right: 0; transform: scaleX(-1); }.learn-main { width: min(640px, calc(100% - 330px)); min-height: 100vh; margin: 0 auto; padding: 18vh 1rem; text-align: center; }.learn-main a { color: #54361d; }.learn-main h1 { font-size: 3rem; }.learn-main p { font-size: 1.35rem; line-height: 1.5; }.learn-main small { display: block; margin-top: 2rem; font-style: italic; }
/* Likes */
.likes-page { min-height: 100vh; background: #ffef5c; color: #172b6d; font-family: Arial, sans-serif; }.likes-main { width: min(760px, calc(100% - 2rem)); margin: 0 auto; padding: 2rem 0 5rem; }.likes-main > a { color: #d22568; font-weight: bold; }.likes-main h1 { padding: .45rem .8rem; background: #ff4f8e; color: #fff; font-size: clamp(2.5rem, 8vw, 5rem); text-transform: uppercase; transform: rotate(-2deg); box-shadow: 8px 8px #1d57c7; }.likes-main section { margin: 1.7rem 0; padding: 1rem 1.4rem; border: 4px solid #172b6d; border-radius: 2rem 0 2rem 0; background: #74e4d0; box-shadow: 7px 7px #1d57c7; }.likes-main section:nth-of-type(2) { background: #ffa55f; transform: rotate(1deg); }.likes-main section:nth-of-type(3) { background: #d1a6ff; }.likes-main h2 { margin: 0; font-size: 2rem; }.likes-main li { margin: .45rem 0; font-size: 1.1rem; }.music-disclaimer { margin: .7rem 0; font-size: .9rem; font-style: italic; }.music-disclaimer a { color: #172b6d; font-weight: bold; }
/* Linux manifesto */
.linux-page { min-height: 100vh; background: linear-gradient(135deg, #d4f9c9, #81c980); color: #164e31; font-family: "Times New Roman", Times, serif; }.linux-main { width: min(760px, calc(100% - 2rem)); margin: 0 auto; padding: 5rem 0; }.linux-main a { color: #215e35; }.linux-main h1 { margin: 1rem 0; border-bottom: 5px solid #65af55; font-size: clamp(2.5rem, 8vw, 5rem); }.linux-main p { font-size: 1.25rem; line-height: 1.6; }.tux { position: fixed; right: 1rem; bottom: 0; width: min(180px, 23vw); filter: drop-shadow(3px 4px 3px rgb(0 0 0 / .25)); }
/* Temporary pride / queer-pride effect: intentionally resets on reload. */
@keyframes rainbow-outline { 0%, 100% { outline-color: #ff4b4b; } 20% { outline-color: #ffd94a; } 40% { outline-color: #49d86b; } 60% { outline-color: #4ba9ff; } 80% { outline-color: #b75cff; } }@keyframes rainbow-slide { to { background-position: 200% center; } }.rainbow-mode { outline: 5px solid #ff4b4b; animation: rainbow-outline 4s linear infinite; }.rainbow-mode .about-main, .rainbow-mode .about-art, .rainbow-mode .contact-panel, .rainbow-mode .button-collection, .rainbow-mode .button-grid a, .rainbow-mode .button-grid span { outline: 2px solid #ff4b4b; outline-offset: 2px; animation: rainbow-outline 4s linear infinite; }.rainbow-mode h1, .rainbow-mode h2, .rainbow-mode p, .rainbow-mode a, .rainbow-mode small { background: linear-gradient(90deg, #f33, #ffdb38, #44dd66, #35bfff, #a35cff, #f33); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: rainbow-slide 2s linear infinite; }
@media (max-width: 700px) { .coffee-photos { grid-template-columns: 1fr; }.learn-main { width: min(100% - 2rem, 640px); padding-top: 14vh; }.bookshelf { width: 55px; opacity: .65; }.coffee-facts { align-items: start; }.tux { width: 100px; } }

/* Older-web overrides: deliberately plain, hand-built personal-page treatment. */
.coffee-page { background-color: #4c2114; background-image: radial-gradient(#6c351f 1px, transparent 1px); background-size: 9px 9px; font-family: "Times New Roman", Times, serif; }.coffee-main { width: min(760px, calc(100% - 2rem)); padding-top: .75rem; }.coffee-main > a { display: block; margin-bottom: .4rem; color: #ffeb7a; text-align: left; }.coffee-main header { border: 3px ridge #d7a34b; background: #6b2f1d; }.coffee-main header img { width: 92px; }.coffee-main h1 { color: #ffe683; font-size: 2.35rem; text-shadow: none; }.coffee-main header p { margin: .3rem auto 0; font-size: 1rem; }.coffee-photos { gap: .35rem; margin-top: .8rem; }.coffee-photos figure, .coffee-photos figure:nth-child(2) { padding: .3rem; border: 3px outset #d5b17c; background: #e6c795; color: #32150c; transform: none; }.coffee-photos img { height: 180px; border: 1px solid #32150c; }.coffee-photos figcaption { font-size: .85rem; }.coffee-facts { margin-top: .8rem; border: 3px groove #d7a34b; background: #3b160e; }.coffee-facts img { width: 180px; background: #fff9dc; }.coffee-facts h2 { margin-top: 0; font-size: 1.35rem; }.coffee-facts li { margin: .35rem 0; }
.learn-page { background-color: #efe1bd; background-image: repeating-linear-gradient(0deg, transparent 0 28px, rgb(117 82 42 / .17) 29px 30px), repeating-linear-gradient(90deg, rgb(117 82 42 / .08) 0 1px, transparent 1px 60px); }.learn-main { width: min(600px, calc(100% - 330px)); padding: 8vh 1rem; border-left: 2px solid #87643b; border-right: 2px solid #87643b; background: rgb(255 249 222 / .45); }.learn-main h1 { margin: 1rem 0; font-size: 2.2rem; text-decoration: underline; }.learn-main p { font-size: 1.15rem; line-height: 1.38; }.learn-main small { margin-top: 1.2rem; }.bookshelf { image-rendering: pixelated; }
.likes-page { min-height: 100vh; overflow-x: hidden; overflow-y: auto; background: #000080; color: #000; font-family: "Times New Roman", Times, serif; }.likes-main { display: block; width: min(760px, calc(100% - 2rem)); margin-top: 1.5rem; padding: .75rem; border: 4px ridge #c0c0c0; background: #ffffcc; }.likes-main > a { color: #0000ee; font-family: "Times New Roman", Times, serif; }.likes-main h1 { margin: .75rem 0; padding: .35rem; border: 2px inset #999; background: #ff99cc; color: #000080; font-size: 2.15rem; letter-spacing: 0; text-align: center; text-shadow: none; text-transform: none; transform: none; box-shadow: none; }.likes-main section, .likes-main section:nth-of-type(2), .likes-main section:nth-of-type(3) { width: 100%; margin: .55rem 0; padding: .65rem 1rem; border: 2px solid #000080; border-radius: 0; background: #fff; box-shadow: none; transform: none; }.likes-main section:nth-of-type(2) { background: #e6ffff; }.likes-main section:nth-of-type(3) { background: #fff0fa; }.likes-main h2 { margin: 0; padding-bottom: .2rem; border-bottom: 1px dashed #000080; font-size: 1.5rem; }.likes-main li { margin: .25rem 0; font-size: 1rem; }.music-disclaimer { padding: .4rem; border: 1px dotted #800080; background: #ffffcc; font-size: .85rem; }.music-disclaimer a { color: #0000ee; }
.music-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }.music-columns ul { margin: .5rem 0 0; }
