:root,:host{--font-sans: "iA Writer Quattro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;--font-mono: "Berkeley Mono", monospace;--color-gray-200: oklch(.928 .006 264.531);--color-gray-300: oklch(.872 .01 258.338);--color-gray-400: oklch(.707 .022 261.325);--color-gray-500: oklch(.551 .027 264.364);--color-black: #000;--color-white: #fff;--spacing: .25rem;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--container-xl: 36rem;--container-2xl: 42rem;--container-3xl: 48rem;--text-xs: .75rem;--text-sm: .875rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--leading-relaxed: 1.625;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--ease-in-out: cubic-bezier(.4, 0, .2, 1);--animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite;--default-transition-duration: .15s;--default-transition-timing-function: var(--ease-in-out);--default-font-family: var(--font-sans);--default-mono-font-family: var(--font-mono);--color-bg0: #282828;--color-bg1: #3c3836;--color-bg2: #504945;--color-bg3: #665c54;--color-bg4: #7c6f64;--color-gray: #928374;--color-fg1: #ebdbb2;--color-red-light: #fb4934;--color-green-light: #b8bb26;--color-yellow-light: #fabd2f;--color-blue-light: #83a598;--color-purple-light: #d3869b;--color-aqua-dark: #689d6a;--color-aqua-light: #8ec07c;--color-orange-light: #fe8019}body{background-color:var(--color-bg0);font-family:var(--default-mono-font-family);font-size:1em;color:var(--color-fg1);margin:auto;padding:var(--space-xl);max-width:var(--container-xl);box-sizing:border-box;text-align:left;word-wrap:break-word;overflow-wrap:break-word;line-height:var(--leading-relaxed)}body::-webkit-scrollbar{display:none}main{padding:var(--space-lg)}.title h1{font-size:var(--text-xl);color:var(--color-purple-light)}.title:hover{text-decoration:none}h1,h2,h3,h4,h5,h6{color:var(--color-yellow-light);font-family:var(--default-font-family);font-weight:var(--font-weight-semibold)}a{color:var(--color-blue-light);text-decoration:none;transition:all var(--default-transition-duration) var(--default-transition-timing-function)}a:hover{color:var(--color-orange-light);text-decoration:underline}nav a{margin-right:var(--space-sm);color:var(--color-aqua-light)}.banner{width:100%;max-width:640px;height:auto;border-radius:var(--radius-sm);box-shadow:0 0 8px var(--color-blue-light)}footer{color:var(--color-gray-200);text-align:center;margin-top:var(--space-xl)}.track-container{display:flex;align-items:center;background-color:var(--color-bg2);border-radius:var(--radius-md);padding:var(--space-md)}.album-art{width:60px;height:60px;border-radius:var(--radius-sm);margin-right:var(--space-md);border:2px solid var(--color-purple-light)}.track-info{display:flex;flex-direction:column;overflow:hidden}#current-track-info{font-size:var(--text-lg);color:var(--color-purple-light);margin:0;white-space:nowrap;overflow:hidden;animation:marquee 10s linear infinite}#current-artist-info{font-size:var(--text-sm);color:var(--color-gray-300);margin:0}@keyframes marquee{0%{transform:translate(100%)}to{transform:translate(-100%)}}#guestbook-form{margin-top:var(--space-xl);display:flex;flex-direction:column;border:2px dashed var(--color-green-light);border-radius:var(--radius-md);padding:var(--space-lg)}#guestbook-form input,#guestbook-form textarea{margin-bottom:var(--space-sm);padding:var(--space-sm);font-size:1em;border:1px solid var(--color-bg3);border-radius:var(--radius-sm);background-color:var(--color-bg0);color:var(--color-fg1)}#guestbook-form input::placeholder,#guestbook-form textarea::placeholder{color:var(--color-gray);font-family:var(--default-font-family);font-size:var(--text-xs);opacity:.8}#guestbook-form input:focus,#guestbook-form textarea:focus{border-color:var(--color-orange-light);outline:none}#website.invalid::placeholder{color:var(--color-red-light)}#guestbook-form button{font-size:1em;color:var(--color-aqua-light);background-color:transparent;border:1px solid var(--color-aqua-light);border-radius:var(--radius-sm);padding:6px 12px;cursor:pointer;transition:background-color .2s ease}#guestbook-form button:hover{background-color:var(--color-aqua-dark);color:var(--color-white)}#char-count{font-size:var(--text-sm);color:var(--color-gray-300);text-align:right;margin-bottom:var(--space-sm)}#messages{margin-top:var(--space-lg);line-height:1.2}.message{margin-bottom:var(--space-lg);background-color:var(--color-bg1);padding:var(--space-md);border-radius:var(--radius-sm)}.message h4{margin:0;font-size:var(--text-sm);color:var(--color-yellow-light)}.message p{margin:0;color:var(--color-orange-light)}.message p a{font-size:var(--text-sm)}.message small{display:block;margin-top:var(--space-xs);color:var(--color-gray-400)}#pagination-controls{display:flex;align-items:center;justify-content:flex-start;margin-top:var(--space-sm)}#pagination-controls button{background:none;border:none;cursor:pointer;margin-right:var(--space-sm);padding:0}#pagination-controls button svg{width:24px;height:24px;stroke:var(--color-fg1);transition:stroke var(--default-transition-duration) var(--ease-in-out)}#pagination-controls button:hover svg,#pagination-controls button:focus svg{stroke:var(--color-blue-light)}#pagination-controls button:disabled svg{stroke:var(--color-gray-300);cursor:not-allowed}.social-links{display:flex;justify-content:center}.social-links a{margin:0 var(--space-sm);transition:transform var(--default-transition-duration) var(--ease-in-out);color:var(--color-blue-light)}.social-links a:hover{transform:scale(1.2);color:var(--color-yellow-light)}.lowopacity{color:var(--color-gray);opacity:.6;font-weight:var(--font-weight-normal)}.attr-list{list-style:none;margin:0;padding:0}.attr-list li{position:relative;padding-left:2rem}.attr-list li:before{content:attr(data-type);position:absolute;left:0;top:0;color:var(--color-gray);opacity:.6;font-weight:var(--font-weight-medium);font-style:italic}