style.css 125 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590459145924593459445954596459745984599460046014602460346044605460646074608460946104611461246134614461546164617461846194620462146224623462446254626462746284629463046314632463346344635463646374638463946404641464246434644464546464647464846494650465146524653465446554656465746584659466046614662466346644665466646674668466946704671467246734674467546764677467846794680468146824683468446854686468746884689469046914692469346944695469646974698469947004701470247034704470547064707470847094710471147124713471447154716471747184719472047214722472347244725472647274728472947304731473247334734473547364737473847394740474147424743474447454746474747484749475047514752475347544755475647574758475947604761476247634764476547664767476847694770477147724773477447754776477747784779478047814782478347844785478647874788478947904791479247934794479547964797479847994800480148024803480448054806480748084809481048114812481348144815481648174818481948204821482248234824482548264827482848294830483148324833483448354836483748384839484048414842484348444845484648474848484948504851485248534854485548564857485848594860486148624863486448654866486748684869487048714872487348744875487648774878487948804881488248834884488548864887488848894890489148924893489448954896489748984899490049014902490349044905490649074908490949104911491249134914491549164917491849194920492149224923492449254926492749284929493049314932493349344935493649374938493949404941494249434944494549464947494849494950495149524953495449554956495749584959496049614962496349644965496649674968496949704971497249734974497549764977497849794980498149824983498449854986498749884989499049914992499349944995499649974998499950005001500250035004500550065007500850095010501150125013501450155016501750185019502050215022502350245025502650275028502950305031503250335034503550365037503850395040504150425043504450455046504750485049505050515052505350545055505650575058505950605061506250635064506550665067506850695070507150725073507450755076507750785079508050815082508350845085508650875088508950905091509250935094509550965097509850995100510151025103510451055106510751085109511051115112511351145115511651175118511951205121512251235124512551265127512851295130513151325133513451355136513751385139514051415142514351445145514651475148514951505151515251535154515551565157515851595160516151625163516451655166516751685169517051715172517351745175517651775178517951805181518251835184518551865187518851895190519151925193519451955196519751985199520052015202520352045205520652075208520952105211521252135214521552165217521852195220522152225223522452255226522752285229523052315232523352345235523652375238523952405241524252435244524552465247524852495250525152525253525452555256525752585259526052615262526352645265526652675268526952705271527252735274527552765277527852795280528152825283528452855286528752885289529052915292529352945295529652975298529953005301530253035304530553065307530853095310531153125313531453155316531753185319532053215322532353245325532653275328532953305331533253335334533553365337533853395340534153425343534453455346534753485349535053515352535353545355535653575358535953605361536253635364536553665367536853695370537153725373537453755376537753785379538053815382538353845385538653875388538953905391539253935394539553965397539853995400540154025403540454055406540754085409541054115412541354145415541654175418541954205421542254235424542554265427542854295430543154325433543454355436543754385439544054415442544354445445544654475448544954505451545254535454545554565457545854595460546154625463546454655466546754685469547054715472547354745475547654775478547954805481548254835484548554865487548854895490549154925493549454955496549754985499550055015502550355045505550655075508550955105511551255135514551555165517551855195520552155225523552455255526552755285529553055315532553355345535553655375538553955405541554255435544554555465547554855495550555155525553555455555556555755585559556055615562556355645565556655675568556955705571557255735574557555765577557855795580558155825583558455855586558755885589559055915592559355945595559655975598559956005601560256035604560556065607560856095610561156125613561456155616561756185619562056215622562356245625562656275628562956305631563256335634563556365637563856395640564156425643564456455646564756485649565056515652565356545655565656575658565956605661566256635664566556665667566856695670
  1. /* General styles*/
  2. span {
  3. padding: 2px;
  4. }
  5. .styled-link {
  6. color: #FFA500;
  7. text-decoration: none;
  8. }
  9. p {
  10. white-space: pre-wrap;
  11. }
  12. hr {
  13. border: none;
  14. border-top: 1px solid #FFA500;
  15. margin: 10px 0;
  16. width: 100%;
  17. }
  18. /* Textarea, input, select styles */
  19. textarea, input, select {
  20. background-color: #444;
  21. color: #FFA500;
  22. border: 1px solid #333;
  23. padding: 10px;
  24. border-radius: 5px;
  25. width: 80%;
  26. font-size: 1em;
  27. margin-top: 10px;
  28. }
  29. input[type="text"], input[type="email"], input[type="password"], textarea {
  30. margin-bottom: 15px;
  31. }
  32. /* Body and overall page styles */
  33. html {
  34. color: #FFA500;
  35. }
  36. body {
  37. font-family: sans-serif;
  38. background-color: #000;
  39. color: #FFA500;
  40. margin: 0;
  41. padding: 0;
  42. display: flex;
  43. flex-direction: column;
  44. }
  45. /* Link styles */
  46. a {
  47. color: #FFA500;
  48. text-decoration: underline;
  49. }
  50. a:hover {
  51. text-decoration: underline;
  52. }
  53. .header {
  54. display: flex;
  55. justify-content: space-between;
  56. padding: 10px;
  57. align-items: center;
  58. }
  59. .update-banner {
  60. display: flex;
  61. align-items: center;
  62. justify-content: center;
  63. gap: 8px;
  64. padding: 6px 16px;
  65. font-size: 0.85em;
  66. letter-spacing: 0.3px;
  67. border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  68. }
  69. .update-banner-icon {
  70. font-size: 1.15em;
  71. animation: update-spin 2.5s linear infinite;
  72. }
  73. @keyframes update-spin {
  74. from { transform: rotate(0deg); }
  75. to { transform: rotate(360deg); }
  76. }
  77. .update-banner-text {
  78. opacity: 0.85;
  79. }
  80. .update-banner-link {
  81. font-weight: bold;
  82. text-decoration: underline;
  83. text-underline-offset: 2px;
  84. }
  85. .header-content {
  86. display: flex;
  87. align-items: center;
  88. flex-wrap: nowrap;
  89. overflow: hidden;
  90. }
  91. .avatar-profile {
  92. width: 40px;
  93. height: 40px;
  94. border-radius: 50%;
  95. margin-right: 10px;
  96. }
  97. .created-at,
  98. .author-name,
  99. .about-time,
  100. .time {
  101. margin-right: 10px;
  102. white-space: nowrap;
  103. }
  104. .author-name {
  105. font-weight: bold;
  106. }
  107. .created-at,
  108. .about-time,
  109. .time {
  110. font-size: 0.9rem;
  111. color: #ccc;
  112. }
  113. .time {
  114. font-size: 0.8rem;
  115. color: gray;
  116. }
  117. .time a {
  118. color: inherit;
  119. text-decoration: none;
  120. }
  121. form-button-group {
  122. display: flex;
  123. gap: 10px;
  124. flex-wrap: nowrap;
  125. justify-content: start;
  126. }
  127. .wallet-form-button-group-center {
  128. display: inline-flex;
  129. gap: 10px;
  130. justify-content: space-between;
  131. padding: 10px;
  132. align-items: center;
  133. }
  134. .conn-buttons {
  135. display: inline-flex;
  136. justify-content: space-between;
  137. padding: 10px;
  138. align-items: center;
  139. gap: 10px;
  140. }
  141. .left-bar {
  142. display: flex;
  143. align-items: center;
  144. }
  145. .right-bar {
  146. display: flex;
  147. align-items: center;
  148. }
  149. .search-input {
  150. width: 380px;
  151. height: 38px;
  152. }
  153. nav ul {
  154. list-style-type: none;
  155. padding: 0;
  156. }
  157. nav ul li {
  158. margin: 5px 0;
  159. }
  160. /* Logo and Navigation */
  161. .logo-icon {
  162. width: 50px;
  163. height: auto;
  164. margin-right: 15px;
  165. }
  166. nav ul {
  167. display: flex;
  168. list-style: none;
  169. margin: 0;
  170. }
  171. nav ul a {
  172. color: #FFA500;
  173. text-decoration: underline;
  174. padding: 10px;
  175. display: flex;
  176. }
  177. nav ul li {
  178. margin-right: 10px;
  179. padding: 2px;
  180. }
  181. nav ul li a {
  182. color: #FFA500;
  183. text-decoration: none;
  184. padding: 2px;
  185. display: block;
  186. }
  187. nav ul li a:hover {
  188. color: #FFD700;
  189. padding: 2px;
  190. text-decoration: underline;
  191. }
  192. /* nav menus */
  193. .oasis-nav-group {
  194. list-style: none;
  195. margin-bottom: 0.75rem;
  196. }
  197. .oasis-nav-toggle {
  198. display: none;
  199. }
  200. .oasis-nav-header {
  201. display: flex;
  202. align-items: center;
  203. justify-content: flex-start;
  204. gap: 0.5rem;
  205. cursor: pointer;
  206. padding: 0.5rem 0.75rem;
  207. font-weight: 600;
  208. font-size: 0.8rem;
  209. text-transform: uppercase;
  210. letter-spacing: 0.05em;
  211. color: #ffb400;
  212. transition: background 0.2s ease, color 0.2s ease;
  213. text-align: left;
  214. border: 1px solid rgba(255, 180, 0, 0.6);
  215. border-radius: 4px;
  216. margin: 0 0.25rem;
  217. box-sizing: border-box;
  218. }
  219. .oasis-nav-header .emoji {
  220. display: inline-flex;
  221. align-items: center;
  222. justify-content: center;
  223. width: 1.4em;
  224. flex-shrink: 0;
  225. text-align: center;
  226. line-height: 1;
  227. }
  228. .oasis-nav-header .nav-text {
  229. flex: 1;
  230. }
  231. .oasis-nav-header:hover {
  232. background: rgba(255, 255, 255, 0.05);
  233. color: #ffd36a;
  234. }
  235. .oasis-nav-arrow {
  236. font-size: 0.7rem;
  237. margin-left: auto;
  238. transition: transform 0.2s ease;
  239. }
  240. .oasis-nav-header + .oasis-nav-list {
  241. margin-top: 0.35rem;
  242. }
  243. .oasis-nav-list {
  244. max-height: 0;
  245. overflow: hidden;
  246. transition: max-height 0.25s ease-out;
  247. padding-left: 0;
  248. margin: 0 0 0 0.75rem;
  249. }
  250. .oasis-nav-toggle:checked + .oasis-nav-header + .oasis-nav-list {
  251. max-height: 1000px;
  252. }
  253. .oasis-nav-toggle:checked + .oasis-nav-header .oasis-nav-arrow {
  254. transform: rotate(180deg);
  255. }
  256. .oasis-nav-list li {
  257. list-style: none;
  258. padding: 0;
  259. margin: 0;
  260. }
  261. .oasis-nav-list li a {
  262. display: flex;
  263. align-items: center;
  264. gap: 0.5rem;
  265. padding: 0.35rem 1.25rem 0.35rem 1.5rem;
  266. font-size: 0.85rem;
  267. text-decoration: none;
  268. opacity: 0.85;
  269. transition: opacity 0.15s ease;
  270. }
  271. .oasis-nav-list li a:hover {
  272. opacity: 1;
  273. }
  274. .oasis-nav-list .emoji {
  275. display: inline-flex;
  276. align-items: center;
  277. justify-content: center;
  278. width: 1.4em;
  279. flex-shrink: 0;
  280. text-align: center;
  281. line-height: 1;
  282. }
  283. .oasis-nav-list .nav-text {
  284. display: inline-block;
  285. line-height: 1.2;
  286. }
  287. .oasis-header-marquee {
  288. flex: 1;
  289. display: flex;
  290. align-items: center;
  291. justify-content: center;
  292. overflow: hidden;
  293. white-space: nowrap;
  294. font-size: 0.78rem;
  295. color: #ffc45a;
  296. }
  297. .oasis-header-marquee-inner {
  298. display: inline-block;
  299. padding: 0 1rem;
  300. animation: oasis-marquee 30s linear infinite;
  301. }
  302. .oasis-marquee-item {
  303. margin: 0 0.4rem;
  304. opacity: 0.9;
  305. }
  306. .oasis-marquee-separator {
  307. margin: 0 0.4rem;
  308. opacity: 0.5;
  309. }
  310. @keyframes oasis-marquee {
  311. 0% { transform: translateX(100%); }
  312. 100% { transform: translateX(-100%); }
  313. }
  314. /* Main content area + Menu */
  315. /*
  316. .main-content { border: 2px solid red !important; }
  317. .sidebar-left { border: 2px solid blue !important; }
  318. .main-column { border: 2px solid green !important; }
  319. .sidebar-right { border: 2px solid orange !important; }
  320. */
  321. .sidebar-left,
  322. .sidebar-right {
  323. background-color: #222;
  324. border: 1px solid #444;
  325. padding: 10px;
  326. min-width: 180px;
  327. max-width: 260px;
  328. flex-shrink: 0;
  329. box-sizing: border-box;
  330. }
  331. .main-content {
  332. display: flex;
  333. flex-direction: row;
  334. flex-wrap: nowrap;
  335. width: 100%;
  336. box-sizing: border-box;
  337. gap: 10px;
  338. min-width: 0;
  339. max-width: 100vw;
  340. }
  341. .main-column pre,
  342. .main-column code {
  343. white-space: pre-wrap;
  344. word-break: break-word;
  345. overflow-wrap: anywhere;
  346. }
  347. .main-column img {
  348. max-width: 100%;
  349. height: auto;
  350. display: block;
  351. }
  352. .main-column {
  353. background-color: #333;
  354. padding: 20px;
  355. flex-grow: 1;
  356. min-width: 0;
  357. max-width: 100%;
  358. border-radius: 5px;
  359. border: 1px solid #333;
  360. box-sizing: border-box;
  361. word-break: break-word;
  362. overflow-wrap: anywhere;
  363. }
  364. .main-column > *,
  365. .main-column details,
  366. .main-column section,
  367. .main-column article {
  368. min-width: 0;
  369. max-width: 100%;
  370. box-sizing: border-box;
  371. overflow-wrap: anywhere;
  372. word-break: break-word;
  373. }
  374. .main-column details,
  375. .main-column section {
  376. width: 100%;
  377. max-width: 100%;
  378. box-sizing: border-box;
  379. }
  380. .sidebar-left nav ul,
  381. .sidebar-right nav ul {
  382. display: block;
  383. }
  384. .sidebar-left nav ul li,
  385. .sidebar-right nav ul li {
  386. margin-bottom: 10px;
  387. }
  388. .sidebar-left nav ul li a,
  389. .sidebar-right nav ul li a,
  390. .header nav ul li a {
  391. display: flex;
  392. align-items: center;
  393. gap: 8px;
  394. padding: 8px 12px;
  395. border-radius: 6px;
  396. background-color: #1d1d1d;
  397. text-decoration: none;
  398. font-size: 15px;
  399. color: #ffa300;
  400. border: 1px solid #333;
  401. transition: background-color 0.2s ease, border-color 0.2s ease;
  402. }
  403. .sidebar-left nav ul li a:hover,
  404. .sidebar-right nav ul li a:hover,
  405. .header nav ul li a:hover {
  406. background-color: #2a2a2a;
  407. border-color: #555;
  408. }
  409. /* Header layout */
  410. .header {
  411. display: flex;
  412. justify-content: space-between;
  413. padding: 10px;
  414. align-items: center;
  415. }
  416. .top-bar-left,
  417. .top-bar-mid,
  418. .top-bar-center,
  419. .top-bar-right {
  420. display: flex;
  421. align-items: center;
  422. gap: 10px;
  423. border: 0px;
  424. }
  425. .top-bar-left {
  426. justify-content: flex-start;
  427. }
  428. .top-bar-mid {
  429. justify-content: center;
  430. }
  431. .top-bar-center {
  432. flex: 1;
  433. justify-content: center;
  434. min-width: 0;
  435. }
  436. .top-bar-right {
  437. justify-content: flex-end;
  438. }
  439. .ai-ask-form {
  440. display: flex;
  441. align-items: center;
  442. gap: 6px;
  443. width: 100%;
  444. max-width: 720px;
  445. }
  446. .ai-ask-form .ai-ask-input,
  447. .ai-ask-form .ai-ask-btn {
  448. box-sizing: border-box;
  449. margin: 0;
  450. height: 32px;
  451. border: 1px solid rgba(255, 180, 0, 0.6);
  452. border-radius: 4px;
  453. padding: 0 0.75rem;
  454. font-size: 0.8rem;
  455. font-family: inherit;
  456. font-weight: 600;
  457. line-height: 1;
  458. background: transparent;
  459. color: #ffb400;
  460. text-transform: none;
  461. letter-spacing: normal;
  462. }
  463. .ai-ask-form .ai-ask-input {
  464. flex: 1;
  465. min-width: 0;
  466. outline: none;
  467. transition: border-color 0.15s ease, background 0.15s ease;
  468. }
  469. .ai-ask-form .ai-ask-input::placeholder {
  470. color: rgba(255, 180, 0, 0.55);
  471. }
  472. .ai-ask-form .ai-ask-input:focus {
  473. border-color: #ffa300;
  474. background: rgba(255, 255, 255, 0.05);
  475. }
  476. .ai-ask-form .ai-ask-btn {
  477. flex-shrink: 0;
  478. cursor: pointer;
  479. display: inline-flex;
  480. align-items: center;
  481. justify-content: center;
  482. transition: background 0.2s ease;
  483. padding: 0 0.85rem;
  484. }
  485. .ai-ask-form .ai-ask-btn:hover {
  486. background: rgba(255, 180, 0, 0.15);
  487. border-color: #ffa300;
  488. color: #ffa300;
  489. }
  490. @media (max-width: 768px) {
  491. .top-bar-center { display: none; }
  492. }
  493. .top-bar-left nav ul,
  494. .top-bar-mid nav ul,
  495. .top-bar-right nav ul {
  496. padding: 0;
  497. margin: 0;
  498. overflow-x: auto;
  499. }
  500. .logo-icon {
  501. width: 40px;
  502. height: 40px;
  503. margin-right: 10px;
  504. }
  505. /* Section styles */
  506. section {
  507. margin-bottom: 20px;
  508. color: #FFA500;
  509. }
  510. ul {
  511. padding: 1;
  512. margin: 10px 0;
  513. }
  514. ul li {
  515. margin: 10px 0;
  516. }
  517. /* Buttons */
  518. button, input[type="submit"], input[type="button"] {
  519. background-color: #FFA500;
  520. color: #000;
  521. border: 1px solid #FFA500;
  522. padding: 8px 16px;
  523. border-radius: 5px;
  524. cursor: pointer;
  525. font-size: 0.9em;
  526. transition: all 0.3s ease;
  527. margin-top: 4.5px;
  528. }
  529. button:hover, input[type="submit"]:hover, input[type="button"]:hover {
  530. background-color: #FFD700;
  531. border-color: #FFD700;
  532. }
  533. /* Tables */
  534. table {
  535. width: 100%;
  536. border-collapse: collapse;
  537. margin-top: 20px;
  538. border: 1px solid #333;
  539. }
  540. table th, table td {
  541. padding: 10px;
  542. border: 1px solid #444;
  543. text-align: left;
  544. }
  545. table th {
  546. background-color: #222;
  547. }
  548. table tr:nth-child(even) {
  549. background-color: #444;
  550. }
  551. /* Media queries */
  552. @media (max-width: 768px) {
  553. .main-content {
  554. flex-direction: column;
  555. gap: 20px;
  556. }
  557. .sidebar-left, .sidebar-right {
  558. width: 100%;
  559. display: block;
  560. }
  561. .main-column {
  562. width: 100%;
  563. }
  564. }
  565. @media (max-width: 480px) {
  566. body {
  567. font-size: 14px;
  568. }
  569. h1, h2, h3 {
  570. font-size: 1.5em;
  571. }
  572. input, select {
  573. font-size: 0.9em;
  574. }
  575. }
  576. /* general styles */
  577. div {
  578. margin-bottom: 20px;
  579. padding: 20px;
  580. border-radius: 10px;
  581. background-color: #222;
  582. box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  583. transition: all 0.3s ease-in-out;
  584. overflow: hidden;
  585. }
  586. div .header-content{
  587. width: 35%;
  588. }
  589. h1 {
  590. color: #FFA500;
  591. font-weight: bold;
  592. margin: 0;
  593. }
  594. .md-mention {
  595. font-size: 1.5em;
  596. font-weight: bold;
  597. margin: 20px 0;
  598. word-wrap: break-word;
  599. overflow-wrap: break-word;
  600. white-space: normal;
  601. user-select: text;
  602. }
  603. article {
  604. font-size: 1.1em;
  605. color: #FFF;
  606. margin-bottom: 20px;
  607. }
  608. .thread-view {
  609. width: 90%;
  610. }
  611. thread-container {
  612. width: 95%;
  613. }
  614. .profile {
  615. display: flex;
  616. flex-direction: column;
  617. align-items: center;
  618. text-align: center;
  619. margin-bottom: 10px;
  620. }
  621. .profile-metrics {
  622. display: flex;
  623. flex-direction: column;
  624. gap: 6px;
  625. }
  626. .profile-metrics .inhabitant-last-activity {
  627. align-self: center;
  628. }
  629. .inhabitant-last-activity .label {
  630. margin-right: 6px;
  631. }
  632. .avatar-container {
  633. display: flex;
  634. flex-direction: column;
  635. align-items: center;
  636. padding: 20px;
  637. border-radius: 16px;
  638. box-shadow: 0 8px 20px rgba(255, 165, 0, 0.25);
  639. max-width: 300px;
  640. margin: 0 auto 20px auto;
  641. transition: transform 0.3s ease;
  642. }
  643. .avatar-container:hover {
  644. transform: scale(1.05);
  645. }
  646. .avatar {
  647. width: 140px;
  648. height: 140px;
  649. border-radius: 50%;
  650. margin-bottom: 12px;
  651. box-shadow: 0 4px 10px rgba(255, 140, 0, 0.4);
  652. object-fit: cover;
  653. transition: border-color 0.3s ease;
  654. }
  655. .avatar:hover {
  656. border-color: #FFA500;
  657. }
  658. .name {
  659. font-size: 1.5em;
  660. font-weight: bold;
  661. }
  662. footer {
  663. clear: both;
  664. margin-top: 20px;
  665. padding: 10px 0;
  666. }
  667. footer div {
  668. display: flex;
  669. gap: 10px;
  670. }
  671. footer a {
  672. background-color: #FFA500;
  673. color: #000;
  674. padding: 8px 16px;
  675. border-radius: 5px;
  676. text-decoration: none;
  677. text-align: center;
  678. margin: 5px 0;
  679. transition: background-color 0.3s ease;
  680. }
  681. footer a:hover {
  682. background-color: #FFD700;
  683. border-color: #FFD700;
  684. }
  685. footer .btn {
  686. background-color: #FFA500;
  687. color: #000;
  688. padding: 8px 16px;
  689. border-radius: 5px;
  690. text-align: center;
  691. text-decoration: none;
  692. }
  693. footer .btn:hover {
  694. background-color: #FFD700;
  695. border-color: #FFD700;
  696. }
  697. footer .btn:hover {
  698. background-color: #007B9F;
  699. }
  700. /* Post preview */
  701. .mention {
  702. font-weight: bold;
  703. color: #ffcc00;
  704. text-decoration: none;
  705. }
  706. .mention:hover {
  707. text-decoration: underline;
  708. }
  709. .mentions-list {
  710. display: flex;
  711. flex-direction: column;
  712. gap: 12px;
  713. }
  714. .mention-item {
  715. padding: 12px;
  716. border: 1px solid #333;
  717. border-radius: 8px;
  718. background: rgba(255, 255, 255, 0.03);
  719. }
  720. .mention-content {
  721. margin-bottom: 8px;
  722. word-wrap: break-word;
  723. overflow-wrap: break-word;
  724. }
  725. .post-preview img {
  726. display: block;
  727. margin: 1em 0;
  728. max-width: 100%;
  729. border-radius: 8px;
  730. border: 2px solid #555;
  731. }
  732. .post-preview audio,
  733. .post-preview video {
  734. display: block;
  735. margin: 1.2em 0;
  736. max-width: 100%;
  737. }
  738. .thread-reply-item {
  739. margin-bottom: 18px;
  740. }
  741. .thread-reply-item:last-child {
  742. margin-bottom: 0;
  743. }
  744. .thread-reply-footer {
  745. display: flex;
  746. align-items: center;
  747. gap: 12px;
  748. flex-wrap: wrap;
  749. margin-top: 10px;
  750. padding: 0;
  751. border: none !important;
  752. background: transparent !important;
  753. box-shadow: none !important;
  754. }
  755. .thread-reply-footer .inline-form {
  756. display: inline-flex;
  757. margin: 0;
  758. }
  759. .thread-reply-footer .inline-form button {
  760. margin: 0;
  761. }
  762. .publish-textarea {
  763. min-height: 10em;
  764. padding: 0.75em;
  765. border: 1px solid #444;
  766. border-radius: 6px;
  767. font-family: sans-serif;
  768. font-size: 1em;
  769. line-height: 1.4;
  770. }
  771. .preview-text {
  772. background-color: #444;
  773. color: #FFA500;
  774. border: 1px solid #333;
  775. padding: 10px;
  776. border-radius: 5px;
  777. width: 80%;
  778. font-size: 1em;
  779. white-space: pre-wrap;
  780. word-wrap: break-word;
  781. line-height: 1.4;
  782. }
  783. /* Section, article, and message word-wrap */
  784. section, article, .message, .profile {
  785. word-wrap: break-word;
  786. overflow-wrap: break-word;
  787. word-break: break-word;
  788. }
  789. article img {
  790. max-width: 100%;
  791. height: auto;
  792. object-fit: contain;
  793. display: block;
  794. margin: 0 auto;
  795. }
  796. .post-image {
  797. max-width: 100%;
  798. height: auto;
  799. display: block;
  800. border-radius: 8px;
  801. margin: 8px 0;
  802. }
  803. .post-video {
  804. max-width: 100%;
  805. display: block;
  806. border-radius: 8px;
  807. margin: 8px 0;
  808. }
  809. .post-audio {
  810. width: 100%;
  811. display: block;
  812. margin: 8px 0;
  813. }
  814. .post-pdf {
  815. color: #FFA500;
  816. text-decoration: none;
  817. border-bottom: 1px dashed #FFA500;
  818. }
  819. .post-pdf:hover {
  820. text-decoration: underline;
  821. }
  822. /* Filters */
  823. button.filter-btn,
  824. a.filter-btn,
  825. button.create-button {
  826. font: inherit;
  827. padding: 10px 20px;
  828. margin-right: 10px;
  829. border-radius: 5px;
  830. border: 1px solid;
  831. cursor: pointer;
  832. transition: background-color .2s, border-color .2s;
  833. }
  834. button.filter-btn,
  835. a.filter-btn {
  836. background-color: #ff6600;
  837. border-color: #ff3300;
  838. color: #fff;
  839. text-decoration: none;
  840. display: inline-block;
  841. }
  842. button.filter-btn:hover,
  843. button.filter-btn.active,
  844. a.filter-btn:hover,
  845. a.filter-btn.active {
  846. background-color: #ff9900;
  847. border-color: #e68a00;
  848. color: #000;
  849. }
  850. button.create-button {
  851. background-color: #ffcc00;
  852. border-color: #e6b800;
  853. color: #000;
  854. }
  855. button.create-button:hover {
  856. background-color: #e6b800;
  857. border-color: #cca300;
  858. }
  859. /* Bookmarks */
  860. .bookmark-form input[type="text"],
  861. .bookmark-form textarea,
  862. .bookmark-form select {
  863. width: 100%;
  864. padding: 6px;
  865. font-size: 14px;
  866. border: 1px solid #333;
  867. border-radius: 4px;
  868. box-sizing: border-box;
  869. }
  870. .bookmark-form input[type="url"] {
  871. max-width: 800px;
  872. }
  873. .bookmark-form textarea {
  874. height: 80px;
  875. }
  876. .bookmark-form select {
  877. width: auto;
  878. max-width: 200px;
  879. }
  880. .bookmark-form label {
  881. margin-bottom: 15px;
  882. padding: 6px;
  883. }
  884. .bookmark-tags {
  885. margin-top: 1em;
  886. }
  887. .bookmark-url {
  888. color: #ff6600;
  889. text-decoration: none;
  890. font-weight: bold;
  891. font-size: 1.2em;
  892. word-wrap: break-word;
  893. margin-bottom: 1em;
  894. }
  895. .bookmark-url:hover {
  896. text-decoration: underline;
  897. }
  898. .filter-box {
  899. padding: 16px 18px;
  900. border-radius: 8px;
  901. border: 1px solid rgba(255, 255, 255, 0.08);
  902. background: rgba(0, 0, 0, 0.18);
  903. }
  904. .filter-box__input {
  905. width: 100%;
  906. box-sizing: border-box;
  907. height: 42px;
  908. padding: 10px 12px;
  909. border-radius: 4px;
  910. border: 1px solid rgba(255, 255, 255, 0.12);
  911. background: rgba(255, 255, 255, 0.12);
  912. color: #ffd700;
  913. outline: none;
  914. }
  915. .filter-box__input::placeholder {
  916. color: rgba(255, 215, 0, 0.75);
  917. }
  918. .filter-box__controls {
  919. display: flex;
  920. gap: 12px;
  921. align-items: center;
  922. margin-top: 14px;
  923. flex-wrap: wrap;
  924. }
  925. .filter-box__select {
  926. box-sizing: border-box;
  927. height: 36px;
  928. padding: 6px 10px;
  929. border-radius: 6px;
  930. border: 1px solid rgba(255, 255, 255, 0.12);
  931. background: rgba(255, 255, 255, 0.12);
  932. color: inherit;
  933. min-width: 170px;
  934. }
  935. .filter-box__button {
  936. height: 36px;
  937. padding: 0 14px;
  938. border-radius: 6px;
  939. border: 1px solid rgba(255, 255, 255, 0.12);
  940. background: rgba(255, 255, 255, 0.16);
  941. color: #ffd700;
  942. }
  943. .bookmark-topbar {
  944. display: flex;
  945. gap: 8px;
  946. flex-wrap: wrap;
  947. align-items: center;
  948. border:0px;
  949. }
  950. .bookmark-topbar-left {
  951. display: flex;
  952. gap: 8px;
  953. flex-wrap: wrap;
  954. align-items: center;
  955. }
  956. .bookmark-topbar-left form {
  957. margin: 0;
  958. }
  959. .bookmark-actions {
  960. display: flex;
  961. gap: 8px;
  962. flex-wrap: wrap;
  963. border: 0px;
  964. }
  965. .tags-header h2 {
  966. color: #ffa300;
  967. }
  968. .error-page-message{margin:8px 0 16px;white-space:pre-wrap;word-break:break-word}
  969. .error-page-actions{margin-top:16px}
  970. .tags-container {
  971. display: flex;
  972. flex-wrap: wrap;
  973. }
  974. .tag-link {
  975. display: inline-block;
  976. color: #ff6600;
  977. padding: 0.2em 0.6em;
  978. font-size: 0.9em;
  979. text-decoration: none;
  980. margin-right: 1em;
  981. margin-bottom: 0.5em;
  982. }
  983. .tag-checkboxes-table {
  984. margin-top: 1rem;
  985. width: 100%;
  986. border-collapse: collapse;
  987. color: yellow;
  988. }
  989. .tag-checkboxes-table td {
  990. padding: 0.5rem 1rem;
  991. white-space: nowrap;
  992. vertical-align: middle;
  993. }
  994. .input-checkbox {
  995. transform: scale(1.2);
  996. }
  997. /* Inhabitants */
  998. .inhabitant-card {
  999. display: flex;
  1000. flex-wrap: nowrap;
  1001. align-items: flex-start;
  1002. gap: 1rem;
  1003. }
  1004. .inhabitant-left {
  1005. display: flex;
  1006. flex-direction: column;
  1007. align-items: center;
  1008. gap: 4px;
  1009. width: 300px;
  1010. flex: 0 0 300px;
  1011. }
  1012. .inhabitant-left a {
  1013. display: block;
  1014. width: 100%;
  1015. }
  1016. .inhabitant-left h2 {
  1017. margin: 4px 0 0;
  1018. line-height: 1.1;
  1019. }
  1020. .inhabitant-photo {
  1021. width: 100% !important;
  1022. height: 100% !important;
  1023. border-radius: 50%;
  1024. border: 3px solid #ffa500;
  1025. display: block;
  1026. margin: 0 auto;
  1027. }
  1028. .inhabitant-photo-details {
  1029. width: 100% !important;
  1030. height: 100% !important;
  1031. max-width: none !important;
  1032. object-fit: cover;
  1033. border-radius: 50%;
  1034. border: 2px solid #ffa500;
  1035. display: block;
  1036. margin: 0 auto;
  1037. }
  1038. .inhabitant-details {
  1039. display: flex;
  1040. flex-direction: column;
  1041. gap: 6px;
  1042. flex: 1;
  1043. min-width: 0;
  1044. }
  1045. .inhabitant-activity-group {
  1046. display: flex;
  1047. flex-direction: column;
  1048. gap: 2px;
  1049. margin-top: 6px;
  1050. }
  1051. .inhabitant-last-activity {
  1052. margin-top: 0;
  1053. display: flex;
  1054. border: 0;
  1055. align-items: center;
  1056. gap: 6px;
  1057. }
  1058. .activity-dot {
  1059. display: inline-block;
  1060. font-size: 1em;
  1061. line-height: 1;
  1062. vertical-align: middle;
  1063. }
  1064. .activity-dot.green {
  1065. color: #2ecc71;
  1066. }
  1067. .activity-dot.orange {
  1068. color: #f39c12;
  1069. }
  1070. .activity-dot.red {
  1071. color: #e74c3c;
  1072. }
  1073. .profile-last-seen,
  1074. .profile-device {
  1075. display: block;
  1076. font-size: 13px;
  1077. color: #888;
  1078. margin-top: 4px;
  1079. }
  1080. .device-kit {
  1081. color: green;
  1082. font-weight: bold;
  1083. }
  1084. .device-desktop {
  1085. color: yellow;
  1086. font-weight: bold;
  1087. }
  1088. .device-mobile {
  1089. color: red;
  1090. font-weight: bold;
  1091. }
  1092. .activity-filters{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-bottom:12px}
  1093. .activity-filter-col{display:flex;flex-direction:column;gap:8px}
  1094. .activity-search{display:flex;gap:12px;align-items:center;margin:14px 0 18px 0;flex-wrap:wrap}
  1095. .activity-search-input{min-width:240px;max-width:520px;width:100%}
  1096. .post-text-pre{white-space:pre-wrap}
  1097. .activity-image-thumb{width:100%;max-width:720px;height:auto;border-radius:14px;object-fit:cover}
  1098. .activity-avatar{width:256px;height:256px;}
  1099. .activity-pub{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
  1100. .activity-pub-title{margin:0}
  1101. .activity-pub-title .user-link{display:inline}
  1102. .activity-contact-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  1103. .activity-contact-arrow{opacity:.85}
  1104. .reply-context{margin:0 0 .55rem 0;padding:.5rem .6rem;border-radius:12px;background:rgba(255,255,255,.04)}
  1105. .reply-context-author{margin-left:.45rem}
  1106. .reply-context-text{margin:.35rem 0 0 0;opacity:.92;font-size:.97em}
  1107. .activity-spread-title{margin:.25rem 0 .55rem 0;font-size:1.08em}
  1108. .activity-spread-text{line-height:1.45;font-size:1.02em;word-break:break-word;overflow-wrap:anywhere}
  1109. .activity-contact {
  1110. display: flex;
  1111. align-items: center;
  1112. gap: 12px;
  1113. flex-wrap: wrap;
  1114. }
  1115. .activity-contact-avatar-link {
  1116. display: inline-flex;
  1117. align-items: center;
  1118. justify-content: center;
  1119. }
  1120. .activity-contact-avatar {
  1121. width: 256px;
  1122. height: 256px;
  1123. object-fit: cover;
  1124. border-radius: 12px;
  1125. }
  1126. .activity-contact-arrow {
  1127. font-weight: 800;
  1128. opacity: 0.85;
  1129. }
  1130. /* Documents */
  1131. .pdf-viewer-container {
  1132. width: 100%;
  1133. max-width: 100%;
  1134. background: #1e1e1e;
  1135. margin-bottom: 1rem;
  1136. padding: 1rem;
  1137. border-radius: 6px;
  1138. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  1139. }
  1140. .pdf-viewer-container canvas {
  1141. display: block;
  1142. margin: 0 auto;
  1143. border: 1px solid #333;
  1144. background-color: #fff;
  1145. }
  1146. .pdf-viewer-container div {
  1147. margin-top: 1rem;
  1148. }
  1149. .pdf-viewer-container button {
  1150. background-color: #2d2d2d;
  1151. color: #eee;
  1152. border: none;
  1153. padding: 0.4rem 0.8rem;
  1154. font-size: 1rem;
  1155. cursor: pointer;
  1156. border-radius: 4px;
  1157. transition: background-color 0.2s ease;
  1158. }
  1159. .pdf-viewer-container button:hover {
  1160. background-color: #444;
  1161. }
  1162. .pdf-viewer-container span {
  1163. color: #ccc;
  1164. margin: 0 1rem;
  1165. font-family: monospace;
  1166. }
  1167. /* CVs */
  1168. .cv-photo {
  1169. width: 200px;
  1170. height: 200px;
  1171. object-fit: cover;
  1172. border-radius: 50%;
  1173. }
  1174. .cv-item {
  1175. padding: 20px;
  1176. border: 1px solid #ddd;
  1177. margin-bottom: 20px;
  1178. }
  1179. .cv-section {
  1180. padding: 20px;
  1181. }
  1182. .no-cv {
  1183. padding: 20px;
  1184. text-align: center;
  1185. }
  1186. .checkbox-oasisContributor {
  1187. display: table-cell;
  1188. align-items: center;
  1189. gap: 0.5em;
  1190. }
  1191. .action-card {
  1192. padding: 1em;
  1193. border-bottom: 1px solid #333;
  1194. margin-bottom: 1em;
  1195. }
  1196. .action-meta {
  1197. font-size: 0.9em;
  1198. color: #FFA500;
  1199. }
  1200. .feed-image {
  1201. max-width: 100%;
  1202. height: auto;
  1203. border-radius: 6px;
  1204. }
  1205. .feed-search-form {
  1206. display: flex;
  1207. align-items: center;
  1208. gap: 10px;
  1209. flex-wrap: wrap;
  1210. }
  1211. .feed-search-input {
  1212. flex: 1 1 260px;
  1213. min-width: 220px;
  1214. height: 40px;
  1215. box-sizing: border-box;
  1216. }
  1217. .feed-search-btn {
  1218. height: 40px;
  1219. display: inline-flex;
  1220. align-items: center;
  1221. box-sizing: border-box;
  1222. }
  1223. .type-label {
  1224. font-weight: bold;
  1225. margin-top: 0.5em;
  1226. }
  1227. .content-text {
  1228. margin: 0.5em 0;
  1229. }
  1230. .filters {
  1231. margin-bottom:16px;
  1232. }
  1233. .mode-buttons {
  1234. display:flex; gap:8px; margin-top:16px;
  1235. }
  1236. .mention-avatar {
  1237. width: 50px;
  1238. height: 50px;
  1239. border-radius: 50%;
  1240. margin-right: 10px;
  1241. }
  1242. .tribe-card-image {
  1243. width: 100%;
  1244. max-height: 300px;
  1245. object-fit: cover;
  1246. border-radius: 6px;
  1247. margin-bottom: 8px;
  1248. }
  1249. .tribe-feed {
  1250. background-color: #111;
  1251. padding: 16px;
  1252. border-radius: 8px;
  1253. }
  1254. .tribe-feed-full {
  1255. width: 100%;
  1256. background-color: #222;
  1257. padding: 16px;
  1258. border-radius: 8px;
  1259. box-sizing: border-box;
  1260. }
  1261. .feed-actions {
  1262. display: flex;
  1263. gap: 8px;
  1264. margin-bottom: 16px;
  1265. }
  1266. .vote-actions {
  1267. display: flex;
  1268. gap: 8px;
  1269. margin-bottom: 16px;
  1270. }
  1271. .feed-list {
  1272. display: flex;
  1273. flex-direction: column;
  1274. gap: 12px;
  1275. margin-bottom: 16px;
  1276. }
  1277. .feed-item {
  1278. background-color: #1c1c1c;
  1279. padding: 12px;
  1280. border-radius: 6px;
  1281. color: #f0f0f0;
  1282. }
  1283. .feed-item p {
  1284. margin: 4px 0;
  1285. }
  1286. .feed-item form {
  1287. margin-top: 8px;
  1288. }
  1289. .feed-item button {
  1290. background-color: orange;
  1291. color: black;
  1292. border: none;
  1293. padding: 6px 12px;
  1294. border-radius: 4px;
  1295. cursor: pointer;
  1296. }
  1297. .feed-item button:disabled {
  1298. background-color: #555;
  1299. cursor: not-allowed;
  1300. }
  1301. .tribe-feed .feed-row,
  1302. .tribe-feed-full .feed-row {
  1303. display: flex;
  1304. align-items: flex-start;
  1305. gap: 12px;
  1306. }
  1307. .tribe-feed .refeed-column,
  1308. .tribe-feed-full .refeed-column {
  1309. flex: 0 0 68px;
  1310. min-width: 68px;
  1311. max-width: 68px;
  1312. padding: 10px 8px;
  1313. }
  1314. .tribe-feed .refeed-column h1,
  1315. .tribe-feed-full .refeed-column h1 {
  1316. margin: 0 0 8px 0;
  1317. font-size: 24px;
  1318. }
  1319. .tribe-feed .refeed-btn,
  1320. .tribe-feed-full .refeed-btn {
  1321. padding: 6px 8px;
  1322. font-size: 12px;
  1323. width: 100%;
  1324. }
  1325. .tribe-feed .feed-main,
  1326. .tribe-feed-full .feed-main {
  1327. flex: 1 1 auto;
  1328. min-width: 0;
  1329. overflow-wrap: anywhere;
  1330. word-break: break-word;
  1331. }
  1332. @media (max-width: 720px) {
  1333. .tribe-feed .feed-row,
  1334. .tribe-feed-full .feed-row {
  1335. flex-direction: column;
  1336. }
  1337. .tribe-feed .refeed-column,
  1338. .tribe-feed-full .refeed-column {
  1339. width: 100%;
  1340. min-width: 0;
  1341. max-width: none;
  1342. align-items: flex-start;
  1343. }
  1344. }
  1345. .tribe-feed .feed-actions,
  1346. .tribe-feed-full .feed-actions {
  1347. display: flex;
  1348. gap: 8px;
  1349. flex-wrap: wrap;
  1350. margin-bottom: 8px;
  1351. }
  1352. .tribe-feed .feed-actions form,
  1353. .tribe-feed-full .feed-actions form,
  1354. .tribe-feed .refeed-column form,
  1355. .tribe-feed-full .refeed-column form {
  1356. margin: 0;
  1357. }
  1358. .tribe-feed-compose {
  1359. display: grid;
  1360. grid-template-columns: 1fr auto;
  1361. gap: 12px;
  1362. margin-top: 14px;
  1363. align-items: end;
  1364. }
  1365. .tribe-feed-compose textarea {
  1366. width: 100%;
  1367. min-width: 0;
  1368. padding: 12px;
  1369. border-radius: 10px;
  1370. border: 1px solid #444;
  1371. background: #222;
  1372. color: #eee;
  1373. resize: vertical;
  1374. min-height: 120px;
  1375. line-height: 1.45;
  1376. box-sizing: border-box;
  1377. }
  1378. .tribe-feed-compose .tribe-feed-send {
  1379. height: 40px;
  1380. padding: 0 14px;
  1381. border-radius: 10px;
  1382. white-space: nowrap;
  1383. }
  1384. @media (max-width: 720px) {
  1385. .tribe-feed-compose {
  1386. grid-template-columns: 1fr;
  1387. }
  1388. .tribe-feed-compose .tribe-feed-send {
  1389. width: 100%;
  1390. }
  1391. }
  1392. .tribes-container{
  1393. display:grid; grid-template-columns:repeat(auto-fill,minmax(400px,1fr)); gap:20px; margin-top:16px;
  1394. }
  1395. .tribe-card {
  1396. background: #2c2f33;
  1397. border-radius: 8px;
  1398. border: 1px solid #444;
  1399. overflow: hidden;
  1400. display: flex;
  1401. flex-direction: column;
  1402. }
  1403. .tribe-details {
  1404. display: flex;
  1405. border-radius: 12px;
  1406. padding: 24px;
  1407. gap: 24px;
  1408. }
  1409. .tribe-main {
  1410. display: flex;
  1411. flex-direction: column;
  1412. gap: 16px;
  1413. flex: 1;
  1414. min-width: 0;
  1415. }
  1416. .tribe-side {
  1417. display: flex;
  1418. background: #2c2f33;
  1419. width: 300px;
  1420. flex-shrink: 0;
  1421. flex-direction: column;
  1422. gap: 16px;
  1423. }
  1424. @media (max-width: 768px) {
  1425. .tribe-details {
  1426. flex-direction: column;
  1427. }
  1428. .tribe-side {
  1429. width: 100%;
  1430. }
  1431. }
  1432. .filter-btn,.create-button,.edit-btn,.delete-btn,.join-btn,.leave-btn,.buy-btn
  1433. {
  1434. padding:8px 12px; border:none; border-radius:4px; cursor:pointer; background:#ff6600; color:#fff;
  1435. }
  1436. .filter-btn.active {
  1437. background:#ffa500;
  1438. }
  1439. .create-button {
  1440. background:#ffcc00; color:#000;
  1441. }
  1442. .gallery {
  1443. display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px; padding:10px;
  1444. }
  1445. .gallery-item img {
  1446. width:100%; max-height:200px; object-fit:cover; border-radius:6px; transition:transform .2s;
  1447. }
  1448. .gallery-item:hover img {
  1449. transform:scale(1.05);
  1450. }
  1451. .tribe-detail-image {
  1452. width:100%; max-width:200px; max-height:300px; object-fit:cover; margin:16px 0; border-radius:6px;
  1453. }
  1454. .activity-image-preview {
  1455. width: 400px;
  1456. height: 300px;
  1457. object-fit: contain;
  1458. border: 0px;
  1459. }
  1460. .media-preview {
  1461. max-width: 100%;
  1462. height: auto;
  1463. display: block;
  1464. }
  1465. .meme-checkbox {
  1466. width: 1%;
  1467. }
  1468. .image-detail {
  1469. width: 100%;
  1470. max-width: 400px;
  1471. max-height: 300px;
  1472. object-fit: cover;
  1473. border-radius: 6px;
  1474. margin-bottom: 8px;
  1475. }
  1476. .div-center.image-form .image-detail {
  1477. max-width: 200px;
  1478. max-height: 150px;
  1479. object-fit: contain;
  1480. }
  1481. .gallery {
  1482. display: grid;
  1483. grid-template-columns: repeat(auto-fill, minmax(200px,1fr));
  1484. gap: 10px;
  1485. padding: 10px;
  1486. }
  1487. .gallery-item img {
  1488. width: 100%;
  1489. max-height: 200px;
  1490. object-fit: cover;
  1491. border-radius: 6px;
  1492. transition: transform .2s;
  1493. }
  1494. .gallery-item:hover img {
  1495. transform: scale(1.05);
  1496. }
  1497. .lightbox {
  1498. display: none;
  1499. position: fixed;
  1500. top: 0; left: 0;
  1501. width: 100%; height: 100%;
  1502. background: rgba(0,0,0,0.85);
  1503. justify-content: center;
  1504. align-items: center;
  1505. z-index: 10000;
  1506. }
  1507. .lightbox:target {
  1508. display: flex;
  1509. }
  1510. .lightbox img {
  1511. max-width: 90%;
  1512. max-height: 90%;
  1513. object-fit: contain;
  1514. border-radius: 6px;
  1515. }
  1516. .lightbox-close {
  1517. position: absolute;
  1518. top: 15px;
  1519. right: 60px;
  1520. width: 42px;
  1521. height: 42px;
  1522. background: rgba(0, 0, 0, 0.6);
  1523. border-radius: 50%;
  1524. color: #fff;
  1525. font-size: 1.5em;
  1526. text-align: center;
  1527. line-height: 32px;
  1528. text-decoration: none;
  1529. }
  1530. /* Opinions */
  1531. .voting-buttons {
  1532. display: flex;
  1533. gap: 10px;
  1534. margin-top: 10px;
  1535. }
  1536. .opinion-card {
  1537. background-color: #1c1c1c;
  1538. border: 1px solid #333;
  1539. border-radius: 10px;
  1540. padding: 16px;
  1541. margin-bottom: 24px;
  1542. color: #FFA500;
  1543. }
  1544. .opinion-card h3 {
  1545. margin-bottom: 8px;
  1546. }
  1547. .opinion-card p {
  1548. margin: 4px 0;
  1549. color: #FFD700;
  1550. }
  1551. /* Events */
  1552. .event-tags {
  1553. margin-top: 12px;
  1554. }
  1555. .event-tags .tag {
  1556. display: inline-block;
  1557. background-color: #2a2a2a;
  1558. color: #FFA500;
  1559. padding: 4px 10px;
  1560. margin: 4px 4px 0 0;
  1561. border-radius: 6px;
  1562. font-size: 13px;
  1563. }
  1564. /* Tasks */
  1565. .task-id {
  1566. color: #FFA500;
  1567. font-weight: bold;
  1568. margin: 0;
  1569. }
  1570. /* Governance */
  1571. .vote-buttons-row {
  1572. display: flex;
  1573. gap: 10px;
  1574. flex-wrap: nowrap;
  1575. justify-content: start;
  1576. }
  1577. .conn-actions {
  1578. display: flex;
  1579. gap: 10px;
  1580. margin-top: 10px;
  1581. }
  1582. .inhabitant-action {
  1583. display: flex;
  1584. gap: 10px;
  1585. margin-top: 10px;
  1586. }
  1587. .transfer-actions {
  1588. display: flex;
  1589. gap: 10px;
  1590. margin-top: 10px;
  1591. }
  1592. .transfer-topbar-left {
  1593. display: flex;
  1594. gap: 8px;
  1595. flex-wrap: wrap;
  1596. align-items: center;
  1597. }
  1598. .transfer-chips {
  1599. display: flex;
  1600. gap: 8px;
  1601. flex-wrap: wrap;
  1602. align-items: center;
  1603. }
  1604. .transfer-voting-buttons {
  1605. display: flex;
  1606. gap: 8px;
  1607. flex-wrap: wrap;
  1608. }
  1609. .confirmations-block {
  1610. margin-top: 6px;
  1611. }
  1612. .confirmations-progress {
  1613. width: 260px;
  1614. max-width: 100%;
  1615. height: 8px;
  1616. border-radius: 999px;
  1617. overflow: hidden;
  1618. background: rgba(255, 255, 255, 0.12);
  1619. appearance: none;
  1620. }
  1621. .confirmations-progress::-webkit-progress-bar {
  1622. background: rgba(255, 255, 255, 0.12);
  1623. }
  1624. .confirmations-progress::-webkit-progress-value {
  1625. background: rgba(255, 255, 255, 0.65);
  1626. }
  1627. .confirmations-progress::-moz-progress-bar {
  1628. background: rgba(255, 255, 255, 0.65);
  1629. }
  1630. .transfer-range {
  1631. display: flex;
  1632. gap: 8px;
  1633. align-items: center;
  1634. }
  1635. .transfer-amount-input {
  1636. width: 120px;
  1637. }
  1638. .market-item-actions {
  1639. display: flex;
  1640. gap: 10px;
  1641. margin-top: 10px;
  1642. }
  1643. .job-actions {
  1644. display: flex;
  1645. gap: 10px;
  1646. margin-top: 10px;
  1647. }
  1648. .tribe-actions {
  1649. display: flex;
  1650. gap: 10px;
  1651. margin-top: 10px;
  1652. }
  1653. .audio-actions {
  1654. display: flex;
  1655. gap: 10px;
  1656. margin-top: 10px;
  1657. }
  1658. .video-actions {
  1659. display: flex;
  1660. gap: 10px;
  1661. margin-top: 10px;
  1662. }
  1663. .document-actions {
  1664. display: flex;
  1665. gap: 10px;
  1666. margin-top: 10px;
  1667. }
  1668. .event-actions {
  1669. display: flex;
  1670. gap: 10px;
  1671. margin-top: 10px;
  1672. }
  1673. .feed-actions {
  1674. display: flex;
  1675. gap: 10px;
  1676. margin-top: 10px;
  1677. }
  1678. .image-actions {
  1679. display: flex;
  1680. gap: 10px;
  1681. margin-top: 10px;
  1682. }
  1683. .task-actions {
  1684. display: flex;
  1685. gap: 10px;
  1686. align-items: center;
  1687. flex-wrap: wrap;
  1688. }
  1689. .task-actions > form {
  1690. margin: 0;
  1691. }
  1692. .task-actions .project-control-form,
  1693. .task-actions .project-control-form--status {
  1694. margin: 0;
  1695. padding: 0;
  1696. }
  1697. .task-actions .project-control-form--status {
  1698. display: flex;
  1699. align-items: center;
  1700. gap: 10px;
  1701. }
  1702. .task-actions .project-control-select,
  1703. .task-actions .project-control-btn {
  1704. margin: 0;
  1705. }
  1706. .task-actions button {
  1707. display: inline-flex;
  1708. align-items: center;
  1709. justify-content: center;
  1710. }
  1711. .report-actions{
  1712. display:flex;
  1713. align-items:center;
  1714. gap:10px;
  1715. flex-wrap:wrap;
  1716. }
  1717. .report-actions form{ margin:0; }
  1718. .report-actions button,
  1719. .report-actions select{
  1720. height:40px;
  1721. }
  1722. .cv-filter-form {
  1723. display: flex;
  1724. gap: 8px;
  1725. flex-wrap: wrap;
  1726. align-items: flex-end;
  1727. }
  1728. .cv-filter-submit {
  1729. width: 100%;
  1730. margin-top: 4px;
  1731. }
  1732. .cv-actions {
  1733. display: flex;
  1734. flex-direction: column;
  1735. gap: 8px;
  1736. margin-top: 12px;
  1737. }
  1738. .card-salary {
  1739. display: inline-block;
  1740. font-weight: 700;
  1741. font-size: 1.2em;
  1742. letter-spacing: 0.02em;
  1743. }
  1744. .mode-buttons {
  1745. display: flex;
  1746. gap: 10px;
  1747. margin-top: 10px;
  1748. }
  1749. /* Tags */
  1750. .tag-cloud-wrap {
  1751. display: flex;
  1752. flex-wrap: wrap;
  1753. justify-content: center;
  1754. align-items: center;
  1755. padding: 1em;
  1756. width: 97%;
  1757. height: auto;
  1758. background: #111;
  1759. border: 1px solid #333;
  1760. border-radius: 8px;
  1761. margin: 1em auto;
  1762. gap: 0.8em;
  1763. }
  1764. .tag-cloud-item {
  1765. display: inline-block;
  1766. font-weight: 600;
  1767. text-decoration: none;
  1768. white-space: nowrap;
  1769. transition: transform 0.2s ease, color 0.2s ease;
  1770. }
  1771. .tag-cloud-item:hover {
  1772. transform: scale(1.3);
  1773. color: #FFA500 !important;
  1774. z-index: 10;
  1775. }
  1776. /* Feed */
  1777. .feed-card {
  1778. border: 1px solid #444;
  1779. border-radius: 12px;
  1780. padding: 16px;
  1781. margin-bottom: 24px;
  1782. background-color: #1c1c1c;
  1783. }
  1784. .feed-row {
  1785. display: flex;
  1786. flex-direction: row;
  1787. align-items: flex-start;
  1788. gap: 20px;
  1789. }
  1790. .refeed-column {
  1791. text-align: center;
  1792. border-right: 1px solid #555;
  1793. padding-right: 12px;
  1794. }
  1795. .refeed-column h1 {
  1796. font-size: 28px;
  1797. margin: 0;
  1798. color: #FFA500;
  1799. }
  1800. .refeed-btn {
  1801. margin-top: 10px;
  1802. background-color: #FFA500;
  1803. border: none;
  1804. padding: 6px 12px;
  1805. border-radius: 6px;
  1806. font-weight: bold;
  1807. color: #000;
  1808. cursor: pointer;
  1809. transition: background-color 0.2s ease-in-out;
  1810. }
  1811. .refeed-btn:hover {
  1812. background-color: #cc8500;
  1813. }
  1814. .feed-main {
  1815. flex: 1;
  1816. }
  1817. .feed-text {
  1818. background-color: #2a2a2a;
  1819. padding: 10px;
  1820. border-radius: 6px;
  1821. color: #FFD700;
  1822. margin-bottom: 8px;
  1823. margin-right: 15px;
  1824. word-wrap: break-word;
  1825. }
  1826. .feed-main a {
  1827. text-decoration: underline;
  1828. }
  1829. .feed-main a:hover {
  1830. text-decoration: underline;
  1831. }
  1832. .votes-wrapper {
  1833. margin-top: 16px;
  1834. padding-top: 12px;
  1835. border-top: 1px solid #444;
  1836. }
  1837. .votes {
  1838. display: flex;
  1839. flex-wrap: wrap;
  1840. gap: 8px;
  1841. }
  1842. .vote-category {
  1843. background-color: #333;
  1844. color: #FFA500;
  1845. padding: 6px 10px;
  1846. border-radius: 6px;
  1847. font-size: 14px;
  1848. }
  1849. .voting-buttons {
  1850. display: flex;
  1851. flex-wrap: wrap;
  1852. gap: 10px;
  1853. margin-top: 12px;
  1854. }
  1855. .vote-btn {
  1856. background-color: #FFA500;
  1857. border: none;
  1858. color: #000;
  1859. padding: 6px 10px;
  1860. border-radius: 6px;
  1861. font-weight: bold;
  1862. cursor: pointer;
  1863. }
  1864. .vote-btn:hover {
  1865. background-color: #cc8500;
  1866. }
  1867. /* Pixelia Grid */
  1868. .pixelia-form-wrap {
  1869. display: flex;
  1870. justify-content: flex-start;
  1871. margin-bottom: 12px;
  1872. }
  1873. .pixel-color-000000 { background-color: #000000; }
  1874. .pixel-color-ffffff { background-color: #ffffff; }
  1875. .pixel-color-17f018 { background-color: #17f018; }
  1876. .pixel-color-ffbb00 { background-color: #ffbb00; }
  1877. .pixel-color-ff0000 { background-color: #ff0000; }
  1878. .pixel-color-0000ff { background-color: #0000ff; }
  1879. .pixel-color-ffff00 { background-color: #ffff00; }
  1880. .pixel-color-00ff00 { background-color: #00ff00; }
  1881. .pixel-color-00ffff { background-color: #00ffff; }
  1882. .pixel-color-ff00ff { background-color: #ff00ff; }
  1883. .pixel-color-a52a2a { background-color: #a52a2a; }
  1884. .pixel-color-800080 { background-color: #800080; }
  1885. .pixel-color-808000 { background-color: #808000; }
  1886. .pixel-color-00bfff { background-color: #00bfff; }
  1887. .pixel-color-d3d3d3 { background-color: #d3d3d3; }
  1888. .pixel-color-ff6347 { background-color: #ff6347; }
  1889. .pixel-empty { background-color: #1a1a1a; }
  1890. .pixel-cell {
  1891. width: 0.1px;
  1892. height: 0.1px;
  1893. }
  1894. /* Market */
  1895. .market-grid {
  1896. display: grid;
  1897. grid-template-columns: repeat(3, 1fr);
  1898. gap: 20px;
  1899. justify-content: center;
  1900. }
  1901. .market-tribe-card .market-card-kind{display:inline-block;font-size:10px;letter-spacing:2px;color:#888;text-transform:uppercase;font-weight:600;margin-bottom:4px}
  1902. .market-tribe-card .market-card-price{font-size:16px;color:#FFD700;font-weight:600;margin-top:6px}
  1903. .market-tribe-card .market-card-seller{font-size:13px;color:#bbb;margin-top:4px;word-break:break-all;border:none;background:transparent;padding:0}
  1904. .market-tribe-card .market-card-seller-label{color:#ff9800;font-weight:600}
  1905. .market-card {
  1906. background-color: #2c2c2c;
  1907. border-radius: 16px;
  1908. box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  1909. transition: all 0.3s ease;
  1910. display: flex;
  1911. flex-direction: column;
  1912. justify-content: space-between;
  1913. text-align: center;
  1914. }
  1915. .market-comments {
  1916. background: #2f2f2f;
  1917. border-radius: 12px;
  1918. padding: 12px;
  1919. }
  1920. .market-comments .votations-comment-card {
  1921. background: #3a3a3a;
  1922. }
  1923. .countdown-strong {
  1924. font-weight: 700;
  1925. }
  1926. .market-card-image {
  1927. width: 100%;
  1928. max-height: 150px;
  1929. object-fit: contain;
  1930. border-radius: 8px;
  1931. margin-bottom: 15px;
  1932. }
  1933. .market-card-title {
  1934. font-size: 1.3em;
  1935. font-weight: bold;
  1936. color: #ffd600;
  1937. margin-bottom: 10px;
  1938. overflow: hidden;
  1939. white-space: nowrap;
  1940. text-overflow: ellipsis;
  1941. }
  1942. .market-card-description {
  1943. font-size: 0.9em;
  1944. color: #ccc;
  1945. margin-bottom: 10px;
  1946. overflow: hidden;
  1947. text-overflow: ellipsis;
  1948. white-space: nowrap;
  1949. }
  1950. .market-card-footer {
  1951. margin-top: auto;
  1952. display: flex;
  1953. flex-direction: column;
  1954. gap: 8px;
  1955. font-size: 1.1em;
  1956. color: #ffd600;
  1957. }
  1958. .market-card-footer .condition,
  1959. .market-card-footer .stock {
  1960. font-size: 1em;
  1961. color: #ff9900;
  1962. }
  1963. .market-card-footer .stock {
  1964. font-weight: bold;
  1965. color: #ff0000;
  1966. }
  1967. .market-card.price {
  1968. font-size: 1.3em;
  1969. font-weight: bold;
  1970. }
  1971. /*avatar relationships*/
  1972. .relationship-status {
  1973. display: flex;
  1974. flex-direction: row;
  1975. flex-wrap: wrap;
  1976. align-items: center;
  1977. gap: 0.5rem;
  1978. justify-content: flex-start;
  1979. margin: 0.8rem 0 0.5rem 0;
  1980. background: transparent !important;
  1981. border: 0 !important;
  1982. padding: 0 !important;
  1983. }
  1984. .relationship-status .relationship-actions {
  1985. display: flex;
  1986. flex-basis: 100%;
  1987. gap: 0.5rem;
  1988. margin-top: 0.4rem;
  1989. background: transparent !important;
  1990. border: 0 !important;
  1991. padding: 0 !important;
  1992. }
  1993. .relationship-status .relationship-actions form {
  1994. background: transparent !important;
  1995. border: 0 !important;
  1996. padding: 0 !important;
  1997. }
  1998. .inhabitant-left .cv-actions,
  1999. .inhabitant-details .cv-actions {
  2000. background: transparent !important;
  2001. border: 0 !important;
  2002. padding: 0 !important;
  2003. width: 100%;
  2004. }
  2005. .inhabitant-left .cv-actions form,
  2006. .inhabitant-details .cv-actions form {
  2007. background: transparent !important;
  2008. border: 0 !important;
  2009. padding: 0 !important;
  2010. width: 100%;
  2011. }
  2012. .inhabitant-left .cv-actions button.btn {
  2013. width: 100%;
  2014. }
  2015. .inhabitant-left .cv-actions p {
  2016. text-align: center;
  2017. margin: 0;
  2018. }
  2019. .profile-side-relationship .relationship-status {
  2020. justify-content: center;
  2021. }
  2022. .profile-side-relationship .relationship-actions {
  2023. justify-content: center;
  2024. }
  2025. .profile-side-relationship,
  2026. .profile-side-actions {
  2027. background: transparent !important;
  2028. border: 0 !important;
  2029. padding: 0 !important;
  2030. }
  2031. .profile-side-relationship form,
  2032. .profile-side-actions form {
  2033. background: transparent !important;
  2034. border: 0 !important;
  2035. padding: 0 !important;
  2036. display: inline-block;
  2037. }
  2038. .profile-side-actions {
  2039. display: flex;
  2040. flex-direction: row;
  2041. flex-wrap: wrap;
  2042. gap: 0.5rem;
  2043. margin-top: 0.5rem;
  2044. }
  2045. .status {
  2046. padding: 0.2rem 0.6rem;
  2047. border: 1px solid #555;
  2048. border-radius: 4px;
  2049. background-color: #2a2a2a;
  2050. font-size: 0.9rem;
  2051. color: #e0e0e0;
  2052. }
  2053. .status.mutual {
  2054. border-color: #557d3b;
  2055. color: #8bc34a;
  2056. }
  2057. .status.supporting {
  2058. border-color: #997f2e;
  2059. color: #f0c674;
  2060. }
  2061. .status.supported-by {
  2062. border-color: #3a6f9c;
  2063. color: #6ab0f3;
  2064. }
  2065. .status.blocked {
  2066. color: #ff5555;
  2067. border-color: #802020;
  2068. }
  2069. .status.blocked-by {
  2070. color: #ff8888;
  2071. border-color: #a04040;
  2072. }
  2073. .status.you {
  2074. padding: 0.2rem 0.6rem;
  2075. border: 1px solid #555;
  2076. border-radius: 4px;
  2077. background-color: #2a2a2a;
  2078. font-size: 0.9rem;
  2079. color: #FFDD44;
  2080. border-color: #FF6A00;
  2081. font-weight: bold;
  2082. }
  2083. /*forums*/
  2084. .forum-list {
  2085. display: flex;
  2086. flex-direction: column;
  2087. gap: 0.5em;
  2088. }
  2089. .forum-card {
  2090. display: flex;
  2091. flex-direction: row;
  2092. align-items: stretch;
  2093. border-bottom: 1px solid #262626;
  2094. padding: 12px 0 16px 0;
  2095. gap: 1.1em;
  2096. background: none;
  2097. }
  2098. .visit-forum-form {
  2099. display: flex;
  2100. justify-content: center;
  2101. margin-top: 10px;
  2102. }
  2103. .forum-score-col {
  2104. min-width: 78px;
  2105. display: flex;
  2106. align-items: center;
  2107. justify-content: center;
  2108. }
  2109. .forum-score-box {
  2110. background: #22201a;
  2111. border-radius: 12px;
  2112. box-shadow: 0 0 0.5em #111b;
  2113. display: flex;
  2114. flex-direction: column;
  2115. align-items: center;
  2116. justify-content: center;
  2117. min-width: 56px;
  2118. min-height: 134px;
  2119. padding: 8px 0;
  2120. }
  2121. .forum-score-form {
  2122. display: flex;
  2123. flex-direction: column;
  2124. align-items: center;
  2125. justify-content: center;
  2126. gap: 14px;
  2127. width: 100%;
  2128. }
  2129. .score-btn {
  2130. background: #282818;
  2131. color: #ffd740;
  2132. border: none;
  2133. width: 38px;
  2134. height: 38px;
  2135. font-size: 1.25em;
  2136. border-radius: 8px;
  2137. cursor: pointer;
  2138. transition: background 0.13s;
  2139. display: flex;
  2140. align-items: center;
  2141. justify-content: center;
  2142. line-height: 1;
  2143. }
  2144. .score-btn:hover {
  2145. background: #39391c;
  2146. }
  2147. .score-total {
  2148. font-size: 2em;
  2149. font-weight: bold;
  2150. color: #ffd740;
  2151. text-align: center;
  2152. margin: 0;
  2153. line-height: 1.1;
  2154. min-height: 38px;
  2155. display: flex;
  2156. align-items: center;
  2157. justify-content: center;
  2158. }
  2159. .forum-main-col {
  2160. flex: 1;
  2161. display: flex;
  2162. flex-direction: column;
  2163. gap: 0.22em;
  2164. }
  2165. .forum-header-row {
  2166. display: flex;
  2167. align-items: center;
  2168. gap: 0.7em;
  2169. margin-bottom: 2px;
  2170. }
  2171. .forum-category {
  2172. color: #ff7300;
  2173. background: #282818;
  2174. font-weight: bold;
  2175. font-size: 1em;
  2176. text-decoration: underline;
  2177. padding: 2px 7px;
  2178. border-radius: 5px;
  2179. margin-right: 0.4em;
  2180. }
  2181. .forum-title {
  2182. color: #ff7300;
  2183. font-size: 1.13em;
  2184. font-weight: bold;
  2185. text-decoration: underline;
  2186. transition: color 0.15s;
  2187. }
  2188. .forum-title:hover {
  2189. color: #ffd740;
  2190. }
  2191. .forum-body {
  2192. margin: 0.15em 0 0.2em 0;
  2193. font-size: 1em;
  2194. color: #ffd740;
  2195. line-height: 1.6;
  2196. }
  2197. .forum-body {
  2198. margin: 0.15em 0 0.2em 0;
  2199. font-size: 1em;
  2200. color: #ffd740;
  2201. line-height: 1.6;
  2202. word-break: break-word;
  2203. }
  2204. .forum-body h1 {
  2205. font-size: 1.6em;
  2206. margin: 10px 0 6px 0;
  2207. color: #ff9d00;
  2208. }
  2209. .forum-body h2 {
  2210. font-size: 1.4em;
  2211. margin: 8px 0 5px 0;
  2212. color: #ff9d00;
  2213. }
  2214. .forum-body h3 {
  2215. font-size: 1.25em;
  2216. margin: 6px 0 4px 0;
  2217. color: #ff9d00;
  2218. }
  2219. .forum-body ul,
  2220. .forum-body ol {
  2221. padding-left: 22px;
  2222. margin: 6px 0;
  2223. }
  2224. .forum-body li {
  2225. margin: 3px 0;
  2226. }
  2227. .forum-body blockquote {
  2228. border-left: 3px solid #ff7300;
  2229. padding-left: 10px;
  2230. margin: 8px 0;
  2231. color: #ffb347;
  2232. }
  2233. .forum-body code {
  2234. background: #1a1a1a;
  2235. padding: 2px 6px;
  2236. border-radius: 4px;
  2237. font-family: monospace;
  2238. }
  2239. .forum-body pre {
  2240. background: #111;
  2241. padding: 10px;
  2242. border-radius: 6px;
  2243. overflow-x: auto;
  2244. margin: 8px 0;
  2245. }
  2246. .forum-body hr {
  2247. border: none;
  2248. border-top: 1px solid #333;
  2249. margin: 10px 0;
  2250. }
  2251. .forum-body img {
  2252. max-width: 100%;
  2253. border-radius: 6px;
  2254. margin: 8px 0;
  2255. }
  2256. .forum-body video,
  2257. .forum-body audio {
  2258. max-width: 100%;
  2259. margin: 8px 0;
  2260. }
  2261. .forum-score-box {
  2262. position: sticky;
  2263. top: 80px;
  2264. }
  2265. .forum-body.truncate {
  2266. max-height: 220px;
  2267. overflow: hidden;
  2268. position: relative;
  2269. }
  2270. .forum-body.truncate::after {
  2271. content: "";
  2272. position: absolute;
  2273. bottom: 0;
  2274. left: 0;
  2275. width: 100%;
  2276. height: 60px;
  2277. background: linear-gradient(to bottom, rgba(0,0,0,0), #0f0f0f);
  2278. }
  2279. .forum-meta {
  2280. font-size: 1em;
  2281. align-items: center;
  2282. color: #ffd740;
  2283. margin: 0.1em 0 0 0;
  2284. display: flex;
  2285. gap: 1.3em;
  2286. }
  2287. .forum-footer {
  2288. font-size: 0.97em;
  2289. margin-top: 6px;
  2290. display: flex;
  2291. gap: 0.5em;
  2292. align-items: center;
  2293. }
  2294. .date-link {
  2295. color: #ffd740;
  2296. font-family: monospace;
  2297. font-size: 1em;
  2298. }
  2299. .user-link {
  2300. color: #ffd740;
  2301. font-weight: bold;
  2302. text-decoration: underline dotted;
  2303. }
  2304. .mode-buttons-row {
  2305. display: flex;
  2306. flex-direction: row;
  2307. align-items: flex-start;
  2308. margin-bottom: 1.5em;
  2309. }
  2310. .mode-buttons-cols {
  2311. flex: 1;
  2312. display: flex;
  2313. flex-wrap: wrap;
  2314. gap: 0.6em;
  2315. }
  2316. .forum-comment {
  2317. display: flex;
  2318. flex-direction: column;
  2319. gap: 12px;
  2320. background: #282828;
  2321. padding: 12px;
  2322. margin-bottom: 8px;
  2323. border-radius: 8px;
  2324. transition: background 0.3s ease;
  2325. }
  2326. .comment-header {
  2327. display: flex;
  2328. align-items: center;
  2329. justify-content: space-between;
  2330. }
  2331. .comment-body-row {
  2332. display: flex;
  2333. flex-direction: row;
  2334. gap: 16px;
  2335. }
  2336. .comment-vote-col {
  2337. min-width: 78px;
  2338. display: flex;
  2339. align-items: flex-start;
  2340. justify-content: center;
  2341. }
  2342. .comment-text-col {
  2343. flex: 1;
  2344. display: flex;
  2345. flex-direction: column;
  2346. }
  2347. .comment-form {
  2348. display: flex;
  2349. flex-direction: column;
  2350. gap: 8px;
  2351. }
  2352. .comment-textarea {
  2353. resize: vertical;
  2354. width: 100%;
  2355. padding: 8px;
  2356. background: #1e1e1e;
  2357. color: #ffd740;
  2358. border: 1px solid #444;
  2359. border-radius: 6px;
  2360. font-size: 1em;
  2361. }
  2362. .comment-votes {
  2363. font-size: 0.9em;
  2364. color: #ffd740;
  2365. }
  2366. .comment-footer {
  2367. font-size: 0.85em;
  2368. display: flex;
  2369. justify-content: space-between;
  2370. color: #ffd740;
  2371. }
  2372. .date-link {
  2373. color: #ffd740;
  2374. font-size: 0.95em;
  2375. }
  2376. .user-link {
  2377. color: #ffd740;
  2378. font-weight: bold;
  2379. font-size: 1em;
  2380. }
  2381. .forum-send-btn {
  2382. background: #ff7300;
  2383. color: #fff;
  2384. border: none;
  2385. padding: 8px 16px;
  2386. font-size: 1em;
  2387. border-radius: 8px;
  2388. cursor: pointer;
  2389. transition: background 0.2s;
  2390. }
  2391. .forum-send-btn:hover {
  2392. background: #ffd740;
  2393. }
  2394. .forum-owner-actions {
  2395. margin-top: 8px;
  2396. text-align: left;
  2397. }
  2398. .comment-votes .votes-count {
  2399. margin-right: 12px;
  2400. }
  2401. .new-message-wrapper {
  2402. margin-top: 16px;
  2403. padding: 16px;
  2404. border-radius: 8px;
  2405. }
  2406. .highlighted-reply {
  2407. background-color: #ffe5b4 !important;
  2408. }
  2409. .forum-comment.highlighted-reply {
  2410. background-color: #ffa400 !important;
  2411. transition: background 0.3s ease;
  2412. }
  2413. .forum-comment.level-0 { margin-left: 0; }
  2414. .forum-comment.level-1 { margin-left: 20px; }
  2415. .forum-comment.level-2 { margin-left: 40px; }
  2416. .forum-comment.level-3 { margin-left: 60px; }
  2417. .filter-group {
  2418. display: flex;
  2419. flex-wrap: wrap;
  2420. gap: 6px;
  2421. margin-bottom: 6px;
  2422. }
  2423. .forum-create-col {
  2424. margin-top: 8px;
  2425. }
  2426. .forum-title-form {
  2427. display: inline;
  2428. }
  2429. .forum-title-form .forum-title {
  2430. cursor: pointer;
  2431. }
  2432. .forum-positive-votes {
  2433. color: #4CAF50;
  2434. font-weight: bold;
  2435. }
  2436. .forum-messages {
  2437. font-weight: 500;
  2438. }
  2439. .forum-thread-header {
  2440. margin-bottom: 16px;
  2441. }
  2442. .tribe-forum-filters {
  2443. margin-bottom: 16px;
  2444. }
  2445. .tribe-forum-reply-form {
  2446. margin-top: 12px;
  2447. margin-bottom: 16px;
  2448. }
  2449. .forum-comment.level-4 { margin-left: 80px; }
  2450. /*blockexplorer*/
  2451. .blockchain-view {
  2452. font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif;
  2453. background-color: #191b20;
  2454. padding: 32px 16px;
  2455. border-radius: 16px;
  2456. box-shadow: 0 8px 36px rgba(0,0,0,0.16);
  2457. color: #e7e7e7;
  2458. max-width: 900px;
  2459. margin: 0 auto;
  2460. }
  2461. .blockexplorer-search{
  2462. margin:16px 0 20px;
  2463. }
  2464. .blockexplorer-search-form{
  2465. display:flex;
  2466. flex-direction:column;
  2467. gap:12px;
  2468. }
  2469. .blockexplorer-search-row{
  2470. display:flex;
  2471. flex-direction:column;
  2472. gap:10px;
  2473. }
  2474. .blockexplorer-search-pair{
  2475. display:flex;
  2476. flex-wrap:wrap;
  2477. gap:6px;
  2478. }
  2479. .blockexplorer-search-dates{
  2480. display:flex;
  2481. flex-wrap:wrap;
  2482. gap:12px;
  2483. }
  2484. .blockexplorer-search-input{
  2485. min-width:220px;
  2486. }
  2487. .blockexplorer-search-actions{
  2488. display:flex;
  2489. justify-content:flex-start;
  2490. }
  2491. .block {
  2492. background: #23242a;
  2493. border-radius: 16px;
  2494. box-shadow: 0 2px 12px rgba(32,35,42,0.11);
  2495. padding: 22px 24px;
  2496. margin-bottom: 26px;
  2497. transition: box-shadow 0.22s;
  2498. position: relative;
  2499. }
  2500. .block-buttons {
  2501. display: flex;
  2502. justify-content: right;
  2503. align-items: center;
  2504. gap: 12px;
  2505. }
  2506. .button-container {
  2507. display: flex;
  2508. gap: 12px;
  2509. justify-content: right;
  2510. align-items: center;
  2511. }
  2512. .block:hover {
  2513. box-shadow: 0 8px 32px rgba(35,40,50,0.18);
  2514. }
  2515. .block-row {
  2516. display: flex;
  2517. align-items: center;
  2518. gap: 6px;
  2519. }
  2520. .blockchain-card-label {
  2521. color: #ffa300;
  2522. font-weight: bold;
  2523. letter-spacing: 1.5px;
  2524. line-height: 1.2;
  2525. margin-bottom: 0;
  2526. }
  2527. .blockchain-card-value {
  2528. color: #ffd740;
  2529. }
  2530. .block-info-table .card-label {
  2531. color: #ffa300;
  2532. font-weight: bold;
  2533. }
  2534. .block-info-table .card-value {
  2535. color: #ffd740;
  2536. }
  2537. .block-row--content {
  2538. margin: 10px 0 0 0;
  2539. }
  2540. .block-info-table td {
  2541. padding: 12px 15px;
  2542. font-size: 14px;
  2543. border: 1px solid #444;
  2544. }
  2545. .block-author {
  2546. font-weight: 600;
  2547. font-size: 14px;
  2548. color: #ffd740;
  2549. background: rgba(255,163,0,0.08);
  2550. padding: 3px 10px;
  2551. border-radius: 8px;
  2552. text-decoration: none;
  2553. transition: color 0.12s;
  2554. }
  2555. .block-author:hover {
  2556. color: #ffa300;
  2557. }
  2558. .block-timestamp {
  2559. color: #ffd740;
  2560. font-size: 12px;
  2561. margin-right: 6px;
  2562. }
  2563. .block-content-preview,
  2564. .block-content {
  2565. background: #222326;
  2566. border-radius: 10px;
  2567. padding: 14px 18px;
  2568. font-size: 14px;
  2569. line-height: 1.7;
  2570. color: #ffd740;
  2571. font-family: 'JetBrains Mono', 'Courier New', monospace;
  2572. overflow-x: auto;
  2573. }
  2574. .block-content-preview pre {
  2575. margin: 0;
  2576. }
  2577. .block-info-table {
  2578. width: 100%;
  2579. border-collapse: collapse;
  2580. margin: 15px 0;
  2581. }
  2582. .block-info-table td {
  2583. padding: 10px;
  2584. border: 1px solid #444;
  2585. font-size: 14px;
  2586. }
  2587. .json-content {
  2588. white-space: pre-wrap;
  2589. word-break: break-word;
  2590. color: #ffd740;
  2591. }
  2592. .block-row--details {
  2593. margin-top: 14px;
  2594. position: relative;
  2595. }
  2596. .block-url {
  2597. color: #ffd740;
  2598. font-size: 14px;
  2599. text-decoration: none;
  2600. font-weight: 500;
  2601. transition: color 0.13s, border-color 0.13s;
  2602. }
  2603. .block-row--details .block-url {
  2604. position: absolute;
  2605. top: 0;
  2606. right: 0;
  2607. background: #1f2023;
  2608. padding: 6px 12px;
  2609. border-radius: 8px;
  2610. font-size: 14px;
  2611. font-weight: 500;
  2612. border: none;
  2613. transition: background 0.12s, color 0.12s;
  2614. }
  2615. .block-row--details .block-url:hover {
  2616. background: #292b36;
  2617. color: #ffa300;
  2618. }
  2619. .btn-singleview {
  2620. background: #1e1f23;
  2621. border: none;
  2622. border-radius: 50%;
  2623. padding: 7px 12px;
  2624. cursor: pointer;
  2625. font-size: 1.14em;
  2626. color: #ffa300;
  2627. box-shadow: none;
  2628. transition: background 0.14s, color 0.14s;
  2629. text-decoration: none;
  2630. display: flex;
  2631. align-items: center;
  2632. justify-content: center;
  2633. }
  2634. .btn-singleview:hover {
  2635. background: #2d2e34;
  2636. color: #ffd740;
  2637. }
  2638. .btn-datagram {
  2639. font-size: 1.2em;
  2640. font-weight: bold;
  2641. }
  2642. .block-row--meta-spaced { margin-top: 8px; }
  2643. .filter-column { display: flex; flex-direction: column; gap: 8px; }
  2644. .deleted-label { color: #b00; font-weight: bold; margin-top: 8px; }
  2645. .block-row--back {
  2646. margin-top: 15px;
  2647. }
  2648. .block-content-label {
  2649. color: #ffa300;
  2650. font-size: 1.02em;
  2651. margin-bottom: 8px;
  2652. font-weight: 600;
  2653. }
  2654. .btn-back {
  2655. background: #21232b;
  2656. color: #ffa300;
  2657. padding: 7px 22px;
  2658. border-radius: 8px;
  2659. text-decoration: none;
  2660. border: none;
  2661. font-size: 1.01rem;
  2662. font-weight: 500;
  2663. margin-top: 12px;
  2664. transition: background 0.12s, color 0.13s;
  2665. display: inline-block;
  2666. }
  2667. .btn-back:hover {
  2668. background: #292b36;
  2669. color: #ffd740;
  2670. }
  2671. /* block diagram (IP header style) */
  2672. .block-diagram-section{margin:16px 0;background:transparent !important;border:none !important}
  2673. .block-diagram-title{font-size:16px;margin:0 0 12px;background:transparent !important;border:none !important}
  2674. .block-diagram-link{text-decoration:none;color:inherit;display:block;margin-bottom:8px}
  2675. .block-diagram-link *{text-decoration:none}
  2676. .block-diagram-link:hover,.block-diagram-link:hover *{text-decoration:none}
  2677. .block-diagram{border:2px solid #555;border-radius:0;overflow:hidden;margin-bottom:8px;background:#191b20 !important}
  2678. .block-diagram-ruler{display:grid;grid-template-columns:0fr 4fr 4fr 8fr 8fr 7fr;font-size:10px;color:#ffa300;padding:2px 0;background:#111 !important;border:none !important;border-bottom:2px solid #555 !important}
  2679. .block-diagram-ruler span{background:transparent !important;border:none !important;text-align:left;padding-left:2px;color:#ffa300}
  2680. .block-diagram-grid{display:grid;grid-template-columns:repeat(32,1fr)}
  2681. .block-diagram-cell{border:1px solid #555;padding:6px 8px;text-align:center;background:#1e1f23 !important;min-height:38px;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px}
  2682. .bd-label{font-size:10px;color:#ffa300;font-weight:bold;text-transform:uppercase;letter-spacing:0.5px;white-space:nowrap;background:transparent !important;border:none !important}
  2683. .bd-value{font-size:12px;font-family:'JetBrains Mono',monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#ffd740;text-decoration:none;background:transparent !important;border:none !important}
  2684. .bd-seq{grid-column:1/9}
  2685. .bd-type{grid-column:9/19}
  2686. .bd-ts{grid-column:19/33}
  2687. .bd-id{grid-column:1/33}
  2688. .bd-author{grid-column:1/33}
  2689. .bd-flags{grid-column:1/17}
  2690. .bd-ctype{grid-column:17/33}
  2691. .bd-data{grid-column:1/33}
  2692. .block-diagram:hover{border-color:inherit;box-shadow:none}
  2693. @media (max-width: 700px) {
  2694. .blockchain-view {
  2695. padding: 9vw 2vw;
  2696. }
  2697. .block, .block-single, .block--single {
  2698. padding: 15px 5vw;
  2699. }
  2700. .mode-buttons-row {
  2701. flex-direction: column;
  2702. gap: 18px;
  2703. }
  2704. }
  2705. /*inbox/pm*/
  2706. .pm-card.normal-pm { padding: 10px 12px; border-radius: 8px; margin-bottom: 10px; border: 1px solid #ffa300; background: transparent }
  2707. .pm-btn { padding: 6px 16px; border-radius: 6px; font-size: 12px; font-weight: 700; letter-spacing: 0.5px; cursor: pointer; border: 1px solid #ffa300; background: transparent; color: #ffa300; transition: background 0.15s, color 0.15s }
  2708. .pm-btn:hover { background: #ffa300; color: #000 }
  2709. .pm-thread { margin-bottom: 12px }
  2710. .pm-thread-details { margin-top: 0 }
  2711. .pm-thread-details[open] .pm-thread-icon { display: inline-block; transform: rotate(90deg) }
  2712. .pm-thread-toggle { cursor: pointer; padding: 6px 12px; font-size: 13px; font-weight: 600; list-style: none; display: flex; align-items: center; gap: 6px }
  2713. .pm-thread-toggle::-webkit-details-marker { display: none }
  2714. .pm-thread-icon { font-size: 10px; transition: transform 0.15s }
  2715. .pm-thread-replies { padding-left: 16px; border-left: 3px solid #ffa300; margin-left: 8px; margin-top: 4px }
  2716. .pm-info-table { width: 100%; border-collapse: collapse; margin-bottom: 8px }
  2717. .pm-info-table td { padding: 10px; border: 1px solid #444; font-size: 14px }
  2718. .pm-spacer { flex: 1 }
  2719. .pm-chars { font-size: 12px; opacity: .7 }
  2720. .pm-subject { margin: 0 0 6px 0; font-size: 14px; font-weight: 600; line-height: 1.2; white-space: pre-wrap }
  2721. .pm-bot { opacity: .85 }
  2722. .pm-body { margin-top: 6px }
  2723. .pm-action-form { display: inline-block; margin: 0 }
  2724. .pm-actions-block {
  2725. width: 100%;
  2726. max-width: 720px;
  2727. border: 0;
  2728. }
  2729. .pm-actions {
  2730. display: flex;
  2731. gap: 10px;
  2732. }
  2733. .pm-reply-badge { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 1px; padding: 2px 8px; border-radius: 4px; margin-bottom: 6px; background: rgba(255,163,0,0.15); color: #ffa300 }
  2734. .thread-level-0 { margin-left: 0 }
  2735. .thread-level-1 { margin-left: 16px; border-left: 3px solid #ffa300; padding-left: 12px }
  2736. .thread-level-2 { margin-left: 32px; border-left: 3px solid #ffa300; padding-left: 12px }
  2737. .thread-level-3 { margin-left: 48px; border-left: 3px solid #ffa300; padding-left: 12px }
  2738. .thread-level-4 { margin-left: 64px; border-left: 3px solid #ffa300; padding-left: 12px }
  2739. .thread-level-5 { margin-left: 80px; border-left: 3px solid #ffa300; padding-left: 12px }
  2740. .thread-level-6 { margin-left: 96px; border-left: 3px solid #ffa300; padding-left: 12px }
  2741. .thread-level-7 { margin-left: 112px; border-left: 3px solid #ffa300; padding-left: 12px }
  2742. .thread-level-8 { margin-left: 128px; border-left: 3px solid #ffa300; padding-left: 12px }
  2743. .pm-quote { border-left: 3px solid #ffa300; margin: 8px 0; padding: 8px 12px; opacity: 0.75; font-size: 13px; border-radius: 0 6px 6px 0 }
  2744. /*projects*/
  2745. .project-actions {
  2746. display: flex;
  2747. justify-content: flex-start;
  2748. align-items: center;
  2749. gap: 10px;
  2750. }
  2751. .project-card.status-completed .badge{ background:rgba(59,130,246,.12); color:#93c5fd; border-color:rgba(59,130,246,.25); }
  2752. .bookmark-actions.project-actions {
  2753. display: flex;
  2754. flex-wrap: wrap;
  2755. align-items: center;
  2756. justify-content: flex-end;
  2757. gap: 14px;
  2758. }
  2759. .bookmark-actions.project-actions form {
  2760. margin: 0;
  2761. }
  2762. .project-control-form {
  2763. display: flex;
  2764. align-items: center;
  2765. gap: 10px;
  2766. flex-wrap: nowrap;
  2767. }
  2768. .project-control-select,
  2769. .project-control-input,
  2770. .project-control-btn {
  2771. height: 42px;
  2772. }
  2773. .project-control-select,
  2774. .project-control-input {
  2775. min-width: 220px;
  2776. }
  2777. .project-control-btn {
  2778. white-space: nowrap;
  2779. }
  2780. .project-progress-input {
  2781. max-width: 140px;
  2782. min-width: 120px;
  2783. }
  2784. @media (max-width: 820px) {
  2785. .project-control-select,
  2786. .project-control-input {
  2787. min-width: 180px;
  2788. }
  2789. .project-progress-input {
  2790. min-width: 110px;
  2791. }
  2792. }
  2793. .badge{
  2794. position:absolute;
  2795. top:14px; right:14px;
  2796. font-size:.75rem;
  2797. letter-spacing:.02em;
  2798. padding:6px 8px;
  2799. border-radius:8px;
  2800. border:1px solid var(--line);
  2801. color:var(--muted);
  2802. }
  2803. .milestones, .bounties{ display:flex; flex-direction:column; gap:8px; }
  2804. .milestone-item, .bounty-item{
  2805. padding:12px;
  2806. border:1px solid var(--line);
  2807. border-radius:12px;
  2808. background:#121620;
  2809. }
  2810. .milestone-row{
  2811. display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between;
  2812. margin-bottom:6px;
  2813. }
  2814. .milestone-title{ font-weight:600; }
  2815. .milestone-percent{ padding:4px 8px; border-radius:8px; border:1px solid var(--line); font-size:.8rem; color:#b7c2d6; }
  2816. .milestone-due{ color:#c9a86a; font-size:.85rem; }
  2817. .bounty-main{
  2818. display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px;
  2819. }
  2820. .bounty-title{ font-weight:600; }
  2821. .bounty-amount{
  2822. font-variant-numeric: tabular-nums;
  2823. padding:4px 8px; border-radius:8px; background:#18202f; border:1px solid var(--line);
  2824. }
  2825. .pledge-box{
  2826. margin-top:6px;
  2827. padding:14px;
  2828. border:1px solid var(--line);
  2829. border-radius:12px;
  2830. background:#121620;
  2831. display:grid;
  2832. gap:10px;
  2833. }
  2834. .pledge-box form{ display:flex; gap:10px; flex-wrap:wrap; }
  2835. .pledge-box input[type="number"]{
  2836. background:#0f1420; border:1px solid #2b3240; color:var(--text);
  2837. padding:10px 12px; border-radius:10px; outline:none;
  2838. }
  2839. .pledge-box input[type="number"]:focus{ border-color:#3a475c; }
  2840. .card-field{display:flex;align-items:baseline;gap:6px;margin-bottom:4px;flex-wrap:wrap}
  2841. .card-field>.card-label{white-space:nowrap;flex-shrink:0}
  2842. .card-field>.card-value{min-width:0;word-break:break-word;overflow-wrap:anywhere;flex:1 1 auto}
  2843. .card-field-stacked{flex-direction:column;align-items:flex-start;gap:2px}
  2844. .card-field-stacked .card-value{white-space:pre-wrap;word-break:break-word}
  2845. .card-field-rich{flex-direction:column;align-items:flex-start}
  2846. .card-field-rich .card-value{white-space:pre-wrap;word-break:break-word;margin-top:4px}
  2847. .report-template{margin-top:12px;padding:12px;background:rgba(255,255,255,0.05);border-radius:8px}
  2848. .report-template .card-label{white-space:nowrap}
  2849. @media (max-width: 420px){
  2850. .card-field{ flex-direction:column; }
  2851. .milestone-row{ flex-direction:column; align-items:flex-start; gap:6px; }
  2852. }
  2853. /*banking*/
  2854. .addr-form-card, .addr-list-card {
  2855. border: 1px solid rgba(255,255,255,0.1);
  2856. border-radius: 12px;
  2857. background: rgba(255,255,255,0.03);
  2858. padding: 20px;
  2859. }
  2860. .addr-form-card.wide {
  2861. padding: 22px;
  2862. }
  2863. .addr-form .form-row {
  2864. display: grid;
  2865. grid-template-columns: 140px 1fr;
  2866. gap: 10px;
  2867. align-items: center;
  2868. margin-bottom: 12px;
  2869. }
  2870. .addr-form .form-input {
  2871. padding: 0 14px;
  2872. }
  2873. .addr-form .form-input.xl {
  2874. height: 50px;
  2875. font-size: 16px;
  2876. }
  2877. .addr-form .form-actions {
  2878. display: flex;
  2879. margin-top: 8px;
  2880. }
  2881. .addr-list-card .form-row {
  2882. display: grid;
  2883. grid-template-columns: 150px 1fr;
  2884. gap: 10px;
  2885. align-items: center;
  2886. }
  2887. .addr-list-card .form-input {
  2888. padding: 0 14px;
  2889. }
  2890. .addr-search input[type="text"]:focus,
  2891. .addr-form .form-input:focus {
  2892. outline: none;
  2893. border-color: #ffa300;
  2894. }
  2895. .addr-form .form-actions .mini-btn {
  2896. background: #ffa300;
  2897. border: none;
  2898. color: #fff;
  2899. padding: 9px 14px;
  2900. border-radius: 8px;
  2901. cursor: pointer;
  2902. }
  2903. .addr-form .form-actions .mini-btn:hover {
  2904. background: #ff7f00;
  2905. }
  2906. .bank-summary .bank-info-table tbody tr .synced {
  2907. color: green;
  2908. font-weight: bold;
  2909. }
  2910. .bank-summary .bank-info-table tbody tr .outdated {
  2911. color: red;
  2912. font-weight: bold;
  2913. }
  2914. .bank-claim-ubi{margin:16px 0}
  2915. .bank-claim-card{border:1px solid #FFA500;border-radius:8px;padding:16px;margin:8px 0}
  2916. .bank-claim-card p{margin:4px 0}
  2917. .bank-claim-btn{font-size:16px;padding:10px 24px;margin-top:8px}
  2918. .bank-eco-chart-block{margin:24px 0;border:1px solid #2a2a2a;border-radius:8px;padding:16px;background:#111}
  2919. .bank-eco-chart-title{font-size:16px;margin:0 0 12px 0;color:#FFA500}
  2920. .bank-eco-chart-canvas{width:100%;overflow:hidden}
  2921. .bank-eco-chart-svg{width:100%;height:auto;display:block}
  2922. .bank-eco-chart-bg{fill:#0e0e0e}
  2923. .bank-eco-chart-grid{stroke:#1f1f1f;stroke-width:1}
  2924. .bank-eco-chart-axis{fill:#FFD700;font-size:10px;font-family:monospace}
  2925. .bank-eco-chart-empty{fill:#888;font-size:14px;font-family:monospace}
  2926. .bank-eco-chart-line-value{fill:none;stroke:#FFA500;stroke-width:2}
  2927. .bank-eco-chart-line-supply{fill:none;stroke:#4aa3ff;stroke-width:1.5;stroke-dasharray:4,3}
  2928. .bank-eco-chart-line-inflation{fill:none;stroke:#e74c3c;stroke-width:1.5;stroke-dasharray:2,3}
  2929. .bank-eco-chart-line-value-legend{fill:#FFA500}
  2930. .bank-eco-chart-line-supply-legend{fill:#4aa3ff}
  2931. .bank-eco-chart-line-inflation-legend{fill:#e74c3c}
  2932. .bank-eco-chart-legend-text{fill:#bbb;font-size:11px;font-family:monospace}
  2933. .transfer-block-card{margin-top:16px;border-top:2px solid #2a2a2a}
  2934. .transfer-block-card h2{font-size:16px;color:#FFA500;margin:0 0 8px 0}
  2935. .melody-player-card{border:1px solid #2a2a2a;border-radius:8px;padding:16px;background:#111;margin:16px 0}
  2936. .melody-meta{margin-bottom:12px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
  2937. .melody-meta-sep{color:#555}
  2938. .melody-audio{width:100%;max-width:520px}
  2939. .melody-section-title{font-size:16px;color:#FFA500;margin:16px 0 8px 0}
  2940. .melody-help{color:#888;font-size:13px;margin:0 0 12px 0}
  2941. .melody-notes-grid{display:flex;flex-wrap:wrap;gap:6px}
  2942. .melody-note-chip{display:inline-flex;flex-direction:column;align-items:center;border:1px solid #333;border-radius:6px;padding:6px 10px;background:#161616;min-width:54px}
  2943. .melody-note-name{color:#FFA500;font-family:monospace;font-size:13px;font-weight:600}
  2944. .melody-note-type{color:#888;font-size:10px;text-transform:uppercase;letter-spacing:.5px}
  2945. .melody-composition{margin:16px 0}
  2946. .melody-stats{margin:16px 0}
  2947. .melody-regen-form{margin-top:10px}
  2948. .pub-item{border:1;border-radius:10px;background:none}
  2949. .snh-invite-box{border:1px solid currentColor;border-radius:8px;padding:16px;margin:12px 0;font-family:monospace}
  2950. .snh-invite-name{margin:0 0 8px 0}
  2951. .snh-invite-date{font-size:13px;opacity:0.7;margin:0 0 10px 0}
  2952. .snh-invite-btn{display:block;word-break:break-all;font-size:14px;margin:0;cursor:pointer;background:none;border:1px solid #FFA500;color:#FFA500;padding:10px;border-radius:5px;width:auto;text-align:left;font-family:monospace}
  2953. .error-box{background:#222326;border:none;color:#f5c242;padding:12px;border-radius:8px;margin-top:8px}
  2954. .error-title{margin:0 0 6px 0;font-weight:600}
  2955. .error-pre{margin:0;white-space:pre-wrap;font-family:monospace}
  2956. .shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin:8px 0}
  2957. .shop-card{border:1px solid #333;border-radius:8px;overflow:hidden;display:flex;flex-direction:column}
  2958. .shop-card-media{max-height:200px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#111}
  2959. .shop-card-media img,.shop-media{width:100%;max-height:200px;object-fit:cover}
  2960. .shop-card-body{padding:12px;display:flex;flex-direction:column;gap:6px}
  2961. .shop-title-link{color:#FFA500;text-decoration:none}
  2962. .shop-card-desc{font-size:14px;opacity:0.85;margin:0}
  2963. .shop-card-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:13px}
  2964. .shop-open{color:#0f0;font-weight:bold}
  2965. .shop-closed{color:#f44;font-weight:bold}
  2966. .shop-product-count{color:#FFA500}
  2967. .shop-location{opacity:0.7}
  2968. .shop-card-tags{display:flex;flex-wrap:wrap;gap:4px}
  2969. .shop-card-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
  2970. .shop-detail{padding:8px 0}
  2971. .shop-detail-media{max-width:100%;margin:12px 0}
  2972. .shop-detail-media img{max-width:100%;border-radius:6px}
  2973. .shop-detail-desc{margin:8px 0}
  2974. .shop-share{margin:8px 0;display:flex;align-items:center;gap:8px}
  2975. .shop-share-input{flex:1;background:#222;border:1px solid #555;color:#ccc;padding:6px 10px;border-radius:4px;font-family:monospace;font-size:13px}
  2976. .shop-products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:12px 0}
  2977. .shop-product-card{border:1px solid #333;border-radius:8px;overflow:hidden;display:flex;flex-direction:column}
  2978. .shop-product-media{max-height:180px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#111}
  2979. .shop-product-media img{width:100%;max-height:180px;object-fit:cover}
  2980. .shop-product-body{padding:10px;display:flex;flex-direction:column;gap:6px}
  2981. .shop-product-price{font-size:18px;font-weight:bold;color:#FFA500}
  2982. .shop-product-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
  2983. .shop-add-product{border:1px dashed #555;border-radius:8px;padding:16px;margin:12px 0}
  2984. .shop-featured-products{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
  2985. .shop-featured-item{display:flex;flex-direction:column;align-items:center;width:72px;text-decoration:none;border:1px solid #333;border-radius:6px;overflow:hidden;background:#111}
  2986. .shop-featured-item:hover{border-color:#FFA500}
  2987. .shop-featured-thumb{width:72px;height:72px;object-fit:cover}
  2988. .shop-featured-price{font-size:11px;color:#FFA500;padding:4px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}
  2989. .shop-product-stars{color:#FFA500;font-size:14px;letter-spacing:1px}
  2990. .card-field-mb{margin-bottom:10px}
  2991. .card-field-mt{margin-top:10px}
  2992. .card-tags-mt{margin-top:10px}
  2993. .card-label-bold{font-weight:800}
  2994. .card-value-bold{margin-left:10px;font-weight:800}
  2995. .contact-bold{font-weight:bold}
  2996. .textarea-full{width:100%}
  2997. .shop-form{padding:8px 0}
  2998. .shop-form input[type="text"],.shop-form input[type="number"],.shop-form textarea,.shop-form select{width:100%;max-width:480px;padding:8px;margin:4px 0 8px 0;background:#222;border:1px solid #555;color:#ccc;border-radius:4px;font-family:monospace}
  2999. /* carbon footprint chart */
  3000. .carbon-section-title{font-size:18px;color:#555;margin:8px 0;font-weight:600}
  3001. .carbon-chart{margin:12px 0;background:transparent !important;border:none !important}
  3002. .carbon-bar-label{display:flex;justify-content:space-between;font-size:14px;margin:4px 0 2px;background:transparent !important;border:none !important}
  3003. .carbon-bar-track{background:#3a3a3a !important;border-radius:6px;height:22px;overflow:hidden;border:none !important}
  3004. .carbon-bar-fill{height:100%;border-radius:6px;min-width:2px;transition:width 0.4s ease;border:none !important}
  3005. .carbon-bar-network{background:#2ecc71 !important}
  3006. .carbon-bar-mine{background:#3498db !important}
  3007. .carbon-bar-max{background:#555 !important;border:none !important}
  3008. .carbon-bar-note{font-size:13px;color:#ffd700;margin:6px 0 2px}
  3009. .carbon-bar-formula{font-size:12px;color:#ffd700;margin:2px 0 10px}
  3010. /* parliament */
  3011. .cycle-info {
  3012. display: grid;
  3013. grid-template-columns: repeat(3, minmax(0, 1fr));
  3014. gap: .75rem;
  3015. margin-bottom: 1rem;
  3016. }
  3017. .kpi {
  3018. border: 1px solid rgba(0,0,0,.08);
  3019. border-radius: 8px;
  3020. padding: .75rem;
  3021. }
  3022. .kpi__label {
  3023. display: block;
  3024. letter-spacing: .06em;
  3025. text-transform: uppercase;
  3026. color: var(--parl-accent, #ff9f1a);
  3027. opacity: 1;
  3028. }
  3029. .kpi__value {
  3030. font-weight: 600;
  3031. }
  3032. .method-badge,
  3033. .method-hero {
  3034. display: inline-flex;
  3035. align-items: center;
  3036. gap: .5rem;
  3037. }
  3038. .method-cell {
  3039. text-align: center;
  3040. }
  3041. .leader-cell {
  3042. text-align: center;
  3043. }
  3044. .mt-2 { margin-top: .5rem; }
  3045. .parliament-actor-table {
  3046. table-layout: auto;
  3047. width: 100%;
  3048. }
  3049. .parliament-actor-table th,
  3050. .parliament-actor-table td {
  3051. vertical-align: top;
  3052. }
  3053. .parliament-actor-col {
  3054. white-space: nowrap;
  3055. width: 1%;
  3056. text-align: left;
  3057. }
  3058. .parliament-actor-col .user-link {
  3059. display: inline-block;
  3060. }
  3061. .parliament-description-col {
  3062. white-space: normal;
  3063. text-align: left;
  3064. }
  3065. .parliament-members-row td {
  3066. padding-top: .5rem;
  3067. }
  3068. .parliament-members-list {
  3069. margin: .25rem 0 0;
  3070. padding-left: 1.25rem;
  3071. }
  3072. .parliament-members-list li {
  3073. margin: .125rem 0;
  3074. }
  3075. .oasis-footer {
  3076. display: flex;
  3077. flex-direction: column;
  3078. align-items: center;
  3079. gap: 12px;
  3080. padding: 2px 10px;
  3081. border-top: 1px solid rgba(255,255,255,0.08);
  3082. line-height: 1;
  3083. min-height: 0;
  3084. margin-top: 5px;
  3085. }
  3086. .oasis-footer-center {
  3087. margin-top: 15px;
  3088. text-align: center;
  3089. line-height: 1.6;
  3090. box-shadow: 0 2px 20px 0 #FFD60024;
  3091. }
  3092. .oasis-footer-pulse-row{display:inline-block}
  3093. .oasis-footer-pulse-label{color:inherit}
  3094. .oasis-footer-logo-link {
  3095. display: block;
  3096. margin: 0 auto;
  3097. }
  3098. .oasis-footer-logo {
  3099. width: 48px;
  3100. height: 48px;
  3101. border-radius: 10px;
  3102. object-fit: cover;
  3103. display: block;
  3104. margin: 0 auto;
  3105. }
  3106. .oasis-footer-package-link,
  3107. .oasis-footer-package-name,
  3108. .oasis-footer-version,
  3109. .oasis-footer-sep {
  3110. line-height: 1;
  3111. }
  3112. .oasis-footer-package-link {
  3113. text-decoration: none;
  3114. }
  3115. .oasis-footer-package-link,
  3116. .oasis-footer-center a,
  3117. .oasis-footer-center span,
  3118. .oasis-footer-center strong {
  3119. padding-top: 0;
  3120. padding-bottom: 0;
  3121. margin: 0;
  3122. }
  3123. .oasis-footer-center a {
  3124. background-color: transparent !important;
  3125. padding: 0 !important;
  3126. border-radius: 0 !important;
  3127. text-decoration: none !important;
  3128. font-weight: normal !important;
  3129. box-shadow: none !important;
  3130. }
  3131. .oasis-footer-carbon {
  3132. font-size: inherit;
  3133. }
  3134. .inbox-badge {
  3135. display: inline-block;
  3136. background: #e74c3c;
  3137. color: #fff;
  3138. font-size: 0.7em;
  3139. font-weight: bold;
  3140. padding: 1px 5px;
  3141. border-radius: 10px;
  3142. margin-left: 4px;
  3143. min-width: 16px;
  3144. text-align: center;
  3145. line-height: 1.4;
  3146. vertical-align: middle;
  3147. }
  3148. .reply-context {
  3149. border-left: 3px solid #666;
  3150. padding-left: 10px;
  3151. margin-bottom: 8px;
  3152. opacity: 0.85;
  3153. }
  3154. .carbon-footprint-bar {
  3155. height: 18px;
  3156. border-radius: 4px;
  3157. transition: width 0.3s;
  3158. }
  3159. .block-canvas-container {
  3160. border: 1px solid #555;
  3161. border-radius: 8px;
  3162. overflow: hidden;
  3163. margin: 16px 0;
  3164. }
  3165. .dominant-opinion {
  3166. font-weight: bold;
  3167. margin-left: 6px;
  3168. padding: 2px 8px;
  3169. border-radius: 4px;
  3170. font-size: 0.85em;
  3171. }
  3172. .feed-success-msg {
  3173. padding: 12px 16px;
  3174. border-radius: 6px;
  3175. margin-bottom: 16px;
  3176. border: 1px solid #2ecc71;
  3177. background: rgba(46,204,113,0.1);
  3178. }
  3179. .preset-group {
  3180. display: flex;
  3181. flex-direction: row;
  3182. flex-wrap: wrap;
  3183. gap: 8px;
  3184. padding: 12px;
  3185. margin-bottom: 12px;
  3186. }
  3187. .preset-group-title {
  3188. font-weight: bold;
  3189. margin-bottom: 8px;
  3190. }
  3191. .activity-tribe-meta{display:flex;gap:.6em;flex-wrap:wrap}
  3192. .tribe-card:hover {
  3193. border-color: #ffa500;
  3194. }
  3195. .tribe-card-body {
  3196. padding: 12px 16px 16px;
  3197. display: flex;
  3198. flex-direction: column;
  3199. gap: 6px;
  3200. }
  3201. .tribe-card-title {
  3202. margin: 0;
  3203. font-size: 1.15em;
  3204. }
  3205. .tribe-card-footer {
  3206. display: flex;
  3207. align-items: center;
  3208. gap: 12px;
  3209. flex-wrap: wrap;
  3210. margin-top: 4px;
  3211. }
  3212. .tribe-card-tags {
  3213. display: flex;
  3214. gap: 6px;
  3215. flex-wrap: wrap;
  3216. }
  3217. .tribe-side h2 {
  3218. margin: 0;
  3219. }
  3220. .tribe-side-meta {
  3221. display: flex;
  3222. flex-direction: column;
  3223. gap: 4px;
  3224. }
  3225. .tribe-side-description {
  3226. color: #cfd3e1;
  3227. font-size: 14px;
  3228. line-height: 1.5;
  3229. }
  3230. .tribe-side-tags {
  3231. display: flex;
  3232. gap: 8px;
  3233. flex-wrap: wrap;
  3234. }
  3235. .tribe-side-footer {
  3236. border-top: 1px solid #444;
  3237. padding-top: 8px;
  3238. }
  3239. .tribe-side-footer p {
  3240. margin: 2px 0;
  3241. font-size: 13px;
  3242. }
  3243. .tribe-side-actions {
  3244. display: flex;
  3245. gap: 8px;
  3246. flex-wrap: wrap;
  3247. margin: 8px 0;
  3248. }
  3249. .tribe-side-actions form {
  3250. margin: 0;
  3251. }
  3252. .tribe-side-subtribes {
  3253. margin: 8px 0;
  3254. }
  3255. .tribe-subtribes-list {
  3256. display: flex;
  3257. flex-direction: column;
  3258. gap: 4px;
  3259. }
  3260. .tribe-subtribe-link {
  3261. display: block;
  3262. width: 100%;
  3263. text-align: left;
  3264. padding: 8px 12px;
  3265. background: #1c1c1c;
  3266. border: 1px solid #333;
  3267. border-radius: 6px;
  3268. color: #ffa500;
  3269. cursor: pointer;
  3270. font-size: 14px;
  3271. }
  3272. .tribe-subtribe-link:hover {
  3273. background: #333;
  3274. }
  3275. .tribe-members-count {
  3276. color: #ffa500;
  3277. font-size: 18px;
  3278. }
  3279. .tribe-mode-buttons {
  3280. display: flex;
  3281. gap: 8px;
  3282. margin-top: 16px;
  3283. }
  3284. .tribe-card-image-wrapper {
  3285. position: relative;
  3286. overflow: hidden;
  3287. }
  3288. .tribe-card-hero-image {
  3289. display: block;
  3290. width: 100%;
  3291. height: 200px;
  3292. object-fit: cover;
  3293. }
  3294. .tribe-card-description {
  3295. font-size: 14px;
  3296. line-height: 1.45;
  3297. color: #cfd3e1;
  3298. margin: 0;
  3299. }
  3300. .tribe-info-table {
  3301. width: 100%;
  3302. border-collapse: collapse;
  3303. margin: 8px 0;
  3304. }
  3305. .tribe-info-table td {
  3306. padding: 6px 8px;
  3307. border: 1px solid #555;
  3308. font-size: 12px;
  3309. }
  3310. .tribe-info-label {
  3311. font-size: 10px;
  3312. color: #ffa300;
  3313. font-weight: bold;
  3314. text-transform: uppercase;
  3315. letter-spacing: 0.5px;
  3316. white-space: nowrap;
  3317. background: #1e1f23;
  3318. }
  3319. .tribe-info-value {
  3320. font-size: 12px;
  3321. font-family: 'JetBrains Mono', monospace;
  3322. color: #ffd740;
  3323. background: #1e1f23;
  3324. }
  3325. .tribe-info-empty {
  3326. color: #9aa3b2;
  3327. font-size: 12px;
  3328. font-style: italic;
  3329. }
  3330. .tribe-card-members {
  3331. border: none;
  3332. border-radius: 4px;
  3333. padding: 8px;
  3334. margin: 6px 0;
  3335. background: #1e1f23;
  3336. text-align: center;
  3337. }
  3338. .tribe-card-actions {
  3339. border: 1px solid #555;
  3340. border-radius: 4px;
  3341. padding: 8px;
  3342. margin: 6px 0;
  3343. background: #1e1f23;
  3344. display: flex;
  3345. gap: 8px;
  3346. justify-content: center;
  3347. }
  3348. .tribe-action-btn {
  3349. padding: 6px 16px;
  3350. border-radius: 6px;
  3351. font-size: 12px;
  3352. font-weight: 700;
  3353. letter-spacing: 0.5px;
  3354. cursor: pointer;
  3355. border: 1px solid #ffa300;
  3356. background: transparent;
  3357. color: #ffa300;
  3358. transition: background 0.15s, color 0.15s;
  3359. }
  3360. .tribe-action-btn:hover {
  3361. background: #ffa300;
  3362. color: #000;
  3363. }
  3364. .tribe-action-btn.danger-btn { border-color: #d9534f; color: #d9534f; }
  3365. .tribe-action-btn.danger-btn:hover { background: #d9534f; color: #000; }
  3366. .calendar-interval-block { margin: 8px 0 16px; }
  3367. .calendar-interval-label { display: block; margin-bottom: 6px; }
  3368. .calendar-interval-until { margin-top: 10px; }
  3369. .calendar-interval-row { display: flex; gap: 16px; flex-wrap: wrap; }
  3370. .calendar-interval-option { display: flex; align-items: center; gap: 4px; cursor: pointer; white-space: nowrap; }
  3371. .tribe-thumb-grid {
  3372. display: grid;
  3373. grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  3374. gap: 8px;
  3375. }
  3376. .tribe-thumb-link {
  3377. display: block;
  3378. width: 100%;
  3379. aspect-ratio: 1;
  3380. overflow: hidden;
  3381. border-radius: 6px;
  3382. border: 1px solid #555;
  3383. transition: border-color 0.15s;
  3384. }
  3385. .tribe-thumb-link:hover {
  3386. border-color: #ffa300;
  3387. }
  3388. .tribe-thumb-img {
  3389. display: block;
  3390. width: 100%;
  3391. height: 100%;
  3392. object-fit: cover;
  3393. }
  3394. .tribe-feed-compose {
  3395. display: flex;
  3396. flex-direction: column;
  3397. gap: 8px;
  3398. margin-bottom: 16px;
  3399. }
  3400. .tribe-feed-compose textarea {
  3401. width: 100%;
  3402. box-sizing: border-box;
  3403. }
  3404. .tribe-feed-compose .tribe-feed-send {
  3405. align-self: flex-end;
  3406. }
  3407. .tribe-parent-box {
  3408. margin-bottom: 12px;
  3409. text-align: center;
  3410. }
  3411. .tribe-parent-box h2 {
  3412. margin: 0 0 8px 0;
  3413. }
  3414. .tribe-parent-link {
  3415. display: block;
  3416. }
  3417. .tribe-parent-image {
  3418. width: 100%;
  3419. max-width: 200px;
  3420. border-radius: 8px;
  3421. border: 2px solid #444;
  3422. }
  3423. .tribe-card-meta-row {
  3424. display: flex;
  3425. gap: .5em;
  3426. flex-wrap: wrap;
  3427. font-size: 12px;
  3428. }
  3429. .tribe-meta-label {
  3430. color: #9aa3b2;
  3431. font-size: 12px;
  3432. }
  3433. .tribe-tag-link {
  3434. margin-right: 0.8em;
  3435. margin-bottom: 0.5em;
  3436. }
  3437. .tribe-member-actions {
  3438. display: flex;
  3439. gap: 6px;
  3440. flex-wrap: wrap;
  3441. margin-top: 4px;
  3442. }
  3443. .tribe-visit-btn-wrapper {
  3444. position: absolute;
  3445. bottom: 8px;
  3446. right: 8px;
  3447. }
  3448. .tribe-grid {
  3449. display: grid;
  3450. grid-template-columns: repeat(3, 1fr);
  3451. gap: 20px;
  3452. }
  3453. .tribe-section-nav {
  3454. display: flex;
  3455. flex-wrap: wrap;
  3456. gap: 4px;
  3457. margin-bottom: 16px;
  3458. padding-bottom: 8px;
  3459. }
  3460. .tribe-section-nav form {
  3461. margin: 0;
  3462. }
  3463. .tribe-section-group {
  3464. display: flex;
  3465. gap: 4px;
  3466. padding: 0 8px;
  3467. flex-wrap: wrap;
  3468. align-items: center;
  3469. border: 0px;
  3470. }
  3471. .tribe-section-group-label {
  3472. font-size: 10px;
  3473. text-transform: uppercase;
  3474. color: #ffcc00;
  3475. letter-spacing: 1px;
  3476. width: 100%;
  3477. padding: 0 4px 2px;
  3478. font-weight: bold;
  3479. }
  3480. .tribe-section-group:last-child {
  3481. border-right: none;
  3482. }
  3483. .tribe-section-nav .filter-btn {
  3484. padding: 8px 12px;
  3485. text-transform: uppercase;
  3486. }
  3487. .tribe-section-nav .filter-btn.active {
  3488. background: #ffcc00;
  3489. color: #000;
  3490. }
  3491. .tribe-content-card {
  3492. background: #1c1c1c;
  3493. border: 1px solid #333;
  3494. border-radius: 8px;
  3495. padding: 16px;
  3496. margin-bottom: 12px;
  3497. }
  3498. .tribe-content-card h2 {
  3499. margin-top: 0;
  3500. }
  3501. .tribe-content-grid {
  3502. display: grid;
  3503. grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  3504. gap: 16px;
  3505. }
  3506. .tribe-content-list {
  3507. display: flex;
  3508. flex-direction: column;
  3509. gap: 12px;
  3510. }
  3511. .tribe-content-header {
  3512. display: flex;
  3513. justify-content: space-between;
  3514. align-items: center;
  3515. margin-bottom: 16px;
  3516. }
  3517. .tribe-search-form{display:flex;gap:10px;align-items:center}
  3518. .tribe-content-filters {
  3519. display: flex;
  3520. gap: 8px;
  3521. margin-bottom: 12px;
  3522. }
  3523. .tribe-content-status {
  3524. display: inline-block;
  3525. padding: 2px 8px;
  3526. border-radius: 4px;
  3527. font-size: 12px;
  3528. font-weight: bold;
  3529. }
  3530. .tribe-content-status-open {
  3531. background: #2d5a27;
  3532. color: #7cc576;
  3533. }
  3534. .tribe-content-status-closed {
  3535. background: #5a2727;
  3536. color: #c57676;
  3537. }
  3538. .tribe-content-status-in-progress {
  3539. background: #5a4e27;
  3540. color: #c5b576;
  3541. }
  3542. .tribe-content-meta {
  3543. display: flex;
  3544. gap: 12px;
  3545. flex-wrap: wrap;
  3546. margin: 8px 0;
  3547. color: #9aa3b2;
  3548. font-size: 14px;
  3549. }
  3550. .tribe-content-actions {
  3551. display: flex;
  3552. gap: 8px;
  3553. margin-top: 12px;
  3554. }
  3555. .tribe-content-actions form {
  3556. margin: 0;
  3557. }
  3558. .tribe-inhabitants-grid {
  3559. display: grid;
  3560. grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  3561. gap: 16px;
  3562. }
  3563. .tribe-inhabitant-card {
  3564. background: #1c1c1c;
  3565. border-radius: 8px;
  3566. padding: 12px;
  3567. text-align: center;
  3568. }
  3569. .tribe-inhabitant-avatar {
  3570. width: 64px;
  3571. height: 64px;
  3572. border-radius: 50%;
  3573. object-fit: cover;
  3574. }
  3575. .tribe-votation-options {
  3576. display: flex;
  3577. flex-direction: column;
  3578. gap: 8px;
  3579. margin: 12px 0;
  3580. }
  3581. .tribe-votation-option {
  3582. display: flex;
  3583. align-items: center;
  3584. gap: 12px;
  3585. }
  3586. .tribe-votation-bar {
  3587. background: #333;
  3588. border-radius: 4px;
  3589. height: 24px;
  3590. position: relative;
  3591. overflow: hidden;
  3592. flex: 1;
  3593. }
  3594. .tribe-votation-fill {
  3595. background: #ff6600;
  3596. height: 100%;
  3597. border-radius: 4px;
  3598. transition: width 0.3s ease;
  3599. }
  3600. .tribe-fill-0 { width: 0%; }
  3601. .tribe-fill-5 { width: 5%; }
  3602. .tribe-fill-10 { width: 10%; }
  3603. .tribe-fill-15 { width: 15%; }
  3604. .tribe-fill-20 { width: 20%; }
  3605. .tribe-fill-25 { width: 25%; }
  3606. .tribe-fill-30 { width: 30%; }
  3607. .tribe-fill-35 { width: 35%; }
  3608. .tribe-fill-40 { width: 40%; }
  3609. .tribe-fill-45 { width: 45%; }
  3610. .tribe-fill-50 { width: 50%; }
  3611. .tribe-fill-55 { width: 55%; }
  3612. .tribe-fill-60 { width: 60%; }
  3613. .tribe-fill-65 { width: 65%; }
  3614. .tribe-fill-70 { width: 70%; }
  3615. .tribe-fill-75 { width: 75%; }
  3616. .tribe-fill-80 { width: 80%; }
  3617. .tribe-fill-85 { width: 85%; }
  3618. .tribe-fill-90 { width: 90%; }
  3619. .tribe-fill-95 { width: 95%; }
  3620. .tribe-fill-100 { width: 100%; }
  3621. .tribe-votation-label {
  3622. min-width: 120px;
  3623. color: #ccc;
  3624. }
  3625. .tribe-votation-count {
  3626. min-width: 40px;
  3627. text-align: right;
  3628. color: #9aa3b2;
  3629. }
  3630. .tribe-forum-thread {
  3631. background: #1c1c1c;
  3632. border: 1px solid #333;
  3633. border-radius: 8px;
  3634. padding: 16px;
  3635. margin-bottom: 12px;
  3636. }
  3637. .tribe-forum-reply {
  3638. background: #222;
  3639. border-left: 3px solid #ff6600;
  3640. padding: 12px;
  3641. margin: 8px 0 8px 24px;
  3642. border-radius: 0 8px 8px 0;
  3643. }
  3644. .tribe-forum-reply-form {
  3645. margin-top: 16px;
  3646. }
  3647. .tribe-media-grid {
  3648. display: grid;
  3649. grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  3650. gap: 18px;
  3651. }
  3652. .tribe-media-item {
  3653. background: #1c1c1c;
  3654. border-radius: 8px;
  3655. overflow: hidden;
  3656. border: 1px solid #333;
  3657. transition: border-color .2s;
  3658. padding-bottom: 8px;
  3659. }
  3660. .tribe-media-item:hover {
  3661. border-color: #ffa500;
  3662. }
  3663. .tribe-media-item a {
  3664. display: block;
  3665. }
  3666. .tribe-media-thumb {
  3667. width: 100%;
  3668. height: 160px;
  3669. object-fit: cover;
  3670. display: block;
  3671. cursor: pointer;
  3672. }
  3673. .tribe-media-audio {
  3674. width: 100%;
  3675. padding: 8px;
  3676. box-sizing: border-box;
  3677. }
  3678. .tribe-media-item img {
  3679. width: 100%;
  3680. height: 160px;
  3681. object-fit: cover;
  3682. }
  3683. .tribe-media-item video {
  3684. width: 100%;
  3685. height: 160px;
  3686. object-fit: cover;
  3687. }
  3688. .tribe-media-title-link {
  3689. color: #ffa500;
  3690. font-weight: bold;
  3691. text-decoration: none;
  3692. display: block;
  3693. margin-bottom: 4px;
  3694. }
  3695. .tribe-media-title-link:hover {
  3696. text-decoration: underline;
  3697. }
  3698. .tribe-media-item-info {
  3699. padding: 12px;
  3700. }
  3701. .tribe-media-date {
  3702. margin: 6px 0 2px 0;
  3703. font-size: 0.85em;
  3704. }
  3705. .tribe-media-author {
  3706. margin: 0 0 6px 0;
  3707. font-size: 0.85em;
  3708. }
  3709. .tribe-media-filters {
  3710. display: flex;
  3711. gap: 8px;
  3712. margin-bottom: 12px;
  3713. }
  3714. .tribe-overview-grid {
  3715. display: grid;
  3716. grid-template-columns: 1fr 1fr;
  3717. gap: 16px;
  3718. }
  3719. .tribe-overview-section {
  3720. background: #1c1c1c;
  3721. border-radius: 8px;
  3722. padding: 16px;
  3723. }
  3724. .tribe-overview-section h2 {
  3725. margin-top: 0;
  3726. font-size: 16px;
  3727. border-bottom: 1px solid #333;
  3728. padding-bottom: 8px;
  3729. }
  3730. .tribe-priority-critical {
  3731. color: #ff4444;
  3732. font-weight: bold;
  3733. }
  3734. .tribe-priority-high {
  3735. color: #ff8800;
  3736. font-weight: bold;
  3737. }
  3738. .tribe-priority-medium {
  3739. color: #ffcc00;
  3740. }
  3741. .tribe-priority-low {
  3742. color: #88cc88;
  3743. }
  3744. .tribe-feed-compose {
  3745. display: flex;
  3746. flex-direction: column;
  3747. gap: 8px;
  3748. margin-bottom: 16px;
  3749. }
  3750. .tribe-feed-compose textarea {
  3751. width: 100%;
  3752. box-sizing: border-box;
  3753. }
  3754. .tribe-feed-compose .tribe-feed-send {
  3755. align-self: flex-end;
  3756. }
  3757. .comment-submit-btn {
  3758. width: auto;
  3759. max-width: 200px;
  3760. }
  3761. .market-owner-actions-inline {
  3762. display: flex;
  3763. gap: 8px;
  3764. flex-wrap: wrap;
  3765. align-items: center;
  3766. }
  3767. .project-goal-highlight {
  3768. font-size: 1.4em;
  3769. font-weight: 700;
  3770. }
  3771. .project-control-form--progress {
  3772. max-width: 300px;
  3773. }
  3774. .project-progress-input {
  3775. max-width: 80px;
  3776. }
  3777. .applicants-under {
  3778. color: #4caf50;
  3779. }
  3780. .applicants-at {
  3781. color: #ffeb3b;
  3782. }
  3783. .applicants-over {
  3784. color: #f44336;
  3785. }
  3786. .transfer-amount-highlight {
  3787. font-size: 1.3em;
  3788. font-weight: 700;
  3789. }
  3790. .pixelia-paint-form {
  3791. display: flex;
  3792. flex-wrap: wrap;
  3793. gap: 12px;
  3794. align-items: center;
  3795. }
  3796. .pixelia-paint-form label,
  3797. .pixelia-paint-form input,
  3798. .pixelia-paint-form select,
  3799. .pixelia-paint-form button {
  3800. width: auto;
  3801. margin: 0;
  3802. }
  3803. .pixelia-paint-form input[type="number"] {
  3804. max-width: 80px;
  3805. }
  3806. .method-image-centered {
  3807. text-align: center;
  3808. margin: 12px 0;
  3809. }
  3810. .method-image-centered img {
  3811. height: auto;
  3812. margin: 0 auto;
  3813. }
  3814. .tag-cloud-wrap {
  3815. display: flex;
  3816. flex-wrap: wrap;
  3817. max-width: 90%;
  3818. gap: 14px;
  3819. justify-content: center;
  3820. align-items: center;
  3821. min-height: 220px;
  3822. padding: 36px;
  3823. border-radius: 16px;
  3824. }
  3825. .tag-cloud-item {
  3826. position: relative;
  3827. padding: 6px 14px;
  3828. border-radius: 999px;
  3829. font-weight: 500;
  3830. font-size: 0.95rem;
  3831. letter-spacing: 0.3px;
  3832. text-decoration: none;
  3833. transition: all 0.25s ease;
  3834. }
  3835. .tag-cloud-item:hover {
  3836. background: rgba(255,255,255,0.1);
  3837. border-color: rgba(255,255,255,0.2);
  3838. transform: translateY(-3px);
  3839. color: #ffffff;
  3840. box-shadow: 0 6px 18px rgba(0,0,0,0.5);
  3841. }
  3842. .tag-cloud-item[data-weight="1"] {
  3843. font-size: 0.85rem;
  3844. opacity: 0.7;
  3845. }
  3846. .tag-cloud-item[data-weight="2"] {
  3847. font-size: 0.95rem;
  3848. opacity: 0.8;
  3849. }
  3850. .tag-cloud-item[data-weight="3"] {
  3851. font-size: 1.05rem;
  3852. opacity: 0.9;
  3853. }
  3854. .tag-cloud-item[data-weight="4"] {
  3855. font-size: 1.15rem;
  3856. font-weight: 600;
  3857. }
  3858. .stats-karma-block {
  3859. background-color: #222;
  3860. padding: 24px;
  3861. border-radius: 8px;
  3862. border: 1px solid #444;
  3863. margin-bottom: 24px;
  3864. }
  3865. .feed-detail-card {
  3866. background-color: #222;
  3867. border: 1px solid #444;
  3868. border-radius: 8px;
  3869. padding: 16px;
  3870. margin-bottom: 16px;
  3871. }
  3872. .map-card {
  3873. background-color: #222;
  3874. border: 1px solid #444;
  3875. border-radius: 8px;
  3876. padding: 16px;
  3877. margin-bottom: 16px;
  3878. }
  3879. .map-card-info {
  3880. display: flex;
  3881. gap: 12px;
  3882. align-items: center;
  3883. flex-wrap: wrap;
  3884. margin-bottom: 8px;
  3885. border: 0px;
  3886. }
  3887. .map-type-badge {
  3888. display: inline-block;
  3889. padding: 2px 8px;
  3890. border-radius: 4px;
  3891. font-size: 0.75rem;
  3892. font-weight: 700;
  3893. letter-spacing: 0.5px;
  3894. background-color: #FFA500;
  3895. color: #000;
  3896. }
  3897. .map-coords {
  3898. font-family: monospace;
  3899. font-size: 0.85rem;
  3900. color: white;
  3901. }
  3902. .map-coords-detail {
  3903. font-family: monospace;
  3904. font-size: 0.9rem;
  3905. color: white;
  3906. }
  3907. .map-marker-count {
  3908. font-size: 0.8rem;
  3909. color: #888;
  3910. }
  3911. .map-description {
  3912. margin: 20px 0;
  3913. }
  3914. .map-url-container {
  3915. margin: 8px 0;
  3916. }
  3917. .map-url-link {
  3918. color: #FFA500;
  3919. word-break: break-all;
  3920. }
  3921. .map-detail-info {
  3922. display: flex;
  3923. gap: 16px;
  3924. align-items: center;
  3925. flex-wrap: wrap;
  3926. margin-bottom: 12px;
  3927. }
  3928. .map-wrap {
  3929. margin-right: 30px;
  3930. position: relative;
  3931. border: 0px;
  3932. }
  3933. .map-img {
  3934. display: block;
  3935. width: 100% !important;
  3936. height: 100% !important;
  3937. max-width: none !important;
  3938. border: none !important;
  3939. }
  3940. .map-bar {
  3941. display: flex;
  3942. align-items: center;
  3943. justify-content: space-between;
  3944. padding: 4px 12px;
  3945. background-color: #1a1a1a;
  3946. border-top: 1px solid #333;
  3947. }
  3948. .map-bar-info {
  3949. font-size: 0.75rem;
  3950. color: #aaa;
  3951. }
  3952. .map-attr {
  3953. font-size: 0.6rem;
  3954. color: #555;
  3955. }
  3956. .map-coord-preview {
  3957. display: flex;
  3958. align-items: center;
  3959. gap: 8px;
  3960. padding: 8px 12px;
  3961. background-color: #222;
  3962. border-radius: 6px;
  3963. margin: 8px 0;
  3964. font-family: monospace;
  3965. font-size: 0.9rem;
  3966. color: #FFA500;
  3967. }
  3968. .map-coord-inline {
  3969. display: inline-flex;
  3970. align-items: center;
  3971. gap: 6px;
  3972. font-family: monospace;
  3973. font-size: 0.9rem;
  3974. color: #FFA500;
  3975. margin: 4px 0;
  3976. }
  3977. .map-coord-pin {
  3978. font-size: 1.2rem;
  3979. }
  3980. .map-create-layout {
  3981. width: 100%;
  3982. }
  3983. .map-form {
  3984. margin-top: 12px;
  3985. }
  3986. .map-form label {
  3987. display: block;
  3988. font-weight: 600;
  3989. color: #FFA500;
  3990. margin-top: 8px;
  3991. margin-bottom: 4px;
  3992. }
  3993. .map-form input[type="text"],
  3994. .map-form textarea,
  3995. .map-form select {
  3996. width: 100%;
  3997. box-sizing: border-box;
  3998. }
  3999. .map-form-row {
  4000. display: flex;
  4001. border: 0px;
  4002. gap: 12px;
  4003. }
  4004. .map-form-field {
  4005. flex: 1;
  4006. }
  4007. .map-card {
  4008. background-color: #222;
  4009. border: 1px solid #444;
  4010. border-radius: 8px;
  4011. padding: 12px 16px;
  4012. margin-bottom: 12px;
  4013. display: flex;
  4014. gap: 16px;
  4015. align-items: flex-start;
  4016. }
  4017. .map-card-thumb-link {
  4018. flex-shrink: 0;
  4019. }
  4020. .map-card-thumb {
  4021. width: 120px !important;
  4022. height: 120px !important;
  4023. max-width: none !important;
  4024. border-radius: 6px !important;
  4025. border: 1px solid #555 !important;
  4026. object-fit: cover;
  4027. }
  4028. .map-card-body {
  4029. flex: 1;
  4030. min-width: 0;
  4031. }
  4032. .map-card-header {
  4033. display: flex;
  4034. justify-content: space-between;
  4035. align-items: flex-start;
  4036. gap: 8px;
  4037. flex-wrap: wrap;
  4038. margin-bottom: 8px;
  4039. }
  4040. .map-card-actions {
  4041. display: flex;
  4042. gap: 6px;
  4043. flex-wrap: wrap;
  4044. align-items: center;
  4045. }
  4046. .map-click-hint {
  4047. color: #FFA500;
  4048. font-size: 0.85rem;
  4049. padding: 6px 0;
  4050. }
  4051. .map-detail {
  4052. background-color: #222;
  4053. border: 1px solid #444;
  4054. border-radius: 8px;
  4055. padding: 16px;
  4056. }
  4057. .map-detail-header {
  4058. display: flex;
  4059. justify-content: space-between;
  4060. align-items: center;
  4061. gap: 12px;
  4062. flex-wrap: wrap;
  4063. margin-bottom: 12px;
  4064. }
  4065. .map-detail-actions {
  4066. display: flex;
  4067. gap: 6px;
  4068. flex-wrap: wrap;
  4069. align-items: center;
  4070. }
  4071. .map-marker-form {
  4072. margin-top: 20px;
  4073. padding-top: 16px;
  4074. border-top: 1px solid #444;
  4075. }
  4076. .map-markers-list {
  4077. margin-top: 16px;
  4078. }
  4079. .map-marker-item {
  4080. display: flex;
  4081. align-items: flex-start;
  4082. gap: 10px;
  4083. padding: 10px 0;
  4084. border-bottom: 1px solid #333;
  4085. }
  4086. .map-marker-dot {
  4087. font-size: 1.2rem;
  4088. line-height: 1;
  4089. }
  4090. .map-marker-info {
  4091. display: flex;
  4092. flex-direction: column;
  4093. gap: 2px;
  4094. border: 0px;
  4095. }
  4096. .map-marker-label {
  4097. font-weight: 600;
  4098. color: #ffa300;
  4099. }
  4100. .map-marker-coords {
  4101. font-family: monospace;
  4102. font-size: 0.8rem;
  4103. color: white;
  4104. }
  4105. .map-marker-meta {
  4106. font-size: 0.75rem;
  4107. }
  4108. .map-empty {
  4109. padding: 24px;
  4110. text-align: center;
  4111. color: #666;
  4112. font-size: 0.9rem;
  4113. }
  4114. .map-form {
  4115. width: 100%;
  4116. }
  4117. .map-form label {
  4118. font-weight: 600;
  4119. color: #FFA500;
  4120. }
  4121. .map-form input[type="text"],
  4122. .map-form textarea,
  4123. .map-form select {
  4124. width: 100%;
  4125. max-width: 100%;
  4126. box-sizing: border-box;
  4127. }
  4128. .map-marker-form {
  4129. margin-top: 24px;
  4130. padding-top: 16px;
  4131. border-top: 1px solid #444;
  4132. }
  4133. .map-marker-form label {
  4134. font-weight: 600;
  4135. color: #FFA500;
  4136. }
  4137. .map-marker-form input[type="text"] {
  4138. width: 100%;
  4139. max-width: 100%;
  4140. box-sizing: border-box;
  4141. }
  4142. .map-form-map-slot {
  4143. margin: 12px 0;
  4144. border: none;
  4145. overflow: hidden;
  4146. }
  4147. .map-markers-list {
  4148. margin-top: 16px;
  4149. text-align: left;
  4150. }
  4151. .map-marker-item {
  4152. padding: 8px 0;
  4153. border-bottom: 1px solid #333;
  4154. display: flex;
  4155. align-items: center;
  4156. gap: 8px;
  4157. flex-wrap: wrap;
  4158. }
  4159. .map-marker-dot {
  4160. color: #4a9eff;
  4161. font-size: 0.9rem;
  4162. }
  4163. .search-result-image {
  4164. max-width: 100%;
  4165. max-height: 300px;
  4166. border-radius: 4px;
  4167. display: block;
  4168. margin: 6px 0;
  4169. }
  4170. .map-embed-section {
  4171. display: flex;
  4172. flex-direction: column;
  4173. gap: 6px;
  4174. margin: 8px 0;
  4175. }
  4176. .map-location-inline {
  4177. display: inline-flex;
  4178. align-items: center;
  4179. gap: 4px;
  4180. }
  4181. .map-location-icon {
  4182. color: #FFA500;
  4183. }
  4184. .map-location-link {
  4185. color: #FFA500;
  4186. font-size: 0.85rem;
  4187. }
  4188. .map-location-embed {
  4189. margin: 16px 0;
  4190. }
  4191. .maps-list {
  4192. display: flex;
  4193. flex-direction: column;
  4194. gap: 16px;
  4195. }
  4196. .maps-search {
  4197. margin-bottom: 16px;
  4198. }
  4199. .inhabitant-karma-ubi {
  4200. margin-top: 8px;
  4201. display: flex;
  4202. flex-direction: column;
  4203. gap: 2px;
  4204. }
  4205. .inhabitant-karma-ubi .karma-line,
  4206. .inhabitant-karma-ubi .ubi-line {
  4207. display: block;
  4208. font-size: 0.9em;
  4209. }
  4210. .shop-featured-item,
  4211. .shop-featured-item:hover,
  4212. .shop-featured-item:visited,
  4213. .shop-featured-item:active {
  4214. text-decoration: none;
  4215. }
  4216. .shop-detail {
  4217. border: 1px solid #333;
  4218. border-radius: 8px;
  4219. padding: 16px;
  4220. }
  4221. .map-form-map-slot {
  4222. margin: 12px 0 0 0;
  4223. border: none;
  4224. outline: none;
  4225. box-shadow: none;
  4226. overflow: hidden;
  4227. }
  4228. .map-marker-item {
  4229. border: none;
  4230. padding: 4px 0;
  4231. display: flex;
  4232. align-items: center;
  4233. gap: 8px;
  4234. flex-wrap: nowrap;
  4235. text-align: left;
  4236. }
  4237. .map-marker-info {
  4238. display: flex;
  4239. flex-direction: row;
  4240. align-items: center;
  4241. gap: 8px;
  4242. flex-wrap: nowrap;
  4243. padding: 4px 0;
  4244. width: 100%;
  4245. overflow: hidden;
  4246. text-align: left;
  4247. justify-content: flex-start;
  4248. }
  4249. .map-markers-list h3 {
  4250. margin-bottom: 4px;
  4251. }
  4252. .map-form-full {
  4253. width: 100%;
  4254. }
  4255. .map-form-full form {
  4256. width: 100%;
  4257. }
  4258. .map-osm-embed {
  4259. width: 100%;
  4260. height: 450px;
  4261. border: 1px solid #444;
  4262. border-radius: 8px;
  4263. margin: 12px 0;
  4264. }
  4265. .map-viewer {
  4266. width: 100%;
  4267. overflow-x: auto;
  4268. overflow-y: hidden;
  4269. border: 0px;
  4270. }
  4271. .map-form-full, .map-form-full form {
  4272. box-sizing: border-box;
  4273. overflow: hidden;
  4274. }
  4275. .map-popup {
  4276. display: none;
  4277. position: fixed;
  4278. top: 0; left: 0; right: 0; bottom: 0;
  4279. background: rgba(0,0,0,0.65);
  4280. z-index: 1000;
  4281. align-items: center;
  4282. justify-content: center;
  4283. }
  4284. .map-popup:target {
  4285. display: flex;
  4286. }
  4287. .map-popup-box {
  4288. background: #222;
  4289. border: 1px solid #555;
  4290. border-radius: 10px;
  4291. padding: 20px 24px;
  4292. max-width: 360px;
  4293. width: 90%;
  4294. color: #ddd;
  4295. position: relative;
  4296. }
  4297. .map-popup-close {
  4298. position: absolute;
  4299. top: 10px; right: 14px;
  4300. color: #FFA500;
  4301. text-decoration: none;
  4302. font-size: 1.2rem;
  4303. line-height: 1;
  4304. }
  4305. .map-popup-label {
  4306. font-weight: 600;
  4307. font-size: 1rem;
  4308. color: #eee;
  4309. margin-bottom: 6px;
  4310. }
  4311. .map-popup-coords {
  4312. font-family: monospace;
  4313. font-size: 0.85rem;
  4314. color: white;
  4315. }
  4316. .map-popup-link {
  4317. color: #FFA500;
  4318. text-decoration: underline;
  4319. word-break: break-all;
  4320. }
  4321. .map-popup-img {
  4322. display: block;
  4323. max-width: 180px;
  4324. max-height: 120px;
  4325. object-fit: cover;
  4326. border-radius: 4px;
  4327. margin: 6px auto;
  4328. }
  4329. .map-marker-img {
  4330. display: block;
  4331. max-width: 120px;
  4332. max-height: 80px;
  4333. object-fit: cover;
  4334. border-radius: 4px;
  4335. margin: 4px 0;
  4336. }
  4337. .map-zoom-info {
  4338. display: block;
  4339. font-size: 0.8rem;
  4340. color: #888;
  4341. margin-bottom: 4px;
  4342. }
  4343. .map-embed-url {
  4344. margin-top: 6px;
  4345. }
  4346. .map-embed-url .map-location-link {
  4347. font-size: 0.8rem;
  4348. }
  4349. .map-zone {
  4350. display: block;
  4351. }
  4352. .map-popup-container { height: 0; overflow: hidden; border: 0px; }
  4353. .project-maploc {
  4354. margin: 6px 0;
  4355. }
  4356. .project-maploc .map-location-link {
  4357. font-size: 0.85rem;
  4358. word-break: break-all;
  4359. }
  4360. .shop-product-actions:empty {
  4361. display: none;
  4362. }
  4363. .ubi-available{color:#4CAF50;font-weight:bold}
  4364. .ubi-unavailable{color:#F44336;font-weight:bold}
  4365. .banking-ubi .card-field{margin:4px 0}
  4366. .pad-status-open{font-weight:bold}
  4367. .pad-status-invite{color:#FFA500;font-weight:bold}
  4368. .pad-status-closed{font-weight:bold}
  4369. .pad-deadline{color:#FFA500;font-size:0.9rem}
  4370. .pad-editor-container{margin-top:12px}
  4371. .pad-editor-area{display:flex;flex-direction:column;gap:8px;}
  4372. .pad-editor-area textarea{width:100%;min-height:200px;background:#1a1a1a;color:#eee;border:1px solid #444;border-radius:4px;padding:10px;font-family:monospace;font-size:0.95rem;resize:vertical;box-sizing:border-box}
  4373. .pad-members-list{flex:1;min-width:160px;background:#1a1a1a;border:1px solid #333;border-radius:4px;padding:10px}
  4374. .pad-members-list h4{margin:0 0 8px 0;color:#aaa;font-size:0.85rem;text-transform:uppercase}
  4375. .pad-member-item{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:0.85rem}
  4376. .pad-color-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0}
  4377. .pad-entries{margin-top:16px;display:flex;flex-direction:column;gap:8px}
  4378. .pad-entry{padding:8px 12px;border-left:4px solid #444;background:#1a1a1a;border-radius:0 4px 4px 0}
  4379. .pad-entry-header{font-size:0.8rem;color:#888;margin-bottom:4px}
  4380. .pad-entry-text{white-space:pre-wrap;word-break:break-word;font-family:monospace;font-size:0.9rem}
  4381. .pad-invite-section{margin-top:12px;padding:12px;background:#1a1a1a;border:1px solid #333;border-radius:4px}
  4382. .pad-invite-section input[type="text"]{width:100%;background:#111;color:#eee;border:1px solid #555;border-radius:4px;padding:8px;box-sizing:border-box;margin-bottom:8px}
  4383. .chat-main-split{display:flex;gap:16px;width:100%}
  4384. .chat-messages-column{flex:2;min-width:0;display:flex;flex-direction:column;gap:8px}
  4385. .chat-participants-column{flex:1;min-width:140px;background:#1a1a1a;border:1px solid #333;border-radius:4px;padding:12px}
  4386. .chat-participants-column h2{margin:0 0 8px 0;color:#aaa;font-size:0.85rem;text-transform:uppercase;font-weight:normal}
  4387. .chat-participants-list{list-style:none;padding:0;margin:0}
  4388. .chat-participants-list li{padding:4px 0;font-size:0.85rem}
  4389. .chat-message-form{background:#1a1a1a;border:1px solid #333;border-radius:4px;padding:10px}
  4390. .chat-message-form textarea{width:100%;box-sizing:border-box;background:#111;color:#eee;border:1px solid #555;border-radius:4px;padding:8px;resize:vertical;font-family:inherit}
  4391. .chat-messages-list{display:flex;flex-direction:column;gap:4px}
  4392. .chat-message{padding:6px 10px;border-radius:4px;background:#1a1a1a;word-break:break-word;border:none}
  4393. .chat-message-author{border-left-color:#FFA500;background:#1f1800}
  4394. .chat-message-self{border-left-color:#888;background:#181818}
  4395. .chat-message-meta{font-size:0.8rem;color:#888;border:none}
  4396. .chat-message-date{color:#666}
  4397. .chat-message-sender a{color:#aaa}
  4398. .chat-message-text{display:block;margin-top:2px;font-size:0.9rem;white-space:pre-wrap;word-break:break-word}
  4399. .calendar-note-card{position:relative;padding:10px 80px 10px 10px;min-height:56px}
  4400. .calendar-note-delete{position:absolute;top:8px;right:8px;margin:0}
  4401. .calendar-note-delete button{padding:4px 10px;font-size:0.8rem}
  4402. .chat-no-messages{color:#666;font-style:italic;padding:12px 0}
  4403. .chat-join-section{margin-top:12px;padding:12px;background:#1a1a1a;border:1px solid #333;border-radius:4px}
  4404. .chat-invite-form input[type="text"]{width:100%;background:#111;color:#eee;border:1px solid #555;border-radius:4px;padding:8px;box-sizing:border-box;margin-bottom:8px}
  4405. .games-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:16px}
  4406. .game-card{border:1px solid #333;border-radius:8px;overflow:hidden;display:flex;flex-direction:column;background:#111}
  4407. .game-card-media{width:100%;max-height:180px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#000}
  4408. .game-card-media img{width:100%;max-height:180px;object-fit:cover}
  4409. .game-card-body{padding:14px;display:flex;flex-direction:column;gap:8px;flex:1}
  4410. .game-card-title{margin:0;font-size:1.1rem;color:#FFA500}
  4411. .game-card-desc{margin:0;font-size:0.9rem;color:#ccc;flex:1}
  4412. .game-card-actions{display:flex;justify-content:center;margin-top:8px}
  4413. .hall-of-fame-table{width:100%;border-collapse:collapse;font-size:0.9rem}
  4414. .hall-of-fame-table th{color:#FFA500;text-align:left;padding:4px 8px;border-bottom:1px solid #444}
  4415. .hall-of-fame-table td{padding:4px 8px;color:#ccc;border-bottom:1px solid #222}
  4416. .hall-of-fame-table tr:hover td{background:#1a1a1a}
  4417. .activity-filter-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-bottom:24px}
  4418. .activity-filter-col{display:flex;flex-direction:column;gap:8px}
  4419. .visit-btn-centered{display:flex;margin-top:10px;border:0px}
  4420. .pad-editor-white{width:100%;box-sizing:border-box;background:#fff;color:#111;border-radius:4px;padding:10px;resize:vertical;font-family:inherit;font-size:0.95rem}
  4421. .pad-readonly-text{background:#fff;color:#111;border:1px solid #aaa;border-radius:4px;padding:10px;white-space:pre-wrap;word-break:break-word;font-size:0.95rem}
  4422. .pad-version-list{margin-top:12px}
  4423. .pad-version-item{display:flex;flex-direction:column;gap:4px;padding:8px;border-bottom:1px solid #333;font-size:0.85rem}
  4424. .pad-version-date{color:#888}
  4425. .pad-version-author a{color:#FFA500}
  4426. .pad-version-link{color:#aaa;text-decoration:underline;cursor:pointer}
  4427. .pad-author-color-0{background-color:#e74c3c}
  4428. .pad-author-color-1{background-color:#3498db}
  4429. .pad-author-color-2{background-color:#2ecc71}
  4430. .pad-author-color-3{background-color:#f39c12}
  4431. .pad-author-color-4{background-color:#9b59b6}
  4432. .pad-author-color-5{background-color:#1abc9c}
  4433. .pad-author-color-6{background-color:#e67e22}
  4434. .pad-author-color-7{background-color:#e91e63}
  4435. .pad-author-color-8{background-color:#00bcd4}
  4436. .pad-author-color-9{background-color:#8bc34a}
  4437. .pad-author-color-none{background-color:#888}
  4438. .pad-entry-author{display:block;font-size:.75rem;margin-bottom:4px;opacity:.75}
  4439. .pad-author-swatch{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:6px;vertical-align:middle;border:1px solid #000}
  4440. .pad-readonly-colored{background:#fff;color:#111;padding:12px;border-radius:4px;min-height:120px;white-space:pre-wrap;word-break:break-word;font-family:inherit;font-size:.95rem;border:1px solid #aaa;margin-bottom:10px}
  4441. .pad-author-span{padding:1px 2px;border-radius:2px}
  4442. .pad-members-section{margin-top:12px;border:none}
  4443. .pad-members-below-tags{margin-top:12px;border:none}
  4444. .pad-member-card{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:0.85rem}
  4445. .pad-members-grid{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
  4446. .pad-version-section{margin-top:16px;border-top:1px solid #333;padding-top:12px}
  4447. .chat-full-width{flex:1;min-width:0}
  4448. .chat-participants-section{margin-top:12px;padding:12px;background:#1a1a1a;border:none;border-radius:4px}
  4449. .chat-participants-below{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
  4450. .chat-participants-below a{font-size:0.85rem;color:#aaa}
  4451. .chat-message-image-wrap{margin:4px 0}
  4452. .chat-message-image{max-width:100%;max-height:300px;border-radius:4px}
  4453. .games-single-col{display:flex;flex-direction:column;gap:16px;margin-top:16px}
  4454. .game-row{display:flex;gap:16px;border:1px solid #333;border-radius:8px;overflow:hidden;background:#111;padding:12px;align-items:flex-start}
  4455. .game-row-media{flex-shrink:0;width:120px}
  4456. .game-row-media img{width:100%;border-radius:4px}
  4457. .game-row-body{flex:1;display:flex;flex-direction:column;gap:6px}
  4458. .game-top-score{font-size:0.85rem;color:#aaa}
  4459. .score-first{color:#2ecc71;font-weight:bold}
  4460. .games-scoring-list{display:flex;flex-direction:column;gap:24px;margin-top:16px}
  4461. .game-scoring-section{border:1px solid #333;border-radius:8px;padding:16px;background:#111}
  4462. .game-scoring-header{display:flex;gap:16px;align-items:flex-start;margin-bottom:12px}
  4463. .game-scoring-thumb{width:80px;border-radius:4px;flex-shrink:0}
  4464. .game-scoring-info{flex:1}
  4465. .game-shell-section{padding:0!important;margin:0}
  4466. .game-iframe{width:100%;height:82vh;border:none;background:#000;display:block}
  4467. .game-iframe-ecoinflow{height:95vh}
  4468. .game-iframe-neoninfiltrator{height:95vh}
  4469. .game-iframe-audiopendulum{height:95vh}
  4470. .game-iframe-flipflop{height:720px}
  4471. .game-iframe-rockpaperscissors{height:580px}
  4472. .game-iframe-tiktaktoe{height:580px}
  4473. .game-desc-yellow{color:yellow}
  4474. .game-new-record-label{color:#FFA500;font-weight:bold}
  4475. .game-row-actions{display:flex;align-items:center;text-align:center;flex-shrink:0;border:0px;}
  4476. .calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:12px 0}
  4477. .calendar-day-header{font-weight:bold;padding:8px;text-align:center;color:#FFA500}
  4478. .calendar-day{padding:10px 4px;text-align:center;background:#222;border-radius:4px;min-height:36px}
  4479. .calendar-day-empty{background:#111;opacity:.4}
  4480. .calendar-day-marked{background:#FFA500;color:#000;font-weight:bold}
  4481. .calendar-day-marked a{color:#000;text-decoration:none;display:block}
  4482. .calendar-nav{display:flex;justify-content:space-between;align-items:center;margin:8px 0}
  4483. .calendar-date-list{margin-top:16px}
  4484. .calendar-date-item{background:#333;padding:18px 108px 18px 18px;border-radius:6px;margin-bottom:14px;position:relative;min-height:64px}
  4485. .calendar-date-delete{position:absolute;top:12px;right:12px;margin:0}
  4486. .calendar-date-delete button{padding:4px 10px;font-size:0.8rem}
  4487. .calendar-date-item-header{color:#FFA500;font-weight:bold;margin-bottom:6px;width:max-content}
  4488. .calendar-participants-count{color:#FFA500;font-weight:bold}
  4489. .calendar-day-notes{margin-top:16px}
  4490. .pad-viewer-back{margin-bottom:12px}
  4491. .access-denied-msg{margin:12px 0;padding:12px;background:#1a1a1a;border:1px solid #555;border-radius:4px;color:#ccc;font-style:italic}
  4492. .torrent-table{width:100%;border-collapse:collapse;margin-top:12px}
  4493. .torrent-table th,.torrent-table td{padding:8px 12px;text-align:left}
  4494. .torrent-table th{background:#1a1a1a;color:#FFA500;font-weight:bold}
  4495. .torrent-download{margin:12px 0}
  4496. .torrent-download .filter-btn{border:none}
  4497. .logs-table{width:100%;border-collapse:collapse;margin-top:12px}
  4498. .logs-table th,.logs-table td{padding:8px 12px;text-align:left;vertical-align:middle;border-bottom:1px solid #222}
  4499. .logs-col-actions{vertical-align:middle;text-align:center;white-space:nowrap;background:transparent}
  4500. .logs-col-actions form{margin:0;display:inline-block}
  4501. .logs-col-actions .filter-btn{min-width:110px}
  4502. .logs-table th{background:#1a1a1a;color:#FFA500;font-weight:bold}
  4503. .logs-col-date{white-space:nowrap;text-align:center;font-family:monospace;background:transparent}
  4504. .logs-date-day{color:#FFA500;font-weight:bold;font-size:0.9rem}
  4505. .logs-date-time{color:#ddd;font-size:0.85rem}
  4506. .logs-col-log{max-width:560px;vertical-align:middle;background:transparent;padding:8px 12px}
  4507. .logs-col-log>*{background:transparent;border:0;padding:0;margin:0}
  4508. .logs-entry-label{color:#FFA500;font-weight:bold;margin-bottom:4px !important;background:transparent;border:0}
  4509. .logs-entry-meta{color:#888;font-size:0.85rem;margin-bottom:6px}
  4510. .logs-entry-mode{color:#FFA500;font-weight:bold}
  4511. .logs-entry-text{white-space:pre-wrap;word-break:break-word;color:#ddd;background:transparent;border:0;padding:0;margin:0;display:block}
  4512. .logs-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0}
  4513. .logs-toolbar-inline{display:inline-flex;gap:10px;margin:0}
  4514. .logs-mode-form{margin:12px 0}
  4515. .logs-mode-group{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
  4516. .logs-ai-disabled{color:#e74c3c;font-style:italic;margin:8px 0}
  4517. .logs-col-type{white-space:nowrap;text-align:center;font-family:monospace;background:transparent}
  4518. .logs-type-text{font-weight:bold;letter-spacing:0.5px;text-transform:uppercase;font-family:monospace;font-size:0.85rem}
  4519. .logs-type-ai{color:#00b4ff}
  4520. .logs-type-manual{color:#FFA500}
  4521. .logs-toolbar-wrap{display:flex;flex-direction:column;gap:12px;margin:12px 0}
  4522. .logs-search{margin:0}
  4523. .logs-detail{padding:16px}
  4524. .logs-detail-header{color:#aaa;font-family:monospace;margin-bottom:12px;word-break:break-all}
  4525. .logs-detail-text{white-space:pre-wrap;word-break:break-word;color:#ddd;margin:12px 0}
  4526. .logs-detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
  4527. .no-border{border:none}
  4528. .tribe-card-padded{padding:12px 16px}
  4529. .tribe-content-list-spaced{display:flex;flex-direction:column;gap:16px}
  4530. .tribe-banner{padding:12px 16px;margin-bottom:16px;text-align:center}
  4531. .bold{font-weight:bold}
  4532. .inline-form{display:inline}
  4533. .bd-type-post{border-color:#3498db}.bd-type-post .block-diagram-ruler{border-bottom-color:#3498db}
  4534. .bd-type-vote,.bd-type-votes,.bd-type-pixelia,.bd-type-parliamentTerm,.bd-type-parliamentProposal,.bd-type-parliamentLaw,.bd-type-parliamentCandidature,.bd-type-parliamentRevocation{border-color:#9b59b6}
  4535. .bd-type-vote .block-diagram-ruler,.bd-type-votes .block-diagram-ruler,.bd-type-pixelia .block-diagram-ruler,.bd-type-parliamentTerm .block-diagram-ruler,.bd-type-parliamentProposal .block-diagram-ruler,.bd-type-parliamentLaw .block-diagram-ruler,.bd-type-parliamentCandidature .block-diagram-ruler,.bd-type-parliamentRevocation .block-diagram-ruler{border-bottom-color:#9b59b6}
  4536. .bd-type-about,.bd-type-forum,.bd-type-curriculum{border-color:#1abc9c}
  4537. .bd-type-about .block-diagram-ruler,.bd-type-forum .block-diagram-ruler,.bd-type-curriculum .block-diagram-ruler{border-bottom-color:#1abc9c}
  4538. .bd-type-contact{border-color:#16a085}.bd-type-contact .block-diagram-ruler{border-bottom-color:#16a085}
  4539. .bd-type-pub,.bd-type-project,.bd-type-pad,.bd-type-map,.bd-type-mapMarker{border-color:#2ecc71}
  4540. .bd-type-pub .block-diagram-ruler,.bd-type-project .block-diagram-ruler,.bd-type-pad .block-diagram-ruler,.bd-type-map .block-diagram-ruler,.bd-type-mapMarker .block-diagram-ruler{border-bottom-color:#2ecc71}
  4541. .bd-type-tribe,.bd-type-market,.bd-type-shop,.bd-type-shopProduct{border-color:#e67e22}
  4542. .bd-type-tribe .block-diagram-ruler,.bd-type-market .block-diagram-ruler,.bd-type-shop .block-diagram-ruler,.bd-type-shopProduct .block-diagram-ruler{border-bottom-color:#e67e22}
  4543. .bd-type-event,.bd-type-transfer,.bd-type-calendar{border-color:#e74c3c}
  4544. .bd-type-event .block-diagram-ruler,.bd-type-transfer .block-diagram-ruler,.bd-type-calendar .block-diagram-ruler{border-bottom-color:#e74c3c}
  4545. .bd-type-task,.bd-type-banking,.bd-type-bankWallet,.bd-type-bankClaim,.bd-type-gameScore{border-color:#f39c12}
  4546. .bd-type-task .block-diagram-ruler,.bd-type-banking .block-diagram-ruler,.bd-type-bankWallet .block-diagram-ruler,.bd-type-bankClaim .block-diagram-ruler,.bd-type-gameScore .block-diagram-ruler{border-bottom-color:#f39c12}
  4547. .bd-type-report,.bd-type-courtsCase,.bd-type-courtsEvidence,.bd-type-courtsAnswer,.bd-type-courtsVerdict,.bd-type-courtsSettlement,.bd-type-courtsNomination{border-color:#c0392b}
  4548. .bd-type-report .block-diagram-ruler,.bd-type-courtsCase .block-diagram-ruler,.bd-type-courtsEvidence .block-diagram-ruler,.bd-type-courtsAnswer .block-diagram-ruler,.bd-type-courtsVerdict .block-diagram-ruler,.bd-type-courtsSettlement .block-diagram-ruler,.bd-type-courtsNomination .block-diagram-ruler{border-bottom-color:#c0392b}
  4549. .bd-type-image,.bd-type-job,.bd-type-aiExchange,.bd-type-chat{border-color:#3498db}
  4550. .bd-type-image .block-diagram-ruler,.bd-type-job .block-diagram-ruler,.bd-type-aiExchange .block-diagram-ruler,.bd-type-chat .block-diagram-ruler{border-bottom-color:#3498db}
  4551. .bd-type-audio{border-color:#8e44ad}.bd-type-audio .block-diagram-ruler{border-bottom-color:#8e44ad}
  4552. .bd-type-video{border-color:#d35400}.bd-type-video .block-diagram-ruler{border-bottom-color:#d35400}
  4553. .bd-type-document{border-color:#27ae60}.bd-type-document .block-diagram-ruler{border-bottom-color:#27ae60}
  4554. .bd-type-bookmark{border-color:#f1c40f}.bd-type-bookmark .block-diagram-ruler{border-bottom-color:#f1c40f}
  4555. .bd-type-feed,.bd-type-tombstone{border-color:#95a5a6}
  4556. .bd-type-feed .block-diagram-ruler,.bd-type-tombstone .block-diagram-ruler{border-bottom-color:#95a5a6}
  4557. .stats-link{color:#ffa500;text-decoration:none}
  4558. .stats-link-break{color:#ffa500;text-decoration:none;word-break:break-all}
  4559. .stats-muted{color:#aaa}
  4560. .stats-strong{color:#ffd700;font-weight:600}
  4561. .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;margin-bottom:24px}
  4562. .stats-mode-row{justify-content:flex-start;margin-bottom:24px}
  4563. .stats-section-h{font-size:18px;color:#ffa500;margin:8px 0;font-weight:600}
  4564. .stats-list-reset{list-style-type:none;padding:0;margin:0}
  4565. .stats-mb-16{margin-bottom:16px}
  4566. .stats-w-100{width:100%}
  4567. .stats-table{width:100%;border-collapse:collapse}
  4568. .stats-table-mt8{width:100%;border-collapse:collapse;margin-top:8px}
  4569. .stats-h-row{font-size:15px;color:#ddd;margin:6px 0;display:flex;gap:8px;align-items:baseline}
  4570. .stats-card{background:none;padding:0;border:none;border-radius:0;margin-bottom:16px;box-shadow:none}
  4571. .stats-card .block-info-table{table-layout:fixed}
  4572. .stats-card .block-info-table .card-label{width:70%}
  4573. .stats-card .block-info-table .card-value{width:30%;text-align:right;word-break:break-word}
  4574. .invites-pubs-table{table-layout:fixed}
  4575. .invites-pubs-table col.invites-col-host,.invites-pubs-table td:nth-child(1){width:22%}
  4576. .invites-pubs-table td:nth-child(2){width:8%}
  4577. .invites-pubs-table td:nth-child(3){width:40%;word-break:break-all}
  4578. .invites-pubs-table td:nth-child(4){width:30%}
  4579. .invites-pubs-table tr:first-child td{white-space:nowrap}
  4580. .stats-block{background:none;padding:0;border:none;border-radius:0;margin-bottom:16px}
  4581. .stats-block h2{margin:0 0 10px;font-size:16px;color:#ffa500;font-weight:600}
  4582. .stats-block ul{margin:6px 0 0;padding-left:18px}
  4583. .stats-block ul li{margin:3px 0;color:#ddd;font-size:14px}
  4584. .stats-block table.stats-table th,.stats-block table.stats-table-mt8 th{background:#272727;color:#FFDD44;text-align:left;padding:6px 8px;font-size:13px}
  4585. .stats-block table.stats-table td,.stats-block table.stats-table-mt8 td{padding:5px 8px;border-bottom:1px solid #2a2a2a;color:#ddd;font-size:13px}
  4586. .stats-block table.stats-table tr:last-child td,.stats-block table.stats-table-mt8 tr:last-child td{border-bottom:none}
  4587. .stats-pill{display:inline-block;padding:2px 8px;border-radius:10px;background:#2a2a2a;border:1px solid #3a3a3a;color:#ffd700;font-size:12px;margin:2px 4px 2px 0}
  4588. .stats-toplist{margin:0;padding:0;list-style:none}
  4589. .stats-toplist li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid #2a2a2a}
  4590. .stats-toplist li:last-child{border-bottom:none}
  4591. .stats-toplist .stats-bar-track{flex:1;background:#2a2a2a;border-radius:4px;height:8px;overflow:hidden}
  4592. .stats-toplist .stats-bar-fill{background:#ffa500;height:100%}
  4593. .stats-toplist .stats-toplist-name{flex:0 0 auto;color:#FFDD44;font-size:13px;min-width:120px}
  4594. .stats-toplist .stats-toplist-num{flex:0 0 auto;color:#FFDD44;font-size:13px;min-width:36px;text-align:right}
  4595. .peer-key{word-break:break-all;font-size:12px}
  4596. .peers-technical-block{margin-top:16px}
  4597. .peers-conn-actions{margin-bottom:12px}
  4598. .invites-pubs-actions{margin:12px 0}
  4599. .suggested-meta{margin-top:8px;display:flex;flex-direction:column;gap:4px}
  4600. .inbox-exposition{margin:12px 0 4px 0}
  4601. .inbox-filters-label{color:#FFDD44;font-size:13px;font-weight:600;margin-right:8px;align-self:center}
  4602. .suggested-badge{display:inline-block;background:#FFA500;color:#000;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600;width:fit-content}
  4603. .peers-import-form{margin-top:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
  4604. .peers-import-form textarea{width:100%;max-width:720px;font-family:monospace;font-size:12px}
  4605. .peers-import-label{color:#FFDD44;font-size:13px;font-weight:600}
  4606. .graphos-canvas{width:100%;max-width:1100px;margin:12px auto;padding:8px;background:transparent}
  4607. .graphos-svg{width:100%;height:auto;min-height:480px;display:block}
  4608. .graphos-edge{stroke:#666;stroke-width:1;opacity:.55}
  4609. .graphos-edge-online{stroke:#2ecc71;stroke-width:2;opacity:.9}
  4610. .graphos-edge-discovered{stroke:#ffd700;stroke-width:1.5;opacity:.75}
  4611. .graphos-edge-unknown{stroke:#888;stroke-width:1;stroke-dasharray:4 4;opacity:.55}
  4612. .graphos-node-circle{stroke:#1a1a1a;stroke-width:2;transition:stroke-width .15s,filter .15s}
  4613. .graphos-node-circle-me{fill:#ffa500;stroke:#cc7700;stroke-width:3}
  4614. .graphos-node-circle-online{fill:#2ecc71;stroke:#1e8449}
  4615. .graphos-node-circle-discovered{fill:#ffd700;stroke:#b8860b}
  4616. .graphos-node-circle-unknown{fill:#888;stroke:#555}
  4617. .graphos-node-link{cursor:pointer;outline:none}
  4618. .graphos-node-link:hover .graphos-node-circle{stroke-width:4;filter:brightness(1.15)}
  4619. .graphos-node-link:hover .graphos-node-label{font-weight:600}
  4620. .graphos-node-label{font-size:12px;fill:#ddd;text-anchor:middle;pointer-events:none}
  4621. .graphos-node-label-me{font-weight:600;fill:#ffa500}
  4622. .graphos-legend{display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:13px;color:#ddd;margin:0 0 8px}
  4623. .graphos-legend-item{display:flex;align-items:center;gap:6px}
  4624. .graphos-legend-dot{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px solid #1a1a1a}
  4625. .graphos-legend-dot.graphos-node-circle-me{background:#ffa500;border-color:#cc7700}
  4626. .graphos-legend-dot.graphos-node-circle-online{background:#2ecc71;border-color:#1e8449}
  4627. .graphos-legend-dot.graphos-node-circle-discovered{background:#ffd700;border-color:#b8860b}
  4628. .graphos-legend-dot.graphos-node-circle-unknown{background:#888;border-color:#555}
  4629. .stats-kpi{padding:8px 4px;display:flex;flex-direction:column;gap:4px;background:transparent;border:none}
  4630. .stats-kpi-label{color:#ffa500;font-size:12px;font-weight:600;letter-spacing:.3px}
  4631. .stats-kpi-value{color:#ffd700;font-weight:600;font-size:22px;line-height:1.1;word-break:break-word}
  4632. .stats-kpi-bar{margin-top:6px}
  4633. .stats-activity-totals{display:flex;gap:24px;flex-wrap:wrap;color:#ffa500;font-size:13px;margin-top:8px}
  4634. .stats-activity-totals strong{color:#ffd700}
  4635. .stats-w-0{width:0%}.stats-w-5{width:5%}.stats-w-10{width:10%}.stats-w-15{width:15%}.stats-w-20{width:20%}.stats-w-25{width:25%}.stats-w-30{width:30%}.stats-w-35{width:35%}.stats-w-40{width:40%}.stats-w-45{width:45%}.stats-w-50{width:50%}.stats-w-55{width:55%}.stats-w-60{width:60%}.stats-w-65{width:65%}.stats-w-70{width:70%}.stats-w-75{width:75%}.stats-w-80{width:80%}.stats-w-85{width:85%}.stats-w-90{width:90%}.stats-w-95{width:95%}.stats-w-100{width:100%}
  4636. .profile-qr{display:flex;justify-content:center;align-items:center;margin:16px 0}
  4637. .profile-qr-img{display:block;max-width:240px;height:auto}
  4638. .inhabitant-qr-link{display:inline-block;margin:6px 0 8px;line-height:0}
  4639. .inhabitant-qr-small{display:block;width:96px;height:96px;background:#fff;padding:4px;border-radius:4px;image-rendering:pixelated}
  4640. .job-candidates{margin-top:24px;padding-top:16px;border-top:1px solid #333}
  4641. .job-candidates>h2{color:#ffa500;margin-bottom:4px}
  4642. .job-exchange-hint{color:#ffa500;font-style:italic;margin:4px 0 12px;font-size:13px}
  4643. .profile-visibility-table{margin:8px 0;border-collapse:collapse;width:auto;max-width:320px}
  4644. .profile-visibility-table td{padding:6px 8px;text-align:left;vertical-align:middle;border:none;background:transparent}
  4645. .profile-visibility-table tr,
  4646. .profile-visibility-table tr:nth-child(even),
  4647. .profile-visibility-table tr:nth-child(odd){background:transparent}
  4648. .profile-visibility-table label{cursor:pointer;background:transparent;color:inherit;font-size:inherit;font-weight:inherit;font-family:inherit}
  4649. .prefs-card{border:1px solid #2a2a2a;padding:14px 16px;margin:12px 0;background:#111}
  4650. .prefs-card .tags-header{margin:0 0 10px 0}
  4651. .prefs-card .tags-header h2{font-size:16px;color:#FFA500;margin:0 0 4px 0}
  4652. .prefs-help{color:#FFD700;font-size:12px;margin:0}
  4653. .pref-pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
  4654. .pref-pill{display:inline-flex;align-items:center;border:1px solid #333;padding:6px 12px;cursor:pointer;background:#161616;color:#888;font-size:13px;user-select:none}
  4655. .pref-pill:hover{border-color:#555;color:#bbb}
  4656. .pref-pill-input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
  4657. .pref-pill-label{display:inline-block}
  4658. .pref-pill:has(.pref-pill-input:checked){background:#FFA500;border-color:#FFA500;color:#000;font-weight:600}
  4659. .pref-pill:has(.pref-pill-input:checked):hover{background:#FFD700;border-color:#FFD700;color:#000}
  4660. .profile-layout{align-items:flex-start}
  4661. .profile-layout .tribe-side,
  4662. .profile-layout .tribe-main{background:transparent}
  4663. .profile-layout-single{display:flex;justify-content:center;padding:24px 0;gap:24px}
  4664. .profile-layout-single .profile-side{width:340px;max-width:100%;flex:0 0 auto}
  4665. .profile-side{align-items:center;text-align:center}
  4666. .profile-side-header{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%}
  4667. .profile-side .inhabitant-photo-details{width:160px;height:160px;object-fit:cover;border:2px solid #ff9800;background:transparent}
  4668. .profile-side-name{font-size:20px;margin:0;color:#FFD700;word-break:break-word}
  4669. .profile-side-mention{font-family:monospace;font-size:12px;color:#FFD700;word-break:break-all;margin:6px 0 8px 0;line-height:1.5}
  4670. .profile-side-mention a{color:#FFD700;text-decoration:none}
  4671. .profile-side-mention strong{color:#FFD700;font-weight:700}
  4672. .profile-side-description{color:#ddd;font-size:13px;line-height:1.5;margin:0 0 10px 0;word-break:break-word;background:transparent;padding:0;border:none}
  4673. .profile-side-description p{margin:0 0 6px 0}
  4674. .profile-side-qr{width:160px;height:160px;background:#fff;padding:6px;display:block;margin:0 auto}
  4675. .profile-side-relationship{margin:8px 0 0 0}
  4676. .profile-side-relationship .status{display:inline-block;margin:0 2px}
  4677. .profile-side-actions,
  4678. .profile-sensors-box{
  4679. display:flex;
  4680. flex-direction:column;
  4681. gap:6px;
  4682. align-items:stretch;
  4683. margin:12px 0;
  4684. background:transparent;
  4685. border:none;
  4686. padding:0;
  4687. width:100%;
  4688. }
  4689. .profile-side-actions .btn{
  4690. background-color:#FFA500;
  4691. color:#000;
  4692. padding:8px 16px;
  4693. text-align:center;
  4694. text-decoration:none;
  4695. border:none;
  4696. cursor:pointer;
  4697. font-family:inherit;
  4698. font-size:inherit;
  4699. display:inline-block;
  4700. }
  4701. .profile-side-actions .btn:hover{background-color:#FFD700;color:#000;text-decoration:none}
  4702. .profile-sensors-box .inhabitant-activity-group,
  4703. .inhabitant-left .inhabitant-activity-group,
  4704. .inhabitant-left .inhabitant-karma-ubi{display:flex;flex-direction:column;gap:6px;margin-top:0;align-items:stretch;border:none;background:transparent;padding:0}
  4705. .inhabitant-left>a:first-child{margin-bottom:14px}
  4706. .profile-sensors-box .inhabitant-last-activity,
  4707. .profile-sensors-box .karma-line,
  4708. .profile-sensors-box .ubi-line,
  4709. .inhabitant-left .inhabitant-last-activity,
  4710. .inhabitant-left .karma-line,
  4711. .inhabitant-left .ubi-line{
  4712. display:flex;
  4713. gap:6px;
  4714. align-items:center;
  4715. justify-content:center;
  4716. padding:0.2rem 0.6rem;
  4717. border:1px solid #555;
  4718. border-radius:4px;
  4719. background-color:#1A1A1A;
  4720. font-size:0.9rem;
  4721. color:#FFDD44;
  4722. margin:0;
  4723. }
  4724. .profile-sensors-box .inhabitant-last-activity strong,
  4725. .profile-sensors-box .karma-line strong,
  4726. .profile-sensors-box .ubi-line strong,
  4727. .inhabitant-left .inhabitant-last-activity strong,
  4728. .inhabitant-left .karma-line strong,
  4729. .inhabitant-left .ubi-line strong{color:#FFDD44}
  4730. .profile-sensors-box .inhabitant-last-activity a,
  4731. .profile-sensors-box .karma-line a,
  4732. .profile-sensors-box .ubi-line a,
  4733. .inhabitant-left .inhabitant-last-activity a,
  4734. .inhabitant-left .karma-line a,
  4735. .inhabitant-left .ubi-line a{color:#FFDD44;text-decoration:none}
  4736. .profile-sensors-box .inhabitant-last-activity a:hover,
  4737. .profile-sensors-box .karma-line a:hover,
  4738. .profile-sensors-box .ubi-line a:hover,
  4739. .inhabitant-left .inhabitant-last-activity a:hover,
  4740. .inhabitant-left .karma-line a:hover,
  4741. .inhabitant-left .ubi-line a:hover{color:#ffa500;text-decoration:underline}
  4742. .profile-main{gap:12px}
  4743. .profile-module-section{display:flex;flex-direction:column;gap:12px;margin:0 0 12px 0}
  4744. .tribe-invite-code-input{width:100%;max-width:680px;padding:10px 12px;font-family:monospace;font-size:14px;letter-spacing:1px;background:#1a1a1a;color:#ffd700;border:1px solid #555;border-radius:4px;margin:12px 0}
  4745. .pad-author-cell,.tribe-author-cell{width:100%}
  4746. .pad-author-cell a.user-link,.tribe-author-cell a.user-link{display:block;width:100%;box-sizing:border-box;text-align:center;padding:8px 12px}
  4747. .search-filters-table{margin:12px 0;border-collapse:collapse;width:auto;max-width:680px}
  4748. .search-filters-table tr,
  4749. .search-filters-table tr:nth-child(even),
  4750. .search-filters-table tr:nth-child(odd){background:transparent}
  4751. .search-filters-table td{padding:6px 10px;border:none;vertical-align:middle;background:transparent}
  4752. .search-filters-table td.card-label{white-space:nowrap;font-weight:600;color:#ffa500}
  4753. .search-filters-table input[type="datetime-local"],
  4754. .search-filters-table input.search-oasis-id{min-width:280px}
  4755. .transfer-category-select{width:auto;min-width:160px;max-width:200px;padding:6px 10px}
  4756. .spread-row{margin:8px 0;display:flex;justify-content:flex-start}
  4757. .spread-form{display:inline-block}
  4758. .spread-btn{cursor:pointer;font:inherit;padding:4px 10px;border:1px solid #555;border-radius:4px;background:#1a1a1a;color:#ffa500;font-size:14px}
  4759. .spread-btn:hover{background:#2a2a2a;border-color:#ffa500}
  4760. .spread-btn-on{background:#ffa500;color:#1a1a1a;border-color:#ff7300}
  4761. .spread-btn-on:hover{background:#ffb733;color:#000}
  4762. .welcome-header{margin-bottom:18px}
  4763. .welcome-chat{max-width:760px;margin:0 auto;padding:8px}
  4764. .welcome-ai-header{display:flex;align-items:center;gap:10px;margin-bottom:10px;color:#ffa500;font-weight:600}
  4765. .welcome-ai-avatar{font-size:24px}
  4766. .welcome-ai-name{font-size:16px}
  4767. .welcome-ai-step{margin-left:auto;font-size:12px;color:#888}
  4768. .welcome-bubble{background:#1a1a1a;border:1px solid #333;border-radius:12px;padding:14px 18px;margin-bottom:14px;line-height:1.5}
  4769. .welcome-bubble-ai{border-left:3px solid #ffa500}
  4770. .welcome-bubble-title{margin:0 0 8px;color:#ffd700;font-size:18px}
  4771. .welcome-bubble p{margin:6px 0;color:#ddd}
  4772. .welcome-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0;justify-content:flex-end}
  4773. .welcome-action-primary{background:#ff6600;color:#fff;border-color:#ff3300}
  4774. .welcome-progress{display:flex;justify-content:center;gap:10px;margin:18px 0 6px}
  4775. .welcome-dot{font-size:14px;color:#444;text-decoration:none}
  4776. .welcome-dot-active{color:#ffa500}
  4777. .welcome-skip{text-align:center;margin-top:6px}
  4778. .welcome-skip-link{color:#666;font-size:12px}
  4779. .indexing-progress-block{max-width:640px;margin:24px auto;text-align:center}
  4780. .indexing-progress{width:100%;height:18px}
  4781. .indexing-percent{margin:8px 0 4px;font-size:22px;color:#ffd700}
  4782. .indexing-note{color:#888;font-size:12px;margin:0}
  4783. .indexing-detail{max-width:720px;margin:24px auto;color:#ddd;line-height:1.55}
  4784. .indexing-detail p{margin:10px 0}
  4785. .indexing-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:24px 0}
  4786. .search-filters-row{display:flex;gap:32px;flex-wrap:wrap;align-items:flex-start}
  4787. .search-filters-row .search-filters-table{flex:1 1 320px}
  4788. .search-submit-cell{padding-top:8px}
  4789. .search-submit-cell button{padding:6px 16px}
  4790. .search-submit-row{margin-top:12px;display:flex;justify-content:flex-start}
  4791. .search-submit-row button{padding:8px 18px}
  4792. .pm-exposition{display:flex;border:0;}
  4793. .pm-exposition-label{color:#ffa500;font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:0.5px}
  4794. .pm-exposition-chip{display:inline-flex;border-radius:14px;font-size:14px;font-weight:600;border:0}
  4795. .pm-exposition-whole{background:#3a2300;color:#ffd700}
  4796. .pm-exposition-mutuals{background:#1a3a1a;color:#7fff7f}
  4797. .pm-exposition-icon{font-size:14px;line-height:1}
  4798. .pm-exposition-text{line-height:1;}
  4799. .shop-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
  4800. .shop-title-row h2{margin:0}
  4801. .profile-reach{display:flex;flex-direction:column;align-items:center;gap:8px;margin:12px 0;text-align:center}
  4802. .profile-reach .shop-clearnet-url{margin:0;text-align:center}
  4803. .profile-reach-toggle{margin:0}
  4804. .profile-reach-toggle .btn{
  4805. background-color:#FFA500;
  4806. color:#000;
  4807. padding:8px 16px;
  4808. border-radius:5px;
  4809. text-align:center;
  4810. text-decoration:none;
  4811. border:none;
  4812. cursor:pointer;
  4813. font-family:inherit;
  4814. font-size:inherit;
  4815. }
  4816. .profile-reach-toggle .btn:hover{background-color:#FFD700}
  4817. /* Unified item card aesthetic — applied to per-module containers that previously had no card styling. Existing rules (.market-card, .feed-card, .tribe-card, etc.) keep their own look via cascade. */
  4818. .card,
  4819. .card-section,
  4820. .event-card,
  4821. .job-card,
  4822. .task-card,
  4823. .transfer-card,
  4824. .project-card,
  4825. .report-card,
  4826. .vote-card,
  4827. .ai-nav-result-card,
  4828. .forum-card,
  4829. .calendar-card,
  4830. .game-card,
  4831. .game-score-card,
  4832. .bookmark-card,
  4833. .audio-card,
  4834. .video-card,
  4835. .image-card,
  4836. .document-card,
  4837. .torrent-card,
  4838. .chat-card,
  4839. .opinions-card,
  4840. .post-card,
  4841. .map-card,
  4842. .mention-card,
  4843. .trending-card,
  4844. .bank-claim-card,
  4845. .addr-list-card,
  4846. .shop-product-card,
  4847. .cv-item,
  4848. .transfer-item,
  4849. .bounty-item,
  4850. .calendar-date-item,
  4851. .evidence-item,
  4852. .settlement-item,
  4853. .thread-reply-item {
  4854. background: #1c1c1c;
  4855. border: 1px solid #444;
  4856. border-radius: 12px;
  4857. padding: 16px 18px;
  4858. margin-bottom: 16px;
  4859. box-shadow: 0 1px 3px rgba(0,0,0,0.35);
  4860. }
  4861. .card-section .card-section,
  4862. .event-card .card-section,
  4863. .job-card .card-section,
  4864. .transfer-card .card-section,
  4865. .project-card .card-section {
  4866. margin-bottom: 8px;
  4867. padding: 10px 12px;
  4868. background: #232323;
  4869. border-color: #3a3a3a;
  4870. }
  4871. .card>.card-footer,
  4872. .card-section>.card-footer,
  4873. .event-card>.card-footer,
  4874. .job-card>.card-footer,
  4875. .task-card>.card-footer,
  4876. .transfer-card>.card-footer,
  4877. .project-card>.card-footer,
  4878. .vote-card>.card-footer {
  4879. margin-top: 14px;
  4880. padding-top: 10px;
  4881. border-top: 1px solid #333;
  4882. font-size: 13px;
  4883. color: #aaa;
  4884. }
  4885. .card-fields-container { display:flex; flex-direction:column; gap:0; }
  4886. /* Table-like layout for label/value pairs inside item cards. Two-column grid: label fixed, value flexible, subtle row separator. */
  4887. .card .card-field,
  4888. .card-section .card-field,
  4889. .card-fields-container .card-field,
  4890. .event-card .card-field,
  4891. .job-card .card-field,
  4892. .task-card .card-field,
  4893. .transfer-card .card-field,
  4894. .project-card .card-field,
  4895. .report-card .card-field,
  4896. .vote-card .card-field,
  4897. .forum-card .card-field,
  4898. .tribe-card .card-field,
  4899. .tribe-content-card .card-field,
  4900. .calendar-card .card-field,
  4901. .game-card .card-field,
  4902. .game-score-card .card-field,
  4903. .bookmark-card .card-field,
  4904. .audio-card .card-field,
  4905. .video-card .card-field,
  4906. .image-card .card-field,
  4907. .document-card .card-field,
  4908. .torrent-card .card-field,
  4909. .chat-card .card-field,
  4910. .opinions-card .card-field,
  4911. .post-card .card-field,
  4912. .map-card .card-field,
  4913. .mention-card .card-field,
  4914. .trending-card .card-field,
  4915. .bank-claim-card .card-field,
  4916. .shop-product-card .card-field,
  4917. .cv-item .card-field,
  4918. .transfer-item .card-field {
  4919. display: grid;
  4920. grid-template-columns: max-content 1fr;
  4921. gap: 10px;
  4922. padding: 4px 0;
  4923. margin: 0;
  4924. border-bottom: 1px solid #2a2a2a;
  4925. align-items: baseline;
  4926. }
  4927. .card .card-field:last-child,
  4928. .card-section .card-field:last-child,
  4929. .card-fields-container .card-field:last-child,
  4930. .event-card .card-field:last-child,
  4931. .job-card .card-field:last-child,
  4932. .task-card .card-field:last-child,
  4933. .transfer-card .card-field:last-child,
  4934. .project-card .card-field:last-child,
  4935. .report-card .card-field:last-child,
  4936. .vote-card .card-field:last-child,
  4937. .forum-card .card-field:last-child,
  4938. .tribe-card .card-field:last-child,
  4939. .calendar-card .card-field:last-child,
  4940. .bookmark-card .card-field:last-child,
  4941. .audio-card .card-field:last-child,
  4942. .video-card .card-field:last-child,
  4943. .image-card .card-field:last-child,
  4944. .document-card .card-field:last-child,
  4945. .torrent-card .card-field:last-child,
  4946. .chat-card .card-field:last-child,
  4947. .cv-item .card-field:last-child,
  4948. .transfer-item .card-field:last-child {
  4949. border-bottom: none;
  4950. }
  4951. .card .card-field-stacked,
  4952. .card-section .card-field-stacked,
  4953. .event-card .card-field-stacked,
  4954. .job-card .card-field-stacked,
  4955. .project-card .card-field-stacked,
  4956. .report-card .card-field-stacked,
  4957. .tribe-card .card-field-stacked {
  4958. grid-template-columns: 1fr;
  4959. gap: 4px;
  4960. }