:root{--ink:#20352f;--muted:#78837d;--paper:#f7f6f1;--white:#fff;--green:#226b50;--mint:#dcefe5;--lime:#d4ed75;--line:#e7e9e2;--orange:#f0a06c;--shadow:0 14px 34px #1c3d2c0d}*{box-sizing:border-box;user-select:none;-webkit-user-select:none}input,textarea{user-select:text;-webkit-user-select:text}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}.app-shell{max-width:1440px;margin:auto;min-height:100vh}.topbar{height:76px;padding:0 7%;display:flex;align-items:center;gap:28px;border-bottom:1px solid #e7e8e1;background:#f7f6f1e8;position:sticky;top:0;z-index:5;backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font:800 21px Manrope,sans-serif;letter-spacing:-1px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--green);color:#fff;font:800 21px Manrope}.brand-dot{color:#ec9d6b}.campus{font-size:12px;font-weight:700;color:#55645d;margin-left:20px}.campus-dot,.live-dot{display:inline-block;width:7px;height:7px;border-radius:100%;background:#73a778;margin-right:6px}.chevron{margin-left:5px;color:#929b93}.credits{margin-left:auto;border:1px solid #dce3d9;border-radius:20px;background:#fff;padding:8px 13px;display:flex;align-items:center;gap:5px;color:var(--ink);font-weight:700;font-size:13px}.coin{color:#c58732}.credits small{font-size:11px;color:#889189;font-weight:500}.avatar{border:0;background:#e8c7aa;color:#634b39;width:34px;height:34px;border-radius:50%;font-weight:700}.page{max-width:1120px;padding:44px 32px 95px;margin:auto}.hero{min-height:255px;border-radius:24px;background:#e8f1e8;display:flex;position:relative;overflow:hidden;padding:42px 54px;align-items:center}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:700;color:var(--green)}.hero h1{font:800 40px/1.14 Manrope,sans-serif;letter-spacing:-1.7px;margin:15px 0 9px}.hero h1 em{color:#458767;font-style:normal}.hero p{color:#75837a;margin:0;font-size:14px}.hero-art{position:absolute;right:55px;top:0;width:330px;height:100%;display:grid;place-items:center}.orbit{position:absolute;border:1px solid #bdd6c0;border-radius:50%;width:220px;height:220px}.orbit-two{width:280px;height:140px;transform:rotate(-30deg)}.art-box{font-size:74px;filter:drop-shadow(0 15px 10px #395b3030);transform:rotate(-8deg)}.art-note{position:absolute;border:1px solid #e6ecdf;border-radius:20px;padding:8px 12px;font-size:11px;background:#fff;color:var(--green);font-weight:700;box-shadow:var(--shadow)}.note-one{right:18px;top:63px}.note-two{left:15px;bottom:47px}.spark{position:absolute;right:66px;bottom:36px;color:#d9a35e;font-size:25px}.search-row{display:flex;gap:12px;margin:31px 0 17px}.searchbox{background:#fff;border:1px solid var(--line);height:49px;border-radius:12px;display:flex;align-items:center;gap:11px;padding:0 15px;flex:1;color:#7d8d82}.searchbox>span{font-size:24px;line-height:0}.searchbox input{border:0;outline:0;font:14px 'DM Sans';flex:1;min-width:0;color:var(--ink)}.searchbox input::placeholder{color:#a4aca4}.searchbox kbd{font:11px monospace;border:1px solid #e4e7df;border-radius:4px;padding:3px 6px;color:#9ba49b}.filter-btn{border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 17px;color:var(--ink);font-weight:600;font-family:inherit}.chips{display:flex;gap:9px;overflow:auto;padding:2px 0 8px}.chip{white-space:nowrap;border:1px solid #e6e8e1;border-radius:18px;background:#fff;padding:9px 14px;color:#68766d;font:600 12px 'DM Sans';cursor:pointer}.chip.active{background:var(--ink);border-color:var(--ink);color:#fff}.chip span{margin-left:7px;color:#c5d8c8}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:31px 0 17px}.muted{color:#86938a}.section-heading h2{font:700 21px Manrope,sans-serif;letter-spacing:-.6px;margin:7px 0 0}.text-button{border:0;background:none;color:var(--green);font:700 12px 'DM Sans';cursor:pointer}.text-button span{font-size:17px;margin-left:4px}.listing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.item-card{background:#fff;border:1px solid #eaebe5;border-radius:15px;overflow:hidden;cursor:pointer;transition:transform .18s,box-shadow .18s}.item-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.item-image{height:158px;display:grid;place-items:center;position:relative;font-size:65px}.item-image:after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#fff3,transparent 55%)}.item-image .item-emoji{filter:drop-shadow(0 12px 8px #0002);z-index:1;transform:rotate(-7deg)}.condition{position:absolute;top:11px;left:11px;z-index:2;background:#fffffff0;border-radius:12px;padding:5px 8px;font-size:9px;font-weight:700;color:#557364}.favorite{position:absolute;right:11px;top:8px;border:0;background:#ffffffd9;border-radius:50%;width:28px;height:28px;z-index:2;color:#657269;cursor:pointer;font-size:16px}.item-info{padding:14px 15px 13px}.item-title-row{display:flex;justify-content:space-between;align-items:start;gap:8px}.item-title{font:700 14px Manrope,sans-serif;margin:0;color:#283b33}.credits-rate{white-space:nowrap;color:#347755;font-size:11px;font-weight:700}.item-meta{font-size:10px;color:#89938c;margin-top:8px;display:flex;align-items:center;gap:7px}.item-meta .dot{width:3px;height:3px;border-radius:50%;background:#b4bcb5}.owner-row{border-top:1px solid #f0f1ed;margin-top:12px;padding-top:11px;display:flex;align-items:center;gap:8px;font-size:10px;color:#738078}.owner-avatar{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#e5c6ac;color:#614c3a;font-weight:700}.owner-rating{margin-left:auto;color:#8e968f}.request-banner{margin-top:25px;background:#243d34;border-radius:17px;min-height:118px;padding:22px 27px;display:flex;align-items:center;gap:17px;color:white;position:relative;overflow:hidden}.request-icon{width:43px;height:43px;border-radius:14px;background:#496353;display:grid;place-items:center;color:#daea88;font-size:25px}.request-banner .eyebrow{color:#c2df88}.request-banner h3{font:700 16px Manrope;margin:5px 0}.request-banner p{color:#c0cbc2;font-size:11px;margin:0}.request-button{margin-left:auto;background:var(--lime);border:0;border-radius:9px;padding:12px 15px;color:#263a2e;font:700 11px 'DM Sans';z-index:1;cursor:pointer}.request-button span{font-size:15px;margin-left:5px}.banner-shapes{position:absolute;right:190px;top:-34px;font-size:180px;color:#ffffff08;transform:rotate(10deg)}footer{text-align:center;padding:28px 0 5px;color:#9aa39a;font-size:10px}footer span{color:#d69a6e}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:none;background:#fff;border-top:1px solid var(--line);padding:9px 14px calc(9px + env(safe-area-inset-bottom));justify-content:space-around;z-index:6}.nav-item{background:none;border:0;text-decoration:none;color:#879189;display:flex;flex-direction:column;align-items:center;gap:3px;font:500 9px 'DM Sans';position:relative}.nav-item span{font-size:20px;line-height:23px}.nav-item.selected{color:var(--green);font-weight:700}.nav-badge{position:absolute;top:-2px;right:-9px;background:#e9a17a;color:white;border-radius:10px;width:13px;height:13px;font-style:normal;font-size:8px;display:grid;place-items:center}.modal{border:0;padding:30px;border-radius:20px;width:min(440px,calc(100vw - 28px));box-shadow:0 30px 100px #17372b30;color:var(--ink)}.modal::backdrop{background:#162c2480;backdrop-filter:blur(3px)}.close{float:right;border:0;background:#f0f2ed;width:30px;height:30px;border-radius:50%;font-size:20px;color:#66776e;cursor:pointer}.modal h2{font:800 24px Manrope;letter-spacing:-.8px;margin:10px 0}.modal-sub{font-size:13px;color:#7a877e;margin:0 0 24px}.field-label{font-size:11px;font-weight:700;display:block;margin:14px 0 7px}.field{width:100%;border:1px solid var(--line);border-radius:9px;padding:12px;font:13px 'DM Sans';outline-color:#70a17c}.field textarea,textarea.field{min-height:80px;resize:vertical}.primary-button{width:100%;margin-top:20px;background:var(--green);color:#fff;border:0;border-radius:9px;padding:13px;font:700 13px 'DM Sans';cursor:pointer}.primary-button span{float:right}.detail-emoji{height:155px;border-radius:12px;display:grid;place-items:center;font-size:76px;margin:12px 0 20px}.detail-kicker{font-size:10px;color:#738177}.detail-title{font:800 23px Manrope;margin:5px 0}.detail-description{font-size:13px;line-height:1.6;color:#748078}.detail-owner{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding:14px 0;margin-top:15px;font-size:12px}.detail-owner .owner-avatar{width:32px;height:32px}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#203a30;color:#fff;border-radius:9px;padding:12px 18px;font-size:12px;box-shadow:var(--shadow);transition:.25s;z-index:10}.toast.show{opacity:1;transform:translate(-50%,0)}.empty-state{grid-column:1/-1;text-align:center;padding:45px 15px;color:#879189;font-size:13px}.empty-state b{display:block;color:var(--ink);font:700 17px Manrope;margin-bottom:6px}
@media(max-width:760px), (min-width:761px){.topbar{height:62px;padding:0 18px;gap:12px}.brand{font-size:18px}.brand-mark{width:27px;height:27px;font-size:18px}.campus{margin-left:5px;font-size:10px}.credits{padding:7px 10px;font-size:11px}.credits small{display:none}.avatar{width:30px;height:30px}.page{padding:20px 17px 90px}.hero{min-height:215px;padding:28px 25px;border-radius:18px;align-items:flex-start}.hero h1{font-size:30px;letter-spacing:-1.2px;margin-top:13px}.hero p{font-size:12px;max-width:210px;line-height:1.5}.hero-art{right:-103px;width:255px;opacity:.75}.art-box{font-size:57px}.orbit{width:176px;height:176px}.orbit-two{width:220px;height:115px}.note-one{right:18px;top:40px}.note-two{left:4px;bottom:35px}.search-row{margin-top:21px;gap:8px}.searchbox{height:46px;padding:0 11px}.searchbox input{font-size:12px}.searchbox kbd{display:none}.filter-btn{padding:0 12px;font-size:12px}.chips{margin-right:-17px}.section-heading{margin-top:25px}.section-heading h2{font-size:19px}.listing-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.item-image{height:125px;font-size:54px}.item-info{padding:11px 11px 10px}.item-title{font-size:12px}.credits-rate{font-size:10px}.item-meta{font-size:9px;gap:5px}.owner-row{font-size:9px}.request-banner{padding:17px 15px;gap:11px}.request-icon{width:37px;height:37px;flex-shrink:0}.request-banner h3{font-size:14px}.request-banner p{max-width:165px;line-height:1.4}.request-button{padding:11px 10px;font-size:10px}.banner-shapes{display:none}.bottom-nav{display:flex}footer{padding-bottom:20px}}@media(max-width:390px), (min-width:761px){.campus{font-size:9px}.hero-art{right:-130px}.hero h1{font-size:27px}.listing-grid{gap:8px}.item-title-row{display:block}.credits-rate{display:block;margin-top:5px}.request-button{max-width:100px;line-height:1.4}}

.install-banner{width:100%;margin-top:12px;border:1px solid #dce8d9;border-radius:12px;padding:11px 13px;background:#f0f6ec;display:flex;align-items:center;gap:10px;text-align:left;color:var(--ink);cursor:pointer}.install-banner[hidden]{display:none}.install-icon{width:30px;height:30px;background:var(--green);color:white;border-radius:9px;display:grid;place-items:center;font-size:19px}.install-banner b,.install-banner small{display:block}.install-banner b{font-size:11px}.install-banner small{font-size:10px;color:#7e8b80;margin-top:2px}.install-arrow{margin-left:auto;color:var(--green)}
/* Full campus MVP screens */
.page-sub{font-size:13px;color:#78857c;margin:-5px 0 17px}.bottom-nav{display:flex;max-width:680px;left:50%;right:auto;transform:translateX(-50%);width:min(100%,680px);border:1px solid var(--line);border-bottom:0;border-radius:17px 17px 0 0;box-shadow:0 -6px 22px #20352f0a}.bottom-nav .nav-item{flex:1;cursor:pointer}.page{padding-bottom:105px}.map-legend{display:flex;gap:20px;color:#748078;font-size:11px;margin:10px 0}.map-legend span:first-child{color:var(--green)}.campus-map{height:440px;border-radius:18px;position:relative;overflow:hidden;background-color:#e9efe3;background-image:linear-gradient(33deg,transparent 47%,#fff 48%,#fff 51%,transparent 52%),linear-gradient(122deg,transparent 42%,#fff 43%,#fff 46%,transparent 47%),linear-gradient(90deg,#dce8d7 1px,transparent 1px),linear-gradient(#dce8d7 1px,transparent 1px);background-size:100% 100%,100% 100%,52px 52px,52px 52px}.map-block{position:absolute;border-radius:15px;background:#d7e5d3;color:#718271;font-size:9px;letter-spacing:1px;font-weight:700;display:grid;place-items:center;text-align:center}.block-a{left:33%;top:18%;width:31%;height:17%}.block-b{left:3%;top:70%;width:29%;height:17%;background:#e6e3d4}.block-c{right:4%;top:8%;width:21%;height:20%;background:#dce9db}.block-d{right:5%;bottom:8%;width:28%;height:21%;background:#d7e8dc}.map-road{position:absolute;background:#fff;border-radius:20px;opacity:.95}.road-one{height:14px;width:120%;left:-8%;top:48%;transform:rotate(-13deg)}.road-two{width:13px;height:130%;left:52%;top:-12%;transform:rotate(20deg)}.road-three{height:9px;width:75%;right:-6%;top:37%;transform:rotate(24deg)}.map-radius{position:absolute;left:51%;top:51%;width:290px;height:290px;border:1px dashed #57916a80;border-radius:50%;transform:translate(-50%,-50%);background:#a9d7aa14}.you-pin,.map-pin{position:absolute;z-index:2}.you-pin{transform:translate(-50%,-50%);display:grid;justify-items:center;color:#fff}.you-pin span{width:33px;height:33px;border:3px solid white;box-shadow:0 2px 9px #0003;background:#397d59;border-radius:50%;display:grid;place-items:center}.you-pin small{background:#fff;border-radius:9px;padding:3px 6px;color:var(--ink);font-size:9px;margin-top:3px}.map-pin{transform:translate(-50%,-50%);border:2px solid white;border-radius:50%;width:36px;height:36px;background:#fff;box-shadow:0 3px 10px #18392d30;font-size:17px;cursor:pointer}.map-pin:hover{transform:translate(-50%,-50%) scale(1.13)}.map-results{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:13px}.map-result{border:1px solid var(--line);border-radius:11px;background:#fff;padding:10px;display:flex;align-items:center;gap:8px;text-align:left;cursor:pointer;color:var(--ink)}.map-result>span:first-child{font-size:22px}.map-result b,.map-result small{display:block}.map-result b{font-size:10px}.map-result small{color:#89938c;font-size:9px;margin-top:3px}.map-result strong{margin-left:auto;color:var(--green);font-size:9px;white-space:nowrap}.tabs{display:flex;border-bottom:1px solid var(--line);gap:22px;margin:23px 0 10px}.tab{border:0;background:none;padding:0 0 11px;color:#89938c;font:600 12px 'DM Sans';cursor:pointer}.tab.active{color:var(--green);border-bottom:2px solid var(--green)}.activity-list{display:grid;gap:9px;margin-bottom:25px}.activity-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.activity-emoji{width:42px;height:42px;border-radius:12px;background:#edf2e9;display:grid;place-items:center;font-size:22px}.activity-main{flex:1;min-width:145px}.activity-main b{font:700 12px Manrope}.activity-main p{font-size:10px;color:#77847b;margin:4px 0}.activity-main small{font-size:9px;color:#9aa39a}.status-pill{font-size:9px;border-radius:11px;background:#f9eddb;color:#9a703b;padding:5px 8px}.status-pill.done{background:#e3f0e6;color:#447653}.activity-actions{display:flex;gap:5px;width:100%;justify-content:flex-end}.activity-actions button,.outline-button{border:1px solid #dce5dc;background:#fff;border-radius:7px;padding:7px 10px;color:var(--green);font:600 10px 'DM Sans';cursor:pointer}.profile-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;display:flex;align-items:center;gap:16px}.profile-avatar{width:62px;height:62px;border-radius:50%;background:#e8c7aa;display:grid;place-items:center;color:#634b39;font:800 25px Manrope}.profile-identity{flex:1}.profile-identity h2{font:700 18px Manrope;margin:0 0 5px}.profile-identity p{font-size:12px;color:#66746a;margin:0 0 4px}.profile-identity small{font-size:10px;color:#8b968e}.verified{display:inline-grid;place-items:center;background:#43825c;color:#fff;border-radius:50%;font:700 10px 'DM Sans';width:17px;height:17px;vertical-align:2px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin:14px 0 22px}.stat-grid article{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px;display:grid;gap:6px}.stat-grid article span{color:#568164}.stat-grid b{font:800 21px Manrope}.stat-grid small{font-size:10px;color:#879189}.profile-columns{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.profile-columns .section-heading{margin-top:0}.profile-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.ledger{background:#fff;border:1px solid var(--line);border-radius:12px;padding:4px 14px}.ledger-row{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #f0f1ed;font-size:10px}.ledger-row:last-child{border-bottom:0}.ledger-row b{white-space:nowrap;color:#9b6656}.ledger-row b.positive{color:#43825c}.trust-note{background:#eaf2e9;border-radius:12px;padding:14px;margin-top:12px}.trust-note b{font:700 11px Manrope}.trust-note p{font-size:10px;line-height:1.6;color:#718078;margin:6px 0 0}
@media(max-width:760px), (min-width:761px){.bottom-nav{width:100%;max-width:none;border-radius:15px 15px 0 0;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.bottom-nav .nav-item{font-size:8px}.bottom-nav .nav-item span{font-size:19px}.campus-map{height:380px}.map-results{grid-template-columns:repeat(2,1fr)}.profile-card{padding:15px;gap:10px;flex-wrap:wrap}.profile-avatar{width:48px;height:48px}.profile-identity h2{font-size:15px}.profile-card .outline-button{margin-left:58px}.stat-grid{grid-template-columns:repeat(2,1fr)}.profile-columns{grid-template-columns:1fr}.profile-items{grid-template-columns:repeat(2,minmax(0,1fr))}.activity-card{gap:8px}.status-pill{margin-left:auto}}
@media(max-width:390px), (min-width:761px){.bottom-nav .nav-item{font-size:7px}.map-results{grid-template-columns:1fr}.map-pin{width:31px;height:31px}.campus-map{height:330px}.profile-card .outline-button{margin-left:0}}
.review-action{border:1px solid #dce5dc;background:#fff;border-radius:7px;padding:7px 10px;color:var(--green);font:600 10px 'DM Sans';cursor:pointer}.record-lend{width:100%;margin-top:8px}
.auth-modal .brand-auth{font:800 21px Manrope;color:var(--green)}.auth-modal .brand-auth span{color:#ec9d6b}.auth-switch{display:block;margin:12px auto 0;border:0;background:none;color:var(--green);font:600 12px 'DM Sans';cursor:pointer}
.campus-map,.pickup-map{z-index:0}.campus-map{height:480px;background:#e9efe3}.pickup-map{height:230px;border:1px solid var(--line);border-radius:11px;margin:8px 0 6px}.pickup-help{display:block;color:#738078;font-size:10px;line-height:1.5;margin-bottom:8px}.map-heading-actions{display:flex;gap:8px;align-items:center}.location-button{border:1px solid var(--line);background:#fff;color:var(--green);border-radius:9px;padding:10px 12px;font:600 11px Arial,sans-serif;cursor:pointer}.map-error{height:100%;display:grid;place-items:center;padding:24px;text-align:center;color:#738078;font-size:13px}

.danger-button{display:block;width:100%;margin-top:12px;border:1px solid #e5c6c2;border-radius:10px;padding:12px;background:#fff7f6;color:#a33e35;font:700 13px 'DM Sans',sans-serif;cursor:pointer}.danger-button:disabled{opacity:.6;cursor:wait}.form-feedback{min-height:1.3em;margin:12px 0 0;color:#7a5149;font-size:12px;line-height:1.5}.auth-modal .auth-switch[hidden]{display:none}

/* User-selectable colour themes */
body[data-theme="midnight"]{--ink:#edf2fc;--muted:#a8b4c8;--paper:#080d18;--white:#111a2a;--green:#83aef5;--mint:#1c2d49;--lime:#f3ca61;--line:#2b374b;--orange:#ed9a57;--shadow:0 14px 34px #0006}
body[data-theme="blush"]{--ink:#503543;--muted:#907783;--paper:#fff7fa;--white:#fff;--green:#b85f83;--mint:#f9e1eb;--lime:#f4cf75;--line:#efdee6;--orange:#df956c}
body[data-theme="sunshine"]{--ink:#4c3821;--muted:#8f7b5d;--paper:#fff9e9;--white:#fffdf7;--green:#cf7224;--mint:#ffedc5;--lime:#f4cf55;--line:#eee0c2;--orange:#e77e2c}
body[data-theme="festival"]{--ink:#392b49;--muted:#81748f;--paper:#faf6ff;--white:#fff;--green:#71509a;--mint:#eee3f7;--lime:#f3d34f;--line:#e6dcef;--orange:#e98b35}
body[data-theme] .topbar{background:color-mix(in srgb,var(--paper) 92%,transparent);border-color:var(--line)}
body[data-theme] .credits,body[data-theme] .searchbox,body[data-theme] .filter-btn,body[data-theme] .chip,body[data-theme] .item-card,body[data-theme] .bottom-nav,body[data-theme] .activity-card,body[data-theme] .profile-card,body[data-theme] .stat-grid>article,body[data-theme] .ledger,body[data-theme] .theme-panel,body[data-theme] .map-result{background:var(--white);color:var(--ink);border-color:var(--line)}
body[data-theme] .item-info{background:var(--white)}
body[data-theme] .hero{background:var(--mint)}
body[data-theme] .hero h1,body[data-theme] .section-heading h2,body[data-theme] .item-title,body[data-theme] .detail-title,body[data-theme] .profile-identity h2,body[data-theme] .theme-panel h3{color:var(--ink)}
body[data-theme] .hero p,body[data-theme] .item-meta,body[data-theme] .owner-row,body[data-theme] .profile-identity p,body[data-theme] .profile-identity small,body[data-theme] .activity-main p,body[data-theme] .activity-main small,body[data-theme] .page-sub,body[data-theme] .theme-panel p{color:var(--muted)}
body[data-theme] .searchbox input,body[data-theme] .field,body[data-theme] textarea,body[data-theme] select{background:var(--white);color:var(--ink);border-color:var(--line)}
body[data-theme] dialog{background:var(--paper);color:var(--ink);border-color:var(--line)}
body[data-theme] .chip.active{background:var(--green);border-color:var(--green);color:#fff}
body[data-theme] .request-banner{background:var(--ink);color:var(--paper)}
body[data-theme] .request-banner p{color:var(--muted)}
.theme-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px 22px;margin:20px 0}
.theme-panel h3{font:700 17px Manrope,sans-serif;margin:6px 0}
.theme-panel p{font-size:11px;color:var(--muted);margin:0}
.theme-options{display:grid;grid-template-columns:repeat(2,minmax(190px,1fr));gap:8px}
.theme-option{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);padding:8px 10px;font:600 10px 'DM Sans';text-align:left;cursor:pointer}
.theme-option[aria-pressed="true"]{outline:2px solid var(--green);outline-offset:1px}
.theme-swatch{width:25px;height:25px;border:1px solid #0002;border-radius:50%;flex:none}
.theme-check{margin-left:auto;color:var(--green);opacity:0}
.theme-option[aria-pressed="true"] .theme-check{opacity:1}
@media(max-width:650px), (min-width:761px){.theme-panel{align-items:stretch;flex-direction:column;padding:17px}.theme-options{grid-template-columns:1fr 1fr}.theme-option{font-size:9px;padding:7px}}

/* Keep each component inside the selected palette. */
body[data-theme="midnight"]{--banner-bg:#121d30;--banner-ink:#edf2fc;--banner-muted:#afbed6;--banner-accent:#83aef5;--banner-icon:#243656;--banner-button:#294a80;--banner-button-ink:#fff}
body[data-theme="blush"]{--banner-bg:#f9e6ee;--banner-ink:#503543;--banner-muted:#876f7b;--banner-accent:#b85f83;--banner-icon:#f1cfdd;--banner-button:#bb6486;--banner-button-ink:#fff}
body[data-theme="sunshine"]{--banner-bg:#fff0ca;--banner-ink:#4c3821;--banner-muted:#826d4c;--banner-accent:#c96d22;--banner-icon:#f6dca0;--banner-button:#d87829;--banner-button-ink:#fff}
body[data-theme="festival"]{--banner-bg:#eee3f7;--banner-ink:#392b49;--banner-muted:#766587;--banner-accent:#71509a;--banner-icon:#dccbed;--banner-button:#f0ce42;--banner-button-ink:#3a2b20}
body[data-theme] .request-banner{background:var(--banner-bg)!important;color:var(--banner-ink)!important;border:1px solid var(--line)}
body[data-theme] .request-banner h3{color:var(--banner-ink)!important}
body[data-theme] .request-banner p{color:var(--banner-muted)!important}
body[data-theme] .request-banner .eyebrow{color:var(--banner-accent)!important}
body[data-theme] .request-icon{background:var(--banner-icon)!important;color:var(--banner-accent)!important}
body[data-theme] .request-button{background:var(--banner-button)!important;color:var(--banner-button-ink)!important}
body[data-theme] .item-image{background:var(--mint)!important}
body[data-theme] .item-image:after{opacity:.12}
.item-photo{display:block;width:min(82%,260px);height:82%;object-fit:contain;z-index:1;filter:drop-shadow(0 12px 10px #0002);border-radius:8px}
.detail-emoji .detail-photo{width:min(100%,390px);height:100%;object-fit:contain}
.photo-preview{margin-top:8px;border:1px solid var(--line);border-radius:10px;padding:7px;background:var(--mint);text-align:center}
.photo-preview img{max-width:100%;max-height:170px;object-fit:contain;border-radius:7px}
body[data-theme] .photo-preview{background:var(--mint)}
.item-photo{width:min(72%,210px);height:min(78%,170px);max-width:210px;max-height:170px;object-fit:contain}.detail-emoji .detail-photo{width:min(100%,320px);height:min(100%,260px);max-height:260px;object-fit:contain}.photo-preview{height:132px;display:grid;place-items:center;overflow:hidden}.photo-preview[hidden]{display:none}.photo-preview img{display:block;width:auto;height:auto;max-width:min(100%,220px);max-height:116px;object-fit:contain}.photo-field{padding:9px;max-width:100%;overflow:hidden}.notification-button{position:relative;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--white);color:var(--ink);font-size:17px;cursor:pointer}.notification-button span{position:absolute;right:-3px;top:-4px;min-width:15px;height:15px;padding:0 3px;border-radius:9px;background:#c4414a;color:white;font:700 9px/15px 'DM Sans';text-align:center}.borrow-timeline{display:flex;justify-content:space-between;gap:6px;width:100%;margin:4px 4px 0 54px;color:var(--muted);font-size:9px}.borrow-timeline span{flex:1;border-top:2px solid var(--line);padding-top:5px}.borrow-timeline span.reached{border-color:var(--green);color:var(--green)}.help-card{border:1px solid var(--line);background:var(--mint);color:var(--ink);border-radius:14px;padding:17px;margin:15px 0}.help-card h3{font:700 15px Manrope;margin:7px 0}.help-card p{font-size:11px;line-height:1.6;color:var(--muted);margin:0}.check-field{display:flex;align-items:center;gap:9px;margin:14px 0;color:var(--ink);font-size:12px}.check-field input{width:18px;height:18px;accent-color:var(--green)}
@keyframes borrowed-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes borrowed-orbit{to{transform:rotate(330deg)}}
.hero{animation:borrowed-rise .55s cubic-bezier(.2,.7,.2,1) both}
.item-card{animation:borrowed-rise .45s cubic-bezier(.2,.7,.2,1) both;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.item-card:nth-child(2){animation-delay:.06s}.item-card:nth-child(3){animation-delay:.12s}.item-card:nth-child(4){animation-delay:.18s}
.item-card:hover{transform:translateY(-5px);box-shadow:0 15px 28px #102b2420;border-color:var(--green)}
.request-banner{animation:borrowed-rise .5s .1s ease both;transition:transform .22s ease,box-shadow .22s ease}
.request-banner:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.orbit-one{animation:borrowed-orbit 28s linear infinite}
button{transition:filter .18s ease,transform .18s ease}
button:hover{filter:brightness(1.04)}
button:active{transform:scale(.98)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
.contact-modal{width:min(620px,calc(100vw - 24px));max-height:min(88vh,820px);overflow:auto}
.contact-modal h2{margin-top:12px}
.contact-tools{display:grid;gap:10px;margin:12px 0}
.contact-private,.contact-safety{font-size:11px;line-height:1.55;color:var(--muted)}
.shared-contact,.own-contact,.share-contact{border:1px solid var(--line);border-radius:11px;background:var(--white);padding:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--ink)}
.shared-contact>div:first-child{display:grid;gap:4px}.shared-contact small{font-size:10px;color:var(--muted)}
.contact-links{display:flex;gap:7px}.contact-links a{display:inline-block;text-decoration:none;background:var(--green);color:#fff;border-radius:8px;padding:8px 12px;font-size:11px;font-weight:700}
.share-contact{display:grid;grid-template-columns:1fr auto}.share-contact .field-label{grid-column:1/-1;margin:0}.share-contact .field{min-width:0}.share-contact .outline-button{white-space:nowrap}
.contact-messages{height:min(34vh,310px);min-height:175px;overflow:auto;display:flex;flex-direction:column;gap:9px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--mint)}
.chat-message{max-width:82%;align-self:flex-start;background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:12px 12px 12px 3px;padding:9px 11px;overflow-wrap:anywhere}
.chat-message.mine{align-self:flex-end;background:var(--green);color:#fff;border-color:var(--green);border-radius:12px 12px 3px 12px}
.chat-message p{font-size:12px;line-height:1.45;margin:0 0 5px;white-space:pre-wrap}.chat-message small{display:block;text-align:right;font-size:9px;opacity:.75}
.chat-empty{margin:auto;color:var(--muted);font-size:11px;text-align:center}
.message-form{display:flex;align-items:center;gap:8px;margin-top:10px}.message-form .field{flex:1;min-width:0}.message-form .primary-button{width:auto;margin:0;padding:12px 18px}
.contact-safety{margin:12px 0 0}
.activity-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 12px;color:var(--muted);font-size:11px}.activity-toolbar>div{display:flex;align-items:center;gap:8px}.activity-card.activity-selected{border-color:var(--green);box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 18%,transparent)}.activity-select{display:grid;place-items:center;flex:none;cursor:pointer}.activity-select input{width:19px;height:19px;margin:0;accent-color:var(--green);cursor:pointer}.trash-button{border:0;border-radius:8px;background:#b64250;color:#fff;padding:9px 12px;font:700 11px 'DM Sans';cursor:pointer}.trash-button:disabled{opacity:.55;cursor:wait}.confirm-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}

/* Additional palettes: neutral surfaces, readable text, and accents all follow the selected pair. */
body[data-theme="navy-pink"]{--ink:#14223d;--muted:#69758b;--paper:#f2f4f9;--white:#fff;--green:#c75e8a;--mint:#e4eaf5;--lime:#f0a9c6;--line:#d8dfec;--orange:#dc7da2;--shadow:0 14px 34px #14223d18;--banner-bg:#142545;--banner-ink:#fff6fa;--banner-muted:#d5cbda;--banner-accent:#f2b6cf;--banner-icon:#344764;--banner-button:#f2b6cf;--banner-button-ink:#14223d}
body[data-theme="black-pink"]{--ink:#f8edf3;--muted:#c3afba;--paper:#101014;--white:#1b1a20;--green:#f08bb5;--mint:#30232c;--lime:#f7b0cc;--line:#40313b;--orange:#f2a4c3;--shadow:0 14px 34px #0008;--banner-bg:#21151d;--banner-ink:#fff2f8;--banner-muted:#d2bbc7;--banner-accent:#f5a3c2;--banner-icon:#3d2634;--banner-button:#f5a3c2;--banner-button-ink:#20131b}
body[data-theme="mint-black"]{--ink:#effcf4;--muted:#a8c1b2;--paper:#080c0a;--white:#121915;--green:#81e0aa;--mint:#1d3327;--lime:#9de5bb;--line:#2b3c31;--orange:#73d99c;--shadow:0 14px 34px #0009;--banner-bg:#101814;--banner-ink:#edfff4;--banner-muted:#c1d6c9;--banner-accent:#8fe4b5;--banner-icon:#24342a;--banner-button:#a3edc0;--banner-button-ink:#101814}
body[data-theme="neon-orange"]{--ink:#f1f4fa;--muted:#b2bfd1;--paper:#070a10;--white:#10151e;--green:#ff6a1c;--mint:#172238;--lime:#ff7b26;--line:#293345;--orange:#ff681d;--shadow:0 14px 34px #0009;--banner-bg:#101a2a;--banner-ink:#fff7f0;--banner-muted:#c1cddd;--banner-accent:#ff761f;--banner-icon:#25364f;--banner-button:#ff681d;--banner-button-ink:#10131b}
body[data-theme="monochrome"]{--ink:#f5f5f5;--muted:#b0b0b0;--paper:#080808;--white:#151515;--green:#f2f2f2;--mint:#242424;--lime:#dedede;--line:#353535;--orange:#d0d0d0;--shadow:0 14px 34px #0009;--banner-bg:#171717;--banner-ink:#fff;--banner-muted:#d0d0d0;--banner-accent:#fff;--banner-icon:#353535;--banner-button:#fff;--banner-button-ink:#111}
body[data-theme="purple-cyan"]{--ink:#28183e;--muted:#776887;--paper:#f6f2fb;--white:#fff;--green:#68439a;--mint:#e9dff4;--lime:#57dce7;--line:#ded4eb;--orange:#35bdca;--shadow:0 14px 34px #28183e18;--banner-bg:#362052;--banner-ink:#fbf7ff;--banner-muted:#d6cae7;--banner-accent:#65e1e9;--banner-icon:#523477;--banner-button:#58dce6;--banner-button-ink:#201638}
body[data-theme] .hero h1 em{color:var(--green)}
body[data-theme] .topbar,body[data-theme] .credits,body[data-theme] .searchbox,body[data-theme] .filter-btn,body[data-theme] .chip,body[data-theme] .item-card,body[data-theme] .bottom-nav,body[data-theme] .activity-card,body[data-theme] .profile-card,body[data-theme] .stat-grid>article,body[data-theme] .ledger,body[data-theme] .theme-panel,body[data-theme] .theme-option,body[data-theme] .map-result,body[data-theme] .outline-button,body[data-theme] .activity-actions button,body[data-theme] .notification-button{background:var(--white);color:var(--ink);border-color:var(--line)}
body[data-theme] .item-info,body[data-theme] .map-result{background:var(--white)}body[data-theme] .hero,body[data-theme] .item-image,body[data-theme] .detail-emoji,body[data-theme] .photo-preview,body[data-theme] .help-card{background:var(--mint)!important;color:var(--ink)}
body[data-theme] .hero h1,body[data-theme] .section-heading h2,body[data-theme] .item-title,body[data-theme] .detail-title,body[data-theme] .profile-identity h2,body[data-theme] .theme-panel h3,body[data-theme] .activity-main b,body[data-theme] .stat-grid b{color:var(--ink)}
body[data-theme] .hero p,body[data-theme] .item-meta,body[data-theme] .owner-row,body[data-theme] .profile-identity p,body[data-theme] .profile-identity small,body[data-theme] .activity-main p,body[data-theme] .activity-main small,body[data-theme] .page-sub,body[data-theme] .theme-panel p,body[data-theme] footer{color:var(--muted)}
body[data-theme] .field,body[data-theme] textarea,body[data-theme] select,body[data-theme] dialog{background:var(--white);color:var(--ink);border-color:var(--line)}body[data-theme] .primary-button{background:var(--green);color:#fff}body[data-theme] .contact-links a{background:var(--green);color:#fff}
body[data-theme] .request-banner{background:var(--banner-bg)!important;color:var(--banner-ink)!important;border-color:var(--line)}body[data-theme] .request-banner h3{color:var(--banner-ink)!important}body[data-theme] .request-banner p{color:var(--banner-muted)!important}body[data-theme] .request-banner .eyebrow{color:var(--banner-accent)!important}body[data-theme] .request-icon{background:var(--banner-icon)!important;color:var(--banner-accent)!important}body[data-theme] .request-button{background:var(--banner-button)!important;color:var(--banner-button-ink)!important}
.theme-options{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));max-width:760px}
body[data-theme="mint-black"] .map-block{background:#1d3327;color:#b8e8cb}body[data-theme="mint-black"] .map-block.block-b{background:#25352b}body[data-theme="mint-black"] .map-road{background:#1b241e}body[data-theme="mint-black"] .campus-map{background-color:#080c0a}
body[data-theme="neon-orange"] .map-block{background:#1b2a40;color:#ff9b5f}body[data-theme="neon-orange"] .map-block.block-b{background:#172238}body[data-theme="neon-orange"] .map-road{background:#202a38}body[data-theme="neon-orange"] .campus-map{background-color:#070a10}
body[data-theme="monochrome"] .map-block{background:#222;color:#eee}body[data-theme="monochrome"] .map-block.block-b{background:#303030}body[data-theme="monochrome"] .map-road{background:#333}body[data-theme="monochrome"] .campus-map{background-color:#080808}
body[data-theme="mint-black"] .leaflet-tile,body[data-theme="neon-orange"] .leaflet-tile,body[data-theme="monochrome"] .leaflet-tile{filter:brightness(.48) saturate(.65)}
.community-tabs{display:flex;gap:20px;border-bottom:1px solid var(--line);margin:20px 0 12px}.community-tabs .tab{font-size:12px}.community-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:12px 0 18px;color:var(--muted);font-size:11px}.community-toolbar .primary-button,.community-card-bottom .primary-button{width:auto;margin:0;padding:9px 12px;font-size:11px}.community-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:20px}.community-card{background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:9px;animation:borrowed-rise .28s ease both}.community-card h3{font:700 15px Manrope;margin:0;color:var(--ink)}.community-card p{font-size:11px;line-height:1.55;color:var(--muted);margin:0;white-space:pre-wrap}.community-card-top,.community-meta,.community-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}.community-tag{display:inline-flex;background:var(--mint);color:var(--green);padding:5px 9px;border-radius:20px;font-size:9px;font-weight:700}.community-format,.community-meta{font-size:9px;color:var(--muted)}.community-card-bottom{margin-top:auto;padding-top:6px}.community-card-bottom>div{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.community-card-bottom .outline-button{font-size:10px}.skill-chips{display:flex;gap:6px;flex-wrap:wrap}.skill-chips span{border:1px solid var(--line);border-radius:12px;padding:4px 8px;color:var(--muted);font-size:9px}.session-card{flex-direction:row;align-items:center;flex-wrap:wrap}.session-card>div:first-child{flex:1;min-width:200px}.session-card .community-card-bottom{width:100%}.community-action{white-space:nowrap}.community-grid .empty-state{background:var(--white);border:1px dashed var(--line);border-radius:14px;grid-column:1/-1}.community-card .status-pill{white-space:nowrap}
@media(max-width:760px), (min-width:761px){.community-grid{grid-template-columns:1fr;gap:9px}.community-toolbar{align-items:flex-start;flex-direction:column}.community-toolbar .primary-button{width:100%}.community-card{padding:13px}.community-card-bottom{align-items:flex-start;flex-wrap:wrap}.session-card>div:first-child{min-width:100%}.community-tabs{gap:16px}.community-tabs .tab{font-size:11px}.bottom-nav .nav-item{min-width:0}}
.borrowed-map-marker{display:grid;place-items:center;width:38px;height:38px;padding:0;border:2px solid #fff;border-radius:50%;background:#4678d0;box-shadow:0 3px 12px #0005;font-size:19px;cursor:pointer}.borrowed-you-marker{width:18px;height:18px;border:3px solid #fff;border-radius:50%;background:#397d59;box-shadow:0 2px 8px #0006}.map-error{position:absolute;inset:0;z-index:4;display:block;background:#edf2ea;color:#344d3c}.maplibregl-map.map-fallback-active .maplibregl-canvas-container{opacity:0;pointer-events:none}.maplibregl-map.map-fallback-active .maplibregl-control-container{z-index:6}.maplibregl-map.map-fallback-active .maplibregl-marker{z-index:5}.campus-sketch{position:absolute;inset:0;overflow:hidden;background:#eaf1e7;background-image:radial-gradient(#cad9c2 1px,transparent 1px);background-size:24px 24px;font-family:'DM Sans',sans-serif}.sketch-label,.sketch-road,.sketch-place,.sketch-you,.sketch-note{position:absolute;z-index:2}.sketch-label{top:5%;left:5%;font-size:clamp(9px,1.3vw,12px);font-weight:800;letter-spacing:.14em;color:#45604c}.sketch-road{display:grid;place-items:center;padding:0 18px;border:4px solid #fff;background:#f6f4e9;border-radius:999px;color:#65766a;font-size:clamp(8px,1vw,11px);font-weight:800;letter-spacing:.08em;box-shadow:0 2px 5px #4c604019;white-space:nowrap}.sketch-road-main{left:22%;top:42%;width:63%;height:11%;transform:rotate(-9deg)}.sketch-road-hostel{left:-4%;top:69%;width:61%;height:9%;transform:rotate(-20deg)}.sketch-road-global{right:-7%;top:73%;width:66%;height:9%;transform:rotate(14deg)}.sketch-place{display:grid;place-items:center;padding:8px 12px;border:1px solid #c5d5bf;border-radius:14px;background:#d8e7d2;color:#47634c;font-size:clamp(8px,1.05vw,12px);font-weight:800;letter-spacing:.07em;text-align:center;box-shadow:0 5px 12px #3e55321a}.sketch-library{left:8%;top:22%;width:20%;height:17%}.sketch-academic{left:39%;top:14%;width:30%;height:17%;background:#dce8d8}.sketch-hostels{left:8%;bottom:11%;width:29%;height:16%;background:#e8e0ca;border-color:#d4c9aa;color:#706143}.sketch-food{right:8%;bottom:12%;width:25%;height:15%;background:#d3e8dc;color:#3f6859}.sketch-you{left:49%;top:48%;display:grid;justify-items:center;color:#2e7954;font-size:23px;text-shadow:0 2px 5px #fff}.sketch-you small{padding:3px 8px;border-radius:999px;background:#fff;color:#496350;font-size:9px;font-weight:700;white-space:nowrap}.sketch-note{right:12px;top:10px;max-width:42%;padding:7px 10px;border-radius:999px;background:#fff;color:#596e5b;font-size:9px;font-weight:700;box-shadow:0 3px 12px #263a2618}.maplibregl-popup-content{font:12px 'DM Sans',sans-serif;color:#20342b;border-radius:10px;padding:12px 14px}

/* Playful depth pass: all surfaces inherit the active palette. */
:root{--depth-soft:0 10px 24px color-mix(in srgb,var(--ink) 8%,transparent);--depth-card:0 18px 38px color-mix(in srgb,var(--ink) 12%,transparent);--depth-pop:0 24px 48px color-mix(in srgb,var(--green) 24%,transparent)}
body{background:radial-gradient(ellipse at 10% 0%,color-mix(in srgb,var(--mint) 55%,transparent),transparent 34%),var(--paper);transition:background-color .35s,color .35s}
.topbar{box-shadow:0 8px 28px color-mix(in srgb,var(--ink) 6%,transparent);border-color:var(--line)}
.brand-mark{box-shadow:0 7px 16px color-mix(in srgb,var(--green) 30%,transparent);transform:rotate(-5deg);transition:transform .25s,box-shadow .25s}
.brand:hover .brand-mark{transform:rotate(5deg) translateY(-2px);box-shadow:0 10px 22px color-mix(in srgb,var(--green) 38%,transparent)}
.credits,.avatar,.notification-button{box-shadow:var(--depth-soft);transition:transform .2s,box-shadow .2s}
.credits:hover,.avatar:hover,.notification-button:hover{transform:translateY(-2px);box-shadow:var(--depth-card)}
.hero{isolation:isolate;background:radial-gradient(ellipse at 78% 20%,color-mix(in srgb,var(--lime) 38%,transparent),transparent 35%),linear-gradient(135deg,var(--mint),color-mix(in srgb,var(--paper) 45%,var(--mint)));box-shadow:inset 0 1px #ffffff8a,var(--depth-soft);border:1px solid color-mix(in srgb,var(--line) 76%,transparent);transform:perspective(1200px) rotateX(.4deg);transition:transform .35s,box-shadow .35s}
.hero:hover{transform:perspective(1200px) rotateX(0) translateY(-2px);box-shadow:inset 0 1px #ffffff8a,var(--depth-card)}
.hero-art{perspective:700px}
.art-box{filter:drop-shadow(0 22px 12px color-mix(in srgb,var(--ink) 24%,transparent));transform:translateZ(24px) rotate(-8deg);animation:borrowed-float 4.5s ease-in-out infinite}
.orbit{box-shadow:inset 0 0 25px color-mix(in srgb,var(--green) 8%,transparent);animation:borrowed-orbit 10s linear infinite}
.orbit-two{animation-direction:reverse}
.art-note{box-shadow:0 9px 22px color-mix(in srgb,var(--ink) 13%,transparent);transform:translateZ(28px)}
.note-one{animation:borrowed-float 4s ease-in-out infinite}
.note-two{animation:borrowed-float 4.8s ease-in-out -1.2s infinite}
.chip,.filter-btn,.searchbox,.install-banner{box-shadow:0 4px 12px color-mix(in srgb,var(--ink) 5%,transparent);transition:transform .2s,box-shadow .2s,border-color .2s}
.chip:hover,.filter-btn:hover,.install-banner:hover{transform:translateY(-2px);box-shadow:var(--depth-soft)}
.chip.active{box-shadow:0 6px 15px color-mix(in srgb,var(--green) 28%,transparent)}
.item-card,.activity-card,.community-card,.profile-card,.stat-grid>article,.theme-panel,.ledger{box-shadow:0 5px 16px color-mix(in srgb,var(--ink) 5%,transparent);transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s,border-color .25s}
.item-card{transform-style:preserve-3d;perspective:900px}
.item-card:hover,.activity-card:hover,.community-card:hover,.profile-card:hover,.theme-panel:hover{transform:translateY(-5px) rotateX(1deg);box-shadow:var(--depth-card);border-color:color-mix(in srgb,var(--green) 30%,var(--line))}
.item-image{background-image:radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--green) 12%,transparent),transparent 44%);perspective:450px}
.item-image .item-emoji{transform:translateZ(18px) rotate(-7deg);transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s}
.item-card:hover .item-image .item-emoji{transform:translateZ(38px) rotate(4deg) scale(1.13);filter:drop-shadow(0 20px 12px color-mix(in srgb,var(--ink) 26%,transparent))}
.item-info{position:relative;z-index:1}
.request-banner{box-shadow:0 12px 28px color-mix(in srgb,var(--ink) 18%,transparent),inset 0 1px #ffffff24;transition:transform .28s,box-shadow .28s}
.request-banner:hover{transform:translateY(-4px) rotateX(1deg);box-shadow:0 22px 40px color-mix(in srgb,var(--ink) 24%,transparent),inset 0 1px #ffffff24}
.request-icon,.activity-emoji,.profile-avatar,.owner-avatar{box-shadow:inset 0 1px #ffffff90,0 6px 14px color-mix(in srgb,var(--ink) 10%,transparent)}
.primary-button,.request-button,.outline-button,.filter-btn,.location-button,.trash-button{transition:transform .18s,box-shadow .18s,filter .18s}
.primary-button,.request-button{box-shadow:0 4px 0 rgba(0,0,0,.20),0 9px 18px rgba(0,0,0,.22)}
.primary-button:hover,.request-button:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 6px 0 rgba(0,0,0,.20),0 13px 22px rgba(0,0,0,.26)}
.primary-button:active,.request-button:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(0,0,0,.20),0 4px 9px rgba(0,0,0,.18)}
.outline-button:hover,.location-button:hover{transform:translateY(-2px);box-shadow:var(--depth-soft);border-color:var(--green)}
.bottom-nav{box-shadow:0 -10px 34px color-mix(in srgb,var(--ink) 12%,transparent);backdrop-filter:blur(18px);background:color-mix(in srgb,var(--white) 88%,transparent)!important}
.nav-item{transition:transform .2s,color .2s}
.nav-item:hover{transform:translateY(-3px)}
.nav-item.selected span{filter:drop-shadow(0 4px 7px color-mix(in srgb,var(--green) 36%,transparent))}
.section-heading,.hero-copy,.search-row,.chips,.listing-grid,.request-banner,.community-tabs,.community-toolbar,.community-content{animation:borrowed-enter .5s both}
.hero-copy{animation-delay:.04s}.search-row{animation-delay:.07s}.chips{animation-delay:.1s}.listing-grid{animation-delay:.13s}
.community-card{transform-style:preserve-3d}
.community-card h3,.item-title{letter-spacing:-.3px}
.modal{box-shadow:0 28px 90px #0005,inset 0 1px #ffffffa6}
@keyframes borrowed-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes borrowed-orbit{to{rotate:360deg}}
@keyframes borrowed-enter{from{opacity:0;translate:0 9px}to{opacity:1;translate:0 0}}
@media(max-width:760px), (min-width:761px){.hero{transform:none;padding:30px 25px}.hero-art{right:4px;opacity:.8;scale:.78;transform-origin:right center}.item-card:hover,.activity-card:hover,.community-card:hover,.profile-card:hover,.theme-panel:hover{transform:translateY(-2px)}.bottom-nav{backdrop-filter:blur(16px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.avatar-photo{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.profile-photo-editor{display:flex;align-items:center;gap:16px;margin:18px 0 8px;padding:14px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--white) 75%,var(--paper))}
.profile-photo-preview{width:78px;height:78px;flex:0 0 78px;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:var(--mint);color:var(--green);font:800 28px Manrope;box-shadow:inset 0 2px 4px #0001,0 7px 15px #0002}
.profile-photo-preview img{width:100%;height:100%;object-fit:cover}
.profile-photo-controls{flex:1;min-width:0}.profile-photo-controls .field{margin-bottom:8px}.profile-photo-controls .outline-button{padding:8px 11px;font-size:11px}
.profile-photo-controls .pickup-help{margin:6px 0 0}
.profile-avatar{overflow:hidden}.profile-avatar .avatar-photo{object-fit:cover}
.owner-avatar{overflow:hidden}.owner-avatar .avatar-photo{object-fit:cover}
body[data-theme] .profile-photo-editor{background:color-mix(in srgb,var(--white) 78%,var(--paper));border-color:var(--line)}
@media(max-width:480px), (min-width:761px){.profile-photo-editor{align-items:flex-start;gap:11px;padding:11px}.profile-photo-preview{width:64px;height:64px;flex-basis:64px}.profile-photo-controls .field{font-size:12px}}
.board-interests{display:grid;gap:10px;margin-top:16px;padding:14px;border:1px solid var(--line,#d8dce8);border-radius:16px;background:color-mix(in srgb,var(--surface,#fff) 92%,var(--accent,#d986ad) 8%)}
.board-interest{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line,#d8dce8);font-size:.9rem}
.board-interest>span:first-child{flex:1 1 100%;color:var(--text,#253044)}
.board-card .community-meta strong{color:var(--accent,#d986ad);font-size:1.1rem}
.campus-post-disclosure{padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--surface,#fff) 90%,var(--accent,#d986ad) 10%);font-size:.88rem;line-height:1.5}
#campus-post-dialog form,#board-interest-dialog form{display:grid;gap:8px}
#campus-post-dialog form[method=dialog]{display:block}
#campus-post-dialog [hidden]{display:none!important}

/* Campus navigation uses a soft iOS-style segmented pill and rounder surfaces. */
.community-tabs{display:flex;width:max-content;max-width:100%;gap:3px;overflow-x:auto;scrollbar-width:none;padding:5px;margin:20px 0 14px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--white) 86%,var(--paper));box-shadow:inset 0 1px 2px color-mix(in srgb,var(--ink) 5%,transparent)}
.community-tabs::-webkit-scrollbar{display:none}
.community-tabs .tab{flex:none;border:0;border-radius:999px;padding:10px 15px;color:var(--muted);font-size:12px;white-space:nowrap;transition:background .2s ease,color .2s ease,transform .2s ease}
.community-tabs .tab:hover{transform:translateY(-1px);color:var(--ink)}
.community-tabs .tab.active{border:0;background:var(--green);color:#fff;box-shadow:0 3px 9px color-mix(in srgb,var(--green) 25%,transparent)}
.community-card{border-radius:22px;padding:19px}
.community-grid .empty-state{border-radius:22px;padding:28px 20px}
.community-card-bottom .primary-button,.community-card-bottom .outline-button,.community-toolbar .primary-button{border-radius:999px}
.board-interests{border-radius:20px}
.board-interest .outline-button,.board-interest .primary-button{border-radius:999px}
.board-loading{display:flex;align-items:center;justify-content:center;gap:11px;min-height:170px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--white) 82%,var(--paper));color:var(--muted)}
.board-spinner{width:19px;height:19px;border:2px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:board-spin .7s linear infinite}
.community-content .board-card{animation:board-card-enter .24s ease both}
.community-content .board-card:nth-child(2){animation-delay:25ms}.community-content .board-card:nth-child(3){animation-delay:50ms}.community-content .board-card:nth-child(4){animation-delay:75ms}
@keyframes board-spin{to{transform:rotate(360deg)}}
@keyframes board-card-enter{from{opacity:0;transform:translateY(7px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px), (min-width:761px){.community-tabs{width:100%;gap:2px;padding:4px}.community-tabs .tab{flex:1;padding:10px 11px;font-size:11px}.community-card{padding:16px}}
@media(prefers-reduced-motion:reduce){.board-spinner{animation:none}.community-content .board-card{animation:none}.community-tabs .tab{transition:none}}

/* Carry the same friendly, rounded geometry through the rest of the app. */
.item-card,.activity-card,.community-card,.profile-card,.stat-grid>article,.theme-panel,.ledger,.hero,.request-banner,.help-card,.install-banner,.campus-map,.map-result{border-radius:22px}
.modal{border-radius:28px}
.primary-button,.outline-button,.danger-button,.trash-button,.location-button,.credits{border-radius:999px}
.field,select.field,textarea.field{border-radius:16px}
.activity-emoji{border-radius:16px}
.bottom-nav{border-radius:26px 26px 0 0}
@media(max-width:760px), (min-width:761px){.bottom-nav{border-radius:24px 24px 0 0}}
.hero-copy{position:relative;z-index:2;max-width:66%}
.hero-cta{display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:9px 14px;border:1px solid color-mix(in srgb,var(--green) 22%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--white) 92%,var(--mint));color:var(--green);font:700 11px 'DM Sans';box-shadow:0 4px 12px color-mix(in srgb,var(--ink) 8%,transparent);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.hero-cta:hover{transform:translateY(-2px);box-shadow:0 8px 17px color-mix(in srgb,var(--ink) 12%,transparent);background:var(--white)}
.hero-cta:active{transform:scale(.97)}
.hero-cta:focus-visible{outline:3px solid color-mix(in srgb,var(--green) 45%,transparent);outline-offset:3px}
.hero-carousel-controls{display:flex;align-items:center;gap:7px;margin-top:17px;min-height:12px}
.hero-dot{width:8px;height:8px;flex:none;padding:0;border:0;border-radius:999px;background:color-mix(in srgb,var(--green) 30%,var(--paper));cursor:pointer;transition:width .24s ease,background .24s ease,transform .24s ease}
.hero-dot:hover{transform:scale(1.2)}
.hero-dot.active{width:24px;background:var(--green)}
.hero-copy-changing{animation:hero-copy-change .38s ease both}
.hero-copy-changing.hero-copy-next{animation:hero-copy-slide-next .46s cubic-bezier(.2,.75,.2,1) both}
.hero-copy-changing.hero-copy-prev{animation:hero-copy-slide-prev .46s cubic-bezier(.2,.75,.2,1) both}
.hero-art-next #hero-icon{animation:hero-art-swap-next .56s cubic-bezier(.2,.8,.2,1) both}
.hero-art-prev #hero-icon{animation:hero-art-swap-prev .56s cubic-bezier(.2,.8,.2,1) both}
.hero-art-next .art-note,.hero-art-prev .art-note{animation:hero-note-pop .42s .08s ease both}
.hero{touch-action:pan-y;cursor:grab}
.hero.hero-dragging{cursor:grabbing}
.hero-carousel-controls{flex-wrap:wrap;max-width:100%}
.hero-arrow{width:30px;height:30px;flex:none;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:50%;background:color-mix(in srgb,var(--white) 84%,transparent);color:var(--ink);font:600 19px/1 'DM Sans';cursor:pointer;box-shadow:0 3px 10px color-mix(in srgb,var(--ink) 9%,transparent);transition:transform .2s ease,background .2s ease}
.hero-arrow:hover{transform:scale(1.08);background:var(--white)}
.hero-arrow:focus-visible,.hero-dot:focus-visible{outline:3px solid color-mix(in srgb,var(--green) 50%,transparent);outline-offset:3px}
.hero-swipe-hint{flex-basis:100%;margin:1px 0 0 3px;color:var(--muted);font-size:10px;letter-spacing:.1px}
@keyframes hero-copy-change{from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-copy-slide-next{from{opacity:0;transform:translateX(34px);filter:blur(4px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes hero-copy-slide-prev{from{opacity:0;transform:translateX(-34px);filter:blur(4px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes hero-art-swap-next{0%{opacity:.25;transform:translateX(48px) translateY(8px) translateZ(4px) rotate(14deg) scale(.72)}70%{opacity:1;transform:translateX(-4px) translateY(-3px) translateZ(36px) rotate(-13deg) scale(1.1)}100%{opacity:1;transform:translateZ(24px) rotate(-8deg) scale(1)}}
@keyframes hero-art-swap-prev{0%{opacity:.25;transform:translateX(-48px) translateY(8px) translateZ(4px) rotate(-18deg) scale(.72)}70%{opacity:1;transform:translateX(4px) translateY(-3px) translateZ(36px) rotate(-2deg) scale(1.1)}100%{opacity:1;transform:translateZ(24px) rotate(-8deg) scale(1)}}
@keyframes hero-note-pop{0%{opacity:.35;scale:.78}70%{opacity:1;scale:1.08}100%{opacity:1;scale:1}}
@media(max-width:760px), (min-width:761px){.hero-copy{max-width:76%}.hero-carousel-controls{margin-top:13px}}
@media(prefers-reduced-motion:reduce){.hero-dot,.hero-cta{transition:none}.hero-copy-changing,.hero-art-next #hero-icon,.hero-art-prev #hero-icon,.hero-art-next .art-note,.hero-art-prev .art-note{animation:none}}

/* Mobile polish: contain item photos and keep the pickup picker in document flow. */
.detail-emoji.detail-has-photo{height:clamp(190px,34vh,280px);padding:10px;overflow:hidden;background:#f2f4f2!important;border:1px solid #e5e9e5}
.detail-emoji .detail-photo{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;border-radius:12px}
.listing-modal{width:min(520px,calc(100vw - 24px));max-height:min(88vh,880px);max-height:min(88dvh,880px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;position:fixed}
.item-detail-modal{width:min(520px,calc(100vw - 24px));max-height:min(88vh,820px);max-height:min(88dvh,820px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.listing-modal form[method="dialog"]{display:block;min-height:30px}
.listing-modal>.eyebrow{display:block;clear:both}
.pickup-section{display:block;position:relative;clear:both;margin-top:18px;contain:layout paint;isolation:isolate}
.pickup-section .field-label{margin-top:0}
.pickup-caption{margin:0 0 7px;color:var(--muted);font-size:11px;line-height:1.45}
.pickup-map{position:relative;display:block;width:100%;height:156px;min-height:156px;max-height:156px;margin:8px 0;border-radius:18px;overflow:hidden;contain:layout paint;isolation:isolate;background:#edf2ea!important;flex:none}
.maplibregl-map{position:relative!important;inset:auto!important;width:100%;overflow:hidden;filter:none!important}
.maplibregl-canvas{filter:none!important}
.campus-map{position:relative;overflow:hidden;background:#edf2ea!important;border-radius:22px}
.campus-map .maplibregl-map,.pickup-map .maplibregl-map{color-scheme:light;filter:none!important}
.maplibregl-ctrl-group{border-radius:12px!important;overflow:hidden}
.maplibregl-ctrl-group button{background-color:#fff!important}
.maplibregl-ctrl-attrib{background:#ffffffdf!important;color:#52645a!important}
.map-status{position:absolute;z-index:4;left:50%;top:50%;width:min(350px,calc(100% - 28px));display:grid;gap:12px;justify-items:center;padding:17px;border:1px solid #dce5d8;border-radius:18px;background:#fffffff2;color:#415447;text-align:center;font:600 12px/1.5 'DM Sans',sans-serif;box-shadow:0 8px 28px #1e322b22;transform:translate(-50%,-50%)}
.map-retry{border:0;border-radius:999px;background:#397d59;color:#fff;padding:9px 15px;font:700 11px 'DM Sans',sans-serif;cursor:pointer}
.map-retry[hidden]{display:none}
.pickup-help{font-size:11px;line-height:1.5}
@media(max-width:760px), (min-width:761px){.listing-modal,.item-detail-modal{width:calc(100vw - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);padding:22px 18px calc(22px + env(safe-area-inset-bottom));border-radius:28px}.pickup-map{height:148px;min-height:148px;max-height:148px}.detail-emoji.detail-has-photo{height:clamp(180px,30vh,240px)}}

/* The six requested core palettes and six playful, original easter-egg palettes. */
body[data-theme="web-slinger"]{--ink:#f7f4f5;--muted:#b9bdcb;--paper:#0d1019;--white:#171c2a;--green:#f04b55;--mint:#202942;--lime:#72b9f4;--line:#30384d;--orange:#f04b55;--shadow:0 14px 34px #0009;--banner-bg:#18233c;--banner-ink:#fff;--banner-muted:#ccd1df;--banner-accent:#ff6870;--banner-icon:#263b62;--banner-button:#ef4954;--banner-button-ink:#fff}
body[data-theme="arc-reactor"]{--ink:#f8f2e6;--muted:#bcae9c;--paper:#080808;--white:#141414;--green:#f02036;--mint:#211b1b;--lime:#f0c242;--line:#392a22;--orange:#f02036;--shadow:0 14px 34px #0009;--banner-bg:#141414;--banner-ink:#fff8ed;--banner-muted:#d0c4b4;--banner-accent:#f0c242;--banner-icon:#30251c;--banner-button:#f02036;--banner-button-ink:#fff}
body[data-theme="shield-squad"]{--ink:#f5f7fb;--muted:#b5c0d2;--paper:#0c1423;--white:#151f31;--green:#75a9ef;--mint:#202d45;--lime:#f0d26b;--line:#303e56;--orange:#e04b55;--shadow:0 14px 34px #0009;--banner-bg:#182845;--banner-ink:#fff;--banner-muted:#c7d3e7;--banner-accent:#f0d26b;--banner-icon:#263b5d;--banner-button:#e04b55;--banner-button-ink:#fff}
body[data-theme="central-perk"]{--ink:#fff4e8;--muted:#c4b5ad;--paper:#17111b;--white:#241925;--green:#c993bb;--mint:#352438;--lime:#e4aa62;--line:#49334b;--orange:#ee9a53;--shadow:0 14px 34px #0009;--banner-bg:#2b1d31;--banner-ink:#fff7ed;--banner-muted:#dacbd4;--banner-accent:#efaa61;--banner-icon:#47304a;--banner-button:#b779a5;--banner-button-ink:#fff}
body[data-theme="golden-snitch"]{--ink:#faf5e9;--muted:#c2b99f;--paper:#15111d;--white:#211c2b;--green:#e6bd52;--mint:#342c3a;--lime:#f2d475;--line:#483e4d;--orange:#d4a638;--shadow:0 14px 34px #0009;--banner-bg:#292137;--banner-ink:#fff9e9;--banner-muted:#d3c9ae;--banner-accent:#f1d36f;--banner-icon:#443850;--banner-button:#dbb643;--banner-button-ink:#211a29}
body[data-theme="paper-company"]{--ink:#f7f4eb;--muted:#bec7d1;--paper:#10151b;--white:#1a222a;--green:#79acd2;--mint:#26313a;--lime:#e8dabb;--line:#34424d;--orange:#d7c399;--shadow:0 14px 34px #0009;--banner-bg:#202d38;--banner-ink:#fff;--banner-muted:#d1dbe1;--banner-accent:#e9d7b2;--banner-icon:#304454;--banner-button:#7caed2;--banner-button-ink:#111820}
body[data-theme="web-slinger"] .hero{isolation:isolate}
body[data-theme="web-slinger"] .hero:before,body[data-theme="arc-reactor"] .hero:before,body[data-theme="shield-squad"] .hero:before,body[data-theme="central-perk"] .hero:before,body[data-theme="golden-snitch"] .hero:before,body[data-theme="paper-company"] .hero:before{position:absolute;left:4%;right:4%;bottom:9px;z-index:1;text-align:center;font:800 clamp(15px,2vw,22px)/1.15 Manrope,sans-serif;letter-spacing:.03em;opacity:.23;text-shadow:0 2px 14px currentColor;pointer-events:none;white-space:nowrap}
body[data-theme="web-slinger"] .hero:before{content:"With great power comes great responsibility."}
body[data-theme="arc-reactor"] .hero:before{content:"I am Iron Man."}
body[data-theme="shield-squad"] .hero:before{content:"I can do this all day."}
body[data-theme="central-perk"] .hero:before{content:"Could this be any more shareable?"}
body[data-theme="golden-snitch"] .hero:before{content:"I open at the close."}
body[data-theme="paper-company"] .hero:before{content:"Bears. Beets. Borrowed."}
body[data-theme="web-slinger"] .hero:after{content:"";position:absolute;inset:10% 4% 8% 48%;z-index:1;opacity:.13;pointer-events:none;background:repeating-conic-gradient(from 5deg at 50% 50%,transparent 0 14deg,color-mix(in srgb,var(--green) 45%,transparent) 14.4deg 14.8deg,transparent 15deg 30deg);mask:radial-gradient(ellipse,transparent 0 12%,#000 13% 70%,transparent 72%);transition:opacity .3s,transform .5s}
body[data-theme="web-slinger"] .hero:hover:after{opacity:.32;transform:rotate(7deg) scale(1.05)}
body[data-theme="web-slinger"]{background-color:#090d18;background-image:radial-gradient(ellipse at 5% 12%,#e23d4d22,transparent 29%),radial-gradient(ellipse at 92% 62%,#278bcb20,transparent 34%),linear-gradient(165deg,#111521 0%,#0b0e18 56%,#101729 100%);background-attachment:fixed}
body[data-theme="web-slinger"] .hero{background:radial-gradient(circle at 78% 48%,#345a8738,transparent 32%),linear-gradient(118deg,#172038 0 58%,#1c1b2c 100%);border-color:#516080;box-shadow:inset 0 1px #ffffff15,0 18px 45px #0307118c}
body[data-theme="web-slinger"] .hero:before{content:none}
body[data-theme="web-slinger"] .hero:after{opacity:.27;background:repeating-conic-gradient(from 5deg at 50% 50%,transparent 0 14deg,#77c8ff66 14.4deg 14.8deg,transparent 15deg 30deg);mask:radial-gradient(ellipse,transparent 0 9%,#000 10% 74%,transparent 76%)}
body[data-theme="web-slinger"] .hero:hover:after{opacity:.55;transform:rotate(7deg) scale(1.05)}
.spider-verse-effects{position:fixed;inset:0;z-index:4;overflow:hidden;pointer-events:none}
.spider-web-corner{--web-origin:0% 0%;position:absolute;top:75px;width:clamp(112px,16vw,220px);height:clamp(112px,16vw,220px);opacity:.62;pointer-events:none;background-image:repeating-conic-gradient(from 1deg at var(--web-origin),transparent 0deg 14deg,#79c9ff5c 14.3deg 14.8deg,transparent 15.2deg 30deg),repeating-radial-gradient(circle at var(--web-origin),transparent 0 17px,#79c9ff65 18px 19px,transparent 20px 29px);mask-image:radial-gradient(circle at var(--web-origin),#000 0 5%,transparent 76%);transition:opacity .25s,filter .25s}
.spider-web-left{left:0}.spider-web-right{right:0;--web-origin:100% 0%}
.spider-web-knot{position:absolute;top:44px;left:44px;width:32px;height:32px;border:1px solid #9bdcff8c;border-radius:50%;background:#15243b9c;color:#fff;cursor:pointer;pointer-events:auto;box-shadow:0 0 0 4px #65baf51c;transition:transform .2s,background .2s}
.spider-web-right .spider-web-knot{left:auto;right:44px}
.spider-web-knot:before{content:'✳';font-size:15px;color:#b9e7ff}
.spider-web-knot:hover{transform:scale(1.15) rotate(25deg);background:#df3c50}
.spider-web-pulse{animation:web-knot-pulse .65s ease}
.spider-drop{position:absolute;top:79px;right:clamp(18px,9vw,136px);display:grid;justify-items:center;pointer-events:none;transform-origin:top center;animation:spider-idle 3.8s ease-in-out infinite}
.spider-drop:before{content:'';height:31px;width:2px;background:linear-gradient(#8bd6ff,#e14355)}
.spider-mascot{width:43px;height:43px;padding:0;border:2px solid #f4f7ff;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fff,#cceaff 40%,#3d70ba 100%);font-size:23px;line-height:1;cursor:pointer;pointer-events:auto;box-shadow:0 0 0 5px #68bcf51c,0 8px 18px #0007;transition:transform .2s}
.spider-mascot:hover{transform:scale(1.12)}
.spider-swing{animation:spider-swing .72s cubic-bezier(.3,.1,.2,1)}
.spider-verse-quote{position:absolute;top:158px;right:clamp(18px,5vw,72px);max-width:min(290px,72vw);padding:12px 16px;border:1px solid #82caff65;border-radius:20px 20px 5px 20px;background:linear-gradient(135deg,#172139f5,#251c31f5);color:#f7f8ff;font:700 12px/1.5 Manrope,sans-serif;box-shadow:0 12px 30px #0007,0 0 26px #3289be24;pointer-events:none}
.spider-verse-quote[hidden]{display:none}
.spider-quote-pop{animation:spider-quote-pop .32s cubic-bezier(.2,.8,.2,1)}
@keyframes spider-idle{0%,100%{rotate:-5deg}50%{rotate:6deg}}
@keyframes spider-swing{0%{transform:rotate(0)}25%{transform:rotate(35deg) translateX(8px)}55%{transform:rotate(-30deg) translateX(-7px)}100%{transform:rotate(0)}}
@keyframes spider-quote-pop{from{opacity:0;translate:0 -7px;scale:.96}to{opacity:1;translate:0 0;scale:1}}
@keyframes web-knot-pulse{50%{transform:scale(1.28);box-shadow:0 0 0 15px #6ec7ff22,0 0 24px #88d5ff}}
@media(max-width:760px), (min-width:761px){.spider-web-corner{top:62px;width:118px;height:118px;opacity:.5}.spider-web-knot{top:30px;left:30px;width:27px;height:27px}.spider-web-right .spider-web-knot{right:30px}.spider-drop{top:64px;right:23vw}.spider-drop:before{height:23px}.spider-mascot{width:37px;height:37px;font-size:20px}.spider-verse-quote{top:131px;right:15px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.spider-drop{animation:none}.spider-swing,.spider-quote-pop,.spider-web-pulse{animation:none}}
body[data-theme="arc-reactor"] .hero-art #hero-icon{filter:drop-shadow(0 0 12px #f2b63888) drop-shadow(0 12px 14px #0008)}
body[data-theme="shield-squad"] .hero-art .orbit{border-color:#e8d17699}
body[data-theme="arc-reactor"] .hero-art:after{content:"";position:absolute;width:58px;height:58px;border:5px solid #f2b638;border-radius:50%;box-shadow:0 0 0 8px #f2b63822,0 0 28px #f2b63899;pointer-events:none;animation:reactor-pulse 2.6s ease-in-out infinite}
body[data-theme="shield-squad"] .hero-art:after{content:"✦";position:absolute;display:grid;place-items:center;width:53px;height:53px;border:5px solid #f3d66e;border-radius:50%;background:linear-gradient(135deg,#d43e50 0 33%,#f4f6fa 34% 66%,#326db1 67%);color:#fff;font-size:21px;text-shadow:0 1px 5px #0007;box-shadow:0 9px 20px #0006;pointer-events:none;transform:translate(60px,56px) rotate(-12deg);transition:transform .35s}
body[data-theme="shield-squad"] .hero:hover .hero-art:after{transform:translate(60px,56px) rotate(14deg) scale(1.09)}
body[data-theme="central-perk"] .hero-art:after{content:"☕";position:absolute;right:13%;bottom:18%;font-size:30px;filter:drop-shadow(0 7px 8px #0006);animation:borrowed-float 2.6s ease-in-out infinite;pointer-events:none}
body[data-theme="golden-snitch"] .hero-art:after{content:"✦";position:absolute;right:22%;top:27%;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#fff5c7;background:radial-gradient(circle at 35% 30%,#fff9d6,#d8a72f 62%,#9a6a1c);box-shadow:0 0 22px #f3d574bb;animation:snitch-fly 4s ease-in-out infinite alternate;pointer-events:none}
body[data-theme="paper-company"] .hero-art:after{content:"▱";position:absolute;right:20%;bottom:20%;color:#e8dabb;font-size:40px;text-shadow:0 5px 10px #0009;transform:rotate(18deg);transition:transform .35s;pointer-events:none}
body[data-theme="paper-company"] .hero:hover .hero-art:after{transform:rotate(198deg) translateY(-8px)}
body[data-theme="paper-company"] .hero-art .orbit{border-style:dashed;border-color:#e8dabb77}
@keyframes reactor-pulse{50%{transform:scale(1.1);box-shadow:0 0 0 14px #f2b63818,0 0 40px #f2b638cc}}
@keyframes snitch-fly{0%{transform:translate(-20px,8px) rotate(-15deg)}100%{transform:translate(22px,-14px) rotate(24deg)}}
.theme-options{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));max-width:820px}
.theme-panel{flex-wrap:wrap}.theme-panel>.theme-options{flex:1 1 60%}.theme-panel>.theme-easter-egg{flex:1 1 100%}
.theme-option{min-height:54px;border-radius:18px;padding:8px 11px;transition:transform .22s,box-shadow .22s,border-color .22s}
.theme-option-label{display:grid;gap:2px;min-width:0}.theme-option-label b{font-size:11px}.theme-option-label small{font-size:9px;color:var(--muted);font-weight:500}
.theme-option:hover{transform:translateY(-2px);box-shadow:var(--depth-soft)}
.theme-easter-egg{display:none;grid-column:1/-1;margin:4px 0 0;padding:11px 14px;border-radius:16px;background:var(--mint);color:var(--green);font-size:12px;font-weight:700}
.theme-easter-egg.is-visible{display:block}.theme-egg-pop{animation:theme-egg-pop .38s cubic-bezier(.2,.8,.2,1) both}
@keyframes theme-egg-pop{from{opacity:0;transform:translateY(7px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
body[data-theme] .pickup-section,.pickup-section .pickup-caption{color:var(--muted)}
body[data-theme] .pickup-map,body[data-theme] .campus-map{background-color:#edf2ea!important;background-image:linear-gradient(33deg,transparent 47%,#fff 48%,#fff 51%,transparent 52%),linear-gradient(122deg,transparent 42%,#fff 43%,#fff 46%,transparent 47%),linear-gradient(90deg,#dce8d7 1px,transparent 1px),linear-gradient(#dce8d7 1px,transparent 1px)!important;background-size:100% 100%,100% 100%,52px 52px,52px 52px}
body[data-theme] .map-block{background:#d7e5d3!important;color:#526653!important}
body[data-theme] .map-block.block-b{background:#e6e3d4!important}
body[data-theme] .map-block.block-c{background:#dce9db!important}
body[data-theme] .map-block.block-d{background:#d7e8dc!important}
body[data-theme] .map-road{background:#fff!important}
body[data-theme] .pickup-section .maplibregl-map,body[data-theme] .campus-map .maplibregl-map{filter:none!important}
/* A self-contained, light campus guide keeps map pins readable when third-party map tiles are unavailable. */
.campus-map,.pickup-map{position:relative;overflow:hidden;background:#eaf1e7!important}
.map-guide{position:absolute;inset:0;overflow:hidden;border-radius:inherit;background:#eaf1e7;color:#405941;isolation:isolate;cursor:crosshair}
.map-guide-layer{position:absolute;inset:0;transform-origin:50% 50%;transition:transform .2s ease}
.map-guide-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.map-guide-pins{position:absolute;inset:0}
.map-guide-pin{position:absolute;z-index:2;display:grid;justify-items:center;gap:2px;transform:translate(-50%,-50%);border:0;background:transparent;cursor:pointer;color:#263a2d}
.map-guide-pin span{display:grid;place-items:center;width:38px;height:38px;border:2px solid #fff;border-radius:50%;background:#477bd0;box-shadow:0 4px 12px #13243b40;font-size:19px;transition:transform .18s ease}
.map-guide-pin:hover span,.map-guide-pin:focus-visible span{transform:scale(1.16)}
.map-guide-pin small{max-width:120px;padding:4px 7px;border:1px solid #d8e2d4;border-radius:999px;background:#fff;color:#344a38;font-size:9px;font-weight:800;white-space:nowrap;box-shadow:0 3px 10px #33452a18}
.map-guide-selected-pin{position:absolute;left:50%;top:50%;z-index:3;width:27px;height:27px;border:4px solid #fff;border-radius:50% 50% 50% 4px;background:#397d59;box-shadow:0 3px 10px #1b382d55;transform:translate(-50%,-80%) rotate(-45deg);pointer-events:none}
.map-guide-selected-pin:after{content:"";position:absolute;inset:5px;border-radius:50%;background:#fff}
.map-guide-you-pin{position:absolute;z-index:3;transform:translate(-50%,-50%);padding:5px 9px;border:2px solid #fff;border-radius:999px;background:#397d59;color:#fff;font-size:10px;font-weight:800;box-shadow:0 4px 14px #1d422e55}
.map-guide-controls{position:absolute;z-index:5;top:12px;left:12px;display:grid;overflow:hidden;border:1px solid #d4ddd0;border-radius:12px;background:#fff;box-shadow:0 3px 12px #263a2618}
.map-guide-controls button{width:36px;height:36px;border:0;background:#fff;color:#294632;font:700 22px Arial;cursor:pointer}
.map-guide-controls button+button{border-top:1px solid #e2e8df}
.map-guide-controls button:hover{background:#f1f6ee}
.map-guide-note,.map-guide-attribution{position:absolute;z-index:5;bottom:10px;padding:6px 9px;border:1px solid #dce5d8;border-radius:999px;background:#ffffffeb;color:#536852;font-size:9px;font-weight:700;text-decoration:none;box-shadow:0 2px 8px #25382016}
.map-guide-note{left:10px}.map-guide-attribution{right:10px}
.pickup-map .map-guide-art text{font-size:20px}
.pickup-map .map-guide-note{display:none}
@media(max-width:560px), (min-width:761px){.map-guide-pin small{max-width:90px;font-size:8px}.map-guide-controls{top:8px;left:8px}.map-guide-note,.map-guide-attribution{bottom:7px;font-size:8px}.map-guide-note{max-width:66%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media(max-width:760px), (min-width:761px){body[data-theme] .hero:before{font-size:13px;opacity:.09}}
@media(prefers-reduced-motion:reduce){body[data-theme="web-slinger"] .hero:after{transition:none}body[data-theme="arc-reactor"] .hero-art:after,body[data-theme="central-perk"] .hero-art:after,body[data-theme="golden-snitch"] .hero-art:after{animation:none}.theme-egg-pop{animation:none}}

/* Spider-Verse: classic scarlet and blue, with lightweight interactive web details. */
body[data-theme="web-slinger"]{--green:#e52536;--orange:#e52536;--lime:#65b9ff;--mint:#18294b;--banner-bg:#142c54;--banner-accent:#ff5262;--banner-icon:#203f73;--banner-button:#e52536;background-color:#080e1c;background-image:radial-gradient(ellipse at 12% 16%,#e5253620,transparent 30%),radial-gradient(ellipse at 86% 46%,#145bb829,transparent 38%),linear-gradient(150deg,#0b1222,#080e1b 65%,#0d1830);background-attachment:fixed}
body[data-theme="web-slinger"] .hero{background:radial-gradient(circle at 78% 48%,#2868ad34,transparent 34%),linear-gradient(120deg,#111c32,#17284a 72%,#13254a);border-color:#31507d}
body[data-theme="web-slinger"] .hero:after{opacity:.08;background:radial-gradient(ellipse,#fff 1px,transparent 1.5px);background-size:28px 28px;mask-image:linear-gradient(90deg,transparent 5%,#000 100%)}
.spider-web-corner{top:0;width:clamp(132px,18vw,246px);height:clamp(132px,18vw,246px);opacity:.72;background:none;mask:none;transition:opacity .25s,filter .25s}
.spider-web-corner svg{display:block;width:100%;height:100%;overflow:visible;color:#83c8ff;filter:drop-shadow(0 1px 3px #2468a544)}
.spider-web-corner svg path{stroke-width:1.05;opacity:.62}
.spider-web-corner .spider-web-knot{inset:0;left:auto;right:auto;top:auto;bottom:auto;width:100%;height:100%;display:grid;place-items:center;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.spider-web-corner .spider-web-knot:before{display:grid;place-items:center;width:32px;height:32px;border:1px solid #89caff99;border-radius:50%;background:#10264bcc;box-shadow:0 0 0 5px #3294e21b,0 5px 18px #02081677;content:'✦';color:#e52536}
.spider-web-corner .spider-web-knot:hover{transform:none;background:transparent}
.spider-web-corner .spider-web-knot:hover:before{transform:scale(1.14);background:#e52536;color:#fff}
.web-top-right .spider-web-knot{left:auto;right:auto}.web-bottom-left .spider-web-knot,.web-bottom-right .spider-web-knot{top:auto;bottom:auto}
.web-top-right{--web-origin:100% 0%;transform:scaleX(-1)}
.web-bottom-left,.web-bottom-right{top:auto;bottom:0}
.web-bottom-left{transform:scaleY(-1)}.web-bottom-right{transform:scale(-1)}
.spider-web-knot{top:25px;left:25px;width:34px;height:34px;border-color:#89caff99;background:#10264bcc;box-shadow:0 0 0 5px #3294e21b,0 5px 18px #02081677}
.spider-web-right .spider-web-knot{left:auto;right:25px}
.web-bottom-left .spider-web-knot{top:auto;bottom:25px}.web-bottom-right .spider-web-knot{top:auto;bottom:25px}
.spider-web-knot:before{content:'✦';color:#e52536}.spider-web-knot:hover{background:#e52536;color:#fff}
.spider-web-descender{position:absolute;top:28px;left:26px;font-size:22px;transform-origin:top center;animation:web-spider-drop 1.4s cubic-bezier(.3,.05,.3,1) both;filter:drop-shadow(0 3px 4px #0007)}
.web-top-right .spider-web-descender,.web-bottom-right .spider-web-descender{left:auto;right:26px}
@keyframes web-spider-drop{0%{translate:0 0;rotate:-12deg}18%{translate:0 25px}72%{translate:0 110px;rotate:14deg}100%{translate:0 85px;opacity:0}}
.spider-drop{top:95px;right:clamp(26px,11vw,160px)}
.spider-drop:before{height:42px;background:linear-gradient(#82caff,#e52536)}
.spider-mascot{background:radial-gradient(circle at 35% 28%,#fff,#cdeaff 42%,#3275c6);border-color:#fff}
.spider-verse-quote{border-color:#4f8bd6;background:linear-gradient(140deg,#142b50f5,#10182bf5);box-shadow:0 12px 34px #02081788,0 0 25px #207acc24}
.spider-gwen-stage{display:flex;align-items:center;gap:12px;width:max-content;max-width:100%;margin:20px 0 10px;padding:10px 15px 8px;border:1px solid #3b5e8b;border-radius:28px;background:linear-gradient(135deg,#142746,#101a2c);box-shadow:0 12px 30px #02081755}
.spider-gwen-cameo{display:flex;align-items:center;gap:10px;padding:0;border:0;background:none;color:var(--ink);font:700 13px Manrope,sans-serif;cursor:pointer;text-align:left}
.gwen-chibi-art{display:block;width:48px;height:60px;flex:none;filter:drop-shadow(0 5px 5px #0005);transition:transform .25s}
.spider-gwen-cameo:hover .gwen-chibi-art{transform:translateY(-5px) rotate(-5deg) scale(1.08)}
.spider-gwen-stage>small{align-self:flex-end;padding-bottom:2px;color:#a8c7ed;font-size:10px}
.gwen-web-sheet{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;overflow:hidden;padding:24px;background:radial-gradient(ellipse at 50% 10%,#e525362b,transparent 44%),linear-gradient(145deg,#101a2d,#091121 78%);color:#f8f9ff;opacity:0;visibility:hidden;translate:0 -25vh;transition:translate .72s cubic-bezier(.2,.8,.2,1),opacity .45s,visibility .72s}
.gwen-web-sheet.is-pulled{opacity:1;visibility:visible;translate:0 0}
.gwen-web-sheet.is-returning{opacity:0;visibility:hidden;translate:0 -100vh}
.gwen-web-sheet:focus{outline:none}
.gwen-sheet-web{position:absolute;inset:-18%;display:grid;place-items:center;color:#73c2ff2b;rotate:-8deg;scale:1.2;pointer-events:none}
.gwen-sheet-web svg{width:min(100vw,1050px);height:min(100vw,1050px)}
.gwen-sheet-copy{position:relative;z-index:1;max-width:620px;text-align:center}
.gwen-sheet-kicker{color:#ff6470;font-size:11px;font-weight:900;letter-spacing:.18em}
.gwen-sheet-copy h2{margin:14px 0;font-size:clamp(30px,6vw,60px);letter-spacing:-.04em}
.gwen-sheet-copy p{color:#c4d7f0;font-size:15px}
.gwen-sheet-return{display:grid;justify-items:center;gap:8px;margin:24px auto 0;padding:14px 24px;border:1px solid #588ac0;border-radius:30px;background:#16294a;color:#fff;font-weight:800;cursor:pointer;box-shadow:0 12px 30px #0005}
.gwen-sheet-return .gwen-chibi-art{width:100px;height:125px}
.gwen-sheet-return:hover .gwen-chibi-art{animation:gwen-swing .55s ease-in-out}
@keyframes gwen-swing{50%{transform:rotate(10deg) translateY(-12px)}}
body.gwen-sheet-pulled{overflow:hidden}
body[data-theme="web-slinger"] .app-shell{transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .5s}
body.gwen-sheet-pulled .app-shell{transform:translateY(115vh) rotate(2deg);opacity:.4;pointer-events:none}
@media(max-width:760px), (min-width:761px){.spider-web-corner{top:62px;width:110px;height:110px;opacity:.55}.web-bottom-left,.web-bottom-right{top:auto;bottom:70px}.spider-web-knot{top:18px;left:18px;width:27px;height:27px}.spider-web-right .spider-web-knot{right:18px}.web-bottom-left .spider-web-knot,.web-bottom-right .spider-web-knot{top:auto;bottom:18px}.spider-web-descender{top:20px;left:18px}.web-bottom-left .spider-web-descender,.web-bottom-right .spider-web-descender{top:auto;bottom:18px}.spider-drop{top:72px;right:21vw}.spider-drop:before{height:24px}.spider-mascot{width:36px;height:36px;font-size:19px}.spider-verse-quote{top:120px;right:12px;font-size:11px}.spider-gwen-stage{margin:14px 0 8px}.gwen-chibi-art{width:40px;height:50px}.gwen-sheet-copy h2{max-width:340px}.gwen-sheet-copy p{max-width:300px;margin-inline:auto}}
@media(prefers-reduced-motion:reduce){.spider-web-descender,.gwen-sheet-return:hover .gwen-chibi-art{animation:none}.spider-gwen-cameo .gwen-chibi-art,.gwen-web-sheet,.app-shell{transition:none}}
.profile-feature-panel{margin:20px 0;padding:22px;border:1px solid var(--line);border-radius:26px;background:color-mix(in srgb,var(--white) 78%,var(--paper));box-shadow:0 8px 24px color-mix(in srgb,var(--ink) 6%,transparent)}
.profile-feature-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:16px}
.profile-feature-heading h2{margin:5px 0 6px;color:var(--ink);font:750 20px Manrope,sans-serif;letter-spacing:-.5px}
.profile-feature-heading p{max-width:600px;margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.profile-activity-summary{flex:none;padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--muted);font-size:10px;font-weight:700}
.profile-feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.profile-feature-tile{min-width:0;min-height:108px;display:flex;align-items:center;gap:11px;padding:14px;border:1px solid var(--line);border-radius:21px;background:var(--white);color:var(--ink);text-align:left;cursor:pointer;box-shadow:0 3px 12px color-mix(in srgb,var(--ink) 4%,transparent);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.profile-feature-tile:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--green) 38%,var(--line));box-shadow:0 10px 22px color-mix(in srgb,var(--ink) 9%,transparent)}
.profile-feature-tile:active{transform:scale(.985)}
.profile-feature-tile:focus-visible{outline:3px solid color-mix(in srgb,var(--green) 45%,transparent);outline-offset:2px}
.profile-feature-icon{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:15px;background:color-mix(in srgb,var(--mint) 75%,var(--white));color:var(--green);font-size:20px}
.profile-feature-copy{min-width:0;flex:1;display:grid;gap:4px}
.profile-feature-copy b{font:700 12px Manrope,sans-serif;color:var(--ink)}
.profile-feature-copy small{color:var(--muted);font-size:9px;line-height:1.4}
.profile-feature-copy strong{color:var(--green);font-size:9px;font-weight:700}
.profile-feature-arrow{align-self:flex-start;color:var(--muted);font-size:14px}
@media(max-width:900px), (min-width:761px){.profile-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px), (min-width:761px){.profile-feature-panel{padding:16px;border-radius:22px}.profile-feature-heading{align-items:flex-start;flex-direction:column;gap:10px}.profile-feature-heading h2{font-size:18px}.profile-feature-grid{gap:8px}.profile-feature-tile{min-height:100px;padding:11px;border-radius:18px}.profile-feature-icon{width:34px;height:34px;border-radius:13px;font-size:17px}}
@media(max-width:370px), (min-width:761px){.profile-feature-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.profile-feature-tile{transition:none}}
/* Spider-Verse refinements: clean circular webs and a tiny Gwen web-slinging cameo. */
body[data-theme="web-slinger"] .hero:after{content:none;display:none}
.spider-web-corner svg{position:relative;z-index:0;aspect-ratio:1}
.spider-web-corner svg circle{stroke-width:1.2;opacity:.64}
.spider-web-corner svg path{stroke-width:1.05;opacity:.66}
.spider-gwen-corner{position:fixed;right:14px;bottom:92px;z-index:6;display:grid;place-items:center;width:52px;height:66px;padding:2px;border:0;background:transparent;cursor:pointer;filter:drop-shadow(0 5px 9px #02081788);transition:transform .22s}
.spider-gwen-corner:hover,.spider-gwen-corner:focus-visible{transform:translateY(-4px) rotate(-4deg);outline:2px solid #79c8ff;border-radius:18px}
.spider-gwen-corner>.gwen-chibi-art{position:relative;z-index:2;width:48px;height:61px;animation:gwen-corner-idle 3.2s ease-in-out infinite;transform-origin:50% 100%}
.gwen-power-web{position:absolute;z-index:1;top:-42px;left:50%;width:40px;height:40px;opacity:0;translate:-50% 18px;scale:.2;pointer-events:none;color:#85d1ff;transition:opacity .25s,translate .35s cubic-bezier(.2,.8,.2,1),scale .4s cubic-bezier(.2,.8,.2,1)}
.gwen-power-web svg{width:100%;height:100%;filter:drop-shadow(0 0 5px #4eb8ff)}
.gwen-power-caption{position:absolute;right:50px;top:2px;padding:4px 8px;border:1px solid #72c8ff80;border-radius:10px;background:#102441;color:#e9f7ff;font-size:9px;font-weight:900;letter-spacing:.08em;opacity:0;translate:8px 0;white-space:nowrap;pointer-events:none}
.gwen-power-active{animation:gwen-thwip .62s cubic-bezier(.2,.8,.2,1)}
.gwen-power-active .gwen-chibi-art{animation:gwen-swing .7s ease-in-out}
.gwen-power-active .gwen-power-web{width:146px;height:146px;opacity:.9;translate:-50% -28px;scale:1;rotate:-15deg}
.gwen-power-active .gwen-power-caption{animation:gwen-caption .95s .14s ease-out both}
@keyframes gwen-corner-idle{0%,100%{translate:0 0;rotate:-2deg}50%{translate:0 -3px;rotate:2deg}}
@keyframes gwen-thwip{35%{translate:-24px -18px;rotate:-12deg}75%{translate:4px 0;rotate:6deg}}
@keyframes gwen-swing{40%{transform:rotate(18deg) translateY(-4px)}80%{transform:rotate(-12deg)}}
@keyframes gwen-caption{12%{opacity:1;translate:0 0}78%{opacity:1}100%{opacity:0;translate:-3px -5px}}
@media(max-width:760px), (min-width:761px){.spider-gwen-corner{right:8px;bottom:88px;width:46px;height:58px}.spider-gwen-corner>.gwen-chibi-art{width:42px;height:54px}.gwen-power-caption{right:42px}}
@media(prefers-reduced-motion:reduce){.spider-gwen-corner>.gwen-chibi-art,.gwen-power-active,.gwen-power-active .gwen-chibi-art,.gwen-power-active .gwen-power-caption{animation:none}.gwen-power-web,.spider-gwen-corner{transition:none}}

/* Friends / Central Perk: warm coffeehouse colors with the supplied wordmark as a quiet wallpaper. */
body[data-theme="central-perk"]{--ink:#fff5ea;--muted:#c8b8c2;--paper:#17121b;--white:#241a29;--green:#df8d58;--mint:#34243a;--lime:#f3ca62;--line:#49354c;--orange:#e79b5e;--shadow:0 18px 42px #08040b88;--banner-bg:#302139;--banner-ink:#fff8ef;--banner-muted:#d8c7cf;--banner-accent:#f2c65c;--banner-icon:#523748;--banner-button:#e69a5d;--banner-button-ink:#241724;background-color:#17121b;background-image:radial-gradient(ellipse at 10% 8%,#e4955c20,transparent 29%),radial-gradient(ellipse at 90% 38%,#70507b22,transparent 34%),linear-gradient(160deg,#1c1522,#15111a 58%,#201622);background-attachment:fixed}
body[data-theme="central-perk"]::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:url("friends-wordmark.png");background-position:24px 28px;background-size:560px auto;background-repeat:repeat;opacity:.11;mix-blend-mode:screen}
body[data-theme="central-perk"] .app-shell{position:relative;z-index:1}
body[data-theme="central-perk"] .topbar{background:#17121be8;border-color:#49354c;box-shadow:0 8px 28px #08040b55}
body[data-theme="central-perk"] .brand-mark{background:linear-gradient(145deg,#e58e58,#f2bf5e);color:#281929;box-shadow:0 4px 14px #e58e5835}
body[data-theme="central-perk"] .brand-dot,body[data-theme="central-perk"] .coin{color:#f3ca62}
body[data-theme="central-perk"] .hero{isolation:isolate;border:1px solid #80586a;background:radial-gradient(ellipse at 80% 50%,#e6955d1e,transparent 31%),linear-gradient(120deg,#2d2034,#33243a 58%,#241b2a);box-shadow:inset 0 1px #fff2,0 20px 44px #08040b88}
body[data-theme="central-perk"] .hero h1{color:#fff5ea}
body[data-theme="central-perk"] .hero h1 em{color:#f0a364}
body[data-theme="central-perk"] .hero .eyebrow{color:#f3ca62}
body[data-theme="central-perk"] .hero p{color:#d5c4cc}
body[data-theme="central-perk"] .hero:before{color:#f2c65c;text-shadow:0 2px 18px #e79b5e55}
body[data-theme="central-perk"] .hero-art .orbit{border-color:#d5a26777;box-shadow:0 0 24px #e4955c0c}
body[data-theme="central-perk"] .hero-art .orbit-two{border-color:#c99ab177}
body[data-theme="central-perk"] .hero-art .art-box{filter:drop-shadow(0 12px 18px #0b061080);transform:rotate(-5deg);transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s}
body[data-theme="central-perk"] .hero:hover .hero-art .art-box{transform:translateY(-7px) rotate(4deg) scale(1.06);filter:drop-shadow(0 15px 20px #0b0610a0)}
body[data-theme="central-perk"] .hero-art:after{content:"☕";position:absolute;right:13%;bottom:18%;font-size:31px;filter:drop-shadow(0 7px 9px #0b061088);animation:friends-mug-float 3.2s ease-in-out infinite;pointer-events:none}
@keyframes friends-mug-float{0%,100%{translate:0 0;rotate:-8deg}50%{translate:0 -7px;rotate:5deg}}
body[data-theme="central-perk"] .hero-cta,body[data-theme="central-perk"] .primary-button,body[data-theme="central-perk"] .request-button{background:linear-gradient(135deg,#e69359,#f1bb61);border-color:#efb266;color:#2b1b2b;box-shadow:0 7px 18px #08040b33}
body[data-theme="central-perk"] .hero-cta:hover,body[data-theme="central-perk"] .primary-button:hover,body[data-theme="central-perk"] .request-button:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 10px 23px #08040b55}
body[data-theme="central-perk"] .bottom-nav{border-color:#4b374f;background:#211827ee!important;box-shadow:0 -8px 30px #08040b88}
body[data-theme="central-perk"] .nav-item.selected{color:#f2bd60}
body[data-theme="central-perk"] .nav-item.selected:before{background:#f2bd60}
body[data-theme="central-perk"] .item-card,body[data-theme="central-perk"] .activity-card,body[data-theme="central-perk"] .community-card,body[data-theme="central-perk"] .profile-card,body[data-theme="central-perk"] .stat-grid>article,body[data-theme="central-perk"] .theme-panel,body[data-theme="central-perk"] .ledger,body[data-theme="central-perk"] .help-card,body[data-theme="central-perk"] .profile-feature-panel,body[data-theme="central-perk"] .profile-feature-tile{border-color:#49354c;background:linear-gradient(145deg,#261c2b,#211823);box-shadow:0 8px 26px #08040b55}
body[data-theme="central-perk"] .item-card:hover,body[data-theme="central-perk"] .community-card:hover,body[data-theme="central-perk"] .profile-feature-tile:hover{border-color:#d9945f88;box-shadow:0 14px 32px #08040b77,0 0 20px #d9945f12}
body[data-theme="central-perk"] .item-image{background:linear-gradient(135deg,#3b2b40,#2d2234)!important}
body[data-theme="central-perk"] .credits-rate,body[data-theme="central-perk"] .status-pill.done{color:#efb66a}
body[data-theme="central-perk"] .outline-button,body[data-theme="central-perk"] .filter-btn{border-color:#624a62;background:#2b2031;color:#f6e9e2}
body[data-theme="central-perk"] .field,body[data-theme="central-perk"] input.field,body[data-theme="central-perk"] textarea.field,body[data-theme="central-perk"] select.field{border-color:#624a62;background:#1b1520;color:#fff5ea}
body[data-theme="central-perk"] dialog.modal{border:1px solid #684c65;background:#211824;color:#fff5ea;box-shadow:0 28px 90px #08040bcc}
body[data-theme="central-perk"] .request-banner{background:linear-gradient(115deg,#35253b,#292031)!important;border-color:#574059;box-shadow:0 12px 32px #08040b55}
body[data-theme="central-perk"] .request-banner h3{color:#fff4e8!important}
body[data-theme="central-perk"] .request-icon{background:#51374d!important;color:#f2c65c!important}
body[data-theme="central-perk"] .theme-option[aria-pressed="true"]{border-color:#e3a05f;box-shadow:0 0 0 2px #e3a05f22}
body[data-theme="central-perk"] .searchbox,body[data-theme="central-perk"] .filter-btn,body[data-theme="central-perk"] .chip,body[data-theme="central-perk"] .outline-button,body[data-theme="central-perk"] .activity-actions button{border-color:#624a62;background:#2b2031;color:#f6e9e2}
body[data-theme="central-perk"] .chip.active{border-color:#e4a05f;background:linear-gradient(135deg,#e69359,#f1bb61);color:#281929;box-shadow:0 5px 16px #e6935928}
body[data-theme="central-perk"] .profile-feature-icon{background:#49354c;color:#f2bd60}
body[data-theme="central-perk"] .profile-feature-copy b,body[data-theme="central-perk"] .profile-feature-heading h2{color:#fff5ea}
body[data-theme="central-perk"] .profile-feature-copy strong,body[data-theme="central-perk"] .profile-feature-arrow{color:#efad67}
body[data-theme="central-perk"] .profile-activity-summary{border-color:#604861;background:#302139;color:#f4d98a}
body[data-theme="central-perk"] .profile-feature-tile:hover{border-color:#d9945f88;background:linear-gradient(145deg,#302139,#281d2d);box-shadow:0 14px 32px #08040b77,0 0 20px #d9945f12}
body[data-theme="central-perk"] .theme-easter-egg,body[data-theme="central-perk"] .trust-note{border-color:#624a62;background:#302139;color:#f7e9df}
body[data-theme="central-perk"] .owner-row,body[data-theme="central-perk"] .ledger-row{border-color:#49354c}
body[data-theme="central-perk"] .tab{color:#c8b8c2}
body[data-theme="central-perk"] .tab.active{color:#f3ca62;border-color:#f3ca62}
.friends-door-cameo:active{transform:scale(.94)}
.friends-theme-effects{position:fixed;inset:0;z-index:4;pointer-events:none}
.friends-door-cameo{position:absolute;right:19px;bottom:24px;width:59px;height:66px;padding:0;border:0;background:transparent;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 7px 12px #09050b99);transition:transform .2s,filter .2s}
.friends-cameo-frame{position:relative;display:flex;width:100%;height:100%;align-items:center;justify-content:center;flex-direction:column;gap:1px;border:4px solid #e9bd55;border-radius:13px 13px 10px 10px;background:linear-gradient(145deg,#4f344d,#2d2036);box-shadow:inset 0 0 0 2px #fff2,0 0 0 1px #4d374e}
.friends-peephole{position:absolute;top:7px;right:9px;width:5px;height:5px;border-radius:50%;background:#f2c65c;box-shadow:0 0 8px #f2c65c99}
.friends-cup{display:block;font-size:23px;line-height:1;animation:friends-steam 2.2s ease-in-out infinite}
.friends-cameo-frame small{color:#f5d978;font:700 5px 'JetBrains Mono',monospace;letter-spacing:.045em;white-space:nowrap}
@keyframes friends-steam{0%,100%{transform:translateY(1px) rotate(-4deg)}50%{transform:translateY(-3px) rotate(4deg)}}
.friends-door-cameo:hover,.friends-door-cameo:focus-visible{transform:translateY(-4px) rotate(-3deg);filter:drop-shadow(0 9px 16px #09050bcc);outline:2px solid #f3ca62;outline-offset:4px}
.friends-cameo-pop .friends-cameo-frame{animation:friends-frame-pop .55s cubic-bezier(.2,.8,.2,1)}
@keyframes friends-frame-pop{35%{transform:rotate(5deg) scale(1.12)}70%{transform:rotate(-4deg) scale(.97)}}
.friends-cameo-note{position:absolute;right:88px;bottom:32px;max-width:min(250px,calc(100vw - 120px));padding:10px 13px;border:1px solid #74526a;border-radius:16px 16px 4px 16px;background:#251a29f2;color:#fff2e7;font:600 11px 'DM Sans',sans-serif;box-shadow:0 10px 25px #07040999;animation:friends-note-in .25s ease both;pointer-events:none}
.friends-cameo-note[hidden]{display:none}
@keyframes friends-note-in{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px), (min-width:761px){body[data-theme="central-perk"]::before{background-position:10px 18px;background-size:400px auto;opacity:.085}.friends-door-cameo{right:10px;bottom:88px;width:48px;height:55px}.friends-cameo-frame{border-width:3px;border-radius:10px}.friends-cup{font-size:19px}.friends-cameo-frame small{font-size:4px}.friends-cameo-note{right:68px;bottom:94px;max-width:calc(100vw - 95px)}}
@media(prefers-reduced-motion:reduce){body[data-theme="central-perk"] .hero-art:after,.friends-cup{animation:none}.friends-door-cameo,.friends-cameo-frame{transition:none}.friends-cameo-pop .friends-cameo-frame{animation:none}}

/* Friends world: episode scenes, Central Perk companion, and cosmetic discoveries. */
body[data-theme="central-perk"] .topbar,body[data-theme="central-perk"] .bottom-nav,body[data-theme="central-perk"] .hero,body[data-theme="central-perk"] .item-card,body[data-theme="central-perk"] .activity-card,body[data-theme="central-perk"] .community-card,body[data-theme="central-perk"] .profile-card,body[data-theme="central-perk"] .profile-feature-panel,body[data-theme="central-perk"] .theme-panel,body[data-theme="central-perk"] .help-card,body[data-theme="central-perk"] dialog{transition:background-color .42s ease,border-color .42s ease,color .42s ease,box-shadow .42s ease}
body[data-theme="central-perk"] .hero[data-friends-slide="couch"]{background:radial-gradient(ellipse at 78% 46%,#f5c45a24,transparent 28%),linear-gradient(125deg,#33233a,#4b2d44 55%,#302139)}
body[data-theme="central-perk"] .hero[data-friends-slide="market"]{background:radial-gradient(ellipse at 80% 20%,#e39b6c22,transparent 30%),linear-gradient(130deg,#2a2031,#3b2b39 58%,#241a29)}
body[data-theme="central-perk"] .hero[data-friends-slide="teams"],body[data-theme="central-perk"] .hero[data-friends-slide="skills"]{background:radial-gradient(ellipse at 78% 48%,#8bb6d522,transparent 28%),linear-gradient(125deg,#282033,#322b41 60%,#241a29)}
body[data-theme="central-perk"] .hero[data-friends-slide="opportunities"]{background:radial-gradient(ellipse at 78% 48%,#f3ca6230,transparent 30%),linear-gradient(125deg,#33233a,#3d2c3b 57%,#241a29)}
body[data-theme="central-perk"] .hero-art #hero-icon{cursor:pointer;user-select:none;filter:drop-shadow(0 18px 17px #10081799);transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s}
body[data-theme="central-perk"] .hero-art #hero-icon:hover,body[data-theme="central-perk"] .hero-art #hero-icon:focus-visible{transform:translateY(-8px) rotate(-5deg) scale(1.1);filter:drop-shadow(0 22px 21px #100817bb);outline:0}
body[data-theme="central-perk"] .hero-art #hero-icon.friends-couch-reaction{animation:friends-couch-bounce .65s cubic-bezier(.2,.8,.2,1)}
@keyframes friends-couch-bounce{35%{transform:translateY(-13px) rotate(5deg) scale(1.09)}68%{transform:translateY(3px) rotate(-3deg) scale(.97)}}
body[data-theme="central-perk"] .hero.friends-couch-scene:after{content:"✦ saved you a seat ✦";position:absolute;right:8%;bottom:12%;color:#f3ca62;font-size:11px;font-weight:800;letter-spacing:.16em;animation:friends-scene-whisper .95s ease both;pointer-events:none}
@keyframes friends-scene-whisper{0%{opacity:0;translate:0 8px}20%,75%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -4px}}
body[data-theme="central-perk"] .item-card{padding:6px;background:#fff4e5;border-color:#f0d7c2;box-shadow:0 8px 25px #09040b55;rotate:-.25deg}
body[data-theme="central-perk"] .item-card:nth-child(even){rotate:.35deg}
body[data-theme="central-perk"] .item-card:hover{translate:0 -5px;rotate:0deg;box-shadow:0 18px 30px #09040b88,0 0 0 2px #f3ca6233}
body[data-theme="central-perk"] .item-image{height:178px;border-radius:15px;background:linear-gradient(135deg,#e4d7db,#f6e5d3)!important}
body[data-theme="central-perk"] .item-info{padding:14px 12px 12px;background:#fff4e5;color:#332638}
body[data-theme="central-perk"] .item-title{color:#332638}
body[data-theme="central-perk"] .item-meta,body[data-theme="central-perk"] .owner-row{color:#806c70}
body[data-theme="central-perk"] .owner-row{border-color:#ead7cb}
body[data-theme="central-perk"] .condition{background:#fffaf0;color:#3f654c;box-shadow:0 2px 9px #3b1c291c}
body[data-theme="central-perk"] .favorite{background:#fffaf0;color:#9a5368}
body[data-theme="central-perk"] .activity-card{position:relative;overflow:hidden;border:1px solid #edd9c7;border-radius:17px;background:linear-gradient(145deg,#fff5e7,#f6e7d8);color:#35273a;box-shadow:0 8px 20px #08040b44;rotate:-.12deg}
body[data-theme="central-perk"] .activity-card:nth-child(even){rotate:.17deg}
body[data-theme="central-perk"] .activity-card:before{content:"";position:absolute;top:0;left:18px;width:54px;height:10px;border-radius:0 0 6px 6px;background:#e6bd63aa;opacity:.7}
body[data-theme="central-perk"] .activity-main b{color:#35273a}
body[data-theme="central-perk"] .activity-main p{color:#75646b}
body[data-theme="central-perk"] .activity-main small{color:#917e82}
body[data-theme="central-perk"] .activity-actions{border-color:#e9d7cc}
body[data-theme="central-perk"] .activity-actions button,body[data-theme="central-perk"] .activity-card .outline-button{border-color:#dfcbbd;background:#fffaf3;color:#694c5b}
body[data-theme="central-perk"] .status-pill{background:#f1e5cf;color:#72532f}
body[data-theme="central-perk"] .status-pill.done,body[data-theme="central-perk"] .status-pill.status-completed{background:#dcebdc;color:#315e42}
body[data-theme="central-perk"] .status-pill.status-pending,body[data-theme="central-perk"] .status-pill.status-approved{background:#f7df9c;color:#62481b}
body[data-theme="central-perk"] .status-pill.status-declined{background:#f2d5d5;color:#804344}
body[data-theme="central-perk"] .activity-select input:checked+span{border-color:#c8834c;background:#c8834c}
body[data-theme="central-perk"] .activity-toolbar{color:#d7c1c9}
body[data-theme="central-perk"] .community-tabs .tab.active{color:#352638;border-color:#f3ca62;background:linear-gradient(120deg,#f3ca62,#e9a86b);border-radius:999px;padding:9px 14px;box-shadow:0 6px 16px #e5ae5b2e}
body[data-theme="central-perk"] .community-toolbar{padding:13px 15px;border:1px solid #4a364b;border-radius:18px;background:linear-gradient(110deg,#2a2031,#33233a);color:#ddcbd2}
body[data-theme="central-perk"] #screen-content[data-friends-board="skills"] .community-card{background:linear-gradient(145deg,#f4eafa,#ece2f4);border-color:#d9c4e6}
body[data-theme="central-perk"] #screen-content[data-friends-board="teams"] .community-card{background:linear-gradient(145deg,#fff0e6,#f5dfd7);border-color:#e8c7b8}
body[data-theme="central-perk"] #screen-content[data-friends-board="market"] .community-card{background:linear-gradient(145deg,#fff5e6,#f4e8d5);border-color:#ebd8ba}
body[data-theme="central-perk"] #screen-content[data-friends-board="opportunities"] .community-card{background:linear-gradient(145deg,#e9f0f5,#dde8ef);border-color:#c4d4df}
body[data-theme="central-perk"] .community-card h3{color:#34273b}
body[data-theme="central-perk"] .community-card p,body[data-theme="central-perk"] .community-meta{color:#75666e}
body[data-theme="central-perk"] .community-tag{background:#fff9ef;color:#704b5c;border-color:#e8d6c8}
body[data-theme="central-perk"] .community-format{color:#70576a}
body[data-theme="central-perk"] .map-legend{color:#d9cbd2}
body[data-theme="central-perk"] .campus-map{border:5px solid #fff3df;box-shadow:0 0 0 1px #b87b6780,0 18px 42px #07040b77}
body[data-theme="central-perk"] .map-pin{animation:friends-pin-arrive .5s cubic-bezier(.2,.8,.2,1) both}
body[data-theme="central-perk"] .map-pin:nth-of-type(2n){animation-delay:.08s}
@keyframes friends-pin-arrive{from{opacity:0;scale:.7}to{opacity:1;scale:1}}
body[data-theme="central-perk"] .profile-card{background:linear-gradient(135deg,#fff4e5,#f6e5d7);border-color:#ead2bc;color:#352638}
body[data-theme="central-perk"] .profile-identity h2{color:#352638}
body[data-theme="central-perk"] .profile-identity p,body[data-theme="central-perk"] .profile-identity small{color:#75666e}
body[data-theme="central-perk"] .stat-grid>article{background:linear-gradient(145deg,#36253c,#2b2031);border-color:#59435a}
body[data-theme="central-perk"] .stat-grid>article span,body[data-theme="central-perk"] .stat-grid>article b{color:#f4c66a}
body[data-theme="central-perk"] .stat-grid>article small{color:#d4c1c9}
body[data-theme="central-perk"] .profile-feature-panel{background:linear-gradient(140deg,#2b2032,#251b2b);border-color:#49354c}
body[data-theme="central-perk"] .profile-avatar{outline:5px solid #f3ca62;border:3px solid #fff5e6;box-shadow:0 4px 18px #0a061055}
body[data-theme="central-perk"] .profile-feature-tile{min-height:110px}
body[data-theme="central-perk"] .theme-panel{background:linear-gradient(145deg,#2a2031,#251b2a);border-color:#49354c}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]{border-color:#f3ca62;box-shadow:inset 0 0 0 1px #f3ca62,0 0 24px #f3ca6220}
body[data-theme="central-perk"] dialog.modal{transform-origin:50% 86%;animation:friends-scene-open .35s cubic-bezier(.2,.8,.2,1) both}
body[data-theme="central-perk"] dialog::backdrop{background:#140d18b8;backdrop-filter:blur(7px)}
body[data-theme="central-perk"] dialog.listing-modal{border:1px solid #79596d;background:linear-gradient(150deg,#2b2031,#211824);color:#fff5ea}
body[data-theme="central-perk"] .photo-preview{animation:friends-photo-pin .38s cubic-bezier(.2,.8,.2,1) both}
@keyframes friends-scene-open{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes friends-photo-pin{0%{opacity:0;transform:rotate(-4deg) scale(.9)}75%{transform:rotate(2deg) scale(1.02)}100%{opacity:1;transform:rotate(0) scale(1)}}
.friends-theme-effects{z-index:7}
.friends-door-cameo{bottom:25px;width:64px;height:72px;filter:drop-shadow(0 7px 12px #09050b88)}
.friends-cameo-frame{border-width:5px;border-radius:14px 14px 11px 11px;background:linear-gradient(145deg,#654257,#34243a);box-shadow:inset 0 0 0 2px #fff2,0 0 0 1px #4d374e,0 0 21px #f3ca6218}
.friends-cameo-frame:after{content:"";position:absolute;inset:4px;border:1px solid #f3ca6244;border-radius:7px 7px 5px 5px;pointer-events:none}
.friends-door-cameo:after{content:"The One with the Coffee";position:absolute;right:0;bottom:calc(100% + 8px);width:max-content;padding:6px 9px;border:1px solid #77596b;border-radius:10px;background:#211824;color:#fff2e7;font:600 10px 'DM Sans',sans-serif;opacity:0;translate:0 4px;transition:opacity .18s,translate .18s;pointer-events:none}
.friends-door-cameo:hover:after,.friends-door-cameo:focus-visible:after{opacity:1;translate:0 0}
.friends-perk-panel{position:absolute;right:20px;bottom:108px;width:min(365px,calc(100vw - 28px));max-height:min(680px,calc(100dvh - 155px));overflow:auto;padding:18px;border:1px solid #76536b;border-radius:25px;background:radial-gradient(ellipse at 85% 0,#e99b5a23,transparent 32%),linear-gradient(145deg,#302239f7,#201823f8);color:#fff4e8;box-shadow:0 24px 72px #09050cbb,inset 0 1px #fff2;backdrop-filter:blur(20px);pointer-events:auto;overscroll-behavior:contain;animation:friends-scene-open .28s cubic-bezier(.2,.8,.2,1) both}
.friends-perk-panel[hidden]{display:none}
.friends-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.friends-panel-heading h2{margin:4px 0 0;color:#fff4e8;font:800 24px Manrope,sans-serif;letter-spacing:-.8px}
.friends-panel-kicker,.friends-recommend-card>span{color:#f3ca62;font:800 9px 'JetBrains Mono',monospace;letter-spacing:.12em}
.friends-panel-close{width:31px;height:31px;border:1px solid #684d63;border-radius:50%;background:#392a3d;color:#fff1e5;font-size:20px;cursor:pointer}
.friends-panel-welcome{margin:8px 0 14px;color:#d7c7ce;font-size:12px}
.friends-quote-card,.friends-recommend-card{padding:12px;border:1px solid #62495f;border-radius:17px;background:#3a293b88}
.friends-quote-voice{color:#f3ca62;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.friends-quote-line{min-height:32px;margin:5px 0 9px;color:#fff5eb;font:700 14px/1.4 Manrope,sans-serif}
.friends-perk-panel button:not(.friends-panel-close):not(.friends-door-cameo){font-family:'DM Sans',sans-serif}
.friends-quote-card button,.friends-recommend-card button{margin:3px 5px 0 0;padding:7px 10px;border:1px solid #735766;border-radius:999px;background:#2b2031;color:#f7e9e0;font-size:10px;font-weight:700;cursor:pointer;transition:transform .18s,background .18s}
.friends-quote-card button:hover,.friends-recommend-card button:hover{transform:translateY(-2px);background:#493348}
.friends-recommend-card{margin-top:9px;background:linear-gradient(115deg,#382943,#3b2a35)}
.friends-recommend-card p{margin:5px 0 8px;color:#fff0e4;font-size:12px;font-weight:700}
.friends-recommend-card [data-friends-action="item"]{background:#f2c562;color:#352336;border-color:#f2c562}
.friends-shortcuts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:10px 0}
.friends-shortcuts button{min-height:36px;border:1px solid #60475e;border-radius:13px;background:#251b2a;color:#eadce0;font-size:10px;font-weight:700;cursor:pointer;transition:transform .18s,border-color .18s}
.friends-shortcuts button:hover{transform:translateY(-2px);border-color:#f3ca62;color:#f3ca62}
.friends-door-row{display:flex;align-items:center;gap:11px;margin-top:7px;padding:10px;border:1px solid #594259;border-radius:16px;background:#281e2d}
.friends-purple-door{position:relative;display:grid;align-content:end;justify-items:center;gap:3px;width:47px;height:57px;padding:4px 2px;border:3px solid #b28b61;border-radius:8px 8px 3px 3px;background:linear-gradient(145deg,#805473,#4e355d);box-shadow:inset 0 0 0 2px #fff2;cursor:pointer;transform-origin:left center;transition:transform .35s,filter .25s}
.friends-door-knob{position:absolute;right:5px;top:26px;width:5px;height:5px;border-radius:50%;background:#f2ca67;box-shadow:0 0 9px #f3ca62}
.friends-purple-door small{color:#fff2d1;font:700 5px 'JetBrains Mono',monospace;white-space:nowrap}
.friends-door-copy{margin:0;color:#dccbd1;font-size:10px;line-height:1.5}
.friends-door-open{transform:perspective(180px) rotateY(-30deg);filter:brightness(1.3)}
.friends-secret-shelf{margin-top:11px;padding:12px;border:1px dashed #806477;border-radius:17px;background:#211824a8}
.friends-secret-shelf[hidden],.friends-secret-button[hidden]{display:none}
.friends-secret-reveal{animation:friends-secret-show .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes friends-secret-show{from{opacity:0;transform:translateY(9px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.friends-personalities{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin-top:9px}
.friends-personalities button{display:grid;justify-items:center;gap:3px;padding:7px 2px;border:1px solid #5c465a;border-radius:12px;background:#302239;color:#f7eee7;cursor:pointer}
.friends-personalities button span{font-size:18px}
.friends-personalities button b{font-size:8px}
.friends-character-pop{animation:friends-character-pop .35s ease}
@keyframes friends-character-pop{50%{transform:translateY(-4px) scale(1.06)}}
.friends-character-note{min-height:16px;margin:8px 0 0;color:#f2ca70;font-size:10px}
.friends-replay-intro,.friends-secret-button{width:100%;margin-top:10px;padding:9px 12px;border:1px solid #6d5065;border-radius:14px;background:#2b2031;color:#f6e8de;font-size:10px;font-weight:700;cursor:pointer}
.friends-secret-button{background:linear-gradient(110deg,#f2c562,#e7a26b);border-color:#f2c562;color:#34243a}
.friends-cup-spin{animation:friends-cup-spin .48s cubic-bezier(.2,.8,.2,1)}
@keyframes friends-cup-spin{50%{transform:rotate(-16deg) scale(1.12)}}
.friends-cameo-note{z-index:2;right:94px;bottom:35px;max-width:min(300px,calc(100vw - 125px));border-color:#856277;background:#261b2af5;color:#fff4e8;line-height:1.45}
.friends-episode-caption{position:absolute;top:83px;left:50%;z-index:2;max-width:calc(100vw - 32px);padding:8px 14px;border:1px solid #79596b;border-radius:999px;background:#271c2bf2;color:#f6d27c;font:700 10px 'DM Sans',sans-serif;box-shadow:0 7px 22px #08040b77;translate:-50% -5px;opacity:0;pointer-events:none;white-space:nowrap}
.friends-episode-caption[hidden]{display:none}
.friends-caption-arrive{animation:friends-caption 1.9s ease both}
@keyframes friends-caption{0%{opacity:0;translate:-50% -8px}12%,72%{opacity:1;translate:-50% 0}100%{opacity:0;translate:-50% -5px}}
.friends-theme-intro{position:fixed;inset:0;z-index:30;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 48%,#c57c48a8 0,#52334dce 26%,#17111bfa 72%);animation:friends-intro-backdrop 2.65s ease both;pointer-events:none}
.friends-theme-intro:before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 50% 50%,#f2c45c2b,transparent 22%);animation:friends-amber-wave 2.5s ease both}
.friends-intro-scene{position:relative;display:grid;justify-items:center;gap:9px;width:min(440px,calc(100vw - 44px));padding:34px 24px;border:1px solid #e7c57788;border-radius:30px;background:linear-gradient(145deg,#32243af0,#211824f0);box-shadow:0 30px 90px #09050c99,inset 0 1px #fff3;text-align:center;animation:friends-cup-arrive 2.45s cubic-bezier(.2,.8,.2,1) both}
.friends-intro-label{color:#f3ca62;font:800 9px 'JetBrains Mono',monospace;letter-spacing:.18em;animation:friends-fade-up .4s .08s both}
.friends-intro-cup{font-size:64px;line-height:1;filter:drop-shadow(0 10px 16px #f2a25d55);animation:friends-intro-steam 1.2s .12s ease-in-out 2 both}
.friends-intro-dots{display:flex;gap:11px;margin:5px 0 3px}
.friends-intro-dots i{width:9px;height:9px;border-radius:50%;background:#f3ca62;box-shadow:0 0 12px currentColor;opacity:0;animation:friends-dot-pop .28s ease forwards}
.friends-intro-dots i:nth-child(2),.friends-wordmark-dots i:nth-child(2){animation-delay:.16s;background:#d65a5a}
.friends-intro-dots i:nth-child(3){animation-delay:.3s;background:#78a9c8}
.friends-intro-dots i:nth-child(4){animation-delay:.44s;background:#f3ca62}
.friends-intro-dots i:nth-child(5){animation-delay:.58s;background:#d65a5a}
.friends-intro-dots i:nth-child(6){animation-delay:.72s;background:#78a9c8}
.friends-intro-scene strong{color:#fff4e8;font:800 clamp(16px,4vw,20px) Manrope,sans-serif;animation:friends-fade-up .4s .4s both}
.friends-intro-scene small{color:#d5c1ca;font-size:11px;animation:friends-fade-up .4s .55s both}
.friends-intro-skip{position:absolute;top:max(18px,env(safe-area-inset-top));right:18px;z-index:2;padding:8px 12px;border:1px solid #f1dfc488;border-radius:999px;background:#211824cc;color:#fff5ea;font:700 11px 'DM Sans',sans-serif;cursor:pointer;pointer-events:auto}
.friends-intro-fade{animation:friends-intro-out .32s ease both}
@keyframes friends-intro-backdrop{0%,15%{opacity:1}82%{opacity:.96}100%{opacity:0}}
@keyframes friends-intro-out{to{opacity:0}}
@keyframes friends-amber-wave{0%{opacity:0;scale:.25}30%{opacity:1;scale:1}100%{opacity:.1;scale:1.7}}
@keyframes friends-cup-arrive{0%{opacity:0;transform:translateY(16px) scale(.8)}20%,72%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-5px) scale(1.02)}}
@keyframes friends-intro-steam{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-6px) rotate(4deg)}}
@keyframes friends-dot-pop{from{opacity:0;scale:.2}to{opacity:1;scale:1}}
@keyframes friends-fade-up{from{opacity:0;translate:0 7px}to{opacity:1;translate:0 0}}
@keyframes friends-light-up{0%{filter:brightness(.35)}25%{filter:brightness(.55)}75%,100%{filter:brightness(1)}}
body.friends-theme-transitioning .app-shell{animation:friends-light-up 2.3s ease both}
.friends-achievements{display:flex;align-items:center;gap:20px;margin:14px 0 20px;padding:16px;border:1px solid #71556a;border-radius:22px;background:linear-gradient(130deg,#2a2031,#38283a);color:#fff4e8}
.friends-achievements[hidden]{display:none}
.friends-achievements-heading{flex:0 0 30%}
.friends-achievements-heading h3{margin:5px 0;color:#fff4e8;font:750 16px Manrope,sans-serif}
.friends-achievements-heading p{margin:0;color:#d0bdc5;font-size:10px;line-height:1.45}
.friends-achievement-list{display:flex;flex:1;flex-wrap:wrap;gap:7px}
.friends-achievement-badge{display:flex;align-items:center;gap:6px;max-width:100%;padding:8px 10px;border:1px solid #826c61;border-radius:999px;background:#3d2b3e;color:#f5e8df;font-size:9px;text-align:left;cursor:pointer;transition:transform .18s,border-color .18s}
.friends-achievement-badge:hover{transform:translateY(-2px);border-color:#f3ca62}
.friends-achievement-badge span{color:#f3ca62}
.friends-achievement-empty{margin:0;color:#d0bdc5;font-size:10px}
.friends-achievement-feedback{flex-basis:100%;margin:0;padding-top:7px;border-top:1px solid #5c465a;color:#f3ca62;font-size:10px}
.friends-achievement-feedback[hidden]{display:none}
#screen-content.friends-page-enter[data-friends-scene="explore"] .hero,#screen-content.friends-page-enter[data-friends-scene="profile"] .profile-card,#screen-content.friends-page-enter[data-friends-scene="activity"] .activity-card,#screen-content.friends-page-enter[data-friends-scene="community"] .community-card{animation:friends-page-in .42s cubic-bezier(.2,.8,.2,1) both}
#screen-content.friends-page-enter[data-friends-scene="activity"] .activity-card:nth-child(2n),#screen-content.friends-page-enter[data-friends-scene="community"] .community-card:nth-child(2n){animation-delay:.06s}
#screen-content.friends-page-enter[data-friends-scene="map"] .campus-map{animation:friends-map-arrive .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes friends-page-in{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes friends-map-arrive{from{opacity:0;clip-path:inset(5% 3% round 24px)}to{opacity:1;clip-path:inset(0 round 18px)}}
body[data-theme="central-perk"] .bottom-nav .nav-item.selected{color:#f3ca62}
body[data-theme="central-perk"] .bottom-nav .nav-item.selected:before{background:#f3ca62}
body[data-theme="central-perk"] .nav-item.selected span{animation:friends-nav-tap .35s cubic-bezier(.2,.8,.2,1)}
@keyframes friends-nav-tap{40%{transform:translateY(-4px) scale(1.14)}100%{transform:translateY(0) scale(1)}}
@media(max-width:760px), (min-width:761px){.friends-door-cameo{right:9px;bottom:calc(90px + env(safe-area-inset-bottom));width:49px;height:57px}.friends-cameo-frame{border-width:4px}.friends-cup{font-size:19px}.friends-cameo-frame small{font-size:4px}.friends-perk-panel{right:10px;bottom:calc(149px + env(safe-area-inset-bottom));width:min(365px,calc(100vw - 20px));max-height:calc(100dvh - 188px - env(safe-area-inset-bottom));padding:15px;border-radius:23px}.friends-cameo-note{right:65px;bottom:calc(103px + env(safe-area-inset-bottom));max-width:calc(100vw - 85px)}.friends-episode-caption{top:70px;max-width:calc(100vw - 24px);font-size:9px}.friends-achievements{align-items:flex-start;flex-direction:column;gap:11px}.friends-achievements-heading{flex-basis:auto}.friends-achievement-list{width:100%}.friends-intro-scene{padding:27px 17px}.friends-personalities{grid-template-columns:repeat(3,minmax(0,1fr))}body[data-theme="central-perk"] .item-image{height:140px}}
@media(max-width:380px), (min-width:761px){.friends-perk-panel{padding:12px}.friends-panel-heading h2{font-size:21px}.friends-shortcuts button{font-size:9px}.friends-episode-caption{white-space:normal;text-align:center}.friends-achievement-badge{font-size:8px;padding:7px 8px}}
@media(prefers-reduced-motion:reduce){body.friends-theme-transitioning .app-shell,.friends-theme-intro,.friends-intro-scene,.friends-intro-cup,.friends-intro-label,.friends-intro-scene strong,.friends-intro-scene small,.friends-intro-dots i,.friends-page-enter,.friends-page-enter .hero,.friends-page-enter .profile-card,.friends-page-enter .activity-card,.friends-page-enter .community-card,.friends-page-enter .campus-map,.friends-couch-reaction,.friends-cup-spin,.friends-door-open,.friends-secret-reveal,.friends-character-pop{animation:none!important;transition:none!important}body[data-theme="central-perk"] .nav-item.selected span{animation:none}}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]{position:relative;overflow:hidden;border-color:#72556a;background:linear-gradient(110deg,#2a2031,#35263a);color:#fff3e8}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"] .theme-option-label small{color:#d4c1ca}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"] .theme-swatch{box-shadow:0 0 0 2px #f3ca6244,0 0 16px #f3ca6233;transition:box-shadow .25s,transform .25s}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]:hover .theme-swatch,body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]:focus-visible .theme-swatch{transform:rotate(-12deg) scale(1.08);box-shadow:0 0 0 3px #f3ca6277,0 0 24px #f3ca6266}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]:after{content:"☕ Central Perk is ready";position:absolute;right:12px;bottom:3px;color:#f3ca62;font:600 8px 'DM Sans',sans-serif;opacity:0;translate:0 3px;transition:opacity .18s,translate .18s;pointer-events:none}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]:hover:after,body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]:focus-visible:after{opacity:1;translate:0 0}
body[data-theme="central-perk"] .profile-card{transition:transform .24s,box-shadow .24s,background-color .4s,border-color .4s}
body[data-theme="central-perk"] .profile-card:hover{transform:translateY(-3px) rotate(-.15deg);box-shadow:0 14px 32px #09050c55}
body[data-theme="central-perk"] .stat-grid>article{transition:transform .2s,box-shadow .2s}
body[data-theme="central-perk"] .stat-grid>article:hover{transform:translateY(-3px);box-shadow:0 12px 24px #09050c55}
body[data-theme="central-perk"] .friends-achievement-badge:focus-visible,body[data-theme="central-perk"] .friends-personalities button:focus-visible,body[data-theme="central-perk"] .friends-perk-panel button:focus-visible{outline:2px solid #f3ca62;outline-offset:2px}
body[data-theme="central-perk"] .activity-card{transition:transform .22s,box-shadow .22s,border-color .22s}
body[data-theme="central-perk"] .activity-card:hover{transform:translateY(-2px) rotate(0);box-shadow:0 13px 27px #08040b66}
body[data-theme="central-perk"] .community-tabs .tab{transition:color .2s,background .2s,transform .2s,border-color .2s}
body[data-theme="central-perk"] .community-tabs .tab:hover{transform:translateY(-2px);color:#f3ca62}
body[data-theme="central-perk"] .community-card{transition:transform .22s,box-shadow .22s,border-color .22s}
body[data-theme="central-perk"] .community-card:hover{transform:translateY(-3px);box-shadow:0 12px 27px #08040b55}
body[data-theme="central-perk"] .campus-map{background-color:#e9efe3!important;color:#243025;filter:none!important}
body[data-theme="central-perk"] .campus-map .maplibregl-canvas{filter:none!important}
body[data-theme="central-perk"] .item-detail-modal .detail-emoji{border-radius:22px;box-shadow:0 12px 30px #130b1544}
body[data-theme="central-perk"] .item-card .item-image img{object-fit:cover;object-position:center;border-radius:15px}
body[data-theme="central-perk"] .item-card .item-image img[style*="object-fit: contain"]{object-fit:contain}
body[data-theme="central-perk"] .listing-modal .pickup-section{padding:12px;border:1px solid #644a60;border-radius:17px;background:#21182488}
body[data-theme="central-perk"] .listing-modal .pickup-map{height:190px;min-height:190px;max-height:190px;border:3px solid #fff2e2;border-radius:15px;overflow:hidden;position:relative}
body[data-theme="central-perk"] .listing-modal .photo-preview{border:5px solid #fff4e5;border-radius:8px;box-shadow:0 12px 24px #09050c66}
body[data-theme="central-perk"] .friends-achievement-badge{animation:friends-badge-arrive .32s cubic-bezier(.2,.8,.2,1) both}
@keyframes friends-badge-arrive{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"],body[data-theme="central-perk"] .profile-card,body[data-theme="central-perk"] .stat-grid>article,body[data-theme="central-perk"] .activity-card,body[data-theme="central-perk"] .community-tabs .tab,body[data-theme="central-perk"] .community-card,body[data-theme="central-perk"] .friends-achievement-badge{transition:none!important;animation:none!important}}

/* Friends theme preview remains discoverable before the theme is selected. */
.theme-option[data-theme-choice="central-perk"]{position:relative;overflow:hidden}
.theme-option[data-theme-choice="central-perk"] .theme-swatch{transition:transform .24s ease,box-shadow .24s ease}
.theme-option[data-theme-choice="central-perk"]:hover,.theme-option[data-theme-choice="central-perk"]:focus-visible{border-color:#f3ca62;box-shadow:0 8px 24px #6a3d5b2c}
.theme-option[data-theme-choice="central-perk"]:hover .theme-swatch,.theme-option[data-theme-choice="central-perk"]:focus-visible .theme-swatch{transform:rotate(-10deg) scale(1.08);box-shadow:0 0 0 3px #f3ca6277,0 0 20px #f3ca6255}
.theme-option[data-theme-choice="central-perk"]:after{content:"☕ Deep plum · warm amber";position:absolute;right:12px;bottom:3px;color:#8b5c3d;font:600 8px 'DM Sans',sans-serif;opacity:0;translate:0 3px;transition:opacity .18s,translate .18s;pointer-events:none}
.theme-option[data-theme-choice="central-perk"]:hover:after,.theme-option[data-theme-choice="central-perk"]:focus-visible:after{opacity:1;translate:0 0}
body[data-theme="central-perk"] .theme-option[data-theme-choice="central-perk"]:after{color:#f3ca62}
@keyframes friends-share-pop{0%{filter:brightness(1);box-shadow:0 0 0 0 #f3ca6200}38%{filter:brightness(1.13);box-shadow:0 0 0 5px #f3ca6244}100%{filter:brightness(1);box-shadow:0 0 0 0 #f3ca6200}}
body[data-theme="central-perk"] .friends-share-success{animation:friends-share-pop .8s ease-out both}
.community-toolbar.friends-note-pop{position:relative;overflow:visible}
.community-toolbar.friends-note-pop:after{content:"♫";position:absolute;right:30%;top:50%;z-index:2;color:#f3ca62;font-size:22px;font-weight:800;pointer-events:none;animation:friends-note-flight 1.6s ease-out both}
@keyframes friends-note-flight{0%{opacity:0;transform:translate(0,8px) rotate(-12deg) scale(.65)}20%{opacity:1}100%{opacity:0;transform:translate(28px,-38px) rotate(14deg) scale(1.2)}}
.friends-theme-intro:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,#fff0be99 0 1px,transparent 1.7px),radial-gradient(circle,#f1a86799 0 1px,transparent 1.8px),radial-gradient(circle,#fff8df77 0 1px,transparent 1.7px);background-size:83px 97px,127px 119px,173px 149px;background-position:10px 20px,57px 31px,30px 70px;opacity:0;animation:friends-particle-drift 2.65s ease-out both;pointer-events:none}
@keyframes friends-particle-drift{15%{opacity:.44}80%{opacity:.3}100%{opacity:0;transform:translateY(-14px)}}
@media(prefers-reduced-motion:reduce){.theme-option[data-theme-choice="central-perk"]:after,.theme-option[data-theme-choice="central-perk"] .theme-swatch{transition:none}.friends-share-success,.community-toolbar.friends-note-pop:after,.friends-theme-intro:after{animation:none!important}}

/* Big, visible scene changes between Borrowed sections in Friends mode. */
#screen-content.friends-page-enter[data-friends-scene="explore"]{animation:friends-scene-left .62s cubic-bezier(.18,.75,.25,1) both}
#screen-content.friends-page-enter[data-friends-scene="activity"]{animation:friends-scene-right .62s cubic-bezier(.18,.75,.25,1) both}
#screen-content.friends-page-enter[data-friends-scene="community"]{animation:friends-scene-up .62s cubic-bezier(.18,.75,.25,1) both}
#screen-content.friends-page-enter[data-friends-scene="map"]{animation:friends-scene-map .68s cubic-bezier(.18,.75,.25,1) both}
#screen-content.friends-page-enter[data-friends-scene="profile"]{animation:friends-scene-scrapbook .66s cubic-bezier(.18,.75,.25,1) both}
#screen-content.friends-page-enter[data-friends-scene="notifications"]{animation:friends-scene-right .62s cubic-bezier(.18,.75,.25,1) both}
@keyframes friends-scene-left{0%{opacity:0;filter:blur(5px);transform:translate3d(-48px,0,0) scale(.99)}65%{opacity:1;filter:blur(0);transform:translate3d(5px,0,0)}100%{opacity:1;transform:none}}
@keyframes friends-scene-right{0%{opacity:0;filter:blur(5px);transform:translate3d(48px,0,0) scale(.99)}65%{opacity:1;filter:blur(0);transform:translate3d(-5px,0,0)}100%{opacity:1;transform:none}}
@keyframes friends-scene-up{0%{opacity:0;filter:blur(5px);transform:translate3d(0,34px,0) scale(.985)}65%{opacity:1;filter:blur(0);transform:translate3d(0,-4px,0)}100%{opacity:1;transform:none}}
@keyframes friends-scene-map{0%{opacity:0;filter:blur(7px);transform:perspective(900px) rotateX(5deg) scale(.94)}75%{opacity:1;filter:blur(0);transform:perspective(900px) rotateX(-.5deg) scale(1.005)}100%{opacity:1;transform:none}}
@keyframes friends-scene-scrapbook{0%{opacity:0;filter:blur(5px);transform:rotate(-1.1deg) scale(.96)}70%{opacity:1;filter:blur(0);transform:rotate(.25deg) scale(1.005)}100%{opacity:1;transform:none}}

/* A chibi character follows the current page and opens a tiny playable game. */
.friends-page-pal{position:fixed;left:16px;bottom:calc(104px + env(safe-area-inset-bottom));z-index:7;pointer-events:none}
.friends-pal-trigger{position:relative;display:grid;justify-items:center;gap:0;width:84px;padding:4px 5px 7px;border:1px solid color-mix(in srgb,var(--pal-accent) 48%,#fff);border-radius:24px;background:linear-gradient(150deg,#fffef6f2,#fff9e8ed);color:#302335;box-shadow:0 8px 24px #130a1c2a;cursor:pointer;pointer-events:auto;animation:friends-chibi-idle 3.2s ease-in-out infinite}
.friends-pal-art{display:block;width:63px;height:72px;filter:drop-shadow(0 5px 3px #21142c22)}
.friends-pal-art svg{width:100%;height:100%;overflow:visible}
.friends-pal-name{font:800 10px Manrope,sans-serif;color:#382840}
.friends-pal-hint{font:700 8px 'DM Sans',sans-serif;color:#806980;text-transform:uppercase;letter-spacing:.09em}
@keyframes friends-chibi-idle{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}
.friends-pal-panel{position:absolute;left:0;bottom:101px;width:min(310px,calc(100vw - 28px));padding:19px;border:1px solid color-mix(in srgb,var(--pal-accent) 65%,white);border-radius:26px;background:radial-gradient(circle at 94% 5%,color-mix(in srgb,var(--pal-accent) 28%,transparent),transparent 36%),linear-gradient(150deg,#fffef8,#f5edf7);color:#34283c;box-shadow:0 18px 52px #140b1d55;pointer-events:auto;animation:friends-mini-open .3s cubic-bezier(.2,.8,.2,1) both}
.friends-pal-panel[hidden]{display:none}
@keyframes friends-mini-open{from{opacity:0;transform:translateY(12px) scale(.96);transform-origin:bottom left}to{opacity:1;transform:none}}
.friends-pal-close{position:absolute;top:9px;right:12px;width:29px;height:29px;border:0;border-radius:50%;background:#eee5ef;color:#4a3b4e;font-size:19px;cursor:pointer}
.friends-pal-kicker{color:#8c5d69;font:800 8px 'JetBrains Mono',monospace;letter-spacing:.14em}
.friends-pal-title{margin:7px 25px 4px 0;font:800 18px Manrope,sans-serif;color:#37263f}
.friends-pal-copy{min-height:18px;margin:0 0 11px;color:#746876;font-size:11px}
.friends-game-stats{display:flex;justify-content:space-between;margin:0 0 7px;color:#615466;font-size:10px}
.friends-game-stats b{color:#754f70}
.friends-game-stage{position:relative;height:103px;overflow:hidden;border:1px dashed #cbb6cc;border-radius:17px;background:radial-gradient(circle at 50% 50%,#fff,#f4edf5)}
.friends-game-start-label{position:absolute;inset:0;display:grid;place-items:center;padding:12px;color:#847889;font-size:10px;text-align:center;pointer-events:none}
.friends-game-target{position:absolute;z-index:1;width:38px;height:38px;border:1px solid #efd48a;border-radius:50%;background:#fff5ce;font-size:20px;box-shadow:0 5px 12px #6a4a6b25;cursor:pointer;animation:friends-bean-hop .55s ease-in-out infinite alternate}
.friends-game-target[hidden]{display:none}
@keyframes friends-bean-hop{to{transform:translateY(-4px) rotate(13deg) scale(1.08)}}
.friends-game-start{width:100%;margin-top:9px;padding:10px 12px;border:0;border-radius:999px;background:var(--pal-outfit);color:white;font:800 11px 'DM Sans',sans-serif;cursor:pointer}
.friends-game-start:disabled{opacity:.7;cursor:wait}
.friends-game-footnote{display:block;margin-top:8px;color:#938995;font-size:8px;text-align:center}
@media(max-width:760px), (min-width:761px){.friends-page-pal{left:8px;bottom:calc(96px + env(safe-area-inset-bottom))}.friends-pal-trigger{width:67px;padding:3px 4px 6px;border-radius:20px}.friends-pal-art{width:51px;height:58px}.friends-pal-name{font-size:9px}.friends-pal-hint{font-size:7px}.friends-pal-panel{bottom:83px;width:min(292px,calc(100vw - 20px));padding:15px}}
@media(prefers-reduced-motion:reduce){#screen-content.friends-page-enter[data-friends-scene],.friends-pal-trigger,.friends-pal-panel,.friends-game-target{animation:none!important;filter:none!important}}

/* Replace the bean clicker with a legible multi-page Friends keepsake hunt. */
#screen-content.friends-page-enter[data-friends-scene="explore"]{animation:friends-episode-left 1s cubic-bezier(.18,.82,.18,1) both}
#screen-content.friends-page-enter[data-friends-scene="activity"]{animation:friends-episode-right 1s cubic-bezier(.18,.82,.18,1) both}
#screen-content.friends-page-enter[data-friends-scene="community"]{animation:friends-episode-up 1s cubic-bezier(.18,.82,.18,1) both}
#screen-content.friends-page-enter[data-friends-scene="map"]{animation:friends-episode-map 1s cubic-bezier(.18,.82,.18,1) both}
#screen-content.friends-page-enter[data-friends-scene="profile"]{animation:friends-episode-scrapbook 1s cubic-bezier(.18,.82,.18,1) both}
#screen-content.friends-page-enter[data-friends-scene="notifications"]{animation:friends-episode-right 1s cubic-bezier(.18,.82,.18,1) both}
@keyframes friends-episode-left{0%{opacity:0;filter:blur(8px);transform:translate3d(-72px,0,0) scale(.975)}55%{opacity:1;filter:blur(0);transform:translate3d(5px,0,0) scale(1.002)}100%{opacity:1;transform:none}}
@keyframes friends-episode-right{0%{opacity:0;filter:blur(8px);transform:translate3d(72px,0,0) scale(.975)}55%{opacity:1;filter:blur(0);transform:translate3d(-5px,0,0) scale(1.002)}100%{opacity:1;transform:none}}
@keyframes friends-episode-up{0%{opacity:0;filter:blur(8px);transform:translate3d(0,52px,0) scale(.97)}55%{opacity:1;filter:blur(0);transform:translate3d(0,-5px,0) scale(1.006)}100%{opacity:1;transform:none}}
@keyframes friends-episode-map{0%{opacity:0;filter:blur(9px);transform:perspective(1000px) rotateX(9deg) scale(.92)}55%{opacity:1;filter:blur(0);transform:perspective(1000px) rotateX(-1deg) scale(1.015)}100%{opacity:1;transform:none}}
@keyframes friends-episode-scrapbook{0%{opacity:0;filter:blur(8px);transform:rotate(-1.8deg) scale(.94)}58%{opacity:1;filter:blur(0);transform:rotate(.45deg) scale(1.015)}100%{opacity:1;transform:none}}
.friends-scene-shift{position:fixed;inset:0;z-index:40;overflow:hidden;display:grid;place-items:center;pointer-events:none}
.friends-scene-shift:before,.friends-scene-shift:after{content:"";position:absolute;top:0;bottom:0;width:53%;background:linear-gradient(145deg,#26192bf9,#39253bf4 60%,#211724f9);box-shadow:0 0 55px #140a1c99;animation-duration:.92s;animation-timing-function:cubic-bezier(.7,0,.2,1);animation-fill-mode:both}
.friends-scene-shift:before{left:0;border-right:1px solid #f3ca6266;animation-name:friends-curtain-left}
.friends-scene-shift:after{right:0;border-left:1px solid #f3ca6266;animation-name:friends-curtain-right}
@keyframes friends-curtain-left{0%,8%{transform:translateX(-102%);opacity:0}25%,72%{transform:translateX(0);opacity:1}100%{transform:translateX(-102%);opacity:0}}
@keyframes friends-curtain-right{0%,8%{transform:translateX(102%);opacity:0}25%,72%{transform:translateX(0);opacity:1}100%{transform:translateX(102%);opacity:0}}
.friends-scene-title{position:relative;z-index:1;display:grid;justify-items:center;gap:9px;width:min(440px,calc(100vw - 38px));padding:25px 22px;border:1px solid #f3ca6277;border-radius:26px;background:#251a2af0;color:#fff7ed;text-align:center;box-shadow:0 20px 75px #100b16aa;opacity:0;transform:scale(.78) rotate(-2deg);animation:friends-scene-title .92s cubic-bezier(.16,.84,.25,1) both}
.friends-scene-title span{color:#f3ca62;font:800 9px 'JetBrains Mono',monospace;letter-spacing:.2em}
.friends-scene-title b{font:850 clamp(16px,4vw,23px) Manrope,sans-serif;letter-spacing:.025em}
.friends-scene-title i{color:#df9b69;font-style:normal;letter-spacing:.18em}
@keyframes friends-scene-title{22%{opacity:0;transform:scale(.78) rotate(-2deg)}37%,68%{opacity:1;transform:scale(1) rotate(0)}88%{opacity:0;transform:scale(1.08) rotate(1deg)}}
.friends-scene-exit{opacity:0;transition:opacity .25s ease}

.friends-page-pal{left:17px;bottom:calc(105px + env(safe-area-inset-bottom));z-index:9;pointer-events:none}
.friends-pal-trigger{width:126px;min-height:150px;gap:2px;padding:7px 8px 9px;border:1px solid #f3ca62;border-radius:27px;background:linear-gradient(160deg,#fffdf7,#f4e7da);color:#302135;box-shadow:0 10px 32px #160c1c55,0 0 0 4px #f3ca6228;pointer-events:auto;animation:friends-chibi-stage 3.2s ease-in-out infinite}
.friends-pal-art{display:block;width:106px;height:106px;border:1px solid #ba9872;border-radius:24px;background-color:#292132;background-image:url('assets/friends-cast-sheet.png');background-size:300% 200%;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px #fff5,0 8px 17px #2715262e;overflow:hidden}
.friends-pal-art[data-character="Rachel"]{background-position:0% 0%}.friends-pal-art[data-character="Monica"]{background-position:50% 0%}.friends-pal-art[data-character="Phoebe"]{background-position:100% 0%}.friends-pal-art[data-character="Joey"]{background-position:0% 100%}.friends-pal-art[data-character="Chandler"]{background-position:50% 100%}.friends-pal-art[data-character="Ross"]{background-position:100% 100%}
.friends-pal-name{color:#35233a;font:850 13px Manrope,sans-serif}
.friends-pal-hint{color:#855c69;font:800 8px 'DM Sans',sans-serif;letter-spacing:.12em}
@keyframes friends-chibi-stage{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}
.friends-pal-panel{left:0;bottom:calc(100% + 12px);width:min(370px,calc(100vw - 28px));max-height:min(590px,calc(100dvh - 185px));overflow:auto;padding:20px;border:1px solid #dfbb68;border-radius:28px;background:linear-gradient(145deg,#fffaf2,#f8ecdf);color:#302239;box-shadow:0 22px 64px #130b1c88,0 0 0 5px #f3ca6226;backdrop-filter:blur(18px);pointer-events:auto}
.friends-pal-panel[hidden]{display:none}
.friends-pal-close{top:12px;right:12px;background:#efe1e2!important;color:#482d3d!important;border:1px solid #e5c5be!important;width:34px;height:34px;font-size:23px;z-index:2}
.friends-pal-heading{display:flex;align-items:center;gap:14px;padding-right:22px}
.friends-pal-heading .friends-pal-art-large{flex:0 0 92px;width:92px;height:92px;border-radius:22px}
.friends-pal-kicker{display:block;color:#88536c;font:850 9px 'JetBrains Mono',monospace;letter-spacing:.11em;line-height:1.5}
.friends-pal-title{margin:5px 0 5px;color:#302239;font:850 22px/1.05 Manrope,sans-serif}
.friends-hunt-count{margin:0;color:#775c71;font:750 11px 'DM Sans',sans-serif}
.friends-hunt-copy{margin:16px 0 11px;padding:14px 15px;border:1px solid #e4d4c2;border-radius:18px;background:#fff;color:#45344c;font:600 13px/1.5 'DM Sans',sans-serif;box-shadow:0 5px 16px #43263a0b}
.friends-hunt-progress{display:flex;gap:8px;margin:12px 2px 16px}
.friends-hunt-progress i{display:block;flex:1;height:7px;border-radius:99px;background:#e7dce3;box-shadow:inset 0 1px 2px #39233418}
.friends-hunt-progress i.found{background:linear-gradient(90deg,#d86b74,#f0bb58);box-shadow:0 0 11px #dfa55f88}
.friends-hunt-actions{display:flex;gap:9px}
.friends-hunt-start,.friends-hunt-next{flex:1;min-height:47px;padding:11px 14px;border:0;border-radius:16px;background:linear-gradient(100deg,#a84562,#d07d65);color:#fff;font:850 13px 'DM Sans',sans-serif;box-shadow:0 7px 18px #974e6350;cursor:pointer}
.friends-hunt-next{background:linear-gradient(100deg,#55395e,#80586d)}
.friends-hunt-start[hidden],.friends-hunt-next[hidden]{display:none}
.friends-game-footnote{display:block;margin-top:11px;color:#7d6e7e;font:600 10px/1.4 'DM Sans',sans-serif;text-align:center}
.friends-hunt-egg{position:fixed;right:17px;top:48%;z-index:8;display:grid;place-items:center;gap:1px;width:59px;height:61px;border:1px solid #f3ca62;border-radius:21px;background:linear-gradient(145deg,#fffef7,#f4e7d5);color:#493147;box-shadow:0 7px 23px #120b1b59,0 0 0 4px #f3ca6225;cursor:pointer;animation:friends-egg-wink 1.6s ease-in-out infinite}
.friends-hunt-egg span{font-size:22px;line-height:1}
.friends-hunt-egg small{color:#805668;font:850 7px 'DM Sans',sans-serif;letter-spacing:.12em}
.friends-hunt-egg.friends-hunt-found{background:linear-gradient(145deg,#e7f0dd,#cde2cf);border-color:#87b28d;animation:friends-found-pop .55s cubic-bezier(.15,.9,.3,1.3) both}
.friends-hunt-egg.friends-hunt-found small{color:#386344}
@keyframes friends-egg-wink{0%,84%,100%{transform:rotate(0) scale(1)}89%{transform:rotate(-9deg) scale(1.09)}94%{transform:rotate(7deg) scale(1.05)}}
@keyframes friends-found-pop{45%{transform:scale(1.35) rotate(12deg);box-shadow:0 0 35px #f3ca62aa}}
@media(max-width:760px), (min-width:761px){.friends-page-pal{left:8px;bottom:calc(94px + env(safe-area-inset-bottom))}.friends-pal-trigger{width:94px;min-height:115px;border-radius:23px;padding:5px 6px 7px}.friends-pal-art{width:78px;height:78px;border-radius:19px}.friends-pal-name{font-size:11px}.friends-pal-hint{font-size:7px}.friends-pal-panel{width:min(350px,calc(100vw - 20px));max-height:calc(100dvh - 185px - env(safe-area-inset-bottom));padding:16px}.friends-pal-heading .friends-pal-art-large{flex-basis:76px;width:76px;height:76px}.friends-pal-title{font-size:18px}.friends-hunt-copy{font-size:12px;padding:12px}.friends-hunt-egg{right:8px;width:50px;height:52px;border-radius:18px}}
@media(prefers-reduced-motion:reduce){.friends-scene-shift,.friends-scene-shift:before,.friends-scene-shift:after,.friends-scene-title,.friends-pal-trigger,.friends-hunt-egg{animation:none!important}.friends-scene-shift{display:none!important}}

/* Quiet corner hunt and the six friends as small, tappable page companions. */
.friends-page-pal{left:auto;right:14px;bottom:calc(73px + env(safe-area-inset-bottom));z-index:12;pointer-events:none}
.friends-pal-trigger{display:grid;place-items:center;gap:0;width:48px;min-height:48px;padding:4px;border:1px solid #fff8;border-radius:50%;background:#30253de8;color:#fff7ed;box-shadow:0 5px 17px #17101d40;animation:friends-chibi-idle 3.8s ease-in-out infinite}
.friends-pal-trigger>span{font-size:20px;line-height:1}.friends-pal-count{font:700 8px 'DM Sans',sans-serif;color:#f3ca62}
.friends-pal-panel{left:auto;right:0;bottom:60px;width:min(310px,calc(100vw - 24px));padding:16px;border-radius:22px;box-shadow:0 12px 36px #130b1c55}
.friends-hunt-complete .friends-pal-panel,.friends-hunt-complete .friends-pal-trigger{display:none!important}
.friends-character-rail{position:fixed;inset:0;z-index:8;pointer-events:none}
.friends-side-pal{position:absolute;top:43%;display:grid;justify-items:center;pointer-events:none;animation:friends-side-float 4.2s ease-in-out infinite}
.friends-side-pal[data-side="left"]{left:8px}.friends-side-pal[data-side="right"]{right:8px;animation-delay:-1.9s}
.friends-side-character{display:grid;justify-items:center;gap:1px;min-width:54px;padding:2px;border:0;background:transparent;color:#fff8f0;text-shadow:0 1px 5px #201626;cursor:pointer;pointer-events:auto}
.friends-side-art{display:block;width:56px;height:62px;border:1px solid #fff9;border-radius:50% 50% 43% 43%;background-color:#382d43;background-image:url('assets/friends-cast-sheet.png');background-size:300% 200%;background-repeat:no-repeat;box-shadow:0 5px 16px #2014263c;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.friends-side-art[data-character="Rachel"]{background-position:0% 0%}.friends-side-art[data-character="Monica"]{background-position:50% 0%}.friends-side-art[data-character="Phoebe"]{background-position:100% 0%}.friends-side-art[data-character="Joey"]{background-position:0% 100%}.friends-side-art[data-character="Chandler"]{background-position:50% 100%}.friends-side-art[data-character="Ross"]{background-position:100% 100%}
.friends-side-character small{padding:1px 6px;border-radius:99px;background:#211a28b8;color:#fff;font:700 8px 'DM Sans',sans-serif}
.friends-side-character:hover .friends-side-art,.friends-side-pop .friends-side-art{transform:scale(1.12) rotate(-5deg);box-shadow:0 0 0 3px #f3ca6277,0 8px 22px #20142655}
.friends-side-quote{position:absolute;top:0;width:max-content;max-width:min(210px,45vw);padding:8px 11px;border:1px solid #f3ca6270;border-radius:14px;background:#fffaf2;color:#35283b;font:650 11px/1.35 'DM Sans',sans-serif;box-shadow:0 7px 20px #21172830;pointer-events:none}
.friends-side-quote[hidden]{display:none}.friends-side-pal[data-side="left"] .friends-side-quote{left:60px}.friends-side-pal[data-side="right"] .friends-side-quote{right:60px}
@keyframes friends-side-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.friends-hunt-egg{width:48px;height:48px;border-radius:50%;opacity:.86;box-shadow:0 4px 14px #120b1b32;animation:friends-egg-wink 2.8s ease-in-out infinite}
.friends-hunt-egg span{font-size:20px}
.friends-hunt-egg.friends-hunt-found{animation:friends-found-pop .34s ease both}
#screen-content.friends-page-enter[data-friends-scene]{animation-duration:1.48s}
.friends-scene-shift{place-items:center;align-content:center}
.friends-scene-shift:before,.friends-scene-shift:after{animation-duration:1.55s}
.friends-scene-title{margin:auto;animation-duration:1.55s}
.friends-scene-exit{transition:opacity .35s ease}
@media(max-width:760px), (min-width:761px){.friends-page-pal{right:8px;left:auto;bottom:calc(96px + env(safe-area-inset-bottom))}.friends-pal-panel{right:0;left:auto;bottom:58px;width:min(300px,calc(100vw - 18px));padding:14px}.friends-side-pal{top:42%}.friends-side-pal[data-side="left"]{left:2px}.friends-side-pal[data-side="right"]{right:2px}.friends-side-art{width:43px;height:50px}.friends-side-character{min-width:43px}.friends-side-character small{font-size:7px}.friends-side-pal[data-side="left"] .friends-side-quote{left:45px}.friends-side-pal[data-side="right"] .friends-side-quote{right:45px}.friends-hunt-egg{width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){.friends-side-pal{animation:none}.friends-side-art{transition:none}}

/* Keep the theme picker within narrow phone screens. */
@media(max-width:760px), (min-width:761px){.profile-page,.theme-panel,.theme-options{min-width:0;max-width:100%;box-sizing:border-box}.theme-panel{width:100%;padding:14px}.theme-panel>.theme-options{flex:1 1 auto;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.theme-option{box-sizing:border-box;width:100%;min-width:0;max-width:100%;gap:6px;padding:8px 7px;font-size:9px;line-height:1.2;white-space:normal}.theme-swatch{width:22px;height:22px;flex:0 0 22px}.theme-option-label{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}.theme-option-label b{font-size:9px;line-height:1.2}.theme-option-label small{font-size:8px;line-height:1.2}.theme-check{margin-left:0;flex:0 0 auto;font-size:10px}}

/* Spider-Verse and Stark page changes use the same 1.58s scene length as Friends. */
#screen-content.hero-theme-page-enter[data-hero-theme="web-slinger"]{animation:borrowed-spider-page-in 1.48s cubic-bezier(.18,.82,.18,1) both}
#screen-content.hero-theme-page-enter[data-hero-theme="arc-reactor"]{animation:borrowed-arc-page-in 1.48s cubic-bezier(.18,.82,.18,1) both}
@keyframes borrowed-spider-page-in{0%{opacity:.25;filter:blur(5px);transform:translate3d(0,24px,0) scale(.985)}45%{opacity:1;filter:none;transform:translate3d(0,-5px,0) scale(1.006)}100%{opacity:1;transform:none}}
@keyframes borrowed-arc-page-in{0%{opacity:.15;filter:brightness(.5) blur(4px);transform:scale(.96)}45%{opacity:1;filter:brightness(1.35) blur(0);transform:scale(1.01)}100%{opacity:1;filter:none;transform:none}}
.borrowed-theme-scene-shift{position:fixed;inset:0;z-index:60;display:grid;place-items:center;overflow:hidden;pointer-events:none;isolation:isolate}
.borrowed-theme-scene-shift:before,.borrowed-theme-scene-shift:after{content:"";position:absolute;top:0;bottom:0;width:52%;animation-duration:1.58s;animation-fill-mode:both;animation-timing-function:cubic-bezier(.7,0,.2,1)}
.borrowed-theme-scene-shift:before{left:0}.borrowed-theme-scene-shift:after{right:0}
.spider-scene-shift:before,.spider-scene-shift:after{background-color:#091425;background-image:repeating-conic-gradient(from 0deg at 100% 0%,#e52d4530 0deg 1deg,transparent 1deg 15deg),repeating-radial-gradient(circle at 100% 0%,transparent 0 28px,#e52d4540 29px 30px,transparent 31px 52px),linear-gradient(145deg,#111c36f5,#a81731ed);background-size:100% 100%;box-shadow:0 0 60px #df183c55}
.spider-scene-shift:before{animation-name:borrowed-spider-curtain-left;border-right:2px solid #e23952}.spider-scene-shift:after{animation-name:borrowed-spider-curtain-right;border-left:2px solid #229fe0}
.arc-scene-shift:before,.arc-scene-shift:after{background:radial-gradient(ellipse at center,#f0203612,transparent 55%),linear-gradient(145deg,#0b0b0bf7,#2a100ff3 60%,#111111f7);box-shadow:0 0 70px #f0203655}
.arc-scene-shift:before{animation-name:borrowed-arc-curtain-left;border-right:2px solid #f02036}.arc-scene-shift:after{animation-name:borrowed-arc-curtain-right;border-left:2px solid #f0c242}
@keyframes borrowed-spider-curtain-left{0%,12%{transform:translateX(-103%);opacity:.3}35%,69%{transform:translateX(0);opacity:1}100%{transform:translateX(-103%);opacity:0}}
@keyframes borrowed-spider-curtain-right{0%,12%{transform:translateX(103%);opacity:.3}35%,69%{transform:translateX(0);opacity:1}100%{transform:translateX(103%);opacity:0}}
@keyframes borrowed-arc-curtain-left{0%,12%{transform:translateX(-103%) skewX(-5deg);opacity:.3}35%,69%{transform:translateX(0) skewX(0);opacity:1}100%{transform:translateX(-103%) skewX(-5deg);opacity:0}}
@keyframes borrowed-arc-curtain-right{0%,12%{transform:translateX(103%) skewX(5deg);opacity:.3}35%,69%{transform:translateX(0) skewX(0);opacity:1}100%{transform:translateX(103%) skewX(5deg);opacity:0}}
.borrowed-theme-scene-card{position:relative;z-index:1;display:grid;justify-items:center;gap:10px;width:min(430px,calc(100vw - 44px));padding:25px 20px;border:1px solid #ffffff35;border-radius:26px;background:#101523ed;color:#fff;text-align:center;box-shadow:0 20px 80px #0009;opacity:0;transform:scale(.82);animation:borrowed-theme-card-in 1.58s ease both}
.borrowed-theme-scene-card span{color:#f5b942;font:800 9px 'JetBrains Mono',monospace;letter-spacing:.2em}.spider-scene-shift .borrowed-theme-scene-card span{color:#65c8f2}
.borrowed-theme-scene-card b{font:850 clamp(16px,4vw,23px) Manrope,sans-serif;letter-spacing:.03em}.borrowed-theme-scene-card i{font-size:23px;font-style:normal;color:#00d9f5}.spider-scene-shift .borrowed-theme-scene-card i{color:#ec3c53}
@keyframes borrowed-theme-card-in{0%,24%{opacity:0;transform:scale(.82) translateY(9px)}38%,68%{opacity:1;transform:scale(1) translateY(0)}90%,100%{opacity:0;transform:scale(1.06) translateY(-5px)}}
.borrowed-theme-scene-shift.is-exiting{opacity:0;transition:opacity .35s ease}
@media(prefers-reduced-motion:reduce){#screen-content.hero-theme-page-enter[data-hero-theme],.borrowed-theme-scene-shift:before,.borrowed-theme-scene-shift:after,.borrowed-theme-scene-card{animation-duration:.01ms!important}.borrowed-theme-scene-shift{display:none!important}}

/* Start the transition as an opaque scene cover on the same frame as navigation. */
.spider-scene-shift{background:linear-gradient(145deg,#0a1425,#11182a 54%,#151326)}
.arc-scene-shift{background:radial-gradient(ellipse at 50% 50%,#2a100f,#080606 72%)}
.borrowed-theme-scene-card{animation-name:borrowed-theme-card-now}
.arc-scene-shift .borrowed-theme-scene-card{background:#1b100fed;border-color:#f0c24255}
.arc-scene-shift .borrowed-theme-scene-card i{color:#f0c242}
@keyframes borrowed-theme-card-now{0%{opacity:1;transform:scale(.94)}12%,67%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.04) translateY(-4px)}}
.spider-web-corner{width:clamp(86px,12vw,166px);height:clamp(86px,12vw,166px);opacity:.34}
.spider-web-corner svg{color:#87c7f2;filter:drop-shadow(0 1px 2px #2468a422)}
.spider-web-corner svg path{stroke-width:.82;opacity:.48}
.spider-web-corner .spider-web-knot:before{display:none;content:none}
.spider-web-corner:hover{opacity:.58}
.web-bottom-left,.web-bottom-right{opacity:.2}
@media(max-width:760px), (min-width:761px){.spider-web-corner{top:58px;width:78px;height:78px;opacity:.3}.web-bottom-left,.web-bottom-right{top:auto;bottom:76px;opacity:.16}}
@media(prefers-reduced-motion:reduce){.borrowed-theme-scene-card{animation-name:none;opacity:1}}

/* Theme-pick launch sequences for the four illustrated worlds. */
.borrowed-theme-startup{position:fixed;inset:0;z-index:88;display:grid;place-items:center;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,#07101cbb,#07101c66 66%,transparent);animation:borrowed-startup-wash 1.8s ease both}
.borrowed-theme-startup:before,.borrowed-theme-startup:after{content:"";position:absolute;inset:-15%;pointer-events:none;opacity:0;animation:borrowed-startup-field 1.8s ease both}
.borrowed-theme-startup:before{background:radial-gradient(circle at center,var(--startup-glow),transparent 58%)}
.borrowed-startup-card{position:relative;z-index:1;display:grid;justify-items:center;gap:9px;width:min(450px,calc(100vw - 40px));padding:25px 20px;border:1px solid color-mix(in srgb,var(--startup-accent) 70%,white);border-radius:28px;background:color-mix(in srgb,var(--startup-base) 92%,transparent);color:#f5f8ff;text-align:center;box-shadow:0 22px 75px #0008,0 0 55px var(--startup-glow);backdrop-filter:blur(16px);animation:borrowed-startup-card 1.8s cubic-bezier(.18,.82,.18,1) both}
.borrowed-startup-card>span{color:var(--startup-accent);font:800 9px 'JetBrains Mono',monospace;letter-spacing:.19em}
.borrowed-startup-card>i{display:grid;place-items:center;width:66px;height:66px;border:1px solid color-mix(in srgb,var(--startup-accent) 72%,white);border-radius:22px;background:color-mix(in srgb,var(--startup-glow) 45%,var(--startup-base));font-size:35px;font-style:normal;filter:drop-shadow(0 0 16px var(--startup-glow));animation:borrowed-startup-icon .9s cubic-bezier(.2,.8,.2,1) both}
.borrowed-startup-card>b{font:850 clamp(17px,4vw,25px) Manrope,sans-serif;letter-spacing:.035em}
.borrowed-startup-card>small{color:#c4cfdd;font-size:12px}
.startup-web-slinger{--startup-accent:#68caff;--startup-glow:#e3263d66;--startup-base:#101b30}.startup-web-slinger:before{background:repeating-conic-gradient(from 8deg at 50% 50%,#e52b4330 0deg .7deg,transparent .8deg 19deg),repeating-radial-gradient(ellipse at 50% 50%,transparent 0 34px,#d8eafa2b 35px 36px,transparent 37px 58px),radial-gradient(circle,#13386966,transparent 64%);mask-image:radial-gradient(ellipse,#000 0 52%,transparent 80%)}
.startup-paper-company{--startup-accent:#f0c779;--startup-glow:#d0a45c4a;--startup-base:#24201b}.startup-paper-company:before{inset:16% 8%;background:linear-gradient(118deg,transparent 0 14%,#f6edda18 14.2% 27%,transparent 27.2% 45%,#f6edda20 45.2% 60%,transparent 60.2%),radial-gradient(ellipse,#d9ad6a2a,transparent 65%);transform:rotate(-7deg)}
.startup-stitch-ohana{--startup-accent:#7af0da;--startup-glow:#3bbce45c;--startup-base:#10263a}.startup-stitch-ohana:before{background:radial-gradient(ellipse at 24% 68%,#ff958b45,transparent 29%),radial-gradient(ellipse at 78% 30%,#46dfd344,transparent 33%),radial-gradient(circle at 50% 50%,#4d92e533,transparent 65%)}
.borrowed-theme-startup.startup-leave{opacity:0;transition:opacity .4s ease}
@keyframes borrowed-startup-wash{0%{opacity:0}14%,72%{opacity:1}100%{opacity:0}}
@keyframes borrowed-startup-field{0%{opacity:0;transform:scale(.82) rotate(-8deg)}30%,72%{opacity:.85;transform:scale(1) rotate(0)}100%{opacity:0;transform:scale(1.12) rotate(5deg)}}
@keyframes borrowed-startup-card{0%{opacity:0;transform:translateY(14px) scale(.9);filter:blur(8px)}18%,72%{opacity:1;transform:none;filter:none}100%{opacity:0;transform:translateY(-6px) scale(1.025)}}
@keyframes borrowed-startup-icon{0%{transform:scale(.45) rotate(-14deg)}44%{transform:scale(1.14) rotate(5deg)}70%,100%{transform:scale(1) rotate(0)}}
@media(prefers-reduced-motion:reduce){.borrowed-theme-startup,.borrowed-theme-startup:before,.borrowed-theme-startup:after,.borrowed-startup-card,.borrowed-startup-card>i{animation:none!important;transition:none!important}.borrowed-theme-startup{display:none!important}}

/* Spider-Verse: a light web layer, a crafted hanging mascot, and fast route-specific motion. */
.spider-verse-effects{z-index:42;overflow:hidden;pointer-events:none;--spider-pointer-x:-1000px;--spider-pointer-y:-1000px}
.spider-sense-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(145px circle at var(--spider-pointer-x) var(--spider-pointer-y),#55a9ee14,transparent 72%);transition:opacity .25s}
.spider-web-corner{background:none;mask:none;overflow:visible}
.spider-web-corner svg{position:absolute;inset:0;width:100%;height:100%;color:#9bc8ed;filter:drop-shadow(0 0 4px #4b97d322);transition:transform .35s ease,filter .35s ease}
.spider-web-corner svg path{stroke-width:1.05;opacity:.58;vector-effect:non-scaling-stroke}
.spider-web-corner svg path:first-child{stroke:#c9dff5;stroke-width:1.4;opacity:.52}
.spider-web-corner svg path:last-child{stroke:#ec5b6a;stroke-width:1.05;opacity:.38}
.spider-web-corner:hover svg{transform:scale(1.035);filter:drop-shadow(0 0 8px #85c8ff66)}
.spider-web-corner .spider-web-knot{top:18%;left:18%;width:23px;height:23px;border:1px solid #b9d9f090;background:#101a2bb8;box-shadow:0 0 0 4px #72b8f31a}
.spider-web-right .spider-web-knot{left:auto;right:18%}
.spider-web-knot:before{display:block;content:'✦';font-size:11px;color:#f3f7ff}
.spider-web-descender{position:absolute;display:grid;place-items:center;top:12%;left:17%;width:29px;height:34px;transform-origin:top center;animation:web-chibi-drop 1.45s cubic-bezier(.18,.8,.25,1) both}
.spider-web-right .spider-web-descender{left:auto;right:17%}
.spider-web-descender .spider-chibi-art{width:29px;height:34px;transform:rotate(180deg)}
.spider-drop{top:69px;right:clamp(24px,8vw,122px);animation:spider-idle 4.6s ease-in-out infinite;z-index:3}
.spider-drop:before{height:42px;width:1.5px;background:linear-gradient(#b7d7f4,#8dbde8 70%,#e74758);box-shadow:0 0 7px #76b4ef44}
.spider-mascot{position:relative;display:grid;place-items:center;width:58px;height:60px;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none;pointer-events:auto;transform:rotate(180deg);transform-origin:50% 10%;transition:filter .2s}
.spider-mascot:hover{transform:rotate(180deg) scale(1.08);filter:drop-shadow(0 5px 8px #72bdf777)}
.spider-mascot-thread{display:none}
.spider-chibi-art{width:58px;height:65px;overflow:visible;filter:drop-shadow(0 4px 4px #0007)}
.spider-mascot.spider-swing{animation:spider-chibi-swing .76s cubic-bezier(.2,.8,.22,1)}
@keyframes spider-chibi-swing{0%{transform:rotate(180deg)}25%{transform:rotate(211deg) translateX(7px)}54%{transform:rotate(151deg) translateX(-6px)}100%{transform:rotate(180deg)}}
.spider-verse-quote{position:absolute;top:168px;right:clamp(16px,5vw,78px);z-index:4;max-width:min(300px,74vw);border:1px solid #6aa7df8a;border-radius:18px 18px 5px 18px;background:linear-gradient(135deg,#142744f5,#182033f5);color:#f7faff;text-align:left;cursor:pointer;pointer-events:auto}
.spider-verse-quote:after{content:'TAP TO SWING THERE ↗';display:block;margin-top:5px;color:#9dcfff;font:800 8px/1.2 Manrope,sans-serif;letter-spacing:.12em}
.spider-missions-toggle{position:absolute;top:126px;right:clamp(18px,5vw,72px);display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #6ca8d84a;border-radius:999px;background:#111b2ce8;color:#dcecff;font:800 9px/1 Manrope,sans-serif;letter-spacing:.06em;cursor:pointer;pointer-events:auto;box-shadow:0 4px 16px #0003;transition:transform .2s,border-color .2s}
.spider-missions-toggle:hover{transform:translateY(-2px);border-color:#79b9f5}.spider-missions-toggle>b{padding:3px 5px;border-radius:999px;background:#e6374a;color:white;font-size:8px}
.spider-mission-pop{animation:spider-mission-pop .45s cubic-bezier(.2,.8,.2,1)}
.spider-mission-panel{position:absolute;top:164px;right:clamp(18px,5vw,72px);z-index:7;width:min(340px,calc(100vw - 32px));max-height:min(62vh,440px);overflow:auto;padding:14px;border:1px solid #57769e;border-radius:18px;background:linear-gradient(145deg,#111b2cfa,#171829fa);color:#f5f8ff;box-shadow:0 18px 48px #0009;pointer-events:auto;animation:spider-quote-pop .25s ease both}
.spider-mission-panel[hidden]{display:none}
.spider-mission-head{display:flex;justify-content:space-between;gap:10px;align-items:center;padding-bottom:10px;border-bottom:1px solid #ffffff20}
.spider-mission-head div{display:grid;gap:4px}.spider-mission-head span{color:#95caff;font:800 8px Manrope,sans-serif;letter-spacing:.12em}.spider-mission-head b{font:800 13px Manrope,sans-serif}.spider-mission-head>strong{color:#ff6873;font:900 13px Manrope,sans-serif;white-space:nowrap}
.spider-mission-panel ol{display:grid;gap:2px;margin:9px 0;padding:0;list-style:none}
.spider-mission-panel li{display:grid;grid-template-columns:24px 1fr auto;gap:8px;align-items:center;padding:8px 5px;border-radius:10px}
.spider-mission-panel li>span{display:grid;place-items:center;width:22px;height:22px;border:1px solid #456183;border-radius:50%;color:#a8d3fb;font:800 8px Manrope,sans-serif}
.spider-mission-panel li div{display:grid;gap:2px}.spider-mission-panel li div b{font:750 10px Manrope,sans-serif}.spider-mission-panel li small{color:#a9b4c5;font:500 9px Manrope,sans-serif}.spider-mission-panel li>strong{color:#a8c9ed;font:800 9px Manrope,sans-serif;white-space:nowrap}
.spider-mission-panel li.is-done{background:#25583d30}.spider-mission-panel li.is-done>span{border-color:#63bd8c;background:#215d3b;color:#fff}.spider-mission-panel>p{margin:8px 3px 0;color:#9aa8bc;font:500 9px/1.45 Manrope,sans-serif}
.spider-hero-badge{position:absolute;top:202px;right:clamp(18px,5vw,72px);padding:6px 9px;border:1px solid #ff687379;border-radius:999px;background:#46202bcf;color:#ffc0c5;font:850 8px Manrope,sans-serif;letter-spacing:.08em}
.spider-hero-badge[hidden]{display:none}
.spider-web-route-transition{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden;animation:spider-route-overlay 1.15s cubic-bezier(.22,.75,.2,1) both}
.spider-web-route-transition svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.spider-transition-thread,.spider-transition-strand{fill:none;stroke:#dceeff;stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;animation:spider-thread-draw .55s cubic-bezier(.2,.8,.25,1) forwards;filter:drop-shadow(0 0 5px #64b9ff)}
.spider-transition-strand{stroke:#e94859;stroke-width:1.2;animation-delay:.03s;opacity:.9}
.spider-transition-anchor{fill:#ff5363;stroke:#fff;stroke-width:3;opacity:0;transform-box:fill-box;transform-origin:center;animation:spider-anchor-pop .32s .18s ease-out forwards}
.spider-transition-label{position:absolute;top:50%;left:50%;padding:8px 12px;border:1px solid #83b8e876;border-radius:999px;background:#10192be8;color:#f1f7ff;font:850 9px Manrope,sans-serif;letter-spacing:.16em;opacity:0;transform:translate(-50%,-50%) scale(.94);animation:spider-route-label .38s .12s ease-out both}
.spider-route-activity .spider-transition-thread{d:path('M-30 350 C160 30 410 40 500 350 S850 670 1030 350')}
.spider-route-community .spider-transition-anchor{fill:#54a9ff;animation:spider-nodes-pop .42s .1s ease-out both}
.spider-route-community .spider-transition-strand{stroke:#7dbbff}
.spider-route-map .spider-transition-thread{stroke:#6dbeff;stroke-width:3}
.spider-route-map .spider-transition-anchor{r:14;animation:spider-map-ping .5s .08s ease-out both}
.spider-route-profile .spider-transition-thread{d:path('M430 280 C600 250 600 430 430 430 C250 430 260 240 430 280')}
.spider-route-profile .spider-transition-anchor{fill:#f2f7ff}
.spider-route-list .spider-transition-thread{stroke:#ff5a64;stroke-width:3}
#screen-content.spider-page-enter[data-spider-route]{animation:spider-page-arrive 1.05s cubic-bezier(.18,.82,.2,1) both}
#screen-content.spider-page-enter[data-spider-route="activity"] .activity-card,#screen-content.spider-page-enter[data-spider-route="explore"] .item-card{animation:spider-card-reveal .38s cubic-bezier(.2,.8,.2,1) both}
#screen-content.spider-page-enter[data-spider-route="activity"] .activity-card:nth-child(2),#screen-content.spider-page-enter[data-spider-route="explore"] .item-card:nth-child(2){animation-delay:.045s}
#screen-content.spider-page-enter[data-spider-route="activity"] .activity-card:nth-child(3),#screen-content.spider-page-enter[data-spider-route="explore"] .item-card:nth-child(3){animation-delay:.09s}
@keyframes spider-thread-draw{to{stroke-dashoffset:0}}
@keyframes spider-route-overlay{0%{opacity:1}70%{opacity:1}100%{opacity:0}}
@keyframes spider-route-label{0%{opacity:0;translate:0 4px}40%,76%{opacity:1;translate:0 0}100%{opacity:0}}
@keyframes spider-anchor-pop{0%{opacity:0;scale:.4}45%{opacity:1;scale:1.5}100%{opacity:.7;scale:1}}
@keyframes spider-nodes-pop{0%{opacity:0;scale:.5}40%{opacity:1;scale:1.4}100%{opacity:0;scale:2.2}}
@keyframes spider-map-ping{0%{opacity:0;scale:.3}25%{opacity:1;scale:1}100%{opacity:0;scale:3}}
@keyframes spider-page-arrive{0%{opacity:.3;transform:translate3d(0,12px,0) scale(.994);filter:blur(2px)}55%{opacity:1;transform:translate3d(0,-2px,0);filter:none}100%{opacity:1;transform:none;filter:none}}
@keyframes spider-card-reveal{0%{opacity:0;transform:translateY(9px) scale(.985)}100%{opacity:1;transform:none}}
@keyframes spider-mission-pop{45%{transform:scale(1.13);box-shadow:0 0 18px #5bb8ff80}}
@keyframes web-chibi-drop{0%{opacity:0;transform:translateY(-4px) scale(.7)}30%,76%{opacity:1;transform:translateY(42px) scale(1)}100%{opacity:0;transform:translateY(58px) scale(.8)}}
@media(max-width:760px), (min-width:761px){.spider-drop{top:61px;right:clamp(14px,16vw,76px)}.spider-drop:before{height:29px}.spider-mascot{width:45px;height:47px}.spider-chibi-art{width:46px;height:51px}.spider-missions-toggle{top:111px;right:12px;padding:6px 8px;font-size:8px}.spider-mission-panel{top:146px;right:10px;width:min(320px,calc(100vw - 20px));max-height:55vh}.spider-verse-quote{top:147px;right:10px}.spider-hero-badge{top:190px;right:10px}.spider-web-corner{top:55px;width:82px;height:82px;opacity:.3}.web-bottom-left,.web-bottom-right{top:auto;bottom:80px;opacity:.18}.spider-web-knot{width:20px;height:20px}.spider-web-corner svg path{stroke-width:1.3}.spider-transition-label{top:auto;bottom:calc(95px + env(safe-area-inset-bottom));font-size:8px}}
@media(prefers-reduced-motion:reduce){.spider-drop,.spider-web-corner svg,.spider-mascot,.spider-web-route-transition,.spider-page-enter,.spider-transition-thread,.spider-transition-strand,.spider-transition-anchor,.spider-transition-label,.spider-mission-pop,.spider-chibi-art{animation:none!important;transition:none!important}.spider-web-route-transition{display:none!important}}
.spider-web-corner svg{transform-origin:0 0;animation:spider-web-reveal .72s cubic-bezier(.2,.78,.22,1) both}
.web-top-right svg{transform-origin:100% 0}.web-bottom-left svg{transform-origin:0 100%}.web-bottom-right svg{transform-origin:100% 100%}
.spider-web-corner:after{content:"";position:absolute;left:5%;top:5%;width:4px;height:4px;border-radius:50%;background:#f8fcff;box-shadow:0 0 8px 2px #75bfff;opacity:0;pointer-events:none;animation:spider-web-glint 5.6s 1.2s ease-in-out infinite}
@keyframes spider-web-reveal{from{opacity:0;scale:.88}to{opacity:1;scale:1}}
@keyframes spider-web-glint{0%,12%{opacity:0;translate:0 0}20%{opacity:.9}62%{opacity:.65;translate:clamp(30px,8vw,112px) clamp(22px,7vw,100px)}76%,100%{opacity:0;translate:clamp(30px,8vw,112px) clamp(22px,7vw,100px)}}
@media(prefers-reduced-motion:reduce){.spider-web-corner:after{animation:none;display:none}.spider-web-corner svg{animation:none}}

/* Spider-Verse redesign · layered, restrained, responsive web system */
body[data-theme="web-slinger"]{
  --green:#ee3348;--orange:#f24453;--lime:#69b9f1;--mint:#142036;--banner-bg:#121d30;--banner-accent:#f24453;--banner-icon:#19314e;--banner-button:#e8394c;
  color:#f5f7fb;background:#080b12;background-image:radial-gradient(ellipse at 8% 9%,#ee334818,transparent 27%),radial-gradient(ellipse at 88% 27%,#1477bd1c,transparent 32%),radial-gradient(ellipse at 52% 100%,#16233d55,transparent 46%),linear-gradient(155deg,#0b0f18,#080b12 60%,#0c111c);background-attachment:fixed
}
body[data-theme="web-slinger"] #screen-content{color:#f5f7fb}
body[data-theme="web-slinger"] .hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 81% 48%,#24568b48,transparent 34%),linear-gradient(125deg,#121b2b 0%,#17243a 54%,#111522 100%);border:1px solid #42516a;box-shadow:inset 0 1px #ffffff12,0 22px 60px #02040a90}
body[data-theme="web-slinger"] .hero:after{content:"";position:absolute;inset:0 0 0 45%;pointer-events:none;opacity:.42;background:radial-gradient(circle at 70% 49%,transparent 0 24%,#b8d5ed1d 24.2% 24.45%,transparent 24.7% 36%,#c6d9eb13 36.2% 36.4%,transparent 36.7%),linear-gradient(120deg,transparent 48%,#e8334810 49%,transparent 50%);mask-image:linear-gradient(90deg,transparent,#000 25%);transition:opacity .3s ease}
body[data-theme="web-slinger"] .hero:hover:after{opacity:.72}
body[data-theme="web-slinger"] .hero h1 em,body[data-theme="web-slinger"] .section-heading .text-button,body[data-theme="web-slinger"] .request-banner .eyebrow{color:#ff6474}
body[data-theme="web-slinger"] .hero-art{position:relative;isolation:isolate}
body[data-theme="web-slinger"] .item-card,body[data-theme="web-slinger"] .activity-card,body[data-theme="web-slinger"] .help-card,body[data-theme="web-slinger"] .request-banner,body[data-theme="web-slinger"] .community-card,body[data-theme="web-slinger"] .profile-card,body[data-theme="web-slinger"] .theme-panel{background-color:#111722;border-color:#303b50;color:#f3f6fb;box-shadow:0 12px 30px #02050a42}
body[data-theme="web-slinger"] .item-card{transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s,box-shadow .28s;position:relative;overflow:hidden}
body[data-theme="web-slinger"] .item-card:hover{transform:translateY(-5px);border-color:#5089b9;box-shadow:0 18px 34px #02050a70}
body[data-theme="web-slinger"] .item-card:hover .item-image img{transform:scale(1.035)}
body[data-theme="web-slinger"] .item-image img{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
body[data-theme="web-slinger"] .nav-item.selected{color:#ff6674}
.spider-verse-effects{position:fixed;inset:0;z-index:4;overflow:hidden;pointer-events:none;isolation:isolate}
.spider-web-backdrop{position:absolute;width:min(48vw,620px);aspect-ratio:1;opacity:.105;color:#c6d9ec;pointer-events:none;filter:drop-shadow(0 0 10px #72b9ef22);mask-image:radial-gradient(ellipse,#000 25%,transparent 75%)}
.spider-web-backdrop svg{width:100%;height:100%;overflow:visible}
.spider-web-backdrop path{stroke-width:.62;vector-effect:non-scaling-stroke}
.spider-backdrop-a{left:-16vw;top:13vh;transform:rotate(-9deg) scale(.95)}
.spider-backdrop-b{right:-18vw;bottom:5vh;width:min(43vw,550px);transform:rotate(13deg);color:#eab2b8;opacity:.075}
.spider-web-corner{top:0;width:clamp(112px,15vw,210px);height:clamp(112px,15vw,210px);opacity:.27;overflow:visible;background:none;mask:none;pointer-events:none}
.spider-web-corner svg{position:absolute;inset:0;width:100%;height:100%;color:#b9d1e5;filter:drop-shadow(0 0 4px #72b9ef30);animation:none;pointer-events:none}
.spider-web-corner svg path{stroke:#afcbe0;stroke-width:.82;opacity:.55;vector-effect:non-scaling-stroke}
.spider-web-corner .spider-web-knot{position:absolute;inset:auto;top:16%;left:16%;width:28px;height:28px;display:grid;place-items:center;padding:0;border:1px solid #d9e8f080;border-radius:50%;background:#111a28b8;color:#f4f7fc;box-shadow:0 0 0 4px #5fa9e71c;pointer-events:auto}
.spider-web-corner .spider-web-knot:before{display:block;content:'✳';font-size:13px;color:#ff6274}
.web-top-right .spider-web-knot,.web-bottom-right .spider-web-knot{left:auto;right:16%}
.web-bottom-left,.web-bottom-right{top:auto;bottom:0}
.web-bottom-left{transform:scaleY(-1)}.web-bottom-right{transform:scale(-1)}
.spider-web-corner:hover{opacity:.56;filter:drop-shadow(0 0 8px #75bafa45)}
.spider-web-knot:hover:before{transform:scale(1.18);color:#fff}
.spider-drop{top:108px;right:clamp(18px,7vw,110px);z-index:3;transform-origin:top center;animation:spider-idle 4.4s ease-in-out infinite;pointer-events:none}
.spider-drop:before{height:34px;width:1.5px;background:linear-gradient(#d2e2ef,#a8c5dd 74%,#e84659);box-shadow:0 0 8px #7ebbea42}
.spider-mascot{width:52px;height:56px;border:0;border-radius:0;background:transparent;box-shadow:none;display:grid;place-items:center;transform:rotate(180deg);transform-origin:50% 10%;pointer-events:auto;transition:filter .2s,scale .2s}
.spider-mascot:hover{transform:rotate(180deg) scale(1.08);filter:drop-shadow(0 5px 9px #7fc9ff88)}
.spider-chibi-art{width:51px;height:58px;filter:drop-shadow(0 3px 5px #000b)}
.spider-mascot.spider-swing{animation:spider-chibi-swing .8s cubic-bezier(.2,.8,.22,1)}
.spider-mascot.spider-celebrate{animation:spider-hero-celebrate .7s cubic-bezier(.2,.8,.2,1)}
@keyframes spider-hero-celebrate{35%{transform:rotate(180deg) translateY(16px) scale(1.2)}70%{transform:rotate(150deg) translateY(1px)}100%{transform:rotate(180deg)}}
.spider-verse-quote{position:fixed;top:132px;right:clamp(14px,5vw,76px);z-index:8;max-width:min(290px,74vw);padding:11px 15px;border:1px solid #6886a184;border-radius:17px 17px 5px 17px;background:linear-gradient(140deg,#111e30f5,#151621f5);color:#f4f7fb;box-shadow:0 12px 30px #0009;pointer-events:none;font:700 12px/1.5 Manrope,sans-serif}
.spider-missions-toggle,.spider-sense-toggle{position:fixed;z-index:7;right:20px;bottom:calc(102px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid #56688099;border-radius:999px;background:#111a28eF;color:#eef5fc;box-shadow:0 8px 22px #0006;pointer-events:auto;cursor:pointer;font:800 9px/1 Manrope,sans-serif;letter-spacing:.055em}
.spider-missions-toggle{bottom:calc(102px + env(safe-area-inset-bottom));right:20px}
.spider-missions-toggle>b{padding:4px 6px;border-radius:999px;background:#e8394c;color:white;font-size:9px}
.spider-sense-toggle{right:auto;left:20px;bottom:calc(102px + env(safe-area-inset-bottom));font-size:9px}
.spider-sense-toggle span{color:#93a4b9}.spider-sense-active .spider-sense-toggle{border-color:#f35b69;box-shadow:0 0 0 3px #ef465526,0 8px 22px #0006}.spider-sense-active .spider-sense-toggle span{color:#ff7883}
.spider-mission-panel{position:fixed;z-index:9;right:16px;bottom:calc(148px + env(safe-area-inset-bottom));top:auto;width:min(365px,calc(100vw - 32px));max-height:min(65vh,490px);overflow:auto;padding:16px;border:1px solid #58677f;border-radius:22px;background:linear-gradient(145deg,#101a29f7,#151722f7);color:#f5f7fb;box-shadow:0 20px 55px #000a;pointer-events:auto;backdrop-filter:blur(18px)}
.spider-mission-panel[hidden]{display:none}.spider-mission-head span{color:#9dcbed}.spider-mission-head>strong{color:#ff6978}.spider-mission-panel li.is-done{background:#1c493c55}.spider-mission-panel li.is-done>span{border-color:#65c39a;background:#1b6949;color:#fff}.spider-mission-panel li>strong{font-size:8px;color:#9ab2c5}.spider-mission-panel>p{font-size:10px;line-height:1.5}
.spider-weave-start{width:100%;margin-top:8px;padding:11px 14px;border:0;border-radius:13px;background:linear-gradient(100deg,#e83b50,#1d72ba);color:white;font-weight:850;cursor:pointer}
.spider-weave-badge{margin-top:8px;padding:11px;border:1px solid #e8b54f77;border-radius:12px;background:#49361655;color:#ffe39b;text-align:center;font-size:10px;font-weight:900;letter-spacing:.08em}
.spider-weave-challenge{margin-top:12px;padding:12px;border:1px solid #66839c66;border-radius:15px;background:#111d2c}
.spider-weave-challenge>b{color:#ff6878;font-size:10px;letter-spacing:.13em}.spider-weave-challenge p,.spider-weave-challenge small{color:#becbd9;font-size:10px;line-height:1.5}
.spider-weave-challenge>div{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.spider-weave-challenge button{aspect-ratio:1;border:1px solid #8aa5bc66;border-radius:50%;background:#18283c;color:#eff6ff;cursor:pointer}.spider-weave-challenge button.is-connected{background:#e93c51;border-color:#ffb8bf;box-shadow:0 0 13px #e93c5188}
.spider-anchor-host{position:relative!important}.spider-page-anchor{position:absolute;z-index:5;top:11px;right:12px;width:25px;height:25px;display:grid;place-items:center;padding:0;border:1px solid #80badd75;border-radius:50%;background:#101b2bc2;color:#d9efff;opacity:.5;cursor:pointer;box-shadow:0 0 0 3px #61a9e416;transition:opacity .2s,scale .2s,box-shadow .2s}
.spider-page-anchor:hover,.spider-sense-active .spider-page-anchor{opacity:1;scale:1.14;box-shadow:0 0 0 5px #e9475825,0 0 14px #6cb9f38c}.spider-page-anchor span{font-size:12px}.spider-sense-active .spider-page-anchor{animation:spider-anchor-hint 1.6s ease-in-out infinite}
@keyframes spider-anchor-hint{50%{box-shadow:0 0 0 7px #ee405422,0 0 20px #6cb9f3a0}}
.spider-crawl{position:fixed;z-index:6;right:12px;top:38%;width:17px;height:17px;border:0;border-radius:50%;background:#111a28;color:#e8edf4;box-shadow:0 0 0 2px #d8e5f055;cursor:pointer;pointer-events:auto;opacity:.3;animation:spider-crawl-drift 15s linear infinite}
.spider-crawl:after{content:'●';position:absolute;top:1px;left:4px;font-size:7px;color:#e74356}.spider-crawl:hover,.spider-crawl-found{opacity:.9}.spider-crawl-found{animation:spider-found-hop .6s ease-out}
@keyframes spider-crawl-drift{0%,100%{translate:0 0}25%{translate:-17px 11px}55%{translate:12px 23px}80%{translate:-11px -5px}}
@keyframes spider-found-hop{50%{scale:1.7;rotate:25deg}}
.spider-web-ripple{position:fixed;z-index:82;width:18px;height:18px;border:1px solid #eaf4fd;pointer-events:none;border-radius:50%;translate:-50% -50%;animation:spider-ripple .68s ease-out both;box-shadow:0 0 10px #62a9e7}
@keyframes spider-ripple{to{scale:5;opacity:0}}
.spider-sense-glow{opacity:0!important;transition:opacity .22s}.spider-sense-active .spider-sense-glow{opacity:.65!important}
.spider-web-route-transition{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden;animation:spider-route-overlay .78s cubic-bezier(.22,.75,.2,1) both}
.spider-web-route-transition svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.spider-transition-thread,.spider-transition-strand{fill:none;stroke:#dceeff;stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;animation:spider-thread-draw .46s cubic-bezier(.2,.8,.25,1) forwards;filter:drop-shadow(0 0 5px #64b9ff)}
.spider-transition-strand{stroke:#e94859;stroke-width:1.25;animation-delay:.035s;opacity:.92}
.spider-transition-anchor{fill:#ff5363;stroke:#fff;stroke-width:3;opacity:0;transform-box:fill-box;transform-origin:center;animation:spider-anchor-pop .32s .12s ease-out forwards}
.spider-transition-label{position:absolute;top:50%;left:50%;padding:9px 14px;border:1px solid #83b8e876;border-radius:999px;background:#10192be8;color:#f1f7ff;font:850 9px Manrope,sans-serif;letter-spacing:.16em;opacity:0;transform:translate(-50%,-50%) scale(.94);animation:spider-route-label .55s .12s ease-out both}
.spider-route-explore .spider-transition-thread{stroke:#e9f3ff;stroke-width:3}.spider-route-activity .spider-transition-thread{d:path('M-30 350 C160 30 410 40 500 350 S850 670 1030 350')}.spider-route-community .spider-transition-anchor{fill:#54a9ff;animation:spider-nodes-pop .42s .1s ease-out both}.spider-route-community .spider-transition-strand{stroke:#7dbbff}.spider-route-map .spider-transition-thread{stroke:#6dbeff;stroke-width:3}.spider-route-map .spider-transition-anchor{r:14;animation:spider-map-ping .5s .08s ease-out both}.spider-route-profile .spider-transition-thread{d:path('M430 280 C600 250 600 430 430 430 C250 430 260 240 430 280')}.spider-route-profile .spider-transition-anchor{fill:#f2f7ff}.spider-route-list .spider-transition-thread{stroke:#ff5a64;stroke-width:3}
#screen-content.spider-page-enter[data-spider-route]{animation:spider-page-arrive .68s cubic-bezier(.18,.82,.2,1) both}
#screen-content.spider-page-enter[data-spider-route="activity"] .activity-card,#screen-content.spider-page-enter[data-spider-route="explore"] .item-card{animation:spider-card-reveal .38s cubic-bezier(.2,.8,.2,1) both}
@media(max-width:760px), (min-width:761px){.spider-web-backdrop{width:70vw;opacity:.075}.spider-backdrop-a{left:-34vw;top:19vh}.spider-backdrop-b{right:-33vw;bottom:13vh}.spider-web-corner{width:82px;height:82px;opacity:.22;top:56px}.web-bottom-left,.web-bottom-right{top:auto;bottom:70px}.spider-web-corner .spider-web-knot{width:21px;height:21px}.spider-drop{top:82px;right:clamp(15px,12vw,52px)}.spider-drop:before{height:25px}.spider-mascot{width:42px;height:45px}.spider-chibi-art{width:42px;height:48px}.spider-missions-toggle{right:9px;bottom:calc(88px + env(safe-area-inset-bottom));padding:8px 9px;font-size:8px}.spider-missions-toggle>span{display:none}.spider-sense-toggle{left:9px;bottom:calc(88px + env(safe-area-inset-bottom));padding:8px 9px}.spider-mission-panel{right:8px;bottom:calc(130px + env(safe-area-inset-bottom));width:min(350px,calc(100vw - 16px));max-height:58vh;padding:13px}.spider-verse-quote{top:120px;right:9px;font-size:10px}.spider-page-anchor{top:7px;right:7px;width:24px;height:24px}.spider-crawl{right:8px;top:38%;width:14px;height:14px}.spider-web-route-transition{animation-duration:.68s}.spider-transition-label{top:auto;bottom:calc(105px + env(safe-area-inset-bottom));font-size:8px}}
@media(prefers-reduced-motion:reduce){.spider-web-backdrop,.spider-web-corner svg,.spider-drop,.spider-mascot,.spider-web-route-transition,.spider-page-enter,.spider-transition-thread,.spider-transition-strand,.spider-transition-anchor,.spider-transition-label,.spider-crawl,.spider-page-anchor,.spider-mission-pop,.spider-chibi-art{animation:none!important;transition:none!important}.spider-web-route-transition{display:none!important}.spider-web-ripple{display:none}}
.spider-verse-quote{pointer-events:auto;cursor:pointer}
.spider-sense-glow{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle 170px at var(--spider-pointer-x,50vw) var(--spider-pointer-y,50vh),#ec42521b,transparent 100%)}
.spider-sense-active .spider-anchor-host{outline:1px solid #e954634d;outline-offset:3px}

/* Keep the Spider-Verse mission launcher compact; an earlier hero rule set top:126px. */
.spider-missions-toggle{position:fixed!important;top:auto!important;right:20px!important;bottom:calc(102px + env(safe-area-inset-bottom))!important;width:max-content!important;height:auto!important;min-height:0!important;max-height:none!important;white-space:nowrap}
@media(max-width:760px), (min-width:761px){.spider-missions-toggle{top:auto!important;right:9px!important;bottom:calc(88px + env(safe-area-inset-bottom))!important;width:max-content!important;height:auto!important;min-height:0!important;padding:8px 9px;font-size:8px}}
.spider-verse-effects .spider-web-corner .spider-web-knot:focus-visible,.spider-missions-toggle:focus-visible,.spider-sense-toggle:focus-visible,.spider-page-anchor:focus-visible{outline:2px solid #91d4ff;outline-offset:3px}
.spider-swing-transit{position:absolute;left:8%;top:39%;width:44px;height:50px;transform-origin:50% 0;animation:spider-transit-swing .68s cubic-bezier(.2,.7,.2,1) both;filter:drop-shadow(0 5px 12px #0009)}
.spider-swing-transit .spider-chibi-art{width:44px;height:50px}
@keyframes spider-transit-swing{0%{opacity:0;transform:translate3d(-10vw,-3vh,0) rotate(-18deg)}16%{opacity:1}52%{transform:translate3d(42vw,-13vh,0) rotate(28deg)}100%{opacity:0;transform:translate3d(100vw,8vh,0) rotate(54deg)}}
body[data-theme="web-slinger"] .nav-item{position:relative;transition:color .2s,transform .2s}
body[data-theme="web-slinger"] .nav-item:hover{transform:translateY(-2px);color:#b7ddf7}
body[data-theme="web-slinger"] .nav-item.selected:before{content:"";position:absolute;top:-9px;left:50%;width:5px;height:5px;border:1px solid #f16673;border-radius:50%;box-shadow:0 0 0 4px #e743561f,0 0 9px #ff6674;translate:-50% 0}
body[data-theme="web-slinger"] .nav-item.selected:after{content:"";position:absolute;top:-6px;left:50%;width:1px;height:9px;background:linear-gradient(#ff6b79,transparent);pointer-events:none}
@media(max-width:760px), (min-width:761px){.spider-swing-transit{width:32px;height:38px;top:31%}.spider-swing-transit .spider-chibi-art{width:32px;height:38px}.spider-verse-quote{pointer-events:auto}}
@media(prefers-reduced-motion:reduce){.spider-swing-transit{animation:none;display:none}}
.web-top-left{left:0}.web-top-right{right:0}.web-bottom-left{left:0}.web-bottom-right{right:0}
.listing-modal.spider-anchor-host .spider-page-anchor{top:8px;right:8px}
#header-profile.avatar{width:44px;height:44px;min-height:44px;flex:0 0 44px}
.search-row{position:relative}
.irene-love-animation{position:absolute;z-index:20;top:calc(100% + 8px);left:50%;display:grid;justify-items:center;gap:3px;pointer-events:none;animation:irene-love-pop 2.8s ease both}
.irene-love-photo{width:72px;height:72px;border:3px solid #fff;border-radius:50%;object-fit:cover;box-shadow:0 6px 20px #57345455}
.irene-love-heart{position:absolute;top:-15px;right:-12px;color:#ed5276;font-size:30px;text-shadow:0 2px 8px #fff;animation:irene-heartbeat .75s ease-in-out infinite alternate}
.irene-love-name{padding:3px 10px;border-radius:20px;background:#fff;color:#aa426b;font-size:12px;font-weight:700;box-shadow:0 3px 12px #57345433}
@keyframes irene-love-pop{0%{opacity:0;transform:translate(-50%,8px) scale(.7)}15%,75%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-8px) scale(.9)}}
@keyframes irene-heartbeat{to{transform:scale(1.22)}}
@media(prefers-reduced-motion:reduce){.irene-love-animation,.irene-love-heart{animation-duration:.01ms;animation-iteration-count:1}}
@media(max-width:380px), (min-width:761px){.topbar{gap:6px}}
/* Keep the pixel web hero consistent between its hanging and swinging states. */
.spider-drop{top:82px;right:clamp(12px,4vw,34px);animation:spider-idle 3.2s ease-in-out infinite}
.spider-drop:before{height:20px;width:1px;background:#d8eaff;box-shadow:0 0 5px #8de8df88}
.spider-mascot{width:36px;height:56px;transform:none;transform-origin:50% 0}
.spider-chibi-art{width:36px;height:56px;image-rendering:pixelated;filter:drop-shadow(0 2px 3px #0009)}
.spider-web-descender .spider-chibi-art{width:32px;height:52px;transform:none;image-rendering:pixelated}
.spider-swing-transit{width:36px;height:56px;left:8%;top:33%;transform-origin:50% 0}
.spider-swing-transit .spider-hero-art{width:36px;height:56px;image-rendering:pixelated}
@media(max-width:760px), (min-width:761px){.spider-drop{top:76px;right:16px}.spider-mascot,.spider-chibi-art{width:32px;height:52px}.spider-swing-transit,.spider-swing-transit .spider-hero-art{width:32px;height:52px}.spider-web-descender .spider-chibi-art{width:28px;height:46px}}
@media(max-width:760px), (min-width:761px){.friends-page-pal{bottom:calc(73px + env(safe-area-inset-bottom))}}
@media(max-width:760px) and (max-height:500px) and (max-height:500px), (min-width:761px) and (max-height:500px) and (max-height:500px){.friends-page-pal{right:8px;bottom:calc(73px + env(safe-area-inset-bottom))}.friends-hunt-egg{top:calc(62px + env(safe-area-inset-top) + 8px);right:auto;left:8px}.friends-character-rail{display:none}}
#screen-content .listing-grid:has(> .empty-state){grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:minmax(0,1fr);overflow-x:visible;overscroll-behavior-x:auto;scroll-snap-type:none;scroll-padding-inline:0}
#screen-content .listing-grid:has(> .empty-state)>.empty-state{grid-column:1;width:min(100%,900px);min-width:0;justify-self:center}
@media (min-width:761px){
  .app-shell{width:100%;max-width:1440px;margin-inline:auto}
  .bottom-nav{left:0;right:0;width:100%;max-width:1440px;transform:none;margin-inline:auto}
}