.leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-container,.leaflet-pane > svg,.leaflet-pane > canvas,.leaflet-zoom-box,.leaflet-image-layer,.leaflet-layer{position: absolute;left: 0;top: 0}.leaflet-container{overflow: hidden}.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow{-webkit-user-select: none;-moz-user-select: none;user-select: none;-webkit-user-drag: none}.leaflet-tile::selection{background: transparent}.leaflet-safari .leaflet-tile{image-rendering: -webkit-optimize-contrast}.leaflet-safari .leaflet-tile-container{width: 1600px;height: 1600px;-webkit-transform-origin: 0 0}.leaflet-marker-icon,.leaflet-marker-shadow{display: block}.leaflet-container .leaflet-overlay-pane svg{max-width: none !important;max-height: none !important}.leaflet-container .leaflet-marker-pane img,.leaflet-container .leaflet-shadow-pane img,.leaflet-container .leaflet-tile-pane img,.leaflet-container img.leaflet-image-layer,.leaflet-container .leaflet-tile{max-width: none !important;max-height: none !important;width: auto;padding: 0}.leaflet-container img.leaflet-tile{mix-blend-mode: plus-lighter}.leaflet-container.leaflet-touch-zoom{-ms-touch-action: pan-x pan-y;touch-action: pan-x pan-y}.leaflet-container.leaflet-touch-drag{-ms-touch-action: pinch-zoom;touch-action: none;touch-action: pinch-zoom}.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom{-ms-touch-action: none;touch-action: none}.leaflet-container{-webkit-tap-highlight-color: transparent}.leaflet-container a{-webkit-tap-highlight-color: rgba(51,181,229,0.4)}.leaflet-tile{filter: inherit;visibility: hidden}.leaflet-tile-loaded{visibility: inherit}.leaflet-zoom-box{width: 0;height: 0;-moz-box-sizing: border-box;box-sizing: border-box;z-index: 800}.leaflet-overlay-pane svg{-moz-user-select: none}.leaflet-pane{z-index: 400}.leaflet-tile-pane{z-index: 200}.leaflet-overlay-pane{z-index: 400}.leaflet-shadow-pane{z-index: 500}.leaflet-marker-pane{z-index: 600}.leaflet-tooltip-pane{z-index: 650}.leaflet-popup-pane{z-index: 700}.leaflet-map-pane canvas{z-index: 100}.leaflet-map-pane svg{z-index: 200}.leaflet-vml-shape{width: 1px;height: 1px}.leaflet-control{position: relative;z-index: 800;pointer-events: visiblePainted;pointer-events: auto}.leaflet-top,.leaflet-bottom{position: absolute;z-index: 1000;pointer-events: none}.leaflet-top{top: 0}.leaflet-right{right: 0}.leaflet-bottom{bottom: 0}.leaflet-left{left: 0}.leaflet-control{float: left;clear: both}.leaflet-right .leaflet-control{float: right}.leaflet-top .leaflet-control{margin-top: 10px}.leaflet-bottom .leaflet-control{margin-bottom: 10px}.leaflet-left .leaflet-control{margin-left: 10px}.leaflet-right .leaflet-control{margin-right: 10px}.leaflet-fade-anim .leaflet-popup{opacity: 0;-webkit-transition: opacity 0.2s linear;-moz-transition: opacity 0.2s linear;transition: opacity 0.2s linear}.leaflet-fade-anim .leaflet-map-pane .leaflet-popup{opacity: 1}.leaflet-zoom-animated{-webkit-transform-origin: 0 0;-ms-transform-origin: 0 0;transform-origin: 0 0}svg.leaflet-zoom-animated{will-change: transform}.leaflet-zoom-anim .leaflet-zoom-animated{-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);-moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);transition:         transform 0.25s cubic-bezier(0,0,0.25,1)}.leaflet-zoom-anim .leaflet-tile,.leaflet-pan-anim .leaflet-tile{-webkit-transition: none;-moz-transition: none;transition: none}.leaflet-zoom-anim .leaflet-zoom-hide{visibility: hidden}.leaflet-interactive{cursor: pointer}.leaflet-grab{cursor: -webkit-grab;cursor:    -moz-grab;cursor:         grab}.leaflet-crosshair,.leaflet-crosshair .leaflet-interactive{cursor: crosshair}.leaflet-popup-pane,.leaflet-control{cursor: auto}.leaflet-dragging .leaflet-grab,.leaflet-dragging .leaflet-grab .leaflet-interactive,.leaflet-dragging .leaflet-marker-draggable{cursor: move;cursor: -webkit-grabbing;cursor:    -moz-grabbing;cursor:         grabbing}.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-image-layer,.leaflet-pane > svg path,.leaflet-tile-container{pointer-events: none}.leaflet-marker-icon.leaflet-interactive,.leaflet-image-layer.leaflet-interactive,.leaflet-pane > svg path.leaflet-interactive,svg.leaflet-image-layer.leaflet-interactive path{pointer-events: visiblePainted;pointer-events: auto}.leaflet-container{background: #ddd;outline-offset: 1px}.leaflet-container a{color: #0078A8}.leaflet-zoom-box{border: 2px dotted #38f;background: rgba(255,255,255,0.5)}.leaflet-container{font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;font-size: 12px;font-size: 0.75rem;line-height: 1.5}.leaflet-bar{box-shadow: 0 1px 5px rgba(0,0,0,0.65);border-radius: 4px}.leaflet-bar a{background-color: #fff;border-bottom: 1px solid #ccc;width: 26px;height: 26px;line-height: 26px;display: block;text-align: center;text-decoration: none;color: black}.leaflet-bar a,.leaflet-control-layers-toggle{background-position: 50% 50%;background-repeat: no-repeat;display: block}.leaflet-bar a:hover,.leaflet-bar a:focus{background-color: #f4f4f4}.leaflet-bar a:first-child{border-top-left-radius: 4px;border-top-right-radius: 4px}.leaflet-bar a:last-child{border-bottom-left-radius: 4px;border-bottom-right-radius: 4px;border-bottom: none}.leaflet-bar a.leaflet-disabled{cursor: default;background-color: #f4f4f4;color: #bbb}.leaflet-touch .leaflet-bar a{width: 30px;height: 30px;line-height: 30px}.leaflet-touch .leaflet-bar a:first-child{border-top-left-radius: 2px;border-top-right-radius: 2px}.leaflet-touch .leaflet-bar a:last-child{border-bottom-left-radius: 2px;border-bottom-right-radius: 2px}.leaflet-control-zoom-in,.leaflet-control-zoom-out{font: bold 18px 'Lucida Console',Monaco,monospace;text-indent: 1px}.leaflet-touch .leaflet-control-zoom-in,.leaflet-touch .leaflet-control-zoom-out{font-size: 22px}.leaflet-control-layers{box-shadow: 0 1px 5px rgba(0,0,0,0.4);background: #fff;border-radius: 5px}.leaflet-touch .leaflet-control-layers-toggle{width: 44px;height: 44px}.leaflet-control-layers .leaflet-control-layers-list,.leaflet-control-layers-expanded .leaflet-control-layers-toggle{display: none}.leaflet-control-layers-expanded .leaflet-control-layers-list{display: block;position: relative}.leaflet-control-layers-expanded{padding: 6px 10px 6px 6px;color: #333;background: #fff}.leaflet-control-layers-scrollbar{overflow-y: scroll;overflow-x: hidden;padding-right: 5px}.leaflet-control-layers-selector{margin-top: 2px;position: relative;top: 1px}.leaflet-control-layers label{display: block;font-size: 13px;font-size: 1.08333em}.leaflet-control-layers-separator{height: 0;border-top: 1px solid #ddd;margin: 5px -10px 5px -6px}.leaflet-container .leaflet-control-attribution{background: #fff;background: rgba(255,255,255,0.8);margin: 0}.leaflet-control-attribution,.leaflet-control-scale-line{padding: 0 5px;color: #333;line-height: 1.4}.leaflet-control-attribution a{text-decoration: none}.leaflet-control-attribution a:hover,.leaflet-control-attribution a:focus{text-decoration: underline}.leaflet-attribution-flag{display: inline !important;vertical-align: baseline !important;width: 1em;height: 0.6669em}.leaflet-left .leaflet-control-scale{margin-left: 5px}.leaflet-bottom .leaflet-control-scale{margin-bottom: 5px}.leaflet-control-scale-line{border: 2px solid #777;border-top: none;line-height: 1.1;padding: 2px 5px 1px;white-space: nowrap;-moz-box-sizing: border-box;box-sizing: border-box;background: rgba(255,255,255,0.8);text-shadow: 1px 1px #fff}.leaflet-control-scale-line:not(:first-child){border-top: 2px solid #777;border-bottom: none;margin-top: -2px}.leaflet-control-scale-line:not(:first-child):not(:last-child){border-bottom: 2px solid #777}.leaflet-touch .leaflet-control-attribution,.leaflet-touch .leaflet-control-layers,.leaflet-touch .leaflet-bar{box-shadow: none}.leaflet-touch .leaflet-control-layers,.leaflet-touch .leaflet-bar{border: 2px solid rgba(0,0,0,0.2);background-clip: padding-box}.leaflet-popup{position: absolute;text-align: center;margin-bottom: 20px}.leaflet-popup-content-wrapper{padding: 1px;text-align: left;border-radius: 12px}.leaflet-popup-content{margin: 13px 24px 13px 20px;line-height: 1.3;font-size: 13px;font-size: 1.08333em;min-height: 1px}.leaflet-popup-content p{margin: 17px 0;margin: 1.3em 0}.leaflet-popup-tip-container{width: 40px;height: 20px;position: absolute;left: 50%;margin-top: -1px;margin-left: -20px;overflow: hidden;pointer-events: none}.leaflet-popup-tip{width: 17px;height: 17px;padding: 1px;margin: -10px auto 0;pointer-events: auto;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg)}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background: white;color: #333;box-shadow: 0 3px 14px rgba(0,0,0,0.4)}.leaflet-container a.leaflet-popup-close-button{position: absolute;top: 0;right: 0;border: none;text-align: center;width: 24px;height: 24px;font: 16px/24px Tahoma,Verdana,sans-serif;color: #757575;text-decoration: none;background: transparent}.leaflet-container a.leaflet-popup-close-button:hover,.leaflet-container a.leaflet-popup-close-button:focus{color: #585858}.leaflet-popup-scrolled{overflow: auto}.leaflet-oldie .leaflet-popup-content-wrapper{-ms-zoom: 1}.leaflet-oldie .leaflet-popup-tip{width: 24px;margin: 0 auto;-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678,M12=0.70710678,M21=-0.70710678,M22=0.70710678)";filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678,M12=0.70710678,M21=-0.70710678,M22=0.70710678)}.leaflet-oldie .leaflet-control-zoom,.leaflet-oldie .leaflet-control-layers,.leaflet-oldie .leaflet-popup-content-wrapper,.leaflet-oldie .leaflet-popup-tip{border: 1px solid #999}.leaflet-div-icon{background: #fff;border: 1px solid #666}.leaflet-tooltip{position: absolute;padding: 6px;background-color: #fff;border: 1px solid #fff;border-radius: 3px;color: #222;white-space: nowrap;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;pointer-events: none;box-shadow: 0 1px 3px rgba(0,0,0,0.4)}.leaflet-tooltip.leaflet-interactive{cursor: pointer;pointer-events: auto}.leaflet-tooltip-top:before,.leaflet-tooltip-bottom:before,.leaflet-tooltip-left:before,.leaflet-tooltip-right:before{position: absolute;pointer-events: none;border: 6px solid transparent;background: transparent;content: ""}.leaflet-tooltip-bottom{margin-top: 6px}.leaflet-tooltip-top{margin-top: -6px}.leaflet-tooltip-bottom:before,.leaflet-tooltip-top:before{left: 50%;margin-left: -6px}.leaflet-tooltip-top:before{bottom: 0;margin-bottom: -12px;border-top-color: #fff}.leaflet-tooltip-bottom:before{top: 0;margin-top: -12px;margin-left: -6px;border-bottom-color: #fff}.leaflet-tooltip-left{margin-left: -6px}.leaflet-tooltip-right{margin-left: 6px}.leaflet-tooltip-left:before,.leaflet-tooltip-right:before{top: 50%;margin-top: -6px}.leaflet-tooltip-left:before{right: 0;margin-right: -12px;border-left-color: #fff}.leaflet-tooltip-right:before{left: 0;margin-left: -12px;border-right-color: #fff}@media print{.leaflet-control{-webkit-print-color-adjust: exact;print-color-adjust: exact}}

/* 版面：手機優先。頂部一條草地色的品牌列（下緣是一排小圓弧），底部一條浮起來的圓鈕分頁；
   一朵菇一張白色圓角卡，展開後每位陸軍一格、每格 10 個位子。寬螢幕改成左邊團列表、右邊內容。
   風格：花園遊戲的介面——圓體字、膠囊鈕帶一道厚底邊、圓形頭像與圓形量表、點點分隔線、暖棕色文字配嫩綠主色。 */
:root{
  --edge:color-mix(in srgb,var(--ink) 16%,transparent);
  --bg:#FFF5E6; --bg2:#EADCF7; --surface:#FFFFFF; --sunk:#F8E8D2; --panel:#FDF2E3; --line:#EED9BD; --lip:#DDC29E; --ink:#4A3D30; --muted:#786C5D; --faint:#B0A696; --leaf:#E06C0A; --leaf-hi:#FF9632; --leaf-d:#AE4E00; --leaf-ink:#A44700; --leaf-soft:#FFE4C4; --on-leaf:#FFFFFF; --sun:#FFC933; --sun-hi:#FFDB66; --sun-d:#DC9E00; --sun-soft:#FFF1C2; --sun-ink:#855600; --on-sun:#573700; --petal:#EE5F93; --petal-soft:#FFE0EB; --petal-ink:#C5306A; --sky:#8A46D6; --warn:#E24B40; --warn-soft:#FFE2DE; --warn-ink:#BD342B; --pop:#8A46D6; --on-pop:#FFFFFF; --head1:#7038B0; --head2:#532889; --on-head:#FFFFFF; --toast:#4A3D30; --on-toast:#FFFFFF; --stem:#F6EBD3; --spot:#FFFFFF; --map-sea:#CDEAF7; --map-land:#DDF0C2; --map-shore:#9CC97E; --shadow:0 3px 0 rgb(175 135 85 / .24),0 10px 22px rgb(120 80 40 / .10); --shadow-s:0 2px 0 rgb(175 135 85 / .24); --float:rgb(90 50 20 / .2); --role-bg:#EFE2FB; --role-ink:#5E2D9C; --bat:#3E2163;
  --cap:var(--pop);
  --font-body:"Nunito","Chiron GoRound TC","Huninn","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --font-num:"Nunito","Chiron GoRound TC","Huninn","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
}
:root[data-season="garden"]{ --bg:#F1F8E6; --bg2:#DDF2FB; --sunk:#E9F3DA; --panel:#F3F9EA; --line:#DCE8C9; --lip:#C9D9B1; --leaf:#3A9E33; --leaf-hi:#52BA42; --leaf-d:#277A27; --leaf-ink:#25772A; --leaf-soft:#DDF2CC; --on-leaf:#FFFFFF; --head1:#58BE46; --head2:#3EA636; --on-head:#FFFFFF; --pop:#EE4B3A; --on-pop:#FFFFFF; --sky:#3D9BE9; --role-bg:var(--leaf-soft); --role-ink:var(--leaf-ink); --shadow:0 3px 0 rgb(125 155 85 / .22),0 10px 22px rgb(90 120 60 / .10); --shadow-s:0 2px 0 rgb(125 155 85 / .22); --float:rgb(70 100 40 / .2); }
:root[data-font="hei"]{ --font-body:"Noto Sans TC","PingFang TC","Microsoft JhengHei","Heiti TC",system-ui,sans-serif; --font-num:"Nunito","Noto Sans TC","PingFang TC","Microsoft JhengHei","Heiti TC",system-ui,sans-serif; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --bg:#18111F; --bg2:#24153D; --surface:#261B34; --sunk:#342546; --panel:#1E152B; --line:#47355F; --lip:#0D0814; --ink:#F3EDDF; --muted:#BBAED0; --faint:#7C6E93; --leaf:#E06C0A; --leaf-hi:#FF9632; --leaf-d:#964200; --leaf-ink:#FFB26B; --leaf-soft:#4A2A10; --on-leaf:#FFFFFF; --sun:#F7C02E; --sun-hi:#FFD45A; --sun-d:#B88200; --sun-soft:#40330F; --sun-ink:#FFD768; --on-sun:#4A2F00; --petal:#F0679A; --petal-soft:#4A2333; --petal-ink:#FF9CBD; --sky:#B58CFF; --warn:#E5574C; --warn-soft:#472320; --warn-ink:#FF9A90; --pop:#A56BF0; --on-pop:#FFFFFF; --head1:#4C2484; --head2:#391B66; --on-head:#FFFFFF; --toast:#F3EDDF; --on-toast:#2A2219; --stem:#E8DCC2; --spot:#F6F8F2; --map-sea:#12303A; --map-land:#2A4A2E; --map-shore:#4C7A4A; --shadow:0 3px 0 rgb(0 0 0 / .32); --shadow-s:0 2px 0 rgb(0 0 0 / .32); --float:rgb(0 0 0 / .4); --role-bg:#3A2560; --role-ink:#D8BEFF; --bat:#B79BEA; color-scheme:dark }
  :root[data-season="garden"]:not([data-theme="light"]){ --bg:#132217; --bg2:#10201F; --surface:#1D3022; --sunk:#284030; --panel:#17281B; --line:#33503A; --lip:#0C170F; --muted:#AFBCA4; --faint:#74866F; --leaf:#3A9E33; --leaf-hi:#52BA42; --leaf-d:#1F6A22; --leaf-ink:#8FE27C; --leaf-soft:#234A2B; --on-leaf:#FFFFFF; --head1:#2F8433; --head2:#256E2A; --on-head:#FFFFFF; --pop:#F05A48; --on-pop:#FFFFFF; --sky:#6DB7F2; --role-bg:var(--leaf-soft); --role-ink:var(--leaf-ink); }
}
:root[data-theme="dark"]{ --bg:#18111F; --bg2:#24153D; --surface:#261B34; --sunk:#342546; --panel:#1E152B; --line:#47355F; --lip:#0D0814; --ink:#F3EDDF; --muted:#BBAED0; --faint:#7C6E93; --leaf:#E06C0A; --leaf-hi:#FF9632; --leaf-d:#964200; --leaf-ink:#FFB26B; --leaf-soft:#4A2A10; --on-leaf:#FFFFFF; --sun:#F7C02E; --sun-hi:#FFD45A; --sun-d:#B88200; --sun-soft:#40330F; --sun-ink:#FFD768; --on-sun:#4A2F00; --petal:#F0679A; --petal-soft:#4A2333; --petal-ink:#FF9CBD; --sky:#B58CFF; --warn:#E5574C; --warn-soft:#472320; --warn-ink:#FF9A90; --pop:#A56BF0; --on-pop:#FFFFFF; --head1:#4C2484; --head2:#391B66; --on-head:#FFFFFF; --toast:#F3EDDF; --on-toast:#2A2219; --stem:#E8DCC2; --spot:#F6F8F2; --map-sea:#12303A; --map-land:#2A4A2E; --map-shore:#4C7A4A; --shadow:0 3px 0 rgb(0 0 0 / .32); --shadow-s:0 2px 0 rgb(0 0 0 / .32); --float:rgb(0 0 0 / .4); --role-bg:#3A2560; --role-ink:#D8BEFF; --bat:#B79BEA; color-scheme:dark }
:root[data-season="garden"][data-theme="dark"]{ --bg:#132217; --bg2:#10201F; --surface:#1D3022; --sunk:#284030; --panel:#17281B; --line:#33503A; --lip:#0C170F; --muted:#AFBCA4; --faint:#74866F; --leaf:#3A9E33; --leaf-hi:#52BA42; --leaf-d:#1F6A22; --leaf-ink:#8FE27C; --leaf-soft:#234A2B; --on-leaf:#FFFFFF; --head1:#2F8433; --head2:#256E2A; --on-head:#FFFFFF; --pop:#F05A48; --on-pop:#FFFFFF; --sky:#6DB7F2; --role-bg:var(--leaf-soft); --role-ink:var(--leaf-ink); }


*{box-sizing:border-box}
body{background:var(--bg) linear-gradient(180deg,var(--bg2),var(--bg) 300px) no-repeat;color:var(--ink);font-family:var(--font-body);font-size:15px;font-weight:500;line-height:1.55;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{font-size:16px}
h1,h2,h3,p,ol,ul,figure{margin:0;padding:0}
ol,ul{list-style:none}
b,strong{font-weight:700}
:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.muted{color:var(--muted)}
.num{font-variant-numeric:tabular-nums}
.nb{white-space:nowrap}
.note{font-size:13px;color:var(--muted)}
svg.ic{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.24em}
svg.ic.solid{fill:currentColor}

/* ---------- 頂部：草地色，下緣一排圓弧 ---------- */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:linear-gradient(var(--head1),var(--head2));color:var(--on-head)}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:10px;pointer-events:none;background:radial-gradient(circle at 50% 0,var(--head2) 0 9px,transparent 9.6px) 0 0/22px 10px repeat-x}
.top-in{max-width:780px;margin-inline:auto;padding-inline:16px;padding-block:8px 6px;min-height:58px;display:flex;align-items:center;gap:10px}
.brand{display:flex;align-items:center;gap:8px;margin-right:auto;min-width:0}
.brand .mark{width:34px;height:34px;flex:none;filter:drop-shadow(0 2px 0 rgb(0 0 0 / .16))}
.brand h1{font-weight:900;font-size:22px;line-height:1;letter-spacing:.06em;white-space:nowrap;text-shadow:0 2px 0 rgb(0 0 0 / .14)}
.brand h1 .en{font-family:var(--font-num);font-weight:900;font-size:14px;letter-spacing:.01em;margin-left:2px;opacity:.92}
.tag{font-size:11px;font-weight:700;line-height:1.5;padding:1px 9px;border-radius:999px;background:var(--sun);color:var(--on-sun);white-space:nowrap;box-shadow:0 2px 0 rgb(0 0 0 / .14)}
.me-chip{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--surface);color:var(--ink);border-radius:999px;padding:4px 9px 4px 4px;min-height:40px;max-width:46vw;cursor:pointer;font-weight:700;box-shadow:0 3px 0 rgb(0 0 0 / .16)}
.me-chip:active{transform:translateY(2px);box-shadow:0 1px 0 rgb(0 0 0 / .16)}
.me-chip .av{width:32px;height:32px;font-size:14px}
.me-chip .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-chip svg.ic{color:var(--muted);width:16px;height:16px}
@media (max-width:379px){ .brand h1 .en{display:none} }

/* 圓形頭像：顏色照名字固定分到八種（紅、黃、藍、紫、白、岩灰、粉紅、冰藍） */
.av{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:16px;font-weight:900;line-height:1;color:#fff;background:#8E8A84;box-shadow:inset 0 -3px 0 rgb(0 0 0 / .14)}
.av.c0{background:#E8554A} .av.c1{background:#F7C531;color:#5B3A00} .av.c2{background:#4A98E8} .av.c3{background:#8663C9}
.av.c4{background:#F1ECE0;color:#6B5B48;box-shadow:inset 0 -3px 0 rgb(0 0 0 / .1),inset 0 0 0 1px rgb(0 0 0 / .08)} .av.c5{background:#8E8A84} .av.c6{background:#F28BB6} .av.c7{background:#7FCFE6;color:#144A5C}
.pw{display:flex;align-items:center;gap:10px;min-width:0}
.pw .person{flex:1}

/* 分頁：手機是底部一條浮起來的圓鈕列，電腦在頂部 */
.nav{display:flex}
.nav button{position:relative;border:0;background:transparent;cursor:pointer;font-weight:700;display:flex;align-items:center;justify-content:center}
.nav svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.nav-i{display:grid;place-items:center}
@media (max-width:959px){
  :root{scroll-padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))}
  .nav{position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:6;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--surface);border-radius:30px;padding:8px 6px 6px;box-shadow:0 3px 0 var(--lip),0 10px 26px var(--float)}
  .nav button{flex-direction:column;gap:3px;font-size:11.5px;line-height:1.3;color:var(--muted);padding:0}
  .nav-i{width:46px;height:46px;border-radius:50%;background:var(--sunk);color:var(--muted);transition:transform .15s}
  .nav button[aria-selected="true"]{color:var(--leaf-ink);font-weight:900}
  .nav button[aria-selected="true"] .nav-i{background:linear-gradient(var(--leaf-hi),var(--leaf));color:var(--on-leaf);box-shadow:0 3px 0 var(--leaf-d);transform:translateY(-5px)}
  .nav .dot{position:absolute;top:-4px;left:calc(50% + 10px);margin:0;box-shadow:0 0 0 2px var(--surface)}
}

.wrap{max-width:780px;margin-inline:auto;padding-inline:16px;padding-block:26px calc(124px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:20px}
.stack{display:flex;flex-direction:column;gap:14px}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sec-head h2{font-size:21px;font-weight:900;line-height:1.3;display:flex;align-items:center;gap:7px}
.sec-head h2::before{content:"";width:13px;height:18px;flex:none;background:linear-gradient(140deg,var(--leaf-hi),var(--leaf));border-radius:100% 0 100% 0/100% 0 100% 0;transform:rotate(18deg)}   /* 一片葉子 */
.head-btns{display:flex;gap:8px;flex-wrap:wrap}
.foot{font-size:12px;color:var(--muted);text-align:center;padding-top:8px}
.empty-note{padding:28px 14px;color:var(--muted);text-align:center;font-weight:700}

/* ---------- 按鈕：膠囊形，下面一道厚底邊，按下去會沉 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--surface);color:var(--ink);min-height:44px;padding:0 18px;border-radius:999px;cursor:pointer;font-weight:700;white-space:nowrap;box-shadow:inset 0 0 0 2px var(--line),0 3px 0 var(--lip);transition:transform .06s,box-shadow .06s}
.btn:active{transform:translateY(2px);box-shadow:inset 0 0 0 2px var(--line),0 1px 0 var(--lip)}
.btn.primary{background:linear-gradient(var(--leaf-hi),var(--leaf));color:var(--on-leaf);box-shadow:0 3px 0 var(--leaf-d);text-shadow:0 1px 0 rgb(0 0 0 / .18)}
.btn.primary:active{box-shadow:0 1px 0 var(--leaf-d)}
.btn.tint{background:linear-gradient(var(--sun-hi),var(--sun));color:var(--on-sun);box-shadow:0 3px 0 var(--sun-d)}
.btn.tint:active{box-shadow:0 1px 0 var(--sun-d)}
.btn.sm{min-height:36px;padding:0 13px;font-size:13.5px;box-shadow:inset 0 0 0 2px var(--line),0 2px 0 var(--lip)}
.btn.sm.primary{box-shadow:0 2px 0 var(--leaf-d)}
.btn.sm.tint{box-shadow:0 2px 0 var(--sun-d)}
.btn.ghost,.btn.sm.ghost{background:transparent;color:var(--muted);box-shadow:none}
.btn.danger,.btn.sm.danger{background:var(--warn-soft);color:var(--warn-ink);box-shadow:0 2px 0 color-mix(in srgb,var(--warn) 34%,var(--warn-soft))}
.btn.wide{width:100%;min-height:48px}
.btn[aria-pressed="true"]{background:var(--leaf-soft);color:var(--leaf-ink);box-shadow:inset 0 0 0 2px var(--leaf),0 2px 0 var(--leaf)}
.btn.like[aria-pressed="true"]{background:var(--petal-soft);color:var(--petal-ink);box-shadow:inset 0 0 0 2px var(--petal),0 2px 0 var(--petal)}
.btn.want[aria-pressed="true"]{background:var(--sun-soft);color:var(--sun-ink);box-shadow:inset 0 0 0 2px var(--sun),0 2px 0 var(--sun-d)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.linkbtn{all:unset;cursor:pointer;color:var(--muted);font-size:12.5px;font-weight:700;text-decoration:underline;text-decoration-style:dotted;text-decoration-thickness:2px;text-decoration-color:var(--lip);text-underline-offset:4px;padding:6px 2px;border-radius:6px}
.linkbtn:hover{color:var(--ink)}
.linkbtn:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.q{width:26px;height:26px;border-radius:50%;border:0;background:var(--surface);color:var(--muted);font-size:13px;font-weight:900;line-height:1;cursor:pointer;display:inline-grid;place-items:center;flex:none;padding:0;font-family:var(--font-num);box-shadow:inset 0 0 0 2px var(--line),0 2px 0 var(--lip)}
.q[aria-expanded="true"]{background:var(--sun-soft);color:var(--sun-ink);box-shadow:inset 0 0 0 2px var(--sun),0 2px 0 var(--sun-d)}
.help{font-size:13px;line-height:1.7;color:var(--ink);background:var(--sun-soft);border-radius:18px;padding:10px 16px;max-width:65ch;margin:0}
.g-actions .help{flex-basis:100%}

/* 分段切換（2–3 個選項）與排序列（一排可橫向滑的膠囊） */
.tabs{display:inline-flex;background:var(--sunk);border-radius:999px;padding:4px;gap:2px}
.tabs button{border:0;background:transparent;min-height:36px;padding:0 15px;border-radius:999px;cursor:pointer;color:var(--muted);font-weight:700;white-space:nowrap}
.tabs button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 2px 0 var(--lip)}
.seg{align-self:flex-start}
.seg-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sortbar{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding:2px 16px 5px}
.sortbar::-webkit-scrollbar{display:none}
.sortbar button{flex:none;border:0;background:var(--surface);color:var(--ink);border-radius:999px;min-height:38px;padding:0 15px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;box-shadow:inset 0 0 0 2px var(--line),0 2px 0 var(--lip)}
.sortbar button[aria-pressed="true"]{background:linear-gradient(var(--leaf-hi),var(--leaf));color:var(--on-leaf);box-shadow:0 2px 0 var(--leaf-d);text-shadow:0 1px 0 rgb(0 0 0 / .18)}

/* 小標籤 */
.pill{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;line-height:1.5;padding:2px 10px;border-radius:999px;white-space:nowrap}
.pill.army{background:var(--role-bg);color:var(--role-ink)}
.pill.guest{background:var(--sunk);color:var(--muted)}
.pill.horn{background:var(--sun-soft);color:var(--sun-ink)}
.pill.out{background:var(--warn-soft);color:var(--warn-ink)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.dot{display:inline-block;min-width:20px;height:20px;line-height:20px;border-radius:10px;background:var(--pop);color:var(--on-pop);font-family:var(--font-num);font-size:12px;font-weight:900;margin-left:5px;padding:0 5px;text-align:center;vertical-align:1px}
.chip{display:inline-flex;align-items:center;background:var(--sunk);border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700;line-height:1.5}
.chip.mine{background:var(--role-bg);color:var(--role-ink)}
.chip.pick{border:0;font:inherit;font-size:13px;font-weight:700;line-height:1.5;cursor:pointer;background:var(--surface);color:var(--leaf-ink);box-shadow:inset 0 0 0 2px var(--leaf),0 2px 0 var(--leaf);min-height:34px;padding:4px 13px}
.chip.pick:active{transform:translateY(1px)}
.chip.pick.on{background:var(--leaf-soft)}

/* ---------- 表單 ---------- */
.form{background:var(--surface);border-radius:24px;box-shadow:var(--shadow);padding:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px 12px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field.wide{grid-column:1/-1}
.field label,.lbl{font-size:13px;font-weight:700;color:var(--muted)}
.field input,.field select,.add-row input,.add-row select,.newbox input,.search,.ac-proto select,.out textarea{width:100%;min-height:46px;padding:8px 14px;border:2px solid var(--line);border-radius:16px;background:var(--surface);font-weight:500;transition:border-color .12s,box-shadow .12s}
.field input:focus,.field select:focus,.add-row input:focus,.add-row select:focus,.newbox input:focus,.search:focus,.ac-proto select:focus,.out textarea:focus{outline:0;border-color:var(--leaf);box-shadow:0 0 0 4px color-mix(in srgb,var(--leaf) 22%,transparent)}
::placeholder{color:var(--faint);opacity:1}
select{appearance:none;-webkit-appearance:none;padding-right:38px!important;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 21px) 52%,calc(100% - 14px) 52%;background-size:7px 7px;background-repeat:no-repeat;cursor:pointer;font-weight:700!important}
input[type="file"]{padding:5px!important;font-size:14px;color:var(--muted);cursor:pointer}
input[type="file"]::file-selector-button{font:inherit;font-size:14px;font-weight:700;border:0;border-radius:999px;background:var(--sunk);color:var(--ink);padding:8px 16px;margin-right:10px;cursor:pointer}
.idin,.code,.locked{font-family:var(--font-num);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.code{font-size:13px;font-weight:700;white-space:nowrap}
.locked{color:var(--muted);padding:8px 0}
.hint{font-size:13px;color:var(--leaf-ink);font-weight:700}
.hint.err{color:var(--warn-ink)}
.form-actions{grid-column:1/-1;display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;padding-bottom:3px}
.form-actions .q{margin-right:auto;align-self:center}
.in-row,.add-row{display:flex;gap:6px;align-items:flex-start}
.in-row input,.add-row input,.add-row select{flex:1;min-width:0}
.in-row .btn,.add-row .btn{min-height:43px;flex:none}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:3px}
.chipbtn{border:0;background:var(--surface);color:var(--ink);border-radius:999px;min-height:44px;padding:0 18px;cursor:pointer;font-weight:700;font-size:15px;box-shadow:inset 0 0 0 2px var(--line),0 3px 0 var(--lip)}
.chipbtn[aria-pressed="true"]{background:linear-gradient(var(--leaf-hi),var(--leaf));color:var(--on-leaf);box-shadow:0 3px 0 var(--leaf-d);text-shadow:0 1px 0 rgb(0 0 0 / .18)}
.chipbtn[disabled]{opacity:.4;cursor:not-allowed}
details.more{grid-column:1/-1}
details.more summary{cursor:pointer;color:var(--muted);font-size:14px;font-weight:700;padding:4px 0}
details.more .form-in{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;padding-top:10px}
.photo-prev{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.photo-prev img{width:72px;height:72px;object-fit:cover;border-radius:14px;border:3px solid var(--surface);box-shadow:0 0 0 2px var(--line)}
.search{border-radius:999px;padding-inline:18px}
.up-btn{align-self:flex-start;cursor:pointer}

/* ---------- 開團卡 ---------- */
.group{background:var(--surface);border-radius:24px;box-shadow:var(--shadow);overflow:hidden}
.group.joined{box-shadow:0 0 0 3px var(--leaf),var(--shadow)}   /* 我有參加的團：加框 */
.g-head{width:100%;border:0;background:transparent;text-align:left;cursor:pointer;padding:14px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}
.thumb{position:relative;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--tint,var(--cap)) 14%,var(--surface)),color-mix(in srgb,var(--tint,var(--cap)) 30%,var(--surface)));display:grid;place-items:center;flex:none}
.thumb svg{width:40px;height:40px;overflow:visible;filter:drop-shadow(0 2px 0 rgb(0 0 0 / .12))}
.s-small .thumb>svg{width:30px;height:30px} .s-large .thumb>svg{width:50px;height:50px} .s-giant .thumb>svg{width:60px;height:60px}
.thumb img.cut{width:100%;height:100%;object-fit:contain;padding:5px;filter:drop-shadow(0 2px 0 rgb(0 0 0 / .14))}
.thumb:not(.has-photo)>img.cut{position:absolute;left:50%;bottom:-3px;transform:translateX(-50%);width:106%;height:106%;max-width:none;padding:0;object-position:center bottom}   /* 去背的菇站在圓底上，往上超出一點，越大型越大 */
.s-small .thumb:not(.has-photo)>img.cut{width:90%;height:90%} .s-large .thumb:not(.has-photo)>img.cut{width:114%;height:114%} .s-giant .thumb:not(.has-photo)>img.cut{width:122%;height:122%}
.thumb.has-photo{display:block;width:74px;height:74px;border-radius:18px;background:transparent}
.thumb.has-photo>img{display:block;width:74px;height:74px;max-width:none;object-fit:cover;border-radius:18px;border:3px solid var(--surface);box-shadow:0 0 0 2px var(--line),0 3px 0 var(--lip)}
.thumb .badge{position:absolute;right:-7px;bottom:-7px;width:34px;height:34px;border-radius:50%;background:var(--surface);box-shadow:0 0 0 2px var(--line),0 2px 0 var(--lip);display:grid;place-items:center;overflow:hidden}
.thumb .badge svg{width:24px;height:24px;filter:none}
.thumb .badge img.cut{padding:2px}
.thumb.lock{background:var(--sunk);color:var(--muted);font-weight:900;font-size:22px}
.g-text{display:flex;flex-direction:column;min-width:0;gap:1px}
.g-title{font-weight:900;font-size:18px;line-height:1.3;overflow-wrap:anywhere}
.g-note{font-size:14px;font-weight:700;line-height:1.4;word-break:keep-all;overflow-wrap:anywhere}
.g-meta{display:flex;flex-wrap:wrap;align-items:center;gap:3px 5px;margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--muted)}
.g-meta .who{white-space:normal;overflow-wrap:anywhere;min-width:0}
.g-meta>.nb:has(.pill){display:inline-flex}
/* 人數：圓形量表，中間是「已排／上限」 */
.g-fill{position:relative;width:58px;height:58px;flex:none;display:grid;place-items:center}
.ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:6}
.ring .trk{stroke:var(--sunk)}
.ring .arc{stroke:var(--leaf);stroke-linecap:round}
.g-fill.full .arc{stroke:var(--sun)}
.g-fill .t{position:relative;display:flex;flex-direction:column;align-items:center;gap:1px;font-family:var(--font-num);font-variant-numeric:tabular-nums}
.g-fill b{font-size:18px;font-weight:900;line-height:1}
.g-fill small{font-size:10.5px;font-weight:700;line-height:1;color:var(--muted)}
.g-body{border-top:2px dotted var(--line);padding:16px 14px 18px;display:flex;flex-direction:column;gap:14px}
.g-photo{margin:0;display:flex;flex-direction:column;gap:10px}
.g-zoom{all:unset;display:block;cursor:zoom-in;align-self:flex-start;max-width:100%;border-radius:16px;transform:rotate(-1.2deg);margin:2px 0 0 4px}
.g-zoom:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.g-photo .g-zoom img{display:block;max-height:220px;width:auto;max-width:100%;border-radius:16px;border:6px solid var(--surface);box-shadow:0 0 0 2px var(--line),0 4px 0 var(--lip),0 10px 20px var(--float)}
.g-photo.big .g-zoom{cursor:zoom-out;transform:none;margin:0}
.g-photo.big .g-zoom img{max-height:80vh}
.g-photo figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:13px}
.g-photo figcaption a,.post-coord a,.sug a{color:var(--leaf-ink);font-weight:700;text-underline-offset:3px}

.armies{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.solo .armies{grid-template-columns:minmax(0,560px)}
.army-card{background:var(--panel);border-radius:20px;padding:12px;display:flex;flex-direction:column;gap:10px;min-width:0}
.army-card.bare{background:transparent;padding:0}
.a-head{display:flex;align-items:center;gap:10px}
.a-head .pw{flex:1}
.a-count{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-size:14px;font-weight:900;color:var(--ink);background:var(--surface);border-radius:999px;padding:3px 12px;white-space:nowrap;box-shadow:0 2px 0 var(--lip)}
.none{margin:0;font-size:13px;color:var(--muted)}
.addbox{display:flex;flex-direction:column;gap:9px}
.pickers{display:flex;gap:6px}
.pickers .btn{flex:1 1 0;min-width:0;padding:0 2px;font-size:13px}
.newbox{display:flex;flex-direction:column;gap:6px;background:var(--surface);border:2px dashed var(--lip);border-radius:18px;padding:10px}
.newbox .form-actions{display:flex;gap:8px;justify-content:flex-end}
.suggest:empty{display:none}
.vacant-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;background:var(--sun-soft);border-radius:20px;padding:10px 12px 12px 16px;font-weight:700}
.vacant-row .muted{font-weight:500}
.waiting{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:13px}
.waiting .btn{margin-left:auto}
.g-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:2px}
.g-actions .btn.primary{margin-left:auto}
.mine-accts{display:flex;flex-wrap:wrap;align-items:center;gap:7px;flex-basis:100%;font-size:13px;padding-bottom:2px}
.out textarea{min-height:150px;font-size:13px;line-height:1.6;resize:vertical;background:var(--panel)}
.pane-hint{display:none}

/* ---------- 全站共用的名單：位子、選人頁、建議清單、系統名單、我的名單、最近戰友、手機帳號 ---------- */
.cp{all:unset;cursor:pointer;border-radius:6px;overflow-wrap:anywhere}
.cp:hover{background:color-mix(in srgb,var(--leaf) 16%,transparent)}
.cp:active{background:color-mix(in srgb,var(--leaf) 30%,transparent)}
.cp:focus-visible{outline:3px solid var(--sky);outline-offset:1px}
.cp.code{font-family:var(--font-num);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em;background:var(--sunk);border-radius:999px;padding:1px 9px}
.plist{background:var(--surface);border-radius:18px;overflow:hidden;margin:0;padding:0;list-style:none;box-shadow:var(--shadow-s)}
.prow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;min-height:58px;border-top:2px dotted var(--line)}
.prow.no-n{grid-template-columns:minmax(0,1fr) auto}
.plist>.prow:first-child{border-top-width:0}
.prow.mine{background:var(--leaf-soft)}
.prow.rest{min-height:44px;font-size:13px}
.p-n{width:22px;height:22px;border-radius:50%;background:var(--sunk);display:grid;place-items:center;font-family:var(--font-num);font-size:12px;font-weight:900;color:var(--muted);font-variant-numeric:tabular-nums}
.prow.mine .p-n{background:var(--surface);color:var(--leaf-ink)}
.person{display:flex;flex-direction:column;min-width:0;gap:3px;line-height:1.4;text-align:left}
.p-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 5px}
.p-name,.cp.p-name{font-weight:900;font-size:15.5px;overflow-wrap:anywhere}
.p-note{font-size:12px;color:var(--muted);font-weight:500}
.p-line{display:flex;flex-wrap:wrap;align-items:center;gap:3px 8px;font-size:13px;color:var(--muted)}
.p-sub{overflow-wrap:anywhere}
.p-id,.cp.p-id{font-family:var(--font-num);font-weight:700;font-size:12.5px;font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap;color:var(--ink);background:color-mix(in srgb,var(--ink) 8%,transparent);border-radius:999px;padding:1px 8px}
.p-dot{display:none}
.p-acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end}
.p-st{font-size:13px;font-weight:700;color:var(--muted);white-space:nowrap;display:inline-flex;align-items:center}
button.prow[data-act="phone-switch"] .p-st{color:var(--leaf-ink)}
.flaggers{font-size:11px;color:var(--warn-ink);max-width:9em;text-align:right;overflow-wrap:anywhere}
.p-sec{padding:6px 14px;font-size:12px;font-weight:900;color:var(--muted);background:var(--sunk);border-top:2px dotted var(--line);display:flex;align-items:center;gap:4px}
.plist>.p-sec:first-child{border-top:0}
.p-sec+.prow{border-top-width:0}
/* 圖示鈕（上移、下移、移出、最愛）：圓的 */
.x{border:0;background:transparent;cursor:pointer;color:var(--muted);width:36px;height:36px;border-radius:50%;display:inline-grid;place-items:center;font-size:18px;line-height:1;padding:0;flex:none}
.x svg.ic{width:18px;height:18px}
.x:hover{background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink)}
.x:active{transform:scale(.9)}
.x[data-act="kick"]:hover,.x[data-act="leave"]:hover{color:var(--warn-ink)}
.x[aria-pressed="true"]{color:var(--sun)}
.p-sec svg.ic,.p-st svg.ic{color:var(--sun);width:15px;height:15px}
.x[disabled]{opacity:.25;cursor:default;background:transparent;color:var(--muted);transform:none}
/* 位子清單排緊一點：第一行 LINE 暱稱＋皮克敏暱稱，第二行 ID */
.prow.acts-row{gap:8px;padding-inline:10px 6px}
.prow.acts-row .person{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:3px 8px}
.prow.acts-row .p-top,.prow.acts-row .p-line{display:contents}
.prow.acts-row .p-sub:not(.p-id){font-size:13px;color:var(--muted)}
.prow.acts-row .p-dot{display:block;flex-basis:100%;height:0;overflow:hidden}
.prow.acts-row .p-acts{flex-wrap:nowrap;gap:0}
.prow.acts-row .x{width:30px}
button.prow{width:100%;background:transparent;border:0;border-top:2px dotted var(--line);font:inherit;color:inherit;cursor:pointer}
button.prow:hover:not([disabled]){background:var(--panel)}
button.prow[aria-pressed="true"]{background:var(--leaf-soft)}
button.prow[disabled]{opacity:.5;cursor:not-allowed}
button.prow:focus-visible{outline:3px solid var(--sky);outline-offset:-3px}
button.prow.rest{color:var(--leaf-ink);font-weight:700;font-size:14px}
.pk-check{width:26px;height:26px;border-radius:50%;border:2px solid var(--lip);background:var(--surface);display:grid;place-items:center;font-weight:900;font-size:14px;color:var(--on-leaf);line-height:1;justify-self:start}
button.prow[aria-pressed="true"] .pk-check{background:linear-gradient(var(--leaf-hi),var(--leaf));border-color:var(--leaf-d)}
@media (max-width:560px){
  .prow.stack{grid-template-columns:auto minmax(0,1fr)}
  .prow.stack.no-n{grid-template-columns:minmax(0,1fr)}
  .prow.stack .p-acts{grid-column:1/-1;justify-content:flex-start;padding-bottom:2px}
  .prow.stack .p-acts:has(>.x:first-child){gap:2px;margin:-4px 0 -6px 40px}
  .prow:not(.stack):not(.acts-row) .p-acts{flex-direction:column;align-items:flex-end;gap:1px}
}

/* ---------- 美片：像一張張明信片 ---------- */
.gal-bar{display:flex;align-items:center;gap:10px;min-width:0}
.gal-bar .gview{flex:none}
.gal-bar .sortbar{flex:1;min-width:0;margin-left:0;padding-left:2px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.post{background:var(--surface);border-radius:24px;box-shadow:var(--shadow);padding:8px;display:flex;flex-direction:column;min-width:0}
.post.open{grid-column:1/-1}
.post-img{all:unset;display:block;cursor:zoom-in;width:100%;aspect-ratio:4/3;background:var(--sunk);border-radius:18px;overflow:hidden}
.post-img img{display:block;width:100%;height:100%;object-fit:cover}
.post.open .post-img{aspect-ratio:auto;cursor:zoom-out}
.post.open .post-img img{height:auto;max-height:80vh;object-fit:contain}
.post-img:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.post-body{padding:12px 8px 8px;display:flex;flex-direction:column;gap:6px}
.post-title{font-weight:900;font-size:17px;line-height:1.35;overflow-wrap:anywhere;order:-2}
.post-meta{order:-1;margin-top:-4px}
.post-coord{display:flex;flex-wrap:wrap;align-items:center;gap:2px 12px;font-size:13px}
.post-coord:empty{display:none}
.post-meta,.wants{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.post-acts{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:4px 0 3px}
.post-acts .btn{font-family:var(--font-num),var(--font-body)}
.sug{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px;background:var(--sun-soft);color:var(--ink);border-radius:18px;padding:10px 12px 12px}
.admin-bar{background:var(--sun-soft);color:var(--sun-ink);border-radius:18px;padding:10px 12px 12px 16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;font-size:13px;font-weight:700}
#gal-note{color:var(--ink)}

/* 地圖模式 */
.gal-split,.gal-side{display:flex;flex-direction:column;gap:12px;min-width:0}
#gal-mapwrap{position:relative;border:4px solid var(--surface);border-radius:26px;overflow:hidden;background:var(--map-sea);box-shadow:var(--shadow)}
#gal-map{height:min(52vh,460px);min-height:280px;background:var(--map-sea);font:inherit;z-index:0}
.map-msg{position:absolute;inset:0;display:grid;place-items:center;padding:16px;text-align:center;color:var(--muted);font-weight:700;z-index:1}
.leaflet-container .map-land{fill:var(--map-land);fill-opacity:1;stroke:var(--map-shore);stroke-width:1.5}
.leaflet-container a{color:var(--leaf-ink)}
.leaflet-bar{border:0!important;border-radius:18px!important;overflow:hidden;box-shadow:0 3px 0 var(--lip),0 4px 10px var(--float)!important}
.leaflet-bar a,.leaflet-bar a:hover{background:var(--surface);color:var(--ink);border-bottom:2px dotted var(--line);width:38px;height:38px;line-height:38px;font-weight:900}
.leaflet-bar a:last-child{border-bottom:0}
.leaflet-bar a.leaflet-disabled{background:var(--sunk);color:var(--faint)}
.leaflet-container .leaflet-control-attribution{background:color-mix(in srgb,var(--surface) 82%,transparent);color:var(--muted);font-size:10px;border-radius:10px 0 0 0}
.pin-wrap{background:none;border:0}
.pin{position:relative;display:block;width:44px;height:44px;cursor:pointer}
.leaflet-container .leaflet-marker-pane .pin img{display:block;width:44px;height:44px;border-radius:50%;object-fit:cover;border:3px solid var(--surface);box-shadow:0 3px 0 rgb(0 0 0 / .22),0 4px 8px rgb(0 0 0 / .2);background:var(--sunk)}
.pin b{position:absolute;top:48px;left:50%;transform:translateX(-50%);max-width:110px;padding:0 8px;border-radius:999px;background:var(--surface);color:var(--ink);font-size:11px;font-weight:900;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 2px 0 rgb(0 0 0 / .14)}
.pin i{position:absolute;top:-6px;right:-8px;min-width:24px;height:24px;padding:0 5px;border-radius:12px;background:var(--pop);color:var(--on-pop);border:2px solid var(--surface);font-family:var(--font-num);font-style:normal;font-size:12px;font-weight:900;line-height:20px;text-align:center}
.leaflet-container .leaflet-marker-pane .pin.many img{box-shadow:5px -3px 0 -1px var(--surface),5px -3px 0 1px var(--line),0 3px 0 rgb(0 0 0 / .22)}
.leaflet-container .leaflet-marker-pane .pin.on img{border-color:var(--leaf);box-shadow:0 0 0 4px color-mix(in srgb,var(--leaf) 35%,transparent),0 3px 0 rgb(0 0 0 / .22)}
.pin.on b{background:var(--leaf);color:var(--on-leaf)}
.leaflet-marker-icon:focus-visible .pin img{outline:3px solid var(--sky);outline-offset:2px}
.map-bar{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:13px;font-weight:700;color:var(--muted)}
.map-bar .linkbtn{margin-left:auto}
.map-on .gallery{grid-template-columns:minmax(0,1fr)}
.map-on .post:not(.open){flex-direction:row}
.map-on .post:not(.open) .post-img{width:96px;flex:none;aspect-ratio:auto;align-self:stretch;min-height:96px}
.map-on .post:not(.open) .post-body{flex:1;min-width:0;padding:6px 6px 6px 12px}

/* ---------- 設定、帳號、選人頁 ---------- */
.me-card{background:var(--surface);border-radius:24px;box-shadow:var(--shadow);padding:18px;display:flex;flex-direction:column;gap:12px}
.me-card h3{font-size:16px;font-weight:900}
.me-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.skins{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:3px}
.shrooms{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:14px 6px}
.shrooms figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.shrooms figcaption{font-size:12px;font-weight:700;text-align:center;line-height:1.3}

.picker{position:fixed;inset:0;z-index:20;background:var(--bg);display:flex;flex-direction:column}
.pk-top,.pk-list,.pk-bar{width:100%;max-width:780px;margin-inline:auto;padding-inline:16px}
.pk-top{padding-block:calc(12px + env(safe-area-inset-top,0px)) 14px;display:flex;flex-direction:column;gap:10px;background:var(--surface);border-bottom:2px dotted var(--line)}
.pk-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:2px}
.pk-head h2{font-size:20px;font-weight:900;flex:1;min-width:0}
.pk-list{flex:1;min-height:0;overflow-y:auto;padding-block:16px;display:flex;flex-direction:column;gap:10px}
.pk-list>*{flex:none}
.picker>.pk-list:last-child{padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.pk-bar{padding-block:10px calc(13px + env(safe-area-inset-bottom,0px));display:flex;gap:8px;justify-content:flex-end;border-top:2px dotted var(--line);background:var(--surface)}
.pk-bar .btn.primary{min-width:140px;margin-left:auto}
.ac-body{gap:12px}
.ac-sec{display:flex;flex-direction:column;gap:10px}
.ac-h{font-size:13px;font-weight:700;color:var(--muted);display:flex;align-items:center;gap:6px;margin-top:6px}
.ac-choice{display:flex;flex-direction:column;gap:3px;width:100%;text-align:left;padding:16px 18px;border:0;border-radius:20px;background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;box-shadow:inset 0 0 0 2px var(--line),0 3px 0 var(--lip)}
.ac-choice:active{transform:translateY(2px);box-shadow:inset 0 0 0 2px var(--line),0 1px 0 var(--lip)}
.ac-choice b{font-size:16px;font-weight:900}
.ac-choice span,.ac-opt span{font-size:13px;color:var(--muted);line-height:1.6}
.ac-opt{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:16px 18px 18px;border-radius:20px;background:var(--surface);box-shadow:var(--shadow-s)}
.ac-proto{display:flex;flex-direction:column;gap:6px;margin-top:16px;padding-top:14px;border-top:2px dotted var(--lip);font-size:12px;font-weight:700;color:var(--muted)}
.ac-proto select{max-width:100%;font-size:15px}

#toast{position:fixed;left:16px;right:16px;margin-inline:auto;width:fit-content;bottom:calc(108px + env(safe-area-inset-bottom,0px));background:var(--toast);color:var(--on-toast);padding:10px 20px;border-radius:999px;font-size:14px;font-weight:700;z-index:30;max-width:calc(100% - 32px);text-align:center;box-shadow:0 3px 0 rgb(0 0 0 / .25),0 8px 20px rgb(0 0 0 / .2);animation:toast-in .22s cubic-bezier(.3,1.5,.5,1)}
@keyframes toast-in{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ *{animation:none!important;transition:none!important} }

/* ---------- 電腦版：左邊團列表、右邊內容；名單多欄；選人頁變置中視窗 ---------- */
@media (min-width:960px){
  .wrap,.top-in{max-width:1180px}
  .wrap{padding-block:32px 56px}
  .top-in{min-height:66px}
  .me-chip{order:1}
  .nav{background:rgb(255 255 255 / .22);border-radius:999px;padding:4px;gap:2px}
  .nav button{gap:6px;min-height:38px;padding:0 15px;border-radius:999px;color:var(--on-head)}
  .nav svg{width:19px;height:19px}
  .nav button[aria-selected="true"]{background:var(--surface);color:var(--ink);box-shadow:0 2px 0 rgb(0 0 0 / .16)}
  .nav button[aria-selected="true"] svg{color:var(--leaf-ink)}
  .sortbar,.gal-bar .sortbar{margin-inline:0;padding-inline:2px;flex-wrap:wrap}
  #toast{bottom:28px}
  .armies{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
  #groups{display:grid;grid-template-columns:360px minmax(0,1fr);column-gap:18px;row-gap:0;align-items:start}
  #groups>.group{grid-column:1;margin-bottom:14px}
  #groups>.empty-note{grid-column:1/-1}
  #groups>.group.is-open{display:contents}
  #groups>.group.is-open>.g-head{grid-column:1;margin-bottom:14px;background:var(--sun-soft);border-radius:24px;box-shadow:0 0 0 3px var(--sun),var(--shadow)}
  #groups>.group.joined.is-open>.g-head{box-shadow:0 0 0 3px var(--leaf),var(--shadow)}
  #groups>.group.is-open>.g-body,#groups>.pane-hint{grid-column:2;grid-row:1/span 60;background:var(--surface);border:0;border-radius:24px;box-shadow:var(--shadow)}
  #groups>.group.is-open>.g-body{padding:20px}
  #groups>.pane-hint{display:block;padding:56px 20px;text-align:center;color:var(--muted);font-weight:700;box-shadow:none;background:transparent;border:2px dashed var(--lip)}
  #roster.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}
  #roster.plist>.prow{border-top-width:0;border-bottom:2px dotted var(--line);border-right:2px dotted var(--line)}
  #roster.plist>.empty-note,#roster.plist>.p-sec{grid-column:1/-1}
  .form,.me-card{max-width:820px}
  .picker{background:rgb(30 40 20 / .5);align-items:center;justify-content:center;padding:24px}
  .picker>.pk-top,.picker>.pk-list,.picker>.pk-bar{max-width:560px;margin-inline:0}
  .picker>.pk-list{background:var(--bg)}
  .picker>.pk-top{border-radius:26px 26px 0 0;padding-top:18px}
  .picker>.pk-bar{border-radius:0 0 26px 26px}
  .picker>.pk-list{flex:0 1 auto;max-height:60vh}
  .picker>.pk-list:last-child{border-radius:0 0 26px 26px}
  .map-on .gal-split{display:grid;grid-template-columns:minmax(0,1fr) 400px;align-items:start;gap:18px}
  #gal-map{height:min(72vh,680px);min-height:420px}
  .map-on .gal-side{max-height:min(72vh,680px);min-height:420px;overflow:auto;padding:4px 6px 8px 4px}
}

/* ---------- 當月主題：萬聖節（南瓜橘＋紫；南瓜燈、蝙蝠、蠟燭）。data-season="garden" 時回到平常的花園版 ---------- */
:root:not([data-season="garden"]) .top{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 64'%3E%3Cpath d='M24 9l-2.5-5 .8 5.5C17 6 9 6 1 9c3 1.5 4.5 4 4.5 7 2-2 4.5-2 6.5 0 1-2 3-3 5.5-2 1 3.5 3.5 6 6.5 6s5.5-2.5 6.5-6c2.500-1 4.5 0 5.5 2 2-2 4.500-2 6.500 0 0-3 1.500-5.500 4.500-7-8-3-16-3-21.300.5l.8-5.500z' transform='translate(96 8) rotate(-8) scale(0.95)' fill='%232A1150' opacity='0.5'/%3E%3Cpath d='M24 9l-2.5-5 .8 5.5C17 6 9 6 1 9c3 1.5 4.5 4 4.5 7 2-2 4.5-2 6.5 0 1-2 3-3 5.5-2 1 3.5 3.5 6 6.5 6s5.5-2.5 6.5-6c2.500-1 4.5 0 5.5 2 2-2 4.500-2 6.500 0 0-3 1.500-5.500 4.500-7-8-3-16-3-21.300.5l.8-5.500z' transform='translate(168 30) rotate(10) scale(0.6)' fill='%232A1150' opacity='0.45'/%3E%3Cpath d='M24 9l-2.5-5 .8 5.5C17 6 9 6 1 9c3 1.5 4.5 4 4.5 7 2-2 4.5-2 6.5 0 1-2 3-3 5.5-2 1 3.5 3.5 6 6.5 6s5.5-2.5 6.5-6c2.500-1 4.5 0 5.5 2 2-2 4.500-2 6.500 0 0-3 1.500-5.500 4.500-7-8-3-16-3-21.300.5l.8-5.500z' transform='translate(206 6) rotate(6) scale(0.75)' fill='%232A1150' opacity='0.5'/%3E%3Cpath d='M24 9l-2.5-5 .8 5.5C17 6 9 6 1 9c3 1.5 4.5 4 4.5 7 2-2 4.5-2 6.5 0 1-2 3-3 5.5-2 1 3.5 3.5 6 6.5 6s5.5-2.5 6.5-6c2.500-1 4.5 0 5.5 2 2-2 4.500-2 6.500 0 0-3 1.500-5.500 4.500-7-8-3-16-3-21.300.5l.8-5.500z' transform='translate(34 34) rotate(-14) scale(0.5)' fill='%232A1150' opacity='0.4'/%3E%3Cpath d='M232 12a12 12 0 1 0 13 17 10 10 0 0 1-13-17z' fill='%23FFE066' opacity='.9'/%3E%3Ccircle cx='70' cy='12' r='1.3' fill='%23FFE066' opacity='.75'/%3E%3Ccircle cx='150' cy='10' r='1' fill='%23FFE066' opacity='.75'/%3E%3Ccircle cx='268' cy='40' r='1.2' fill='%23FFE066' opacity='.75'/%3E%3Ccircle cx='18' cy='14' r='1' fill='%23FFE066' opacity='.75'/%3E%3Ccircle cx='128' cy='50' r='1.1' fill='%23FFE066' opacity='.75'/%3E%3Ccircle cx='190' cy='52' r='0.9' fill='%23FFE066' opacity='.75'/%3E%3Ccircle cx='290' cy='44' r='1' fill='%23FFE066' opacity='.75'/%3E%3C/svg%3E") center/auto 82% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 64'%3E%3Cpolygon points='0.0,0.0 36.8,0.0 32.0,32.1 0.0,29.6' fill='%23fff' fill-opacity='0.04'/%3E%3Cpolygon points='36.8,0.0 73.7,0.0 71.7,30.8 32.0,32.1' fill='%23000' fill-opacity='0.1'/%3E%3Cpolygon points='73.7,0.0 122.7,0.0 112.3,24.6 71.7,30.8' fill='%23000' fill-opacity='0.04'/%3E%3Cpolygon points='122.7,0.0 152.3,0.0 158.6,37.9 112.3,24.6' fill='%23fff' fill-opacity='0.04'/%3E%3Cpolygon points='152.3,0.0 200.6,0.0 193.2,27.0 158.6,37.9' fill='%23FFB3F0' fill-opacity='0.1'/%3E%3Cpolygon points='200.6,0.0 240.0,0.0 240.0,34.3 193.2,27.0' fill='%23fff' fill-opacity='0.1'/%3E%3Cpolygon points='0.0,29.6 32.0,32.1 48.1,64.0 0.0,64.0' fill='%23FFB3F0' fill-opacity='0.1'/%3E%3Cpolygon points='32.0,32.1 71.7,30.8 81.4,64.0 48.1,64.0' fill='%23000' fill-opacity='0.1'/%3E%3Cpolygon points='71.7,30.8 112.3,24.6 118.1,64.0 81.4,64.0' fill='%23FFB3F0' fill-opacity='0.1'/%3E%3Cpolygon points='112.3,24.6 158.6,37.9 168.6,64.0 118.1,64.0' fill='%237FD3FF' fill-opacity='0.09'/%3E%3Cpolygon points='158.6,37.9 193.2,27.0 191.8,64.0 168.6,64.0' fill='%23fff' fill-opacity='0.04'/%3E%3Cpolygon points='193.2,27.0 240.0,34.3 240.0,64.0 191.8,64.0' fill='%23fff' fill-opacity='0.1'/%3E%3Cg fill='none' stroke='%231E0B3A' stroke-opacity='.42' stroke-width='1.3'%3E%3Cpolygon points='0.0,0.0 36.8,0.0 32.0,32.1 0.0,29.6'/%3E%3Cpolygon points='36.8,0.0 73.7,0.0 71.7,30.8 32.0,32.1'/%3E%3Cpolygon points='73.7,0.0 122.7,0.0 112.3,24.6 71.7,30.8'/%3E%3Cpolygon points='122.7,0.0 152.3,0.0 158.6,37.9 112.3,24.6'/%3E%3Cpolygon points='152.3,0.0 200.6,0.0 193.2,27.0 158.6,37.9'/%3E%3Cpolygon points='200.6,0.0 240.0,0.0 240.0,34.3 193.2,27.0'/%3E%3Cpolygon points='0.0,29.6 32.0,32.1 48.1,64.0 0.0,64.0'/%3E%3Cpolygon points='32.0,32.1 71.7,30.8 81.4,64.0 48.1,64.0'/%3E%3Cpolygon points='71.7,30.8 112.3,24.6 118.1,64.0 81.4,64.0'/%3E%3Cpolygon points='112.3,24.6 158.6,37.9 168.6,64.0 118.1,64.0'/%3E%3Cpolygon points='158.6,37.9 193.2,27.0 191.8,64.0 168.6,64.0'/%3E%3Cpolygon points='193.2,27.0 240.0,34.3 240.0,64.0 191.8,64.0'/%3E%3C/g%3E%3C/svg%3E") 0 0/auto 100% repeat-x,linear-gradient(var(--head1),var(--head2))}   /* 夜空（月亮、蝙蝠、星星）疊在彩繪玻璃格子上 */
:root:not([data-season="garden"]) .sec-head h2::before{width:25px;height:23px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 58'%3E%3Cpath d='M29 12c-1-5 1-9 6-10l3 3c-3 1-4 4-3 8z' fill='%235E8C31'/%3E%3Cellipse cx='32' cy='35' rx='28' ry='21' fill='%23F0801A'/%3E%3Cellipse cx='32' cy='35' rx='16' ry='21' fill='%23FF9A36'/%3E%3Cpath d='M32 14v42M18.5 17c-6 10-6 26 0 36M45.5 17c6 10 6 26 0 36' fill='none' stroke='%23D26400' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='M16 30l9-6 2 10zM48 30l-9-6-2 10zM32 33l-3.5 5h7z' fill='%23FFE066' stroke='%238A4300' stroke-width='1' stroke-linejoin='round'/%3E%3Cpath d='M14 40l5 1 3-3 5 4 5-4 5 4 5-4 3 3 5-1c-4 9-11 12-18 12s-14-3-18-12z' fill='%23FFE066' stroke='%238A4300' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;border-radius:0;transform:none}
.deco{display:flex;justify-content:center;margin-top:10px}
.deco svg{width:min(100%,340px);height:auto;overflow:visible}
:root[data-season="garden"] .deco{display:none}
:root:not([data-season="garden"]) .brand .mark{--cap:#FF9632;--spot:#8A46D6}
/* 每一頁標題前的小圖：開團＝南瓜燈、美片＝彩繪玻璃的彎月、名單＝糖果、設定＝蠟燭 */
:root:not([data-season="garden"]) #view-gallery .sec-head h2::before{width:24px;height:25px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 62'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M30 3A27 27 0 1 0 55 41 22 22 0 0 1 30 3z'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23m)'%3E%3Cpolygon points='0,0 26,0 20,22 0,18' fill='%23FFD23F'/%3E%3Cpolygon points='26,0 60,0 60,16 20,22' fill='%23FF9F1C'/%3E%3Cpolygon points='0,18 20,22 16,40 0,44' fill='%23FFF1B8'/%3E%3Cpolygon points='20,22 60,16 60,38 16,40' fill='%23F77F00'/%3E%3Cpolygon points='0,44 16,40 24,60 0,60' fill='%23FFD23F'/%3E%3Cpolygon points='16,40 60,38 60,60 24,60' fill='%23FFF1B8'/%3E%3Cpath d='M26 0L20 22 16 40 24 60M0 18L20 22 60 16M0 44L16 40 60 38' fill='none' stroke='%232B1A12' stroke-width='1.8'/%3E%3C/g%3E%3Cpath d='M30 3A27 27 0 1 0 55 41 22 22 0 0 1 30 3z' fill='none' stroke='%232B1A12' stroke-width='2.6' stroke-linejoin='round'/%3E%3C/svg%3E")}
:root:not([data-season="garden"]) #view-roster .sec-head h2::before{width:34px;height:17px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath d='M20 15L5 4c-2.500 3-2.500 7-.5 11-2 4-2 8 .5 11z' fill='%23FF9632' stroke='%237A3A00' stroke-linejoin='round'/%3E%3Cpath d='M40 15L55 4c2.500 3 2.500 7 .5 11 2 4 2 8-.5 11z' fill='%23FF9632' stroke='%237A3A00' stroke-linejoin='round'/%3E%3Cellipse cx='30' cy='15' rx='13' ry='11' fill='%238A46D6' stroke='%233E2163'/%3E%3Cpath d='M24 5.500c2.500 6 2.500 13 0 19M30 4c2.500 7 2.500 15 0 22M36 5.500c2.500 6 2.500 13 0 19' fill='none' stroke='%23FFD23F' stroke-width='2.200' stroke-linecap='round'/%3E%3Cpath d='M9 9l5 6-5 6M51 9l-5 6 5 6' fill='none' stroke='%237A3A00' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E")}
:root:not([data-season="garden"]) #view-settings .sec-head h2::before{width:12px;height:27px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 50'%3E%3Ccircle cx='11' cy='10' r='9' fill='%23FFD84D' opacity='.3'/%3E%3Cpath d='M11 2c3 4 4.5 6.5 4.5 9a4.5 4.5 0 0 1-9 0c0-2.500 1.500-5 4.500-9z' fill='%23FFA726'/%3E%3Cpath d='M11 7c1.5 2 2.2 3.300 2.200 4.600a2.200 2.200 0 0 1-4.400 0c0-1.300.7-2.600 2.200-4.600z' fill='%23FFF3A6'/%3E%3Cpath d='M11 14.500v4' stroke='%235B4636' stroke-width='1.4' stroke-linecap='round'/%3E%3Crect x='4' y='18' width='14' height='30' rx='3' fill='%23FBF1DC' stroke='%23D9C7A3'/%3E%3Cpath d='M4 21c0-2 1.5-3 3-3h8c1.500 0 3 1 3 3v3c0 2-2.500 2-2.500 0s-2.500-2-2.500 1v3c0 2-3 2-3 0v-4c0-2-2.500-2-2.500 0v1c0 2-3.500 2-3.500 0z' fill='%23fff' stroke='%23D9C7A3' stroke-width='.8'/%3E%3C/svg%3E")}
:root:not([data-season="garden"]) .empty-note::before{content:"";display:block;width:104px;height:28px;margin:0 auto 10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 34'%3E%3Cg transform='translate(2 2) rotate(-8 30 15)'%3E%3Cpath d='M20 15L5 4c-2.500 3-2.500 7-.5 11-2 4-2 8 .5 11z' fill='%23FF9632' stroke='%237A3A00' stroke-linejoin='round'/%3E%3Cpath d='M40 15L55 4c2.500 3 2.500 7 .5 11 2 4 2 8-.5 11z' fill='%23FF9632' stroke='%237A3A00' stroke-linejoin='round'/%3E%3Cellipse cx='30' cy='15' rx='13' ry='11' fill='%238A46D6' stroke='%233E2163'/%3E%3Cpath d='M24 5.500c2.500 6 2.500 13 0 19M30 4c2.500 7 2.500 15 0 22M36 5.500c2.500 6 2.500 13 0 19' fill='none' stroke='%23FFD23F' stroke-width='2.200' stroke-linecap='round'/%3E%3Cpath d='M9 9l5 6-5 6M51 9l-5 6 5 6' fill='none' stroke='%237A3A00' stroke-width='1' stroke-linecap='round'/%3E%3C/g%3E%3Cg transform='translate(68 2) rotate(8 30 15)'%3E%3Cpath d='M20 15L5 4c-2.500 3-2.500 7-.5 11-2 4-2 8 .5 11z' fill='%23B48AF0' stroke='%237A3A00' stroke-linejoin='round'/%3E%3Cpath d='M40 15L55 4c2.500 3 2.500 7 .5 11 2 4 2 8-.5 11z' fill='%23B48AF0' stroke='%237A3A00' stroke-linejoin='round'/%3E%3Cellipse cx='30' cy='15' rx='13' ry='11' fill='%23F0801A' stroke='%237A3A00'/%3E%3Cpath d='M24 5.500c2.500 6 2.500 13 0 19M30 4c2.500 7 2.500 15 0 22M36 5.500c2.500 6 2.500 13 0 19' fill='none' stroke='%23FFFFFF' stroke-width='2.200' stroke-linecap='round'/%3E%3Cpath d='M9 9l5 6-5 6M51 9l-5 6 5 6' fill='none' stroke='%237A3A00' stroke-width='1' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}

/* 正式版：還沒拿到資料、還沒有帳號時先不顯示內容；送出中游標轉圈 */
.loading main,.loading .nav,.no-acct main,.no-acct .nav{visibility:hidden}
.busy,.busy button{cursor:progress}
#gate{z-index:40}
.gate-brand{display:flex;align-items:center;gap:8px}.gate-brand .mark{width:30px;height:30px;flex:none;--cap:#FF9632;--spot:#FFFFFF;--stem:#F6EBD3}.gate-brand .en{font-size:.62em;opacity:.8;font-family:Nunito,sans-serif;font-weight:900}