:root{font-family:Segoe UI,Segoe WP,Tahoma,Geneva,Verdana,sans-serif;background:radial-gradient(circle at 50% 30%,#4a4a4a,#1a1a1a 80%);color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;height:100vh;width:100vw;overflow:hidden}#root{height:100%;display:flex;flex-direction:column;padding:40px 60px;box-sizing:border-box}@media(max-width:768px){body{height:auto;min-height:100vh;overflow-x:hidden;overflow-y:auto}#root{height:auto;min-height:100vh;padding:20px 16px 40px}}.tile{position:relative;box-sizing:border-box;cursor:pointer;overflow:hidden;background-size:cover;background-position:center center;background-repeat:no-repeat;transition:transform .15s ease-out,box-shadow .15s ease-out,outline .15s ease-out;outline:3px solid transparent;display:flex;align-items:flex-end;width:100%;height:100%;padding:0}.tile:hover,.tile:focus{transform:scale(1.05);box-shadow:0 15px 25px #0009;outline:3px solid white;z-index:10}.tile-icon-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex}.tile-label-container{background:#000000bf;width:100%;padding:4px 8px;display:flex;flex-direction:column;margin:0}.tile-label-container.transparent-bg{background:transparent}.tile-label{font-size:1.05rem;font-weight:400;letter-spacing:.2px}.tile-subtext{font-size:.8rem;color:#ccc;font-weight:400;margin-top:2px}.tile:focus-visible{outline-offset:0}.tile-badge-top-right{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;opacity:.9;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000bf;z-index:1000;display:flex;justify-content:center;align-items:center;animation:quickFade .2s ease-out}.modal-wrapper{width:900px;height:550px;display:flex;flex-direction:column}.modal-header-text{font-size:2.5rem;font-weight:300;color:#fff;margin:0 0 15px;letter-spacing:1px}.modal-content-box{display:flex;flex-grow:1;background-color:#fff;box-shadow:0 10px 30px #00000080;overflow:hidden}.modal-left-pane{width:40%;background-color:#fff;display:flex;flex-direction:column}.list-item{padding:15px 20px;cursor:pointer;border-bottom:1px solid #ddd;display:flex;flex-direction:column;transition:background .1s}.list-title{font-size:1.2rem;font-weight:400;color:#333}.list-subtitle{font-size:.9rem;color:#666;margin-top:4px}.list-item.active{background-color:#107c10}.list-item.active .list-title,.list-item.active .list-subtitle{color:#fff}.modal-right-pane{width:60%;background-color:#e6eaea;padding:40px;color:#333}.detail-header{border-bottom:2px solid #ccc;padding-bottom:15px;margin-bottom:20px}.detail-header h2{margin:0;font-size:2rem;font-weight:300;color:#333}.detail-date{margin:5px 0 0;font-size:1rem;color:#666}.detail-body{font-size:1.2rem;line-height:1.5;color:#444}.modal-footer-controls{position:absolute;bottom:40px;left:50px;display:flex;gap:20px;font-size:1.2rem;color:#fff}.btn-b{background-color:red;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem}@keyframes quickFade{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.dashboard-grid{display:grid;grid-template-columns:320px 320px 320px 320px;grid-template-rows:200px 200px 200px;gap:16px;animation:fadeIn .4s ease-in-out}.area-about{grid-column:1 / 2;grid-row:1 / 2}.area-skills{grid-column:1 / 2;grid-row:2 / 3}.area-exp{grid-column:1 / 2;grid-row:3 / 4}.area-feature{grid-column:2 / 4;grid-row:1 / 3}.area-feature .logo-center-feature{width:220px;height:220px;object-fit:contain;filter:drop-shadow(0 0 15px rgba(255,255,255,.4))}.area-f1{grid-column:4 / 5;grid-row:1 / 3}.area-cv{grid-column:2 / 4;grid-row:3 / 4}.area-learnmore{grid-column:4 / 5;grid-row:3 / 4}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.dashboard-grid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:minmax(0,44vw);gap:8px;width:100%}.area-about{grid-column:1 / 3;grid-row:1}.area-feature{grid-column:1 / 3;grid-row:2 / 4}.area-f1{grid-column:1 / 3;grid-row:4}.area-skills{grid-column:1 / 2;grid-row:5}.area-exp{grid-column:2 / 3;grid-row:5}.area-cv{grid-column:1 / 3;grid-row:6}.area-learnmore{grid-column:1 / 3;grid-row:7}.area-feature .logo-center-feature{width:50%;height:auto;max-width:200px}}.social-grid{display:grid;grid-template-columns:320px 320px 320px 320px;grid-template-rows:200px 200px 200px;gap:16px;animation:fadeIn .4s ease-in-out}.social-blog{grid-column:1 / 3;grid-row:1 / 4}.social-linkedin{grid-column:3 / 5;grid-row:1 / 3}.social-project{grid-column:3 / 3;grid-row:3 / 4}.social-github{grid-column:4 / 5;grid-row:3 / 4}@media(max-width:768px){.social-grid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:minmax(0,44vw);gap:8px;width:100%}.social-blog{grid-column:1 / 3;grid-row:1 / 3}.social-linkedin{grid-column:1 / 3;grid-row:3}.social-project{grid-column:1 / 2;grid-row:4}.social-github{grid-column:2 / 3;grid-row:4}}.interests-grid{display:grid;grid-template-columns:320px 320px 320px 320px;grid-template-rows:200px 200px 200px;gap:16px;animation:fadeIn .4s ease-in-out}.int-rugby{grid-column:1 / 3;grid-row:1 / 3}.int-cadets{grid-column:3 / 4;grid-row:1 / 3}.int-padel{grid-column:4 / 5;grid-row:1 / 3}.int-halo{grid-column:1 / 2;grid-row:3 / 4}.int-mentor{grid-column:2 / 5;grid-row:3 / 4}@media(max-width:768px){.interests-grid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:minmax(0,44vw);gap:8px;width:100%}.int-rugby{grid-column:1 / 3;grid-row:1 / 3}.int-cadets{grid-column:1 / 2;grid-row:3}.int-padel{grid-column:2 / 3;grid-row:3}.int-halo{grid-column:1 / 2;grid-row:4}.int-mentor{grid-column:2 / 3;grid-row:4}}.settings-grid{display:grid;grid-template-columns:320px 320px 320px 320px;grid-template-rows:200px 200px 200px;gap:16px;animation:fadeIn .4s ease-in-out}.set-system{grid-column:1 / 3;grid-row:1 / 3}.set-ad{grid-column:3 / 5;grid-row:1 / 3}.set-changelog{grid-column:1 / 2;grid-row:3 / 4}.set-privacy{grid-column:2 / 3;grid-row:3 / 4}.set-power{grid-column:3 / 5;grid-row:3 / 4}@media(max-width:768px){.settings-grid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:minmax(0,44vw);gap:8px;width:100%}.set-system{grid-column:1 / 3;grid-row:1 / 3}.set-ad{grid-column:1 / 3;grid-row:3 / 5}.set-changelog{grid-column:1 / 2;grid-row:5}.set-privacy{grid-column:2 / 3;grid-row:5}.set-power{grid-column:1 / 3;grid-row:6}}body,html{overflow-x:hidden}.app-container{width:fit-content;margin:0 auto;display:flex;flex-direction:column;height:100%;padding-top:60px;box-sizing:border-box}.top-nav{display:flex;gap:30px;margin-bottom:20px;align-items:baseline}.nav-item{background:none;border:none;color:#888;font-size:1.6rem;font-family:inherit;font-weight:300;cursor:pointer;padding:0;text-transform:lowercase;transition:all .2s ease}.nav-item:hover{color:#ccc}.nav-item.active{color:#fff;font-size:2.4rem;font-weight:300}.user-profile{position:absolute;top:30px;right:50px;width:48px;height:48px;background-color:#0072c6;border:2px solid #ccc;display:flex;align-items:center;justify-content:center;border-radius:4px;box-shadow:0 4px 8px #0000004d;cursor:pointer;transition:transform .2s}.user-profile:hover{transform:scale(1.1);border-color:#fff}.dashboard-container{flex-grow:1;display:flex;align-items:flex-start;width:1328px;overflow:visible}.slider-track{display:flex;gap:250px;transition:transform .4s cubic-bezier(.25,1,.5,1)}.dashboard-slide{flex:0 0 auto;width:1328px}.placeholder-dash{font-size:2rem;color:#666;width:100%;height:600px;display:flex;align-items:center;justify-content:center;border:2px dashed #444;box-sizing:border-box}.footer-controls{display:flex;gap:20px;margin-top:20px;padding-bottom:20px;font-size:1.1rem;color:#ccc}.control{display:flex;align-items:center;gap:8px}.btn-a,.btn-y{border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:#000;font-weight:700;font-size:.8rem}.btn-a{background-color:#39ff14}.btn-y{background-color:gold}@media(max-height:815px){.user-profile{display:none}.app-container{padding-top:0}}@media(min-width:1024px)and (max-width:1279px){.app-container:not(.mobile){zoom:.78}}@media(min-width:900px)and (max-width:1023px){.app-container:not(.mobile){zoom:.68}}@media(min-width:769px)and (max-width:899px){.app-container:not(.mobile){zoom:.6}}.dashboard-section-title{display:none}@media(max-width:768px){.user-profile{top:16px;right:16px;width:40px;height:40px}.app-container.mobile{width:100%;padding-top:64px}.app-container.mobile .top-nav,.app-container.mobile .footer-controls{display:none}.app-container.mobile .dashboard-container{width:100%;overflow:visible}.app-container.mobile .slider-track{display:flex;flex-direction:column;gap:32px;transform:none!important;transition:none}.app-container.mobile .dashboard-slide{width:100%}.app-container.mobile .dashboard-section-title{display:block;font-size:1.6rem;font-weight:300;color:#fff;text-transform:lowercase;margin:0 0 12px;letter-spacing:.5px}}.ap-root{--xb-green: #5dc21e;--xb-green-dark: #107c10;--xb-bg: #1b1f22;--xb-panel: #262b2f;--xb-panel-raised: #2f353a;--xb-text: #eef1f2;--xb-muted: #9aa4aa;--xb-danger: #c0392b;min-height:100vh;background:linear-gradient(160deg,#232a2e 0%,var(--xb-bg) 55%,#14181a 100%);color:var(--xb-text);font-family:Segoe UI,Selawik,system-ui,sans-serif;padding:0 clamp(16px,5vw,64px) 64px}.ap-header{display:flex;align-items:baseline;justify-content:space-between;padding:28px 0 8px}.ap-header h1{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:300;letter-spacing:.01em;text-transform:lowercase;margin:0}.ap-header h1 span{color:var(--xb-green);font-weight:600}.ap-tabs{display:flex;flex-wrap:wrap;gap:4px 22px;border-bottom:2px solid rgba(255,255,255,.08);margin-bottom:28px}.ap-tab{background:none;border:none;color:var(--xb-muted);font:300 1.15rem/1 Segoe UI,sans-serif;text-transform:lowercase;padding:10px 2px 12px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px}.ap-tab:hover{color:var(--xb-text)}.ap-tab.active{color:var(--xb-text);font-weight:600;border-bottom-color:var(--xb-green)}.ap-toolbar{display:flex;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}.ap-status{color:var(--xb-green);font-size:.9rem}.ap-muted{color:var(--xb-muted)}.ap-error{color:#ff8a7a;font-size:.9rem;margin-top:10px}.ap-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}.ap-tile{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--xb-panel);border:1px solid rgba(255,255,255,.05);padding:14px 18px;transition:transform .12s ease,box-shadow .12s ease}.ap-tile:hover,.ap-tile:focus-within{transform:scale(1.008);box-shadow:0 0 0 2px var(--xb-green),0 6px 18px #00000059}.ap-tile-body{min-width:0}.ap-tile-body strong{display:block;font-weight:600;margin-bottom:2px}.ap-tile-sub{color:var(--xb-muted);font-size:.85rem;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ap-tile-actions{display:flex;gap:8px;flex-shrink:0}.ap-tile-editing{display:block}.ap-btn{font:600 .85rem/1 Segoe UI,sans-serif;padding:9px 16px;border:1px solid rgba(255,255,255,.18);background:var(--xb-panel-raised);color:var(--xb-text);cursor:pointer;transition:background .12s ease,box-shadow .12s ease}.ap-btn:hover{background:#3a4147}.ap-btn:focus-visible{outline:2px solid var(--xb-green);outline-offset:2px}.ap-btn:disabled{opacity:.55;cursor:default}.ap-btn-green{background:var(--xb-green-dark);border-color:var(--xb-green)}.ap-btn-green:hover{background:#159415}.ap-btn-danger{border-color:var(--xb-danger);color:#ff9d90}.ap-btn-danger:hover{background:var(--xb-danger);color:#fff}.ap-btn-quiet{background:none;border-color:transparent;color:var(--xb-muted)}.ap-btn-quiet:hover{color:var(--xb-text);background:none}.ap-form{background:var(--xb-panel-raised);border-left:4px solid var(--xb-green);padding:18px;margin-bottom:18px;display:grid;gap:12px}.ap-form label{display:grid;gap:5px}.ap-form label span{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--xb-muted)}.ap-form input,.ap-form textarea,.ap-gate-card input{background:#171b1e;border:1px solid rgba(255,255,255,.15);color:var(--xb-text);font:400 .95rem/1.45 Segoe UI,sans-serif;padding:9px 11px;width:100%;box-sizing:border-box}.ap-form input:focus,.ap-form textarea:focus,.ap-gate-card input:focus{outline:2px solid var(--xb-green);outline-offset:-1px}.ap-form textarea{resize:vertical}.ap-form-actions{display:flex;gap:8px}.ap-system{margin-top:48px}.ap-system h2{font-weight:300;text-transform:lowercase;font-size:1.25rem;border-bottom:2px solid rgba(255,255,255,.08);padding-bottom:8px;margin-bottom:14px}.ap-tile-system{border-left:4px solid var(--xb-green)}.ap-gate{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,#2a3438,#14181a 70%);font-family:Segoe UI,system-ui,sans-serif;color:#eef1f2;padding:24px}.ap-gate-card{width:min(360px,100%);background:#262b2fe6;border-top:4px solid #5dc21e;padding:32px 28px;display:grid;gap:14px;text-align:center}.ap-gate-orb{width:46px;height:46px;margin:0 auto;border-radius:50%;background:radial-gradient(circle at 35% 30%,#9ef06a,#107c10 65%);box-shadow:0 0 22px #5dc21e8c}.ap-gate-card h1{font-weight:300;text-transform:lowercase;margin:0;font-size:1.6rem}.ap-gate-card p{color:#9aa4aa;font-size:.9rem;margin:0}@media(prefers-reduced-motion:reduce){.ap-tile,.ap-btn{transition:none}.ap-tile:hover,.ap-tile:focus-within{transform:none}}@media(max-width:560px){.ap-tile{flex-direction:column;align-items:flex-start}}
