:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background:var(--bg-dark-100);--bg-dark-100: rgb(27, 27, 48);--bg-dark-200: rgb(10, 10, 33);--bg-neutral-200: rgb(42, 42, 62);--bg-neutral-100: rgb(59, 59, 77);--text: rgb(255, 255, 255);--accent-blue: rgb(163, 200, 250);--accent-green: rgb(179, 208, 105);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}#root{width:100%;display:grid;grid-template-columns:1fr;place-items:center;gap:1.5rem;padding:2rem 1rem}section.project{display:grid;place-content:center;place-items:center;text-align:center;gap:.5rem;padding:1rem 3rem 3rem;color:var(--text);border-radius:.5rem;border:transparent solid;background:radial-gradient(circle at 50% 250%,var(--bg-dark-100),var(--bg-dark-200)) padding-box,linear-gradient(var(--bg-dark-200),var(--bg-dark-100)) border-box}.project-name{font-size:2.5rem}.project-details--section{background:var(--bg-neutral-100);display:grid;grid-template-columns:18% 82%;gap:.7rem;border:.15rem solid var(--text);padding:1.5rem;height:max-content}.project-details--h3{grid-column:span 2;width:max-content;font-size:2rem;margin-top:-.7rem;border-bottom:.15rem solid rgba(255,255,255,.7)}.project-details--details[open]~.user-stories--h4,.project-details--details[open]~.user-stories--h4+.user-stories--list{display:none}.project-details--details{cursor:pointer;width:max-content}.project-details--summary{color:var(--accent-green);border:.15rem solid var(--accent-green);max-width:max-content;padding:.4rem;font-weight:700;margin-bottom:1.2rem}.project-details--solution{max-height:500px;color:var(--bg-dark-200);background:transparent;overflow-y:scroll;padding:.5rem;grid-column:1 / -1;width:max-content;font-weight:900;font-size:.75rem}.user-stories--h4{font-size:1.5rem;justify-self:start}.user-stories--list{display:grid;gap:.2rem;grid-column:span 2;list-style-position:inside;margin-top:-1.2rem}.user-stories--list-text{text-align:justify;padding:.1rem}code{background:var(--bg-neutral-200);border:1px solid var(--text);padding:3.5px;font-weight:900}.user-stories--subList{padding:0 .7rem;list-style-position:inside}.user-stories--subList-text{list-style-type:disc}@media only screen and (min-width: 992px){#root{grid-template-columns:repeat(2,1fr)}}#currency-converter--section{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.currency-converter__input{border:none;padding:.7rem;border-radius:8px;font-weight:700;background-color:var(--bg-dark-100)}.currency-converter__input:focus,.currency-converter__input:hover{outline:2px solid var(--accent-blue)}.currency-converter__select:first-of-type,.currency-converter__select:last-of-type{background-color:var(--bg-dark-100);grid-row:2}.currency-converter__label:last-of-type,.currency-converter__input:last-of-type{grid-column:span 2}.currency-converter__result{grid-column:span 2;font-size:1.4rem}.currency-converter__label{font-weight:700;margin-bottom:-12px}.currency-converter--start-currency{color:var(--accent-blue)}.currency-converter__result .currency-converter--target-currency{border:2px solid var(--accent-green);background-color:var(--accent-green);border-radius:8px;color:var(--bg-dark-200);padding:.5rem}.currency-converter--target-currency{color:var(--accent-green)}.currency-converter__select{margin:0 auto;padding:.5rem;width:max-content;font-weight:800;cursor:pointer}.currency-converter__select:focus,.currency-converter__select:hover{outline:2px solid var(--accent-blue);border:none}section#board{padding:1rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;background-color:var(--bg-dark-100);border-radius:.7rem}button.square{cursor:pointer;border:0;height:100px;width:100px;font-size:3rem;font-weight:900;background:var(--bg-dark-200);border:transparent 1px solid;background:radial-gradient(circle at 50% 250%,var(--bg-dark-100),var(--bg-dark-200)) padding-box,linear-gradient(var(--bg-dark-200),var(--bg-dark-100)) border-box;border-radius:.5rem}#winner-draw{color:var(--bg-neutral-100);border-bottom:5px solid var(--bg-dark-100);border-top:5px solid var(--bg-dark-100);font-size:2rem;font-weight:600;width:max-content;padding:.5rem 6rem;justify-self:center}.winner-x{background-color:var(--accent-blue);color:var(--bg-dark-200);font-size:1.5rem;font-weight:900;width:max-content;padding:.5rem 1rem;border-radius:.5rem;justify-self:center}.winner-o{background-color:var(--accent-green);color:var(--bg-dark-200);font-size:1.5rem;font-weight:900;width:max-content;padding:.5rem 1rem;border-radius:.5rem;justify-self:center}.player-x{color:var(--accent-blue);font-size:1.5rem}.player-o{color:var(--accent-green);font-size:1.5rem}button#reset{background:var(--bg-neutral-200);cursor:pointer;border:2px solid var(--text);padding:1rem;font-weight:900}button#reset:hover{color:var(--bg-neutral-200);background:var(--text)}#footer{padding:1rem}#footer-list{display:grid;grid-template-columns:repeat(4,1fr);justify-content:space-around;list-style:none;position:relative}#about-link{justify-self:center}#about-summary{color:var(--text);font-size:1.2rem;font-weight:600;padding:.3rem}#about-summary:hover{color:var(--accent-green);cursor:pointer}#about-section{position:absolute;left:0;margin-top:.5rem;padding:1rem 3rem 3rem;text-align:justify;text-indent:.5rem;display:grid;grid-template-columns:10% 90%;align-items:center;border-radius:.5rem;border:transparent solid;background:radial-gradient(circle at 50% 200%,var(--bg-dark-100),var(--bg-dark-200)) padding-box,linear-gradient(var(--bg-dark-200),var(--bg-dark-100)) border-box;font-weight:400;box-shadow:10px 10px 20px 10px var(--bg-dark-200)}#about-section--img{height:80px;width:80px;border-radius:50%;border:.3rem solid rgba(255,255,255,.2);justify-self:center}#about-section--h2{margin-left:.7rem}.about-section--p{grid-column:span 2;line-height:2rem;font-weight:900;color:#ffffffb3;margin-bottom:.2rem}.footer-item{display:grid;grid-template-columns:1fr;text-align:center;place-items:center;place-content:start;height:50px}.footer-item__button{background:0;border:0;cursor:pointer;font-size:1.2rem;font-weight:600;width:max-content;color:var(--text);padding:.5rem}.footer-item__button:hover{color:var(--accent-green)}.footer-item__list{list-style:none;visibility:hidden;opacity:0;width:100%;transition:opacity .5s ease-in}.footer-item:hover .footer-item__list,.footer-item:focus-within .footer-item__list{visibility:visible;opacity:1;z-index:1}.item__list--links{display:grid;place-items:center;text-decoration:none;cursor:pointer;font-weight:400;margin-top:.2rem;padding:.3rem;color:var(--text);border:2px solid var(--accent-green);outline:3px solid var(--bg-dark-200);background:var(--bg-dark-200)}.item__list--links:hover{color:var(--accent-green)}.mood-board{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.mood-board-heading{font-size:2.5rem;color:#ffffffde;grid-column:span 2}.mood-board-item{border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;color:#fff;border:2px solid var(--text);text-align:center;height:250px;opacity:.8;transition:opacity .3s,transform .5s ease-in-out}.mood-board-item:hover{opacity:1;transform:scale(1.07);cursor:pointer}.mood-board-image{border-radius:5px;padding:1rem;width:180px;height:150px;object-fit:cover;border:3px solid var(--text);background:var(--text);box-shadow:inset 5px 5px 10px #bebebe,inset -5px -5px 10px #fff}.mood-board-text{font-size:1.2rem;font-weight:900;color:var(--bg-neutral-200)}section#color-picker-container{border:7px solid var(--bg-dark-200);background-color:var(--bg-dark-100);height:300px;width:300px;display:grid;justify-items:center;align-content:center;gap:1rem;padding:1rem;outline:10px solid var(--bg-dark-100);outline-style:dashed}p#color-picker-text{font-size:1.1rem;font-weight:900;background:var(--bg-dark-200);padding:.5rem}input#color-input{height:50px;width:50px;border:4px dotted var(--bg-dark-100);border-radius:.5rem;cursor:pointer;background:transparent}#otp-display{color:var(--accent-green);font-family:Courier New,Courier,monospace;font-weight:600;font-size:1.4rem;padding:0 2rem}.otp-digit{color:var(--bg-dark-200);background:var(--accent-green);font-weight:900;font-size:2.2rem;padding:.7rem;margin:0 .5rem;font-family:Courier New,Courier,monospace;border-radius:6px}#otp-timer{color:var(--accent-blue);font-family:Courier New,Courier,monospace;font-size:1.1rem;font-style:italic;font-weight:600;margin-top:.3rem;opacity:.5}#generate-otp-button{display:inline-block;margin:0 auto;margin-top:.5rem;padding:1rem;width:max-content;cursor:pointer;background:var(--bg-neutral-200);border:2px solid var(--text);font-size:1rem;font-weight:900}#generate-otp-button:hover{color:var(--bg-neutral-200);background:var(--text)}.rsvp-form{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;border:.5rem solid var(--bg-dark-100);border-radius:8px;padding:1rem 3rem;min-width:500px}.rsvp-form__label{grid-column:span 2;text-align:start;font-weight:700;margin-bottom:-8px}.rsvp-form__input{background:var(--bg-dark-100);color:var(--accent-blue);border:0;padding:.7rem;border-radius:8px;grid-column:span 2;font-weight:900}.rsvp-form__input[type=checkbox]{appearance:none;width:25px;height:25px;border-radius:6px;background-color:var(--bg-dark-100);cursor:pointer;position:relative}.rsvp-form__input[type=checkbox]:checked,.rsvp-form__input[type=checkbox]:hover,.rsvp-form__input:hover{border:2px solid var(--accent-blue)}.rsvp-form__input[type=checkbox]:checked:after{content:"✓";position:absolute;top:-100%;left:-30%;font-size:45px;color:var(--accent-blue)}.rsvp-form__input:focus{outline:2px solid var(--accent-blue)}.rsvp-form__label:nth-child(9){text-align:center}.rsvp-form__input:nth-child(10){justify-self:center}.rsvp-form__button{display:inline-block;margin:0 auto;width:max-content;grid-column:span 2;cursor:pointer;margin-top:.5rem;border:2px solid var(--text);padding:1rem;font-weight:900;font-size:1rem;background:var(--bg-neutral-200)}.rsvp-form__button:hover{color:var(--bg-neutral-200);background:var(--text)}.rsvp-form--submitted{margin-top:20px;border-radius:20px;padding:3rem;background:#0a0a21;box-shadow:inset 10px -10px 20px #09091c,inset -10px 10px 20px #0c0c26}.rsvp-form--submitted h3{color:var(--accent-green)}
