@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#171b18;background:#f5f6f3;font-size:14px}*{box-sizing:border-box}html,body{overflow-x:hidden;width:100%;max-width:100vw}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #89caa5;outline-offset:2px}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2,h3,strong{font-family:Manrope,sans-serif}header{height:82px;background:#fff;display:flex;align-items:center;gap:32px;padding:0 4%;border-bottom:1px solid #e7e9e5;position:sticky;top:0;z-index:5}.brand{font:800 33px Manrope;letter-spacing:-2px;width:157px}.brand span{color:#2ab46a}.header-search{width:260px;padding:13px 15px;border-radius:11px;background:#f5f6f4;text-align:left;color:#939a94;font-size:11px;display:flex;align-items:center;gap:10px}.header-search>span{font-size:22px;color:#515a52}.header-search kbd{margin-left:auto;font-size:9px;background:white;border:1px solid #e4e7e3;border-radius:4px;padding:3px}.main-nav{display:flex;align-items:center;gap:8px;margin:auto}.nav-icon{height:42px;min-width:42px;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:10px;color:#858e87;transition:all .2s}.nav-icon span{font-size:23px}.nav-icon b{max-width:0;overflow:hidden;white-space:nowrap;font-size:11px;transition:max-width .2s}.nav-icon:hover,.nav-icon.active{color:#19211b;background:#edf4ed;padding:0 15px}.nav-icon:hover b,.nav-icon.active b{max-width:90px}.header-actions{display:flex;align-items:center;gap:10px}.icon-btn{position:relative;font-size:22px;width:38px;height:38px;color:#4b554d}.icon-btn i{position:absolute;right:2px;top:0;border-radius:50%;background:#27af69;color:#fff;font:10px sans-serif;padding:3px 5px}.account{display:flex;align-items:center;gap:10px;text-align:left;font-size:11px;font-weight:700;border-left:1px solid #e7eae7;padding-left:18px}.account small{display:block;font-weight:400;color:#909a92;margin-top:4px;font-size:10px}.avatar{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#d7e6d8;color:#49604d;font-weight:700;font-size:12px;object-fit:cover;flex-shrink:0}.avatar.sm{width:36px;height:36px}.avatar.xl{width:95px;height:95px;border:5px solid white;font-size:25px}.layout{max-width:1600px;margin:auto;display:grid;grid-template-columns:185px minmax(0,750px) 245px;gap:32px;padding:34px 4% 80px}.sidebar{position:sticky;top:117px;align-self:start}.side-label{font-size:9px;letter-spacing:1.5px;font-weight:700;color:#a5aca6;margin:8px 0 16px 12px;display:flex;justify-content:space-between}.side-label span{color:#28ad67;font-size:16px}.side-label.lower{margin-top:32px}.side-item{width:100%;display:flex;align-items:center;gap:12px;padding:13px 12px;border-radius:10px;text-align:left;font-size:12px;color:#68726a}.side-item span{font-size:19px;width:21px;text-align:center}.side-item i{font-style:normal;margin-left:auto;color:#b2bbb2}.side-item.selected{background:#e6eee6;color:#202820;font-weight:700}.side-bottom{border-top:1px solid #e1e6df;margin:120px 12px 0;padding-top:23px}.side-bottom>span{display:block;font-size:26px;color:#6d9473;margin-bottom:10px}.side-bottom strong{font-size:12px}.side-bottom p{font-size:11px;color:#929b93;line-height:1.6;margin:7px 0 26px}.side-bottom small{font-size:9px;color:#b0b8b0;letter-spacing:.6px}main{min-width:0}.hero{height:292px;border-radius:20px;background:#e2ede1;position:relative;overflow:hidden;display:flex}.hero-content{padding:37px 40px;position:relative;z-index:1;width:68%}.eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:700;color:#719376}.eyebrow i{font-style:normal;color:#4e8d5a;margin-left:8px}.hero h1{font-size:35px;line-height:1.16;letter-spacing:-1.8px;margin:16px 0 12px;color:#24372a}.hero p{font-size:11px;line-height:1.8;color:#6c8270;max-width:330px}.hero-button,.black-button{margin-top:22px;background:#202923;color:#fff;border-radius:9px;padding:12px 15px;font-size:10px;font-weight:700}.hero-button span{margin-left:15px}.hero-art{position:absolute;right:0;top:0;width:43%;height:100%}.orbit{position:absolute;border:1px solid #acc9ae;border-radius:100%;width:260px;height:260px;right:-8px;top:15px}.orbit.two{width:190px;height:190px;right:28px;top:50px}.art-circle{position:absolute;display:grid;place-items:center;border-radius:100%;font-size:45px}.art-circle.a{background:#acc7ad;width:115px;height:115px;top:65px;right:70px;color:#577d5c}.art-circle.b{background:#f5e4bf;width:61px;height:61px;top:24px;right:5px;font-size:26px;color:#b89551}.art-circle.c{background:#f3f5e9;width:52px;height:52px;bottom:32px;right:35px;font-size:27px;color:#719779}.art-sticker{position:absolute;top:152px;right:153px;background:#202a22;color:white;padding:12px;border-radius:6px;transform:rotate(-9deg);font-size:8px;font-weight:700;line-height:1.5;letter-spacing:1px}.section-title{display:flex;align-items:end;justify-content:space-between;margin:38px 0 19px}.section-title h2{font-size:21px;letter-spacing:-.8px;margin:7px 0}.section-title p,.page-top p{font-size:11px;color:#929b93}.filter-pill{background:white;border:1px solid #e7ebe5;border-radius:9px;padding:10px 12px;font-size:10px;color:#6f7870}.card{background:#fff;border:1px solid #e8ebe7;border-radius:16px}.post{padding:22px;margin-bottom:16px}.post-head{display:flex;align-items:center;gap:11px}.page-avatar{width:42px;height:42px;border-radius:13px;background:#25352a;color:#fff;display:inline-grid;place-items:center;font:700 20px Georgia;flex-shrink:0}.post-head strong,.suggestion strong,.person strong{font-size:12px}.post-head small,.suggestion small,.person small{display:block;font-size:9px;color:#a1a9a2;letter-spacing:.4px;margin-top:5px}.dots{margin-left:auto;font-size:22px;letter-spacing:2px}.post>p{font-size:12px;line-height:1.8;color:#4f5b51;margin:18px 0}.post-art{height:200px;background:#dce8d8;border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:30px 45px;overflow:hidden}.post-art span{font-size:9px;letter-spacing:2px;color:#759778}.post-art strong{display:block;font:700 39px/1.05 Manrope;letter-spacing:-2px;color:#334e38;margin-top:12px}.post-art strong em{font-family:Georgia;font-weight:400}.post-art .asterisk{font-size:130px;color:#94b799}.post-meta{display:flex;justify-content:space-between;border-bottom:1px solid #eef0ed;color:#a2aaa3;font-size:10px;padding:17px 0}.comment-form,#message-form{display:flex;align-items:center;gap:8px;margin-top:13px;background:#f6f7f5;border-radius:9px;padding:3px 8px}.comment-form input,#message-form input{flex:1;min-width:0;border:0;background:none;padding:10px;font-size:11px;outline:none}.comment-form button,#message-form button{background:#e1eee3;border-radius:7px;width:30px;height:30px}.comment-list p{font-size:11px;color:#526055;padding:8px;background:#f7f8f6;border-radius:8px;margin-top:8px}.right{position:sticky;top:116px;align-self:start}.right-top{display:flex;justify-content:space-between;align-items:end;margin:8px 0 22px}.right-top h3{font-size:14px;margin-top:7px}.right-top button{font-size:10px;color:#828b82}.suggestion{display:flex;align-items:center;gap:10px;margin-bottom:18px}.suggestion>div{flex:1}.suggestion button{width:29px;height:29px;border:1px solid #e0e7df;border-radius:9px;font-size:18px}.right-card{background:#242d25;color:white;padding:24px;border-radius:15px;margin-top:36px;position:relative;overflow:hidden}.right-card:after{content:'✳';position:absolute;font-size:95px;color:#3d4e3e;right:-18px;bottom:-35px}.right-card>span{font-size:8px;letter-spacing:1px;color:#a5c5a8}.right-card h3{font-size:19px;line-height:1.35;letter-spacing:-.6px;margin-top:25px}.right-card p{font-size:10px;line-height:1.7;color:#a1b0a3;margin:10px 0 21px}.right-card button{background:#d8ead7;border-radius:7px;padding:10px;font-size:10px;font-weight:700;position:relative;z-index:1}.right-footer{font-size:9px;color:#aeb6ae;line-height:2;margin-top:27px}.mobile-nav{display:none}.bot-button{position:fixed;bottom:18px;right:18px;background:#202a22;color:white;border-radius:30px;padding:10px 14px;z-index:4;font-size:11px}.bot-button span{margin-left:4px}.page-top{margin:0 0 25px}.page-top>button,.back{color:#828c82;font-size:11px;margin-bottom:25px;padding:0}.page-top .eyebrow{display:block;margin-bottom:10px}.page-top h1{font-size:34px;letter-spacing:-1.5px;margin-bottom:8px}.tabs{display:flex;gap:8px;margin:20px 0}.tabs button{padding:10px 14px;border-radius:9px;font-size:11px;color:#7d887e}.tabs button.on,.tabs button:hover{background:#202923;color:white}.empty{text-align:center;padding:65px 20px;color:#98a198}.empty>span{display:block;font-size:42px;color:#a7c3a9}.empty h3{color:#344137;font-size:17px;margin:12px 0}.empty p{font-size:11px;margin:10px 0}.person{display:flex;align-items:center;gap:12px;padding:18px;margin-bottom:10px;background:white;border:1px solid #e8ebe7;border-radius:14px}.person-main{display:flex;align-items:center;gap:12px;text-align:left;flex:1;min-width:0}.person-main em{font-style:normal;display:block;color:#7b9980;font-size:10px;margin-top:7px}.person-buttons{display:flex;gap:6px}.person-buttons button,.person>button,.profile-actions button,.modal-actions button{border:1px solid #e1e7e1;border-radius:8px;padding:9px 12px;font-size:10px;font-weight:700}.person-buttons button:first-child{background:#ecf5eb;color:#408453;border:0}.grow{flex:1}.grow small{display:block;font-size:10px;color:#929b93;margin-top:5px}.profile-cover{height:150px;background:#dceadc;border-radius:16px 16px 0 0;padding:30px;color:#7c9e80;letter-spacing:1px;font-size:10px}.profile-cover span{float:right;font-size:60px}.profile{padding:0 25px 30px;border-radius:0 0 16px 16px}.profile>.avatar{margin-top:-45px}.profile h1{margin-top:15px}.profile p{color:#8b968c;font-size:12px;line-height:1.8;margin-top:10px}.profile-actions{float:right;margin-top:16px;display:flex;gap:8px}.chips{display:flex;gap:7px;flex-wrap:wrap;margin:18px 0}.chips span,.chips button{background:#eff5ee;border-radius:20px;padding:7px 12px;font-size:10px;color:#638367}.settings{padding:28px;display:flex;flex-direction:column;gap:16px}.settings h3{font-size:14px;margin-top:10px}.settings label,dialog label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:600;color:#69766b}.settings input[type=checkbox]{width:auto}.settings input,.settings select,dialog input,dialog textarea,dialog select{width:100%;border:1px solid #e0e7df;border-radius:9px;background:#fafbf9;padding:12px;font-size:12px;color:#273329}.green{background:#26ac65!important;color:white!important;border:0!important;border-radius:9px;padding:12px 16px;font-size:11px;font-weight:700}.full{width:100%}.messaging{display:grid;grid-template-columns:200px 1fr;min-height:420px;overflow:hidden}.contacts{border-right:1px solid #ecefeb;padding:18px}.contacts h3{font-size:13px}.contacts p{font-size:11px;color:#a0aaa1;margin-top:20px}.contacts button{width:100%;display:flex;gap:8px;align-items:center;text-align:left;font-size:11px;padding:12px 0}.chat{display:flex;flex-direction:column}.chat-head{display:flex;align-items:center;gap:10px;padding:14px;border-bottom:1px solid #eef1ed}.chat-head strong{flex:1;font-size:12px}.chat-body{flex:1;padding:18px}.bubble{background:#f1f4f0;padding:12px;border-radius:12px;font-size:11px;width:max-content;max-width:80%;margin-bottom:8px}.bubble.mine{background:#e0f1e2;margin-left:auto}.chat form{margin:10px}.chat .empty{margin:auto}dialog{width:min(490px,calc(100% - 24px));border:0;border-radius:20px;padding:28px;box-shadow:0 30px 90px #192a1a33;color:#202b22;max-height:90vh;overflow:auto}dialog::backdrop{background:#15221999;backdrop-filter:blur(3px)}dialog h2{font-size:25px;letter-spacing:-1px;margin:12px 0}dialog form{display:flex;flex-direction:column;gap:15px;margin-top:20px}dialog textarea{min-height:100px;resize:vertical}.subtle{color:#97a198;font-size:12px;line-height:1.7}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.choice,.notice{border:1px solid #edf0ec;border-radius:10px;padding:15px;margin:10px 0;font-size:12px}.choice span{float:right;color:#a1aaa2;font-size:10px}.modal-actions{display:flex;gap:8px}.modal-actions button{flex:1}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#202a22;color:white;border-radius:9px;padding:12px 18px;font-size:12px;opacity:0;transition:.2s;z-index:20;pointer-events:none}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1150px){.layout{grid-template-columns:165px minmax(0,750px);max-width:1000px}.right{display:none}.brand{width:auto}.header-search{width:220px}}@media(max-width:700px){header{height:68px;padding:0 15px;gap:12px}.brand{font-size:28px}.header-search{flex:1;width:auto;padding:10px;font-size:10px}.header-search kbd,.main-nav,.header-actions .icon-btn,.account span:not(.avatar){display:none}.account{padding-left:0;border:0}.layout{display:block;padding:18px 14px 100px}.sidebar{display:none}.hero{height:270px}.hero-content{padding:28px 22px;width:75%}.hero h1{font-size:29px}.hero p{font-size:10px;max-width:230px}.hero-art{opacity:.65;right:-50px}.art-sticker{display:none}.section-title{margin:28px 0 16px}.section-title h2{font-size:19px}.post{padding:17px}.post-art{height:160px;padding:22px}.post-art strong{font-size:30px}.post-art .asterisk{font-size:90px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #e8ece7;z-index:5;justify-content:space-around;padding:7px 4px calc(7px + env(safe-area-inset-bottom))}.mobile-nav .nav-icon{flex:1;flex-direction:column;gap:0;height:45px}.mobile-nav .nav-icon b{max-width:80px;font-size:9px}.mobile-nav .nav-icon span{font-size:20px}.mobile-nav .nav-icon.active{padding:0}.bot-button{bottom:73px;right:12px}.bot-button span{display:none}.person{flex-wrap:wrap}.person-main{min-width:65%}.person-buttons{margin-left:55px}.messaging{grid-template-columns:95px 1fr}.contacts{padding:10px}.contacts button{flex-direction:column;text-align:center}.contacts h3{font-size:10px}.profile-actions{float:none;margin-top:12px}.page-top h1{font-size:29px}#toast{bottom:78px}}
/* Profile setup stays usable on narrow screens and with long interest labels. */
.onboarding { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.onboarding form, .onboarding label { min-width: 0; }
.onboarding input, .onboarding select, .onboarding textarea { max-width: 100%; box-sizing: border-box; }
.onboarding-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding: .55rem; border: 1px solid #d7e5d8; border-radius: 14px; background: #fff; }
.onboarding-tags input { flex: 1 1 9rem; min-width: 0; border: 0; padding: .35rem; }
.onboarding-tag { display: inline-flex; align-items: center; max-width: 100%; overflow-wrap: anywhere; border-radius: 999px; padding: .2rem .45rem .2rem .65rem; background: #e8f7ec; color: #276841; }
.onboarding-tag button { border: 0; background: transparent; color: inherit; padding: .15rem .35rem; }
.onboarding-show-password { display: flex; align-items: center; gap: .5rem; }
.onboarding-show-password input { width: auto; }
.reputation-badge { display:inline-block; max-width:100%; vertical-align:middle; padding:.15rem .48rem; border-radius:999px; font-size:.67rem; font-weight:700; line-height:1.4; white-space:normal; background:#f0f2ef; color:#616d63; }
.reputation-contributor { background:#eff6ff; color:#1d4ed8; }
.reputation-expert { background:#ecfdf5; color:#047857; }
.reputation-mentor { background:#f5f3ff; color:#6d28d9; }
.reputation-master { background:#fefce8; color:#b45309; }
.reputation-legend { background:linear-gradient(120deg,#ef4444,#f97316); color:white; }
.person-main > span,.chat-identity,.post-head > div { min-width:0; overflow-wrap:anywhere; }
.country-scope { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:1rem 0; min-width:0; }
.country-scope button,.country-scope label { border:1px solid #dbe8db; background:#fff; border-radius:14px; padding:.55rem .7rem; }
.country-scope button[aria-pressed="true"] { background:#e4f7e9; border-color:#8dcf9b; color:#285d38; }
.country-scope label { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; min-width:0; }
.country-scope select { max-width:100%; min-width:0; border:0; background:transparent; }
.country-scope small { width:100%; color:#66776b; }
.profile-actions { flex-wrap:wrap; max-width:100%; }
.profile .profile-portfolio-button { display:flex; align-items:center; gap:12px; width:min(100%, 360px); margin-top:18px; padding:13px 16px; border:1px solid #a8dcb5; border-radius:14px; background:#f1faf3; color:#286b40; text-align:left; font-size:14px; cursor:pointer; }
.profile .profile-portfolio-button > span:nth-child(2) { display:grid; flex:1; gap:3px; min-width:0; }
.profile .profile-portfolio-button small { color:#668c70; font-size:11px; font-weight:400; }
.profile .profile-portfolio-button:hover:not(:disabled) { background:#e1f5e6; border-color:#62be7a; }
.profile .profile-portfolio-button:focus-visible, .profile-preview-banner button:focus-visible { outline:2px solid #169655; outline-offset:3px; }
.profile-preview-banner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:16px; padding:14px 16px; border:1px solid #bce3c3; border-radius:14px; background:#edf8ef; color:#245d38; }
.profile-preview-banner div { display:grid; gap:3px; }
.profile-preview-banner small { color:#597a61; }
.profile-preview-banner button { padding:9px 12px; border-radius:10px; background:#fff; border:1px solid #c7e4ce; font-weight:700; }
.profile-posts[data-preview-public="true"] button, .profile-posts[data-preview-public="true"] input { pointer-events:none; }
.post-link-cards { display:grid; gap:8px; margin:10px 0; min-width:0; }
.post-link-card { display:flex; align-items:stretch; gap:12px; min-width:0; overflow:hidden; border:1px solid #ddebe0; border-radius:14px; background:#f7fbf7; color:#214b31; text-decoration:none; }
.post-link-card:hover { border-color:#8ecfa0; }
.post-link-card img { width:112px; min-height:70px; object-fit:cover; flex:none; }
.post-link-card > span { display:grid; gap:4px; padding:10px; min-width:0; }
.post-link-card small { color:#4e9867; font-weight:700; }
.post-link-card strong, .post-link-card span span { overflow-wrap:anywhere; }
.post-link-card span span { color:#7a9180; font-size:11px; }
.poll-builder { border:1px solid #dcebdd; border-radius:12px; padding:12px; }
.poll-builder summary { cursor:pointer; color:#337149; font-weight:700; }
.poll-builder label { margin-top:10px; }
.post-poll { display:grid; gap:10px; margin:14px 0; padding:14px; border:1px solid #e0eee3; border-radius:14px; background:#f9fcf9; color:#244c32; }
.poll-options { display:grid; gap:7px; }
.poll-options button { position:relative; display:flex; justify-content:space-between; gap:10px; overflow:hidden; width:100%; padding:10px; border:1px solid #dcebdd; border-radius:10px; background:white; text-align:left; }
.poll-options button[aria-pressed="true"] { border-color:#45aa68; }
.poll-meter { position:absolute; inset:0 auto 0 0; background:#e0f5e5; pointer-events:none; }
.poll-option-label, .poll-option-count { position:relative; overflow-wrap:anywhere; }
.post-poll small { color:#6b8572; }
.message-edit { font-size:13px; color:#617f6b; margin-left:8px; padding:2px 5px; }
.message-edited { display:block; margin-top:3px; color:#78907c; font-size:10px; }
.avatar.streak-fire { outline:2px solid #ff9a34; outline-offset:2px; box-shadow:0 0 0 4px #ffdc8766,0 0 18px #ff6a3caa; animation:streak-glow 1.8s ease-in-out infinite alternate; }
.activity-streak { display:inline-flex; gap:3px; margin-top:9px; padding:5px 9px; border-radius:999px; background:#fff3e5; color:#a95718; font-size:11px; font-weight:700; }
.activity-streak small { color:#b77b4b; font-size:10px; }
@keyframes streak-glow { from { box-shadow:0 0 0 3px #ffdc8766,0 0 9px #ff8a3c88; } to { box-shadow:0 0 0 5px #ffdc8799,0 0 20px #ff633caa; } }
@media (prefers-reduced-motion:reduce) { .avatar.streak-fire { animation:none; } }
.identity-switcher { position:relative; }
.identity-switcher > summary { display:grid; place-items:center; width:30px; height:30px; border:1px solid #dfeae0; border-radius:10px; background:#f5faf5; color:#39714b; cursor:pointer; list-style:none; }
.identity-switcher > summary::-webkit-details-marker { display:none; }
.identity-menu { position:absolute; z-index:50; top:calc(100% + 8px); right:0; width:min(300px,calc(100vw - 24px)); max-height:min(60vh,400px); overflow-y:auto; padding:10px; border:1px solid #dceadd; border-radius:14px; background:#fff; box-shadow:0 14px 35px #1d452121; }
.identity-menu > strong { display:block; color:#708577; padding:6px 8px; font-size:11px; }
.identity-menu button { display:grid; grid-template-columns:1fr auto; width:100%; gap:3px 8px; padding:10px; border-radius:9px; text-align:left; }
.identity-menu button small { grid-column:1; color:#708577; }
.identity-menu button:hover, .identity-menu button[aria-current="true"] { background:#edf8ef; }
.identity-switcher summary:focus-visible, .identity-menu button:focus-visible { outline:2px solid #18995a; outline-offset:2px; }
.industry-suggestions { margin-top:28px; padding:16px; border:1px solid #e2eee3; border-radius:15px; background:#f9fcf9; }
.industry-suggestions h3 { margin:7px 0; color:#254d34; }
.industry-suggestions p { color:#718778; font-size:11px; line-height:1.5; }
.industry-suggestions button { display:grid; grid-template-columns:1fr auto; width:100%; gap:3px 8px; padding:9px 0; border-top:1px solid #e7efe8; text-align:left; }
.industry-suggestions button small { grid-column:1; color:#698275; }
.industry-suggestions button span { grid-column:2; grid-row:1 / span 2; align-self:center; color:#3c9b60; }
.notification-tabs { display:flex; gap:6px; overflow-x:auto; margin:14px 0; }
.notification-tabs button { flex:0 0 auto; padding:9px 11px; border:1px solid #e0eae1; border-radius:999px; color:#54725b; font-size:12px; }
.notification-tabs button[aria-pressed="true"] { background:#e3f7e8; border-color:#93d2a2; color:#236c3d; font-weight:700; }
.notification-tabs button span { color:#b32e38; }
.bell-new { animation:notification-bell .55s ease-in-out; }
@keyframes notification-bell { 20% { transform:rotate(-12deg); } 45% { transform:rotate(12deg); } 70% { transform:rotate(-6deg); } }
@media (prefers-reduced-motion:reduce) { .bell-new { animation:none; } }
.feed-skeleton { display:grid; gap:10px; padding:18px; margin:12px 0; border-radius:16px; background:#f4f7f4; }
.feed-skeleton[hidden] { display:none; }
.feed-skeleton span { height:14px; border-radius:8px; background:linear-gradient(90deg,#e6ece7,#f5f8f5,#e6ece7); background-size:200% 100%; animation:feed-skeleton-shimmer 1.4s ease-in-out infinite; }
.feed-skeleton span:nth-child(2) { width:85%; }.feed-skeleton span:nth-child(3) { width:58%; }
@keyframes feed-skeleton-shimmer { to { background-position:-200% 0; } }
@media (prefers-reduced-motion:reduce) { .feed-skeleton span { animation:none; } }
.event-quick-filters { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.event-quick-filters button { border:1px solid #dcebdd; border-radius:999px; padding:9px 13px; background:#fff; color:#4d6e56; font-size:12px; font-weight:700; }
.event-quick-filters button[aria-pressed="true"] { background:#dff5e5; border-color:#79c98e; color:#236d3d; }
.event-quick-filters button:focus-visible { outline:2px solid #18995a; outline-offset:3px; }
.event-discovery.card { padding:20px; margin:16px 0; min-width:0; }
.event-discovery-heading { display:flex; align-items:flex-start; gap:10px; }
.event-discovery-heading > span { color:#39a96a; font-size:22px; }
.event-discovery h2 { margin:0; font-size:18px; }
.event-discovery p { color:#708577; font-size:12px; line-height:1.5; }
.event-discovery-list { display:grid; gap:8px; margin-top:14px; }
.event-discovery-item { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #e7efe8; border-radius:12px; color:inherit; text-decoration:none; min-width:0; }
.event-discovery-item:hover { border-color:#9bd4ab; background:#f8fcf8; }
.event-discovery-item > span:nth-child(2) { flex:1; min-width:0; display:grid; gap:5px; overflow-wrap:anywhere; }
.event-discovery-item small { color:#708577; }
.event-discovery-date { font-size:11px; font-weight:700; color:#328453; white-space:nowrap; }
.event-item-tags { display:flex; flex-wrap:wrap; gap:4px; margin:4px 0; }
.event-item-tags span { padding:3px 7px; border-radius:999px; background:#ebf8ee; color:#2d8150; font-size:10px; font-weight:700; }
.event-source-list { border-top:1px solid #eaf0ea; margin-top:14px; padding-top:14px; font-size:12px; }
.event-source-list > div { display:flex; flex-wrap:wrap; gap:8px; }
.event-source-list a { padding:7px 10px; border-radius:10px; color:#34704b; background:#f0f8f1; text-decoration:none; }
@media (max-width:480px) { .event-discovery-item { align-items:flex-start; flex-wrap:wrap; } .event-discovery-item > span:nth-child(2) { flex-basis:65%; } }
.profile-posts.card { background:transparent; border:0; border-radius:0; box-shadow:none; padding:0; margin-top:24px; min-width:0; }
.profile-posts > h2 { margin:0 0 12px; }
.qa-author-link { appearance:none; border:0; padding:0; background:none; color:inherit; font:inherit; cursor:pointer; text-align:left; }
.qa-author-link:hover { text-decoration:underline; }
.qa-author-link:focus-visible { outline:2px solid #258654; outline-offset:2px; }
.post-author-name { border:0; padding:0; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.post-author-name:hover { text-decoration:underline; }
.post-author-avatar { border:0; padding:0; cursor:pointer; flex-shrink:0; }
.post-author-name:focus-visible, .post-author-avatar:focus-visible { outline:2px solid #18995a; outline-offset:3px; }
.post-author-link, .search-post-open { border:0; padding:0; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.post-author-link { display:flex; align-items:center; gap:8px; }
.post-author-link:hover strong { text-decoration:underline; }
.search-post-open { display:flex; width:100%; flex-direction:column; gap:.4rem; }
.post-author-link:focus-visible, .search-post-open:focus-visible { outline:2px solid #18995a; outline-offset:3px; }
.share-card-preview { display:block; width:min(100%, 330px); height:auto; margin:16px auto; border-radius:16px; box-shadow:0 8px 28px #173b211c; }
.share-card-actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.share-card-actions button { flex:1 1 140px; border:1px solid #d6e8da; border-radius:12px; padding:10px; background:#f4faf4; color:#285d38; cursor:pointer; }
.share-platforms { display:grid; gap:8px; margin:14px 0; color:#3a6648; font-size:12px; }
.share-platforms > div { display:flex; flex-wrap:wrap; gap:7px; }
.share-platforms button { padding:8px 10px; border:1px solid #d9eadc; border-radius:999px; background:#fff; color:#315b3d; font-size:12px; }
.share-platforms small { color:#7a9280; }
.share-profile-link { display:grid; gap:6px; margin:12px 0; min-width:0; }
.share-profile-link input { width:100%; min-width:0; }
.portfolio-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:16px; }
.portfolio-card { overflow:hidden; min-width:0; }
.portfolio-card > img { display:block; width:100%; max-height:260px; object-fit:cover; }
.portfolio-content { padding:18px; min-width:0; }
.portfolio-content h3 { margin:10px 0; overflow-wrap:anywhere; }
.portfolio-content p { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.5; }
.portfolio-links, .portfolio-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.portfolio-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.portfolio-tags span { padding:5px 9px; border-radius:999px; background:#eef8f0; color:#427451; font-size:11px; overflow-wrap:anywhere; }
.portfolio-filters { display:flex; flex-wrap:wrap; align-items:end; gap:10px; margin:0 0 18px; padding:14px; border:1px solid #e1eee2; border-radius:16px; background:#fbfdfb; }
.portfolio-filters label { display:grid; flex:1 1 130px; gap:5px; color:#597563; font-size:11px; font-weight:700; min-width:0; }
.portfolio-filters input, .portfolio-filters select { box-sizing:border-box; min-width:0; width:100%; border:1px solid #dce9dc; border-radius:10px; background:white; padding:9px; font-size:12px; }
.portfolio-filters button { min-height:36px; padding:8px 12px; border-radius:10px; background:#e7f6eb; color:#276b40; font-weight:700; font-size:12px; }
.portfolio-links a, .portfolio-actions button { border:1px solid #dce9dc; border-radius:12px; padding:8px 11px; color:#285d38; background:#f5faf4; cursor:pointer; }
.portfolio-actions button[aria-pressed="true"] { background:#dff5e5; border-color:#7fc993; }
.portfolio-hero { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:28px; margin-bottom:24px; border:1px solid #d5eade; border-radius:24px; background:linear-gradient(125deg,#effaf0,#f8f5ea); }
.portfolio-hero h1 { font-size:clamp(30px,4vw,46px); margin:8px 0; color:#193b2b; }
.portfolio-hero p { color:#607a68; line-height:1.5; max-width:440px; }
.portfolio-create { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:3px 12px; min-width:220px; padding:16px 20px; border:0; border-radius:17px; background:#1ba763; color:white; text-align:left; cursor:pointer; box-shadow:0 8px 20px #16884930; }
.portfolio-create span { grid-row:span 2; font-size:30px; line-height:1; }
.portfolio-create strong { font-size:15px; }
.portfolio-create small { color:#e4f8e9; }
.portfolio-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.portfolio-card { display:flex; flex-direction:column; border-radius:18px; }
.portfolio-cover { aspect-ratio:4/5; background:linear-gradient(145deg,#dff3e3,#f7e9df); display:grid; place-items:center; overflow:hidden; }
.portfolio-cover img { width:100%; height:100%; object-fit:cover; }
.portfolio-cover span { font-size:64px; color:#8ebf9a; }
.portfolio-content { display:flex; flex:1; flex-direction:column; }
.portfolio-content p { font-size:13px; }
.portfolio-actions { margin-top:auto; padding-top:14px; }
.portfolio-actions button { font-size:12px; }
.portfolio-comment-panel { border-top:1px solid #e3ede4; margin-top:14px; padding-top:12px; min-width:0; }
.portfolio-comment { background:#f5f9f5; border-radius:12px; padding:10px; margin:8px 0; overflow-wrap:anywhere; }
.portfolio-comment p { margin:5px 0; }
.portfolio-standout { display:inline-flex; align-items:center; border-radius:999px; padding:6px 9px; background:#fff5d6; color:#805300; font-size:12px; font-weight:700; white-space:nowrap; }
.portfolio-strengths { overflow-wrap:anywhere; font-size:13px; line-height:1.45; }
.portfolio-strengths strong { display:inline-block; margin-right:5px; color:#39754e; }
.portfolio-score-help { font-size:12px; color:#657769; margin:6px 0 12px; }
.jobs-hero { padding:26px; border-radius:22px; background:linear-gradient(135deg,#e5f7eb,#f9f5e7); margin-bottom:16px; }
.jobs-hero h1 { margin:8px 0; font-size:clamp(24px,4vw,34px); }
.jobs-hero p { color:#52695a; line-height:1.5; }
.jobs-filters { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); gap:12px; padding:16px; margin-bottom:16px; }
.jobs-filters label { display:flex; flex-direction:column; gap:6px; min-width:0; font-size:12px; font-weight:700; }
.jobs-filters input,.jobs-filters select { width:100%; min-width:0; }
.jobs-filter-actions,.job-actions,.job-tags { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.jobs-count { color:#647568; font-weight:700; }
.jobs-list { display:grid; gap:14px; }
.job-card { padding:20px; min-width:0; overflow-wrap:anywhere; }
.job-card-head { display:flex; justify-content:space-between; align-items:start; gap:12px; }
.job-card-head h2 { margin:7px 0 12px; font-size:20px; }
.job-company { color:#547363; font-size:12px; }
.job-tags span { background:#edf6ed; border-radius:999px; padding:6px 10px; color:#365e41; font-size:12px; }
.job-description { white-space:pre-wrap; line-height:1.55; }
.job-image { width:100%; max-height:300px; object-fit:contain; border-radius:12px; margin-top:12px; }
.job-actions button { border-radius:10px; padding:9px 12px; }
.job-safety { display:block; margin-top:14px; color:#697b6c; }
.saved-logins { margin-top:18px; padding-top:16px; border-top:1px solid #e4ece5; }
.saved-logins h3 { margin:0 0 6px; font-size:16px; }
.saved-logins p { color:#657568; font-size:12px; line-height:1.5; }
.saved-login-list { display:grid; gap:8px; margin-top:10px; }
.saved-login-list > div { display:flex; gap:8px; min-width:0; }
.saved-login-list > div > button:first-child { flex:1; min-width:0; display:flex; justify-content:space-between; gap:10px; text-align:left; padding:10px; border:1px solid #dce8dc; border-radius:10px; background:#f8fbf7; cursor:pointer; }
.saved-login-list strong { overflow-wrap:anywhere; }
.saved-login-list small { color:#6c7a70; white-space:nowrap; }
#company-verification-form [data-company-results] { display:grid; gap:6px; max-height:240px; overflow:auto; margin:8px 0; }
#company-verification-form [data-company-results] button { min-width:0; display:flex; flex-direction:column; align-items:start; gap:3px; text-align:left; padding:10px 12px; border:1px solid #dfebdf; border-radius:12px; background:#f7fbf7; cursor:pointer; overflow-wrap:anywhere; }
#company-verification-form [data-company-results] button:hover { background:#e9f7ec; border-color:#88c59d; }
#company-verification-form [data-company-results] small { color:#617969; }
.company-search-fallback { font-size:12px; }
.company-manual { margin:12px 0; padding:12px; border:1px solid #e0eae0; border-radius:14px; background:#fbfdf9; }
.company-manual summary { cursor:pointer; color:#247d4b; font-weight:700; }
.company-manual p { line-height:1.45; }
.company-review-row { margin-top:10px; padding:10px; border:1px solid #e2ebe1; border-radius:10px; overflow-wrap:anywhere; }
.company-demo-banner { margin:0 0 12px; padding:10px 14px; border:1px solid #f2c86c; border-radius:12px; background:#fff7dc; color:#704b00; font-weight:700; line-height:1.4; }
@media(max-width:700px){.jobs-hero,.job-card { padding:16px; }.jobs-filters { grid-template-columns:1fr 1fr; }.jobs-filter-actions { grid-column:1/-1; }.job-card-head { flex-wrap:wrap; }}
@media(max-width:360px){.jobs-filters { grid-template-columns:1fr; }}
.portfolio-comment div button, .portfolio-comment-panel > button { border:0; background:transparent; color:#47775a; cursor:pointer; margin-right:8px; }
.portfolio-comment-form { display:flex; flex-wrap:wrap; gap:6px; }
.portfolio-comment-form input { flex:1 1 100px; min-width:0; }
.portfolio-comment-form button { border:0; border-radius:10px; background:#1ba763; color:white; padding:8px 12px; }
.portfolio-comment-panel h4 { margin:0 0 10px; color:#365c42; font-size:13px; }
.portfolio-menu { position:relative; }
.portfolio-menu summary { display:grid; place-items:center; min-width:38px; min-height:38px; border:1px solid #e1ebe3; border-radius:12px; cursor:pointer; list-style:none; font-size:20px; line-height:1; }
.portfolio-menu summary::-webkit-details-marker { display:none; }
.portfolio-menu > div { position:absolute; z-index:5; right:0; top:calc(100% + 4px); min-width:190px; padding:6px; border:1px solid #e1ebe3; border-radius:12px; background:white; box-shadow:0 8px 20px #173b2124; }
.portfolio-menu > div button { width:100%; border:0; background:white; text-align:left; }
#portfolio-form, #portfolio-form label, #portfolio-form input, #portfolio-form textarea { box-sizing:border-box; min-width:0; max-width:100%; }
#portfolio-form label { font-size:13px; }
#portfolio-form button[type="submit"] { min-height:44px; }
@media (max-width:1100px) { .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .portfolio-hero { flex-direction:column; align-items:stretch; padding:20px; } .portfolio-create { min-width:0; width:100%; } .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .portfolio-content { padding:12px; } .portfolio-actions button { padding:7px; } }
@media (max-width:360px) { .portfolio-grid { grid-template-columns:1fr; } }
/* A project reads as a single, calm showcase: visual first, details beside it. */
.portfolio-grid { grid-template-columns:minmax(0,1fr); gap:18px; }
.portfolio-card.card { display:grid; grid-template-columns:minmax(200px, 38%) minmax(0,1fr); gap:0; padding:0; background:#fff; border:1px solid #e5ede6; border-radius:20px; box-shadow:0 6px 25px rgba(36,70,45,.05); overflow:hidden; }
.portfolio-cover { min-height:240px; height:100%; aspect-ratio:auto; background:linear-gradient(145deg,#edf8ed,#fff6ef); }
.portfolio-cover img { display:block; width:100%; height:100%; min-height:240px; object-fit:cover; }
.portfolio-cover-placeholder { display:flex; flex-direction:column; align-items:center; gap:8px; color:#80b28d; }
.portfolio-cover-placeholder span { font-size:58px; line-height:1; }
.portfolio-cover-placeholder small { font-size:10px; font-weight:700; letter-spacing:.16em; }
.portfolio-content { padding:24px 26px; gap:0; }
.portfolio-byline { display:flex; align-items:center; gap:8px; color:#789082; font-size:12px; }
.portfolio-byline-icon { display:grid; place-items:center; width:27px; height:27px; flex:none; color:#38985e; background:#e9f7ed; border-radius:50%; }
.portfolio-byline .post-author-name { color:#316d49; font-weight:700; }
.portfolio-content h3 { font-size:clamp(19px,2vw,25px); letter-spacing:-.02em; color:#203b2d; margin:13px 0 8px; }
.portfolio-content .portfolio-description { color:#62776a; font-size:14px; line-height:1.55; margin:0; }
.portfolio-links { margin-top:16px; gap:8px; }
.portfolio-links a { padding:7px 11px; border-color:#e2eee5; background:#f8fbf8; font-size:12px; font-weight:700; text-decoration:none; }
.portfolio-links a:hover { background:#e9f7ec; }
.portfolio-actions { margin-top:auto; padding-top:20px; gap:7px; }
.portfolio-actions button { min-height:38px; padding:8px 11px; background:#fff; border-color:#e1ebe3; font-size:12px; font-weight:600; }
.portfolio-actions button:hover:not(:disabled) { background:#f0faf2; border-color:#9bd4ab; }
.portfolio-actions button:disabled { opacity:.58; cursor:default; }
@media (max-width:700px) {
  .portfolio-card.card { grid-template-columns:minmax(0,1fr); }
  .portfolio-cover { min-height:0; height:auto; aspect-ratio:16/10; }
  .portfolio-cover img { min-height:0; }
  .portfolio-content { padding:19px; }
}
.portfolio-card.card { grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:start; }
.portfolio-story { min-width:0; }
.portfolio-story .portfolio-cover { height:clamp(120px,15vw,160px); min-height:0; aspect-ratio:auto; }
.portfolio-story .portfolio-cover img { min-height:0; object-fit:contain; }
.portfolio-story-details { padding:10px 16px 14px; min-width:0; }
.portfolio-story-details h3 { color:#203b2d; font-size:18px; letter-spacing:-.02em; overflow-wrap:anywhere; margin:7px 0 4px; }
.portfolio-story-details .portfolio-description { margin:0; color:#62776a; font-size:13px; line-height:1.4; white-space:pre-wrap; overflow-wrap:anywhere; }
.portfolio-content { align-self:stretch; padding:12px 14px; background:#fbfdfb; border-left:1px solid #edf2ee; }
.decorated-content.theme-sunset { background:linear-gradient(135deg,#fff2e6,#ffe5ea); }
.decorated-content.theme-ocean { background:linear-gradient(135deg,#eef9ff,#dcf2fd); }
.decorated-content.theme-mint { background:linear-gradient(135deg,#eefaf2,#dcf5e4); }
.decorated-content.theme-lavender { background:linear-gradient(135deg,#f7f2ff,#ece2ff); }
.decorated-content.theme-parchment { background:#fbf7ee; }
.decorated-content.theme-midnight { background:linear-gradient(135deg,#182029,#222d3b); color:#f1f5f9; }
.decorated-content:not(.theme-classic) .portfolio-content { background:transparent; }
.decorated-content.theme-midnight :is(h2,h3,p,strong,small,.portfolio-description,.portfolio-byline) { color:#eef6f0; }
.portfolio-comment.decorated-content.theme-midnight button { color:#d5eddb; }
.decorated-content.border-gold-double { border:3px double #d97706; }
.decorated-content.border-cute-stickers { border:2px dashed #f472b6; }
.decorated-content.border-neon-glow { border:2px solid #8b5cf6; box-shadow:0 0 16px #8b5cf647; }
.decorated-content.border-wave { border:2px solid #0284c7; border-radius:26px 8px 26px 8px; }
.portfolio-actions { margin:0; padding:0; gap:6px; }
.portfolio-actions .portfolio-publish { color:#147846; background:#eaf8ee; border-color:#b9e5c4; }
.portfolio-comment-panel { margin-top:8px; padding-top:8px; }
.portfolio-comments-list { max-height:105px; overflow-y:auto; overscroll-behavior:contain; }
.portfolio-comment { padding:6px 8px; margin:4px 0; }
.portfolio-comment p { line-height:1.4; }
.portfolio-comment-form input { padding:8px 10px; }
@media (max-width:700px) {
  .portfolio-card.card { grid-template-columns:minmax(0,1fr); }
  .portfolio-story .portfolio-cover { height:150px; }
  .portfolio-story-details { padding:10px 14px 12px; }
  .portfolio-content { border-left:0; border-top:1px solid #edf2ee; padding:10px 14px 12px; }
}
/* Keep navigation available while the feed and right column scroll normally. */
@media (min-width: 701px) {
  body:has(#app > header) { padding-top: 82px; }
  header { position: fixed; inset: 0 0 auto; z-index: 20; }
  .layout > .sidebar {
    position: fixed;
    top: 116px;
    left: max(4vw, calc((100vw - 1600px) / 2 + 64px));
    width: 185px;
    overflow: visible;
  }
  .layout > main { grid-column: 2; grid-row: 1; }
  .layout > .right { grid-column: 3; grid-row: 1; position: static; }
  .layout > .sidebar .side-bottom { display: none; }
}
@media (min-width: 701px) and (max-width: 1150px) {
  .layout > .sidebar {
    left: max(4vw, calc((100vw - 1000px) / 2 + 40px));
    width: 165px;
  }
}
@media (max-width: 700px) {
  body:has(#app > header) { padding-top: 68px; }
  header { position: fixed; inset: 0 0 auto; }
}
header { transition: transform .2s ease; }
body.header-hidden header { transform: translateY(-100%); }
body.mobile-menu-open header { transform: none; }
@media (prefers-reduced-motion: reduce) { header { transition: none; } }
@media (min-width: 701px) and (max-height: 850px) {
  .sidebar .side-item { padding-top: 8px; padding-bottom: 8px; }
  .sidebar .side-label.lower { margin-top: 12px; }
  .sidebar .side-bottom { display: none; }
}
@media (min-width: 701px) and (max-height: 650px) {
  .layout > .sidebar { top: 94px; }
  .sidebar .side-item { padding: 4px 8px; gap: 8px; font-size: 11px; }
  .sidebar .side-label { margin: 4px 0 6px 8px; }
  .sidebar .side-label.lower { margin-top: 6px; }
}
@media (min-width: 701px) and (max-height: 420px) {
  .layout > .sidebar { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; top: 86px; }
  .sidebar .side-label { grid-column: 1 / -1; margin: 1px 0; }
  .sidebar .side-label.lower { margin-top: 2px; }
  .sidebar .side-item { padding: 3px; gap: 3px; font-size: 9px; line-height: 1.15; }
  .sidebar .side-item span { width: 17px; font-size: 15px; flex-shrink: 0; }
  .sidebar .side-item i { display: none; }
}
html[data-reduce-motion="true"] header { transition: none; }
.streak-reward-progress { padding: 12px 14px; border-radius: 14px; background: #edf8ef; color: #315e42; font-size: .9rem; line-height: 1.4; }
.streak-reward-lock { display: inline-block; padding: 3px 6px; border-radius: 8px; background: #fff5db; color: #795700; font-size: .7rem; font-weight: 700; white-space: nowrap; }
[data-reward-locked] { opacity: .72; }
[data-reward-locked]:focus-visible { outline: 3px solid #36a86a; outline-offset: 2px; }
.palette-circle-btn .streak-reward-lock { position: absolute; top: 75%; left: 50%; transform: translateX(-50%); z-index: 1; }
.settings-shell { display:grid; grid-template-columns:minmax(175px,220px) minmax(0,1fr); gap:18px; align-items:start; }
.settings-nav { display:grid; gap:6px; padding:10px; background:#fff; border:1px solid #e7ece7; border-radius:18px; }
.settings-nav button { text-align:left; border:0; padding:12px 14px; border-radius:11px; background:transparent; color:#526057; font-weight:650; }
.settings-nav button[aria-current="page"] { background:#e4f5e9; color:#12663b; }
.settings-panels, .settings-panels section { min-width:0; }
.settings-panels > section:not([hidden]) { display:grid; gap:14px; }
.settings-panels [hidden], .settings-nav [hidden] { display:none; }
@media(max-width:700px) { .settings-shell { grid-template-columns:minmax(0,1fr); } .settings-nav { display:flex; overflow-x:auto; max-width:100%; } .settings-nav button { flex:none; } }
.bubble.frame-cat-paw-streak { position:relative; background:#fff2f6; color:#693a4d; border:2px solid #f1a8c5; border-radius:20px 20px 8px 20px; }
.bubble.frame-cat-paw-streak::before { content:'🐾'; position:absolute; right:5px; top:-13px; font-size:16px; }
.bubble.frame-cloud-dream-streak { position:relative; background:#eef7ff; color:#365d75; border:2px solid #a6d5ef; border-radius:28px 24px 12px 28px; }
.bubble.frame-cloud-dream-streak::before { content:'☁️'; position:absolute; right:8px; top:-12px; font-size:14px; }
.post.card.theme-mint-streak,.qa-question.theme-mint-streak,.decorated-content.theme-mint-streak,.comment-item.theme-mint-streak .comment-content { background:linear-gradient(135deg,#e9fff2,#d3f4df); color:#164f37; }
.post.card.border-wave-streak,.qa-question.border-wave-streak,.decorated-content.border-wave-streak,.comment-item.border-wave-streak .comment-content { border:2px solid #56b69a; border-radius:26px 8px 26px 8px; }
.filter-disclosure { margin:14px 0; min-width:0; }
.filter-disclosure > summary { display:flex; align-items:center; gap:10px; padding:14px 18px; list-style:none; cursor:pointer; background:#eaf7ed; border:1px solid #c9e9d1; border-radius:14px; color:#225a35; }
.filter-disclosure > summary::-webkit-details-marker { display:none; }
.filter-disclosure > summary::after { content:'＋'; margin-left:auto; font-size:1.2rem; }
.filter-disclosure[open] > summary::after { content:'−'; }
.filter-disclosure > summary:focus-visible { outline:3px solid #42ac72; outline-offset:2px; }
.filter-disclosure-hint { font-size:.8rem; font-weight:400; color:#5d7865; }
.filter-disclosure > :not(summary) { margin-top:12px; }
.saved-control { margin:10px 12px 12px; padding:8px 13px; border:1px solid #bee5c9; border-radius:999px; color:#25653e; background:#f0fbf3; font-weight:650; cursor:pointer; }
.portfolio-card > .saved-control { grid-column:1 / -1; justify-self:start; }
.saved-control[aria-pressed="true"] { background:#d9f4e2; color:#175c34; }
.saved-control:focus-visible { outline:3px solid #41a96d; outline-offset:2px; }
.comment-content > .saved-control { margin:6px 0 0; padding:6px 10px; font-size:.82rem; }
.portfolio-comment > .saved-control { margin:6px 0 0; padding:6px 10px; font-size:.82rem; }
.save-link-wrapper { min-width:0; display:flex; flex-direction:column; }
.save-link-wrapper > a { flex:1; }
.save-link-wrapper > .saved-control { align-self:flex-start; }
.saved-content-list { display:grid; gap:12px; }
.saved-content-item { padding:18px; min-width:0; overflow-wrap:anywhere; }
.saved-content-item h2 { font-size:1rem; line-height:1.45; }
.saved-content-item[hidden] { display:none; }
.saved-filter-fields { display:flex; flex-wrap:wrap; align-items:end; gap:10px; padding:14px; }
.saved-filter-fields label { display:grid; gap:5px; flex:1 1 160px; min-width:0; font-size:.85rem; }
.saved-filter-fields input, .saved-filter-fields select { width:100%; min-width:0; padding:10px; border:1px solid #cdded0; border-radius:9px; background:transparent; color:inherit; }
.saved-filter-fields button { min-height:40px; padding:8px 12px; border:1px solid #cdded0; border-radius:9px; }
.saved-filter-count { margin:0 0 10px; color:#6b7b6f; font-size:.85rem; }
.saved-content-status { margin:6px 0; color:#8b5c15; font-size:.85rem; }
.saved-content-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.saved-highlight { outline:3px solid #52b77b; outline-offset:3px; }
.saved-focus-note { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin:12px 0; padding:12px 14px; border:1px solid #bfe3c7; border-radius:12px; background:#effaf1; color:#275a38; }
.saved-focus-note button { min-height:36px; padding:7px 10px; border:1px solid #9bccaa; border-radius:9px; font-weight:650; }
.aura-sakura-blossom .streak-petal-1 { left:17%; color:#ffb4db; animation-delay:1s; animation-duration:6s; }
.aura-sakura-blossom .streak-petal-2 { left:56%; color:#ffe1f0; animation-delay:3s; animation-duration:7s; }
.aura-sakura-blossom .streak-petal-3 { left:77%; color:#ffb4db; animation-delay:4s; animation-duration:5s; }
.aura-firefly-night .streak-fly-1 { top:16%; left:34%; animation-duration:5s; }
.aura-firefly-night .streak-fly-2 { top:80%; left:70%; animation-duration:6s; animation-delay:1s; }
.aura-firefly-night .streak-fly-3 { top:46%; left:85%; animation-duration:7s; animation-delay:2s; }
.streak-aura-emblem { position:absolute; right:-3px; bottom:0; display:grid; place-items:center; width:24px; height:24px; border:2px solid white; border-radius:50%; background:#fff2d0; color:#b46e0c; font-size:13px; box-shadow:0 2px 8px #b48b5c88; }
.streak-roadmap { max-width:100%; }
.streak-next { padding:12px; border-radius:12px; background:#eef9f0; color:#285b38; }
.streak-next progress { display:block; width:100%; height:9px; margin:10px 0 5px; accent-color:#26a969; }
.streak-next small { font-size:.82rem; }
.streak-reward-list { display:grid; gap:8px; margin:14px 0; }
.streak-reward-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px; border:1px solid #e2ebe3; border-radius:12px; }
.streak-reward-row > span { font-size:1.3rem; }
.streak-reward-row small { display:block; color:#66756a; }
.streak-reward-row b { font-size:.75rem; color:#68776b; }
.streak-reward-row.is-unlocked { background:#f0faf2; border-color:#b9e7c4; }
.streak-reward-row.is-unlocked b { color:#267442; }
.connection-retry { width:min(480px,calc(100% - 32px)); margin:12vh auto; padding:28px; border:1px solid #dce9df; border-radius:20px; background:#fff; color:#203a28; line-height:1.6; }
.connection-retry p { margin:14px 0; }
.connection-retry button { min-height:44px; padding:10px 18px; border-radius:10px; background:#25a761; color:#fff; font-weight:700; }
/* Quick composer, small tactile feedback, and decor shop preview */
.post-composer{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;padding:14px 16px;margin:12px 0 18px;border:1px solid var(--line,#e5ebe6);border-radius:18px;background:var(--surface,#fff);box-shadow:0 4px 18px #17351b08}
.post-composer .composer-prompt{min-width:0;width:100%;text-align:left;border:0;border-radius:999px;padding:12px 16px;background:#f4f7f4;color:#68756b;cursor:pointer}
.composer-quick-actions{grid-column:2;display:flex;gap:8px;flex-wrap:wrap}
.composer-quick-actions button{border:0;background:transparent;border-radius:999px;padding:7px 10px;color:#53665a;cursor:pointer;font-size:.9rem}
.composer-quick-actions button:hover{background:#eef6ef;color:#14834f}
.post-like.liked,[data-action="saved-toggle"][aria-pressed="true"]{animation:tap-pop .28s ease-out}
@keyframes tap-pop{0%{transform:scale(1)}45%{transform:scale(1.16)}75%{transform:scale(.96)}100%{transform:scale(1)}}
.match-event-link{margin:5px 4px 5px 0;border:1px solid #b9e5cd!important;border-radius:999px!important;background:#f0fbf4!important;color:#16784b!important;padding:7px 12px!important;font-weight:650}
.decor-shop-intro{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 18px}
.decor-shop-intro>div{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;align-content:start;padding:13px;border:1px solid #e2ece4;border-radius:14px;background:#f8fbf8}
.decor-shop-intro>div>span{grid-row:span 2;font-size:1.3rem}.decor-shop-intro small{grid-column:2;color:#718076;line-height:1.4}.decor-shop-premium{background:linear-gradient(135deg,#fff9ed,#fff)!important;border-color:#f3e3c2!important}.decor-shop-premium b{grid-column:2;color:#a56c12;font-size:.76rem}
.people-disclosure{font-size:.82rem;color:#728076}.people-disclosure summary{cursor:pointer;width:max-content}.people-disclosure span{display:block;margin-top:5px}
@media(max-width:620px){.post-composer{grid-template-columns:auto minmax(0,1fr);padding:11px}.post-composer .page-avatar{width:36px;height:36px}.composer-quick-actions{gap:3px}.composer-quick-actions button{font-size:.8rem;padding:6px 7px}.decor-shop-intro{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.post-like.liked,[data-action="saved-toggle"][aria-pressed="true"]{animation:none}}
.community-events{margin:16px 0 22px}.community-events-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:12px 0}.community-events-heading h2{margin:4px 0;font-size:1.35rem}.community-events-heading p{margin:4px 0;color:#718076}.community-event-list{display:grid;gap:12px}.community-event-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;padding:16px;border:1px solid #e2ebe4;background:var(--surface,#fff);border-radius:18px;box-shadow:0 4px 16px #12351a08}.community-event-date{display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:start;min-height:64px;border-radius:14px;background:#eff8f1;color:#218152}.community-event-date strong{font-size:1.35rem;line-height:1}.community-event-date span{text-transform:uppercase;font-size:.76rem;font-weight:700}.community-event-body{min-width:0}.community-event-meta{display:flex;flex-wrap:wrap;gap:6px}.community-event-meta span{border-radius:999px;padding:4px 8px;background:#f3f7f4;color:#637268;font-size:.75rem}.community-event-body h3{margin:7px 0;font-size:1.1rem;overflow-wrap:anywhere}.community-event-body p{margin:0 0 8px;color:#526157;white-space:pre-wrap;overflow-wrap:anywhere}.community-event-body small{display:block;color:#758178}.event-organizer-link{border:0;background:transparent;padding:7px 0;color:#19824d;font-weight:650;cursor:pointer}.community-event-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}.community-event-actions button,.community-event-actions a{display:inline-flex;align-items:center;border:1px solid #dce8df;border-radius:999px;padding:7px 11px;background:#fff;color:#415248;text-decoration:none;font:inherit;font-size:.85rem;cursor:pointer}.community-event-actions [aria-pressed="true"]{background:#eff8f1;color:#187947;border-color:#b9e4c8}.community-event-actions .event-cancel{color:#9d5149}.community-event-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.community-event-form-wrap form>label,.community-event-form-grid label{display:grid;gap:6px;margin:10px 0}.community-event-form-grid input,.community-event-form-grid select{max-width:100%;min-width:0}.event-external-sources{margin:16px 0;border:1px solid #e1e9e2;background:#f8faf8;border-radius:16px;padding:12px 15px}.event-external-sources>summary{cursor:pointer;color:#53645a;font-weight:650}.event-external-sources[open]>summary{margin-bottom:10px}.community-event-empty{padding:20px}
@media(max-width:620px){.community-events-heading{align-items:flex-start;flex-direction:column}.community-event-card{grid-template-columns:48px minmax(0,1fr);gap:10px;padding:12px}.community-event-date{min-height:52px}.community-event-date strong{font-size:1.1rem}.community-event-form-grid{grid-template-columns:1fr}}